diff --git a/hshassets/assets/sass/_init.scss b/hshassets/assets/sass/_init.scss
index 957a7d9427127f63ac3a61e88a3d5e51cbd3604f..228cacd736140157d147799f3325ca433aa2c454 100644
--- a/hshassets/assets/sass/_init.scss
+++ b/hshassets/assets/sass/_init.scss
@@ -2,7 +2,7 @@
$dark: rgb(87, 82, 80);
// and now the awesome libraries
-@import 'lib/bulma-0.5.0/bulma.sass';
+@import 'lib/bulma-0.5.1/bulma.sass';
@import 'lib/font-awesome-4.7.0/scss/font-awesome.scss';
@import 'lib/animate.css-3.5.2/animate.scss';
diff --git a/hshassets/assets/sass/breadcrumbs.scss b/hshassets/assets/sass/breadcrumbs.scss
index 060c23bf98e4c265e8ce782ffb32aeed5c0f997a..dec1f32aedd9168f2ad261140d9b734229ff93c1 100644
--- a/hshassets/assets/sass/breadcrumbs.scss
+++ b/hshassets/assets/sass/breadcrumbs.scss
@@ -1,5 +1,5 @@
-@import 'lib/bulma-0.5.0/sass/utilities/variables.sass';
-@import 'lib/bulma-0.5.0/sass/utilities/mixins.sass';
+@import 'lib/bulma-0.5.1/sass/utilities/variables.sass';
+@import 'lib/bulma-0.5.1/sass/utilities/mixins.sass';
div.breadcrumb-wrapper {
box-shadow: 0 2px 3px rgba(10, 10, 10, 0.1);
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/css/bulma.css.map b/hshassets/assets/sass/lib/bulma-0.5.0/css/bulma.css.map
deleted file mode 100644
index 01c96fb60eccd64b2255bae211090453212e9b18..0000000000000000000000000000000000000000
--- a/hshassets/assets/sass/lib/bulma-0.5.0/css/bulma.css.map
+++ /dev/null
@@ -1,54 +0,0 @@
-{
- "version": 3,
- "file": "bulma.css",
- "sources": [
- "../bulma.sass",
- "../sass/utilities/_all.sass",
- "../sass/utilities/initial-variables.sass",
- "../sass/utilities/functions.sass",
- "../sass/utilities/derived-variables.sass",
- "../sass/utilities/animations.sass",
- "../sass/utilities/mixins.sass",
- "../sass/utilities/controls.sass",
- "../sass/base/_all.sass",
- "../sass/base/minireset.sass",
- "../sass/base/generic.sass",
- "../sass/base/helpers.sass",
- "../sass/elements/_all.sass",
- "../sass/elements/box.sass",
- "../sass/elements/button.sass",
- "../sass/elements/content.sass",
- "../sass/elements/form.sass",
- "../sass/elements/icon.sass",
- "../sass/elements/image.sass",
- "../sass/elements/notification.sass",
- "../sass/elements/progress.sass",
- "../sass/elements/table.sass",
- "../sass/elements/tag.sass",
- "../sass/elements/title.sass",
- "../sass/elements/other.sass",
- "../sass/components/_all.sass",
- "../sass/components/breadcrumb.sass",
- "../sass/components/card.sass",
- "../sass/components/dropdown.sass",
- "../sass/components/level.sass",
- "../sass/components/media.sass",
- "../sass/components/menu.sass",
- "../sass/components/message.sass",
- "../sass/components/modal.sass",
- "../sass/components/nav.sass",
- "../sass/components/navbar.sass",
- "../sass/components/pagination.sass",
- "../sass/components/panel.sass",
- "../sass/components/tabs.sass",
- "../sass/grid/_all.sass",
- "../sass/grid/columns.sass",
- "../sass/grid/tiles.sass",
- "../sass/layout/_all.sass",
- "../sass/layout/hero.sass",
- "../sass/layout/section.sass",
- "../sass/layout/footer.sass"
- ],
- "names": [],
- "mappings": "AACA,8DAA8D;AKD9D,UAAU,CAAV,UAAU;EACR,AAAA,IAAI;IACF,SAAS,EAAE,YAAY;;EACzB,AAAA,EAAE;IACA,SAAS,EAAE,cAAc;;;;AIJ7B,2EAA2E;AAE3E,AAAA,IAAI;AACJ,AAAA,IAAI;AACJ,AAAA,CAAC;AACD,AAAA,EAAE;AACF,AAAA,EAAE;AACF,AAAA,EAAE;AACF,AAAA,EAAE;AACF,AAAA,EAAE;AACF,AAAA,EAAE;AACF,AAAA,UAAU;AACV,AAAA,MAAM;AACN,AAAA,QAAQ;AACR,AAAA,MAAM;AACN,AAAA,QAAQ;AACR,AAAA,GAAG;AACH,AAAA,MAAM;AACN,AAAA,EAAE;AACF,AAAA,EAAE;AACF,AAAA,EAAE;AACF,AAAA,EAAE;AACF,AAAA,EAAE;AACF,AAAA,EAAE;AACF,AAAA,EAAE,CAAC;EACD,MAAM,EAAE,CAAC;EACT,OAAO,EAAE,CAAC;CAAI;;AAGhB,AAAA,EAAE;AACF,AAAA,EAAE;AACF,AAAA,EAAE;AACF,AAAA,EAAE;AACF,AAAA,EAAE;AACF,AAAA,EAAE,CAAC;EACD,SAAS,EAAE,IAAI;EACf,WAAW,EAAE,MAAM;CAAI;;AAGzB,AAAA,EAAE,CAAC;EACD,UAAU,EAAE,IAAI;CAAI;;AAGtB,AAAA,MAAM;AACN,AAAA,KAAK;AACL,AAAA,MAAM;AACN,AAAA,QAAQ,CAAC;EACP,MAAM,EAAE,CAAC;CAAI;;AAGf,AAAA,IAAI,CAAC;EACH,UAAU,EAAE,UAAU;CAAI;;AAE5B,AAAA,CAAC,CAAC;EACA,UAAU,EAAE,OAAO;CAGQ;;AAJ7B,AAEE,CAFD,AAEC,OAAQ,EAFV,AAGE,CAHD,AAGC,MAAO,CAAC;EACN,UAAU,EAAE,OAAO;CAAI;;AAG3B,AAAA,GAAG;AACH,AAAA,KAAK;AACL,AAAA,MAAM;AACN,AAAA,KAAK;AACL,AAAA,KAAK,CAAC;EACJ,SAAS,EAAE,IAAI;CAAI;;AAGrB,AAAA,MAAM,CAAC;EACL,MAAM,EAAE,CAAC;CAAI;;AAGf,AAAA,KAAK,CAAC;EACJ,eAAe,EAAE,QAAQ;EACzB,cAAc,EAAE,CAAC;CAAI;;AAEvB,AAAA,EAAE;AACF,AAAA,EAAE,CAAC;EACD,OAAO,EAAE,CAAC;EACV,UAAU,EAAE,IAAI;CAAI;;AC3DtB,AAAA,IAAI,CAAC;EACH,gBAAgB,EArBM,IAAI;EAsB1B,SAAS,EArBC,IAAI;EAsBd,uBAAuB,EAAE,SAAS;EAClC,sBAAsB,EAAE,WAAW;EACnC,SAAS,EAAE,KAAK;EAChB,UAAU,EAAE,MAAM;EAClB,UAAU,EAAE,MAAM;EAClB,cAAc,EA1BC,kBAAkB;CA0BC;;AAEpC,AAAA,OAAO;AACP,AAAA,KAAK;AACL,AAAA,MAAM;AACN,AAAA,MAAM;AACN,AAAA,MAAM;AACN,AAAA,MAAM;AACN,AAAA,OAAO,CAAC;EACN,OAAO,EAAE,KAAK;CAAI;;AAEpB,AAAA,IAAI;AACJ,AAAA,MAAM;AACN,AAAA,KAAK;AACL,AAAA,MAAM;AACN,AAAA,QAAQ,CAAC;EACP,WAAW,ERlBO,kBAAkB,EAAE,aAAa,EAAE,UAAU,EAAE,QAAQ,EAAE,QAAQ,EAAE,QAAQ,EAAE,WAAW,EAAE,WAAW,EAAE,YAAY,EAAE,gBAAgB,EAAE,WAAW,EAAE,OAAO,EAAE,UAAU;CQkB7J;;AAE9B,AAAA,IAAI;AACJ,AAAA,GAAG,CAAC;EACF,uBAAuB,EAAE,IAAI;EAC7B,sBAAsB,EAAE,IAAI;EAC5B,WAAW,ERvBM,SAAS;CQuBE;;AAE9B,AAAA,IAAI,CAAC;EACH,KAAK,ER9CQ,OAAe;EQ+C5B,SAAS,EAAE,IAAI;EACf,WAAW,ERhBG,GAAG;EQiBjB,WAAW,EAlDM,GAAG;CAkDa;;AAInC,AAAA,CAAC,CAAC;EACA,KAAK,ER1CQ,OAAmB;EQ2ChC,MAAM,EAAE,OAAO;EACf,eAAe,EAAE,IAAI;CAEI;;AAL3B,AAIE,CAJD,AAIC,MAAO,CAAC;EACN,KAAK,ER3DM,OAAe;CQ2DL;;AAEzB,AAAA,IAAI,CAAC;EACH,gBAAgB,ERxDH,UAAe;EQyD5B,KAAK,ER/CQ,OAAmB;EQgDhC,SAAS,EA3DC,OAAO;EA4DjB,WAAW,EA7DC,MAAM;EA8DlB,OAAO,EA/DM,MAAM,CAAC,KAAK,CAAC,MAAM;CA+DP;;AAE3B,AAAA,EAAE,CAAC;EACD,gBAAgB,ERjEH,OAAe;EQkE5B,MAAM,EAAE,IAAI;EACZ,OAAO,EAAE,KAAK;EACd,MAAM,EAhEI,GAAG;EAiEb,MAAM,EAhEI,MAAM,CAAC,CAAC;CAgEG;;AAEvB,AAAA,GAAG,CAAC;EACF,MAAM,EAAE,IAAI;EACZ,SAAS,EAAE,IAAI;CAAI;;AAErB,AAAA,KAAK,CAAA,AAAA,IAAC,CAAK,UAAU,AAAf;AACN,AAAA,KAAK,CAAA,AAAA,IAAC,CAAK,OAAO,AAAZ,EAAc;EAClB,cAAc,EAAE,QAAQ;CAAI;;AAE9B,AAAA,KAAK,CAAC;EACJ,SAAS,EAAE,OAAO;CAAI;;AAExB,AAAA,IAAI,CAAC;EACH,UAAU,EAAE,OAAO;EACnB,WAAW,EAAE,OAAO;CAAI;;AAE1B,AAAA,MAAM,CAAC;EACL,KAAK,ER3FQ,OAAe;EQ4F5B,WAAW,ERxDC,GAAG;CQwDe;;AAIhC,AAAA,GAAG,CAAC;EACF,gBAAgB,ER3FH,UAAe;EQ4F5B,KAAK,ERjGQ,OAAe;EQkG5B,SAAS,EAAE,OAAO;EAClB,WAAW,EAAE,GAAG;EAChB,SAAS,EAAE,MAAM;CAQc;;AAbjC,AAME,GANC,CAMD,IAAI,CAAC;EJkDL,0BAA0B,EAAE,KAAK;EIhD/B,UAAU,EAAE,IAAI;EAChB,KAAK,EAAE,OAAO;EACd,OAAO,EAAE,KAAK;EACd,SAAS,EAAE,GAAG;EACd,UAAU,EAAE,IAAI;EAChB,OAAO,EAAE,cAAc;CAAI;;AAE/B,AACE,KADG,CACH,EAAE;AADJ,AAEE,KAFG,CAEH,EAAE,CAAC;EACD,UAAU,EAAE,IAAI;EAChB,cAAc,EAAE,GAAG;CAAI;;AAJ3B,AAKE,KALG,CAKH,EAAE,CAAC;EACD,KAAK,ERrHM,OAAe;CQqHJ;;ACzH1B,ALeE,YKfU,ALeV,MAAO,CAAC;EACN,KAAK,EAAE,IAAI;EACX,OAAO,EAAE,GAAG;EACZ,OAAO,EAAE,KAAK;CAAI;;AKftB,AAAA,eAAe,CAAC;EACd,KAAK,EAAE,eAAe;CAAI;;AAE5B,AAAA,gBAAgB,CAAC;EACf,KAAK,EAAE,gBAAgB;CAAI;;AAI7B,AAAA,WAAW,CAAC;EACV,QAAQ,EAAE,iBAAiB;CAAI;;AAIjC,AAAA,WAAW,CAAC;EL+IV,MAAM,EADgB,CAAC;EAEvB,IAAI,EAFkB,CAAC;EAGvB,QAAQ,EAAE,QAAQ;EAClB,KAAK,EAJiB,CAAC;EAKvB,GAAG,EALmB,CAAC;CK7IJ;;AAMnB,AAAA,UAAU,CAAK;EACb,SAAS,ETIJ,IAAI,CSJQ,UAAU;CAAG;;ALqKhC,MAAM,CAAC,MAAM,MAAM,SAAS,EAAE,KAAK;EKnKjC,AAAA,iBAAiB,CAAK;IACpB,SAAS,ETCN,IAAI,CSDU,UAAU;GAAG;;;ALsKlC,MAAM,CAAC,MAAM,MAAM,SAAS,EAAE,KAAK,GAAG,KAAK;EKpKzC,AAAA,iBAAiB,CAAK;IACpB,SAAS,ETFN,IAAI,CSEU,UAAU;GAAG;;;AL2KlC,MAAM,CAAC,MAAM,MAAM,SAAS,EAAE,MAAM;EKzKlC,AAAA,gBAAgB,CAAK;IACnB,SAAS,ETLN,IAAI,CSKU,UAAU;GAAG;;;AL4KlC,MAAM,CAAC,MAAM,MAAM,SAAS,EAAE,MAAM;EK1KlC,AAAA,kBAAkB,CAAK;IACrB,SAAS,ETRN,IAAI,CSQU,UAAU;GAAG;;;ALiLlC,MAAM,CAAC,MAAM,MAAM,SAAS,EAAE,MAAM;EK/KlC,AAAA,qBAAqB,CAAK;IACxB,SAAS,ETXN,IAAI,CSWU,UAAU;GAAG;;;ALsLlC,MAAM,CAAC,MAAM,MAAM,SAAS,EAAE,MAAM;EKpLlC,AAAA,iBAAiB,CAAK;IACpB,SAAS,ETdN,IAAI,CScU,UAAU;GAAG;;;AAnBlC,AAAA,UAAU,CAAK;EACb,SAAS,ETKJ,MAAM,CSLM,UAAU;CAAG;;ALqKhC,MAAM,CAAC,MAAM,MAAM,SAAS,EAAE,KAAK;EKnKjC,AAAA,iBAAiB,CAAK;IACpB,SAAS,ETEN,MAAM,CSFQ,UAAU;GAAG;;;ALsKlC,MAAM,CAAC,MAAM,MAAM,SAAS,EAAE,KAAK,GAAG,KAAK;EKpKzC,AAAA,iBAAiB,CAAK;IACpB,SAAS,ETDN,MAAM,CSCQ,UAAU;GAAG;;;AL2KlC,MAAM,CAAC,MAAM,MAAM,SAAS,EAAE,MAAM;EKzKlC,AAAA,gBAAgB,CAAK;IACnB,SAAS,ETJN,MAAM,CSIQ,UAAU;GAAG;;;AL4KlC,MAAM,CAAC,MAAM,MAAM,SAAS,EAAE,MAAM;EK1KlC,AAAA,kBAAkB,CAAK;IACrB,SAAS,ETPN,MAAM,CSOQ,UAAU;GAAG;;;ALiLlC,MAAM,CAAC,MAAM,MAAM,SAAS,EAAE,MAAM;EK/KlC,AAAA,qBAAqB,CAAK;IACxB,SAAS,ETVN,MAAM,CSUQ,UAAU;GAAG;;;ALsLlC,MAAM,CAAC,MAAM,MAAM,SAAS,EAAE,MAAM;EKpLlC,AAAA,iBAAiB,CAAK;IACpB,SAAS,ETbN,MAAM,CSaQ,UAAU;GAAG;;;AAnBlC,AAAA,UAAU,CAAK;EACb,SAAS,ETMJ,IAAI,CSNQ,UAAU;CAAG;;ALqKhC,MAAM,CAAC,MAAM,MAAM,SAAS,EAAE,KAAK;EKnKjC,AAAA,iBAAiB,CAAK;IACpB,SAAS,ETGN,IAAI,CSHU,UAAU;GAAG;;;ALsKlC,MAAM,CAAC,MAAM,MAAM,SAAS,EAAE,KAAK,GAAG,KAAK;EKpKzC,AAAA,iBAAiB,CAAK;IACpB,SAAS,ETAN,IAAI,CSAU,UAAU;GAAG;;;AL2KlC,MAAM,CAAC,MAAM,MAAM,SAAS,EAAE,MAAM;EKzKlC,AAAA,gBAAgB,CAAK;IACnB,SAAS,ETHN,IAAI,CSGU,UAAU;GAAG;;;AL4KlC,MAAM,CAAC,MAAM,MAAM,SAAS,EAAE,MAAM;EK1KlC,AAAA,kBAAkB,CAAK;IACrB,SAAS,ETNN,IAAI,CSMU,UAAU;GAAG;;;ALiLlC,MAAM,CAAC,MAAM,MAAM,SAAS,EAAE,MAAM;EK/KlC,AAAA,qBAAqB,CAAK;IACxB,SAAS,ETTN,IAAI,CSSU,UAAU;GAAG;;;ALsLlC,MAAM,CAAC,MAAM,MAAM,SAAS,EAAE,MAAM;EKpLlC,AAAA,iBAAiB,CAAK;IACpB,SAAS,ETZN,IAAI,CSYU,UAAU;GAAG;;;AAnBlC,AAAA,UAAU,CAAK;EACb,SAAS,ETOJ,MAAM,CSPM,UAAU;CAAG;;ALqKhC,MAAM,CAAC,MAAM,MAAM,SAAS,EAAE,KAAK;EKnKjC,AAAA,iBAAiB,CAAK;IACpB,SAAS,ETIN,MAAM,CSJQ,UAAU;GAAG;;;ALsKlC,MAAM,CAAC,MAAM,MAAM,SAAS,EAAE,KAAK,GAAG,KAAK;EKpKzC,AAAA,iBAAiB,CAAK;IACpB,SAAS,ETCN,MAAM,CSDQ,UAAU;GAAG;;;AL2KlC,MAAM,CAAC,MAAM,MAAM,SAAS,EAAE,MAAM;EKzKlC,AAAA,gBAAgB,CAAK;IACnB,SAAS,ETFN,MAAM,CSEQ,UAAU;GAAG;;;AL4KlC,MAAM,CAAC,MAAM,MAAM,SAAS,EAAE,MAAM;EK1KlC,AAAA,kBAAkB,CAAK;IACrB,SAAS,ETLN,MAAM,CSKQ,UAAU;GAAG;;;ALiLlC,MAAM,CAAC,MAAM,MAAM,SAAS,EAAE,MAAM;EK/KlC,AAAA,qBAAqB,CAAK;IACxB,SAAS,ETRN,MAAM,CSQQ,UAAU;GAAG;;;ALsLlC,MAAM,CAAC,MAAM,MAAM,SAAS,EAAE,MAAM;EKpLlC,AAAA,iBAAiB,CAAK;IACpB,SAAS,ETXN,MAAM,CSWQ,UAAU;GAAG;;;AAnBlC,AAAA,UAAU,CAAK;EACb,SAAS,ETQJ,OAAO,CSRK,UAAU;CAAG;;ALqKhC,MAAM,CAAC,MAAM,MAAM,SAAS,EAAE,KAAK;EKnKjC,AAAA,iBAAiB,CAAK;IACpB,SAAS,ETKN,OAAO,CSLO,UAAU;GAAG;;;ALsKlC,MAAM,CAAC,MAAM,MAAM,SAAS,EAAE,KAAK,GAAG,KAAK;EKpKzC,AAAA,iBAAiB,CAAK;IACpB,SAAS,ETEN,OAAO,CSFO,UAAU;GAAG;;;AL2KlC,MAAM,CAAC,MAAM,MAAM,SAAS,EAAE,MAAM;EKzKlC,AAAA,gBAAgB,CAAK;IACnB,SAAS,ETDN,OAAO,CSCO,UAAU;GAAG;;;AL4KlC,MAAM,CAAC,MAAM,MAAM,SAAS,EAAE,MAAM;EK1KlC,AAAA,kBAAkB,CAAK;IACrB,SAAS,ETJN,OAAO,CSIO,UAAU;GAAG;;;ALiLlC,MAAM,CAAC,MAAM,MAAM,SAAS,EAAE,MAAM;EK/KlC,AAAA,qBAAqB,CAAK;IACxB,SAAS,ETPN,OAAO,CSOO,UAAU;GAAG;;;ALsLlC,MAAM,CAAC,MAAM,MAAM,SAAS,EAAE,MAAM;EKpLlC,AAAA,iBAAiB,CAAK;IACpB,SAAS,ETVN,OAAO,CSUO,UAAU;GAAG;;;AAnBlC,AAAA,UAAU,CAAK;EACb,SAAS,ETSJ,IAAI,CSTQ,UAAU;CAAG;;ALqKhC,MAAM,CAAC,MAAM,MAAM,SAAS,EAAE,KAAK;EKnKjC,AAAA,iBAAiB,CAAK;IACpB,SAAS,ETMN,IAAI,CSNU,UAAU;GAAG;;;ALsKlC,MAAM,CAAC,MAAM,MAAM,SAAS,EAAE,KAAK,GAAG,KAAK;EKpKzC,AAAA,iBAAiB,CAAK;IACpB,SAAS,ETGN,IAAI,CSHU,UAAU;GAAG;;;AL2KlC,MAAM,CAAC,MAAM,MAAM,SAAS,EAAE,MAAM;EKzKlC,AAAA,gBAAgB,CAAK;IACnB,SAAS,ETAN,IAAI,CSAU,UAAU;GAAG;;;AL4KlC,MAAM,CAAC,MAAM,MAAM,SAAS,EAAE,MAAM;EK1KlC,AAAA,kBAAkB,CAAK;IACrB,SAAS,ETHN,IAAI,CSGU,UAAU;GAAG;;;ALiLlC,MAAM,CAAC,MAAM,MAAM,SAAS,EAAE,MAAM;EK/KlC,AAAA,qBAAqB,CAAK;IACxB,SAAS,ETNN,IAAI,CSMU,UAAU;GAAG;;;ALsLlC,MAAM,CAAC,MAAM,MAAM,SAAS,EAAE,MAAM;EKpLlC,AAAA,iBAAiB,CAAK;IACpB,SAAS,ETTN,IAAI,CSSU,UAAU;GAAG;;;AAEpC,AAAA,kBAAkB,CAAC;EACjB,UAAU,EAAE,iBAAiB;CAAI;;AAEnC,AAAA,cAAc,CAAC;EACb,UAAU,EAAE,eAAe;CAAI;;AAEjC,AAAA,eAAe,CAAC;EACd,UAAU,EAAE,gBAAgB;CAAI;;AAIhC,AAAA,eAAe,CAAI;EACjB,KAAK,ET5CM,KAAgB,CS4Cb,UAAU;CAAG;;AAC7B,AACE,CADD,AAAA,eAAe,AACtB,MAAe,EADT,AAEE,CAFD,AAAA,eAAe,AAEtB,MAAe,CAAC;EACN,KAAK,EAAE,OAAmB;CAAG;;AALjC,AAAA,eAAe,CAAI;EACjB,KAAK,ETxDM,OAAc,CSwDX,UAAU;CAAG;;AAC7B,AACE,CADD,AAAA,eAAe,AACtB,MAAe,EADT,AAEE,CAFD,AAAA,eAAe,AAEtB,MAAe,CAAC;EACN,KAAK,EAAE,KAAmB;CAAG;;AALjC,AAAA,eAAe,CAAI;EACjB,KAAK,ET9CM,UAAe,CS8CZ,UAAU;CAAG;;AAC7B,AACE,CADD,AAAA,eAAe,AACtB,MAAe,EADT,AAEE,CAFD,AAAA,eAAe,AAEtB,MAAe,CAAC;EACN,KAAK,EAAE,OAAmB;CAAG;;AALjC,AAAA,cAAc,CAAK;EACjB,KAAK,ETpDM,OAAe,CSoDZ,UAAU;CAAG;;AAC7B,AACE,CADD,AAAA,cAAc,AACrB,MAAe,EADT,AAEE,CAFD,AAAA,cAAc,AAErB,MAAe,CAAC;EACN,KAAK,EAAE,OAAmB;CAAG;;AALjC,AAAA,iBAAiB,CAAE;EACjB,KAAK,ETvCM,OAAmB,CSuChB,UAAU;CAAG;;AAC7B,AACE,CADD,AAAA,iBAAiB,AACxB,MAAe,EADT,AAEE,CAFD,AAAA,iBAAiB,AAExB,MAAe,CAAC;EACN,KAAK,EAAE,OAAmB;CAAG;;AALjC,AAAA,cAAc,CAAK;EACjB,KAAK,ETtCM,OAAmB,CSsChB,UAAU;CAAG;;AAC7B,AACE,CADD,AAAA,cAAc,AACrB,MAAe,EADT,AAEE,CAFD,AAAA,cAAc,AAErB,MAAe,CAAC;EACN,KAAK,EAAE,OAAmB;CAAG;;AALjC,AAAA,iBAAiB,CAAE;EACjB,KAAK,ETxCM,OAAmB,CSwChB,UAAU;CAAG;;AAC7B,AACE,CADD,AAAA,iBAAiB,AACxB,MAAe,EADT,AAEE,CAFD,AAAA,iBAAiB,AAExB,MAAe,CAAC;EACN,KAAK,EAAE,OAAmB;CAAG;;AALjC,AAAA,iBAAiB,CAAE;EACjB,KAAK,ETzCM,OAAmB,CSyChB,UAAU;CAAG;;AAC7B,AACE,CADD,AAAA,iBAAiB,AACxB,MAAe,EADT,AAEE,CAFD,AAAA,iBAAiB,AAExB,MAAe,CAAC;EACN,KAAK,EAAE,OAAmB;CAAG;;AALjC,AAAA,gBAAgB,CAAG;EACjB,KAAK,ETpCM,OAAmB,CSoChB,UAAU;CAAG;;AAC7B,AACE,CADD,AAAA,gBAAgB,AACvB,MAAe,EADT,AAEE,CAFD,AAAA,gBAAgB,AAEvB,MAAe,CAAC;EACN,KAAK,EAAE,OAAmB;CAAG;;AAGjC,AAAA,mBAAmB,CAAA;EACjB,KAAK,ET/DM,OAAc,CS+DX,UAAU;CAAG;;AAD7B,AAAA,mBAAmB,CAAA;EACjB,KAAK,ET9DM,OAAe,CS8DZ,UAAU;CAAG;;AAD7B,AAAA,qBAAqB,CAAF;EACjB,KAAK,ET5DM,OAAe,CS4DZ,UAAU;CAAG;;AAD7B,AAAA,mBAAmB,CAAA;EACjB,KAAK,ET3DM,OAAe,CS2DZ,UAAU;CAAG;;AAD7B,AAAA,cAAc,CAAK;EACjB,KAAK,ET1DM,OAAe,CS0DZ,UAAU;CAAG;;AAD7B,AAAA,oBAAoB,CAAD;EACjB,KAAK,ETzDM,OAAe,CSyDZ,UAAU;CAAG;;AAD7B,AAAA,sBAAsB,CAAH;EACjB,KAAK,ETxDM,OAAe,CSwDZ,UAAU;CAAG;;AAD7B,AAAA,mBAAmB,CAAA;EACjB,KAAK,ETtDM,UAAe,CSsDZ,UAAU;CAAG;;AAD7B,AAAA,mBAAmB,CAAA;EACjB,KAAK,ETrDM,OAAe,CSqDZ,UAAU;CAAG;;AAO7B,AAAA,SAAS,CAAO;EACd,OAAO,EAAC,KAAC;CAAc;;ALqHzB,MAAM,CAAC,MAAM,MAAM,SAAS,EAAE,KAAK;EKnHjC,AAAA,gBAAgB,CAAO;IACrB,OAAO,EAAE,KAAW,CAAC,UAAU;GAAG;;;ALsHtC,MAAM,CAAC,MAAM,MAAM,SAAS,EAAE,KAAK,GAAG,KAAK;EKpHzC,AAAA,gBAAgB,CAAO;IACrB,OAAO,EAAE,KAAW,CAAC,UAAU;GAAG;;;ALuHtC,MAAM,CAAC,MAAM,MAAM,SAAS,EAAE,KAAK,OAAO,SAAS,EAAE,MAAM;EKrHzD,AAAA,qBAAqB,CAAO;IAC1B,OAAO,EAAE,KAAW,CAAC,UAAU;GAAG;;;ALwHtC,MAAM,CAAC,MAAM,MAAM,SAAS,EAAE,MAAM;EKtHlC,AAAA,eAAe,CAAO;IACpB,OAAO,EAAE,KAAW,CAAC,UAAU;GAAG;;;ALyHtC,MAAM,CAAC,MAAM,MAAM,SAAS,EAAE,MAAM;EKvHlC,AAAA,iBAAiB,CAAO;IACtB,OAAO,EAAE,KAAW,CAAC,UAAU;GAAG;;;AL0HtC,MAAM,CAAC,MAAM,MAAM,SAAS,EAAE,MAAM,OAAO,SAAS,EAAE,MAAM;EKxH1D,AAAA,sBAAsB,CAAO;IAC3B,OAAO,EAAE,KAAW,CAAC,UAAU;GAAG;;;AL2HtC,MAAM,CAAC,MAAM,MAAM,SAAS,EAAE,MAAM;EKzHlC,AAAA,oBAAoB,CAAO;IACzB,OAAO,EAAE,KAAW,CAAC,UAAU;GAAG;;;AL4HtC,MAAM,CAAC,MAAM,MAAM,SAAS,EAAE,MAAM,OAAO,SAAS,EAAE,MAAM;EK1H1D,AAAA,yBAAyB,CAAO;IAC9B,OAAO,EAAE,KAAW,CAAC,UAAU;GAAG;;;AL6HtC,MAAM,CAAC,MAAM,MAAM,SAAS,EAAE,MAAM;EK3HlC,AAAA,gBAAgB,CAAO;IACrB,OAAO,EAAE,KAAW,CAAC,UAAU;GAAG;;;AA5BtC,AAAA,QAAQ,CAAQ;EACd,OAAO,EAAC,IAAC;CAAc;;ALqHzB,MAAM,CAAC,MAAM,MAAM,SAAS,EAAE,KAAK;EKnHjC,AAAA,eAAe,CAAQ;IACrB,OAAO,EAAE,IAAW,CAAC,UAAU;GAAG;;;ALsHtC,MAAM,CAAC,MAAM,MAAM,SAAS,EAAE,KAAK,GAAG,KAAK;EKpHzC,AAAA,eAAe,CAAQ;IACrB,OAAO,EAAE,IAAW,CAAC,UAAU;GAAG;;;ALuHtC,MAAM,CAAC,MAAM,MAAM,SAAS,EAAE,KAAK,OAAO,SAAS,EAAE,MAAM;EKrHzD,AAAA,oBAAoB,CAAQ;IAC1B,OAAO,EAAE,IAAW,CAAC,UAAU;GAAG;;;ALwHtC,MAAM,CAAC,MAAM,MAAM,SAAS,EAAE,MAAM;EKtHlC,AAAA,cAAc,CAAQ;IACpB,OAAO,EAAE,IAAW,CAAC,UAAU;GAAG;;;ALyHtC,MAAM,CAAC,MAAM,MAAM,SAAS,EAAE,MAAM;EKvHlC,AAAA,gBAAgB,CAAQ;IACtB,OAAO,EAAE,IAAW,CAAC,UAAU;GAAG;;;AL0HtC,MAAM,CAAC,MAAM,MAAM,SAAS,EAAE,MAAM,OAAO,SAAS,EAAE,MAAM;EKxH1D,AAAA,qBAAqB,CAAQ;IAC3B,OAAO,EAAE,IAAW,CAAC,UAAU;GAAG;;;AL2HtC,MAAM,CAAC,MAAM,MAAM,SAAS,EAAE,MAAM;EKzHlC,AAAA,mBAAmB,CAAQ;IACzB,OAAO,EAAE,IAAW,CAAC,UAAU;GAAG;;;AL4HtC,MAAM,CAAC,MAAM,MAAM,SAAS,EAAE,MAAM,OAAO,SAAS,EAAE,MAAM;EK1H1D,AAAA,wBAAwB,CAAQ;IAC9B,OAAO,EAAE,IAAW,CAAC,UAAU;GAAG;;;AL6HtC,MAAM,CAAC,MAAM,MAAM,SAAS,EAAE,MAAM;EK3HlC,AAAA,eAAe,CAAQ;IACrB,OAAO,EAAE,IAAW,CAAC,UAAU;GAAG;;;AA5BtC,AAAA,UAAU,CAAM;EACd,OAAO,EAAC,MAAC;CAAc;;ALqHzB,MAAM,CAAC,MAAM,MAAM,SAAS,EAAE,KAAK;EKnHjC,AAAA,iBAAiB,CAAM;IACrB,OAAO,EAAE,MAAW,CAAC,UAAU;GAAG;;;ALsHtC,MAAM,CAAC,MAAM,MAAM,SAAS,EAAE,KAAK,GAAG,KAAK;EKpHzC,AAAA,iBAAiB,CAAM;IACrB,OAAO,EAAE,MAAW,CAAC,UAAU;GAAG;;;ALuHtC,MAAM,CAAC,MAAM,MAAM,SAAS,EAAE,KAAK,OAAO,SAAS,EAAE,MAAM;EKrHzD,AAAA,sBAAsB,CAAM;IAC1B,OAAO,EAAE,MAAW,CAAC,UAAU;GAAG;;;ALwHtC,MAAM,CAAC,MAAM,MAAM,SAAS,EAAE,MAAM;EKtHlC,AAAA,gBAAgB,CAAM;IACpB,OAAO,EAAE,MAAW,CAAC,UAAU;GAAG;;;ALyHtC,MAAM,CAAC,MAAM,MAAM,SAAS,EAAE,MAAM;EKvHlC,AAAA,kBAAkB,CAAM;IACtB,OAAO,EAAE,MAAW,CAAC,UAAU;GAAG;;;AL0HtC,MAAM,CAAC,MAAM,MAAM,SAAS,EAAE,MAAM,OAAO,SAAS,EAAE,MAAM;EKxH1D,AAAA,uBAAuB,CAAM;IAC3B,OAAO,EAAE,MAAW,CAAC,UAAU;GAAG;;;AL2HtC,MAAM,CAAC,MAAM,MAAM,SAAS,EAAE,MAAM;EKzHlC,AAAA,qBAAqB,CAAM;IACzB,OAAO,EAAE,MAAW,CAAC,UAAU;GAAG;;;AL4HtC,MAAM,CAAC,MAAM,MAAM,SAAS,EAAE,MAAM,OAAO,SAAS,EAAE,MAAM;EK1H1D,AAAA,0BAA0B,CAAM;IAC9B,OAAO,EAAE,MAAW,CAAC,UAAU;GAAG;;;AL6HtC,MAAM,CAAC,MAAM,MAAM,SAAS,EAAE,MAAM;EK3HlC,AAAA,iBAAiB,CAAM;IACrB,OAAO,EAAE,MAAW,CAAC,UAAU;GAAG;;;AA5BtC,AAAA,gBAAgB,CAAA;EACd,OAAO,EAAC,YAAC;CAAc;;ALqHzB,MAAM,CAAC,MAAM,MAAM,SAAS,EAAE,KAAK;EKnHjC,AAAA,uBAAuB,CAAA;IACrB,OAAO,EAAE,YAAW,CAAC,UAAU;GAAG;;;ALsHtC,MAAM,CAAC,MAAM,MAAM,SAAS,EAAE,KAAK,GAAG,KAAK;EKpHzC,AAAA,uBAAuB,CAAA;IACrB,OAAO,EAAE,YAAW,CAAC,UAAU;GAAG;;;ALuHtC,MAAM,CAAC,MAAM,MAAM,SAAS,EAAE,KAAK,OAAO,SAAS,EAAE,MAAM;EKrHzD,AAAA,4BAA4B,CAAA;IAC1B,OAAO,EAAE,YAAW,CAAC,UAAU;GAAG;;;ALwHtC,MAAM,CAAC,MAAM,MAAM,SAAS,EAAE,MAAM;EKtHlC,AAAA,sBAAsB,CAAA;IACpB,OAAO,EAAE,YAAW,CAAC,UAAU;GAAG;;;ALyHtC,MAAM,CAAC,MAAM,MAAM,SAAS,EAAE,MAAM;EKvHlC,AAAA,wBAAwB,CAAA;IACtB,OAAO,EAAE,YAAW,CAAC,UAAU;GAAG;;;AL0HtC,MAAM,CAAC,MAAM,MAAM,SAAS,EAAE,MAAM,OAAO,SAAS,EAAE,MAAM;EKxH1D,AAAA,6BAA6B,CAAA;IAC3B,OAAO,EAAE,YAAW,CAAC,UAAU;GAAG;;;AL2HtC,MAAM,CAAC,MAAM,MAAM,SAAS,EAAE,MAAM;EKzHlC,AAAA,2BAA2B,CAAA;IACzB,OAAO,EAAE,YAAW,CAAC,UAAU;GAAG;;;AL4HtC,MAAM,CAAC,MAAM,MAAM,SAAS,EAAE,MAAM,OAAO,SAAS,EAAE,MAAM;EK1H1D,AAAA,gCAAgC,CAAA;IAC9B,OAAO,EAAE,YAAW,CAAC,UAAU;GAAG;;;AL6HtC,MAAM,CAAC,MAAM,MAAM,SAAS,EAAE,MAAM;EK3HlC,AAAA,uBAAuB,CAAA;IACrB,OAAO,EAAE,YAAW,CAAC,UAAU;GAAG;;;AA5BtC,AAAA,eAAe,CAAC;EACd,OAAO,EAAC,WAAC;CAAc;;ALqHzB,MAAM,CAAC,MAAM,MAAM,SAAS,EAAE,KAAK;EKnHjC,AAAA,sBAAsB,CAAC;IACrB,OAAO,EAAE,WAAW,CAAC,UAAU;GAAG;;;ALsHtC,MAAM,CAAC,MAAM,MAAM,SAAS,EAAE,KAAK,GAAG,KAAK;EKpHzC,AAAA,sBAAsB,CAAC;IACrB,OAAO,EAAE,WAAW,CAAC,UAAU;GAAG;;;ALuHtC,MAAM,CAAC,MAAM,MAAM,SAAS,EAAE,KAAK,OAAO,SAAS,EAAE,MAAM;EKrHzD,AAAA,2BAA2B,CAAC;IAC1B,OAAO,EAAE,WAAW,CAAC,UAAU;GAAG;;;ALwHtC,MAAM,CAAC,MAAM,MAAM,SAAS,EAAE,MAAM;EKtHlC,AAAA,qBAAqB,CAAC;IACpB,OAAO,EAAE,WAAW,CAAC,UAAU;GAAG;;;ALyHtC,MAAM,CAAC,MAAM,MAAM,SAAS,EAAE,MAAM;EKvHlC,AAAA,uBAAuB,CAAC;IACtB,OAAO,EAAE,WAAW,CAAC,UAAU;GAAG;;;AL0HtC,MAAM,CAAC,MAAM,MAAM,SAAS,EAAE,MAAM,OAAO,SAAS,EAAE,MAAM;EKxH1D,AAAA,4BAA4B,CAAC;IAC3B,OAAO,EAAE,WAAW,CAAC,UAAU;GAAG;;;AL2HtC,MAAM,CAAC,MAAM,MAAM,SAAS,EAAE,MAAM;EKzHlC,AAAA,0BAA0B,CAAC;IACzB,OAAO,EAAE,WAAW,CAAC,UAAU;GAAG;;;AL4HtC,MAAM,CAAC,MAAM,MAAM,SAAS,EAAE,MAAM,OAAO,SAAS,EAAE,MAAM;EK1H1D,AAAA,+BAA+B,CAAC;IAC9B,OAAO,EAAE,WAAW,CAAC,UAAU;GAAG;;;AL6HtC,MAAM,CAAC,MAAM,MAAM,SAAS,EAAE,MAAM;EK3HlC,AAAA,sBAAsB,CAAC;IACrB,OAAO,EAAE,WAAW,CAAC,UAAU;GAAG;;;AAExC,AAAA,UAAU,CAAC;EACT,OAAO,EAAE,eAAe;CAAI;;ALuF5B,MAAM,CAAC,MAAM,MAAM,SAAS,EAAE,KAAK;EKpFnC,AAAA,iBAAiB,CAAC;IAChB,OAAO,EAAE,eAAe;GAAI;;;ALuF9B,MAAM,CAAC,MAAM,MAAM,SAAS,EAAE,KAAK,GAAG,KAAK;EKpF3C,AAAA,iBAAiB,CAAC;IAChB,OAAO,EAAE,eAAe;GAAI;;;ALuF9B,MAAM,CAAC,MAAM,MAAM,SAAS,EAAE,KAAK,OAAO,SAAS,EAAE,MAAM;EKpF3D,AAAA,sBAAsB,CAAC;IACrB,OAAO,EAAE,eAAe;GAAI;;;ALuF9B,MAAM,CAAC,MAAM,MAAM,SAAS,EAAE,MAAM;EKpFpC,AAAA,gBAAgB,CAAC;IACf,OAAO,EAAE,eAAe;GAAI;;;ALuF9B,MAAM,CAAC,MAAM,MAAM,SAAS,EAAE,MAAM;EKpFpC,AAAA,kBAAkB,CAAC;IACjB,OAAO,EAAE,eAAe;GAAI;;;ALuF9B,MAAM,CAAC,MAAM,MAAM,SAAS,EAAE,MAAM,OAAO,SAAS,EAAE,MAAM;EKpF5D,AAAA,uBAAuB,CAAC;IACtB,OAAO,EAAE,eAAe;GAAI;;;ALuF9B,MAAM,CAAC,MAAM,MAAM,SAAS,EAAE,MAAM;EKpFpC,AAAA,qBAAqB,CAAC;IACpB,OAAO,EAAE,eAAe;GAAI;;;ALuF9B,MAAM,CAAC,MAAM,MAAM,SAAS,EAAE,MAAM,OAAO,SAAS,EAAE,MAAM;EKpF5D,AAAA,0BAA0B,CAAC;IACzB,OAAO,EAAE,eAAe;GAAI;;;ALuF9B,MAAM,CAAC,MAAM,MAAM,SAAS,EAAE,MAAM;EKpFpC,AAAA,iBAAiB,CAAC;IAChB,OAAO,EAAE,eAAe;GAAI;;;AAIhC,AAAA,cAAc,CAAC;EACb,MAAM,EAAE,YAAY;CAAI;;AAE1B,AAAA,eAAe,CAAC;EACd,OAAO,EAAE,YAAY;CAAI;;AAE3B,AAAA,cAAc,CAAC;EACb,aAAa,EAAE,YAAY;CAAI;;AAEjC,AAAA,cAAc,CAAC;EACb,UAAU,EAAE,eAAe;CAAI;;AAEjC,AAAA,gBAAgB,CAAC;ELkBf,qBAAqB,EAAE,IAAI;EAC3B,mBAAmB,EAAE,IAAI;EACzB,gBAAgB,EAAE,IAAI;EACtB,eAAe,EAAE,IAAI;EACrB,WAAW,EAAE,IAAI;CKrBO;;AEpJ1B,AAAA,IAAI,CAAC;EAEH,gBAAgB,EXGH,KAAgB;EWF7B,aAAa,EXkDA,GAAG;EWjDhB,UAAU,EAVC,CAAC,CAAC,GAAG,CAAC,GAAG,CXDP,qBAAc,EWCa,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,GAAG,CXDpC,qBAAc;EWY3B,KAAK,EXPQ,OAAe;EWQ5B,OAAO,EAAE,KAAK;EACd,OAAO,EAZK,OAAO;CAYK;;AAP1B,APIE,IOJE,APIb,IAAiB,CAAA,AAAA,WAAW,EAAE;EACjB,aAAa,EAAE,MAAM;CAAI;;AOI7B,AACE,CADD,AAAA,IAAI,AACH,MAAO,EADT,AAEE,CAFD,AAAA,IAAI,AAEH,MAAO,CAAC;EACN,UAAU,EAfU,CAAC,CAAC,GAAG,CAAC,GAAG,CXJlB,qBAAc,EWIwB,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,GAAG,CXa/C,OAAmB;CWEO;;AAHzC,AAIE,CAJD,AAAA,IAAI,AAIH,OAAQ,CAAC;EACP,UAAU,EAhBW,KAAK,CAAC,CAAC,CAAC,GAAG,CAAC,GAAG,CXLzB,qBAAc,EWK+B,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,GAAG,CXYtD,OAAmB;CWIQ;;ACc1C,AAAA,OAAO,CAAC;EP9BN,eAAe,EAAE,IAAI;EACrB,kBAAkB,EAAE,IAAI;EACxB,WAAW,EAAE,MAAM;EACnB,MAAM,EAAE,qBAAqB;EAC7B,aAAa,ELkDN,GAAG;EKjDV,UAAU,EAAE,IAAI;EAChB,OAAO,EAAE,WAAW;EACpB,SAAS,ELqBF,IAAI;EKpBX,MAAM,EAAE,MAAM;EACd,eAAe,EAAE,UAAU;EAC3B,WAAW,EAAE,GAAG;EAChB,cAAc,EAfW,mBAAmB;EAgB5C,YAAY,EAfe,mBAAmB;EAgB9C,aAAa,EAhBc,mBAAmB;EAiB9C,WAAW,EAlBc,mBAAmB;EAmB5C,QAAQ,EAAE,QAAQ;EAClB,cAAc,EAAE,GAAG;EDuJnB,qBAAqB,EAAE,IAAI;EAC3B,mBAAmB,EAAE,IAAI;EACzB,gBAAgB,EAAE,IAAI;EACtB,eAAe,EAAE,IAAI;EACrB,WAAW,EAAE,IAAI;EQ1IjB,gBAAgB,EZ1BH,KAAgB;EY2B7B,YAAY,EZ/BC,OAAe;EYgC5B,KAAK,EZpCQ,OAAe;EYqC5B,MAAM,EAAE,OAAO;EACf,eAAe,EAAE,MAAM;EACvB,YAAY,EAAE,MAAM;EACpB,aAAa,EAAE,MAAM;EACrB,UAAU,EAAE,MAAM;EAClB,WAAW,EAAE,MAAM;CAsJS;;AAjK9B,APZE,OOYK,APZZ,MAAc,EOYT,APXE,OOWK,APXZ,WAAmB,EOWd,APVE,OOUK,APVZ,OAAe,EOUV,APTE,OOSK,APTZ,UAAkB,CAAC;EACV,OAAO,EAAE,IAAI;CAAI;;AOQrB,APPE,OOOK,CPPZ,AAAA,QAAS,AAAA,EAAU;EACV,MAAM,EAAE,WAAW;CAAI;;AOM3B,AAYE,OAZK,CAYL,MAAM,CAAC;EACL,KAAK,EAAE,OAAO;CAAI;;AAbtB,AAcE,OAdK,CAcL,KAAK,EAdP,AAcE,OAdK,CAcL,KAAK,AAEH,SAAU,EAhBd,AAcE,OAdK,CAcL,KAAK,AAGH,UAAW,EAjBf,AAcE,OAdK,CAcL,KAAK,AAIH,SAAU,CAAC;EACT,MAAM,EAAE,KAAK;EACb,KAAK,EAAE,KAAK;CAAI;;AApBtB,AAcE,OAdK,CAcL,KAAK,AAOH,YAAa,AAAA,IAAK,CAAA,AAAA,WAAW,EAAE;EAC7B,WAAW,EAAE,oBAAoB;EACjC,YAAY,EAAE,QAAQ;CAAI;;AAvBhC,AAcE,OAdK,CAcL,KAAK,AAUH,WAAY,AAAA,IAAK,CAAA,AAAA,YAAY,EAAE;EAC7B,WAAW,EAAE,QAAQ;EACrB,YAAY,EAAE,oBAAoB;CAAG;;AA1B3C,AAcE,OAdK,CAcL,KAAK,AAaH,YAAa,AAAA,WAAW,CAAC;EACvB,WAAW,EAAE,oBAAoB;EACjC,YAAY,EAAE,oBAAoB;CAAG;;AA7B3C,AA+BE,OA/BK,AA+BL,MAAO,EA/BT,AAgCE,OAhCK,AAgCL,WAAY,CAAC;EACX,YAAY,EZ7DD,OAAe;EY8D1B,KAAK,EZjEM,OAAe;CYiEG;;AAlCjC,AAmCE,OAnCK,AAmCL,MAAO,EAnCT,AAoCE,OApCK,AAoCL,WAAY,CAAC;EACX,YAAY,EZvDD,OAAmB;EYwD9B,UAAU,EAAE,CAAC,CAAC,CAAC,CAAC,KAAK,CZxDV,uBAAmB;EYyD9B,KAAK,EZtEM,OAAe;CYsEG;;AAvCjC,AAwCE,OAxCK,AAwCL,OAAQ,EAxCV,AAyCE,OAzCK,AAyCL,UAAW,CAAC;EACV,YAAY,EZxED,OAAe;EYyE1B,UAAU,EAtDQ,KAAK,CAAC,CAAC,CAAC,GAAG,CAAC,GAAG,CZxBtB,qBAAc;EY+EzB,KAAK,EZ3EM,OAAe;CY2EI;;AA5ClC,AA8CE,OA9CK,AA8CL,QAAS,CAAC;EACR,gBAAgB,EAAE,WAAW;EAC7B,YAAY,EAAE,WAAW;EACzB,KAAK,EZ/EM,OAAe;EYgF1B,eAAe,EAAE,SAAS;CAYF;;AA9D5B,AAmDI,OAnDG,AA8CL,QAAS,AAKP,MAAO,EAnDX,AAoDI,OApDG,AA8CL,QAAS,AAMP,WAAY,EApDhB,AAqDI,OArDG,AA8CL,QAAS,AAOP,MAAO,EArDX,AAsDI,OAtDG,AA8CL,QAAS,AAQP,WAAY,EAtDhB,AAuDI,OAvDG,AA8CL,QAAS,AASP,OAAQ,EAvDZ,AAwDI,OAxDG,AA8CL,QAAS,AAUP,UAAW,CAAC;EACV,gBAAgB,EZlFP,UAAe;EYmFxB,KAAK,EZzFI,OAAe;CYyFU;;AA1DxC,AA2DI,OA3DG,AA8CL,QAAS,CAaP,AAAA,QAAE,AAAA,EAAU;EACV,gBAAgB,EAAE,WAAW;EAC7B,YAAY,EAAE,WAAW;EACzB,UAAU,EAAE,IAAI;CAAI;;AA9D1B,AAkEI,OAlEG,AAkEH,SAAU,CAAI;EACZ,gBAAgB,EZ1FP,KAAgB;EY2FzB,YAAY,EAAE,WAAW;EACzB,KAAK,EZxGI,OAAc;CYuKQ;;AApIrC,AAsEM,OAtEC,AAkEH,SAAU,AAIhB,MAAe,EAtEb,AAuEM,OAvEC,AAkEH,SAAU,AAKhB,WAAoB,CAAC;EACX,gBAAgB,EAAE,OAAoB;EACtC,YAAY,EAAE,WAAW;EACzB,KAAK,EZ7GE,OAAc;CY6GE;;AA1E/B,AA2EM,OA3EC,AAkEH,SAAU,AAShB,MAAe,EA3Eb,AA4EM,OA5EC,AAkEH,SAAU,AAUhB,WAAoB,CAAC;EACX,YAAY,EAAE,WAAW;EACzB,UAAU,EAAE,CAAC,CAAC,CAAC,CAAC,KAAK,CZrGd,yBAAgB;EYsGvB,KAAK,EZlHE,OAAc;CYkHE;;AA/E/B,AAgFM,OAhFC,AAkEH,SAAU,AAchB,OAAgB,EAhFd,AAiFM,OAjFC,AAkEH,SAAU,AAehB,UAAmB,CAAC;EACV,gBAAgB,EAAE,OAAkB;EACpC,YAAY,EAAE,WAAW;EACzB,UAAU,EA/FI,KAAK,CAAC,CAAC,CAAC,GAAG,CAAC,GAAG,CZxBtB,qBAAc;EYwHrB,KAAK,EZxHE,OAAc;CYwHE;;AArF/B,AAsFM,OAtFC,AAkEH,SAAU,CAoBhB,AAAA,QAAU,AAAA,EAAU;EACV,gBAAgB,EZ9GT,KAAgB;EY+GvB,YAAY,EAAE,WAAW;EACzB,UAAU,EAAE,IAAI;CAAI;;AAzF5B,AA0FM,OA1FC,AAkEH,SAAU,AAwBhB,YAAqB,CAAC;EACZ,gBAAgB,EZ9HT,OAAc;EY+HrB,KAAK,EZnHE,KAAgB;CY0HH;;AAnG5B,AA6FQ,OA7FD,AAkEH,SAAU,AAwBR,YAAa,AAGnB,MAAe,CAAC;EACN,gBAAgB,EAAE,KAAyB;CAAG;;AA9FxD,AA+FQ,OA/FD,AAkEH,SAAU,AAwBR,YAAa,CAKnB,AAAA,QAAU,AAAA,EAAU;EACV,gBAAgB,EZnIX,OAAc;EYoInB,YAAY,EAAE,WAAW;EACzB,UAAU,EAAE,IAAI;EAChB,KAAK,EZ1HA,KAAgB;CY0HL;;AAnG1B,AAqGQ,OArGD,AAkEH,SAAU,AAkCR,WAAY,AAClB,MAAe,CAAC;EACN,YAAY,EAAE,WAAW,CAAC,WAAW,CZzIhC,OAAc,CAAd,OAAc,CYyI+C,UAAU;CAAG;;AAtGzF,AAuGM,OAvGC,AAkEH,SAAU,AAqChB,YAAqB,CAAC;EACZ,gBAAgB,EAAE,WAAW;EAC7B,YAAY,EZhIL,KAAgB;EYiIvB,KAAK,EZjIE,KAAgB;CY8IH;;AAvH5B,AA2GQ,OA3GD,AAkEH,SAAU,AAqCR,YAAa,AAInB,MAAe,EA3Gf,AA4GQ,OA5GD,AAkEH,SAAU,AAqCR,YAAa,AAKnB,MAAe,CAAC;EACN,gBAAgB,EZpIX,KAAgB;EYqIrB,YAAY,EZrIP,KAAgB;EYsIrB,KAAK,EZlJA,OAAc;CYkJI;;AA/GjC,AAiHU,OAjHH,AAkEH,SAAU,AAqCR,YAAa,AASX,WAAY,AAClB,MAAe,CAAC;EACN,YAAY,EAAE,WAAW,CAAC,WAAW,CZzIlC,KAAgB,CAAhB,KAAgB,CYyIiC,UAAU;CAAG;;AAlH7E,AAmHQ,OAnHD,AAkEH,SAAU,AAqCR,YAAa,CAYnB,AAAA,QAAU,AAAA,EAAU;EACV,gBAAgB,EAAE,WAAW;EAC7B,YAAY,EZ5IP,KAAgB;EY6IrB,UAAU,EAAE,IAAI;EAChB,KAAK,EZ9IA,KAAgB;CY8IL;;AAvH1B,AAwHM,OAxHC,AAkEH,SAAU,AAsDhB,YAAqB,AAAA,YAAY,CAAC;EACxB,gBAAgB,EAAE,WAAW;EAC7B,YAAY,EZ7JL,OAAc;EY8JrB,KAAK,EZ9JE,OAAc;CYuKM;;AApInC,AA4HQ,OA5HD,AAkEH,SAAU,AAsDR,YAAa,AAAA,YAAY,AAI/B,MAAe,EA5Hf,AA6HQ,OA7HD,AAkEH,SAAU,AAsDR,YAAa,AAAA,YAAY,AAK/B,MAAe,CAAC;EACN,gBAAgB,EZjKX,OAAc;EYkKnB,KAAK,EZtJA,KAAgB;CYsJL;;AA/H1B,AAgIQ,OAhID,AAkEH,SAAU,AAsDR,YAAa,AAAA,YAAY,CAQ/B,AAAA,QAAU,AAAA,EAAU;EACV,gBAAgB,EAAE,WAAW;EAC7B,YAAY,EZrKP,OAAc;EYsKnB,UAAU,EAAE,IAAI;EAChB,KAAK,EZvKA,OAAc;CYuKI;;AApIjC,AAkEI,OAlEG,AAkEH,SAAU,CAAI;EACZ,gBAAgB,EZtGP,OAAc;EYuGvB,YAAY,EAAE,WAAW;EACzB,KAAK,EZ5FI,KAAgB;CY2JM;;AApIrC,AAsEM,OAtEC,AAkEH,SAAU,AAIhB,MAAe,EAtEb,AAuEM,OAvEC,AAkEH,SAAU,AAKhB,WAAoB,CAAC;EACX,gBAAgB,EAAE,OAAoB;EACtC,YAAY,EAAE,WAAW;EACzB,KAAK,EZjGE,KAAgB;CYiGA;;AA1E/B,AA2EM,OA3EC,AAkEH,SAAU,AAShB,MAAe,EA3Eb,AA4EM,OA5EC,AAkEH,SAAU,AAUhB,WAAoB,CAAC;EACX,YAAY,EAAE,WAAW;EACzB,UAAU,EAAE,CAAC,CAAC,CAAC,CAAC,KAAK,CZjHd,sBAAc;EYkHrB,KAAK,EZtGE,KAAgB;CYsGA;;AA/E/B,AAgFM,OAhFC,AAkEH,SAAU,AAchB,OAAgB,EAhFd,AAiFM,OAjFC,AAkEH,SAAU,AAehB,UAAmB,CAAC;EACV,gBAAgB,EAAE,KAAkB;EACpC,YAAY,EAAE,WAAW;EACzB,UAAU,EA/FI,KAAK,CAAC,CAAC,CAAC,GAAG,CAAC,GAAG,CZxBtB,qBAAc;EYwHrB,KAAK,EZ5GE,KAAgB;CY4GA;;AArF/B,AAsFM,OAtFC,AAkEH,SAAU,CAoBhB,AAAA,QAAU,AAAA,EAAU;EACV,gBAAgB,EZ1HT,OAAc;EY2HrB,YAAY,EAAE,WAAW;EACzB,UAAU,EAAE,IAAI;CAAI;;AAzF5B,AA0FM,OA1FC,AAkEH,SAAU,AAwBhB,YAAqB,CAAC;EACZ,gBAAgB,EZlHT,KAAgB;EYmHvB,KAAK,EZ/HE,OAAc;CYsID;;AAnG5B,AA6FQ,OA7FD,AAkEH,SAAU,AAwBT,YAAc,AAGnB,MAAe,CAAC;EACN,gBAAgB,EAAE,OAAyB;CAAG;;AA9FxD,AA+FQ,OA/FD,AAkEH,SAAU,AAwBT,YAAc,CAKnB,AAAA,QAAU,AAAA,EAAU;EACV,gBAAgB,EZvHX,KAAgB;EYwHrB,YAAY,EAAE,WAAW;EACzB,UAAU,EAAE,IAAI;EAChB,KAAK,EZtIA,OAAc;CYsIH;;AAnG1B,AAqGQ,OArGD,AAkEH,SAAU,AAkCT,WAAa,AAClB,MAAe,CAAC;EACN,YAAY,EAAE,WAAW,CAAC,WAAW,CZ7HhC,KAAgB,CAAhB,KAAgB,CY6H6C,UAAU;CAAG;;AAtGzF,AAuGM,OAvGC,AAkEH,SAAU,AAqChB,YAAqB,CAAC;EACZ,gBAAgB,EAAE,WAAW;EAC7B,YAAY,EZ5IL,OAAc;EY6IrB,KAAK,EZ7IE,OAAc;CY0JD;;AAvH5B,AA2GQ,OA3GD,AAkEH,SAAU,AAqCT,YAAc,AAInB,MAAe,EA3Gf,AA4GQ,OA5GD,AAkEH,SAAU,AAqCT,YAAc,AAKnB,MAAe,CAAC;EACN,gBAAgB,EZhJX,OAAc;EYiJnB,YAAY,EZjJP,OAAc;EYkJnB,KAAK,EZtIA,KAAgB;CYsIE;;AA/GjC,AAiHU,OAjHH,AAkEH,SAAU,AAqCT,YAAc,AASZ,WAAa,AAClB,MAAe,CAAC;EACN,YAAY,EAAE,WAAW,CAAC,WAAW,CZrJlC,OAAc,CAAd,OAAc,CYqJmC,UAAU;CAAG;;AAlH7E,AAmHQ,OAnHD,AAkEH,SAAU,AAqCT,YAAc,CAYnB,AAAA,QAAU,AAAA,EAAU;EACV,gBAAgB,EAAE,WAAW;EAC7B,YAAY,EZxJP,OAAc;EYyJnB,UAAU,EAAE,IAAI;EAChB,KAAK,EZ1JA,OAAc;CY0JH;;AAvH1B,AAwHM,OAxHC,AAkEH,SAAU,AAsDhB,YAAqB,AAAA,YAAY,CAAC;EACxB,gBAAgB,EAAE,WAAW;EAC7B,YAAY,EZjJL,KAAgB;EYkJvB,KAAK,EZlJE,KAAgB;CY2JI;;AApInC,AA4HQ,OA5HD,AAkEH,SAAU,AAsDT,YAAc,AAAA,YAAY,AAI/B,MAAe,EA5Hf,AA6HQ,OA7HD,AAkEH,SAAU,AAsDT,YAAc,AAAA,YAAY,AAK/B,MAAe,CAAC;EACN,gBAAgB,EZrJX,KAAgB;EYsJrB,KAAK,EZlKA,OAAc;CYkKH;;AA/H1B,AAgIQ,OAhID,AAkEH,SAAU,AAsDT,YAAc,AAAA,YAAY,CAQ/B,AAAA,QAAU,AAAA,EAAU;EACV,gBAAgB,EAAE,WAAW;EAC7B,YAAY,EZzJP,KAAgB;EY0JrB,UAAU,EAAE,IAAI;EAChB,KAAK,EZ3JA,KAAgB;CY2JE;;AApIjC,AAkEI,OAlEG,AAkEH,SAAU,CAAI;EACZ,gBAAgB,EZ5FP,UAAe;EY6FxB,YAAY,EAAE,WAAW;EACzB,KAAK,EZpGI,OAAe;CYmKO;;AApIrC,AAsEM,OAtEC,AAkEH,SAAU,AAIhB,MAAe,EAtEb,AAuEM,OAvEC,AAkEH,SAAU,AAKhB,WAAoB,CAAC;EACX,gBAAgB,EAAE,OAAoB;EACtC,YAAY,EAAE,WAAW;EACzB,KAAK,EZzGE,OAAe;CYyGC;;AA1E/B,AA2EM,OA3EC,AAkEH,SAAU,AAShB,MAAe,EA3Eb,AA4EM,OA5EC,AAkEH,SAAU,AAUhB,WAAoB,CAAC;EACX,YAAY,EAAE,WAAW;EACzB,UAAU,EAAE,CAAC,CAAC,CAAC,CAAC,KAAK,CZvGd,yBAAe;EYwGtB,KAAK,EZ9GE,OAAe;CY8GC;;AA/E/B,AAgFM,OAhFC,AAkEH,SAAU,AAchB,OAAgB,EAhFd,AAiFM,OAjFC,AAkEH,SAAU,AAehB,UAAmB,CAAC;EACV,gBAAgB,EAAE,OAAkB;EACpC,YAAY,EAAE,WAAW;EACzB,UAAU,EA/FI,KAAK,CAAC,CAAC,CAAC,GAAG,CAAC,GAAG,CZxBtB,qBAAc;EYwHrB,KAAK,EZpHE,OAAe;CYoHC;;AArF/B,AAsFM,OAtFC,AAkEH,SAAU,CAoBhB,AAAA,QAAU,AAAA,EAAU;EACV,gBAAgB,EZhHT,UAAe;EYiHtB,YAAY,EAAE,WAAW;EACzB,UAAU,EAAE,IAAI;CAAI;;AAzF5B,AA0FM,OA1FC,AAkEH,SAAU,AAwBhB,YAAqB,CAAC;EACZ,gBAAgB,EZ1HT,OAAe;EY2HtB,KAAK,EZrHE,UAAe;CY4HF;;AAnG5B,AA6FQ,OA7FD,AAkEH,SAAU,AAwBV,YAAe,AAGnB,MAAe,CAAC;EACN,gBAAgB,EAAE,OAAyB;CAAG;;AA9FxD,AA+FQ,OA/FD,AAkEH,SAAU,AAwBV,YAAe,CAKnB,AAAA,QAAU,AAAA,EAAU;EACV,gBAAgB,EZ/HX,OAAe;EYgIpB,YAAY,EAAE,WAAW;EACzB,UAAU,EAAE,IAAI;EAChB,KAAK,EZ5HA,UAAe;CY4HJ;;AAnG1B,AAqGQ,OArGD,AAkEH,SAAU,AAkCV,WAAc,AAClB,MAAe,CAAC;EACN,YAAY,EAAE,WAAW,CAAC,WAAW,CZrIhC,OAAe,CAAf,OAAe,CYqI8C,UAAU;CAAG;;AAtGzF,AAuGM,OAvGC,AAkEH,SAAU,AAqChB,YAAqB,CAAC;EACZ,gBAAgB,EAAE,WAAW;EAC7B,YAAY,EZlIL,UAAe;EYmItB,KAAK,EZnIE,UAAe;CYgJF;;AAvH5B,AA2GQ,OA3GD,AAkEH,SAAU,AAqCV,YAAe,AAInB,MAAe,EA3Gf,AA4GQ,OA5GD,AAkEH,SAAU,AAqCV,YAAe,AAKnB,MAAe,CAAC;EACN,gBAAgB,EZtIX,UAAe;EYuIpB,YAAY,EZvIP,UAAe;EYwIpB,KAAK,EZ9IA,OAAe;CY8IG;;AA/GjC,AAiHU,OAjHH,AAkEH,SAAU,AAqCV,YAAe,AASb,WAAc,AAClB,MAAe,CAAC;EACN,YAAY,EAAE,WAAW,CAAC,WAAW,CZ3IlC,UAAe,CAAf,UAAe,CY2IkC,UAAU;CAAG;;AAlH7E,AAmHQ,OAnHD,AAkEH,SAAU,AAqCV,YAAe,CAYnB,AAAA,QAAU,AAAA,EAAU;EACV,gBAAgB,EAAE,WAAW;EAC7B,YAAY,EZ9IP,UAAe;EY+IpB,UAAU,EAAE,IAAI;EAChB,KAAK,EZhJA,UAAe;CYgJJ;;AAvH1B,AAwHM,OAxHC,AAkEH,SAAU,AAsDhB,YAAqB,AAAA,YAAY,CAAC;EACxB,gBAAgB,EAAE,WAAW;EAC7B,YAAY,EZzJL,OAAe;EY0JtB,KAAK,EZ1JE,OAAe;CYmKK;;AApInC,AA4HQ,OA5HD,AAkEH,SAAU,AAsDV,YAAe,AAAA,YAAY,AAI/B,MAAe,EA5Hf,AA6HQ,OA7HD,AAkEH,SAAU,AAsDV,YAAe,AAAA,YAAY,AAK/B,MAAe,CAAC;EACN,gBAAgB,EZ7JX,OAAe;EY8JpB,KAAK,EZxJA,UAAe;CYwJJ;;AA/H1B,AAgIQ,OAhID,AAkEH,SAAU,AAsDV,YAAe,AAAA,YAAY,CAQ/B,AAAA,QAAU,AAAA,EAAU;EACV,gBAAgB,EAAE,WAAW;EAC7B,YAAY,EZjKP,OAAe;EYkKpB,UAAU,EAAE,IAAI;EAChB,KAAK,EZnKA,OAAe;CYmKG;;AApIjC,AAkEI,OAlEG,AAkEH,QAAS,CAAK;EACZ,gBAAgB,EZlGP,OAAe;EYmGxB,YAAY,EAAE,WAAW;EACzB,KAAK,EZ9FI,UAAe;CY6JO;;AApIrC,AAsEM,OAtEC,AAkEH,QAAS,AAIf,MAAe,EAtEb,AAuEM,OAvEC,AAkEH,QAAS,AAKf,WAAoB,CAAC;EACX,gBAAgB,EAAE,OAAoB;EACtC,YAAY,EAAE,WAAW;EACzB,KAAK,EZnGE,UAAe;CYmGC;;AA1E/B,AA2EM,OA3EC,AAkEH,QAAS,AASf,MAAe,EA3Eb,AA4EM,OA5EC,AAkEH,QAAS,AAUf,WAAoB,CAAC;EACX,YAAY,EAAE,WAAW;EACzB,UAAU,EAAE,CAAC,CAAC,CAAC,CAAC,KAAK,CZ7Gd,sBAAe;EY8GtB,KAAK,EZxGE,UAAe;CYwGC;;AA/E/B,AAgFM,OAhFC,AAkEH,QAAS,AAcf,OAAgB,EAhFd,AAiFM,OAjFC,AAkEH,QAAS,AAef,UAAmB,CAAC;EACV,gBAAgB,EAAE,OAAkB;EACpC,YAAY,EAAE,WAAW;EACzB,UAAU,EA/FI,KAAK,CAAC,CAAC,CAAC,GAAG,CAAC,GAAG,CZxBtB,qBAAc;EYwHrB,KAAK,EZ9GE,UAAe;CY8GC;;AArF/B,AAsFM,OAtFC,AAkEH,QAAS,CAoBf,AAAA,QAAU,AAAA,EAAU;EACV,gBAAgB,EZtHT,OAAe;EYuHtB,YAAY,EAAE,WAAW;EACzB,UAAU,EAAE,IAAI;CAAI;;AAzF5B,AA0FM,OA1FC,AAkEH,QAAS,AAwBf,YAAqB,CAAC;EACZ,gBAAgB,EZpHT,UAAe;EYqHtB,KAAK,EZ3HE,OAAe;CYkIF;;AAnG5B,AA6FQ,OA7FD,AAkEH,QAAS,AAwBV,YAAgB,AAGnB,MAAe,CAAC;EACN,gBAAgB,EAAE,OAAyB;CAAG;;AA9FxD,AA+FQ,OA/FD,AAkEH,QAAS,AAwBV,YAAgB,CAKnB,AAAA,QAAU,AAAA,EAAU;EACV,gBAAgB,EZzHX,UAAe;EY0HpB,YAAY,EAAE,WAAW;EACzB,UAAU,EAAE,IAAI;EAChB,KAAK,EZlIA,OAAe;CYkIJ;;AAnG1B,AAqGQ,OArGD,AAkEH,QAAS,AAkCV,WAAe,AAClB,MAAe,CAAC;EACN,YAAY,EAAE,WAAW,CAAC,WAAW,CZ/HhC,UAAe,CAAf,UAAe,CY+H8C,UAAU;CAAG;;AAtGzF,AAuGM,OAvGC,AAkEH,QAAS,AAqCf,YAAqB,CAAC;EACZ,gBAAgB,EAAE,WAAW;EAC7B,YAAY,EZxIL,OAAe;EYyItB,KAAK,EZzIE,OAAe;CYsJF;;AAvH5B,AA2GQ,OA3GD,AAkEH,QAAS,AAqCV,YAAgB,AAInB,MAAe,EA3Gf,AA4GQ,OA5GD,AAkEH,QAAS,AAqCV,YAAgB,AAKnB,MAAe,CAAC;EACN,gBAAgB,EZ5IX,OAAe;EY6IpB,YAAY,EZ7IP,OAAe;EY8IpB,KAAK,EZxIA,UAAe;CYwIG;;AA/GjC,AAiHU,OAjHH,AAkEH,QAAS,AAqCV,YAAgB,AASd,WAAe,AAClB,MAAe,CAAC;EACN,YAAY,EAAE,WAAW,CAAC,WAAW,CZjJlC,OAAe,CAAf,OAAe,CYiJkC,UAAU;CAAG;;AAlH7E,AAmHQ,OAnHD,AAkEH,QAAS,AAqCV,YAAgB,CAYnB,AAAA,QAAU,AAAA,EAAU;EACV,gBAAgB,EAAE,WAAW;EAC7B,YAAY,EZpJP,OAAe;EYqJpB,UAAU,EAAE,IAAI;EAChB,KAAK,EZtJA,OAAe;CYsJJ;;AAvH1B,AAwHM,OAxHC,AAkEH,QAAS,AAsDf,YAAqB,AAAA,YAAY,CAAC;EACxB,gBAAgB,EAAE,WAAW;EAC7B,YAAY,EZnJL,UAAe;EYoJtB,KAAK,EZpJE,UAAe;CY6JK;;AApInC,AA4HQ,OA5HD,AAkEH,QAAS,AAsDV,YAAgB,AAAA,YAAY,AAI/B,MAAe,EA5Hf,AA6HQ,OA7HD,AAkEH,QAAS,AAsDV,YAAgB,AAAA,YAAY,AAK/B,MAAe,CAAC;EACN,gBAAgB,EZvJX,UAAe;EYwJpB,KAAK,EZ9JA,OAAe;CY8JJ;;AA/H1B,AAgIQ,OAhID,AAkEH,QAAS,AAsDV,YAAgB,AAAA,YAAY,CAQ/B,AAAA,QAAU,AAAA,EAAU;EACV,gBAAgB,EAAE,WAAW;EAC7B,YAAY,EZ3JP,UAAe;EY4JpB,UAAU,EAAE,IAAI;EAChB,KAAK,EZ7JA,UAAe;CY6JG;;AApIjC,AAkEI,OAlEG,AAkEH,WAAY,CAAE;EACZ,gBAAgB,EZrFP,OAAmB;EYsF5B,YAAY,EAAE,WAAW;EACzB,KAAK,EX/EC,IAAI;CW8IqB;;AApIrC,AAsEM,OAtEC,AAkEH,WAAY,AAIlB,MAAe,EAtEb,AAuEM,OAvEC,AAkEH,WAAY,AAKlB,WAAoB,CAAC;EACX,gBAAgB,EAAE,OAAoB;EACtC,YAAY,EAAE,WAAW;EACzB,KAAK,EXpFD,IAAI;CWoFe;;AA1E/B,AA2EM,OA3EC,AAkEH,WAAY,AASlB,MAAe,EA3Eb,AA4EM,OA5EC,AAkEH,WAAY,AAUlB,WAAoB,CAAC;EACX,YAAY,EAAE,WAAW;EACzB,UAAU,EAAE,CAAC,CAAC,CAAC,CAAC,KAAK,CZhGd,uBAAmB;EYiG1B,KAAK,EXzFD,IAAI;CWyFe;;AA/E/B,AAgFM,OAhFC,AAkEH,WAAY,AAclB,OAAgB,EAhFd,AAiFM,OAjFC,AAkEH,WAAY,AAelB,UAAmB,CAAC;EACV,gBAAgB,EAAE,OAAkB;EACpC,YAAY,EAAE,WAAW;EACzB,UAAU,EA/FI,KAAK,CAAC,CAAC,CAAC,GAAG,CAAC,GAAG,CZxBtB,qBAAc;EYwHrB,KAAK,EX/FD,IAAI;CW+Fe;;AArF/B,AAsFM,OAtFC,AAkEH,WAAY,CAoBlB,AAAA,QAAU,AAAA,EAAU;EACV,gBAAgB,EZzGT,OAAmB;EY0G1B,YAAY,EAAE,WAAW;EACzB,UAAU,EAAE,IAAI;CAAI;;AAzF5B,AA0FM,OA1FC,AAkEH,WAAY,AAwBlB,YAAqB,CAAC;EACZ,gBAAgB,EXrGZ,IAAI;EWsGR,KAAK,EZ9GE,OAAmB;CYqHN;;AAnG5B,AA6FQ,OA7FD,AAkEH,WAAY,AAwBd,YAAiB,AAGnB,MAAe,CAAC;EACN,gBAAgB,EAAE,OAAyB;CAAG;;AA9FxD,AA+FQ,OA/FD,AAkEH,WAAY,AAwBd,YAAiB,CAKnB,AAAA,QAAU,AAAA,EAAU;EACV,gBAAgB,EX1Gd,IAAI;EW2GN,YAAY,EAAE,WAAW;EACzB,UAAU,EAAE,IAAI;EAChB,KAAK,EZrHA,OAAmB;CYqHR;;AAnG1B,AAqGQ,OArGD,AAkEH,WAAY,AAkCd,WAAgB,AAClB,MAAe,CAAC;EACN,YAAY,EAAE,WAAW,CAAC,WAAW,CXhHnC,IAAI,CAAJ,IAAI,CWgH4D,UAAU;CAAG;;AAtGzF,AAuGM,OAvGC,AAkEH,WAAY,AAqClB,YAAqB,CAAC;EACZ,gBAAgB,EAAE,WAAW;EAC7B,YAAY,EZ3HL,OAAmB;EY4H1B,KAAK,EZ5HE,OAAmB;CYyIN;;AAvH5B,AA2GQ,OA3GD,AAkEH,WAAY,AAqCd,YAAiB,AAInB,MAAe,EA3Gf,AA4GQ,OA5GD,AAkEH,WAAY,AAqCd,YAAiB,AAKnB,MAAe,CAAC;EACN,gBAAgB,EZ/HX,OAAmB;EYgIxB,YAAY,EZhIP,OAAmB;EYiIxB,KAAK,EXzHH,IAAI;CWyHiB;;AA/GjC,AAiHU,OAjHH,AAkEH,WAAY,AAqCd,YAAiB,AASf,WAAgB,AAClB,MAAe,CAAC;EACN,YAAY,EAAE,WAAW,CAAC,WAAW,CZpIlC,OAAmB,CAAnB,OAAmB,CYoI8B,UAAU;CAAG;;AAlH7E,AAmHQ,OAnHD,AAkEH,WAAY,AAqCd,YAAiB,CAYnB,AAAA,QAAU,AAAA,EAAU;EACV,gBAAgB,EAAE,WAAW;EAC7B,YAAY,EZvIP,OAAmB;EYwIxB,UAAU,EAAE,IAAI;EAChB,KAAK,EZzIA,OAAmB;CYyIR;;AAvH1B,AAwHM,OAxHC,AAkEH,WAAY,AAsDlB,YAAqB,AAAA,YAAY,CAAC;EACxB,gBAAgB,EAAE,WAAW;EAC7B,YAAY,EXpIR,IAAI;EWqIR,KAAK,EXrID,IAAI;CW8ImB;;AApInC,AA4HQ,OA5HD,AAkEH,WAAY,AAsDd,YAAiB,AAAA,YAAY,AAI/B,MAAe,EA5Hf,AA6HQ,OA7HD,AAkEH,WAAY,AAsDd,YAAiB,AAAA,YAAY,AAK/B,MAAe,CAAC;EACN,gBAAgB,EXxId,IAAI;EWyIN,KAAK,EZjJA,OAAmB;CYiJR;;AA/H1B,AAgIQ,OAhID,AAkEH,WAAY,AAsDd,YAAiB,AAAA,YAAY,CAQ/B,AAAA,QAAU,AAAA,EAAU;EACV,gBAAgB,EAAE,WAAW;EAC7B,YAAY,EX5IV,IAAI;EW6IN,UAAU,EAAE,IAAI;EAChB,KAAK,EX9IH,IAAI;CW8IiB;;AApIjC,AAkEI,OAlEG,AAkEH,QAAS,CAAK;EACZ,gBAAgB,EZpFP,OAAmB;EYqF5B,YAAY,EAAE,WAAW;EACzB,KAAK,EX/EC,IAAI;CW8IqB;;AApIrC,AAsEM,OAtEC,AAkEH,QAAS,AAIf,MAAe,EAtEb,AAuEM,OAvEC,AAkEH,QAAS,AAKf,WAAoB,CAAC;EACX,gBAAgB,EAAE,OAAoB;EACtC,YAAY,EAAE,WAAW;EACzB,KAAK,EXpFD,IAAI;CWoFe;;AA1E/B,AA2EM,OA3EC,AAkEH,QAAS,AASf,MAAe,EA3Eb,AA4EM,OA5EC,AAkEH,QAAS,AAUf,WAAoB,CAAC;EACX,YAAY,EAAE,WAAW;EACzB,UAAU,EAAE,CAAC,CAAC,CAAC,CAAC,KAAK,CZ/Fd,wBAAmB;EYgG1B,KAAK,EXzFD,IAAI;CWyFe;;AA/E/B,AAgFM,OAhFC,AAkEH,QAAS,AAcf,OAAgB,EAhFd,AAiFM,OAjFC,AAkEH,QAAS,AAef,UAAmB,CAAC;EACV,gBAAgB,EAAE,OAAkB;EACpC,YAAY,EAAE,WAAW;EACzB,UAAU,EA/FI,KAAK,CAAC,CAAC,CAAC,GAAG,CAAC,GAAG,CZxBtB,qBAAc;EYwHrB,KAAK,EX/FD,IAAI;CW+Fe;;AArF/B,AAsFM,OAtFC,AAkEH,QAAS,CAoBf,AAAA,QAAU,AAAA,EAAU;EACV,gBAAgB,EZxGT,OAAmB;EYyG1B,YAAY,EAAE,WAAW;EACzB,UAAU,EAAE,IAAI;CAAI;;AAzF5B,AA0FM,OA1FC,AAkEH,QAAS,AAwBf,YAAqB,CAAC;EACZ,gBAAgB,EXrGZ,IAAI;EWsGR,KAAK,EZ7GE,OAAmB;CYoHN;;AAnG5B,AA6FQ,OA7FD,AAkEH,QAAS,AAwBZ,YAAkB,AAGnB,MAAe,CAAC;EACN,gBAAgB,EAAE,OAAyB;CAAG;;AA9FxD,AA+FQ,OA/FD,AAkEH,QAAS,AAwBZ,YAAkB,CAKnB,AAAA,QAAU,AAAA,EAAU;EACV,gBAAgB,EX1Gd,IAAI;EW2GN,YAAY,EAAE,WAAW;EACzB,UAAU,EAAE,IAAI;EAChB,KAAK,EZpHA,OAAmB;CYoHR;;AAnG1B,AAqGQ,OArGD,AAkEH,QAAS,AAkCZ,WAAiB,AAClB,MAAe,CAAC;EACN,YAAY,EAAE,WAAW,CAAC,WAAW,CXhHnC,IAAI,CAAJ,IAAI,CWgH4D,UAAU;CAAG;;AAtGzF,AAuGM,OAvGC,AAkEH,QAAS,AAqCf,YAAqB,CAAC;EACZ,gBAAgB,EAAE,WAAW;EAC7B,YAAY,EZ1HL,OAAmB;EY2H1B,KAAK,EZ3HE,OAAmB;CYwIN;;AAvH5B,AA2GQ,OA3GD,AAkEH,QAAS,AAqCZ,YAAkB,AAInB,MAAe,EA3Gf,AA4GQ,OA5GD,AAkEH,QAAS,AAqCZ,YAAkB,AAKnB,MAAe,CAAC;EACN,gBAAgB,EZ9HX,OAAmB;EY+HxB,YAAY,EZ/HP,OAAmB;EYgIxB,KAAK,EXzHH,IAAI;CWyHiB;;AA/GjC,AAiHU,OAjHH,AAkEH,QAAS,AAqCZ,YAAkB,AAShB,WAAiB,AAClB,MAAe,CAAC;EACN,YAAY,EAAE,WAAW,CAAC,WAAW,CZnIlC,OAAmB,CAAnB,OAAmB,CYmI8B,UAAU;CAAG;;AAlH7E,AAmHQ,OAnHD,AAkEH,QAAS,AAqCZ,YAAkB,CAYnB,AAAA,QAAU,AAAA,EAAU;EACV,gBAAgB,EAAE,WAAW;EAC7B,YAAY,EZtIP,OAAmB;EYuIxB,UAAU,EAAE,IAAI;EAChB,KAAK,EZxIA,OAAmB;CYwIR;;AAvH1B,AAwHM,OAxHC,AAkEH,QAAS,AAsDf,YAAqB,AAAA,YAAY,CAAC;EACxB,gBAAgB,EAAE,WAAW;EAC7B,YAAY,EXpIR,IAAI;EWqIR,KAAK,EXrID,IAAI;CW8ImB;;AApInC,AA4HQ,OA5HD,AAkEH,QAAS,AAsDZ,YAAkB,AAAA,YAAY,AAI/B,MAAe,EA5Hf,AA6HQ,OA7HD,AAkEH,QAAS,AAsDZ,YAAkB,AAAA,YAAY,AAK/B,MAAe,CAAC;EACN,gBAAgB,EXxId,IAAI;EWyIN,KAAK,EZhJA,OAAmB;CYgJR;;AA/H1B,AAgIQ,OAhID,AAkEH,QAAS,AAsDZ,YAAkB,AAAA,YAAY,CAQ/B,AAAA,QAAU,AAAA,EAAU;EACV,gBAAgB,EAAE,WAAW;EAC7B,YAAY,EX5IV,IAAI;EW6IN,UAAU,EAAE,IAAI;EAChB,KAAK,EX9IH,IAAI;CW8IiB;;AApIjC,AAkEI,OAlEG,AAkEH,WAAY,CAAE;EACZ,gBAAgB,EZtFP,OAAmB;EYuF5B,YAAY,EAAE,WAAW;EACzB,KAAK,EX/EC,IAAI;CW8IqB;;AApIrC,AAsEM,OAtEC,AAkEH,WAAY,AAIlB,MAAe,EAtEb,AAuEM,OAvEC,AAkEH,WAAY,AAKlB,WAAoB,CAAC;EACX,gBAAgB,EAAE,OAAoB;EACtC,YAAY,EAAE,WAAW;EACzB,KAAK,EXpFD,IAAI;CWoFe;;AA1E/B,AA2EM,OA3EC,AAkEH,WAAY,AASlB,MAAe,EA3Eb,AA4EM,OA5EC,AAkEH,WAAY,AAUlB,WAAoB,CAAC;EACX,YAAY,EAAE,WAAW;EACzB,UAAU,EAAE,CAAC,CAAC,CAAC,CAAC,KAAK,CZjGd,uBAAmB;EYkG1B,KAAK,EXzFD,IAAI;CWyFe;;AA/E/B,AAgFM,OAhFC,AAkEH,WAAY,AAclB,OAAgB,EAhFd,AAiFM,OAjFC,AAkEH,WAAY,AAelB,UAAmB,CAAC;EACV,gBAAgB,EAAE,OAAkB;EACpC,YAAY,EAAE,WAAW;EACzB,UAAU,EA/FI,KAAK,CAAC,CAAC,CAAC,GAAG,CAAC,GAAG,CZxBtB,qBAAc;EYwHrB,KAAK,EX/FD,IAAI;CW+Fe;;AArF/B,AAsFM,OAtFC,AAkEH,WAAY,CAoBlB,AAAA,QAAU,AAAA,EAAU;EACV,gBAAgB,EZ1GT,OAAmB;EY2G1B,YAAY,EAAE,WAAW;EACzB,UAAU,EAAE,IAAI;CAAI;;AAzF5B,AA0FM,OA1FC,AAkEH,WAAY,AAwBlB,YAAqB,CAAC;EACZ,gBAAgB,EXrGZ,IAAI;EWsGR,KAAK,EZ/GE,OAAmB;CYsHN;;AAnG5B,AA6FQ,OA7FD,AAkEH,WAAY,AAwBhB,YAAmB,AAGnB,MAAe,CAAC;EACN,gBAAgB,EAAE,OAAyB;CAAG;;AA9FxD,AA+FQ,OA/FD,AAkEH,WAAY,AAwBhB,YAAmB,CAKnB,AAAA,QAAU,AAAA,EAAU;EACV,gBAAgB,EX1Gd,IAAI;EW2GN,YAAY,EAAE,WAAW;EACzB,UAAU,EAAE,IAAI;EAChB,KAAK,EZtHA,OAAmB;CYsHR;;AAnG1B,AAqGQ,OArGD,AAkEH,WAAY,AAkChB,WAAkB,AAClB,MAAe,CAAC;EACN,YAAY,EAAE,WAAW,CAAC,WAAW,CXhHnC,IAAI,CAAJ,IAAI,CWgH4D,UAAU;CAAG;;AAtGzF,AAuGM,OAvGC,AAkEH,WAAY,AAqClB,YAAqB,CAAC;EACZ,gBAAgB,EAAE,WAAW;EAC7B,YAAY,EZ5HL,OAAmB;EY6H1B,KAAK,EZ7HE,OAAmB;CY0IN;;AAvH5B,AA2GQ,OA3GD,AAkEH,WAAY,AAqChB,YAAmB,AAInB,MAAe,EA3Gf,AA4GQ,OA5GD,AAkEH,WAAY,AAqChB,YAAmB,AAKnB,MAAe,CAAC;EACN,gBAAgB,EZhIX,OAAmB;EYiIxB,YAAY,EZjIP,OAAmB;EYkIxB,KAAK,EXzHH,IAAI;CWyHiB;;AA/GjC,AAiHU,OAjHH,AAkEH,WAAY,AAqChB,YAAmB,AASjB,WAAkB,AAClB,MAAe,CAAC;EACN,YAAY,EAAE,WAAW,CAAC,WAAW,CZrIlC,OAAmB,CAAnB,OAAmB,CYqI8B,UAAU;CAAG;;AAlH7E,AAmHQ,OAnHD,AAkEH,WAAY,AAqChB,YAAmB,CAYnB,AAAA,QAAU,AAAA,EAAU;EACV,gBAAgB,EAAE,WAAW;EAC7B,YAAY,EZxIP,OAAmB;EYyIxB,UAAU,EAAE,IAAI;EAChB,KAAK,EZ1IA,OAAmB;CY0IR;;AAvH1B,AAwHM,OAxHC,AAkEH,WAAY,AAsDlB,YAAqB,AAAA,YAAY,CAAC;EACxB,gBAAgB,EAAE,WAAW;EAC7B,YAAY,EXpIR,IAAI;EWqIR,KAAK,EXrID,IAAI;CW8ImB;;AApInC,AA4HQ,OA5HD,AAkEH,WAAY,AAsDhB,YAAmB,AAAA,YAAY,AAI/B,MAAe,EA5Hf,AA6HQ,OA7HD,AAkEH,WAAY,AAsDhB,YAAmB,AAAA,YAAY,AAK/B,MAAe,CAAC;EACN,gBAAgB,EXxId,IAAI;EWyIN,KAAK,EZlJA,OAAmB;CYkJR;;AA/H1B,AAgIQ,OAhID,AAkEH,WAAY,AAsDhB,YAAmB,AAAA,YAAY,CAQ/B,AAAA,QAAU,AAAA,EAAU;EACV,gBAAgB,EAAE,WAAW;EAC7B,YAAY,EX5IV,IAAI;EW6IN,UAAU,EAAE,IAAI;EAChB,KAAK,EX9IH,IAAI;CW8IiB;;AApIjC,AAkEI,OAlEG,AAkEH,WAAY,CAAE;EACZ,gBAAgB,EZvFP,OAAmB;EYwF5B,YAAY,EAAE,WAAW;EACzB,KAAK,EXjFM,kBAAI;CWgJgB;;AApIrC,AAsEM,OAtEC,AAkEH,WAAY,AAIlB,MAAe,EAtEb,AAuEM,OAvEC,AAkEH,WAAY,AAKlB,WAAoB,CAAC;EACX,gBAAgB,EAAE,OAAoB;EACtC,YAAY,EAAE,WAAW;EACzB,KAAK,EXtFI,kBAAI;CWsFU;;AA1E/B,AA2EM,OA3EC,AAkEH,WAAY,AASlB,MAAe,EA3Eb,AA4EM,OA5EC,AAkEH,WAAY,AAUlB,WAAoB,CAAC;EACX,YAAY,EAAE,WAAW;EACzB,UAAU,EAAE,CAAC,CAAC,CAAC,CAAC,KAAK,CZlGd,wBAAmB;EYmG1B,KAAK,EX3FI,kBAAI;CW2FU;;AA/E/B,AAgFM,OAhFC,AAkEH,WAAY,AAclB,OAAgB,EAhFd,AAiFM,OAjFC,AAkEH,WAAY,AAelB,UAAmB,CAAC;EACV,gBAAgB,EAAE,OAAkB;EACpC,YAAY,EAAE,WAAW;EACzB,UAAU,EA/FI,KAAK,CAAC,CAAC,CAAC,GAAG,CAAC,GAAG,CZxBtB,qBAAc;EYwHrB,KAAK,EXjGI,kBAAI;CWiGU;;AArF/B,AAsFM,OAtFC,AAkEH,WAAY,CAoBlB,AAAA,QAAU,AAAA,EAAU;EACV,gBAAgB,EZ3GT,OAAmB;EY4G1B,YAAY,EAAE,WAAW;EACzB,UAAU,EAAE,IAAI;CAAI;;AAzF5B,AA0FM,OA1FC,AAkEH,WAAY,AAwBlB,YAAqB,CAAC;EACZ,gBAAgB,EXvGP,kBAAI;EWwGb,KAAK,EZhHE,OAAmB;CYuHN;;AAnG5B,AA6FQ,OA7FD,AAkEH,WAAY,AAwBjB,YAAoB,AAGnB,MAAe,CAAC;EACN,gBAAgB,EAAE,kBAAyB;CAAG;;AA9FxD,AA+FQ,OA/FD,AAkEH,WAAY,AAwBjB,YAAoB,CAKnB,AAAA,QAAU,AAAA,EAAU;EACV,gBAAgB,EX5GT,kBAAI;EW6GX,YAAY,EAAE,WAAW;EACzB,UAAU,EAAE,IAAI;EAChB,KAAK,EZvHA,OAAmB;CYuHR;;AAnG1B,AAqGQ,OArGD,AAkEH,WAAY,AAkCjB,WAAmB,AAClB,MAAe,CAAC;EACN,YAAY,EAAE,WAAW,CAAC,WAAW,CXlH9B,kBAAI,CAAJ,kBAAI,CWkHuD,UAAU;CAAG;;AAtGzF,AAuGM,OAvGC,AAkEH,WAAY,AAqClB,YAAqB,CAAC;EACZ,gBAAgB,EAAE,WAAW;EAC7B,YAAY,EZ7HL,OAAmB;EY8H1B,KAAK,EZ9HE,OAAmB;CY2IN;;AAvH5B,AA2GQ,OA3GD,AAkEH,WAAY,AAqCjB,YAAoB,AAInB,MAAe,EA3Gf,AA4GQ,OA5GD,AAkEH,WAAY,AAqCjB,YAAoB,AAKnB,MAAe,CAAC;EACN,gBAAgB,EZjIX,OAAmB;EYkIxB,YAAY,EZlIP,OAAmB;EYmIxB,KAAK,EX3HE,kBAAI;CW2HY;;AA/GjC,AAiHU,OAjHH,AAkEH,WAAY,AAqCjB,YAAoB,AASlB,WAAmB,AAClB,MAAe,CAAC;EACN,YAAY,EAAE,WAAW,CAAC,WAAW,CZtIlC,OAAmB,CAAnB,OAAmB,CYsI8B,UAAU;CAAG;;AAlH7E,AAmHQ,OAnHD,AAkEH,WAAY,AAqCjB,YAAoB,CAYnB,AAAA,QAAU,AAAA,EAAU;EACV,gBAAgB,EAAE,WAAW;EAC7B,YAAY,EZzIP,OAAmB;EY0IxB,UAAU,EAAE,IAAI;EAChB,KAAK,EZ3IA,OAAmB;CY2IR;;AAvH1B,AAwHM,OAxHC,AAkEH,WAAY,AAsDlB,YAAqB,AAAA,YAAY,CAAC;EACxB,gBAAgB,EAAE,WAAW;EAC7B,YAAY,EXtIH,kBAAI;EWuIb,KAAK,EXvII,kBAAI;CWgJc;;AApInC,AA4HQ,OA5HD,AAkEH,WAAY,AAsDjB,YAAoB,AAAA,YAAY,AAI/B,MAAe,EA5Hf,AA6HQ,OA7HD,AAkEH,WAAY,AAsDjB,YAAoB,AAAA,YAAY,AAK/B,MAAe,CAAC;EACN,gBAAgB,EX1IT,kBAAI;EW2IX,KAAK,EZnJA,OAAmB;CYmJR;;AA/H1B,AAgIQ,OAhID,AAkEH,WAAY,AAsDjB,YAAoB,AAAA,YAAY,CAQ/B,AAAA,QAAU,AAAA,EAAU;EACV,gBAAgB,EAAE,WAAW;EAC7B,YAAY,EX9IL,kBAAI;EW+IX,UAAU,EAAE,IAAI;EAChB,KAAK,EXhJE,kBAAI;CWgJY;;AApIjC,AAkEI,OAlEG,AAkEH,UAAW,CAAG;EACZ,gBAAgB,EZlFP,OAAmB;EYmF5B,YAAY,EAAE,WAAW;EACzB,KAAK,EX/EC,IAAI;CW8IqB;;AApIrC,AAsEM,OAtEC,AAkEH,UAAW,AAIjB,MAAe,EAtEb,AAuEM,OAvEC,AAkEH,UAAW,AAKjB,WAAoB,CAAC;EACX,gBAAgB,EAAE,OAAoB;EACtC,YAAY,EAAE,WAAW;EACzB,KAAK,EXpFD,IAAI;CWoFe;;AA1E/B,AA2EM,OA3EC,AAkEH,UAAW,AASjB,MAAe,EA3Eb,AA4EM,OA5EC,AAkEH,UAAW,AAUjB,WAAoB,CAAC;EACX,YAAY,EAAE,WAAW;EACzB,UAAU,EAAE,CAAC,CAAC,CAAC,CAAC,KAAK,CZ7Fd,uBAAmB;EY8F1B,KAAK,EXzFD,IAAI;CWyFe;;AA/E/B,AAgFM,OAhFC,AAkEH,UAAW,AAcjB,OAAgB,EAhFd,AAiFM,OAjFC,AAkEH,UAAW,AAejB,UAAmB,CAAC;EACV,gBAAgB,EAAE,OAAkB;EACpC,YAAY,EAAE,WAAW;EACzB,UAAU,EA/FI,KAAK,CAAC,CAAC,CAAC,GAAG,CAAC,GAAG,CZxBtB,qBAAc;EYwHrB,KAAK,EX/FD,IAAI;CW+Fe;;AArF/B,AAsFM,OAtFC,AAkEH,UAAW,CAoBjB,AAAA,QAAU,AAAA,EAAU;EACV,gBAAgB,EZtGT,OAAmB;EYuG1B,YAAY,EAAE,WAAW;EACzB,UAAU,EAAE,IAAI;CAAI;;AAzF5B,AA0FM,OA1FC,AAkEH,UAAW,AAwBjB,YAAqB,CAAC;EACZ,gBAAgB,EXrGZ,IAAI;EWsGR,KAAK,EZ3GE,OAAmB;CYkHN;;AAnG5B,AA6FQ,OA7FD,AAkEH,UAAW,AAwBjB,YAAqB,AAGnB,MAAe,CAAC;EACN,gBAAgB,EAAE,OAAyB;CAAG;;AA9FxD,AA+FQ,OA/FD,AAkEH,UAAW,AAwBjB,YAAqB,CAKnB,AAAA,QAAU,AAAA,EAAU;EACV,gBAAgB,EX1Gd,IAAI;EW2GN,YAAY,EAAE,WAAW;EACzB,UAAU,EAAE,IAAI;EAChB,KAAK,EZlHA,OAAmB;CYkHR;;AAnG1B,AAqGQ,OArGD,AAkEH,UAAW,AAkCjB,WAAoB,AAClB,MAAe,CAAC;EACN,YAAY,EAAE,WAAW,CAAC,WAAW,CXhHnC,IAAI,CAAJ,IAAI,CWgH4D,UAAU;CAAG;;AAtGzF,AAuGM,OAvGC,AAkEH,UAAW,AAqCjB,YAAqB,CAAC;EACZ,gBAAgB,EAAE,WAAW;EAC7B,YAAY,EZxHL,OAAmB;EYyH1B,KAAK,EZzHE,OAAmB;CYsIN;;AAvH5B,AA2GQ,OA3GD,AAkEH,UAAW,AAqCjB,YAAqB,AAInB,MAAe,EA3Gf,AA4GQ,OA5GD,AAkEH,UAAW,AAqCjB,YAAqB,AAKnB,MAAe,CAAC;EACN,gBAAgB,EZ5HX,OAAmB;EY6HxB,YAAY,EZ7HP,OAAmB;EY8HxB,KAAK,EXzHH,IAAI;CWyHiB;;AA/GjC,AAiHU,OAjHH,AAkEH,UAAW,AAqCjB,YAAqB,AASnB,WAAoB,AAClB,MAAe,CAAC;EACN,YAAY,EAAE,WAAW,CAAC,WAAW,CZjIlC,OAAmB,CAAnB,OAAmB,CYiI8B,UAAU;CAAG;;AAlH7E,AAmHQ,OAnHD,AAkEH,UAAW,AAqCjB,YAAqB,CAYnB,AAAA,QAAU,AAAA,EAAU;EACV,gBAAgB,EAAE,WAAW;EAC7B,YAAY,EZpIP,OAAmB;EYqIxB,UAAU,EAAE,IAAI;EAChB,KAAK,EZtIA,OAAmB;CYsIR;;AAvH1B,AAwHM,OAxHC,AAkEH,UAAW,AAsDjB,YAAqB,AAAA,YAAY,CAAC;EACxB,gBAAgB,EAAE,WAAW;EAC7B,YAAY,EXpIR,IAAI;EWqIR,KAAK,EXrID,IAAI;CW8ImB;;AApInC,AA4HQ,OA5HD,AAkEH,UAAW,AAsDjB,YAAqB,AAAA,YAAY,AAI/B,MAAe,EA5Hf,AA6HQ,OA7HD,AAkEH,UAAW,AAsDjB,YAAqB,AAAA,YAAY,AAK/B,MAAe,CAAC;EACN,gBAAgB,EXxId,IAAI;EWyIN,KAAK,EZ9IA,OAAmB;CY8IR;;AA/H1B,AAgIQ,OAhID,AAkEH,UAAW,AAsDjB,YAAqB,AAAA,YAAY,CAQ/B,AAAA,QAAU,AAAA,EAAU;EACV,gBAAgB,EAAE,WAAW;EAC7B,YAAY,EX5IV,IAAI;EW6IN,UAAU,EAAE,IAAI;EAChB,KAAK,EX9IH,IAAI;CW8IiB;;AApIjC,AAsIE,OAtIK,AAsIL,SAAU,CAAC;EA7IX,aAAa,EZ8BA,GAAG;EY7BhB,SAAS,EZKF,OAAO;CYwIY;;AAvI5B,AAwIE,OAxIK,AAwIL,UAAW,CAAC;EA5IZ,SAAS,EZCF,OAAO;CY4Ia;;AAzI7B,AA0IE,OA1IK,AA0IL,SAAU,CAAC;EA5IX,SAAS,EZFF,MAAM;CY+Ia;;AA3I5B,AA6IE,OA7IK,CA6IL,AAAA,QAAE,AAAA,EAAU;EACV,gBAAgB,EZrKL,KAAgB;EYsK3B,YAAY,EZ1KD,OAAe;EY2K1B,UAAU,EAlKW,IAAI;EAmKzB,OAAO,EAlKe,GAAG;CAkKW;;AAjJxC,AAkJE,OAlJK,AAkJL,aAAc,CAAC;EACb,OAAO,EAAE,IAAI;EACb,KAAK,EAAE,IAAI;CAAI;;AApJnB,AAqJE,OArJK,AAqJL,WAAY,CAAC;EACX,KAAK,EAAE,sBAAsB;EAC7B,cAAc,EAAE,IAAI;CAIiB;;AA3JzC,AAwJI,OAxJG,AAqJL,WAAY,AAGV,MAAO,CAAC;ER3CV,SAAS,EAAE,gCAAgC;EAC3C,MAAM,EAAE,GAAG,CAAC,KAAK,CJzIJ,OAAe;EI0I5B,aAAa,EAAE,QAAQ;EACvB,kBAAkB,EAAE,WAAW;EAC/B,gBAAgB,EAAE,WAAW;EAC7B,OAAO,EAAE,EAAE;EACX,OAAO,EAAE,KAAK;EACd,MAAM,EAAE,GAAG;EACX,QAAQ,EAAE,QAAQ;EAClB,KAAK,EAAE,GAAG;EApIV,QAAQ,EAAE,QAAQ;EAKhB,IAAI,EAAE,qBAA2B;EACjC,GAAG,EAAE,qBAA2B;EQmK9B,QAAQ,EAAE,mBAAmB;CAAI;;AA3JvC,AA4JE,OA5JK,AA4JL,UAAW,CAAC;EACV,gBAAgB,EZtLL,UAAe;EYuL1B,YAAY,EZzLD,OAAe;EY0L1B,KAAK,EZ5LM,OAAe;EY6L1B,UAAU,EAAE,IAAI;EAChB,cAAc,EAAE,IAAI;CAAI;;AClL5B,ATPE,QSOM,ATPjB,IAAiB,CAAA,AAAA,WAAW,EAAE;EACjB,aAAa,EAAE,MAAM;CAAI;;ASM7B,AAGO,QAHC,CAGN,EAAE,GAAG,EAAE,CAAC;EACN,UAAU,EAAE,MAAM;CAAI;;AAJ1B,AAME,QANM,CAMN,CAAC,AAOL,IAAY,CAAA,AAAA,WAAW;AAbrB,AAOE,QAPM,CAON,EAAE,AAMN,IAAY,CAAA,AAAA,WAAW;AAbrB,AAQE,QARM,CAQN,EAAE,AAKN,IAAY,CAAA,AAAA,WAAW;AAbrB,AASE,QATM,CASN,EAAE,AAIN,IAAY,CAAA,AAAA,WAAW;AAbrB,AAUE,QAVM,CAUN,UAAU,AAGd,IAAY,CAAA,AAAA,WAAW;AAbrB,AAWE,QAXM,CAWN,GAAG,AAEP,IAAY,CAAA,AAAA,WAAW;AAbrB,AAYE,QAZM,CAYN,KAAK,AACT,IAAY,CAAA,AAAA,WAAW,EAAE;EACjB,aAAa,EAAE,GAAG;CAAI;;AAd5B,AAeE,QAfM,CAeN,EAAE;AAfJ,AAgBE,QAhBM,CAgBN,EAAE;AAhBJ,AAiBE,QAjBM,CAiBN,EAAE;AAjBJ,AAkBE,QAlBM,CAkBN,EAAE;AAlBJ,AAmBE,QAnBM,CAmBN,EAAE;AAnBJ,AAoBE,QApBM,CAoBN,EAAE,CAAC;EACD,KAAK,EbnCM,OAAe;EaoC1B,WAAW,EbHC,GAAG;EaIf,WAAW,EAzCe,KAAK;CAyCa;;AAvBhD,AAwBE,QAxBM,CAwBN,EAAE,CAAC;EACD,SAAS,EAAE,GAAG;EACd,aAAa,EAAE,KAAK;CAEG;;AA5B3B,AAwBE,QAxBM,CAwBN,EAAE,AAGA,IAAM,CAAA,AAAA,YAAY,EAAE;EAClB,UAAU,EAAE,GAAG;CAAI;;AA5BzB,AA6BE,QA7BM,CA6BN,EAAE,CAAC;EACD,SAAS,EAAE,MAAM;EACjB,aAAa,EAAE,QAAQ;CAEK;;AAjChC,AA6BE,QA7BM,CA6BN,EAAE,AAGA,IAAM,CAAA,AAAA,YAAY,EAAE;EAClB,UAAU,EAAE,QAAQ;CAAI;;AAjC9B,AAkCE,QAlCM,CAkCN,EAAE,CAAC;EACD,SAAS,EAAE,KAAK;EAChB,aAAa,EAAE,QAAQ;CAEK;;AAtChC,AAkCE,QAlCM,CAkCN,EAAE,AAGA,IAAM,CAAA,AAAA,YAAY,EAAE;EAClB,UAAU,EAAE,QAAQ;CAAI;;AAtC9B,AAuCE,QAvCM,CAuCN,EAAE,CAAC;EACD,SAAS,EAAE,MAAM;EACjB,aAAa,EAAE,KAAK;CAAI;;AAzC5B,AA0CE,QA1CM,CA0CN,EAAE,CAAC;EACD,SAAS,EAAE,OAAO;EAClB,aAAa,EAAE,QAAQ;CAAI;;AA5C/B,AA6CE,QA7CM,CA6CN,EAAE,CAAC;EACD,SAAS,EAAE,GAAG;EACd,aAAa,EAAE,GAAG;CAAI;;AA/C1B,AAgDE,QAhDM,CAgDN,UAAU,CAAC;EACT,gBAAgB,EbzDL,UAAe;Ea0D1B,WAAW,EAjEkB,GAAG,CAAC,KAAK,CbK3B,OAAe;Ea6D1B,OAAO,EAjEkB,MAAM,CAAC,KAAK;CAiEE;;AAnD3C,AAoDE,QApDM,CAoDN,EAAE,CAAC;EACD,UAAU,EAAE,eAAe;EAC3B,WAAW,EAAE,GAAG;EAChB,UAAU,EAAE,GAAG;CAAI;;AAvDvB,AAwDE,QAxDM,CAwDN,EAAE,CAAC;EACD,UAAU,EAAE,YAAY;EACxB,WAAW,EAAE,GAAG;EAChB,UAAU,EAAE,GAAG;CAKoB;;AAhEvC,AA4DI,QA5DI,CAwDN,EAAE,CAIA,EAAE,CAAC;EACD,eAAe,EAAE,MAAM;EACvB,UAAU,EAAE,KAAK;CAEc;;AAhErC,AA+DM,QA/DE,CAwDN,EAAE,CAIA,EAAE,CAGA,EAAE,CAAC;EACD,eAAe,EAAE,MAAM;CAAI;;AAhEnC,AAiEE,QAjEM,CAiEN,EAAE,CAAC;EACD,WAAW,EAAE,GAAG;CAAI;;AAlExB,AAmEE,QAnEM,CAmEN,MAAM,CAAC;EACL,UAAU,EAAE,MAAM;CAIQ;;AAxE9B,AAqEI,QArEI,CAmEN,MAAM,CAEJ,GAAG,CAAC;EACF,OAAO,EAAE,YAAY;CAAI;;AAtE/B,AAuEI,QAvEI,CAmEN,MAAM,CAIJ,UAAU,CAAC;EACT,UAAU,EAAE,MAAM;CAAI;;AAxE5B,AAyEE,QAzEM,CAyEN,GAAG,CAAC;ETiEJ,0BAA0B,EAAE,KAAK;ES/D/B,UAAU,EAAE,IAAI;EAChB,OAAO,EAxFW,MAAM,CAAC,KAAK;EAyF9B,WAAW,EAAE,GAAG;EAChB,SAAS,EAAE,MAAM;CAAI;;AA9EzB,AA+EE,QA/EM,CA+EN,GAAG;AA/EL,AAgFE,QAhFM,CAgFN,GAAG,CAAC;EACF,SAAS,EAAE,GAAG;CAAI;;AAjFtB,AAkFE,QAlFM,CAkFN,KAAK,CAAC;EACJ,KAAK,EAAE,IAAI;CA4B+B;;AA/G9C,AAoFI,QApFI,CAkFN,KAAK,CAEH,EAAE;AApFN,AAqFI,QArFI,CAkFN,KAAK,CAGH,EAAE,CAAC;EACD,MAAM,EAhGgB,GAAG,CAAC,KAAK,CbAtB,OAAe;EaiGxB,YAAY,EAhGgB,CAAC,CAAC,CAAC,CAAC,GAAG;EAiGnC,OAAO,EAhGgB,KAAK,CAAC,MAAM;EAiGnC,cAAc,EAAE,GAAG;CAAI;;AAzF7B,AA0FI,QA1FI,CAkFN,KAAK,CAQH,EAAE,CAAC;EACD,KAAK,EbzGI,OAAe;Ea0GxB,UAAU,EAAE,IAAI;CAAI;;AA5F1B,AA6FI,QA7FI,CAkFN,KAAK,CAWH,EAAE,AACA,MAAO,CAAC;EACN,gBAAgB,EbvGT,UAAe;CauGwC;;AA/FtE,AAiGM,QAjGE,CAkFN,KAAK,CAcH,KAAK,CACH,EAAE;AAjGR,AAkGM,QAlGE,CAkFN,KAAK,CAcH,KAAK,CAEH,EAAE,CAAC;EACD,YAAY,EAxGmB,CAAC,CAAC,CAAC,CAAC,GAAG;EAyGtC,KAAK,EblHE,OAAe;CakHkB;;AApGhD,AAsGM,QAtGE,CAkFN,KAAK,CAmBH,KAAK,CACH,EAAE;AAtGR,AAuGM,QAvGE,CAkFN,KAAK,CAmBH,KAAK,CAEH,EAAE,CAAC;EACD,YAAY,EA3GmB,GAAG,CAAC,CAAC,CAAC,CAAC;EA4GtC,KAAK,EbvHE,OAAe;CauHkB;;AAzGhD,AA6GU,QA7GF,CAkFN,KAAK,CAwBH,KAAK,CACH,EAAE,AACA,WAAY,CACV,EAAE;AA7GZ,AA8GU,QA9GF,CAkFN,KAAK,CAwBH,KAAK,CACH,EAAE,AACA,WAAY,CAEV,EAAE,CAAC;EACD,mBAAmB,EAAE,CAAC;CAAI;;AA/GtC,AAiHE,QAjHM,AAiHN,SAAU,CAAC;EACT,SAAS,EblGJ,OAAO;CakGa;;AAlH7B,AAmHE,QAnHM,AAmHN,UAAW,CAAC;EACV,SAAS,EbtGJ,OAAO;CasGc;;AApH9B,AAqHE,QArHM,AAqHN,SAAU,CAAC;EACT,SAAS,EbzGJ,MAAM;CayGc;;AC1F7B,AAAA,MAAM;AACN,AAAA,SAAS,CAAC;ET1CR,eAAe,EAAE,IAAI;EACrB,kBAAkB,EAAE,IAAI;EACxB,WAAW,EAAE,MAAM;EACnB,MAAM,EAAE,qBAAqB;EAC7B,aAAa,ELkDN,GAAG;EKjDV,UAAU,EAAE,IAAI;EAChB,OAAO,EAAE,WAAW;EACpB,SAAS,ELqBF,IAAI;EKpBX,MAAM,EAAE,MAAM;EACd,eAAe,EAAE,UAAU;EAC3B,WAAW,EAAE,GAAG;EAChB,cAAc,EAfW,mBAAmB;EAgB5C,YAAY,EAfe,mBAAmB;EAgB9C,aAAa,EAhBc,mBAAmB;EAiB9C,WAAW,EAlBc,mBAAmB;EAmB5C,QAAQ,EAAE,QAAQ;EAClB,cAAc,EAAE,GAAG;ESMnB,gBAAgB,EdfH,KAAgB;EcgB7B,YAAY,EdpBC,OAAe;EcqB5B,KAAK,EdzBQ,OAAe;Ec6C5B,UAAU,EAhDG,KAAK,CAAC,CAAC,CAAC,GAAG,CAAC,GAAG,CdDf,qBAAc;EckD3B,SAAS,EAAE,IAAI;EACf,KAAK,EAAE,IAAI;CAqBQ;;AA1BrB,ATvBE,MSuBI,ATvBX,MAAc,ESuBT,ATtBE,MSsBI,ATtBX,WAAmB,ESsBd,ATrBE,MSqBI,ATrBX,OAAe,ESqBV,ATpBE,MSoBI,ATpBX,UAAkB;ASqBb,ATxBE,SSwBO,ATxBd,MAAc;ASwBT,ATvBE,SSuBO,ATvBd,WAAmB;ASuBd,ATtBE,SSsBO,ATtBd,OAAe;ASsBV,ATrBE,SSqBO,ATrBd,UAAkB,CAAC;EACV,OAAO,EAAE,IAAI;CAAI;;ASmBrB,ATlBE,MSkBI,CTlBX,AAAA,QAAS,AAAA;ASmBJ,ATnBE,SSmBO,CTnBd,AAAA,QAAS,AAAA,EAAU;EACV,MAAM,EAAE,WAAW;CAAI;;ASiB3B,AAhBE,MAgBI,AAhBN,MAAS,EAgBT,AAfE,MAeI,AAfN,WAAc;AAgBd,AAjBE,SAiBO,AAjBT,MAAS;AAiBT,AAhBE,SAgBO,AAhBT,WAAc,CAAC;EACX,YAAY,EdzBD,OAAe;CcyBgB;;AAc9C,AAbE,MAaI,AAbN,MAAS,EAaT,AAZE,MAYI,AAZN,WAAc,EAYd,AAXE,MAWI,AAXN,OAAU,EAWV,AAVE,MAUI,AAVN,UAAa;AAWb,AAdE,SAcO,AAdT,MAAS;AAcT,AAbE,SAaO,AAbT,WAAc;AAad,AAZE,SAYO,AAZT,OAAU;AAYV,AAXE,SAWO,AAXT,UAAa,CAAC;EACV,YAAY,EdpBD,OAAmB;CcoBY;;AAS9C,AARE,MAQI,CARN,AAAA,QAAI,AAAA;AASJ,AATE,SASO,CATT,AAAA,QAAI,AAAA,EAAU;EACV,gBAAgB,Ed7BL,UAAe;Ec8B1B,YAAY,Ed9BD,UAAe;Ec+B1B,UAAU,EAAE,IAAI;EAChB,KAAK,EdpCM,OAAe;CcsCoB;;AAElD,AV0HI,MU1HE,CARL,AAAA,QAAG,AAAA,CVkID,kBAAoB;AUzHvB,AVyHI,SUzHK,CATR,AAAA,QAAG,AAAA,CVkID,kBAAoB,CAAW;EU5H5B,KAAK,EdtCI,wBAAe;CImKb;;AU3HjB,AV0HI,MU1HE,CARL,AAAA,QAAG,AAAA,CVkID,2BAA6B;AUzHhC,AVyHI,SUzHK,CATR,AAAA,QAAG,AAAA,CVkID,2BAA6B,CAAE;EU5H5B,KAAK,EdtCI,wBAAe;CImKb;;AU3HjB,AV0HI,MU1HE,CARL,AAAA,QAAG,AAAA,CVkID,iBAAmB;AUzHtB,AVyHI,SUzHK,CATR,AAAA,QAAG,AAAA,CVkID,iBAAmB,CAAY;EU5H5B,KAAK,EdtCI,wBAAe;CImKb;;AU3HjB,AV0HI,MU1HE,CARL,AAAA,QAAG,AAAA,CVkID,sBAAwB;AUzH3B,AVyHI,SUzHK,CATR,AAAA,QAAG,AAAA,CVkID,sBAAwB,CAAO;EU5H5B,KAAK,EdtCI,wBAAe;CImKb;;AU3HjB,AAME,MANI,CAML,AAAA,IAAG,CAAK,QAAQ,AAAb;AALJ,AAKE,SALO,CAKR,AAAA,IAAG,CAAK,QAAQ,AAAb,EAAe;EACf,aAAa,EAAE,QAAQ;CAAI;;AAP/B,AAWI,MAXE,AAWH,SAAW;AAVd,AAUI,SAVK,AAUN,SAAW,CAAI;EACZ,YAAY,Ed9CH,KAAgB;Cc8CF;;AAZ7B,AAWI,MAXE,AAWH,SAAW;AAVd,AAUI,SAVK,AAUN,SAAW,CAAI;EACZ,YAAY,Ed1DH,OAAc;Cc0DA;;AAZ7B,AAWI,MAXE,AAWH,SAAW;AAVd,AAUI,SAVK,AAUN,SAAW,CAAI;EACZ,YAAY,EdhDH,UAAe;CcgDD;;AAZ7B,AAWI,MAXE,AAWH,QAAU;AAVb,AAUI,SAVK,AAUN,QAAU,CAAK;EACZ,YAAY,EdtDH,OAAe;CcsDD;;AAZ7B,AAWI,MAXE,AAWH,WAAa;AAVhB,AAUI,SAVK,AAUN,WAAa,CAAE;EACZ,YAAY,EdzCH,OAAmB;CcyCL;;AAZ7B,AAWI,MAXE,AAWH,QAAU;AAVb,AAUI,SAVK,AAUN,QAAU,CAAK;EACZ,YAAY,EdxCH,OAAmB;CcwCL;;AAZ7B,AAWI,MAXE,AAWH,WAAa;AAVhB,AAUI,SAVK,AAUN,WAAa,CAAE;EACZ,YAAY,Ed1CH,OAAmB;Cc0CL;;AAZ7B,AAWI,MAXE,AAWH,WAAa;AAVhB,AAUI,SAVK,AAUN,WAAa,CAAE;EACZ,YAAY,Ed3CH,OAAmB;Cc2CL;;AAZ7B,AAWI,MAXE,AAWH,UAAY;AAVf,AAUI,SAVK,AAUN,UAAY,CAAG;EACZ,YAAY,EdtCH,OAAmB;CcsCL;;AAZ7B,AAcE,MAdI,AAcL,SAAW;AAbZ,AAaE,SAbO,AAaR,SAAW,CAAC;ET3BX,aAAa,ELyBA,GAAG;EKxBhB,SAAS,ELAF,OAAO;Cc2Ba;;AAf7B,AAgBE,MAhBI,AAgBL,UAAY;AAfb,AAeE,SAfO,AAeR,UAAY,CAAC;ET1BZ,SAAS,ELJF,OAAO;Cc+Bc;;AAjB9B,AAkBE,MAlBI,AAkBL,SAAW;AAjBZ,AAiBE,SAjBO,AAiBR,SAAW,CAAC;ET1BX,SAAS,ELPF,MAAM;CckCc;;AAnB7B,AAqBE,MArBI,AAqBL,aAAe;AApBhB,AAoBE,SApBO,AAoBR,aAAe,CAAC;EACb,OAAO,EAAE,KAAK;EACd,KAAK,EAAE,IAAI;CAAI;;AAvBnB,AAwBE,MAxBI,AAwBL,UAAY;AAvBb,AAuBE,SAvBO,AAuBR,UAAY,CAAC;EACV,OAAO,EAAE,MAAM;EACf,KAAK,EAAE,IAAI;CAAI;;AAEnB,AAAA,SAAS,CAAC;EACR,OAAO,EAAE,KAAK;EACd,SAAS,EAAE,IAAI;EACf,SAAS,EAAE,IAAI;EACf,OAAO,EAAE,OAAO;EAChB,MAAM,EAAE,QAAQ;CAKK;;AAVvB,AAME,SANO,AAMP,IAAM,EAAA,AAAA,AAAA,IAAC,AAAA,GAAO;EACZ,UAAU,EAAE,KAAK;EACjB,UAAU,EAAE,KAAK;CAAI;;AARzB,AASE,SATO,CASP,AAAA,IAAE,AAAA,EAAM;EACN,MAAM,EAAE,KAAK;CAAI;;AAErB,AAAA,SAAS;AACT,AAAA,MAAM,CAAC;EACL,MAAM,EAAE,OAAO;EACf,OAAO,EAAE,YAAY;EACrB,WAAW,EAAE,IAAI;EACjB,QAAQ,EAAE,QAAQ;CAOS;;AAZ7B,AAME,SANO,CAMP,KAAK;AALP,AAKE,MALI,CAKJ,KAAK,CAAC;EACJ,MAAM,EAAE,OAAO;CAAI;;AAPvB,AAQE,SARO,AAQR,MAAQ;AAPT,AAOE,MAPI,AAOL,MAAQ,CAAC;EACN,KAAK,Ed3FM,OAAe;Cc2FE;;AAThC,AAUE,SAVO,CAUR,AAAA,QAAG,AAAA;AATJ,AASE,MATI,CASL,AAAA,QAAG,AAAA,EAAU;EACV,KAAK,Ed3FM,OAAe;Ec4F1B,MAAM,EAAE,WAAW;CAAI;;AAE3B,AACM,MADA,GACA,MAAM,CAAC;EACT,WAAW,EAAE,KAAK;CAAI;;AAE1B,AAAA,OAAO,CAAC;EACN,OAAO,EAAE,YAAY;EACrB,SAAS,EAAE,IAAI;EACf,QAAQ,EAAE,QAAQ;EAClB,cAAc,EAAE,GAAG;CAuEc;;AA3EnC,AAKE,OALK,AAKL,IAAM,CAAA,AAAA,YAAY,EAAE;EAClB,MAAM,EAAE,MAAM;CAMI;;AAZtB,AAOI,OAPG,AAKL,IAAM,CAAA,AAAA,YAAY,CAEhB,OAAQ,CAAC;EVhHX,MAAM,EAAE,GAAG,CAAC,KAAK,CJkBJ,OAAmB;EIjBhC,YAAY,EAAE,CAAC;EACf,UAAU,EAAE,CAAC;EACb,OAAO,EAAE,GAAG;EACZ,OAAO,EAAE,KAAK;EACd,MAAM,EAAE,KAAK;EACb,cAAc,EAAE,IAAI;EACpB,QAAQ,EAAE,QAAQ;EAClB,SAAS,EAAE,cAAc;EACzB,KAAK,EAAE,KAAK;EUyGR,UAAU,EAAE,QAAQ;EACpB,KAAK,EAAE,OAAO;EACd,GAAG,EAAE,GAAG;EACR,OAAO,EAAE,CAAC;CAAI;;AAZpB,AAaE,OAbK,CAaL,MAAM,CAAC;EThHP,eAAe,EAAE,IAAI;EACrB,kBAAkB,EAAE,IAAI;EACxB,WAAW,EAAE,MAAM;EACnB,MAAM,EAAE,qBAAqB;EAC7B,aAAa,ELkDN,GAAG;EKjDV,UAAU,EAAE,IAAI;EAChB,OAAO,EAAE,WAAW;EACpB,SAAS,ELqBF,IAAI;EKpBX,MAAM,EAAE,MAAM;EACd,eAAe,EAAE,UAAU;EAC3B,WAAW,EAAE,GAAG;EAChB,cAAc,EAfW,mBAAmB;EAgB5C,YAAY,EAfe,mBAAmB;EAgB9C,aAAa,EAhBc,mBAAmB;EAiB9C,WAAW,EAlBc,mBAAmB;EAmB5C,QAAQ,EAAE,QAAQ;EAClB,cAAc,EAAE,GAAG;ESMnB,gBAAgB,EdfH,KAAgB;EcgB7B,YAAY,EdpBC,OAAe;EcqB5B,KAAK,EdzBQ,OAAe;EcmH1B,MAAM,EAAE,OAAO;EACf,OAAO,EAAE,KAAK;EACd,SAAS,EAAE,GAAG;EACd,SAAS,EAAE,IAAI;EACf,OAAO,EAAE,IAAI;CAkBiB;;AArClC,AAaE,OAbK,CAaL,MAAM,AT9Fb,MAAc,ESiFT,AAaE,OAbK,CAaL,MAAM,AT7Fb,WAAmB,ESgFd,AAaE,OAbK,CAaL,MAAM,AT5Fb,OAAe,ES+EV,AAaE,OAbK,CAaL,MAAM,AT3Fb,UAAkB,CAAC;EACV,OAAO,EAAE,IAAI;CAAI;;AS6ErB,AAaE,OAbK,CAaL,MAAM,CTzFb,AAAA,QAAS,AAAA,EAAU;EACV,MAAM,EAAE,WAAW;CAAI;;AS2E3B,AAaE,OAbK,CAaL,MAAM,AAvFR,MAAS,EA0ET,AAaE,OAbK,CAaL,MAAM,AAtFR,WAAc,CAAC;EACX,YAAY,EdzBD,OAAe;CcyBgB;;AAwE9C,AAaE,OAbK,CAaL,MAAM,AApFR,MAAS,EAuET,AAaE,OAbK,CAaL,MAAM,AAnFR,WAAc,EAsEd,AAaE,OAbK,CAaL,MAAM,AAlFR,OAAU,EAqEV,AAaE,OAbK,CAaL,MAAM,AAjFR,UAAa,CAAC;EACV,YAAY,EdpBD,OAAmB;CcoBY;;AAmE9C,AAaE,OAbK,CAaL,MAAM,CA/ER,AAAA,QAAI,AAAA,EAAU;EACV,gBAAgB,Ed7BL,UAAe;Ec8B1B,YAAY,Ed9BD,UAAe;Ec+B1B,UAAU,EAAE,IAAI;EAChB,KAAK,EdpCM,OAAe;CcsCoB;;AA4DlD,AAaE,OAbK,CAaL,MAAM,CA/ER,AAAA,QAAI,AAAA,CVkIA,kBAAmB,CAAW;EU5H5B,KAAK,EdtCI,wBAAe;CImKb;;AUjEjB,AAaE,OAbK,CAaL,MAAM,CA/ER,AAAA,QAAI,AAAA,CVkIA,2BAA4B,CAAE;EU5H5B,KAAK,EdtCI,wBAAe;CImKb;;AUjEjB,AAaE,OAbK,CAaL,MAAM,CA/ER,AAAA,QAAI,AAAA,CVkIA,iBAAkB,CAAY;EU5H5B,KAAK,EdtCI,wBAAe;CImKb;;AUjEjB,AAaE,OAbK,CAaL,MAAM,CA/ER,AAAA,QAAI,AAAA,CVkIA,sBAAuB,CAAO;EU5H5B,KAAK,EdtCI,wBAAe;CImKb;;AUjEjB,AAaE,OAbK,CAaL,MAAM,AAOJ,MAAO,CAAC;EACN,YAAY,EdtHH,OAAe;CcsHkB;;AArBhD,AAaE,OAbK,CAaL,MAAM,AASJ,MAAO,EAtBX,AAaE,OAbK,CAaL,MAAM,AAUJ,WAAY,EAvBhB,AAaE,OAbK,CAaL,MAAM,AAWJ,OAAQ,EAxBZ,AAaE,OAbK,CAaL,MAAM,AAYJ,UAAW,CAAC;EACV,YAAY,EdjHH,OAAmB;CciHc;;AA1BhD,AAaE,OAbK,CAaL,MAAM,AAcJ,YAAa,CAAC;EACZ,OAAO,EAAE,IAAI;CAAI;;AA5BvB,AAaE,OAbK,CAaL,MAAM,CAgBJ,AAAA,QAAE,AAAA,CAAS,MAAM,CAAC;EAChB,YAAY,Ed5HH,UAAe;Cc4HqB;;AA9BnD,AAaE,OAbK,CAaL,MAAM,AAkBJ,IAAM,EAAA,AAAA,AAAA,QAAC,AAAA,GAAW;EAChB,aAAa,EAAE,KAAK;CAAI;;AAhC9B,AAaE,OAbK,CAaL,MAAM,CAoBJ,AAAA,QAAE,AAAA,EAAU;EACV,MAAM,EAAE,KAAK;EACb,OAAO,EAAE,CAAC;CAEgB;;AArChC,AAoCM,OApCC,CAaL,MAAM,CAoBJ,AAAA,QAAE,AAAA,EAGA,MAAM,CAAC;EACL,OAAO,EAAE,SAAS;CAAI;;AArC9B,AAwCI,OAxCG,AAuCL,MAAO,AACL,OAAQ,CAAC;EACP,YAAY,Ed7IH,OAAe;Cc6IW;;AAzCzC,AA6Ce,OA7CR,AA6CH,SAAU,CAAC,MAAM,CAAI;EACnB,YAAY,Ed1IH,KAAgB;Cc0IF;;AA9C7B,AA6Ce,OA7CR,AA6CH,SAAU,CAAC,MAAM,CAAI;EACnB,YAAY,EdtJH,OAAc;CcsJA;;AA9C7B,AA6Ce,OA7CR,AA6CH,SAAU,CAAC,MAAM,CAAI;EACnB,YAAY,Ed5IH,UAAe;Cc4ID;;AA9C7B,AA6Cc,OA7CP,AA6CH,QAAS,CAAC,MAAM,CAAK;EACnB,YAAY,EdlJH,OAAe;CckJD;;AA9C7B,AA6CiB,OA7CV,AA6CH,WAAY,CAAC,MAAM,CAAE;EACnB,YAAY,EdrIH,OAAmB;CcqIL;;AA9C7B,AA6Cc,OA7CP,AA6CH,QAAS,CAAC,MAAM,CAAK;EACnB,YAAY,EdpIH,OAAmB;CcoIL;;AA9C7B,AA6CiB,OA7CV,AA6CH,WAAY,CAAC,MAAM,CAAE;EACnB,YAAY,EdtIH,OAAmB;CcsIL;;AA9C7B,AA6CiB,OA7CV,AA6CH,WAAY,CAAC,MAAM,CAAE;EACnB,YAAY,EdvIH,OAAmB;CcuIL;;AA9C7B,AA6CgB,OA7CT,AA6CH,UAAW,CAAC,MAAM,CAAG;EACnB,YAAY,EdlIH,OAAmB;CckIL;;AA9C7B,AAgDE,OAhDK,AAgDL,SAAU,CAAC;ETvHX,aAAa,ELyBA,GAAG;EKxBhB,SAAS,ELAF,OAAO;CcuHa;;AAjD7B,AAkDE,OAlDK,AAkDL,UAAW,CAAC;ETtHZ,SAAS,ELJF,OAAO;Cc2Hc;;AAnD9B,AAoDE,OApDK,AAoDL,SAAU,CAAC;ETtHX,SAAS,ELPF,MAAM;Cc8Hc;;AArD7B,AAwDI,OAxDG,AAuDL,YAAa,AACX,OAAQ,CAAC;EACP,YAAY,Ed3JH,OAAe;Cc2Jc;;AAzD5C,AA0DE,OA1DK,AA0DL,aAAc,CAAC;EACb,KAAK,EAAE,IAAI;CAEQ;;AA7DvB,AA4DI,OA5DG,AA0DL,aAAc,CAEZ,MAAM,CAAC;EACL,KAAK,EAAE,IAAI;CAAI;;AA7DrB,AA+DI,OA/DG,AA8DL,WAAY,AACV,OAAQ,CAAC;EVvBX,SAAS,EAAE,gCAAgC;EAC3C,MAAM,EAAE,GAAG,CAAC,KAAK,CJzIJ,OAAe;EI0I5B,aAAa,EAAE,QAAQ;EACvB,kBAAkB,EAAE,WAAW;EAC/B,gBAAgB,EAAE,WAAW;EAC7B,OAAO,EAAE,EAAE;EACX,OAAO,EAAE,KAAK;EACd,MAAM,EAAE,GAAG;EACX,QAAQ,EAAE,QAAQ;EAClB,KAAK,EAAE,GAAG;EUgBN,UAAU,EAAE,CAAC;EACb,QAAQ,EAAE,QAAQ;EAClB,KAAK,EAAE,OAAO;EACd,GAAG,EAAE,OAAO;EACZ,SAAS,EAAE,IAAI;CAAI;;AArEzB,AAsEI,OAtEG,AA8DL,WAAY,AAQV,SAAU,AAAA,MAAM,CAAC;EACf,SAAS,Ed7IN,OAAO;Cc6Ie;;AAvE/B,AAwEI,OAxEG,AA8DL,WAAY,AAUV,UAAW,AAAA,MAAM,CAAC;EAChB,SAAS,EdjJN,OAAO;CciJgB;;AAzEhC,AA0EI,OA1EG,AA8DL,WAAY,AAYV,SAAU,AAAA,MAAM,CAAC;EACf,SAAS,EdpJN,MAAM;CcoJgB;;AAE/B,AAAA,MAAM,CAAC;EACL,KAAK,EdlLQ,OAAe;EcmL5B,OAAO,EAAE,KAAK;EACd,SAAS,EdvJF,IAAI;EcwJX,WAAW,EdjJC,GAAG;Cc0Jc;;AAb/B,AAKE,MALI,AAKJ,IAAM,CAAA,AAAA,WAAW,EAAE;EACjB,aAAa,EAAE,KAAK;CAAI;;AAN5B,AAQE,MARI,AAQJ,SAAU,CAAC;EACT,SAAS,Ed5JJ,OAAO;Cc4Ja;;AAT7B,AAUE,MAVI,AAUJ,UAAW,CAAC;EACV,SAAS,EdhKJ,OAAO;CcgKc;;AAX9B,AAYE,MAZI,AAYJ,SAAU,CAAC;EACT,SAAS,EdnKJ,MAAM;CcmKc;;AAE7B,AAAA,KAAK,CAAC;EACJ,OAAO,EAAE,KAAK;EACd,SAAS,EdpKF,OAAO;EcqKd,UAAU,EAAE,OAAO;CAIK;;AAP1B,AAMI,KANC,AAMD,SAAU,CAAI;EACZ,KAAK,Ed/LI,KAAgB;Cc+LT;;AAPtB,AAMI,KANC,AAMD,SAAU,CAAI;EACZ,KAAK,Ed3MI,OAAc;Cc2MP;;AAPtB,AAMI,KANC,AAMD,SAAU,CAAI;EACZ,KAAK,EdjMI,UAAe;CciMR;;AAPtB,AAMI,KANC,AAMD,QAAS,CAAK;EACZ,KAAK,EdvMI,OAAe;CcuMR;;AAPtB,AAMI,KANC,AAMD,WAAY,CAAE;EACZ,KAAK,Ed1LI,OAAmB;Cc0LZ;;AAPtB,AAMI,KANC,AAMD,QAAS,CAAK;EACZ,KAAK,EdzLI,OAAmB;CcyLZ;;AAPtB,AAMI,KANC,AAMD,WAAY,CAAE;EACZ,KAAK,Ed3LI,OAAmB;Cc2LZ;;AAPtB,AAMI,KANC,AAMD,WAAY,CAAE;EACZ,KAAK,Ed5LI,OAAmB;Cc4LZ;;AAPtB,AAMI,KANC,AAMD,UAAW,CAAG;EACZ,KAAK,EdvLI,OAAmB;CcuLZ;;AAItB,AACE,MADI,AACJ,IAAM,CAAA,AAAA,WAAW,EAAE;EACjB,aAAa,EAAE,OAAO;CAAI;;AAF9B,AAIE,MAJI,AAIJ,WAAY,CAAC;EACX,OAAO,EAAE,IAAI;EACb,eAAe,EAAE,UAAU;CAuCD;;AA7C9B,AAOI,MAPE,AAIJ,WAAY,CAGV,QAAQ,AACN,IAAM,CAAA,AAAA,WAAW,EAAE;EACjB,YAAY,EAAE,IAAI;CAAI;;AAT9B,AAWQ,MAXF,AAIJ,WAAY,CAGV,QAAQ,AAGN,YAAa,CACX,OAAO;AAXf,AAYQ,MAZF,AAIJ,WAAY,CAGV,QAAQ,AAGN,YAAa,CAEX,MAAM;AAZd,AAagB,MAbV,AAIJ,WAAY,CAGV,QAAQ,AAGN,YAAa,CAGX,OAAO,CAAC,MAAM,CAAC;EACb,yBAAyB,EdlK1B,GAAG;EcmKF,sBAAsB,EdnKvB,GAAG;CcmKsC;;AAflD,AAiBQ,MAjBF,AAIJ,WAAY,CAGV,QAAQ,AASN,WAAY,CACV,OAAO;AAjBf,AAkBQ,MAlBF,AAIJ,WAAY,CAGV,QAAQ,AASN,WAAY,CAEV,MAAM;AAlBd,AAmBgB,MAnBV,AAIJ,WAAY,CAGV,QAAQ,AASN,WAAY,CAGV,OAAO,CAAC,MAAM,CAAC;EACb,0BAA0B,EdxK3B,GAAG;EcyKF,uBAAuB,EdzKxB,GAAG;CcyKuC;;AArBnD,AAsBM,MAtBA,AAIJ,WAAY,CAGV,QAAQ,CAeN,OAAO;AAtBb,AAuBM,MAvBA,AAIJ,WAAY,CAGV,QAAQ,CAgBN,MAAM;AAvBZ,AAwBc,MAxBR,AAIJ,WAAY,CAGV,QAAQ,CAiBN,OAAO,CAAC,MAAM,CAAC;EACb,aAAa,EAAE,CAAC;CAUM;;AAnC9B,AAsBM,MAtBA,AAIJ,WAAY,CAGV,QAAQ,CAeN,OAAO,AAIP,MAAS,EA1Bf,AAsBM,MAtBA,AAIJ,WAAY,CAGV,QAAQ,CAeN,OAAO,AAKP,WAAc;AA3BpB,AAuBM,MAvBA,AAIJ,WAAY,CAGV,QAAQ,CAgBN,MAAM,AAGN,MAAS;AA1Bf,AAuBM,MAvBA,AAIJ,WAAY,CAGV,QAAQ,CAgBN,MAAM,AAIN,WAAc;AA3BpB,AAwBc,MAxBR,AAIJ,WAAY,CAGV,QAAQ,CAiBN,OAAO,CAAC,MAAM,AAEd,MAAS;AA1Bf,AAwBc,MAxBR,AAIJ,WAAY,CAGV,QAAQ,CAiBN,OAAO,CAAC,MAAM,AAGd,WAAc,CAAC;EACX,OAAO,EAAE,CAAC;CAAI;;AA5BxB,AAsBM,MAtBA,AAIJ,WAAY,CAGV,QAAQ,CAeN,OAAO,AAOP,MAAS,EA7Bf,AAsBM,MAtBA,AAIJ,WAAY,CAGV,QAAQ,CAeN,OAAO,AAQP,WAAc,EA9BpB,AAsBM,MAtBA,AAIJ,WAAY,CAGV,QAAQ,CAeN,OAAO,AASP,OAAU,EA/BhB,AAsBM,MAtBA,AAIJ,WAAY,CAGV,QAAQ,CAeN,OAAO,AAUP,UAAa;AAhCnB,AAuBM,MAvBA,AAIJ,WAAY,CAGV,QAAQ,CAgBN,MAAM,AAMN,MAAS;AA7Bf,AAuBM,MAvBA,AAIJ,WAAY,CAGV,QAAQ,CAgBN,MAAM,AAON,WAAc;AA9BpB,AAuBM,MAvBA,AAIJ,WAAY,CAGV,QAAQ,CAgBN,MAAM,AAQN,OAAU;AA/BhB,AAuBM,MAvBA,AAIJ,WAAY,CAGV,QAAQ,CAgBN,MAAM,AASN,UAAa;AAhCnB,AAwBc,MAxBR,AAIJ,WAAY,CAGV,QAAQ,CAiBN,OAAO,CAAC,MAAM,AAKd,MAAS;AA7Bf,AAwBc,MAxBR,AAIJ,WAAY,CAGV,QAAQ,CAiBN,OAAO,CAAC,MAAM,AAMd,WAAc;AA9BpB,AAwBc,MAxBR,AAIJ,WAAY,CAGV,QAAQ,CAiBN,OAAO,CAAC,MAAM,AAOd,OAAU;AA/BhB,AAwBc,MAxBR,AAIJ,WAAY,CAGV,QAAQ,CAiBN,OAAO,CAAC,MAAM,AAQd,UAAa,CAAC;EACV,OAAO,EAAE,CAAC;CAEQ;;AAnC5B,AAsBM,MAtBA,AAIJ,WAAY,CAGV,QAAQ,CAeN,OAAO,AAOP,MAAS,AAKhB,MAAkB,EAlCjB,AAsBM,MAtBA,AAIJ,WAAY,CAGV,QAAQ,CAeN,OAAO,AAQP,WAAc,AAIrB,MAAkB,EAlCjB,AAsBM,MAtBA,AAIJ,WAAY,CAGV,QAAQ,CAeN,OAAO,AASP,OAAU,AAGjB,MAAkB,EAlCjB,AAsBM,MAtBA,AAIJ,WAAY,CAGV,QAAQ,CAeN,OAAO,AAUP,UAAa,AAEpB,MAAkB;AAlCjB,AAuBM,MAvBA,AAIJ,WAAY,CAGV,QAAQ,CAgBN,MAAM,AAMN,MAAS,AAKhB,MAAkB;AAlCjB,AAuBM,MAvBA,AAIJ,WAAY,CAGV,QAAQ,CAgBN,MAAM,AAON,WAAc,AAIrB,MAAkB;AAlCjB,AAuBM,MAvBA,AAIJ,WAAY,CAGV,QAAQ,CAgBN,MAAM,AAQN,OAAU,AAGjB,MAAkB;AAlCjB,AAuBM,MAvBA,AAIJ,WAAY,CAGV,QAAQ,CAgBN,MAAM,AASN,UAAa,AAEpB,MAAkB;AAlCjB,AAwBc,MAxBR,AAIJ,WAAY,CAGV,QAAQ,CAiBN,OAAO,CAAC,MAAM,AAKd,MAAS,AAKhB,MAAkB;AAlCjB,AAwBc,MAxBR,AAIJ,WAAY,CAGV,QAAQ,CAiBN,OAAO,CAAC,MAAM,AAMd,WAAc,AAIrB,MAAkB;AAlCjB,AAwBc,MAxBR,AAIJ,WAAY,CAGV,QAAQ,CAiBN,OAAO,CAAC,MAAM,AAOd,OAAU,AAGjB,MAAkB;AAlCjB,AAwBc,MAxBR,AAIJ,WAAY,CAGV,QAAQ,CAiBN,OAAO,CAAC,MAAM,AAQd,UAAa,AAEpB,MAAkB,CAAC;EACN,OAAO,EAAE,CAAC;CAAI;;AAnC1B,AAOI,MAPE,AAIJ,WAAY,CAGV,QAAQ,AA6BN,YAAa,CAAC;EACZ,SAAS,EAAE,CAAC;CAAI;;AArCxB,AAsCI,MAtCE,AAIJ,WAAY,AAkCV,oBAAqB,CAAC;EACpB,eAAe,EAAE,MAAM;CAAI;;AAvCjC,AAwCI,MAxCE,AAIJ,WAAY,AAoCV,iBAAkB,CAAC;EACjB,eAAe,EAAE,QAAQ;CAAI;;AAzCnC,AA2CM,MA3CA,AAIJ,WAAY,AAsCV,qBAAsB,CACpB,QAAQ,CAAC;EACP,SAAS,EAAE,CAAC;EACZ,WAAW,EAAE,CAAC;CAAI;;AA7C1B,AA8CE,MA9CI,AA8CJ,WAAY,CAAC;EACX,OAAO,EAAE,IAAI;EACb,eAAe,EAAE,UAAU;CAsBC;;AAtEhC,AAiDQ,MAjDF,AA8CJ,WAAY,GAGN,QAAQ,CAAC;EACX,WAAW,EAAE,CAAC;CAMQ;;AAxD5B,AAiDQ,MAjDF,AA8CJ,WAAY,GAGN,QAAQ,AAEV,IAAM,CAAA,AAAA,WAAW,EAAE;EACjB,aAAa,EAAE,CAAC;EAChB,YAAY,EAAE,OAAO;CAAI;;AArDjC,AAiDQ,MAjDF,AA8CJ,WAAY,GAGN,QAAQ,AAKV,YAAa,CAAC;EACZ,SAAS,EAAE,CAAC;EACZ,WAAW,EAAE,CAAC;CAAI;;AAxD1B,AAyDI,MAzDE,AA8CJ,WAAY,AAWV,oBAAqB,CAAC;EACpB,eAAe,EAAE,MAAM;CAAI;;AA1DjC,AA2DI,MA3DE,AA8CJ,WAAY,AAaV,iBAAkB,CAAC;EACjB,eAAe,EAAE,QAAQ;CAAI;;AA5DnC,AA6DI,MA7DE,AA8CJ,WAAY,AAeV,qBAAsB,CAAC;EACrB,SAAS,EAAE,IAAI;CAQS;;AAtE9B,AA+DU,MA/DJ,AA8CJ,WAAY,AAeV,qBAAsB,GAEhB,QAAQ,AACV,WAAY,EAhEpB,AA+DU,MA/DJ,AA8CJ,WAAY,AAeV,qBAAsB,GAEhB,QAAQ,AAEV,IAAM,CAAA,AAAA,WAAW,EAAE;EACjB,aAAa,EAAE,OAAO;CAAI;;AAlEpC,AAmEM,MAnEA,AA8CJ,WAAY,AAeV,qBAAsB,AAMpB,WAAY,CAAC;EACX,aAAa,EAAE,QAAQ;CAAI;;AApEnC,AAqEM,MArEA,AA8CJ,WAAY,AAeV,qBAAsB,AAQpB,IAAM,CAAA,AAAA,WAAW,EAAE;EACjB,aAAa,EAAE,CAAC;CAAI;;AVpF1B,MAAM,CAAC,MAAM,MAAM,SAAS,EAAE,KAAK,GAAG,KAAK;EUc7C,AAwEE,MAxEI,AAwEJ,cAAe,CAAC;IAEZ,OAAO,EAAE,IAAI;GAAM;;;AAEzB,AACE,YADU,CACV,MAAM,CAAC;EACL,SAAS,EAAE,OAAO;CAAI;;AVhGxB,MAAM,CAAC,MAAM,MAAM,SAAS,EAAE,KAAK;EU8FrC,AAAA,YAAY,CAAC;IAIT,aAAa,EAAE,MAAM;GAiBS;;;AV/GhC,MAAM,CAAC,MAAM,MAAM,SAAS,EAAE,KAAK,GAAG,KAAK;EU0F7C,AAAA,YAAY,CAAC;IAMT,UAAU,EAAE,CAAC;IACb,SAAS,EAAE,CAAC;IACZ,WAAW,EAAE,CAAC;IACd,YAAY,EAAE,MAAM;IACpB,UAAU,EAAE,KAAK;GAWa;EArBlC,AAWI,YAXQ,AAWR,SAAU,CAAC;IACT,SAAS,EdrQN,OAAO;IcsQV,WAAW,EAAE,OAAO;GAAI;EAb9B,AAcI,YAdQ,AAcR,UAAW,CAAC;IACV,WAAW,EAAE,OAAO;GAAI;EAf9B,AAgBI,YAhBQ,AAgBR,UAAW,CAAC;IACV,SAAS,Ed5QN,OAAO;Ic6QV,WAAW,EAAE,OAAO;GAAI;EAlB9B,AAmBI,YAnBQ,AAmBR,SAAU,CAAC;IACT,SAAS,EdhRN,MAAM;IciRT,WAAW,EAAE,OAAO;GAAI;;;AAE9B,AACS,WADE,CACT,MAAM,CAAC,MAAM,CAAC;EACZ,aAAa,EAAE,CAAC;CAAI;;AVnHtB,MAAM,CAAC,MAAM,MAAM,SAAS,EAAE,KAAK,GAAG,KAAK;EUiH7C,AAAA,WAAW,CAAC;IAIR,OAAO,EAAE,IAAI;IACb,UAAU,EAAE,CAAC;IACb,SAAS,EAAE,CAAC;IACZ,WAAW,EAAE,CAAC;GAQqB;EAfvC,AAQI,WARO,CAQP,MAAM,CAAC;IACL,aAAa,EAAE,CAAC;GAAI;EAT1B,AAUQ,WAVG,GAUH,MAAM,CAAC;IACT,WAAW,EAAE,CAAC;GAIe;EAfnC,AAUQ,WAVG,GAUH,MAAM,AAER,IAAM,CAAA,AAAA,UAAU,EAAE;IAChB,SAAS,EAAE,CAAC;GAAI;EAbxB,AAUQ,WAVG,GAUH,MAAM,AAIR,IAAM,CAAA,AAAA,WAAW,EAAE;IACjB,YAAY,EAAE,OAAO;GAAI;;;AAEjC,AAAA,QAAQ,CAAC;EACP,SAAS,EdnSF,IAAI;EcoSX,QAAQ,EAAE,QAAQ;EAClB,UAAU,EAAE,IAAI;CA+EiB;;AAlFnC,AAOI,QAPI,AAMN,SAAU,CACR,KAAK,CAAC;EACJ,KAAK,EdnUI,OAAe;EcoUxB,MAAM,EAAE,MAAM;EACd,cAAc,EAAE,IAAI;EACpB,QAAQ,EAAE,QAAQ;EAClB,GAAG,EAAE,CAAC;EACN,KAAK,EAAE,MAAM;EACb,OAAO,EAAE,CAAC;CAAI;;AAdpB,AAiBY,QAjBJ,AAMN,SAAU,CASR,MAAM,AACJ,MAAO,GACD,KAAK,CAAC;EACR,KAAK,Ed/UA,OAAe;Cc+Uc;;AAlB5C,AAoBY,QApBJ,AAMN,SAAU,CASR,MAAM,AAIJ,SAAU,GACJ,KAAK,CAAC;EACR,SAAS,EdtTV,OAAO;CcsTmB;;AArBnC,AAuBY,QAvBJ,AAMN,SAAU,CASR,MAAM,AAOJ,UAAW,GACL,KAAK,CAAC;EACR,SAAS,Ed3TV,OAAO;Cc2ToB;;AAxBpC,AA0BY,QA1BJ,AAMN,SAAU,CASR,MAAM,AAUJ,SAAU,GACJ,KAAK,CAAC;EACR,SAAS,Ed/TV,MAAM;Cc+ToB;;AA3BnC,AA6BM,QA7BE,AAMN,SAAU,AAsBR,IAAM,CAAA,AAAA,eAAe,EACnB,KAAK,CAAC;EACJ,IAAI,EAAE,CAAC;CAAI;;AA9BnB,AA+BM,QA/BE,AAMN,SAAU,AAsBR,IAAM,CAAA,AAAA,eAAe,EAGnB,MAAM,CAAC;EACL,YAAY,EAAE,MAAM;CAAI;;AAhChC,AAkCM,QAlCE,AAMN,SAAU,AA2BR,eAAgB,CACd,KAAK,CAAC;EACJ,KAAK,EAAE,CAAC;CAAI;;AAnCpB,AAoCM,QApCE,AAMN,SAAU,AA2BR,eAAgB,CAGd,MAAM,CAAC;EACL,aAAa,EAAE,MAAM;CAAI;;AArCjC,AA2CY,QA3CJ,AAsCN,eAAgB,CAEd,MAAM,AAEP,MAAU,GACD,KAAK;AA3CjB,AA2CY,QA3CJ,AAsCN,eAAgB,CAGd,OAAO,AACR,MAAU,GACD,KAAK,EA3CjB,AA2CY,QA3CJ,AAuCN,gBAAiB,CACf,MAAM,AAEP,MAAU,GACD,KAAK;AA3CjB,AA2CY,QA3CJ,AAuCN,gBAAiB,CAEf,OAAO,AACR,MAAU,GACD,KAAK,CAAC;EACR,KAAK,EdzWA,OAAe;CcyWc;;AA5C5C,AA6CmB,QA7CX,AAsCN,eAAgB,CAEd,MAAM,AAKP,SAAa,GAAG,KAAK;AA7CxB,AA6CmB,QA7CX,AAsCN,eAAgB,CAGd,OAAO,AAIR,SAAa,GAAG,KAAK,EA7CxB,AA6CmB,QA7CX,AAuCN,gBAAiB,CACf,MAAM,AAKP,SAAa,GAAG,KAAK;AA7CxB,AA6CmB,QA7CX,AAuCN,gBAAiB,CAEf,OAAO,AAIR,SAAa,GAAG,KAAK,CAAC;EACjB,SAAS,Ed/UR,OAAO;Cc+UiB;;AA9CjC,AA+CoB,QA/CZ,AAsCN,eAAgB,CAEd,MAAM,AAOP,UAAc,GAAG,KAAK;AA/CzB,AA+CoB,QA/CZ,AAsCN,eAAgB,CAGd,OAAO,AAMR,UAAc,GAAG,KAAK,EA/CzB,AA+CoB,QA/CZ,AAuCN,gBAAiB,CACf,MAAM,AAOP,UAAc,GAAG,KAAK;AA/CzB,AA+CoB,QA/CZ,AAuCN,gBAAiB,CAEf,OAAO,AAMR,UAAc,GAAG,KAAK,CAAC;EAClB,SAAS,EdnVR,OAAO;CcmVkB;;AAhDlC,AAiDmB,QAjDX,AAsCN,eAAgB,CAEd,MAAM,AASP,SAAa,GAAG,KAAK;AAjDxB,AAiDmB,QAjDX,AAsCN,eAAgB,CAGd,OAAO,AAQR,SAAa,GAAG,KAAK,EAjDxB,AAiDmB,QAjDX,AAuCN,gBAAiB,CACf,MAAM,AASP,SAAa,GAAG,KAAK;AAjDxB,AAiDmB,QAjDX,AAuCN,gBAAiB,CAEf,OAAO,AAQR,SAAa,GAAG,KAAK,CAAC;EACjB,SAAS,EdtVR,MAAM;CcsVkB;;AAlDjC,AAmDI,QAnDI,AAsCN,eAAgB,CAad,KAAK,EAnDT,AAmDI,QAnDI,AAuCN,gBAAiB,CAYf,KAAK,CAAC;EACJ,KAAK,Ed/WI,OAAe;EcgXxB,MAAM,EAAE,MAAM;EACd,cAAc,EAAE,IAAI;EACpB,QAAQ,EAAE,QAAQ;EAClB,GAAG,EAAE,CAAC;EACN,KAAK,EAAE,MAAM;EACb,OAAO,EAAE,CAAC;CAAI;;AA1DpB,AA4DI,QA5DI,AA2DN,eAAgB,CACd,MAAM;AA5DV,AA6DY,QA7DJ,AA2DN,eAAgB,CAEd,OAAO,CAAC,MAAM,CAAC;EACb,YAAY,EAAE,MAAM;CAAI;;AA9D9B,AA+DI,QA/DI,AA2DN,eAAgB,CAId,KAAK,AAAA,QAAQ,CAAC;EACZ,IAAI,EAAE,CAAC;CAAI;;AAhEjB,AAkEI,QAlEI,AAiEN,gBAAiB,CACf,MAAM;AAlEV,AAmEY,QAnEJ,AAiEN,gBAAiB,CAEf,OAAO,CAAC,MAAM,CAAC;EACb,aAAa,EAAE,MAAM;CAAI;;AApE/B,AAqEI,QArEI,AAiEN,gBAAiB,CAIf,KAAK,AAAA,SAAS,CAAC;EACb,KAAK,EAAE,CAAC;CAAI;;AAtElB,AAwEI,QAxEI,AAuEN,WAAY,AACV,OAAQ,CAAC;EV3PX,SAAS,EAAE,gCAAgC;EAC3C,MAAM,EAAE,GAAG,CAAC,KAAK,CJzIJ,OAAe;EI0I5B,aAAa,EAAE,QAAQ;EACvB,kBAAkB,EAAE,WAAW;EAC/B,gBAAgB,EAAE,WAAW;EAC7B,OAAO,EAAE,EAAE;EACX,OAAO,EAAE,KAAK;EACd,MAAM,EAAE,GAAG;EACX,QAAQ,EAAE,QAAQ;EAClB,KAAK,EAAE,GAAG;EUoPN,QAAQ,EAAE,mBAAmB;EAC7B,KAAK,EAAE,OAAO;EACd,GAAG,EAAE,OAAO;CAAI;;AA5EtB,AA6EI,QA7EI,AAuEN,WAAY,AAMV,SAAU,AAAA,MAAM,CAAC;EACf,SAAS,Ed/WN,OAAO;Cc+We;;AA9E/B,AA+EI,QA/EI,AAuEN,WAAY,AAQV,UAAW,AAAA,MAAM,CAAC;EAChB,SAAS,EdnXN,OAAO;CcmXgB;;AAhFhC,AAiFI,QAjFI,AAuEN,WAAY,AAUV,SAAU,AAAA,MAAM,CAAC;EACf,SAAS,EdtXN,MAAM;CcsXgB;;AClZ/B,AAAA,KAAK,CAAC;EACJ,WAAW,EAAE,MAAM;EACnB,OAAO,EAAE,WAAW;EACpB,eAAe,EAAE,MAAM;EACvB,MAAM,EATU,MAAM;EAUtB,KAAK,EAVW,MAAM;CA4BK;;AAvB7B,AAME,KANG,CAMH,GAAG,CAAC;EACF,SAAS,EAAE,IAAI;CAAI;;AAPvB,AASE,KATG,AASH,SAAU,CAAC;EACT,MAAM,EAdc,IAAI;EAexB,KAAK,EAfe,IAAI;CAiBD;;AAb3B,AAYI,KAZC,AASH,SAAU,CAGR,GAAG,CAAC;EACF,SAAS,EAAE,IAAI;CAAI;;AAbzB,AAcE,KAdG,AAcH,UAAW,CAAC;EACV,MAAM,EAlBe,IAAI;EAmBzB,KAAK,EAnBgB,IAAI;CAqBF;;AAlB3B,AAiBI,KAjBC,AAcH,UAAW,CAGT,GAAG,CAAC;EACF,SAAS,EAAE,IAAI;CAAI;;AAlBzB,AAmBE,KAnBG,AAmBH,SAAU,CAAC;EACT,MAAM,EAtBc,IAAI;EAuBxB,KAAK,EAvBe,IAAI;CAyBD;;AAvB3B,AAsBI,KAtBC,AAmBH,SAAU,CAGR,GAAG,CAAC;EACF,SAAS,EAAE,IAAI;CAAI;;AC1BzB,AAAA,MAAM,CAAC;EACL,OAAO,EAAE,KAAK;EACd,QAAQ,EAAE,QAAQ;CA+BgB;;AAjCpC,AAGE,MAHI,CAGJ,GAAG,CAAC;EACF,OAAO,EAAE,KAAK;EACd,MAAM,EAAE,IAAI;EACZ,KAAK,EAAE,IAAI;CAAI;;AANnB,AAcI,MAdE,AAQJ,UAAW,CAMT,GAAG,EAdP,AAcI,MAdE,AASJ,QAAS,CAKP,GAAG,EAdP,AAcI,MAdE,AAUJ,QAAS,CAIP,GAAG,EAdP,AAcI,MAdE,AAWJ,QAAS,CAGP,GAAG,EAdP,AAcI,MAdE,AAYJ,SAAU,CAER,GAAG,EAdP,AAcI,MAdE,AAaJ,QAAS,CACP,GAAG,CAAC;EZiJN,MAAM,EADgB,CAAC;EAEvB,IAAI,EAFkB,CAAC;EAGvB,QAAQ,EAAE,QAAQ;EAClB,KAAK,EAJiB,CAAC;EAKvB,GAAG,EALmB,CAAC;EY9InB,MAAM,EAAE,IAAI;EACZ,KAAK,EAAE,IAAI;CAAI;;AAjBrB,AAkBE,MAlBI,AAkBJ,UAAW,EAlBb,AAmBE,MAnBI,AAmBJ,QAAS,CAAC;EACR,WAAW,EAAE,IAAI;CAAI;;AApBzB,AAqBE,MArBI,AAqBJ,QAAS,CAAC;EACR,WAAW,EAAE,GAAG;CAAI;;AAtBxB,AAuBE,MAvBI,AAuBJ,QAAS,CAAC;EACR,WAAW,EAAE,QAAQ;CAAI;;AAxB7B,AAyBE,MAzBI,AAyBJ,SAAU,CAAC;EACT,WAAW,EAAE,MAAM;CAAI;;AA1B3B,AA2BE,MA3BI,AA2BJ,QAAS,CAAC;EACR,WAAW,EAAE,GAAG;CAAI;;AA5BxB,AA+BI,MA/BE,AA+BF,SAAU,CAAuB;EAC/B,MAAM,EAAE,IAAgB;EACxB,KAAK,EAAE,IAAgB;CAAG;;AAjChC,AA+BI,MA/BE,AA+BF,SAAU,CAAuB;EAC/B,MAAM,EAAE,IAAgB;EACxB,KAAK,EAAE,IAAgB;CAAG;;AAjChC,AA+BI,MA/BE,AA+BF,SAAU,CAAuB;EAC/B,MAAM,EAAE,IAAgB;EACxB,KAAK,EAAE,IAAgB;CAAG;;AAjChC,AA+BI,MA/BE,AA+BF,SAAU,CAAuB;EAC/B,MAAM,EAAE,IAAgB;EACxB,KAAK,EAAE,IAAgB;CAAG;;AAjChC,AA+BI,MA/BE,AA+BF,SAAU,CAAuB;EAC/B,MAAM,EAAE,IAAgB;EACxB,KAAK,EAAE,IAAgB;CAAG;;AAjChC,AA+BI,MA/BE,AA+BF,SAAU,CAAuB;EAC/B,MAAM,EAAE,IAAgB;EACxB,KAAK,EAAE,IAAgB;CAAG;;AAjChC,AA+BI,MA/BE,AA+BF,WAAY,CAAqB;EAC/B,MAAM,EAAE,KAAgB;EACxB,KAAK,EAAE,KAAgB;CAAG;;AC/BhC,AAAA,aAAa,CAAC;EAEZ,gBAAgB,EjBMH,UAAe;EiBL5B,aAAa,EjBsDN,GAAG;EiBrDV,OAAO,EANc,OAAO,CAAC,MAAM,CAAC,OAAO,CAAC,MAAM;EAOlD,QAAQ,EAAE,QAAQ;CAyBa;;AA9BjC,AbSE,aaTW,AbStB,IAAiB,CAAA,AAAA,WAAW,EAAE;EACjB,aAAa,EAAE,MAAM;CAAI;;AaV7B,AAME,aANW,CAMX,CAAC,AAAA,IAAK,CAAA,AAAA,OAAO,EAAE;EACb,KAAK,EAAE,YAAY;EACnB,eAAe,EAAE,SAAS;CAAI;;AARlC,AASE,aATW,CASX,MAAM,CAAC;EACL,KAAK,EAAE,YAAY;CAAI;;AAV3B,AAWE,aAXW,CAWX,IAAI;AAXN,AAYE,aAZW,CAYX,GAAG,CAAC;EACF,UAAU,EjBHC,KAAgB;CiBGN;;AAbzB,AAcM,aAdO,CAcX,GAAG,CAAC,IAAI,CAAC;EACP,UAAU,EAAE,WAAW;CAAI;;AAf/B,AAgBM,aAhBO,GAgBP,OAAO,CAAC;EACV,QAAQ,EAAE,QAAQ;EAClB,KAAK,EAAE,KAAK;EACZ,GAAG,EAAE,KAAK;CAAI;;AAnBlB,AAoBE,aApBW,CAoBX,MAAM;AApBR,AAqBE,aArBW,CAqBX,SAAS;AArBX,AAsBE,aAtBW,CAsBX,QAAQ,CAAC;EACP,KAAK,EAAE,YAAY;CAAI;;AAvB3B,AA4BI,aA5BS,AA4BT,SAAU,CAAI;EACZ,gBAAgB,EjBnBP,KAAgB;EiBoBzB,KAAK,EjBhCI,OAAc;CiBgCA;;AA9B7B,AA4BI,aA5BS,AA4BT,SAAU,CAAI;EACZ,gBAAgB,EjB/BP,OAAc;EiBgCvB,KAAK,EjBpBI,KAAgB;CiBoBF;;AA9B7B,AA4BI,aA5BS,AA4BT,SAAU,CAAI;EACZ,gBAAgB,EjBrBP,UAAe;EiBsBxB,KAAK,EjB5BI,OAAe;CiB4BD;;AA9B7B,AA4BI,aA5BS,AA4BT,QAAS,CAAK;EACZ,gBAAgB,EjB3BP,OAAe;EiB4BxB,KAAK,EjBtBI,UAAe;CiBsBD;;AA9B7B,AA4BI,aA5BS,AA4BT,WAAY,CAAE;EACZ,gBAAgB,EjBdP,OAAmB;EiBe5B,KAAK,EhBPC,IAAI;CgBOa;;AA9B7B,AA4BI,aA5BS,AA4BT,QAAS,CAAK;EACZ,gBAAgB,EjBbP,OAAmB;EiBc5B,KAAK,EhBPC,IAAI;CgBOa;;AA9B7B,AA4BI,aA5BS,AA4BT,WAAY,CAAE;EACZ,gBAAgB,EjBfP,OAAmB;EiBgB5B,KAAK,EhBPC,IAAI;CgBOa;;AA9B7B,AA4BI,aA5BS,AA4BT,WAAY,CAAE;EACZ,gBAAgB,EjBhBP,OAAmB;EiBiB5B,KAAK,EhBTM,kBAAI;CgBSQ;;AA9B7B,AA4BI,aA5BS,AA4BT,UAAW,CAAG;EACZ,gBAAgB,EjBXP,OAAmB;EiBY5B,KAAK,EhBPC,IAAI;CgBOa;;AC/B7B,AAAA,SAAS,CAAC;EAER,eAAe,EAAE,IAAI;EACrB,kBAAkB,EAAE,IAAI;EACxB,MAAM,EAAE,IAAI;EACZ,aAAa,EAAE,QAAQ;EACvB,OAAO,EAAE,KAAK;EACd,MAAM,ElByBC,IAAI;EkBxBX,QAAQ,EAAE,MAAM;EAChB,OAAO,EAAE,CAAC;EACV,KAAK,EAAE,IAAI;CAqBe;;AA/B5B,AdUE,ScVO,AdUlB,IAAiB,CAAA,AAAA,WAAW,EAAE;EACjB,aAAa,EAAE,MAAM;CAAI;;AcX7B,AAWE,SAXO,AAWP,sBAAuB,CAAC;EACtB,gBAAgB,ElBLL,OAAe;CkBKyB;;AAZvD,AAaE,SAbO,AAaP,wBAAyB,CAAC;EACxB,gBAAgB,ElBVL,OAAe;CkBU2B;;AAdzD,AAeE,SAfO,AAeP,mBAAoB,CAAC;EACnB,gBAAgB,ElBZL,OAAe;CkBY2B;;AAhBzD,AAqBM,SArBG,AAoBL,SAAU,AAChB,wBAAiC,CAAC;EACxB,gBAAgB,ElBXT,KAAgB;CkBWI;;AAtBnC,AAuBM,SAvBG,AAoBL,SAAU,AAGhB,mBAA4B,CAAC;EACnB,gBAAgB,ElBbT,KAAgB;CkBaI;;AAxBnC,AAqBM,SArBG,AAoBL,SAAU,AAChB,wBAAiC,CAAC;EACxB,gBAAgB,ElBvBT,OAAc;CkBuBM;;AAtBnC,AAuBM,SAvBG,AAoBL,SAAU,AAGhB,mBAA4B,CAAC;EACnB,gBAAgB,ElBzBT,OAAc;CkByBM;;AAxBnC,AAqBM,SArBG,AAoBL,SAAU,AAChB,wBAAiC,CAAC;EACxB,gBAAgB,ElBbT,UAAe;CkBaK;;AAtBnC,AAuBM,SAvBG,AAoBL,SAAU,AAGhB,mBAA4B,CAAC;EACnB,gBAAgB,ElBfT,UAAe;CkBeK;;AAxBnC,AAqBM,SArBG,AAoBL,QAAS,AACf,wBAAiC,CAAC;EACxB,gBAAgB,ElBnBT,OAAe;CkBmBK;;AAtBnC,AAuBM,SAvBG,AAoBL,QAAS,AAGf,mBAA4B,CAAC;EACnB,gBAAgB,ElBrBT,OAAe;CkBqBK;;AAxBnC,AAqBM,SArBG,AAoBL,WAAY,AAClB,wBAAiC,CAAC;EACxB,gBAAgB,ElBNT,OAAmB;CkBMC;;AAtBnC,AAuBM,SAvBG,AAoBL,WAAY,AAGlB,mBAA4B,CAAC;EACnB,gBAAgB,ElBRT,OAAmB;CkBQC;;AAxBnC,AAqBM,SArBG,AAoBL,QAAS,AACf,wBAAiC,CAAC;EACxB,gBAAgB,ElBLT,OAAmB;CkBKC;;AAtBnC,AAuBM,SAvBG,AAoBL,QAAS,AAGf,mBAA4B,CAAC;EACnB,gBAAgB,ElBPT,OAAmB;CkBOC;;AAxBnC,AAqBM,SArBG,AAoBL,WAAY,AAClB,wBAAiC,CAAC;EACxB,gBAAgB,ElBPT,OAAmB;CkBOC;;AAtBnC,AAuBM,SAvBG,AAoBL,WAAY,AAGlB,mBAA4B,CAAC;EACnB,gBAAgB,ElBTT,OAAmB;CkBSC;;AAxBnC,AAqBM,SArBG,AAoBL,WAAY,AAClB,wBAAiC,CAAC;EACxB,gBAAgB,ElBRT,OAAmB;CkBQC;;AAtBnC,AAuBM,SAvBG,AAoBL,WAAY,AAGlB,mBAA4B,CAAC;EACnB,gBAAgB,ElBVT,OAAmB;CkBUC;;AAxBnC,AAqBM,SArBG,AAoBL,UAAW,AACjB,wBAAiC,CAAC;EACxB,gBAAgB,ElBHT,OAAmB;CkBGC;;AAtBnC,AAuBM,SAvBG,AAoBL,UAAW,AAGjB,mBAA4B,CAAC;EACnB,gBAAgB,ElBLT,OAAmB;CkBKC;;AAxBnC,AA0BE,SA1BO,AA0BP,SAAU,CAAC;EACT,MAAM,ElBMD,OAAO;CkBNU;;AA3B1B,AA4BE,SA5BO,AA4BP,UAAW,CAAC;EACV,MAAM,ElBED,OAAO;CkBFW;;AA7B3B,AA8BE,SA9BO,AA8BP,SAAU,CAAC;EACT,MAAM,ElBDD,MAAM;CkBCW;;ACZ1B,AAAA,MAAM,CAAC;EACL,gBAAgB,EnBTH,KAAgB;EmBU7B,KAAK,EnBlBQ,OAAe;EmBmB5B,aAAa,EAAE,MAAM;CAiEkE;;AApEzF,AAIE,MAJI,CAIJ,EAAE;AAJJ,AAKE,MALI,CAKJ,EAAE,CAAC;EACD,MAAM,EAzBU,GAAG,CAAC,KAAK,CnBOd,OAAe;EmBmB1B,YAAY,EAzBU,CAAC,CAAC,CAAC,CAAC,GAAG;EA0B7B,OAAO,EAzBU,KAAK,CAAC,MAAM;EA0B7B,cAAc,EAAE,GAAG;CAIF;;AAbrB,AAIE,MAJI,CAIJ,EAAE,AAOD,UAAY;AAXf,AAKE,MALI,CAKJ,EAAE,AAMD,UAAY,CAAC;EACV,WAAW,EAAE,MAAM;EACnB,KAAK,EAAE,EAAE;CAAI;;AAbnB,AAcE,MAdI,CAcJ,EAAE,CAAC;EACD,KAAK,EnB/BM,OAAe;EmBgC1B,UAAU,EAAE,IAAI;CAAI;;AAhBxB,AAiBE,MAjBI,CAiBJ,EAAE,AACA,MAAO,CAAC;EACN,gBAAgB,EnB5BP,OAAe;CmB4B8B;;AAnB5D,AAiBE,MAjBI,CAiBJ,EAAE,AAGA,YAAa,CAAC;EACZ,gBAAgB,EnBxBP,OAAmB;EmByB5B,KAAK,ElBjBC,IAAI;CkBwBiB;;AA7BjC,AAuBM,MAvBA,CAiBJ,EAAE,AAGA,YAAa,CAGX,CAAC;AAvBP,AAwBM,MAxBA,CAiBJ,EAAE,AAGA,YAAa,CAIX,MAAM,CAAC;EACL,KAAK,EAAE,YAAY;CAAI;;AAzB/B,AA0BM,MA1BA,CAiBJ,EAAE,AAGA,YAAa,CAMX,EAAE;AA1BR,AA2BM,MA3BA,CAiBJ,EAAE,AAGA,YAAa,CAOX,EAAE,CAAC;EACD,YAAY,ElBvBR,IAAI;EkBwBR,KAAK,EAAE,YAAY;CAAI;;AA7B/B,AA+BI,MA/BE,CA8BJ,KAAK,CACH,EAAE;AA/BN,AAgCI,MAhCE,CA8BJ,KAAK,CAEH,EAAE,CAAC;EACD,YAAY,EA9Ca,CAAC,CAAC,CAAC,CAAC,GAAG;EA+ChC,KAAK,EnBlDI,OAAe;CmBkDQ;;AAlCtC,AAoCI,MApCE,CAmCJ,KAAK,CACH,EAAE;AApCN,AAqCI,MArCE,CAmCJ,KAAK,CAEH,EAAE,CAAC;EACD,YAAY,EAjDa,GAAG,CAAC,CAAC,CAAC,CAAC;EAkDhC,KAAK,EnBvDI,OAAe;CmBuDQ;;AAvCtC,AA2CQ,MA3CF,CAwCJ,KAAK,CACH,EAAE,AACA,WAAY,CACV,EAAE;AA3CV,AA4CQ,MA5CF,CAwCJ,KAAK,CACH,EAAE,AACA,WAAY,CAEV,EAAE,CAAC;EACD,mBAAmB,EAAE,CAAC;CAAI;;AA7CpC,AAgDI,MAhDE,AA+CJ,YAAa,CACX,EAAE;AAhDN,AAiDI,MAjDE,AA+CJ,YAAa,CAEX,EAAE,CAAC;EACD,YAAY,EAAE,GAAG;CAAI;;AAlD3B,AAqDQ,MArDF,AA+CJ,YAAa,CAIX,EAAE,AACA,WAAY,CACV,EAAE;AArDV,AAsDQ,MAtDF,AA+CJ,YAAa,CAIX,EAAE,AACA,WAAY,CAEV,EAAE,CAAC;EACD,mBAAmB,EAAE,GAAG;CAAI;;AAvDtC,AAwDE,MAxDI,AAwDJ,aAAc,CAAC;EACb,KAAK,EAAE,IAAI;CAAI;;AAzDnB,AA2DI,MA3DE,AA0DJ,UAAW,CACT,EAAE;AA3DN,AA4DI,MA5DE,AA0DJ,UAAW,CAET,EAAE,CAAC;EACD,OAAO,EAAE,YAAY;CAAI;;AA7D/B,AAgEM,MAhEA,AA8DJ,WAAY,CACV,KAAK,CACH,EAAE,AAAA,IAAK,CAAA,AAAA,YAAY,CACjB,UAAY,CAAA,AAAA,IAAI,EAAE;EAChB,gBAAgB,EnB3EX,OAAe;CmB6EmD;;AApEjF,AAgEM,MAhEA,AA8DJ,WAAY,CACV,KAAK,CACH,EAAE,AAAA,IAAK,CAAA,AAAA,YAAY,CACjB,UAAY,CAAA,AAAA,IAAI,CAEd,MAAO,CAAC;EACN,gBAAgB,EnB9Eb,UAAe;CmB8EiD;;ACtF/E,AAAA,KAAK,CAAC;EACJ,WAAW,EAAE,MAAM;EACnB,OAAO,EAAE,IAAI;EACb,SAAS,EAAE,IAAI;EACf,eAAe,EAAE,UAAU;CAiBe;;AArB5C,AAKE,KALG,CAKH,IAAI,CAAC;EACH,aAAa,EAAE,MAAM;CAEO;;AARhC,AAKE,KALG,CAKH,IAAI,AAEF,IAAM,CAAA,AAAA,WAAW,EAAE;EACjB,YAAY,EAAE,MAAM;CAAI;;AAR9B,AASE,KATG,AASH,WAAY,CAAC;EACX,aAAa,EAAE,OAAO;CAAI;;AAV9B,AAWE,KAXG,AAWH,IAAM,CAAA,AAAA,WAAW,EAAE;EACjB,aAAa,EAAE,IAAI;CAAI;;AAZ3B,AAcI,KAdC,AAaH,WAAY,CACV,IAAI,CAAC;EACH,YAAY,EAAE,CAAC;CAMmB;;AArBxC,AAcI,KAdC,AAaH,WAAY,CACV,IAAI,AAEF,IAAM,CAAA,AAAA,YAAY,EAAE;EAClB,yBAAyB,EAAE,CAAC;EAC5B,sBAAsB,EAAE,CAAC;CAAI;;AAlBrC,AAcI,KAdC,AAaH,WAAY,CACV,IAAI,AAKF,IAAM,CAAA,AAAA,WAAW,EAAE;EACjB,0BAA0B,EAAE,CAAC;EAC7B,uBAAuB,EAAE,CAAC;CAAI;;AAEtC,AAAA,IAAI,CAAC;EACH,WAAW,EAAE,MAAM;EACnB,gBAAgB,EpBjBH,UAAe;EoBkB5B,aAAa,EpB+BN,GAAG;EoB9BV,KAAK,EpBxBQ,OAAe;EoByB5B,OAAO,EAAE,WAAW;EACpB,SAAS,EpBGF,OAAO;EoBFd,MAAM,EAAE,GAAG;EACX,eAAe,EAAE,MAAM;EACvB,WAAW,EAAE,GAAG;EAChB,YAAY,EAAE,MAAM;EACpB,aAAa,EAAE,MAAM;EACrB,WAAW,EAAE,MAAM;CA4CY;;AAxDjC,AAaE,IAbE,CAaF,OAAO,CAAC;EACN,WAAW,EAAE,MAAM;EACnB,YAAY,EAAE,QAAQ;CAAI;;AAf9B,AAoBI,IApBA,AAoBA,SAAU,CAAI;EACZ,gBAAgB,EpBlCP,KAAgB;EoBmCzB,KAAK,EpB/CI,OAAc;CoB+CA;;AAtB7B,AAoBI,IApBA,AAoBA,SAAU,CAAI;EACZ,gBAAgB,EpB9CP,OAAc;EoB+CvB,KAAK,EpBnCI,KAAgB;CoBmCF;;AAtB7B,AAoBI,IApBA,AAoBA,SAAU,CAAI;EACZ,gBAAgB,EpBpCP,UAAe;EoBqCxB,KAAK,EpB3CI,OAAe;CoB2CD;;AAtB7B,AAoBI,IApBA,AAoBA,QAAS,CAAK;EACZ,gBAAgB,EpB1CP,OAAe;EoB2CxB,KAAK,EpBrCI,UAAe;CoBqCD;;AAtB7B,AAoBI,IApBA,AAoBA,WAAY,CAAE;EACZ,gBAAgB,EpB7BP,OAAmB;EoB8B5B,KAAK,EnBtBC,IAAI;CmBsBa;;AAtB7B,AAoBI,IApBA,AAoBA,QAAS,CAAK;EACZ,gBAAgB,EpB5BP,OAAmB;EoB6B5B,KAAK,EnBtBC,IAAI;CmBsBa;;AAtB7B,AAoBI,IApBA,AAoBA,WAAY,CAAE;EACZ,gBAAgB,EpB9BP,OAAmB;EoB+B5B,KAAK,EnBtBC,IAAI;CmBsBa;;AAtB7B,AAoBI,IApBA,AAoBA,WAAY,CAAE;EACZ,gBAAgB,EpB/BP,OAAmB;EoBgC5B,KAAK,EnBxBM,kBAAI;CmBwBQ;;AAtB7B,AAoBI,IApBA,AAoBA,UAAW,CAAG;EACZ,gBAAgB,EpB1BP,OAAmB;EoB2B5B,KAAK,EnBtBC,IAAI;CmBsBa;;AAtB7B,AAwBE,IAxBE,AAwBF,UAAW,CAAC;EACV,SAAS,EpBjBJ,IAAI;CoBiBiB;;AAzB9B,AA0BE,IA1BE,AA0BF,SAAU,CAAC;EACT,SAAS,EpBpBJ,OAAO;CoBoBc;;AA3B9B,AA6BE,IA7BE,AA6BF,UAAW,CAAC;EACV,WAAW,EAAE,GAAG;EAChB,OAAO,EAAE,CAAC;EACV,QAAQ,EAAE,QAAQ;EAClB,KAAK,EAAE,GAAG;CAqBiD;;AAtD/D,AAkCI,IAlCA,AA6BF,UAAW,AAKT,OAAQ,EAlCZ,AAmCI,IAnCA,AA6BF,UAAW,AAMT,MAAO,CAAC;EACN,gBAAgB,EAAE,YAAY;EAC9B,OAAO,EAAE,EAAE;EACX,OAAO,EAAE,KAAK;EACd,IAAI,EAAE,GAAG;EACT,QAAQ,EAAE,QAAQ;EAClB,GAAG,EAAE,GAAG;EACR,SAAS,EAAE,gBAAgB,CAAC,gBAAgB,CAAC,aAAa;EAC1D,gBAAgB,EAAE,aAAa;CAAI;;AA3CzC,AA4CI,IA5CA,AA6BF,UAAW,AAeT,OAAQ,CAAC;EACP,MAAM,EAAE,GAAG;EACX,KAAK,EAAE,GAAG;CAAI;;AA9CpB,AA+CI,IA/CA,AA6BF,UAAW,AAkBT,MAAO,CAAC;EACN,MAAM,EAAE,GAAG;EACX,KAAK,EAAE,GAAG;CAAI;;AAjDpB,AAkDI,IAlDA,AA6BF,UAAW,AAqBT,MAAO,EAlDX,AAmDI,IAnDA,AA6BF,UAAW,AAsBT,MAAO,CAAC;EACN,gBAAgB,EAAE,OAAiC;CAAG;;AApD5D,AAqDI,IArDA,AA6BF,UAAW,AAwBT,OAAQ,CAAC;EACP,gBAAgB,EAAE,OAAkC;CAAG;;AAtD7D,AAuDE,IAvDE,AAuDF,WAAY,CAAC;EACX,aAAa,EAAE,QAAQ;CAAI;;AAE/B,AACE,CADD,AAAA,IAAI,AACH,MAAO,CAAC;EACN,eAAe,EAAE,SAAS;CAAI;;AC3ElC,AAAA,MAAM;AACN,AAAA,SAAS,CAAC;EAER,UAAU,EAAE,UAAU;CAKQ;;AARhC,AjBCE,MiBDI,AjBCf,IAAiB,CAAA,AAAA,WAAW;AiBAnB,AjBAE,SiBAO,AjBAlB,IAAiB,CAAA,AAAA,WAAW,EAAE;EACjB,aAAa,EAAE,MAAM;CAAI;;AiBF7B,AAIE,MAJI,CAIJ,EAAE;AAJJ,AAKE,MALI,CAKJ,IAAI;AAJN,AAGE,SAHO,CAGP,EAAE;AAHJ,AAIE,SAJO,CAIP,IAAI,CAAC;EACH,WAAW,EAAE,OAAO;CAAI;;AAN5B,AAOE,MAPI,CAOJ,IAAI;AANN,AAME,SANO,CAMP,IAAI,CAAC;EACH,cAAc,EAAE,MAAM;CAAI;;AAE9B,AAAA,MAAM,CAAC;EACL,KAAK,ErBjBQ,OAAe;EqBkB5B,SAAS,ErBQF,IAAI;EqBPX,WAAW,ErBgBK,GAAG;EqBfnB,WAAW,EAAE,KAAK;CAYS;;AAhB7B,AAKE,MALI,CAKJ,MAAM,CAAC;EACL,KAAK,EAzBY,OAAO;EA0BxB,WAAW,EAzBO,OAAO;CAyBW;;AAPxC,AAQM,MARA,GAQA,UAAU,CAAC;EACb,UAAU,EAAE,QAAQ;CAAI;;AAT5B,AAUsB,MAVhB,AAUJ,IAAM,CAAA,AAAA,UAAU,IAAI,SAAS,CAAC;EAC5B,UAAU,EAAE,OAAO;CAAI;;AAX3B,AAeI,MAfE,AAeF,KAAM,CAAK;EACT,SAAS,ErBRN,IAAI;CqBQY;;AAhBzB,AAeI,MAfE,AAeF,KAAM,CAAK;EACT,SAAS,ErBPN,MAAM;CqBOU;;AAhBzB,AAeI,MAfE,AAeF,KAAM,CAAK;EACT,SAAS,ErBNN,IAAI;CqBMY;;AAhBzB,AAeI,MAfE,AAeF,KAAM,CAAK;EACT,SAAS,ErBLN,MAAM;CqBKU;;AAhBzB,AAeI,MAfE,AAeF,KAAM,CAAK;EACT,SAAS,ErBJN,OAAO;CqBIS;;AAhBzB,AAeI,MAfE,AAeF,KAAM,CAAK;EACT,SAAS,ErBHN,IAAI;CqBGY;;AAEzB,AAAA,SAAS,CAAC;EACR,KAAK,ErBlCQ,OAAe;EqBmC5B,SAAS,ErBRF,OAAO;EqBSd,WAAW,ErBJG,GAAG;EqBKjB,WAAW,EAAE,IAAI;CAUU;;AAd7B,AAKE,SALO,CAKP,MAAM,CAAC;EACL,KAAK,ErBxCM,OAAe;EqByC1B,WAAW,ErBNG,GAAG;CqBMsB;;AAP3C,AAQsB,SARb,AAQP,IAAM,CAAA,AAAA,UAAU,IAAI,MAAM,CAAC;EACzB,UAAU,EAAE,OAAO;CAAI;;AAT3B,AAaI,SAbK,AAaL,KAAM,CAAK;EACT,SAAS,ErBxBN,IAAI;CqBwBY;;AAdzB,AAaI,SAbK,AAaL,KAAM,CAAK;EACT,SAAS,ErBvBN,MAAM;CqBuBU;;AAdzB,AAaI,SAbK,AAaL,KAAM,CAAK;EACT,SAAS,ErBtBN,IAAI;CqBsBY;;AAdzB,AAaI,SAbK,AAaL,KAAM,CAAK;EACT,SAAS,ErBrBN,MAAM;CqBqBU;;AAdzB,AAaI,SAbK,AAaL,KAAM,CAAK;EACT,SAAS,ErBpBN,OAAO;CqBoBS;;AAdzB,AAaI,SAbK,AAaL,KAAM,CAAK;EACT,SAAS,ErBnBN,IAAI;CqBmBY;;ACtDzB,AlBaE,MkBbI,AlBaf,IAAiB,CAAA,AAAA,WAAW,EAAE;EACjB,aAAa,EAAE,MAAM;CAAI;;AkBX7B,AAAA,UAAU,CAAC;EACT,MAAM,EAAE,MAAM;EACd,QAAQ,EAAE,QAAQ;CAsBgB;;AlBoLlC,MAAM,CAAC,MAAM,MAAM,SAAS,EAAE,MAAM;EkB5MtC,AAAA,UAAU,CAAC;IAIP,SAAS,EAAE,KAAqB;IAChC,KAAK,EAAE,KAAqB;GAmBI;EAxBpC,AAMI,UANM,AAMN,SAAU,CAAC;IACT,WAAW,EtBqCX,IAAI;IsBpCJ,YAAY,EtBoCZ,IAAI;IsBnCJ,SAAS,EAAE,IAAI;IACf,KAAK,EAAE,IAAI;GAAI;;;AlB8KnB,MAAM,CAAC,MAAM,MAAM,SAAS,EAAE,MAAM;EkBxLtC,AAYI,UAZM,AAYN,cAAe,CAAC;IACd,SAAS,EAAE,MAAwB;IACnC,KAAK,EAAE,IAAI;GAAI;;;AlB0KnB,MAAM,CAAC,MAAM,MAAM,SAAS,EAAE,MAAM;EkBxLtC,AAgBI,UAhBM,AAgBN,UAAW,CAAC;IACV,SAAS,EAAE,MAAoB;IAC/B,KAAK,EAAE,IAAI;GAAI;;;AlBkMnB,MAAM,CAAC,MAAM,MAAM,SAAS,EAAE,MAAM;EkBpNtC,AAAA,UAAU,CAAC;IAoBP,SAAS,EAAE,MAAwB;IACnC,KAAK,EAAE,MAAwB;GAGC;;;AlBoMlC,MAAM,CAAC,MAAM,MAAM,SAAS,EAAE,MAAM;EkB5NtC,AAAA,UAAU,CAAC;IAuBP,SAAS,EAAE,MAAoB;IAC/B,KAAK,EAAE,MAAoB;GAAK;;;AAEpC,AAAA,OAAO,CAAC;ElBiJN,qBAAqB,EAAE,IAAI;EAC3B,mBAAmB,EAAE,IAAI;EACzB,gBAAgB,EAAE,IAAI;EACtB,eAAe,EAAE,IAAI;EACrB,WAAW,EAAE,IAAI;EAjJjB,eAAe,EAAE,IAAI;EACrB,kBAAkB,EAAE,IAAI;EACxB,gBAAgB,EJjCH,qBAAc;EIkC3B,MAAM,EAAE,IAAI;EACZ,aAAa,EAAE,QAAQ;EACvB,MAAM,EAAE,OAAO;EACf,OAAO,EAAE,YAAY;EACrB,SAAS,EAAE,CAAC;EACZ,WAAW,EAAE,CAAC;EACd,SAAS,EJPF,IAAI;EIQX,MAAM,EAAE,IAAI;EACZ,UAAU,EAAE,IAAI;EAChB,SAAS,EAAE,IAAI;EACf,UAAU,EAAE,IAAI;EAChB,SAAS,EAAE,IAAI;EACf,OAAO,EAAE,IAAI;EACb,QAAQ,EAAE,QAAQ;EAClB,cAAc,EAAE,GAAG;EACnB,KAAK,EAAE,IAAI;CkBrBO;;AADpB,AlBuBE,OkBvBK,AlBuBN,OAAS,EkBvBV,AlBwBE,OkBxBK,AlBwBN,MAAQ,CAAC;EACN,gBAAgB,EJxCL,KAAgB;EIyC3B,OAAO,EAAE,EAAE;EACX,OAAO,EAAE,KAAK;EACd,IAAI,EAAE,GAAG;EACT,QAAQ,EAAE,QAAQ;EAClB,GAAG,EAAE,GAAG;EACR,SAAS,EAAE,gBAAgB,CAAC,gBAAgB,CAAC,aAAa;EAC1D,gBAAgB,EAAE,aAAa;CAAI;;AkBhCvC,AlBiCE,OkBjCK,AlBiCN,OAAS,CAAC;EACP,MAAM,EAAE,GAAG;EACX,KAAK,EAAE,GAAG;CAAI;;AkBnClB,AlBoCE,OkBpCK,AlBoCN,MAAQ,CAAC;EACN,MAAM,EAAE,GAAG;EACX,KAAK,EAAE,GAAG;CAAI;;AkBtClB,AlBuCE,OkBvCK,AlBuCN,MAAQ,EkBvCT,AlBwCE,OkBxCK,AlBwCN,MAAQ,CAAC;EACN,gBAAgB,EJpEL,qBAAc;CIoEa;;AkBzC1C,AlB0CE,OkB1CK,AlB0CN,OAAS,CAAC;EACP,gBAAgB,EJtEL,qBAAc;CIsEa;;AkB3C1C,AlB6CE,OkB7CK,AlB6CN,SAAW,CAAC;EACT,MAAM,EAAE,IAAI;EACZ,UAAU,EAAE,IAAI;EAChB,SAAS,EAAE,IAAI;EACf,UAAU,EAAE,IAAI;EAChB,SAAS,EAAE,IAAI;EACf,KAAK,EAAE,IAAI;CAAI;;AkBnDnB,AlBoDE,OkBpDK,AlBoDN,UAAY,CAAC;EACV,MAAM,EAAE,IAAI;EACZ,UAAU,EAAE,IAAI;EAChB,SAAS,EAAE,IAAI;EACf,UAAU,EAAE,IAAI;EAChB,SAAS,EAAE,IAAI;EACf,KAAK,EAAE,IAAI;CAAI;;AkB1DnB,AlB2DE,OkB3DK,AlB2DN,SAAW,CAAC;EACT,MAAM,EAAE,IAAI;EACZ,UAAU,EAAE,IAAI;EAChB,SAAS,EAAE,IAAI;EACf,UAAU,EAAE,IAAI;EAChB,SAAS,EAAE,IAAI;EACf,KAAK,EAAE,IAAI;CAAI;;AkB9DnB,AAAA,GAAG,CAAC;EACF,SAAS,EAAE,IAAI;EACf,UAAU,EAAE,MAAM;EAClB,cAAc,EAAE,GAAG;CAAI;;AAEzB,AAAA,QAAQ,CAAC;EACP,OAAO,EAAE,KAAK;EACd,SAAS,EAAE,IAAI;EACf,cAAc,EAAE,GAAG;EACnB,aAAa,EAAE,GAAG;EAClB,cAAc,EAAE,SAAS;CAAI;;AAE/B,AAAA,UAAU,CAAC;EAET,WAAW,EtBPG,GAAG;EsBQjB,SAAS,EAAE,IAAI;EACf,QAAQ,EAAE,MAAM;EAChB,OAAO,EAAE,CAAC;CAGa;;AARzB,AlB/BE,UkB+BQ,AlB/BnB,IAAiB,CAAA,AAAA,WAAW,EAAE;EACjB,aAAa,EAAE,MAAM;CAAI;;AkB8B7B,AAME,UANQ,CAMR,GAAG,CAAC;EACF,QAAQ,EAAE,IAAI;EACd,SAAS,EAAE,IAAI;CAAI;;AAEvB,AAAA,OAAO,CAAC;ElB4FN,SAAS,EAAE,gCAAgC;EAC3C,MAAM,EAAE,GAAG,CAAC,KAAK,CJzIJ,OAAe;EI0I5B,aAAa,EAAE,QAAQ;EACvB,kBAAkB,EAAE,WAAW;EAC/B,gBAAgB,EAAE,WAAW;EAC7B,OAAO,EAAE,EAAE;EACX,OAAO,EAAE,KAAK;EACd,MAAM,EAAE,GAAG;EACX,QAAQ,EAAE,QAAQ;EAClB,KAAK,EAAE,GAAG;CkBpGQ;;AAEpB,AAAA,OAAO,CAAC;EACN,WAAW,EAAE,MAAM;EACnB,gBAAgB,EtB/CH,UAAe;EsBgD5B,aAAa,EAAE,QAAQ;EACvB,OAAO,EAAE,WAAW;EACpB,SAAS,EtB5BF,OAAO;EsB6Bd,MAAM,EAAE,GAAG;EACX,eAAe,EAAE,MAAM;EACvB,YAAY,EAAE,MAAM;EACpB,SAAS,EAAE,KAAK;EAChB,OAAO,EAAE,cAAc;EACvB,UAAU,EAAE,MAAM;EAClB,cAAc,EAAE,GAAG;CAAI;;AE/DzB,AAAA,WAAW,CAAC;EpBwKV,qBAAqB,EAAE,IAAI;EAC3B,mBAAmB,EAAE,IAAI;EACzB,gBAAgB,EAAE,IAAI;EACtB,eAAe,EAAE,IAAI;EACrB,WAAW,EAAE,IAAI;EoBzKjB,WAAW,EAAE,OAAO;EACpB,OAAO,EAAE,IAAI;EACb,SAAS,ExBwBF,IAAI;EwBvBX,QAAQ,EAAE,MAAM;EAChB,UAAU,EAAE,IAAI;EAChB,WAAW,EAAE,MAAM;CAyDU;;AAjE/B,ApBOE,WoBPS,ApBOpB,IAAiB,CAAA,AAAA,WAAW,EAAE;EACjB,aAAa,EAAE,MAAM;CAAI;;AoBR7B,AASE,WATS,CAST,CAAC,CAAC;EACA,WAAW,EAAE,MAAM;EACnB,KAAK,ExBTM,OAAe;EwBU1B,OAAO,EAAE,IAAI;EACb,eAAe,EAAE,MAAM;EACvB,OAAO,EAAE,YAAY;CAEqB;;AAhB9C,AASE,WATS,CAST,CAAC,AAMC,MAAO,CAAC;EACN,KAAK,ExBhBI,OAAe;CwBgBc;;AAhB5C,AAiBE,WAjBS,CAiBT,EAAE,CAAC;EACD,WAAW,EAAE,MAAM;EACnB,OAAO,EAAE,IAAI;CAQY;;AA3B7B,AAqBM,WArBK,CAiBT,EAAE,AAGA,UAAW,CACT,CAAC,CAAC;EACA,KAAK,ExBtBE,OAAe;EwBuBtB,MAAM,EAAE,OAAO;EACf,cAAc,EAAE,IAAI;CAAI;;AAxBhC,AAyBQ,WAzBG,CAiBT,EAAE,GAQI,EAAE,AAAA,QAAQ,CAAC;EACb,KAAK,ExBzBI,OAAe;EwB0BxB,OAAO,EAAE,QAAQ;CAAI;;AA3B3B,AA4BE,WA5BS,CA4BT,EAAE,EA5BJ,AA4BM,WA5BK,CA4BL,EAAE,CAAC;EACL,WAAW,EAAE,MAAM;EACnB,OAAO,EAAE,IAAI;EACb,SAAS,EAAE,CAAC;EACZ,WAAW,EAAE,CAAC;EACd,eAAe,EAAE,UAAU;CAAI;;AAjCnC,AAkCE,WAlCS,CAkCT,KAAK,AACH,YAAa,CAAC;EACZ,YAAY,EAAE,KAAK;CAAI;;AApC7B,AAkCE,WAlCS,CAkCT,KAAK,AAGH,WAAY,CAAC;EACX,WAAW,EAAE,KAAK;CAAI;;AAtC5B,AAyCI,WAzCO,AAwCT,YAAa,CACX,EAAE,EAzCN,AAyCQ,WAzCG,AAwCT,YAAa,CACP,EAAE,CAAC;EACL,eAAe,EAAE,MAAM;CAAI;;AA1CjC,AA4CI,WA5CO,AA2CT,SAAU,CACR,EAAE,EA5CN,AA4CQ,WA5CG,AA2CT,SAAU,CACJ,EAAE,CAAC;EACL,eAAe,EAAE,QAAQ;CAAI;;AA7CnC,AA+CE,WA/CS,AA+CT,SAAU,CAAC;EACT,SAAS,ExBlBJ,OAAO;CwBkBa;;AAhD7B,AAiDE,WAjDS,AAiDT,UAAW,CAAC;EACV,SAAS,ExBtBJ,OAAO;CwBsBc;;AAlD9B,AAmDE,WAnDS,AAmDT,SAAU,CAAC;EACT,SAAS,ExBzBJ,MAAM;CwByBc;;AApD7B,AAuDS,WAvDE,AAsDT,oBAAqB,CACnB,EAAE,GAAG,EAAE,AAAA,QAAQ,CAAC;EACd,OAAO,EAAE,QAAQ;CAAI;;AAxD3B,AA0DS,WA1DE,AAyDT,qBAAsB,CACpB,EAAE,GAAG,EAAE,AAAA,QAAQ,CAAC;EACd,OAAO,EAAE,QAAQ;CAAI;;AA3D3B,AA6DS,WA7DE,AA4DT,kBAAmB,CACjB,EAAE,GAAG,EAAE,AAAA,QAAQ,CAAC;EACd,OAAO,EAAE,QAAQ;CAAI;;AA9D3B,AAgES,WAhEE,AA+DT,uBAAwB,CACtB,EAAE,GAAG,EAAE,AAAA,QAAQ,CAAC;EACd,OAAO,EAAE,QAAQ;CAAI;;AC7D3B,AAAA,KAAK,CAAC;EACJ,gBAAgB,EzBGH,KAAgB;EyBF7B,UAAU,EAVE,CAAC,CAAC,GAAG,CAAC,GAAG,CzBAR,qBAAc,EyBAc,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,GAAG,CzBArC,qBAAc;EyBW3B,KAAK,EzBNQ,OAAe;EyBO5B,SAAS,EAAE,IAAI;EACf,QAAQ,EAAE,QAAQ;CAAI;;AAExB,AAAA,YAAY,CAAC;EACX,WAAW,EAAE,OAAO;EACpB,UAAU,EAdS,CAAC,CAAC,GAAG,CAAC,GAAG,CzBHf,qBAAc;EyBkB3B,OAAO,EAAE,IAAI;CAAI;;AAEnB,AAAA,kBAAkB,CAAC;EACjB,WAAW,EAAE,MAAM;EACnB,KAAK,EzBlBQ,OAAe;EyBmB5B,OAAO,EAAE,IAAI;EACb,SAAS,EAAE,CAAC;EACZ,WAAW,EzBeC,GAAG;EyBdf,OAAO,EAAE,OAAO;CAAI;;AAEtB,AAAA,iBAAiB,CAAC;EAChB,WAAW,EAAE,MAAM;EACnB,MAAM,EAAE,OAAO;EACf,OAAO,EAAE,IAAI;EACb,eAAe,EAAE,MAAM;EACvB,OAAO,EAAE,OAAO;CAAI;;AAEtB,AAAA,WAAW,CAAC;EACV,OAAO,EAAE,KAAK;EACd,QAAQ,EAAE,QAAQ;CAAI;;AAExB,AAAA,aAAa,CAAC;EACZ,OAAO,EAAE,MAAM;CAAI;;AAErB,AAAA,YAAY,CAAC;EACX,UAAU,EArCa,GAAG,CAAC,KAAK,CzBEnB,OAAe;EyBoC5B,WAAW,EAAE,OAAO;EACpB,OAAO,EAAE,IAAI;CAAI;;AAEnB,AAAA,iBAAiB,CAAC;EAChB,WAAW,EAAE,MAAM;EACnB,OAAO,EAAE,IAAI;EACb,UAAU,EAAE,CAAC;EACb,SAAS,EAAE,CAAC;EACZ,WAAW,EAAE,CAAC;EACd,eAAe,EAAE,MAAM;EACvB,OAAO,EAAE,OAAO;CAE4B;;AAT9C,AAQE,iBARe,AAQf,IAAM,CAAA,AAAA,WAAW,EAAE;EACjB,YAAY,EAlDS,GAAG,CAAC,KAAK,CzBEnB,OAAe;CyBgDc;;AAI5C,AACE,KADG,CACH,MAAM,AAAA,IAAK,CAAA,AAAA,WAAW,EAAE;EACtB,aAAa,EAAE,OAAO;CAAI;;ACjD9B,AAAA,SAAS,CAAC;EACR,OAAO,EAAE,WAAW;EACpB,QAAQ,EAAE,QAAQ;EAClB,cAAc,EAAE,GAAG;CAQC;;AAXtB,AAMI,SANK,AAIP,UAAW,CAET,cAAc,EANlB,AAMI,SANK,AAKP,aAAc,AAAA,MAAM,CAClB,cAAc,CAAC;EACb,OAAO,EAAE,KAAK;CAAI;;AAPxB,AASI,SATK,AAQP,SAAU,CACR,cAAc,CAAC;EACb,IAAI,EAAE,IAAI;EACV,KAAK,EAAE,CAAC;CAAI;;AAElB,AAAA,cAAc,CAAC;EACb,OAAO,EAAE,IAAI;EACb,IAAI,EAAE,CAAC;EACP,SAAS,EAAE,KAAK;EAChB,WAAW,EA9Ba,GAAG;EA+B3B,QAAQ,EAAE,QAAQ;EAClB,GAAG,EAAE,IAAI;EACT,OAAO,EA9BY,EAAE;CA8BU;;AAEjC,AAAA,iBAAiB,CAAC;EAChB,gBAAgB,E1BxBH,KAAgB;E0ByB7B,aAAa,E1BsBN,GAAG;E0BrBV,UAAU,EApCc,CAAC,CAAC,GAAG,CAAC,GAAG,C1BFpB,qBAAc,E0BE0B,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,GAAG,C1BFjD,qBAAc;E0BuC3B,cAAc,EAAE,MAAM;EACtB,WAAW,EAAE,MAAM;CAAI;;AAEzB,AAAA,cAAc,CAAC;EACb,KAAK,E1BtCQ,OAAe;E0BuC5B,OAAO,EAAE,KAAK;EACd,SAAS,EAAE,QAAQ;EACnB,WAAW,EAAE,GAAG;EAChB,OAAO,EAAE,aAAa;EACtB,QAAQ,EAAE,QAAQ;CAAI;;AAExB,AAAA,CAAC,AAAA,cAAc,CAAC;EACd,aAAa,EAAE,IAAI;EACnB,WAAW,EAAE,MAAM;CAMsB;;AAR3C,AAGE,CAHD,AAAA,cAAc,AAGb,MAAO,CAAC;EACN,gBAAgB,E1B5CL,UAAe;E0B6C1B,KAAK,E1BvDM,OAAc;C0BuDW;;AALxC,AAME,CAND,AAAA,cAAc,AAMb,UAAW,CAAC;EACV,gBAAgB,E1BxCL,OAAmB;E0ByC9B,KAAK,EzBjCG,IAAI;CyBiCyB;;AAEzC,AAAA,iBAAiB,CAAC;EAChB,gBAAgB,E1BrDH,OAAe;E0BsD5B,MAAM,EAAE,IAAI;EACZ,OAAO,EAAE,KAAK;EACd,MAAM,EAAE,GAAG;EACX,MAAM,EAAE,QAAQ;CAAI;;ACnEtB,AAAA,MAAM,CAAC;EAEL,WAAW,EAAE,MAAM;EACnB,eAAe,EAAE,aAAa;CAwBF;;AA3B9B,AvBaE,MuBbI,AvBaf,IAAiB,CAAA,AAAA,WAAW,EAAE;EACjB,aAAa,EAAE,MAAM;CAAI;;AuBd7B,AAIE,MAJI,CAIJ,IAAI,CAAC;EACH,aAAa,E3BwDR,GAAG;C2BxDiB;;AAL7B,AAME,MANI,CAMJ,GAAG,CAAC;EACF,OAAO,EAAE,YAAY;EACrB,cAAc,EAAE,GAAG;CAAI;;AAR3B,AAUE,MAVI,AAUJ,UAAW,CAAC;EACV,OAAO,EAAE,IAAI;CAUW;;AArB5B,AAYI,MAZE,AAUJ,UAAW,CAET,WAAW;AAZf,AAaI,MAbE,AAUJ,UAAW,CAGT,YAAY,CAAC;EACX,OAAO,EAAE,IAAI;CAAI;;AAdvB,AAekB,MAfZ,AAUJ,UAAW,CAKT,WAAW,GAAG,YAAY,CAAC;EACzB,UAAU,EAAE,CAAC;CAAI;;AAhBvB,AAiBI,MAjBE,AAUJ,UAAW,CAOT,WAAW,AACT,IAAM,CAAA,AAAA,WAAW,EAAE;EACjB,aAAa,EAAE,CAAC;CAAI;;AAnB5B,AAiBI,MAjBE,AAUJ,UAAW,CAOT,WAAW,AAGT,IAAM,CAAA,AAAA,UAAU,EAAE;EAChB,SAAS,EAAE,CAAC;CAAI;;AvB8KtB,MAAM,CAAC,MAAM,MAAM,SAAS,EAAE,KAAK,GAAG,KAAK;EuBnM7C,AAAA,MAAM,CAAC;IAwBH,OAAO,EAAE,IAAI;GAGa;EA3B9B,AAyBQ,MAzBF,GAyBE,WAAW,AACb,IAAM,CAAA,AAAA,UAAU,EAAE;IAChB,SAAS,EAAE,CAAC;GAAI;;;AAExB,AAAA,WAAW,CAAC;EACV,WAAW,EAAE,MAAM;EACnB,OAAO,EAAE,IAAI;EACb,UAAU,EAAE,IAAI;EAChB,SAAS,EAAE,CAAC;EACZ,WAAW,EAAE,CAAC;EACd,eAAe,EAAE,MAAM;CAOW;;AAbpC,AAOE,WAPS,CAOT,MAAM;AAPR,AAQE,WARS,CAQT,SAAS,CAAC;EACR,aAAa,EAAE,CAAC;CAAI;;AvByJtB,MAAM,CAAC,MAAM,MAAM,SAAS,EAAE,KAAK;EuBlKrC,AAYI,WAZO,AAYP,IAAM,CAAA,AAAA,WAAW,EAAE;IACjB,aAAa,EAAE,OAAO;GAAI;;;AAEhC,AAAA,WAAW;AACX,AAAA,YAAY,CAAC;EACX,UAAU,EAAE,IAAI;EAChB,SAAS,EAAE,CAAC;EACZ,WAAW,EAAE,CAAC;CAMU;;AAV1B,AAKE,WALS,CAKT,WAAW,AACV,IAAO,CAAA,AAAA,WAAW;AALrB,AAIE,YAJU,CAIV,WAAW,AACV,IAAO,CAAA,AAAA,WAAW,EAAE;EACjB,YAAY,EAAE,OAAO;CAAI;;AAP/B,AAKE,WALS,CAKT,WAAW,AAIV,YAAc;AARjB,AAIE,YAJU,CAIV,WAAW,AAIV,YAAc,CAAC;EACZ,SAAS,EAAE,CAAC;CAAI;;AAEtB,AAAA,WAAW,CAAC;EACV,WAAW,EAAE,MAAM;EACnB,eAAe,EAAE,UAAU;CAMN;;AvB+HrB,MAAM,CAAC,MAAM,MAAM,SAAS,EAAE,KAAK;EuBvIrC,AAKQ,WALG,GAKH,YAAY,CAAC;IACf,UAAU,EAAE,MAAM;GAAI;;;AvBqI1B,MAAM,CAAC,MAAM,MAAM,SAAS,EAAE,KAAK,GAAG,KAAK;EuB3I7C,AAAA,WAAW,CAAC;IAQR,OAAO,EAAE,IAAI;GAAM;;;AAEvB,AAAA,YAAY,CAAC;EACX,WAAW,EAAE,MAAM;EACnB,eAAe,EAAE,QAAQ;CAGJ;;AvB4HrB,MAAM,CAAC,MAAM,MAAM,SAAS,EAAE,KAAK,GAAG,KAAK;EuBjI7C,AAAA,YAAY,CAAC;IAKT,OAAO,EAAE,IAAI;GAAM;;;ACvEvB,AAAA,MAAM,CAAC;EACL,WAAW,EAAE,UAAU;EACvB,OAAO,EAAE,IAAI;EACb,UAAU,EAAE,IAAI;CAsBe;;AAzBjC,AAIE,MAJI,CAIJ,QAAQ,AAAA,IAAK,CAAA,AAAA,WAAW,EAAE;EACxB,aAAa,EAAE,OAAO;CAAI;;AAL9B,AAME,MANI,CAMJ,MAAM,CAAC;EACL,UAAU,EAAE,GAAG,CAAC,KAAK,C5BGV,wBAAe;E4BF1B,OAAO,EAAE,IAAI;EACb,WAAW,EAAE,OAAO;CAOU;;AAhBlC,AAUI,MAVE,CAMJ,MAAM,CAIJ,QAAQ,AAAA,IAAK,CAAA,AAAA,WAAW;AAV5B,AAWI,MAXE,CAMJ,MAAM,CAKJ,QAAQ,AAAA,IAAK,CAAA,AAAA,WAAW,EAAE;EACxB,aAAa,EAAE,MAAM;CAAI;;AAZ/B,AAaI,MAbE,CAMJ,MAAM,CAOJ,MAAM,CAAC;EACL,WAAW,EAAE,MAAM;CAEO;;AAhBhC,AAeU,MAfJ,CAMJ,MAAM,CAOJ,MAAM,GAEA,MAAM,CAAC;EACT,UAAU,EAAE,MAAM;CAAI;;AAhB9B,AAiBM,MAjBA,GAiBA,MAAM,CAAC;EACT,UAAU,EAAE,GAAG,CAAC,KAAK,C5BRV,wBAAe;E4BS1B,UAAU,EAAE,IAAI;EAChB,WAAW,EAAE,IAAI;CAAI;;AApBzB,AAuBQ,MAvBF,AAsBJ,SAAU,GACJ,MAAM,CAAC;EACT,UAAU,EAAE,MAAM;EAClB,WAAW,EAAE,MAAM;CAAI;;AAE7B,AAAA,WAAW;AACX,AAAA,YAAY,CAAC;EACX,UAAU,EAAE,IAAI;EAChB,SAAS,EAAE,CAAC;EACZ,WAAW,EAAE,CAAC;CAAI;;AAEpB,AAAA,WAAW,CAAC;EACV,YAAY,EAAE,IAAI;CAAI;;AAExB,AAAA,YAAY,CAAC;EACX,WAAW,EAAE,IAAI;CAAI;;AAEvB,AAAA,cAAc,CAAC;EACb,UAAU,EAAE,IAAI;EAChB,SAAS,EAAE,CAAC;EACZ,WAAW,EAAE,CAAC;EACd,UAAU,EAAE,IAAI;CAAI;;AChCtB,AAAA,KAAK,CAAC;EACJ,SAAS,E7BuBF,IAAI;C6BhBkB;;AAR/B,AAGE,KAHG,AAGH,SAAU,CAAC;EACT,SAAS,E7BqBJ,OAAO;C6BrBa;;AAJ7B,AAKE,KALG,AAKH,UAAW,CAAC;EACV,SAAS,E7BiBJ,OAAO;C6BjBc;;AAN9B,AAOE,KAPG,AAOH,SAAU,CAAC;EACT,SAAS,E7BcJ,MAAM;C6Bdc;;AAE7B,AAAA,UAAU,CAAC;EACT,WAAW,EAAE,IAAI;CAiBe;;AAlBlC,AAEE,UAFQ,CAER,CAAC,CAAC;EACA,aAAa,E7BoCF,GAAG;E6BnCd,KAAK,E7BlBM,OAAe;E6BmB1B,OAAO,EAAE,KAAK;EACd,OAAO,EAAE,YAAY;CAOgB;;AAbzC,AAEE,UAFQ,CAER,CAAC,AAKC,MAAO,CAAC;EACN,gBAAgB,E7BjBP,UAAe;E6BkBxB,KAAK,E7BxBI,OAAe;C6BwBQ;;AATtC,AAEE,UAFQ,CAER,CAAC,AASC,UAAW,CAAC;EACV,gBAAgB,E7BdP,OAAmB;E6Be5B,KAAK,E5BPC,IAAI;C4BOuB;;AAbvC,AAeI,UAfM,CAcR,EAAE,CACA,EAAE,CAAC;EACD,WAAW,EA9BO,GAAG,CAAC,KAAK,C7BGlB,OAAe;E6B4BxB,MAAM,EAAE,MAAM;EACd,YAAY,EAAE,MAAM;CAAI;;AAE9B,AAAA,WAAW,CAAC;EACV,KAAK,E7BlCQ,OAAe;E6BmC5B,SAAS,EAAE,MAAM;EACjB,cAAc,EAAE,KAAK;EACrB,cAAc,EAAE,SAAS;CAIC;;AAR5B,AAKE,WALS,AAKT,IAAM,CAAA,AAAA,YAAY,EAAE;EAClB,UAAU,EAAE,GAAG;CAAI;;AANvB,AAOE,WAPS,AAOT,IAAM,CAAA,AAAA,WAAW,EAAE;EACjB,aAAa,EAAE,GAAG;CAAI;;ACjC1B,AAAA,QAAQ,CAAC;EAEP,gBAAgB,E9BNH,UAAe;E8BO5B,aAAa,E9B0CN,GAAG;E8BzCV,SAAS,E9BeF,IAAI;C8BQiF;;AA3B9F,A1BHE,Q0BGM,A1BHjB,IAAiB,CAAA,AAAA,WAAW,EAAE;EACjB,aAAa,EAAE,MAAM;CAAI;;A0BE7B,AAME,QANM,AAMN,SAAU,CAAC;EACT,SAAS,E9BaJ,OAAO;C8Bba;;AAP7B,AAQE,QARM,AAQN,UAAW,CAAC;EACV,SAAS,E9BSJ,OAAO;C8BTc;;AAT9B,AAUE,QAVM,AAUN,SAAU,CAAC;EACT,SAAS,E9BMJ,MAAM;C8BNc;;AAX7B,AAoBI,QApBI,AAoBJ,SAAU,CAAI;EACZ,gBAAgB,EAAE,KAAiC;CAMiC;;AA3B1F,AAsBM,QAtBE,AAoBJ,SAAU,CAER,eAAe,CAAC;EACd,gBAAgB,E9BzBT,KAAgB;E8B0BvB,KAAK,E9BtCE,OAAc;C8BsCE;;AAxB/B,AAyBM,QAzBE,AAoBJ,SAAU,CAKR,aAAa,CAAC;EACZ,YAAY,E9B5BL,KAAgB;E8B6BvB,KAAK,EAAE,OAAsE;CAAG;;AA3BxF,AAoBI,QApBI,AAoBJ,SAAU,CAAI;EACZ,gBAAgB,EAAE,OAAiC;CAMiC;;AA3B1F,AAsBM,QAtBE,AAoBJ,SAAU,CAER,eAAe,CAAC;EACd,gBAAgB,E9BrCT,OAAc;E8BsCrB,KAAK,E9B1BE,KAAgB;C8B0BA;;AAxB/B,AAyBM,QAzBE,AAoBJ,SAAU,CAKR,aAAa,CAAC;EACZ,YAAY,E9BxCL,OAAc;E8ByCrB,KAAK,EAAE,OAAsE;CAAG;;AA3BxF,AAoBI,QApBI,AAoBJ,SAAU,CAAI;EACZ,gBAAgB,EAAE,OAAiC;CAMiC;;AA3B1F,AAsBM,QAtBE,AAoBJ,SAAU,CAER,eAAe,CAAC;EACd,gBAAgB,E9B3BT,UAAe;E8B4BtB,KAAK,E9BlCE,OAAe;C8BkCC;;AAxB/B,AAyBM,QAzBE,AAoBJ,SAAU,CAKR,aAAa,CAAC;EACZ,YAAY,E9B9BL,UAAe;E8B+BtB,KAAK,EAAE,OAAsE;CAAG;;AA3BxF,AAoBI,QApBI,AAoBJ,QAAS,CAAK;EACZ,gBAAgB,EAAE,OAAiC;CAMiC;;AA3B1F,AAsBM,QAtBE,AAoBJ,QAAS,CAEP,eAAe,CAAC;EACd,gBAAgB,E9BjCT,OAAe;E8BkCtB,KAAK,E9B5BE,UAAe;C8B4BC;;AAxB/B,AAyBM,QAzBE,AAoBJ,QAAS,CAKP,aAAa,CAAC;EACZ,YAAY,E9BpCL,OAAe;E8BqCtB,KAAK,EAAE,OAAsE;CAAG;;AA3BxF,AAoBI,QApBI,AAoBJ,WAAY,CAAE;EACZ,gBAAgB,EAAE,OAAiC;CAMiC;;AA3B1F,AAsBM,QAtBE,AAoBJ,WAAY,CAEV,eAAe,CAAC;EACd,gBAAgB,E9BpBT,OAAmB;E8BqB1B,KAAK,E7BbD,IAAI;C6Bae;;AAxB/B,AAyBM,QAzBE,AAoBJ,WAAY,CAKV,aAAa,CAAC;EACZ,YAAY,E9BvBL,OAAmB;E8BwB1B,KAAK,EAAE,OAAsE;CAAG;;AA3BxF,AAoBI,QApBI,AAoBJ,QAAS,CAAK;EACZ,gBAAgB,EAAE,OAAiC;CAMiC;;AA3B1F,AAsBM,QAtBE,AAoBJ,QAAS,CAEP,eAAe,CAAC;EACd,gBAAgB,E9BnBT,OAAmB;E8BoB1B,KAAK,E7BbD,IAAI;C6Bae;;AAxB/B,AAyBM,QAzBE,AAoBJ,QAAS,CAKP,aAAa,CAAC;EACZ,YAAY,E9BtBL,OAAmB;E8BuB1B,KAAK,EAAE,OAAsE;CAAG;;AA3BxF,AAoBI,QApBI,AAoBJ,WAAY,CAAE;EACZ,gBAAgB,EAAE,OAAiC;CAMiC;;AA3B1F,AAsBM,QAtBE,AAoBJ,WAAY,CAEV,eAAe,CAAC;EACd,gBAAgB,E9BrBT,OAAmB;E8BsB1B,KAAK,E7BbD,IAAI;C6Bae;;AAxB/B,AAyBM,QAzBE,AAoBJ,WAAY,CAKV,aAAa,CAAC;EACZ,YAAY,E9BxBL,OAAmB;E8ByB1B,KAAK,EAAE,OAAsE;CAAG;;AA3BxF,AAoBI,QApBI,AAoBJ,WAAY,CAAE;EACZ,gBAAgB,EAAE,OAAiC;CAMiC;;AA3B1F,AAsBM,QAtBE,AAoBJ,WAAY,CAEV,eAAe,CAAC;EACd,gBAAgB,E9BtBT,OAAmB;E8BuB1B,KAAK,E7BfI,kBAAI;C6BeU;;AAxB/B,AAyBM,QAzBE,AAoBJ,WAAY,CAKV,aAAa,CAAC;EACZ,YAAY,E9BzBL,OAAmB;E8B0B1B,KAAK,EAAE,OAAsE;CAAG;;AA3BxF,AAoBI,QApBI,AAoBJ,UAAW,CAAG;EACZ,gBAAgB,EAAE,OAAiC;CAMiC;;AA3B1F,AAsBM,QAtBE,AAoBJ,UAAW,CAET,eAAe,CAAC;EACd,gBAAgB,E9BjBT,OAAmB;E8BkB1B,KAAK,E7BbD,IAAI;C6Bae;;AAxB/B,AAyBM,QAzBE,AAoBJ,UAAW,CAKT,aAAa,CAAC;EACZ,YAAY,E9BpBL,OAAmB;E8BqB1B,KAAK,EAAE,OAAsE;CAAG;;AAExF,AAAA,eAAe,CAAC;EACd,WAAW,EAAE,MAAM;EACnB,gBAAgB,E9BxCH,OAAe;E8ByC5B,aAAa,E9BaN,GAAG,CAAH,GAAG,C8BbmD,CAAC,CAAC,CAAC;EAChE,KAAK,E7BtBK,IAAI;E6BuBd,OAAO,EAAE,IAAI;EACb,eAAe,EAAE,aAAa;EAC9B,WAAW,EAAE,IAAI;EACjB,OAAO,EAhDgB,KAAK,CAAC,MAAM;EAiDnC,QAAQ,EAAE,QAAQ;CAaM;;AAtB1B,AAUE,eAVa,CAUb,CAAC,AAAA,IAAK,CAAA,AAAA,OAAO;AAVf,AAWE,eAXa,CAWb,MAAM,CAAC;EACL,KAAK,EAAE,YAAY;CAAI;;AAZ3B,AAaE,eAba,CAab,CAAC,AAAA,IAAK,CAAA,AAAA,OAAO,EAAE;EACb,eAAe,EAAE,SAAS;CAAI;;AAdlC,AAeE,eAfa,CAeb,OAAO,CAAC;EACN,SAAS,EAAE,CAAC;EACZ,WAAW,EAAE,CAAC;EACd,WAAW,EAAE,MAAM;CAAI;;AAlB3B,AAmBM,eAnBS,GAmBT,aAAa,CAAC;EAChB,sBAAsB,EAAE,CAAC;EACzB,uBAAuB,EAAE,CAAC;EAC1B,UAAU,EAAE,IAAI;CAAI;;AAExB,AAAA,aAAa,CAAC;EACZ,MAAM,EA9Dc,GAAG,CAAC,KAAK,C9BEhB,OAAe;E8B6D5B,aAAa,E9BVN,GAAG;E8BWV,KAAK,E9BjEQ,OAAe;E8BkE5B,OAAO,EA/Dc,GAAG,CAAC,MAAM;CAyEiC;;AAdlE,AAKE,aALW,CAKX,CAAC,AAAA,IAAK,CAAA,AAAA,OAAO;AALf,AAME,aANW,CAMX,MAAM,CAAC;EACL,KAAK,EAAE,YAAY;CAAI;;AAP3B,AAQE,aARW,CAQX,CAAC,AAAA,IAAK,CAAA,AAAA,OAAO,EAAE;EACb,eAAe,EAAE,SAAS;CAAI;;AATlC,AAUE,aAVW,CAUX,IAAI;AAVN,AAWE,aAXW,CAWX,GAAG,CAAC;EACF,gBAAgB,E9BnEL,KAAgB;C8BmE4B;;AAZ3D,AAaM,aAbO,CAaX,GAAG,CAAC,IAAI,CAAC;EACP,gBAAgB,EArEqB,WAAW;CAqEY;;ACrDhE,AAAA,MAAM,CAAC;E3BmIL,MAAM,EADgB,CAAC;EAEvB,IAAI,EAFkB,CAAC;EAGvB,QAAQ,EAAE,QAAQ;EAClB,KAAK,EAJiB,CAAC;EAKvB,GAAG,EALmB,CAAC;E2BhIvB,WAAW,EAAE,MAAM;EACnB,OAAO,EAAE,IAAI;EACb,eAAe,EAAE,MAAM;EACvB,QAAQ,EAAE,MAAM;EAChB,QAAQ,EAAE,KAAK;EACf,OAAO,EArCC,EAAE;CAwCW;;AAVvB,AASE,MATI,AASJ,UAAW,CAAC;EACV,OAAO,EAAE,IAAI;CAAI;;AAErB,AAAA,iBAAiB,CAAC;E3BuHhB,MAAM,EADgB,CAAC;EAEvB,IAAI,EAFkB,CAAC;EAGvB,QAAQ,EAAE,QAAQ;EAClB,KAAK,EAJiB,CAAC;EAKvB,GAAG,EALmB,CAAC;E2BpHvB,gBAAgB,E/B1CH,sBAAc;C+B0C4B;;AAEzD,AAAA,cAAc;AACd,AAAA,WAAW,CAAC;EACV,MAAM,EAAE,CAAC,CA3CmB,IAAI;EA4ChC,UAAU,EAAE,mBAA8C;EAC1D,QAAQ,EAAE,IAAI;EACd,QAAQ,EAAE,QAAQ;EAClB,KAAK,EAAE,IAAI;CAKuB;;A3B0IlC,MAAM,CAAC,MAAM,MAAM,SAAS,EAAE,KAAK,GAAG,KAAK;E2BrJ7C,AAAA,cAAc;EACd,AAAA,WAAW,CAAC;IAQR,MAAM,EAAE,MAAM;IACd,UAAU,EAAE,kBAA8C;IAC1D,KAAK,EArDa,KAAK;GAqDS;;;AAEpC,AAAA,YAAY,CAAC;E3BmHX,qBAAqB,EAAE,IAAI;EAC3B,mBAAmB,EAAE,IAAI;EACzB,gBAAgB,EAAE,IAAI;EACtB,eAAe,EAAE,IAAI;EACrB,WAAW,EAAE,IAAI;EAjJjB,eAAe,EAAE,IAAI;EACrB,kBAAkB,EAAE,IAAI;EACxB,gBAAgB,EJjCH,qBAAc;EIkC3B,MAAM,EAAE,IAAI;EACZ,aAAa,EAAE,QAAQ;EACvB,MAAM,EAAE,OAAO;EACf,OAAO,EAAE,YAAY;EACrB,SAAS,EAAE,CAAC;EACZ,WAAW,EAAE,CAAC;EACd,SAAS,EJPF,IAAI;EIQX,MAAM,EAAE,IAAI;EACZ,UAAU,EAAE,IAAI;EAChB,SAAS,EAAE,IAAI;EACf,UAAU,EAAE,IAAI;EAChB,SAAS,EAAE,IAAI;EACf,OAAO,EAAE,IAAI;EACb,QAAQ,EAAE,QAAQ;EAClB,cAAc,EAAE,GAAG;EACnB,KAAK,EAAE,IAAI;E2BUX,UAAU,EAAE,IAAI;EAChB,MAAM,EArDiB,IAAI;EAsD3B,QAAQ,EAAE,KAAK;EACf,KAAK,EAtDa,IAAI;EAuDtB,GAAG,EAtDa,IAAI;EAuDpB,KAAK,EAzDkB,IAAI;CAyDM;;AAPnC,A3BPE,Y2BOU,A3BPX,OAAS,E2BOV,A3BNE,Y2BMU,A3BNX,MAAQ,CAAC;EACN,gBAAgB,EJxCL,KAAgB;EIyC3B,OAAO,EAAE,EAAE;EACX,OAAO,EAAE,KAAK;EACd,IAAI,EAAE,GAAG;EACT,QAAQ,EAAE,QAAQ;EAClB,GAAG,EAAE,GAAG;EACR,SAAS,EAAE,gBAAgB,CAAC,gBAAgB,CAAC,aAAa;EAC1D,gBAAgB,EAAE,aAAa;CAAI;;A2BFvC,A3BGE,Y2BHU,A3BGX,OAAS,CAAC;EACP,MAAM,EAAE,GAAG;EACX,KAAK,EAAE,GAAG;CAAI;;A2BLlB,A3BME,Y2BNU,A3BMX,MAAQ,CAAC;EACN,MAAM,EAAE,GAAG;EACX,KAAK,EAAE,GAAG;CAAI;;A2BRlB,A3BSE,Y2BTU,A3BSX,MAAQ,E2BTT,A3BUE,Y2BVU,A3BUX,MAAQ,CAAC;EACN,gBAAgB,EJpEL,qBAAc;CIoEa;;A2BX1C,A3BYE,Y2BZU,A3BYX,OAAS,CAAC;EACP,gBAAgB,EJtEL,qBAAc;CIsEa;;A2Bb1C,A3BeE,Y2BfU,A3BeX,SAAW,CAAC;EACT,MAAM,EAAE,IAAI;EACZ,UAAU,EAAE,IAAI;EAChB,SAAS,EAAE,IAAI;EACf,UAAU,EAAE,IAAI;EAChB,SAAS,EAAE,IAAI;EACf,KAAK,EAAE,IAAI;CAAI;;A2BrBnB,A3BsBE,Y2BtBU,A3BsBX,UAAY,CAAC;EACV,MAAM,EAAE,IAAI;EACZ,UAAU,EAAE,IAAI;EAChB,SAAS,EAAE,IAAI;EACf,UAAU,EAAE,IAAI;EAChB,SAAS,EAAE,IAAI;EACf,KAAK,EAAE,IAAI;CAAI;;A2B5BnB,A3B6BE,Y2B7BU,A3B6BX,SAAW,CAAC;EACT,MAAM,EAAE,IAAI;EACZ,UAAU,EAAE,IAAI;EAChB,SAAS,EAAE,IAAI;EACf,UAAU,EAAE,IAAI;EAChB,SAAS,EAAE,IAAI;EACf,KAAK,EAAE,IAAI;CAAI;;A2B1BnB,AAAA,WAAW,CAAC;EACV,OAAO,EAAE,IAAI;EACb,cAAc,EAAE,MAAM;EACtB,UAAU,EAAE,kBAAoC;EAChD,QAAQ,EAAE,MAAM;CAAI;;AAEtB,AAAA,gBAAgB;AAChB,AAAA,gBAAgB,CAAC;EACf,WAAW,EAAE,MAAM;EACnB,gBAAgB,E/BjEH,UAAe;E+BkE5B,OAAO,EAAE,IAAI;EACb,WAAW,EAAE,CAAC;EACd,eAAe,EAAE,UAAU;EAC3B,OAAO,EAhEiB,IAAI;EAiE5B,QAAQ,EAAE,QAAQ;CAAI;;AAExB,AAAA,gBAAgB,CAAC;EACf,aAAa,EArEiB,GAAG,CAAC,KAAK,C/BN1B,OAAe;E+B4E5B,sBAAsB,E/BxBT,GAAG;E+ByBhB,uBAAuB,E/BzBV,GAAG;C+ByBmC;;AAErD,AAAA,iBAAiB,CAAC;EAChB,KAAK,E/BpFQ,OAAe;E+BqF5B,SAAS,EAAE,CAAC;EACZ,WAAW,EAAE,CAAC;EACd,SAAS,E/B5DF,MAAM;E+B6Db,WAAW,EAzEkB,CAAC;CAyEe;;AAE/C,AAAA,gBAAgB,CAAC;EACf,yBAAyB,E/BnCZ,GAAG;E+BoChB,0BAA0B,E/BpCb,GAAG;E+BqChB,UAAU,EA1EiB,GAAG,CAAC,KAAK,C/BfvB,OAAe;C+B4FE;;AANhC,AAIE,gBAJc,CAId,OAAO,AACL,IAAM,CAAA,AAAA,WAAW,EAAE;EACjB,YAAY,EAAE,IAAI;CAAI;;AAE5B,AAAA,gBAAgB,CAAC;E3BsDf,0BAA0B,EAAE,KAAK;E2BpDjC,gBAAgB,E/B5FH,KAAgB;E+B6F7B,SAAS,EAAE,CAAC;EACZ,WAAW,EAAE,CAAC;EACd,QAAQ,EAAE,IAAI;EACd,OAAO,EAlFiB,IAAI;CAkFQ;;AC1GtC,AAAA,WAAW,CAAC;E5BsGV,MAAM,EAAE,OAAO;EACf,OAAO,EAAE,KAAK;EACd,MAAM,E4B5GK,OAAO;E5B6GlB,QAAQ,EAAE,QAAQ;EAClB,KAAK,E4B9GM,OAAO;CAQG;;AAJvB,A5B2GE,W4B3GS,C5B2GT,IAAI,CAAC;EACH,gBAAgB,EJzGL,OAAe;EI0G1B,OAAO,EAAE,KAAK;EACd,MAAM,EAAE,GAAG;EACX,IAAI,EAAE,GAAG;EACT,WAAW,EAAE,IAAI;EACjB,QAAQ,EAAE,QAAQ;EAClB,GAAG,EAAE,GAAG;EACR,UAAU,EAAE,IAAI,CJxDZ,IAAI,CAJH,QAAQ;EI6Db,mBAAmB,EAAE,oCAAoC;EACzD,KAAK,EAAE,IAAI;CAMY;;A4B3H3B,A5B2GE,W4B3GS,C5B2GT,IAAI,AAWH,UAAa,CAAA,AAAA,CAAC,EAAE;EACb,UAAU,EAAE,IAAI;CAAI;;A4BvH1B,A5B2GE,W4B3GS,C5B2GT,IAAI,AAaH,UAAa,CAAA,AAAA,CAAC,EAAE;EACb,UAAU,EAAE,IAAI;CAAI;;A4BzH1B,A5B2GE,W4B3GS,C5B2GT,IAAI,AAeH,UAAa,CAAA,AAAA,CAAC,EAAE;EACb,UAAU,EAAE,GAAG;CAAI;;A4B3HzB,A5B4HE,W4B5HS,A5B4HV,MAAQ,CAAC;EACN,gBAAgB,EJrHL,UAAe;CIqHM;;A4B7HpC,A5BgII,W4BhIO,A5B+HT,UAAW,CACT,IAAI,CAAC;EACH,gBAAgB,EJlHP,OAAmB;CI4HS;;A4B3I3C,A5BgII,W4BhIO,A5B+HT,UAAW,CACT,IAAI,AAEH,UAAa,CAAA,AAAA,CAAC,EAAE;EACb,WAAW,EAAE,IAAI;EACjB,SAAS,EAAE,aAAa;EACxB,gBAAgB,EAAE,QAAQ;CAAI;;A4BrItC,A5BgII,W4BhIO,A5B+HT,UAAW,CACT,IAAI,AAMH,UAAa,CAAA,AAAA,CAAC,EAAE;EACb,OAAO,EAAE,CAAC;CAAI;;A4BvItB,A5BgII,W4BhIO,A5B+HT,UAAW,CACT,IAAI,AAQH,UAAa,CAAA,AAAA,CAAC,EAAE;EACb,WAAW,EAAE,IAAI;EACjB,SAAS,EAAE,cAAc;EACzB,gBAAgB,EAAE,WAAW;CAAI;;AAoDvC,MAAM,CAAC,MAAM,MAAM,SAAS,EAAE,KAAK,GAAG,KAAK;E4B/L7C,AAAA,WAAW,CAAC;IAIR,OAAO,EAAE,IAAI;GAAM;;;AAEvB,AAAA,SAAS,CAAC;EACR,WAAW,EAAE,MAAM;EACnB,OAAO,EAAE,IAAI;EACb,SAAS,EAAE,CAAC;EACZ,WAAW,EAAE,CAAC;EACd,SAAS,EhCoBF,IAAI;EgCnBX,eAAe,EAAE,MAAM;EACvB,WAAW,EAAE,GAAG;EAChB,OAAO,EAAE,cAAc;CAaY;;AArBrC,AASE,SATO,CASP,CAAC,CAAC;EACA,SAAS,EAAE,CAAC;EACZ,WAAW,EAAE,CAAC;CAAI;;AAXtB,AAYE,SAZO,CAYP,GAAG,CAAC;EACF,UAAU,EAAE,OAAO;CAAI;;AAb3B,AAcE,SAdO,CAcP,IAAI,AACF,YAAa,AAAA,IAAK,CAAA,AAAA,WAAW,EAAE;EAC7B,YAAY,EAAE,MAAM;CAAI;;AAhB9B,AAcE,SAdO,CAcP,IAAI,AAGF,WAAY,AAAA,IAAK,CAAA,AAAA,YAAY,EAAE;EAC7B,WAAW,EAAE,MAAM;CAAI;;A5BmK3B,MAAM,CAAC,MAAM,MAAM,SAAS,EAAE,KAAK;E4BrLrC,AAAA,SAAS,CAAC;IAqBN,eAAe,EAAE,UAAU;GAAM;;;AAErC,AAAU,SAAD,CAAC,CAAC,AAAA,IAAK,CAAA,AAAA,OAAO;AACvB,AAAA,CAAC,AAAA,SAAS,AAAA,IAAK,CAAA,AAAA,OAAO,EAAE;EACtB,KAAK,EhC3BQ,OAAe;CgCkDD;;AAzB7B,AAAU,SAAD,CAAC,CAAC,AAAA,IAAK,CAAA,AAAA,OAAO,CAGtB,MAAQ;AAFT,AAEE,CAFD,AAAA,SAAS,AAAA,IAAK,CAAA,AAAA,OAAO,CAErB,MAAQ,CAAC;EACN,KAAK,EhC/BM,OAAe;CgC+BL;;AAJzB,AAAU,SAAD,CAAC,CAAC,AAAA,IAAK,CAAA,AAAA,OAAO,CAMtB,UAAY;AALb,AAKE,CALD,AAAA,SAAS,AAAA,IAAK,CAAA,AAAA,OAAO,CAKrB,UAAY,CAAC;EACV,KAAK,EhClCM,OAAe;CgCkCJ;;AAP1B,AAAU,SAAD,CAAC,CAAC,AAAA,IAAK,CAAA,AAAA,OAAO,CAQtB,OAAS;AAPV,AAOE,CAPD,AAAA,SAAS,AAAA,IAAK,CAAA,AAAA,OAAO,CAOrB,OAAS,CAAC;EACP,aAAa,EAAE,qBAAqB;EACpC,UAAU,EAAE,qBAAqB;EACjC,cAAc,EAAE,mBAAmB;EACnC,YAAY,EAAE,IAAI;EAClB,aAAa,EAAE,IAAI;EACnB,WAAW,EAAE,mBAAmB;CAOU;;AArB9C,AAAU,SAAD,CAAC,CAAC,AAAA,IAAK,CAAA,AAAA,OAAO,CAQtB,OAAS,AAOP,MAAQ;AAdX,AAcI,CAdH,AAAA,SAAS,AAAA,IAAK,CAAA,AAAA,OAAO,CAOrB,OAAS,AAOP,MAAQ,CAAC;EACN,mBAAmB,EhC9BV,OAAmB;EgC+B5B,gBAAgB,EAAE,WAAW;CAAI;;AAjBvC,AAAU,SAAD,CAAC,CAAC,AAAA,IAAK,CAAA,AAAA,OAAO,CAQtB,OAAS,AAUP,UAAY;AAjBf,AAiBI,CAjBH,AAAA,SAAS,AAAA,IAAK,CAAA,AAAA,OAAO,CAOrB,OAAS,AAUP,UAAY,CAAC;EACV,aAAa,EAAE,GAAG,CAAC,KAAK,ChCjCf,OAAmB;EgCkC5B,KAAK,EhClCI,OAAmB;EgCmC5B,cAAc,EAAE,mBAAmB;CAAG;;A5ByJ1C,MAAM,CAAC,MAAM,MAAM,SAAS,EAAE,MAAM;E4B9KtC,AAAU,SAAD,CAAC,CAAC,AAAA,IAAK,CAAA,AAAA,OAAO,CAwBpB,SAAW;EAvBd,AAuBI,CAvBH,AAAA,SAAS,AAAA,IAAK,CAAA,AAAA,OAAO,CAuBnB,SAAW,CAAC;IACT,YAAY,EAAE,CAAC;GAAI;;;AAIzB,AAAA,SAAS;AACT,AAAA,UAAU,CAAC;E5B+FT,0BAA0B,EAAE,KAAK;E4B7FjC,WAAW,EAAE,OAAO;EACpB,OAAO,EAAE,IAAI;EACb,SAAS,EAAE,CAAC;EACZ,WAAW,EAAE,CAAC;EACd,SAAS,EAAE,IAAI;EACf,QAAQ,EAAE,IAAI;CAEO;;A5B+IrB,MAAM,CAAC,MAAM,MAAM,SAAS,EAAE,MAAM;E4BzJtC,AAAA,SAAS;EACT,AAAA,UAAU,CAAC;IASP,UAAU,EAAE,CAAC;GAAM;;;AAEvB,AAAA,SAAS,CAAC;EACR,eAAe,EAAE,UAAU;EAC3B,WAAW,EAAE,MAAM;CAAI;;AAEzB,AAAA,UAAU,CAAC;EACT,eAAe,EAAE,QAAQ;CAAI;;AAE/B,AAAA,WAAW,CAAC;EACV,WAAW,EAAE,OAAO;EACpB,OAAO,EAAE,IAAI;EACb,SAAS,EAAE,CAAC;EACZ,WAAW,EAAE,CAAC;EACd,eAAe,EAAE,MAAM;EACvB,WAAW,EAAE,IAAI;EACjB,YAAY,EAAE,IAAI;CAAI;;A5BuGtB,MAAM,CAAC,MAAM,MAAM,SAAS,EAAE,KAAK;E4BrGrC,AAGI,SAHK,AAGL,UAAW,CAAC;IACV,gBAAgB,EhChFP,KAAgB;IgCiFzB,UAAU,EAAE,CAAC,CAAC,GAAG,CAAC,GAAG,ChC7FZ,qBAAc;IgC8FvB,IAAI,EAAE,CAAC;IACP,OAAO,EAAE,IAAI;IACb,KAAK,EAAE,CAAC;IACR,GAAG,EAAE,IAAI;IACT,QAAQ,EAAE,QAAQ;GAKI;EAf5B,AAWM,SAXG,AAGL,UAAW,CAQT,SAAS,CAAC;IACR,UAAU,EAAE,GAAG,CAAC,KAAK,ChC5Fd,wBAAe;IgC6FtB,OAAO,EAAE,OAAO;GAAI;EAb5B,AAcM,SAdG,AAGL,UAAW,AAWT,UAAW,CAAC;IACV,OAAO,EAAE,KAAK;GAAI;;;AAI1B,AAAA,IAAI,CAAC;EACH,WAAW,EAAE,OAAO;EACpB,gBAAgB,EhCjGH,KAAgB;EgCkG7B,OAAO,EAAE,IAAI;EACb,MAAM,EAjHK,OAAO;EAkHlB,QAAQ,EAAE,QAAQ;EAClB,UAAU,EAAE,MAAM;EAClB,OAAO,EAAE,EAAE;CAQmC;;AAfhD,AAQM,IARF,GAQE,UAAU,CAAC;EACb,WAAW,EAAE,OAAO;EACpB,OAAO,EAAE,IAAI;EACb,UAAU,EAxHD,OAAO;EAyHhB,KAAK,EAAE,IAAI;CAAI;;AAZnB,AAcE,IAdE,AAcF,WAAY,CAAC;EACX,UAAU,EAAE,CAAC,CAAC,GAAG,CAAC,GAAG,ChC1HV,qBAAc;CgC0HiB;;AC1F9C,AAAA,OAAO,CAAC;EACN,gBAAgB,EjCrBH,KAAgB;EiCsB7B,UAAU,EAnCI,OAAO;EAoCrB,QAAQ,EAAE,QAAQ;CAO4B;;AAVhD,AAIM,OAJC,GAID,UAAU,CAAC;EACb,WAAW,EAAE,OAAO;EACpB,OAAO,EAAE,IAAI;EACb,UAAU,EAxCE,OAAO;EAyCnB,KAAK,EAAE,IAAI;CAAI;;AARnB,AASE,OATK,AASL,WAAY,CAAC;EACX,UAAU,EAAE,CAAC,CAAC,GAAG,CAAC,GAAG,CjC1CV,qBAAc;CiC0CiB;;AAE9C,AAAA,aAAa,CAAC;E7BgHZ,0BAA0B,EAAE,KAAK;E6B9GjC,WAAW,EAAE,OAAO;EACpB,OAAO,EAAE,IAAI;EACb,UAAU,EAjDI,OAAO;EAkDrB,UAAU,EAAE,IAAI;EAChB,UAAU,EAAE,MAAM;CAAI;;AAExB,AAAA,cAAc,CAAC;E7BoDb,MAAM,EAAE,OAAO;EACf,OAAO,EAAE,KAAK;EACd,MAAM,E6B3GQ,OAAO;E7B4GrB,QAAQ,EAAE,QAAQ;EAClB,KAAK,E6B7GS,OAAO;EAuDrB,WAAW,EAAE,IAAI;CAAI;;AAFvB,A7ByDE,c6BzDY,C7ByDZ,IAAI,CAAC;EACH,gBAAgB,EJzGL,OAAe;EI0G1B,OAAO,EAAE,KAAK;EACd,MAAM,EAAE,GAAG;EACX,IAAI,EAAE,GAAG;EACT,WAAW,EAAE,IAAI;EACjB,QAAQ,EAAE,QAAQ;EAClB,GAAG,EAAE,GAAG;EACR,UAAU,EAAE,IAAI,CJxDZ,IAAI,CAJH,QAAQ;EI6Db,mBAAmB,EAAE,oCAAoC;EACzD,KAAK,EAAE,IAAI;CAMY;;A6BzE3B,A7ByDE,c6BzDY,C7ByDZ,IAAI,AAWH,UAAa,CAAA,AAAA,CAAC,EAAE;EACb,UAAU,EAAE,IAAI;CAAI;;A6BrE1B,A7ByDE,c6BzDY,C7ByDZ,IAAI,AAaH,UAAa,CAAA,AAAA,CAAC,EAAE;EACb,UAAU,EAAE,IAAI;CAAI;;A6BvE1B,A7ByDE,c6BzDY,C7ByDZ,IAAI,AAeH,UAAa,CAAA,AAAA,CAAC,EAAE;EACb,UAAU,EAAE,GAAG;CAAI;;A6BzEzB,A7B0EE,c6B1EY,A7B0Eb,MAAQ,CAAC;EACN,gBAAgB,EJrHL,UAAe;CIqHM;;A6B3EpC,A7B8EI,c6B9EU,A7B6Eb,UAAY,CACT,IAAI,CAAC;EACH,gBAAgB,EJlHP,OAAmB;CI4HS;;A6BzF3C,A7B8EI,c6B9EU,A7B6Eb,UAAY,CACT,IAAI,AAEH,UAAa,CAAA,AAAA,CAAC,EAAE;EACb,WAAW,EAAE,IAAI;EACjB,SAAS,EAAE,aAAa;EACxB,gBAAgB,EAAE,QAAQ;CAAI;;A6BnFtC,A7B8EI,c6B9EU,A7B6Eb,UAAY,CACT,IAAI,AAMH,UAAa,CAAA,AAAA,CAAC,EAAE;EACb,OAAO,EAAE,CAAC;CAAI;;A6BrFtB,A7B8EI,c6B9EU,A7B6Eb,UAAY,CACT,IAAI,AAQH,UAAa,CAAA,AAAA,CAAC,EAAE;EACb,WAAW,EAAE,IAAI;EACjB,SAAS,EAAE,cAAc;EACzB,gBAAgB,EAAE,WAAW;CAAI;;A6BrFzC,AAAA,YAAY,CAAC;EACX,OAAO,EAAE,IAAI;CAAI;;AAEnB,AAAA,YAAY;AACZ,AAAA,YAAY,CAAC;EACX,KAAK,EjCxDQ,OAAe;EiCyD5B,OAAO,EAAE,KAAK;EACd,WAAW,EAAE,GAAG;EAChB,OAAO,EAAE,WAAW;EACpB,QAAQ,EAAE,QAAQ;CAAI;;AAExB,AAEE,CAFD,AAAA,YAAY,AAEZ,MAAQ,EAFT,AAGE,CAHD,AAAA,YAAY,AAGZ,UAAY;AAFb,AACE,YADU,AACX,MAAQ;AADT,AAEE,YAFU,AAEX,UAAY,CAAC;EACV,gBAAgB,EjC7DL,UAAe;EiC8D1B,KAAK,EjCxEM,OAAc;CiCwES;;AAEtC,AAAA,YAAY,CAAC;EACX,SAAS,EAAE,CAAC;EACZ,WAAW,EAAE,CAAC;CAkBqE;;AApBrF,AAGE,YAHU,CAGV,GAAG,CAAC;EACF,UAAU,EAAE,OAAO;CAAI;;AAJ3B,AAKE,YALU,AAKV,aAAc,CAAC;EACb,OAAO,EAAE,CAAC;CAAI;;AANlB,AAOE,YAPU,AAOV,OAAQ,CAAC;EACP,aAAa,EAAE,qBAAqB;EACpC,UAAU,EApFE,OAAO;EAqFnB,cAAc,EAAE,kBAAkB;CAU6C;;AApBnF,AAWI,YAXQ,AAOV,OAAQ,AAIN,MAAO,CAAC;EACN,gBAAgB,EA/Ec,WAAW;EAgFzC,mBAAmB,EjCtEV,OAAmB;CiCsEiC;;AAbnE,AAcI,YAdQ,AAOV,OAAQ,AAON,UAAW,CAAC;EACV,gBAAgB,EA/Ee,WAAW;EAgF1C,mBAAmB,EjCzEV,OAAmB;EiC0E5B,mBAAmB,EA/Ee,KAAK;EAgFvC,mBAAmB,EA/Ee,GAAG;EAgFrC,KAAK,EjC5EI,OAAmB;EiC6E5B,cAAc,EAAE,kBAAwD;CAAG;;AAEjF,AAAA,eAAe,CAAC;EACd,SAAS,EAAE,CAAC;EACZ,WAAW,EAAE,CAAC;CAAI;;AAEpB,AAAA,YAAY,CAAC;EACX,aAAa,EAAE,KAAK;CAAI;;AAE1B,AAAA,gBAAgB,CAAC;EACf,SAAS,EAAE,QAAQ;EACnB,cAAc,EAAE,MAAM;EACtB,WAAW,EAAE,MAAM;CAGU;;AAN/B,AAIE,gBAJc,CAId,YAAY,CAAC;EACX,YAAY,EAAE,MAAM;EACpB,aAAa,EAAE,MAAM;CAAI;;AAE7B,AAAA,eAAe,CAAC;EACd,gBAAgB,EjCxGH,OAAe;EiCyG5B,MAAM,EAAE,IAAI;EACZ,OAAO,EAAE,IAAI;EACb,MAAM,EAAE,GAAG;EACX,MAAM,EAAE,QAAQ;CAAI;;A7BqFpB,MAAM,CAAC,MAAM,MAAM,SAAS,EAAE,MAAM;E6BlFpC,AACE,aADW,CACX,YAAY,CAAC;IACX,WAAW,EAAE,MAAM;IACnB,OAAO,EAAE,IAAI;GAAI;EACrB,AAAA,YAAY,CAAC;IACX,UAAU,EAAE,CAAC,CAAC,GAAG,CAAC,IAAI,CjC5HX,qBAAc;IiC6HzB,OAAO,EAAE,QAAQ;GAEK;EAJxB,AAGE,YAHU,AAGV,UAAW,CAAC;IACV,OAAO,EAAE,KAAK;GAAI;;;A7B8EtB,MAAM,CAAC,MAAM,MAAM,SAAS,EAAE,MAAM;E6B3EpC,AAAA,OAAO;EACP,AAAA,YAAY;EACZ,AAAA,aAAa;EACb,AAAA,WAAW,CAAC;IACV,WAAW,EAAE,OAAO;IACpB,OAAO,EAAE,IAAI;GAAI;EACnB,AAAA,OAAO,CAAC;IACN,UAAU,EA1IE,OAAO;GA6JyC;EApB9D,AAGI,OAHG,AAEL,eAAgB,CACd,CAAC,AAAA,YAAY,AAEZ,MAAQ,EALb,AAGI,OAHG,AAEL,eAAgB,CACd,CAAC,AAAA,YAAY,AAGZ,UAAY;EANjB,AAII,OAJG,AAEL,eAAgB,CAEd,YAAY,AACX,MAAQ;EALb,AAII,OAJG,AAEL,eAAgB,CAEd,YAAY,AAEX,UAAY,CAAC;IACV,gBAAgB,EAAE,WAAW;GAAI;EAPzC,AAWQ,OAXD,AAEL,eAAgB,CAMd,YAAY,AAAA,aAAa,AACvB,UAAW,CAET,YAAY,EAXpB,AAWQ,OAXD,AAEL,eAAgB,CAMd,YAAY,AAAA,aAAa,AAEvB,aAAc,AAAA,MAAM,CAClB,YAAY,CAAC;IACX,gBAAgB,EAAE,WAAW;GAAI;EAZ3C,AAcM,OAdC,AAEL,eAAgB,CAWd,gBAAgB,CACd,CAAC,AAAA,YAAY,AACX,MAAO,CAAC;IACN,gBAAgB,EjC9Ib,UAAe;IiC+IlB,KAAK,EjCzJF,OAAc;GiCyJ0B;EAjBrD,AAcM,OAdC,AAEL,eAAgB,CAWd,gBAAgB,CACd,CAAC,AAAA,YAAY,AAIX,UAAW,CAAC;IACV,gBAAgB,EjCjJb,UAAe;IiCkJlB,KAAK,EjC3IF,OAAmB;GiC2IsB;EACtD,AAAA,cAAc,CAAC;IACb,OAAO,EAAE,IAAI;GAAI;EACnB,AAAA,YAAY;EACZ,AAAA,YAAY,CAAC;IACX,WAAW,EAAE,MAAM;IACnB,OAAO,EAAE,IAAI;GAAI;EACnB,AACE,YADU,AACV,aAAc,CAAC;IACb,WAAW,EAAE,OAAO;GAAI;EAF5B,AAKI,YALQ,AAGV,UAAW,CAET,gBAAgB,EALpB,AAKI,YALQ,AAIV,aAAc,AAAA,MAAM,CAClB,gBAAgB,CAAC;IACf,OAAO,EAAE,KAAK;GAIiB;EAVrC,AAKI,YALQ,AAGV,UAAW,CAET,gBAAgB,AAEf,SAAW,EAPhB,AAKI,YALQ,AAIV,aAAc,AAAA,MAAM,CAClB,gBAAgB,AAEf,SAAW,CAAC;IACT,OAAO,EAAE,CAAC;IACV,cAAc,EAAE,IAAI;IACpB,SAAS,EAAE,aAAa;GAAG;EACnC,AACE,YADU,AACV,OAAQ,CAAC;I7BhLX,MAAM,EAAE,GAAG,CAAC,KAAK,CJkBJ,OAAmB;IIjBhC,YAAY,EAAE,CAAC;IACf,UAAU,EAAE,CAAC;IACb,OAAO,EAAE,GAAG;IACZ,OAAO,EAAE,KAAK;IACd,MAAM,EAAE,KAAK;IACb,cAAc,EAAE,IAAI;IACpB,QAAQ,EAAE,QAAQ;IAClB,SAAS,EAAE,cAAc;IACzB,KAAK,EAAE,KAAK;I6ByKR,UAAU,EAAE,QAAQ;IACpB,KAAK,EAAE,OAAO;IACd,GAAG,EAAE,GAAG;GAAI;EAChB,AAAA,YAAY,CAAC;IACX,SAAS,EAAE,CAAC;IACZ,WAAW,EAAE,CAAC;GAAI;EACpB,AAAA,aAAa,CAAC;IACZ,eAAe,EAAE,UAAU;IAC3B,YAAY,EAAE,IAAI;GAAI;EACxB,AAAA,WAAW,CAAC;IACV,eAAe,EAAE,QAAQ;IACzB,WAAW,EAAE,IAAI;GAAI;EACvB,AAAA,gBAAgB,CAAC;IACf,gBAAgB,EjClLL,KAAgB;IiCmL3B,yBAAyB,EjCnId,GAAG;IiCoId,0BAA0B,EjCpIf,GAAG;IiCqId,UAAU,EAjLe,GAAG,CAAC,KAAK,CjCRvB,OAAe;IiC0L1B,UAAU,EAAE,CAAC,CAAC,GAAG,CAAC,GAAG,CjClMV,qBAAc;IiCmMzB,OAAO,EAAE,IAAI;IACb,SAAS,EAAE,QAAQ;IACnB,IAAI,EAAE,CAAC;IACP,SAAS,EAAE,IAAI;IACf,QAAQ,EAAE,QAAQ;IAClB,GAAG,EAAE,IAAI;IACT,OAAO,EArLS,EAAE;GA2M6B;EAlCjD,AAaE,gBAbc,CAad,YAAY,CAAC;IACX,OAAO,EAAE,aAAa;IACtB,WAAW,EAAE,MAAM;GAAI;EAf3B,AAgBE,gBAhBc,CAgBd,CAAC,AAAA,YAAY,CAAC;IACZ,aAAa,EAAE,IAAI;GAM6B;EAvBpD,AAgBE,gBAhBc,CAgBd,CAAC,AAAA,YAAY,AAEX,MAAO,CAAC;IACN,gBAAgB,EjCtMT,UAAe;IiCuMtB,KAAK,EjCjNE,OAAc;GiCiNsB;EApBjD,AAgBE,gBAhBc,CAgBd,CAAC,AAAA,YAAY,AAKX,UAAW,CAAC;IACV,gBAAgB,EjCzMT,UAAe;IiC0MtB,KAAK,EjCnME,OAAmB;GiCmMkB;EAvBlD,AAwBE,gBAxBc,AAwBd,SAAU,CAAC;IACT,aAAa,EjC1JJ,GAAG;IiC2JZ,UAAU,EAAE,IAAI;IAChB,UAAU,EAjMe,CAAC,CAAC,GAAG,CAAC,GAAG,CjCvBzB,qBAAc,EiCuB+B,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,GAAG,CjCvBtD,qBAAc;IiCyNvB,OAAO,EAAE,KAAK;IACd,OAAO,EAAE,CAAC;IACV,cAAc,EAAE,IAAI;IACpB,GAAG,EAAE,mBAAyC;IAC9C,SAAS,EAAE,gBAAgB;IAC3B,mBAAmB,EjCjKjB,IAAI;IiCkKN,mBAAmB,EAAE,kBAAkB;GAAI;EAC/C,AAAA,eAAe,CAAC;IACd,OAAO,EAAE,KAAK;GAAI;EACpB,AAAa,UAAH,GAAG,OAAO,CAAC;IACnB,WAAW,EAAE,KAAK;IAClB,YAAY,EAAE,KAAK;GAAI;EAEzB,AAEE,CAFD,AAAA,YAAY,AAEZ,UAAY;EADb,AACE,YADU,AACX,UAAY,CAAC;IACV,KAAK,EjCzOI,OAAc;GiCyOY;EAHvC,AAIE,CAJD,AAAA,YAAY,AAIZ,UAAY,AAAA,IAAK,CAAA,AAAA,MAAM;EAHxB,AAGE,YAHU,AAGX,UAAY,AAAA,IAAK,CAAA,AAAA,MAAM,EAAE;IACtB,gBAAgB,EAtOgB,WAAW;GAsOc;EAC7D,AAGI,YAHQ,AAAA,aAAa,AACvB,MAAO,CAEL,YAAY,EAHhB,AAGI,YAHQ,AAAA,aAAa,AAEvB,UAAW,CACT,YAAY,CAAC;IACX,gBAAgB,EjCtOT,UAAe;GiCsOkC;;;ACxNhE,AAAA,WAAW,CAAC;EACV,SAAS,ElCQF,IAAI;EkCPX,MAAM,EAzBa,QAAO;CAgCG;;AAT/B,AAIE,WAJS,AAIT,SAAU,CAAC;EACT,SAAS,ElCKJ,OAAO;CkCLa;;AAL7B,AAME,WANS,AAMT,UAAW,CAAC;EACV,SAAS,ElCCJ,OAAO;CkCDc;;AAP9B,AAQE,WARS,AAQT,SAAU,CAAC;EACT,SAAS,ElCFJ,MAAM;CkCEc;;AAE7B,AAAA,WAAW;AACX,AAAA,gBAAgB,CAAC;EACf,WAAW,EAAE,MAAM;EACnB,OAAO,EAAE,IAAI;EACb,eAAe,EAAE,MAAM;EACvB,UAAU,EAAE,MAAM;CAAI;;AAExB,AAAA,oBAAoB;AACpB,AAAA,gBAAgB;AAChB,AAAA,gBAAgB;AAChB,AAAA,oBAAoB,CAAC;E7BxCnB,eAAe,EAAE,IAAI;EACrB,kBAAkB,EAAE,IAAI;EACxB,WAAW,EAAE,MAAM;EACnB,MAAM,EAAE,qBAAqB;EAC7B,aAAa,ELkDN,GAAG;EKjDV,UAAU,EAAE,IAAI;EAChB,OAAO,EAAE,WAAW;EACpB,SAAS,ELqBF,IAAI;EKpBX,MAAM,EAAE,MAAM;EACd,eAAe,EAAE,UAAU;EAC3B,WAAW,EAAE,GAAG;EAChB,cAAc,EAfW,mBAAmB;EAgB5C,YAAY,EAfe,mBAAmB;EAgB9C,aAAa,EAhBc,mBAAmB;EAiB9C,WAAW,EAlBc,mBAAmB;EAmB5C,QAAQ,EAAE,QAAQ;EAClB,cAAc,EAAE,GAAG;EDuJnB,qBAAqB,EAAE,IAAI;EAC3B,mBAAmB,EAAE,IAAI;EACzB,gBAAgB,EAAE,IAAI;EACtB,eAAe,EAAE,IAAI;EACrB,WAAW,EAAE,IAAI;E8BhIjB,SAAS,EAAE,GAAG;EACd,YAAY,EAAE,KAAK;EACnB,aAAa,EAAE,KAAK;EACpB,eAAe,EAAE,MAAM;EACvB,MAAM,EAAE,OAAO;EACf,UAAU,EAAE,MAAM;CAAI;;AAXxB,A7BnBE,oB6BmBkB,A7BnBzB,MAAc,E6BmBT,A7BlBE,oB6BkBkB,A7BlBzB,WAAmB,E6BkBd,A7BjBE,oB6BiBkB,A7BjBzB,OAAe,E6BiBV,A7BhBE,oB6BgBkB,A7BhBzB,UAAkB;A6BiBb,A7BpBE,gB6BoBc,A7BpBrB,MAAc;A6BoBT,A7BnBE,gB6BmBc,A7BnBrB,WAAmB;A6BmBd,A7BlBE,gB6BkBc,A7BlBrB,OAAe;A6BkBV,A7BjBE,gB6BiBc,A7BjBrB,UAAkB;A6BkBb,A7BrBE,gB6BqBc,A7BrBrB,MAAc;A6BqBT,A7BpBE,gB6BoBc,A7BpBrB,WAAmB;A6BoBd,A7BnBE,gB6BmBc,A7BnBrB,OAAe;A6BmBV,A7BlBE,gB6BkBc,A7BlBrB,UAAkB;A6BmBb,A7BtBE,oB6BsBkB,A7BtBzB,MAAc;A6BsBT,A7BrBE,oB6BqBkB,A7BrBzB,WAAmB;A6BqBd,A7BpBE,oB6BoBkB,A7BpBzB,OAAe;A6BoBV,A7BnBE,oB6BmBkB,A7BnBzB,UAAkB,CAAC;EACV,OAAO,EAAE,IAAI;CAAI;;A6BerB,A7BdE,oB6BckB,C7BdzB,AAAA,QAAS,AAAA;A6BeJ,A7BfE,gB6Bec,C7BfrB,AAAA,QAAS,AAAA;A6BgBJ,A7BhBE,gB6BgBc,C7BhBrB,AAAA,QAAS,AAAA;A6BiBJ,A7BjBE,oB6BiBkB,C7BjBzB,AAAA,QAAS,AAAA,EAAU;EACV,MAAM,EAAE,WAAW;CAAI;;A6B0B3B,AAAA,oBAAoB;AACpB,AAAA,gBAAgB;AAChB,AAAA,gBAAgB,CAAC;EACf,YAAY,ElClDC,OAAe;EkCmD5B,SAAS,EAAE,MAAM;CAaG;;AAjBtB,AAKE,oBALkB,AAKpB,MAAS;AAJT,AAIE,gBAJc,AAIhB,MAAS;AAHT,AAGE,gBAHc,AAGhB,MAAS,CAAC;EACN,YAAY,ElCtDD,OAAe;EkCuD1B,KAAK,ElC1DM,OAAe;CkC0DO;;AAPrC,AAQE,oBARkB,AAQpB,MAAS;AAPT,AAOE,gBAPc,AAOhB,MAAS;AANT,AAME,gBANc,AAMhB,MAAS,CAAC;EACN,YAAY,ElC/CD,OAAmB;CkC+CiB;;AATnD,AAUE,oBAVkB,AAUpB,OAAU;AATV,AASE,gBATc,AAShB,OAAU;AARV,AAQE,gBARc,AAQhB,OAAU,CAAC;EACP,UAAU,EA5CY,KAAK,CAAC,CAAC,CAAC,GAAG,CAAC,GAAG,ClCtB1B,qBAAc;CkCkEc;;AAX3C,AAYE,oBAZkB,CAYpB,AAAA,QAAI,AAAA;AAXJ,AAWE,gBAXc,CAWhB,AAAA,QAAI,AAAA;AAVJ,AAUE,gBAVc,CAUhB,AAAA,QAAI,AAAA,EAAU;EACV,gBAAgB,ElC5DL,OAAe;EkC6D1B,YAAY,ElC7DD,OAAe;EkC8D1B,UAAU,EAAE,IAAI;EAChB,KAAK,ElCjEM,OAAe;EkCkE1B,OAAO,EAAE,GAAG;CAAI;;AAEpB,AAAA,oBAAoB;AACpB,AAAA,gBAAgB,CAAC;EACf,YAAY,EAAE,MAAM;EACpB,aAAa,EAAE,MAAM;EACrB,WAAW,EAAE,MAAM;CAAI;;AAEzB,AACE,gBADc,AACd,WAAY,CAAC;EACX,gBAAgB,ElCjEL,OAAmB;EkCkE9B,YAAY,ElClED,OAAmB;EkCmE9B,KAAK,EjC3DG,IAAI;CiC2DuB;;AAEvC,AAAA,oBAAoB,CAAC;EACnB,KAAK,ElChFQ,OAAe;EkCiF5B,cAAc,EAAE,IAAI;CAAI;;AAE1B,AAAA,gBAAgB,CAAC;EACf,SAAS,EAAE,IAAI;CAAI;;A9BkGnB,MAAM,CAAC,MAAM,MAAM,SAAS,EAAE,KAAK;E8B/FnC,AAAA,WAAW,CAAC;IACV,SAAS,EAAE,IAAI;GAAI;EACrB,AAAA,oBAAoB;EACpB,AAAA,gBAAgB,CAAC;IACf,SAAS,EAAE,CAAC;IACZ,WAAW,EAAE,CAAC;GAAI;EACpB,AACE,gBADc,CACd,EAAE,CAAC;IACD,SAAS,EAAE,CAAC;IACZ,WAAW,EAAE,CAAC;GAAI;;;A9B0FtB,MAAM,CAAC,MAAM,MAAM,SAAS,EAAE,KAAK,GAAG,KAAK;E8BvF3C,AAAA,gBAAgB,CAAC;IACf,SAAS,EAAE,CAAC;IACZ,WAAW,EAAE,CAAC;IACd,eAAe,EAAE,UAAU;IAC3B,KAAK,EAAE,CAAC;GAAI;EACd,AAAA,oBAAoB,CAAC;IACnB,KAAK,EAAE,CAAC;GAAI;EACd,AAAA,gBAAgB,CAAC;IACf,KAAK,EAAE,CAAC;GAAI;EACd,AAAA,WAAW,CAAC;IACV,eAAe,EAAE,aAAa;GAgBV;EAjBtB,AAGI,WAHO,AAET,YAAa,CACX,oBAAoB,CAAC;IACnB,KAAK,EAAE,CAAC;GAAI;EAJlB,AAKI,WALO,AAET,YAAa,CAGX,gBAAgB,CAAC;IACf,eAAe,EAAE,MAAM;IACvB,KAAK,EAAE,CAAC;GAAI;EAPlB,AAQI,WARO,AAET,YAAa,CAMX,gBAAgB,CAAC;IACf,KAAK,EAAE,CAAC;GAAI;EATlB,AAWI,WAXO,AAUT,SAAU,CACR,oBAAoB,CAAC;IACnB,KAAK,EAAE,CAAC;GAAI;EAZlB,AAaI,WAbO,AAUT,SAAU,CAGR,gBAAgB,CAAC;IACf,KAAK,EAAE,CAAC;GAAI;EAdlB,AAeI,WAfO,AAUT,SAAU,CAKR,gBAAgB,CAAC;IACf,eAAe,EAAE,QAAQ;IACzB,KAAK,EAAE,CAAC;GAAI;;;AC7GpB,AAAA,MAAM,CAAC;EACL,SAAS,EnCSF,IAAI;CmCPkB;;AAH/B,AAEE,MAFI,AAEJ,IAAM,CAAA,AAAA,WAAW,EAAE;EACjB,aAAa,EAAE,MAAM;CAAI;;AAE7B,AAAA,cAAc;AACd,AAAA,WAAW;AACX,AAAA,YAAY,CAAC;EACX,aAAa,EAjCK,GAAG,CAAC,KAAK,CnCUd,OAAe;EmCwB5B,WAAW,EAlCO,GAAG,CAAC,KAAK,CnCUd,OAAe;EmCyB5B,YAAY,EAnCM,GAAG,CAAC,KAAK,CnCUd,OAAe;CmC2BS;;AAPvC,AAME,cANY,AAMd,YAAe;AALf,AAKE,WALS,AAKX,YAAe;AAJf,AAIE,YAJU,AAIZ,YAAe,CAAC;EACZ,UAAU,EArCM,GAAG,CAAC,KAAK,CnCUd,OAAe;CmC2BO;;AAErC,AAAA,cAAc,CAAC;EACb,gBAAgB,EnC5BH,UAAe;EmC6B5B,aAAa,EnCoBN,GAAG,CAAH,GAAG,CmCpBiD,CAAC,CAAC,CAAC;EAC9D,KAAK,EnCpCQ,OAAe;EmCqC5B,SAAS,EApCU,MAAM;EAqCzB,WAAW,EnCNE,GAAG;EmCOhB,WAAW,EAzCe,IAAI;EA0C9B,OAAO,EAzCe,KAAK,CAAC,MAAM;CAyCA;;AAEpC,AAAA,WAAW,CAAC;EACV,WAAW,EAAE,QAAQ;EACrB,OAAO,EAAE,IAAI;EACb,SAAS,EAAE,OAAO;EAClB,eAAe,EAAE,MAAM;CAQkB;;AAZ3C,AAKE,WALS,CAKT,CAAC,CAAC;EACA,aAAa,EA5CS,GAAG,CAAC,KAAK,CnCApB,OAAe;EmC6C1B,aAAa,EAAE,IAAI;EACnB,OAAO,EAAE,KAAK;CAIuB;;AAZzC,AAKE,WALS,CAKT,CAAC,AAKC,UAAW,CAAC;EACV,mBAAmB,EnCpDV,OAAe;EmCqDxB,KAAK,EnCtDI,OAAe;CmCsDS;;AAEvC,AACE,WADS,CACT,CAAC,CAAC;EACA,KAAK,EnCzDM,OAAe;CmC2DgB;;AAJ9C,AACE,WADS,CACT,CAAC,AAEC,MAAO,CAAC;EACN,KAAK,EnC/CI,OAAmB;CmC+CU;;AAE5C,AAAA,YAAY,CAAC;EACX,WAAW,EAAE,MAAM;EACnB,KAAK,EnChEQ,OAAe;EmCiE5B,OAAO,EAAE,IAAI;EACb,eAAe,EAAE,UAAU;EAC3B,OAAO,EAAE,YAAY;CAa2B;;AAlBlD,AAME,YANU,CAMV,KAAK,CAAA,AAAA,IAAC,CAAK,UAAU,AAAf,EAAiB;EACrB,YAAY,EAAE,MAAM;CAAI;;AAP5B,AAQM,YARM,GAQN,QAAQ,CAAC;EACX,SAAS,EAAE,CAAC;EACZ,WAAW,EAAE,CAAC;EACd,KAAK,EAAE,IAAI;CAAI;;AAXnB,AAYE,YAZU,AAYV,WAAY,CAAC;EACX,SAAS,EAAE,IAAI;CAAI;;AAbvB,AAcE,YAdU,AAcV,UAAW,CAAC;EACV,iBAAiB,EnChEN,OAAmB;EmCiE9B,KAAK,EnC9EM,OAAe;CmCgFkB;;AAlBhD,AAiBI,YAjBQ,AAcV,UAAW,CAGT,WAAW,CAAC;EACV,KAAK,EnCnEI,OAAmB;CmCmEY;;AAE9C,AAAA,CAAC,AAAA,YAAY;AACb,AAAA,KAAK,AAAA,YAAY,CAAC;EAChB,MAAM,EAAE,OAAO;CAE6C;;AAJ9D,AAGE,CAHD,AAAA,YAAY,AAGZ,MAAQ;AAFT,AAEE,KAFG,AAAA,YAAY,AAEhB,MAAQ,CAAC;EACN,gBAAgB,EnChFL,UAAe;CmCgF8B;;AAE5D,AAAA,WAAW,CAAC;E/BGV,OAAO,EAAE,YAAY;EACrB,SAAS,E+BHG,IAAI;E/BIhB,MAAM,E+BJY,GAAG;E/BKrB,WAAW,E+BLO,GAAG;E/BMrB,UAAU,EAAE,MAAM;EAClB,cAAc,EAAE,GAAG;EACnB,KAAK,E+BRa,GAAG;EACrB,KAAK,EnCxFQ,OAAe;EmCyF5B,YAAY,EAAE,MAAM;CAGQ;;AAN9B,AAIE,WAJS,CAIT,GAAG,CAAC;EACF,SAAS,EAAE,OAAO;EAClB,WAAW,EAAE,OAAO;CAAI;;ACxE5B,AAAA,KAAK,CAAC;EhCkIJ,0BAA0B,EAAE,KAAK;EAgBjC,qBAAqB,EAAE,IAAI;EAC3B,mBAAmB,EAAE,IAAI;EACzB,gBAAgB,EAAE,IAAI;EACtB,eAAe,EAAE,IAAI;EACrB,WAAW,EAAE,IAAI;EgClJjB,WAAW,EAAE,OAAO;EACpB,OAAO,EAAE,IAAI;EACb,SAAS,EpCCF,IAAI;EoCAX,eAAe,EAAE,aAAa;EAC9B,QAAQ,EAAE,MAAM;EAChB,UAAU,EAAE,IAAI;EAChB,WAAW,EAAE,MAAM;CAsGU;;AAhH/B,AhCfE,KgCeG,AhCfd,IAAiB,CAAA,AAAA,WAAW,EAAE;EACjB,aAAa,EAAE,MAAM;CAAI;;AgCc7B,AAWE,KAXG,CAWH,CAAC,CAAC;EACA,WAAW,EAAE,MAAM;EACnB,mBAAmB,EpC/BR,OAAe;EoCgC1B,mBAAmB,EAzCI,KAAK;EA0C5B,mBAAmB,EAzCI,GAAG;EA0C1B,KAAK,EpCrCM,OAAe;EoCsC1B,OAAO,EAAE,IAAI;EACb,eAAe,EAAE,MAAM;EACvB,aAAa,EAAE,IAA8B;EAC7C,OAAO,EAxCS,KAAK,CAAC,GAAG;EAyCzB,cAAc,EAAE,GAAG;CAGiB;;AAxBxC,AAWE,KAXG,CAWH,CAAC,AAWC,MAAO,CAAC;EACN,mBAAmB,EpC7CV,OAAe;EoC8CxB,KAAK,EpC9CI,OAAe;CoC8CQ;;AAxBtC,AAyBE,KAzBG,CAyBH,EAAE,CAAC;EACD,OAAO,EAAE,KAAK;CAI2B;;AA9B7C,AA4BM,KA5BD,CAyBH,EAAE,AAEA,UAAW,CACT,CAAC,CAAC;EACA,mBAAmB,EpCtCZ,OAAmB;EoCuC1B,KAAK,EpCvCE,OAAmB;CoCuCO;;AA9BzC,AA+BE,KA/BG,CA+BH,EAAE,CAAC;EACD,WAAW,EAAE,MAAM;EACnB,mBAAmB,EpCnDR,OAAe;EoCoD1B,mBAAmB,EA7DI,KAAK;EA8D5B,mBAAmB,EA7DI,GAAG;EA8D1B,OAAO,EAAE,IAAI;EACb,SAAS,EAAE,CAAC;EACZ,WAAW,EAAE,CAAC;EACd,eAAe,EAAE,UAAU;CAUC;;AAjDhC,AA+BE,KA/BG,CA+BH,EAAE,AASA,QAAS,CAAC;EACR,aAAa,EAAE,MAAM;CAAI;;AAzC/B,AA+BE,KA/BG,CA+BH,EAAE,AAWA,UAAW,CAAC;EACV,IAAI,EAAE,IAAI;EACV,eAAe,EAAE,MAAM;EACvB,YAAY,EAAE,MAAM;EACpB,aAAa,EAAE,MAAM;CAAI;;AA9C/B,AA+BE,KA/BG,CA+BH,EAAE,AAgBA,SAAU,CAAC;EACT,eAAe,EAAE,QAAQ;EACzB,YAAY,EAAE,MAAM;CAAI;;AAjD9B,AAkDE,KAlDG,CAkDH,KAAK,AACH,YAAa,CAAC;EACZ,YAAY,EAAE,KAAK;CAAI;;AApD7B,AAkDE,KAlDG,CAkDH,KAAK,AAGH,WAAY,CAAC;EACX,WAAW,EAAE,KAAK;CAAI;;AAtD5B,AAyDI,KAzDC,AAwDH,YAAa,CACX,EAAE,CAAC;EACD,eAAe,EAAE,MAAM;CAAI;;AA1DjC,AA4DI,KA5DC,AA2DH,SAAU,CACR,EAAE,CAAC;EACD,eAAe,EAAE,QAAQ;CAAI;;AA7DnC,AAgEI,KAhEC,AA+DH,SAAU,CACR,CAAC,CAAC;EACA,MAAM,EAAE,qBAAqB;EAC7B,aAAa,EpCjCV,GAAG,CAAH,GAAG,CoCiCyD,CAAC,CAAC,CAAC;CAGI;;AArE5E,AAgEI,KAhEC,AA+DH,SAAU,CACR,CAAC,AAGC,MAAO,CAAC;EACN,gBAAgB,EpCpFT,UAAe;EoCqFtB,mBAAmB,EpCvFZ,OAAe;CoCuF4C;;AArE1E,AAwEQ,KAxEH,AA+DH,SAAU,CAOR,EAAE,AACA,UAAW,CACT,CAAC,CAAC;EACA,gBAAgB,EpCvFX,KAAgB;EoCwFrB,YAAY,EpC5FP,OAAe;EoC6FpB,mBAAmB,EAvFgB,WAAW,CAAC,UAAU;CAuFU;;AA3E7E,AA6EI,KA7EC,AA4EH,aAAc,CACZ,EAAE,CAAC;EACD,SAAS,EAAE,CAAC;EACZ,WAAW,EAAE,CAAC;CAAI;;AA/ExB,AAiFI,KAjFC,AAgFH,UAAW,CACT,CAAC,CAAC;EACA,YAAY,EpCpGH,OAAe;EoCqGxB,YAAY,EA5Fc,KAAK;EA6F/B,YAAY,EA5Fc,GAAG;EA6F7B,aAAa,EAAE,CAAC;EAChB,QAAQ,EAAE,QAAQ;CAIA;;AA1FxB,AAiFI,KAjFC,AAgFH,UAAW,CACT,CAAC,AAMC,MAAO,CAAC;EACN,gBAAgB,EpCxGT,UAAe;EoCyGtB,YAAY,EpC5GL,OAAe;EoC6GtB,OAAO,EAAE,CAAC;CAAI;;AA1FtB,AA4FU,KA5FL,AAgFH,UAAW,CAWT,EAAE,GACI,EAAE,CAAC;EACL,WAAW,EAAE,IAAmC;CAAG;;AA7F3D,AA8FoB,KA9Ff,AAgFH,UAAW,CAWT,EAAE,AAGA,YAAa,CAAC,CAAC,CAAC;EACd,aAAa,EpC9DZ,GAAG,CoC8DoC,CAAC,CAAC,CAAC,CpC9D1C,GAAG;CoC8DmE;;AA/F/E,AAgGmB,KAhGd,AAgFH,UAAW,CAWT,EAAE,AAKA,WAAY,CAAC,CAAC,CAAC;EACb,aAAa,EAAE,CAAC,CpChEf,GAAG,CAAH,GAAG,CoCgE+D,CAAC;CAAG;;AAjG/E,AAmGQ,KAnGH,AAgFH,UAAW,CAWT,EAAE,AAOA,UAAW,CACT,CAAC,CAAC;EACA,gBAAgB,EpC7GX,OAAmB;EoC8GxB,YAAY,EpC9GP,OAAmB;EoC+GxB,KAAK,EnCvGH,IAAI;EmCwGN,OAAO,EAAE,CAAC;CAAI;;AAvGxB,AAwGI,KAxGC,AAgFH,UAAW,CAwBT,EAAE,CAAC;EACD,aAAa,EAAE,IAAI;CAAI;;AAzG7B,AA2GE,KA3GG,AA2GH,SAAU,CAAC;EACT,SAAS,EpCpGJ,OAAO;CoCoGa;;AA5G7B,AA6GE,KA7GG,AA6GH,UAAW,CAAC;EACV,SAAS,EpCxGJ,OAAO;CoCwGc;;AA9G9B,AA+GE,KA/GG,AA+GH,SAAU,CAAC;EACT,SAAS,EpC3GJ,MAAM;CoC2Gc;;AE5I7B,AAAA,OAAO,CAAC;EACN,OAAO,EAAE,KAAK;EACd,UAAU,EAAE,CAAC;EACb,SAAS,EAAE,CAAC;EACZ,WAAW,EAAE,CAAC;EACd,OAAO,EAAE,OAAO;CAgR4B;;AA/Q5C,AAAqB,QAAb,AAAA,UAAU,GANpB,OAAO,AAMgB,UAAW,CAAC;EAC/B,IAAI,EAAE,IAAI;CAAI;;AAChB,AAAqB,QAAb,AAAA,UAAU,GARpB,OAAO,AAQgB,QAAS,CAAC;EAC7B,IAAI,EAAE,IAAI;EACV,KAAK,EAAE,IAAI;CAAI;;AACjB,AAAqB,QAAb,AAAA,UAAU,GAXpB,OAAO,AAWgB,kBAAmB,CAAC;EACvC,IAAI,EAAE,IAAI;EACV,KAAK,EAAE,GAAG;CAAI;;AAChB,AAAqB,QAAb,AAAA,UAAU,GAdpB,OAAO,AAcgB,cAAe,CAAC;EACnC,IAAI,EAAE,IAAI;EACV,KAAK,EAAE,QAAQ;CAAI;;AACrB,AAAqB,QAAb,AAAA,UAAU,GAjBpB,OAAO,AAiBgB,QAAS,CAAC;EAC7B,IAAI,EAAE,IAAI;EACV,KAAK,EAAE,GAAG;CAAI;;AAChB,AAAqB,QAAb,AAAA,UAAU,GApBpB,OAAO,AAoBgB,aAAc,CAAC;EAClC,IAAI,EAAE,IAAI;EACV,KAAK,EAAE,QAAQ;CAAI;;AACrB,AAAqB,QAAb,AAAA,UAAU,GAvBpB,OAAO,AAuBgB,eAAgB,CAAC;EACpC,IAAI,EAAE,IAAI;EACV,KAAK,EAAE,GAAG;CAAI;;AAChB,AAAqB,QAAb,AAAA,UAAU,GA1BpB,OAAO,AA0BgB,yBAA0B,CAAC;EAC9C,WAAW,EAAE,GAAG;CAAI;;AACtB,AAAqB,QAAb,AAAA,UAAU,GA5BpB,OAAO,AA4BgB,qBAAsB,CAAC;EAC1C,WAAW,EAAE,QAAQ;CAAI;;AAC3B,AAAqB,QAAb,AAAA,UAAU,GA9BpB,OAAO,AA8BgB,eAAgB,CAAC;EACpC,WAAW,EAAE,GAAG;CAAI;;AACtB,AAAqB,QAAb,AAAA,UAAU,GAhCpB,OAAO,AAgCgB,oBAAqB,CAAC;EACzC,WAAW,EAAE,QAAQ;CAAI;;AAC3B,AAAqB,QAAb,AAAA,UAAU,GAlCpB,OAAO,AAkCgB,sBAAuB,CAAC;EAC3C,WAAW,EAAE,GAAG;CAAI;;AAEpB,AAAqB,QAAb,AAAA,UAAU,GArCtB,OAAO,AAqCkB,KAAM,CAAK;EAC9B,IAAI,EAAE,IAAI;EACV,KAAK,EAAE,QAAgB;CAAG;;AAC5B,AAAqB,QAAb,AAAA,UAAU,GAxCtB,OAAO,AAwCkB,YAAa,CAAK;EACrC,WAAW,EAAE,QAAgB;CAAG;;AAJlC,AAAqB,QAAb,AAAA,UAAU,GArCtB,OAAO,AAqCkB,KAAM,CAAK;EAC9B,IAAI,EAAE,IAAI;EACV,KAAK,EAAE,SAAgB;CAAG;;AAC5B,AAAqB,QAAb,AAAA,UAAU,GAxCtB,OAAO,AAwCkB,YAAa,CAAK;EACrC,WAAW,EAAE,SAAgB;CAAG;;AAJlC,AAAqB,QAAb,AAAA,UAAU,GArCtB,OAAO,AAqCkB,KAAM,CAAK;EAC9B,IAAI,EAAE,IAAI;EACV,KAAK,EAAE,GAAgB;CAAG;;AAC5B,AAAqB,QAAb,AAAA,UAAU,GAxCtB,OAAO,AAwCkB,YAAa,CAAK;EACrC,WAAW,EAAE,GAAgB;CAAG;;AAJlC,AAAqB,QAAb,AAAA,UAAU,GArCtB,OAAO,AAqCkB,KAAM,CAAK;EAC9B,IAAI,EAAE,IAAI;EACV,KAAK,EAAE,SAAgB;CAAG;;AAC5B,AAAqB,QAAb,AAAA,UAAU,GAxCtB,OAAO,AAwCkB,YAAa,CAAK;EACrC,WAAW,EAAE,SAAgB;CAAG;;AAJlC,AAAqB,QAAb,AAAA,UAAU,GArCtB,OAAO,AAqCkB,KAAM,CAAK;EAC9B,IAAI,EAAE,IAAI;EACV,KAAK,EAAE,SAAgB;CAAG;;AAC5B,AAAqB,QAAb,AAAA,UAAU,GAxCtB,OAAO,AAwCkB,YAAa,CAAK;EACrC,WAAW,EAAE,SAAgB;CAAG;;AAJlC,AAAqB,QAAb,AAAA,UAAU,GArCtB,OAAO,AAqCkB,KAAM,CAAK;EAC9B,IAAI,EAAE,IAAI;EACV,KAAK,EAAE,GAAgB;CAAG;;AAC5B,AAAqB,QAAb,AAAA,UAAU,GAxCtB,OAAO,AAwCkB,YAAa,CAAK;EACrC,WAAW,EAAE,GAAgB;CAAG;;AAJlC,AAAqB,QAAb,AAAA,UAAU,GArCtB,OAAO,AAqCkB,KAAM,CAAK;EAC9B,IAAI,EAAE,IAAI;EACV,KAAK,EAAE,SAAgB;CAAG;;AAC5B,AAAqB,QAAb,AAAA,UAAU,GAxCtB,OAAO,AAwCkB,YAAa,CAAK;EACrC,WAAW,EAAE,SAAgB;CAAG;;AAJlC,AAAqB,QAAb,AAAA,UAAU,GArCtB,OAAO,AAqCkB,KAAM,CAAK;EAC9B,IAAI,EAAE,IAAI;EACV,KAAK,EAAE,SAAgB;CAAG;;AAC5B,AAAqB,QAAb,AAAA,UAAU,GAxCtB,OAAO,AAwCkB,YAAa,CAAK;EACrC,WAAW,EAAE,SAAgB;CAAG;;AAJlC,AAAqB,QAAb,AAAA,UAAU,GArCtB,OAAO,AAqCkB,KAAM,CAAK;EAC9B,IAAI,EAAE,IAAI;EACV,KAAK,EAAE,GAAgB;CAAG;;AAC5B,AAAqB,QAAb,AAAA,UAAU,GAxCtB,OAAO,AAwCkB,YAAa,CAAK;EACrC,WAAW,EAAE,GAAgB;CAAG;;AAJlC,AAAqB,QAAb,AAAA,UAAU,GArCtB,OAAO,AAqCkB,MAAO,CAAI;EAC9B,IAAI,EAAE,IAAI;EACV,KAAK,EAAE,SAAgB;CAAG;;AAC5B,AAAqB,QAAb,AAAA,UAAU,GAxCtB,OAAO,AAwCkB,aAAc,CAAI;EACrC,WAAW,EAAE,SAAgB;CAAG;;AAJlC,AAAqB,QAAb,AAAA,UAAU,GArCtB,OAAO,AAqCkB,MAAO,CAAI;EAC9B,IAAI,EAAE,IAAI;EACV,KAAK,EAAE,SAAgB;CAAG;;AAC5B,AAAqB,QAAb,AAAA,UAAU,GAxCtB,OAAO,AAwCkB,aAAc,CAAI;EACrC,WAAW,EAAE,SAAgB;CAAG;;AAJlC,AAAqB,QAAb,AAAA,UAAU,GArCtB,OAAO,AAqCkB,MAAO,CAAI;EAC9B,IAAI,EAAE,IAAI;EACV,KAAK,EAAE,IAAgB;CAAG;;AAC5B,AAAqB,QAAb,AAAA,UAAU,GAxCtB,OAAO,AAwCkB,aAAc,CAAI;EACrC,WAAW,EAAE,IAAgB;CAAG;;AlCsJpC,MAAM,CAAC,MAAM,MAAM,SAAS,EAAE,KAAK;EkC/LrC,AA2CI,OA3CG,AA2CH,iBAAkB,CAAC;IACjB,IAAI,EAAE,IAAI;GAAI;EA5CpB,AA6CI,OA7CG,AA6CH,eAAgB,CAAC;IACf,IAAI,EAAE,IAAI;IACV,KAAK,EAAE,IAAI;GAAI;EA/CrB,AAgDI,OAhDG,AAgDH,yBAA0B,CAAC;IACzB,IAAI,EAAE,IAAI;IACV,KAAK,EAAE,GAAG;GAAI;EAlDpB,AAmDI,OAnDG,AAmDH,qBAAsB,CAAC;IACrB,IAAI,EAAE,IAAI;IACV,KAAK,EAAE,QAAQ;GAAI;EArDzB,AAsDI,OAtDG,AAsDH,eAAgB,CAAC;IACf,IAAI,EAAE,IAAI;IACV,KAAK,EAAE,GAAG;GAAI;EAxDpB,AAyDI,OAzDG,AAyDH,oBAAqB,CAAC;IACpB,IAAI,EAAE,IAAI;IACV,KAAK,EAAE,QAAQ;GAAI;EA3DzB,AA4DI,OA5DG,AA4DH,sBAAuB,CAAC;IACtB,IAAI,EAAE,IAAI;IACV,KAAK,EAAE,GAAG;GAAI;EA9DpB,AA+DI,OA/DG,AA+DH,gCAAiC,CAAC;IAChC,WAAW,EAAE,GAAG;GAAI;EAhE1B,AAiEI,OAjEG,AAiEH,4BAA6B,CAAC;IAC5B,WAAW,EAAE,QAAQ;GAAI;EAlE/B,AAmEI,OAnEG,AAmEH,sBAAuB,CAAC;IACtB,WAAW,EAAE,GAAG;GAAI;EApE1B,AAqEI,OArEG,AAqEH,2BAA4B,CAAC;IAC3B,WAAW,EAAE,QAAQ;GAAI;EAtE/B,AAuEI,OAvEG,AAuEH,6BAA8B,CAAC;IAC7B,WAAW,EAAE,GAAG;GAAI;EAxE1B,AA0EM,OA1EC,AA0ED,YAAa,CAAK;IAChB,IAAI,EAAE,IAAI;IACV,KAAK,EAAE,QAAgB;GAAG;EA5ElC,AA6EM,OA7EC,AA6ED,mBAAoB,CAAK;IACvB,WAAW,EAAE,QAAgB;GAAG;EA9ExC,AA0EM,OA1EC,AA0ED,YAAa,CAAK;IAChB,IAAI,EAAE,IAAI;IACV,KAAK,EAAE,SAAgB;GAAG;EA5ElC,AA6EM,OA7EC,AA6ED,mBAAoB,CAAK;IACvB,WAAW,EAAE,SAAgB;GAAG;EA9ExC,AA0EM,OA1EC,AA0ED,YAAa,CAAK;IAChB,IAAI,EAAE,IAAI;IACV,KAAK,EAAE,GAAgB;GAAG;EA5ElC,AA6EM,OA7EC,AA6ED,mBAAoB,CAAK;IACvB,WAAW,EAAE,GAAgB;GAAG;EA9ExC,AA0EM,OA1EC,AA0ED,YAAa,CAAK;IAChB,IAAI,EAAE,IAAI;IACV,KAAK,EAAE,SAAgB;GAAG;EA5ElC,AA6EM,OA7EC,AA6ED,mBAAoB,CAAK;IACvB,WAAW,EAAE,SAAgB;GAAG;EA9ExC,AA0EM,OA1EC,AA0ED,YAAa,CAAK;IAChB,IAAI,EAAE,IAAI;IACV,KAAK,EAAE,SAAgB;GAAG;EA5ElC,AA6EM,OA7EC,AA6ED,mBAAoB,CAAK;IACvB,WAAW,EAAE,SAAgB;GAAG;EA9ExC,AA0EM,OA1EC,AA0ED,YAAa,CAAK;IAChB,IAAI,EAAE,IAAI;IACV,KAAK,EAAE,GAAgB;GAAG;EA5ElC,AA6EM,OA7EC,AA6ED,mBAAoB,CAAK;IACvB,WAAW,EAAE,GAAgB;GAAG;EA9ExC,AA0EM,OA1EC,AA0ED,YAAa,CAAK;IAChB,IAAI,EAAE,IAAI;IACV,KAAK,EAAE,SAAgB;GAAG;EA5ElC,AA6EM,OA7EC,AA6ED,mBAAoB,CAAK;IACvB,WAAW,EAAE,SAAgB;GAAG;EA9ExC,AA0EM,OA1EC,AA0ED,YAAa,CAAK;IAChB,IAAI,EAAE,IAAI;IACV,KAAK,EAAE,SAAgB;GAAG;EA5ElC,AA6EM,OA7EC,AA6ED,mBAAoB,CAAK;IACvB,WAAW,EAAE,SAAgB;GAAG;EA9ExC,AA0EM,OA1EC,AA0ED,YAAa,CAAK;IAChB,IAAI,EAAE,IAAI;IACV,KAAK,EAAE,GAAgB;GAAG;EA5ElC,AA6EM,OA7EC,AA6ED,mBAAoB,CAAK;IACvB,WAAW,EAAE,GAAgB;GAAG;EA9ExC,AA0EM,OA1EC,AA0ED,aAAc,CAAI;IAChB,IAAI,EAAE,IAAI;IACV,KAAK,EAAE,SAAgB;GAAG;EA5ElC,AA6EM,OA7EC,AA6ED,oBAAqB,CAAI;IACvB,WAAW,EAAE,SAAgB;GAAG;EA9ExC,AA0EM,OA1EC,AA0ED,aAAc,CAAI;IAChB,IAAI,EAAE,IAAI;IACV,KAAK,EAAE,SAAgB;GAAG;EA5ElC,AA6EM,OA7EC,AA6ED,oBAAqB,CAAI;IACvB,WAAW,EAAE,SAAgB;GAAG;EA9ExC,AA0EM,OA1EC,AA0ED,aAAc,CAAI;IAChB,IAAI,EAAE,IAAI;IACV,KAAK,EAAE,IAAgB;GAAG;EA5ElC,AA6EM,OA7EC,AA6ED,oBAAqB,CAAI;IACvB,WAAW,EAAE,IAAgB;GAAG;;;AlCqHtC,MAAM,CAAC,MAAM,MAAM,SAAS,EAAE,KAAK,GAAG,KAAK;EkCnM7C,AAgFI,OAhFG,AAgFH,UAAW,EAhFf,AAiFI,OAjFG,AAiFH,iBAAkB,CAAC;IACjB,IAAI,EAAE,IAAI;GAAI;EAlFpB,AAmFI,OAnFG,AAmFH,QAAS,EAnFb,AAoFI,OApFG,AAoFH,eAAgB,CAAC;IACf,IAAI,EAAE,IAAI;IACV,KAAK,EAAE,IAAI;GAAI;EAtFrB,AAuFI,OAvFG,AAuFH,kBAAmB,EAvFvB,AAwFI,OAxFG,AAwFH,yBAA0B,CAAC;IACzB,IAAI,EAAE,IAAI;IACV,KAAK,EAAE,GAAG;GAAI;EA1FpB,AA2FI,OA3FG,AA2FH,cAAe,EA3FnB,AA4FI,OA5FG,AA4FH,qBAAsB,CAAC;IACrB,IAAI,EAAE,IAAI;IACV,KAAK,EAAE,QAAQ;GAAI;EA9FzB,AA+FI,OA/FG,AA+FH,QAAS,EA/Fb,AAgGI,OAhGG,AAgGH,eAAgB,CAAC;IACf,IAAI,EAAE,IAAI;IACV,KAAK,EAAE,GAAG;GAAI;EAlGpB,AAmGI,OAnGG,AAmGH,aAAc,EAnGlB,AAoGI,OApGG,AAoGH,oBAAqB,CAAC;IACpB,IAAI,EAAE,IAAI;IACV,KAAK,EAAE,QAAQ;GAAI;EAtGzB,AAuGI,OAvGG,AAuGH,eAAgB,EAvGpB,AAwGI,OAxGG,AAwGH,sBAAuB,CAAC;IACtB,IAAI,EAAE,IAAI;IACV,KAAK,EAAE,GAAG;GAAI;EA1GpB,AA2GI,OA3GG,AA2GH,yBAA0B,EA3G9B,AA4GI,OA5GG,AA4GH,gCAAiC,CAAC;IAChC,WAAW,EAAE,GAAG;GAAI;EA7G1B,AA8GI,OA9GG,AA8GH,qBAAsB,EA9G1B,AA+GI,OA/GG,AA+GH,4BAA6B,CAAC;IAC5B,WAAW,EAAE,QAAQ;GAAI;EAhH/B,AAiHI,OAjHG,AAiHH,eAAgB,EAjHpB,AAkHI,OAlHG,AAkHH,sBAAuB,CAAC;IACtB,WAAW,EAAE,GAAG;GAAI;EAnH1B,AAoHI,OApHG,AAoHH,oBAAqB,EApHzB,AAqHI,OArHG,AAqHH,2BAA4B,CAAC;IAC3B,WAAW,EAAE,QAAQ;GAAI;EAtH/B,AAuHI,OAvHG,AAuHH,sBAAuB,EAvH3B,AAwHI,OAxHG,AAwHH,6BAA8B,CAAC;IAC7B,WAAW,EAAE,GAAG;GAAI;EAzH1B,AA2HM,OA3HC,AA2HD,KAAM,EA3HZ,AA4HM,OA5HC,AA4HD,YAAa,CAAK;IAChB,IAAI,EAAE,IAAI;IACV,KAAK,EAAE,QAAgB;GAAG;EA9HlC,AA+HM,OA/HC,AA+HD,YAAa,EA/HnB,AAgIM,OAhIC,AAgID,mBAAoB,CAAK;IACvB,WAAW,EAAE,QAAgB;GAAG;EAjIxC,AA2HM,OA3HC,AA2HD,KAAM,EA3HZ,AA4HM,OA5HC,AA4HD,YAAa,CAAK;IAChB,IAAI,EAAE,IAAI;IACV,KAAK,EAAE,SAAgB;GAAG;EA9HlC,AA+HM,OA/HC,AA+HD,YAAa,EA/HnB,AAgIM,OAhIC,AAgID,mBAAoB,CAAK;IACvB,WAAW,EAAE,SAAgB;GAAG;EAjIxC,AA2HM,OA3HC,AA2HD,KAAM,EA3HZ,AA4HM,OA5HC,AA4HD,YAAa,CAAK;IAChB,IAAI,EAAE,IAAI;IACV,KAAK,EAAE,GAAgB;GAAG;EA9HlC,AA+HM,OA/HC,AA+HD,YAAa,EA/HnB,AAgIM,OAhIC,AAgID,mBAAoB,CAAK;IACvB,WAAW,EAAE,GAAgB;GAAG;EAjIxC,AA2HM,OA3HC,AA2HD,KAAM,EA3HZ,AA4HM,OA5HC,AA4HD,YAAa,CAAK;IAChB,IAAI,EAAE,IAAI;IACV,KAAK,EAAE,SAAgB;GAAG;EA9HlC,AA+HM,OA/HC,AA+HD,YAAa,EA/HnB,AAgIM,OAhIC,AAgID,mBAAoB,CAAK;IACvB,WAAW,EAAE,SAAgB;GAAG;EAjIxC,AA2HM,OA3HC,AA2HD,KAAM,EA3HZ,AA4HM,OA5HC,AA4HD,YAAa,CAAK;IAChB,IAAI,EAAE,IAAI;IACV,KAAK,EAAE,SAAgB;GAAG;EA9HlC,AA+HM,OA/HC,AA+HD,YAAa,EA/HnB,AAgIM,OAhIC,AAgID,mBAAoB,CAAK;IACvB,WAAW,EAAE,SAAgB;GAAG;EAjIxC,AA2HM,OA3HC,AA2HD,KAAM,EA3HZ,AA4HM,OA5HC,AA4HD,YAAa,CAAK;IAChB,IAAI,EAAE,IAAI;IACV,KAAK,EAAE,GAAgB;GAAG;EA9HlC,AA+HM,OA/HC,AA+HD,YAAa,EA/HnB,AAgIM,OAhIC,AAgID,mBAAoB,CAAK;IACvB,WAAW,EAAE,GAAgB;GAAG;EAjIxC,AA2HM,OA3HC,AA2HD,KAAM,EA3HZ,AA4HM,OA5HC,AA4HD,YAAa,CAAK;IAChB,IAAI,EAAE,IAAI;IACV,KAAK,EAAE,SAAgB;GAAG;EA9HlC,AA+HM,OA/HC,AA+HD,YAAa,EA/HnB,AAgIM,OAhIC,AAgID,mBAAoB,CAAK;IACvB,WAAW,EAAE,SAAgB;GAAG;EAjIxC,AA2HM,OA3HC,AA2HD,KAAM,EA3HZ,AA4HM,OA5HC,AA4HD,YAAa,CAAK;IAChB,IAAI,EAAE,IAAI;IACV,KAAK,EAAE,SAAgB;GAAG;EA9HlC,AA+HM,OA/HC,AA+HD,YAAa,EA/HnB,AAgIM,OAhIC,AAgID,mBAAoB,CAAK;IACvB,WAAW,EAAE,SAAgB;GAAG;EAjIxC,AA2HM,OA3HC,AA2HD,KAAM,EA3HZ,AA4HM,OA5HC,AA4HD,YAAa,CAAK;IAChB,IAAI,EAAE,IAAI;IACV,KAAK,EAAE,GAAgB;GAAG;EA9HlC,AA+HM,OA/HC,AA+HD,YAAa,EA/HnB,AAgIM,OAhIC,AAgID,mBAAoB,CAAK;IACvB,WAAW,EAAE,GAAgB;GAAG;EAjIxC,AA2HM,OA3HC,AA2HD,MAAO,EA3Hb,AA4HM,OA5HC,AA4HD,aAAc,CAAI;IAChB,IAAI,EAAE,IAAI;IACV,KAAK,EAAE,SAAgB;GAAG;EA9HlC,AA+HM,OA/HC,AA+HD,aAAc,EA/HpB,AAgIM,OAhIC,AAgID,oBAAqB,CAAI;IACvB,WAAW,EAAE,SAAgB;GAAG;EAjIxC,AA2HM,OA3HC,AA2HD,MAAO,EA3Hb,AA4HM,OA5HC,AA4HD,aAAc,CAAI;IAChB,IAAI,EAAE,IAAI;IACV,KAAK,EAAE,SAAgB;GAAG;EA9HlC,AA+HM,OA/HC,AA+HD,aAAc,EA/HpB,AAgIM,OAhIC,AAgID,oBAAqB,CAAI;IACvB,WAAW,EAAE,SAAgB;GAAG;EAjIxC,AA2HM,OA3HC,AA2HD,MAAO,EA3Hb,AA4HM,OA5HC,AA4HD,aAAc,CAAI;IAChB,IAAI,EAAE,IAAI;IACV,KAAK,EAAE,IAAgB;GAAG;EA9HlC,AA+HM,OA/HC,AA+HD,aAAc,EA/HpB,AAgIM,OAhIC,AAgID,oBAAqB,CAAI;IACvB,WAAW,EAAE,IAAgB;GAAG;;;AlC0EtC,MAAM,CAAC,MAAM,MAAM,SAAS,EAAE,MAAM;EkC3MtC,AAmII,OAnIG,AAmIH,gBAAiB,CAAC;IAChB,IAAI,EAAE,IAAI;GAAI;EApIpB,AAqII,OArIG,AAqIH,cAAe,CAAC;IACd,IAAI,EAAE,IAAI;IACV,KAAK,EAAE,IAAI;GAAI;EAvIrB,AAwII,OAxIG,AAwIH,wBAAyB,CAAC;IACxB,IAAI,EAAE,IAAI;IACV,KAAK,EAAE,GAAG;GAAI;EA1IpB,AA2II,OA3IG,AA2IH,oBAAqB,CAAC;IACpB,IAAI,EAAE,IAAI;IACV,KAAK,EAAE,QAAQ;GAAI;EA7IzB,AA8II,OA9IG,AA8IH,cAAe,CAAC;IACd,IAAI,EAAE,IAAI;IACV,KAAK,EAAE,GAAG;GAAI;EAhJpB,AAiJI,OAjJG,AAiJH,mBAAoB,CAAC;IACnB,IAAI,EAAE,IAAI;IACV,KAAK,EAAE,QAAQ;GAAI;EAnJzB,AAoJI,OApJG,AAoJH,qBAAsB,CAAC;IACrB,IAAI,EAAE,IAAI;IACV,KAAK,EAAE,GAAG;GAAI;EAtJpB,AAuJI,OAvJG,AAuJH,+BAAgC,CAAC;IAC/B,WAAW,EAAE,GAAG;GAAI;EAxJ1B,AAyJI,OAzJG,AAyJH,2BAA4B,CAAC;IAC3B,WAAW,EAAE,QAAQ;GAAI;EA1J/B,AA2JI,OA3JG,AA2JH,qBAAsB,CAAC;IACrB,WAAW,EAAE,GAAG;GAAI;EA5J1B,AA6JI,OA7JG,AA6JH,0BAA2B,CAAC;IAC1B,WAAW,EAAE,QAAQ;GAAI;EA9J/B,AA+JI,OA/JG,AA+JH,4BAA6B,CAAC;IAC5B,WAAW,EAAE,GAAG;GAAI;EAhK1B,AAkKM,OAlKC,AAkKD,WAAY,CAAK;IACf,IAAI,EAAE,IAAI;IACV,KAAK,EAAE,QAAgB;GAAG;EApKlC,AAqKM,OArKC,AAqKD,kBAAmB,CAAK;IACtB,WAAW,EAAE,QAAgB;GAAG;EAtKxC,AAkKM,OAlKC,AAkKD,WAAY,CAAK;IACf,IAAI,EAAE,IAAI;IACV,KAAK,EAAE,SAAgB;GAAG;EApKlC,AAqKM,OArKC,AAqKD,kBAAmB,CAAK;IACtB,WAAW,EAAE,SAAgB;GAAG;EAtKxC,AAkKM,OAlKC,AAkKD,WAAY,CAAK;IACf,IAAI,EAAE,IAAI;IACV,KAAK,EAAE,GAAgB;GAAG;EApKlC,AAqKM,OArKC,AAqKD,kBAAmB,CAAK;IACtB,WAAW,EAAE,GAAgB;GAAG;EAtKxC,AAkKM,OAlKC,AAkKD,WAAY,CAAK;IACf,IAAI,EAAE,IAAI;IACV,KAAK,EAAE,SAAgB;GAAG;EApKlC,AAqKM,OArKC,AAqKD,kBAAmB,CAAK;IACtB,WAAW,EAAE,SAAgB;GAAG;EAtKxC,AAkKM,OAlKC,AAkKD,WAAY,CAAK;IACf,IAAI,EAAE,IAAI;IACV,KAAK,EAAE,SAAgB;GAAG;EApKlC,AAqKM,OArKC,AAqKD,kBAAmB,CAAK;IACtB,WAAW,EAAE,SAAgB;GAAG;EAtKxC,AAkKM,OAlKC,AAkKD,WAAY,CAAK;IACf,IAAI,EAAE,IAAI;IACV,KAAK,EAAE,GAAgB;GAAG;EApKlC,AAqKM,OArKC,AAqKD,kBAAmB,CAAK;IACtB,WAAW,EAAE,GAAgB;GAAG;EAtKxC,AAkKM,OAlKC,AAkKD,WAAY,CAAK;IACf,IAAI,EAAE,IAAI;IACV,KAAK,EAAE,SAAgB;GAAG;EApKlC,AAqKM,OArKC,AAqKD,kBAAmB,CAAK;IACtB,WAAW,EAAE,SAAgB;GAAG;EAtKxC,AAkKM,OAlKC,AAkKD,WAAY,CAAK;IACf,IAAI,EAAE,IAAI;IACV,KAAK,EAAE,SAAgB;GAAG;EApKlC,AAqKM,OArKC,AAqKD,kBAAmB,CAAK;IACtB,WAAW,EAAE,SAAgB;GAAG;EAtKxC,AAkKM,OAlKC,AAkKD,WAAY,CAAK;IACf,IAAI,EAAE,IAAI;IACV,KAAK,EAAE,GAAgB;GAAG;EApKlC,AAqKM,OArKC,AAqKD,kBAAmB,CAAK;IACtB,WAAW,EAAE,GAAgB;GAAG;EAtKxC,AAkKM,OAlKC,AAkKD,YAAa,CAAI;IACf,IAAI,EAAE,IAAI;IACV,KAAK,EAAE,SAAgB;GAAG;EApKlC,AAqKM,OArKC,AAqKD,mBAAoB,CAAI;IACtB,WAAW,EAAE,SAAgB;GAAG;EAtKxC,AAkKM,OAlKC,AAkKD,YAAa,CAAI;IACf,IAAI,EAAE,IAAI;IACV,KAAK,EAAE,SAAgB;GAAG;EApKlC,AAqKM,OArKC,AAqKD,mBAAoB,CAAI;IACtB,WAAW,EAAE,SAAgB;GAAG;EAtKxC,AAkKM,OAlKC,AAkKD,YAAa,CAAI;IACf,IAAI,EAAE,IAAI;IACV,KAAK,EAAE,IAAgB;GAAG;EApKlC,AAqKM,OArKC,AAqKD,mBAAoB,CAAI;IACtB,WAAW,EAAE,IAAgB;GAAG;;;AlCyCtC,MAAM,CAAC,MAAM,MAAM,SAAS,EAAE,MAAM;EkC/MtC,AAwKI,OAxKG,AAwKH,kBAAmB,CAAC;IAClB,IAAI,EAAE,IAAI;GAAI;EAzKpB,AA0KI,OA1KG,AA0KH,gBAAiB,CAAC;IAChB,IAAI,EAAE,IAAI;IACV,KAAK,EAAE,IAAI;GAAI;EA5KrB,AA6KI,OA7KG,AA6KH,0BAA2B,CAAC;IAC1B,IAAI,EAAE,IAAI;IACV,KAAK,EAAE,GAAG;GAAI;EA/KpB,AAgLI,OAhLG,AAgLH,sBAAuB,CAAC;IACtB,IAAI,EAAE,IAAI;IACV,KAAK,EAAE,QAAQ;GAAI;EAlLzB,AAmLI,OAnLG,AAmLH,gBAAiB,CAAC;IAChB,IAAI,EAAE,IAAI;IACV,KAAK,EAAE,GAAG;GAAI;EArLpB,AAsLI,OAtLG,AAsLH,qBAAsB,CAAC;IACrB,IAAI,EAAE,IAAI;IACV,KAAK,EAAE,QAAQ;GAAI;EAxLzB,AAyLI,OAzLG,AAyLH,uBAAwB,CAAC;IACvB,IAAI,EAAE,IAAI;IACV,KAAK,EAAE,GAAG;GAAI;EA3LpB,AA4LI,OA5LG,AA4LH,iCAAkC,CAAC;IACjC,WAAW,EAAE,GAAG;GAAI;EA7L1B,AA8LI,OA9LG,AA8LH,6BAA8B,CAAC;IAC7B,WAAW,EAAE,QAAQ;GAAI;EA/L/B,AAgMI,OAhMG,AAgMH,uBAAwB,CAAC;IACvB,WAAW,EAAE,GAAG;GAAI;EAjM1B,AAkMI,OAlMG,AAkMH,4BAA6B,CAAC;IAC5B,WAAW,EAAE,QAAQ;GAAI;EAnM/B,AAoMI,OApMG,AAoMH,8BAA+B,CAAC;IAC9B,WAAW,EAAE,GAAG;GAAI;EArM1B,AAuMM,OAvMC,AAuMD,aAAc,CAAK;IACjB,IAAI,EAAE,IAAI;IACV,KAAK,EAAE,QAAgB;GAAG;EAzMlC,AA0MM,OA1MC,AA0MD,oBAAqB,CAAK;IACxB,WAAW,EAAE,QAAgB;GAAG;EA3MxC,AAuMM,OAvMC,AAuMD,aAAc,CAAK;IACjB,IAAI,EAAE,IAAI;IACV,KAAK,EAAE,SAAgB;GAAG;EAzMlC,AA0MM,OA1MC,AA0MD,oBAAqB,CAAK;IACxB,WAAW,EAAE,SAAgB;GAAG;EA3MxC,AAuMM,OAvMC,AAuMD,aAAc,CAAK;IACjB,IAAI,EAAE,IAAI;IACV,KAAK,EAAE,GAAgB;GAAG;EAzMlC,AA0MM,OA1MC,AA0MD,oBAAqB,CAAK;IACxB,WAAW,EAAE,GAAgB;GAAG;EA3MxC,AAuMM,OAvMC,AAuMD,aAAc,CAAK;IACjB,IAAI,EAAE,IAAI;IACV,KAAK,EAAE,SAAgB;GAAG;EAzMlC,AA0MM,OA1MC,AA0MD,oBAAqB,CAAK;IACxB,WAAW,EAAE,SAAgB;GAAG;EA3MxC,AAuMM,OAvMC,AAuMD,aAAc,CAAK;IACjB,IAAI,EAAE,IAAI;IACV,KAAK,EAAE,SAAgB;GAAG;EAzMlC,AA0MM,OA1MC,AA0MD,oBAAqB,CAAK;IACxB,WAAW,EAAE,SAAgB;GAAG;EA3MxC,AAuMM,OAvMC,AAuMD,aAAc,CAAK;IACjB,IAAI,EAAE,IAAI;IACV,KAAK,EAAE,GAAgB;GAAG;EAzMlC,AA0MM,OA1MC,AA0MD,oBAAqB,CAAK;IACxB,WAAW,EAAE,GAAgB;GAAG;EA3MxC,AAuMM,OAvMC,AAuMD,aAAc,CAAK;IACjB,IAAI,EAAE,IAAI;IACV,KAAK,EAAE,SAAgB;GAAG;EAzMlC,AA0MM,OA1MC,AA0MD,oBAAqB,CAAK;IACxB,WAAW,EAAE,SAAgB;GAAG;EA3MxC,AAuMM,OAvMC,AAuMD,aAAc,CAAK;IACjB,IAAI,EAAE,IAAI;IACV,KAAK,EAAE,SAAgB;GAAG;EAzMlC,AA0MM,OA1MC,AA0MD,oBAAqB,CAAK;IACxB,WAAW,EAAE,SAAgB;GAAG;EA3MxC,AAuMM,OAvMC,AAuMD,aAAc,CAAK;IACjB,IAAI,EAAE,IAAI;IACV,KAAK,EAAE,GAAgB;GAAG;EAzMlC,AA0MM,OA1MC,AA0MD,oBAAqB,CAAK;IACxB,WAAW,EAAE,GAAgB;GAAG;EA3MxC,AAuMM,OAvMC,AAuMD,cAAe,CAAI;IACjB,IAAI,EAAE,IAAI;IACV,KAAK,EAAE,SAAgB;GAAG;EAzMlC,AA0MM,OA1MC,AA0MD,qBAAsB,CAAI;IACxB,WAAW,EAAE,SAAgB;GAAG;EA3MxC,AAuMM,OAvMC,AAuMD,cAAe,CAAI;IACjB,IAAI,EAAE,IAAI;IACV,KAAK,EAAE,SAAgB;GAAG;EAzMlC,AA0MM,OA1MC,AA0MD,qBAAsB,CAAI;IACxB,WAAW,EAAE,SAAgB;GAAG;EA3MxC,AAuMM,OAvMC,AAuMD,cAAe,CAAI;IACjB,IAAI,EAAE,IAAI;IACV,KAAK,EAAE,IAAgB;GAAG;EAzMlC,AA0MM,OA1MC,AA0MD,qBAAsB,CAAI;IACxB,WAAW,EAAE,IAAgB;GAAG;;;AlCYtC,MAAM,CAAC,MAAM,MAAM,SAAS,EAAE,MAAM;EkCvNtC,AA6MI,OA7MG,AA6MH,qBAAsB,CAAC;IACrB,IAAI,EAAE,IAAI;GAAI;EA9MpB,AA+MI,OA/MG,AA+MH,mBAAoB,CAAC;IACnB,IAAI,EAAE,IAAI;IACV,KAAK,EAAE,IAAI;GAAI;EAjNrB,AAkNI,OAlNG,AAkNH,6BAA8B,CAAC;IAC7B,IAAI,EAAE,IAAI;IACV,KAAK,EAAE,GAAG;GAAI;EApNpB,AAqNI,OArNG,AAqNH,yBAA0B,CAAC;IACzB,IAAI,EAAE,IAAI;IACV,KAAK,EAAE,QAAQ;GAAI;EAvNzB,AAwNI,OAxNG,AAwNH,mBAAoB,CAAC;IACnB,IAAI,EAAE,IAAI;IACV,KAAK,EAAE,GAAG;GAAI;EA1NpB,AA2NI,OA3NG,AA2NH,wBAAyB,CAAC;IACxB,IAAI,EAAE,IAAI;IACV,KAAK,EAAE,QAAQ;GAAI;EA7NzB,AA8NI,OA9NG,AA8NH,0BAA2B,CAAC;IAC1B,IAAI,EAAE,IAAI;IACV,KAAK,EAAE,GAAG;GAAI;EAhOpB,AAiOI,OAjOG,AAiOH,oCAAqC,CAAC;IACpC,WAAW,EAAE,GAAG;GAAI;EAlO1B,AAmOI,OAnOG,AAmOH,gCAAiC,CAAC;IAChC,WAAW,EAAE,QAAQ;GAAI;EApO/B,AAqOI,OArOG,AAqOH,0BAA2B,CAAC;IAC1B,WAAW,EAAE,GAAG;GAAI;EAtO1B,AAuOI,OAvOG,AAuOH,+BAAgC,CAAC;IAC/B,WAAW,EAAE,QAAQ;GAAI;EAxO/B,AAyOI,OAzOG,AAyOH,iCAAkC,CAAC;IACjC,WAAW,EAAE,GAAG;GAAI;EA1O1B,AA4OM,OA5OC,AA4OD,gBAAiB,CAAK;IACpB,IAAI,EAAE,IAAI;IACV,KAAK,EAAE,QAAgB;GAAG;EA9OlC,AA+OM,OA/OC,AA+OD,uBAAwB,CAAK;IAC3B,WAAW,EAAE,QAAgB;GAAG;EAhPxC,AA4OM,OA5OC,AA4OD,gBAAiB,CAAK;IACpB,IAAI,EAAE,IAAI;IACV,KAAK,EAAE,SAAgB;GAAG;EA9OlC,AA+OM,OA/OC,AA+OD,uBAAwB,CAAK;IAC3B,WAAW,EAAE,SAAgB;GAAG;EAhPxC,AA4OM,OA5OC,AA4OD,gBAAiB,CAAK;IACpB,IAAI,EAAE,IAAI;IACV,KAAK,EAAE,GAAgB;GAAG;EA9OlC,AA+OM,OA/OC,AA+OD,uBAAwB,CAAK;IAC3B,WAAW,EAAE,GAAgB;GAAG;EAhPxC,AA4OM,OA5OC,AA4OD,gBAAiB,CAAK;IACpB,IAAI,EAAE,IAAI;IACV,KAAK,EAAE,SAAgB;GAAG;EA9OlC,AA+OM,OA/OC,AA+OD,uBAAwB,CAAK;IAC3B,WAAW,EAAE,SAAgB;GAAG;EAhPxC,AA4OM,OA5OC,AA4OD,gBAAiB,CAAK;IACpB,IAAI,EAAE,IAAI;IACV,KAAK,EAAE,SAAgB;GAAG;EA9OlC,AA+OM,OA/OC,AA+OD,uBAAwB,CAAK;IAC3B,WAAW,EAAE,SAAgB;GAAG;EAhPxC,AA4OM,OA5OC,AA4OD,gBAAiB,CAAK;IACpB,IAAI,EAAE,IAAI;IACV,KAAK,EAAE,GAAgB;GAAG;EA9OlC,AA+OM,OA/OC,AA+OD,uBAAwB,CAAK;IAC3B,WAAW,EAAE,GAAgB;GAAG;EAhPxC,AA4OM,OA5OC,AA4OD,gBAAiB,CAAK;IACpB,IAAI,EAAE,IAAI;IACV,KAAK,EAAE,SAAgB;GAAG;EA9OlC,AA+OM,OA/OC,AA+OD,uBAAwB,CAAK;IAC3B,WAAW,EAAE,SAAgB;GAAG;EAhPxC,AA4OM,OA5OC,AA4OD,gBAAiB,CAAK;IACpB,IAAI,EAAE,IAAI;IACV,KAAK,EAAE,SAAgB;GAAG;EA9OlC,AA+OM,OA/OC,AA+OD,uBAAwB,CAAK;IAC3B,WAAW,EAAE,SAAgB;GAAG;EAhPxC,AA4OM,OA5OC,AA4OD,gBAAiB,CAAK;IACpB,IAAI,EAAE,IAAI;IACV,KAAK,EAAE,GAAgB;GAAG;EA9OlC,AA+OM,OA/OC,AA+OD,uBAAwB,CAAK;IAC3B,WAAW,EAAE,GAAgB;GAAG;EAhPxC,AA4OM,OA5OC,AA4OD,iBAAkB,CAAI;IACpB,IAAI,EAAE,IAAI;IACV,KAAK,EAAE,SAAgB;GAAG;EA9OlC,AA+OM,OA/OC,AA+OD,wBAAyB,CAAI;IAC3B,WAAW,EAAE,SAAgB;GAAG;EAhPxC,AA4OM,OA5OC,AA4OD,iBAAkB,CAAI;IACpB,IAAI,EAAE,IAAI;IACV,KAAK,EAAE,SAAgB;GAAG;EA9OlC,AA+OM,OA/OC,AA+OD,wBAAyB,CAAI;IAC3B,WAAW,EAAE,SAAgB;GAAG;EAhPxC,AA4OM,OA5OC,AA4OD,iBAAkB,CAAI;IACpB,IAAI,EAAE,IAAI;IACV,KAAK,EAAE,IAAgB;GAAG;EA9OlC,AA+OM,OA/OC,AA+OD,wBAAyB,CAAI;IAC3B,WAAW,EAAE,IAAgB;GAAG;;;AlCjBtC,MAAM,CAAC,MAAM,MAAM,SAAS,EAAE,MAAM;EkC/NtC,AAkPI,OAlPG,AAkPH,iBAAkB,CAAC;IACjB,IAAI,EAAE,IAAI;GAAI;EAnPpB,AAoPI,OApPG,AAoPH,eAAgB,CAAC;IACf,IAAI,EAAE,IAAI;IACV,KAAK,EAAE,IAAI;GAAI;EAtPrB,AAuPI,OAvPG,AAuPH,yBAA0B,CAAC;IACzB,IAAI,EAAE,IAAI;IACV,KAAK,EAAE,GAAG;GAAI;EAzPpB,AA0PI,OA1PG,AA0PH,qBAAsB,CAAC;IACrB,IAAI,EAAE,IAAI;IACV,KAAK,EAAE,QAAQ;GAAI;EA5PzB,AA6PI,OA7PG,AA6PH,eAAgB,CAAC;IACf,IAAI,EAAE,IAAI;IACV,KAAK,EAAE,GAAG;GAAI;EA/PpB,AAgQI,OAhQG,AAgQH,oBAAqB,CAAC;IACpB,IAAI,EAAE,IAAI;IACV,KAAK,EAAE,QAAQ;GAAI;EAlQzB,AAmQI,OAnQG,AAmQH,sBAAuB,CAAC;IACtB,IAAI,EAAE,IAAI;IACV,KAAK,EAAE,GAAG;GAAI;EArQpB,AAsQI,OAtQG,AAsQH,gCAAiC,CAAC;IAChC,WAAW,EAAE,GAAG;GAAI;EAvQ1B,AAwQI,OAxQG,AAwQH,4BAA6B,CAAC;IAC5B,WAAW,EAAE,QAAQ;GAAI;EAzQ/B,AA0QI,OA1QG,AA0QH,sBAAuB,CAAC;IACtB,WAAW,EAAE,GAAG;GAAI;EA3Q1B,AA4QI,OA5QG,AA4QH,2BAA4B,CAAC;IAC3B,WAAW,EAAE,QAAQ;GAAI;EA7Q/B,AA8QI,OA9QG,AA8QH,6BAA8B,CAAC;IAC7B,WAAW,EAAE,GAAG;GAAI;EA/Q1B,AAiRM,OAjRC,AAiRD,YAAa,CAAK;IAChB,IAAI,EAAE,IAAI;IACV,KAAK,EAAE,QAAgB;GAAG;EAnRlC,AAoRM,OApRC,AAoRD,mBAAoB,CAAK;IACvB,WAAW,EAAE,QAAgB;GAAG;EArRxC,AAiRM,OAjRC,AAiRD,YAAa,CAAK;IAChB,IAAI,EAAE,IAAI;IACV,KAAK,EAAE,SAAgB;GAAG;EAnRlC,AAoRM,OApRC,AAoRD,mBAAoB,CAAK;IACvB,WAAW,EAAE,SAAgB;GAAG;EArRxC,AAiRM,OAjRC,AAiRD,YAAa,CAAK;IAChB,IAAI,EAAE,IAAI;IACV,KAAK,EAAE,GAAgB;GAAG;EAnRlC,AAoRM,OApRC,AAoRD,mBAAoB,CAAK;IACvB,WAAW,EAAE,GAAgB;GAAG;EArRxC,AAiRM,OAjRC,AAiRD,YAAa,CAAK;IAChB,IAAI,EAAE,IAAI;IACV,KAAK,EAAE,SAAgB;GAAG;EAnRlC,AAoRM,OApRC,AAoRD,mBAAoB,CAAK;IACvB,WAAW,EAAE,SAAgB;GAAG;EArRxC,AAiRM,OAjRC,AAiRD,YAAa,CAAK;IAChB,IAAI,EAAE,IAAI;IACV,KAAK,EAAE,SAAgB;GAAG;EAnRlC,AAoRM,OApRC,AAoRD,mBAAoB,CAAK;IACvB,WAAW,EAAE,SAAgB;GAAG;EArRxC,AAiRM,OAjRC,AAiRD,YAAa,CAAK;IAChB,IAAI,EAAE,IAAI;IACV,KAAK,EAAE,GAAgB;GAAG;EAnRlC,AAoRM,OApRC,AAoRD,mBAAoB,CAAK;IACvB,WAAW,EAAE,GAAgB;GAAG;EArRxC,AAiRM,OAjRC,AAiRD,YAAa,CAAK;IAChB,IAAI,EAAE,IAAI;IACV,KAAK,EAAE,SAAgB;GAAG;EAnRlC,AAoRM,OApRC,AAoRD,mBAAoB,CAAK;IACvB,WAAW,EAAE,SAAgB;GAAG;EArRxC,AAiRM,OAjRC,AAiRD,YAAa,CAAK;IAChB,IAAI,EAAE,IAAI;IACV,KAAK,EAAE,SAAgB;GAAG;EAnRlC,AAoRM,OApRC,AAoRD,mBAAoB,CAAK;IACvB,WAAW,EAAE,SAAgB;GAAG;EArRxC,AAiRM,OAjRC,AAiRD,YAAa,CAAK;IAChB,IAAI,EAAE,IAAI;IACV,KAAK,EAAE,GAAgB;GAAG;EAnRlC,AAoRM,OApRC,AAoRD,mBAAoB,CAAK;IACvB,WAAW,EAAE,GAAgB;GAAG;EArRxC,AAiRM,OAjRC,AAiRD,aAAc,CAAI;IAChB,IAAI,EAAE,IAAI;IACV,KAAK,EAAE,SAAgB;GAAG;EAnRlC,AAoRM,OApRC,AAoRD,oBAAqB,CAAI;IACvB,WAAW,EAAE,SAAgB;GAAG;EArRxC,AAiRM,OAjRC,AAiRD,aAAc,CAAI;IAChB,IAAI,EAAE,IAAI;IACV,KAAK,EAAE,SAAgB;GAAG;EAnRlC,AAoRM,OApRC,AAoRD,oBAAqB,CAAI;IACvB,WAAW,EAAE,SAAgB;GAAG;EArRxC,AAiRM,OAjRC,AAiRD,aAAc,CAAI;IAChB,IAAI,EAAE,IAAI;IACV,KAAK,EAAE,IAAgB;GAAG;EAnRlC,AAoRM,OApRC,AAoRD,oBAAqB,CAAI;IACvB,WAAW,EAAE,IAAgB;GAAG;;;AAExC,AAAA,QAAQ,CAAC;EACP,WAAW,EAAE,QAAQ;EACrB,YAAY,EAAE,QAAQ;EACtB,UAAU,EAAE,QAAQ;CA0CK;;AA7C3B,AAIE,QAJM,AAIN,WAAY,CAAC;EACX,aAAa,EAAE,QAAQ;CAAI;;AAL/B,AAME,QANM,AAMN,IAAM,CAAA,AAAA,WAAW,EAAE;EACjB,aAAa,EAAE,OAAO;CAAI;;AAP9B,AASE,QATM,AASN,YAAa,CAAC;EACZ,eAAe,EAAE,MAAM;CAAI;;AAV/B,AAWE,QAXM,AAWN,WAAY,CAAC;EACX,WAAW,EAAE,CAAC;EACd,YAAY,EAAE,CAAC;EACf,UAAU,EAAE,CAAC;CAOK;;AArBtB,AAeI,QAfI,AAWN,WAAY,AAIV,WAAY,CAAC;EACX,aAAa,EAAE,CAAC;CAAI;;AAhB1B,AAiBI,QAjBI,AAWN,WAAY,AAMV,IAAM,CAAA,AAAA,WAAW,EAAE;EACjB,aAAa,EAAE,MAAM;CAAI;;AAlB/B,AAmBQ,QAnBA,AAWN,WAAY,GAQN,OAAO,CAAC;EACV,MAAM,EAAE,CAAC;EACT,OAAO,EAAE,CAAC;CAAI;;AlCzGlB,MAAM,CAAC,MAAM,MAAM,SAAS,EAAE,KAAK,GAAG,KAAK;EkCoF7C,AAsBE,QAtBM,AAsBN,QAAS,CAAC;IAGN,SAAS,EAAE,IAAI;GAMa;EA/BlC,AA0BU,QA1BF,AAsBN,QAAS,GAID,OAAO,CAAC;IACV,SAAS,EAAE,QAAQ;IACnB,OAAO,EAAE,OAAO;IAChB,KAAK,EAAE,QAAQ;GAEO;EA/B9B,AA8BY,QA9BJ,AAsBN,QAAS,GAID,OAAO,GAIL,OAAO,CAAC;IACV,WAAW,EAAE,CAAC;GAAI;;;AA/B5B,AAgCE,QAhCM,AAgCN,UAAW,CAAC;EACV,OAAO,EAAE,IAAI;CAAI;;AAjCrB,AAkCE,QAlCM,AAkCN,aAAc,CAAC;EACb,SAAS,EAAE,IAAI;CAAI;;AAnCvB,AAoCE,QApCM,AAoCN,aAAc,CAAC;EACb,WAAW,EAAE,MAAM;CAAI;;AlCzHzB,MAAM,CAAC,MAAM,MAAM,SAAS,EAAE,KAAK,GAAG,KAAK;EkCoF7C,AAwCI,QAxCI,AAwCJ,IAAM,CAAA,AAAA,WAAW,EAAE;IACjB,OAAO,EAAE,IAAI;GAAI;;;AlCjHrB,MAAM,CAAC,MAAM,MAAM,SAAS,EAAE,MAAM;EkCwEtC,AA4CI,QA5CI,AA4CJ,WAAY,CAAC;IACX,OAAO,EAAE,IAAI;GAAI;;;ACpUvB,AAAA,KAAK,CAAC;EACJ,WAAW,EAAE,OAAO;EACpB,OAAO,EAAE,KAAK;EACd,UAAU,EAAE,CAAC;EACb,SAAS,EAAE,CAAC;EACZ,WAAW,EAAE,CAAC;EACd,UAAU,EAAE,WAAW;CAyBe;;AA/BxC,AAQE,KARG,AAQH,YAAa,CAAC;EACZ,WAAW,EAAE,QAAQ;EACrB,YAAY,EAAE,QAAQ;EACtB,UAAU,EAAE,QAAQ;CAIU;;AAflC,AAYI,KAZC,AAQH,YAAa,AAIX,WAAY,CAAC;EACX,aAAa,EAAE,QAAQ;CAAI;;AAbjC,AAcI,KAdC,AAQH,YAAa,AAMX,IAAM,CAAA,AAAA,WAAW,EAAE;EACjB,aAAa,EAAE,OAAO;CAAI;;AAfhC,AAgBE,KAhBG,AAgBH,SAAU,CAAC;EACT,MAAM,EAAE,YAAY;CAAI;;AAjB5B,AAkBE,KAlBG,AAkBH,UAAW,CAAC;EACV,OAAO,EAAE,OAAO;CAAI;;AAnBxB,AAoBE,KApBG,AAoBH,YAAa,CAAC;EACZ,cAAc,EAAE,MAAM;CAEkB;;AAvB5C,AAsBQ,KAtBH,AAoBH,YAAa,GAEP,KAAK,AAAA,SAAS,AAAA,IAAK,CAAA,AAAA,WAAW,EAAE;EAClC,aAAa,EAAE,iBAAiB;CAAI;;AnC4KxC,MAAM,CAAC,MAAM,MAAM,SAAS,EAAE,KAAK,GAAG,KAAK;EmCnM7C,AA0BI,KA1BC,AA0BD,IAAM,CAAA,AAAA,SAAS,EAAE;IACf,OAAO,EAAE,IAAI;GAAI;EA3BvB,AA6BM,KA7BD,AA6BC,KAAM,CAAK;IACT,IAAI,EAAE,IAAI;IACV,KAAK,EAAE,QAAgB;GAAG;EA/BlC,AA6BM,KA7BD,AA6BC,KAAM,CAAK;IACT,IAAI,EAAE,IAAI;IACV,KAAK,EAAE,SAAgB;GAAG;EA/BlC,AA6BM,KA7BD,AA6BC,KAAM,CAAK;IACT,IAAI,EAAE,IAAI;IACV,KAAK,EAAE,GAAgB;GAAG;EA/BlC,AA6BM,KA7BD,AA6BC,KAAM,CAAK;IACT,IAAI,EAAE,IAAI;IACV,KAAK,EAAE,SAAgB;GAAG;EA/BlC,AA6BM,KA7BD,AA6BC,KAAM,CAAK;IACT,IAAI,EAAE,IAAI;IACV,KAAK,EAAE,SAAgB;GAAG;EA/BlC,AA6BM,KA7BD,AA6BC,KAAM,CAAK;IACT,IAAI,EAAE,IAAI;IACV,KAAK,EAAE,GAAgB;GAAG;EA/BlC,AA6BM,KA7BD,AA6BC,KAAM,CAAK;IACT,IAAI,EAAE,IAAI;IACV,KAAK,EAAE,SAAgB;GAAG;EA/BlC,AA6BM,KA7BD,AA6BC,KAAM,CAAK;IACT,IAAI,EAAE,IAAI;IACV,KAAK,EAAE,SAAgB;GAAG;EA/BlC,AA6BM,KA7BD,AA6BC,KAAM,CAAK;IACT,IAAI,EAAE,IAAI;IACV,KAAK,EAAE,GAAgB;GAAG;EA/BlC,AA6BM,KA7BD,AA6BC,MAAO,CAAI;IACT,IAAI,EAAE,IAAI;IACV,KAAK,EAAE,SAAgB;GAAG;EA/BlC,AA6BM,KA7BD,AA6BC,MAAO,CAAI;IACT,IAAI,EAAE,IAAI;IACV,KAAK,EAAE,SAAgB;GAAG;EA/BlC,AA6BM,KA7BD,AA6BC,MAAO,CAAI;IACT,IAAI,EAAE,IAAI;IACV,KAAK,EAAE,IAAgB;GAAG;;;AE7BlC,AAAA,KAAK,CAAC;EACJ,WAAW,EAAE,OAAO;EACpB,OAAO,EAAE,IAAI;EACb,cAAc,EAAE,MAAM;EACtB,eAAe,EAAE,aAAa;CAmGL;;AAvG3B,AAKE,KALG,CAKH,IAAI,CAAC;EACH,UAAU,EAAE,IAAI;EAChB,UAAU,EAAE,CAAC,CAAC,GAAG,CAAC,CAAC,CzCCR,wBAAe;CyCDe;;AAP7C,AASI,KATC,CAQH,KAAK,CACH,EAAE,CAAC;EACD,aAAa,EAAE,IAAI;CAAI;;AAV7B,AAeI,KAfC,AAeD,SAAU,CAAI;EACZ,gBAAgB,EzCJP,KAAgB;EyCKzB,KAAK,EzCjBI,OAAc;CyCgFkC;;AAhF/D,AAkBM,KAlBD,AAeD,SAAU,CAGR,CAAC,AAAA,IAAK,CAAA,AAAA,OAAO;AAlBnB,AAmBM,KAnBD,AAeD,SAAU,CAIR,MAAM,CAAC;EACL,KAAK,EAAE,OAAO;CAAI;;AApB1B,AAqBM,KArBD,AAeD,SAAU,CAMR,MAAM,CAAC;EACL,KAAK,EzCtBE,OAAc;CyCsBE;;AAtB/B,AAuBM,KAvBD,AAeD,SAAU,CAQR,SAAS,CAAC;EACR,KAAK,EzCxBE,qBAAc;CyC2BM;;AA3BnC,AAyBQ,KAzBH,AAeD,SAAU,CAQR,SAAS,CAEP,CAAC,AAAA,IAAK,CAAA,AAAA,OAAO;AAzBrB,AA0BQ,KA1BH,AAeD,SAAU,CAQR,SAAS,CAGP,MAAM,CAAC;EACL,KAAK,EzC3BA,OAAc;CyC2BI;;AA3BjC,AA4BM,KA5BD,AAeD,SAAU,CAaR,IAAI,CAAC;EACH,UAAU,EAAE,CAAC,CAAC,GAAG,CAAC,CAAC,CzC7BZ,qBAAc;CyC6B0B;;ArCgKrD,MAAM,CAAC,MAAM,MAAM,SAAS,EAAE,KAAK;EqC7LrC,AA8BM,KA9BD,AAeD,SAAU,CAeR,SAAS,CAAC;IAEN,gBAAgB,EzCpBX,KAAgB;GyCoBQ;;;AAhCvC,AAiCM,KAjCD,AAeD,SAAU,CAkBR,CAAC,AAAA,SAAS;AAjChB,AAkCgB,KAlCX,AAeD,SAAU,CAmBR,SAAS,CAAC,CAAC,AAAA,IAAK,CAAA,AAAA,OAAO,EAAE;EACvB,KAAK,EzCnCE,qBAAc;CyCsCM;;AAtCnC,AAiCM,KAjCD,AAeD,SAAU,CAkBR,CAAC,AAAA,SAAS,AAGzB,MAAwB,EApCf,AAiCM,KAjCD,AAeD,SAAU,CAkBR,CAAC,AAAA,SAAS,AAIzB,UAA4B;AArCnB,AAkCgB,KAlCX,AAeD,SAAU,CAmBR,SAAS,CAAC,CAAC,AAAA,IAAK,CAAA,AAAA,OAAO,CAEtC,MAAwB;AApCf,AAkCgB,KAlCX,AAeD,SAAU,CAmBR,SAAS,CAAC,CAAC,AAAA,IAAK,CAAA,AAAA,OAAO,CAGtC,UAA4B,CAAC;EACV,KAAK,EzCtCA,OAAc;CyCsCI;;AAtCjC,AAwCQ,KAxCH,AAeD,SAAU,CAwBR,KAAK,CACH,CAAC,CAAC;EACA,KAAK,EzCzCA,OAAc;EyC0CnB,OAAO,EAAE,GAAG;CAEM;;AA5C5B,AAwCQ,KAxCH,AAeD,SAAU,CAwBR,KAAK,CACH,CAAC,AAGP,MAAe,CAAC;EACN,OAAO,EAAE,CAAC;CAAI;;AA5C1B,AA8CsB,KA9CjB,AAeD,SAAU,CAwBR,KAAK,CAMH,EAAE,AACR,UAAmB,CAAC,CAAC,CAAC;EACZ,OAAO,EAAE,CAAC;CAAI;;AA/C1B,AAkDU,KAlDL,AAeD,SAAU,CAwBR,KAAK,AASH,SAAU,CAER,CAAC,EAlDX,AAkDU,KAlDL,AAeD,SAAU,CAwBR,KAAK,AAUH,UAAW,CACT,CAAC,CAAC;EACA,KAAK,EzCnDF,OAAc;CyCqDyB;;AArDtD,AAkDU,KAlDL,AAeD,SAAU,CAwBR,KAAK,AASH,SAAU,CAER,CAAC,AAEhB,MAAwB,EApDnB,AAkDU,KAlDL,AAeD,SAAU,CAwBR,KAAK,AAUH,UAAW,CACT,CAAC,AAEhB,MAAwB,CAAC;EACN,gBAAgB,EzCrDf,qBAAc;CyCqDuB;;AArDpD,AAsDuB,KAtDlB,AAeD,SAAU,CAwBR,KAAK,AASH,SAAU,CAMR,EAAE,AAAA,UAAU,CAAC,CAAC,EAtDxB,AAsDuB,KAtDlB,AAeD,SAAU,CAwBR,KAAK,AASH,SAAU,CAMR,EAAE,AAAA,UAAU,CAAC,CAAC,AAE7B,MAAwB,EAxDnB,AAsDuB,KAtDlB,AAeD,SAAU,CAwBR,KAAK,AAUH,UAAW,CAKT,EAAE,AAAA,UAAU,CAAC,CAAC,EAtDxB,AAsDuB,KAtDlB,AAeD,SAAU,CAwBR,KAAK,AAUH,UAAW,CAKT,EAAE,AAAA,UAAU,CAAC,CAAC,AAE7B,MAAwB,CAAC;EACN,gBAAgB,EzCzDf,OAAc;EyC0Df,YAAY,EzC1DX,OAAc;EyC2Df,KAAK,EzC/CJ,KAAgB;CyC+CD;;AA3D9B,AA6DM,KA7DD,AAeD,SAAU,AA8ChB,QAAiB,CAAC;EAGR,gBAAgB,EAAE,0DAAuF;CAGW;;ArC0H1H,MAAM,CAAC,MAAM,MAAM,SAAS,EAAE,KAAK;EqC7LrC,AAkEU,KAlEL,AAeD,SAAU,AA8CR,QAAS,CAKL,SAAS,CAAC;IACR,gBAAgB,EAAE,0DAAuF;GAAG;;;ArC0HtH,MAAM,CAAC,MAAM,MAAM,SAAS,EAAE,KAAK;EqC7LrC,AAuEU,KAvEL,AAeD,SAAU,CAuDN,WAAW,CACT,IAAI,CAAC;IACH,gBAAgB,EzCxEb,OAAc;GyCwEiB;EAxE9C,AAsEQ,KAtEH,AAeD,SAAU,CAuDN,WAAW,AAGjB,MAAe,CAAC;IACN,gBAAgB,EzC1Eb,qBAAc;GyC0EqB;EA1ElD,AA4EY,KA5EP,AAeD,SAAU,CAuDN,WAAW,AAKT,UAAW,CACT,IAAI,CAAC;IACH,gBAAgB,EzC7Ef,OAAc;GyC6EmB;EA7EhD,AA+EU,KA/EL,AAeD,SAAU,CA+DN,SAAS,CACP,SAAS,CAAC;IACR,gBAAgB,EzChFb,qBAAc;GyCgF4B;;;AAhFzD,AAeI,KAfC,AAeD,SAAU,CAAI;EACZ,gBAAgB,EzChBP,OAAc;EyCiBvB,KAAK,EzCLI,KAAgB;CyCoEgC;;AAhF/D,AAkBM,KAlBD,AAeD,SAAU,CAGR,CAAC,AAAA,IAAK,CAAA,AAAA,OAAO;AAlBnB,AAmBM,KAnBD,AAeD,SAAU,CAIR,MAAM,CAAC;EACL,KAAK,EAAE,OAAO;CAAI;;AApB1B,AAqBM,KArBD,AAeD,SAAU,CAMR,MAAM,CAAC;EACL,KAAK,EzCVE,KAAgB;CyCUA;;AAtB/B,AAuBM,KAvBD,AAeD,SAAU,CAQR,SAAS,CAAC;EACR,KAAK,EzCZE,wBAAgB;CyCeI;;AA3BnC,AAyBQ,KAzBH,AAeD,SAAU,CAQR,SAAS,CAEP,CAAC,AAAA,IAAK,CAAA,AAAA,OAAO;AAzBrB,AA0BQ,KA1BH,AAeD,SAAU,CAQR,SAAS,CAGP,MAAM,CAAC;EACL,KAAK,EzCfA,KAAgB;CyCeE;;AA3BjC,AA4BM,KA5BD,AAeD,SAAU,CAaR,IAAI,CAAC;EACH,UAAU,EAAE,CAAC,CAAC,GAAG,CAAC,CAAC,CzCjBZ,wBAAgB;CyCiBwB;;ArCgKrD,MAAM,CAAC,MAAM,MAAM,SAAS,EAAE,KAAK;EqC7LrC,AA8BM,KA9BD,AAeD,SAAU,CAeR,SAAS,CAAC;IAEN,gBAAgB,EzChCX,OAAc;GyCgCU;;;AAhCvC,AAiCM,KAjCD,AAeD,SAAU,CAkBR,CAAC,AAAA,SAAS;AAjChB,AAkCgB,KAlCX,AAeD,SAAU,CAmBR,SAAS,CAAC,CAAC,AAAA,IAAK,CAAA,AAAA,OAAO,EAAE;EACvB,KAAK,EzCvBE,wBAAgB;CyC0BI;;AAtCnC,AAiCM,KAjCD,AAeD,SAAU,CAkBR,CAAC,AAAA,SAAS,AAGzB,MAAwB,EApCf,AAiCM,KAjCD,AAeD,SAAU,CAkBR,CAAC,AAAA,SAAS,AAIzB,UAA4B;AArCnB,AAkCgB,KAlCX,AAeD,SAAU,CAmBR,SAAS,CAAC,CAAC,AAAA,IAAK,CAAA,AAAA,OAAO,CAEtC,MAAwB;AApCf,AAkCgB,KAlCX,AAeD,SAAU,CAmBR,SAAS,CAAC,CAAC,AAAA,IAAK,CAAA,AAAA,OAAO,CAGtC,UAA4B,CAAC;EACV,KAAK,EzC1BA,KAAgB;CyC0BE;;AAtCjC,AAwCQ,KAxCH,AAeD,SAAU,CAwBR,KAAK,CACH,CAAC,CAAC;EACA,KAAK,EzC7BA,KAAgB;EyC8BrB,OAAO,EAAE,GAAG;CAEM;;AA5C5B,AAwCQ,KAxCH,AAeD,SAAU,CAwBR,KAAK,CACH,CAAC,AAGP,MAAe,CAAC;EACN,OAAO,EAAE,CAAC;CAAI;;AA5C1B,AA8CsB,KA9CjB,AAeD,SAAU,CAwBR,KAAK,CAMH,EAAE,AACR,UAAmB,CAAC,CAAC,CAAC;EACZ,OAAO,EAAE,CAAC;CAAI;;AA/C1B,AAkDU,KAlDL,AAeD,SAAU,CAwBR,KAAK,AASJ,SAAW,CAER,CAAC,EAlDX,AAkDU,KAlDL,AAeD,SAAU,CAwBR,KAAK,AAUJ,UAAY,CACT,CAAC,CAAC;EACA,KAAK,EzCvCF,KAAgB;CyCyCuB;;AArDtD,AAkDU,KAlDL,AAeD,SAAU,CAwBR,KAAK,AASJ,SAAW,CAER,CAAC,AAEhB,MAAwB,EApDnB,AAkDU,KAlDL,AAeD,SAAU,CAwBR,KAAK,AAUJ,UAAY,CACT,CAAC,AAEhB,MAAwB,CAAC;EACN,gBAAgB,EzCrDf,qBAAc;CyCqDuB;;AArDpD,AAsDuB,KAtDlB,AAeD,SAAU,CAwBR,KAAK,AASJ,SAAW,CAMR,EAAE,AAAA,UAAU,CAAC,CAAC,EAtDxB,AAsDuB,KAtDlB,AAeD,SAAU,CAwBR,KAAK,AASJ,SAAW,CAMR,EAAE,AAAA,UAAU,CAAC,CAAC,AAE7B,MAAwB,EAxDnB,AAsDuB,KAtDlB,AAeD,SAAU,CAwBR,KAAK,AAUJ,UAAY,CAKT,EAAE,AAAA,UAAU,CAAC,CAAC,EAtDxB,AAsDuB,KAtDlB,AAeD,SAAU,CAwBR,KAAK,AAUJ,UAAY,CAKT,EAAE,AAAA,UAAU,CAAC,CAAC,AAE7B,MAAwB,CAAC;EACN,gBAAgB,EzC7Cf,KAAgB;EyC8CjB,YAAY,EzC9CX,KAAgB;EyC+CjB,KAAK,EzC3DJ,OAAc;CyC2DC;;AA3D9B,AA6DM,KA7DD,AAeD,SAAU,AA8ChB,QAAiB,CAAC;EAGR,gBAAgB,EAAE,4DAAuF;CAGW;;ArC0H1H,MAAM,CAAC,MAAM,MAAM,SAAS,EAAE,KAAK;EqC7LrC,AAkEU,KAlEL,AAeD,SAAU,AA8CT,QAAU,CAKL,SAAS,CAAC;IACR,gBAAgB,EAAE,4DAAuF;GAAG;;;ArC0HtH,MAAM,CAAC,MAAM,MAAM,SAAS,EAAE,KAAK;EqC7LrC,AAuEU,KAvEL,AAeD,SAAU,CAuDN,WAAW,CACT,IAAI,CAAC;IACH,gBAAgB,EzC5Db,KAAgB;GyC4De;EAxE9C,AAsEQ,KAtEH,AAeD,SAAU,CAuDN,WAAW,AAGjB,MAAe,CAAC;IACN,gBAAgB,EzC1Eb,qBAAc;GyC0EqB;EA1ElD,AA4EY,KA5EP,AAeD,SAAU,CAuDN,WAAW,AAKV,UAAY,CACT,IAAI,CAAC;IACH,gBAAgB,EzCjEf,KAAgB;GyCiEiB;EA7EhD,AA+EU,KA/EL,AAeD,SAAU,CA+DN,SAAS,CACP,SAAS,CAAC;IACR,gBAAgB,EzCpEb,wBAAgB;GyCoE0B;;;AAhFzD,AAeI,KAfC,AAeD,SAAU,CAAI;EACZ,gBAAgB,EzCNP,UAAe;EyCOxB,KAAK,EzCbI,OAAe;CyC4EiC;;AAhF/D,AAkBM,KAlBD,AAeD,SAAU,CAGR,CAAC,AAAA,IAAK,CAAA,AAAA,OAAO;AAlBnB,AAmBM,KAnBD,AAeD,SAAU,CAIR,MAAM,CAAC;EACL,KAAK,EAAE,OAAO;CAAI;;AApB1B,AAqBM,KArBD,AAeD,SAAU,CAMR,MAAM,CAAC;EACL,KAAK,EzClBE,OAAe;CyCkBC;;AAtB/B,AAuBM,KAvBD,AAeD,SAAU,CAQR,SAAS,CAAC;EACR,KAAK,EzCpBE,qBAAe;CyCuBK;;AA3BnC,AAyBQ,KAzBH,AAeD,SAAU,CAQR,SAAS,CAEP,CAAC,AAAA,IAAK,CAAA,AAAA,OAAO;AAzBrB,AA0BQ,KA1BH,AAeD,SAAU,CAQR,SAAS,CAGP,MAAM,CAAC;EACL,KAAK,EzCvBA,OAAe;CyCuBG;;AA3BjC,AA4BM,KA5BD,AAeD,SAAU,CAaR,IAAI,CAAC;EACH,UAAU,EAAE,CAAC,CAAC,GAAG,CAAC,CAAC,CzCzBZ,qBAAe;CyCyByB;;ArCgKrD,MAAM,CAAC,MAAM,MAAM,SAAS,EAAE,KAAK;EqC7LrC,AA8BM,KA9BD,AAeD,SAAU,CAeR,SAAS,CAAC;IAEN,gBAAgB,EzCtBX,UAAe;GyCsBS;;;AAhCvC,AAiCM,KAjCD,AAeD,SAAU,CAkBR,CAAC,AAAA,SAAS;AAjChB,AAkCgB,KAlCX,AAeD,SAAU,CAmBR,SAAS,CAAC,CAAC,AAAA,IAAK,CAAA,AAAA,OAAO,EAAE;EACvB,KAAK,EzC/BE,qBAAe;CyCkCK;;AAtCnC,AAiCM,KAjCD,AAeD,SAAU,CAkBR,CAAC,AAAA,SAAS,AAGzB,MAAwB,EApCf,AAiCM,KAjCD,AAeD,SAAU,CAkBR,CAAC,AAAA,SAAS,AAIzB,UAA4B;AArCnB,AAkCgB,KAlCX,AAeD,SAAU,CAmBR,SAAS,CAAC,CAAC,AAAA,IAAK,CAAA,AAAA,OAAO,CAEtC,MAAwB;AApCf,AAkCgB,KAlCX,AAeD,SAAU,CAmBR,SAAS,CAAC,CAAC,AAAA,IAAK,CAAA,AAAA,OAAO,CAGtC,UAA4B,CAAC;EACV,KAAK,EzClCA,OAAe;CyCkCG;;AAtCjC,AAwCQ,KAxCH,AAeD,SAAU,CAwBR,KAAK,CACH,CAAC,CAAC;EACA,KAAK,EzCrCA,OAAe;EyCsCpB,OAAO,EAAE,GAAG;CAEM;;AA5C5B,AAwCQ,KAxCH,AAeD,SAAU,CAwBR,KAAK,CACH,CAAC,AAGP,MAAe,CAAC;EACN,OAAO,EAAE,CAAC;CAAI;;AA5C1B,AA8CsB,KA9CjB,AAeD,SAAU,CAwBR,KAAK,CAMH,EAAE,AACR,UAAmB,CAAC,CAAC,CAAC;EACZ,OAAO,EAAE,CAAC;CAAI;;AA/C1B,AAkDU,KAlDL,AAeD,SAAU,CAwBR,KAAK,AASL,SAAY,CAER,CAAC,EAlDX,AAkDU,KAlDL,AAeD,SAAU,CAwBR,KAAK,AAUL,UAAa,CACT,CAAC,CAAC;EACA,KAAK,EzC/CF,OAAe;CyCiDwB;;AArDtD,AAkDU,KAlDL,AAeD,SAAU,CAwBR,KAAK,AASL,SAAY,CAER,CAAC,AAEhB,MAAwB,EApDnB,AAkDU,KAlDL,AAeD,SAAU,CAwBR,KAAK,AAUL,UAAa,CACT,CAAC,AAEhB,MAAwB,CAAC;EACN,gBAAgB,EzCrDf,qBAAc;CyCqDuB;;AArDpD,AAsDuB,KAtDlB,AAeD,SAAU,CAwBR,KAAK,AASL,SAAY,CAMR,EAAE,AAAA,UAAU,CAAC,CAAC,EAtDxB,AAsDuB,KAtDlB,AAeD,SAAU,CAwBR,KAAK,AASL,SAAY,CAMR,EAAE,AAAA,UAAU,CAAC,CAAC,AAE7B,MAAwB,EAxDnB,AAsDuB,KAtDlB,AAeD,SAAU,CAwBR,KAAK,AAUL,UAAa,CAKT,EAAE,AAAA,UAAU,CAAC,CAAC,EAtDxB,AAsDuB,KAtDlB,AAeD,SAAU,CAwBR,KAAK,AAUL,UAAa,CAKT,EAAE,AAAA,UAAU,CAAC,CAAC,AAE7B,MAAwB,CAAC;EACN,gBAAgB,EzCrDf,OAAe;EyCsDhB,YAAY,EzCtDX,OAAe;EyCuDhB,KAAK,EzCjDJ,UAAe;CyCiDA;;AA3D9B,AA6DM,KA7DD,AAeD,SAAU,AA8ChB,QAAiB,CAAC;EAGR,gBAAgB,EAAE,+DAAuF;CAGW;;ArC0H1H,MAAM,CAAC,MAAM,MAAM,SAAS,EAAE,KAAK;EqC7LrC,AAkEU,KAlEL,AAeD,SAAU,AA8CV,QAAW,CAKL,SAAS,CAAC;IACR,gBAAgB,EAAE,+DAAuF;GAAG;;;ArC0HtH,MAAM,CAAC,MAAM,MAAM,SAAS,EAAE,KAAK;EqC7LrC,AAuEU,KAvEL,AAeD,SAAU,CAuDN,WAAW,CACT,IAAI,CAAC;IACH,gBAAgB,EzCpEb,OAAe;GyCoEgB;EAxE9C,AAsEQ,KAtEH,AAeD,SAAU,CAuDN,WAAW,AAGjB,MAAe,CAAC;IACN,gBAAgB,EzC1Eb,qBAAc;GyC0EqB;EA1ElD,AA4EY,KA5EP,AAeD,SAAU,CAuDN,WAAW,AAKX,UAAa,CACT,IAAI,CAAC;IACH,gBAAgB,EzCzEf,OAAe;GyCyEkB;EA7EhD,AA+EU,KA/EL,AAeD,SAAU,CA+DN,SAAS,CACP,SAAS,CAAC;IACR,gBAAgB,EzC5Eb,qBAAe;GyC4E2B;;;AAhFzD,AAeI,KAfC,AAeD,QAAS,CAAK;EACZ,gBAAgB,EzCZP,OAAe;EyCaxB,KAAK,EzCPI,UAAe;CyCsEiC;;AAhF/D,AAkBM,KAlBD,AAeD,QAAS,CAGP,CAAC,AAAA,IAAK,CAAA,AAAA,OAAO;AAlBnB,AAmBM,KAnBD,AAeD,QAAS,CAIP,MAAM,CAAC;EACL,KAAK,EAAE,OAAO;CAAI;;AApB1B,AAqBM,KArBD,AAeD,QAAS,CAMP,MAAM,CAAC;EACL,KAAK,EzCZE,UAAe;CyCYC;;AAtB/B,AAuBM,KAvBD,AAeD,QAAS,CAQP,SAAS,CAAC;EACR,KAAK,EzCdE,wBAAe;CyCiBK;;AA3BnC,AAyBQ,KAzBH,AAeD,QAAS,CAQP,SAAS,CAEP,CAAC,AAAA,IAAK,CAAA,AAAA,OAAO;AAzBrB,AA0BQ,KA1BH,AAeD,QAAS,CAQP,SAAS,CAGP,MAAM,CAAC;EACL,KAAK,EzCjBA,UAAe;CyCiBG;;AA3BjC,AA4BM,KA5BD,AAeD,QAAS,CAaP,IAAI,CAAC;EACH,UAAU,EAAE,CAAC,CAAC,GAAG,CAAC,CAAC,CzCnBZ,wBAAe;CyCmByB;;ArCgKrD,MAAM,CAAC,MAAM,MAAM,SAAS,EAAE,KAAK;EqC7LrC,AA8BM,KA9BD,AAeD,QAAS,CAeP,SAAS,CAAC;IAEN,gBAAgB,EzC5BX,OAAe;GyC4BS;;;AAhCvC,AAiCM,KAjCD,AAeD,QAAS,CAkBP,CAAC,AAAA,SAAS;AAjChB,AAkCgB,KAlCX,AAeD,QAAS,CAmBP,SAAS,CAAC,CAAC,AAAA,IAAK,CAAA,AAAA,OAAO,EAAE;EACvB,KAAK,EzCzBE,wBAAe;CyC4BK;;AAtCnC,AAiCM,KAjCD,AAeD,QAAS,CAkBP,CAAC,AAAA,SAAS,AAGzB,MAAwB,EApCf,AAiCM,KAjCD,AAeD,QAAS,CAkBP,CAAC,AAAA,SAAS,AAIzB,UAA4B;AArCnB,AAkCgB,KAlCX,AAeD,QAAS,CAmBP,SAAS,CAAC,CAAC,AAAA,IAAK,CAAA,AAAA,OAAO,CAEtC,MAAwB;AApCf,AAkCgB,KAlCX,AAeD,QAAS,CAmBP,SAAS,CAAC,CAAC,AAAA,IAAK,CAAA,AAAA,OAAO,CAGtC,UAA4B,CAAC;EACV,KAAK,EzC5BA,UAAe;CyC4BG;;AAtCjC,AAwCQ,KAxCH,AAeD,QAAS,CAwBP,KAAK,CACH,CAAC,CAAC;EACA,KAAK,EzC/BA,UAAe;EyCgCpB,OAAO,EAAE,GAAG;CAEM;;AA5C5B,AAwCQ,KAxCH,AAeD,QAAS,CAwBP,KAAK,CACH,CAAC,AAGP,MAAe,CAAC;EACN,OAAO,EAAE,CAAC;CAAI;;AA5C1B,AA8CsB,KA9CjB,AAeD,QAAS,CAwBP,KAAK,CAMH,EAAE,AACR,UAAmB,CAAC,CAAC,CAAC;EACZ,OAAO,EAAE,CAAC;CAAI;;AA/C1B,AAkDU,KAlDL,AAeD,QAAS,CAwBP,KAAK,AASN,SAAa,CAER,CAAC,EAlDX,AAkDU,KAlDL,AAeD,QAAS,CAwBP,KAAK,AAUN,UAAc,CACT,CAAC,CAAC;EACA,KAAK,EzCzCF,UAAe;CyC2CwB;;AArDtD,AAkDU,KAlDL,AAeD,QAAS,CAwBP,KAAK,AASN,SAAa,CAER,CAAC,AAEhB,MAAwB,EApDnB,AAkDU,KAlDL,AAeD,QAAS,CAwBP,KAAK,AAUN,UAAc,CACT,CAAC,AAEhB,MAAwB,CAAC;EACN,gBAAgB,EzCrDf,qBAAc;CyCqDuB;;AArDpD,AAsDuB,KAtDlB,AAeD,QAAS,CAwBP,KAAK,AASN,SAAa,CAMR,EAAE,AAAA,UAAU,CAAC,CAAC,EAtDxB,AAsDuB,KAtDlB,AAeD,QAAS,CAwBP,KAAK,AASN,SAAa,CAMR,EAAE,AAAA,UAAU,CAAC,CAAC,AAE7B,MAAwB,EAxDnB,AAsDuB,KAtDlB,AAeD,QAAS,CAwBP,KAAK,AAUN,UAAc,CAKT,EAAE,AAAA,UAAU,CAAC,CAAC,EAtDxB,AAsDuB,KAtDlB,AAeD,QAAS,CAwBP,KAAK,AAUN,UAAc,CAKT,EAAE,AAAA,UAAU,CAAC,CAAC,AAE7B,MAAwB,CAAC;EACN,gBAAgB,EzC/Cf,UAAe;EyCgDhB,YAAY,EzChDX,UAAe;EyCiDhB,KAAK,EzCvDJ,OAAe;CyCuDA;;AA3D9B,AA6DM,KA7DD,AAeD,QAAS,AA8Cf,QAAiB,CAAC;EAGR,gBAAgB,EAAE,8DAAuF;CAGW;;ArC0H1H,MAAM,CAAC,MAAM,MAAM,SAAS,EAAE,KAAK;EqC7LrC,AAkEU,KAlEL,AAeD,QAAS,AA8CV,QAAY,CAKL,SAAS,CAAC;IACR,gBAAgB,EAAE,8DAAuF;GAAG;;;ArC0HtH,MAAM,CAAC,MAAM,MAAM,SAAS,EAAE,KAAK;EqC7LrC,AAuEU,KAvEL,AAeD,QAAS,CAuDL,WAAW,CACT,IAAI,CAAC;IACH,gBAAgB,EzC9Db,UAAe;GyC8DgB;EAxE9C,AAsEQ,KAtEH,AAeD,QAAS,CAuDL,WAAW,AAGjB,MAAe,CAAC;IACN,gBAAgB,EzC1Eb,qBAAc;GyC0EqB;EA1ElD,AA4EY,KA5EP,AAeD,QAAS,CAuDL,WAAW,AAKZ,UAAc,CACT,IAAI,CAAC;IACH,gBAAgB,EzCnEf,UAAe;GyCmEkB;EA7EhD,AA+EU,KA/EL,AAeD,QAAS,CA+DL,SAAS,CACP,SAAS,CAAC;IACR,gBAAgB,EzCtEb,wBAAe;GyCsE2B;;;AAhFzD,AAeI,KAfC,AAeD,WAAY,CAAE;EACZ,gBAAgB,EzCCP,OAAmB;EyCA5B,KAAK,ExCQC,IAAI;CwCuD+C;;AAhF/D,AAkBM,KAlBD,AAeD,WAAY,CAGV,CAAC,AAAA,IAAK,CAAA,AAAA,OAAO;AAlBnB,AAmBM,KAnBD,AAeD,WAAY,CAIV,MAAM,CAAC;EACL,KAAK,EAAE,OAAO;CAAI;;AApB1B,AAqBM,KArBD,AAeD,WAAY,CAMV,MAAM,CAAC;EACL,KAAK,ExCGD,IAAI;CwCHe;;AAtB/B,AAuBM,KAvBD,AAeD,WAAY,CAQV,SAAS,CAAC;EACR,KAAK,ExCCD,wBAAI;CwCEmB;;AA3BnC,AAyBQ,KAzBH,AAeD,WAAY,CAQV,SAAS,CAEP,CAAC,AAAA,IAAK,CAAA,AAAA,OAAO;AAzBrB,AA0BQ,KA1BH,AAeD,WAAY,CAQV,SAAS,CAGP,MAAM,CAAC;EACL,KAAK,ExCFH,IAAI;CwCEiB;;AA3BjC,AA4BM,KA5BD,AAeD,WAAY,CAaV,IAAI,CAAC;EACH,UAAU,EAAE,CAAC,CAAC,GAAG,CAAC,CAAC,CxCJf,wBAAI;CwCIuC;;ArCgKrD,MAAM,CAAC,MAAM,MAAM,SAAS,EAAE,KAAK;EqC7LrC,AA8BM,KA9BD,AAeD,WAAY,CAeV,SAAS,CAAC;IAEN,gBAAgB,EzCfX,OAAmB;GyCeK;;;AAhCvC,AAiCM,KAjCD,AAeD,WAAY,CAkBV,CAAC,AAAA,SAAS;AAjChB,AAkCgB,KAlCX,AAeD,WAAY,CAmBV,SAAS,CAAC,CAAC,AAAA,IAAK,CAAA,AAAA,OAAO,EAAE;EACvB,KAAK,ExCVD,wBAAI;CwCamB;;AAtCnC,AAiCM,KAjCD,AAeD,WAAY,CAkBV,CAAC,AAAA,SAAS,AAGzB,MAAwB,EApCf,AAiCM,KAjCD,AAeD,WAAY,CAkBV,CAAC,AAAA,SAAS,AAIzB,UAA4B;AArCnB,AAkCgB,KAlCX,AAeD,WAAY,CAmBV,SAAS,CAAC,CAAC,AAAA,IAAK,CAAA,AAAA,OAAO,CAEtC,MAAwB;AApCf,AAkCgB,KAlCX,AAeD,WAAY,CAmBV,SAAS,CAAC,CAAC,AAAA,IAAK,CAAA,AAAA,OAAO,CAGtC,UAA4B,CAAC;EACV,KAAK,ExCbH,IAAI;CwCaiB;;AAtCjC,AAwCQ,KAxCH,AAeD,WAAY,CAwBV,KAAK,CACH,CAAC,CAAC;EACA,KAAK,ExChBH,IAAI;EwCiBN,OAAO,EAAE,GAAG;CAEM;;AA5C5B,AAwCQ,KAxCH,AAeD,WAAY,CAwBV,KAAK,CACH,CAAC,AAGP,MAAe,CAAC;EACN,OAAO,EAAE,CAAC;CAAI;;AA5C1B,AA8CsB,KA9CjB,AAeD,WAAY,CAwBV,KAAK,CAMH,EAAE,AACR,UAAmB,CAAC,CAAC,CAAC;EACZ,OAAO,EAAE,CAAC;CAAI;;AA/C1B,AAkDU,KAlDL,AAeD,WAAY,CAwBV,KAAK,AASP,SAAc,CAER,CAAC,EAlDX,AAkDU,KAlDL,AAeD,WAAY,CAwBV,KAAK,AAUP,UAAe,CACT,CAAC,CAAC;EACA,KAAK,ExC1BL,IAAI;CwC4BsC;;AArDtD,AAkDU,KAlDL,AAeD,WAAY,CAwBV,KAAK,AASP,SAAc,CAER,CAAC,AAEhB,MAAwB,EApDnB,AAkDU,KAlDL,AAeD,WAAY,CAwBV,KAAK,AAUP,UAAe,CACT,CAAC,AAEhB,MAAwB,CAAC;EACN,gBAAgB,EzCrDf,qBAAc;CyCqDuB;;AArDpD,AAsDuB,KAtDlB,AAeD,WAAY,CAwBV,KAAK,AASP,SAAc,CAMR,EAAE,AAAA,UAAU,CAAC,CAAC,EAtDxB,AAsDuB,KAtDlB,AAeD,WAAY,CAwBV,KAAK,AASP,SAAc,CAMR,EAAE,AAAA,UAAU,CAAC,CAAC,AAE7B,MAAwB,EAxDnB,AAsDuB,KAtDlB,AAeD,WAAY,CAwBV,KAAK,AAUP,UAAe,CAKT,EAAE,AAAA,UAAU,CAAC,CAAC,EAtDxB,AAsDuB,KAtDlB,AAeD,WAAY,CAwBV,KAAK,AAUP,UAAe,CAKT,EAAE,AAAA,UAAU,CAAC,CAAC,AAE7B,MAAwB,CAAC;EACN,gBAAgB,ExChClB,IAAI;EwCiCF,YAAY,ExCjCd,IAAI;EwCkCF,KAAK,EzC1CJ,OAAmB;CyC0CJ;;AA3D9B,AA6DM,KA7DD,AAeD,WAAY,AA8ClB,QAAiB,CAAC;EAGR,gBAAgB,EAAE,8DAAuF;CAGW;;ArC0H1H,MAAM,CAAC,MAAM,MAAM,SAAS,EAAE,KAAK;EqC7LrC,AAkEU,KAlEL,AAeD,WAAY,AA8Cd,QAAa,CAKL,SAAS,CAAC;IACR,gBAAgB,EAAE,8DAAuF;GAAG;;;ArC0HtH,MAAM,CAAC,MAAM,MAAM,SAAS,EAAE,KAAK;EqC7LrC,AAuEU,KAvEL,AAeD,WAAY,CAuDR,WAAW,CACT,IAAI,CAAC;IACH,gBAAgB,ExC/ChB,IAAI;GwC+C8B;EAxE9C,AAsEQ,KAtEH,AAeD,WAAY,CAuDR,WAAW,AAGjB,MAAe,CAAC;IACN,gBAAgB,EzC1Eb,qBAAc;GyC0EqB;EA1ElD,AA4EY,KA5EP,AAeD,WAAY,CAuDR,WAAW,AAKb,UAAe,CACT,IAAI,CAAC;IACH,gBAAgB,ExCpDlB,IAAI;GwCoDgC;EA7EhD,AA+EU,KA/EL,AAeD,WAAY,CA+DR,SAAS,CACP,SAAS,CAAC;IACR,gBAAgB,ExCvDhB,wBAAI;GwCuDyC;;;AAhFzD,AAeI,KAfC,AAeD,QAAS,CAAK;EACZ,gBAAgB,EzCEP,OAAmB;EyCD5B,KAAK,ExCQC,IAAI;CwCuD+C;;AAhF/D,AAkBM,KAlBD,AAeD,QAAS,CAGP,CAAC,AAAA,IAAK,CAAA,AAAA,OAAO;AAlBnB,AAmBM,KAnBD,AAeD,QAAS,CAIP,MAAM,CAAC;EACL,KAAK,EAAE,OAAO;CAAI;;AApB1B,AAqBM,KArBD,AAeD,QAAS,CAMP,MAAM,CAAC;EACL,KAAK,ExCGD,IAAI;CwCHe;;AAtB/B,AAuBM,KAvBD,AAeD,QAAS,CAQP,SAAS,CAAC;EACR,KAAK,ExCCD,wBAAI;CwCEmB;;AA3BnC,AAyBQ,KAzBH,AAeD,QAAS,CAQP,SAAS,CAEP,CAAC,AAAA,IAAK,CAAA,AAAA,OAAO;AAzBrB,AA0BQ,KA1BH,AAeD,QAAS,CAQP,SAAS,CAGP,MAAM,CAAC;EACL,KAAK,ExCFH,IAAI;CwCEiB;;AA3BjC,AA4BM,KA5BD,AAeD,QAAS,CAaP,IAAI,CAAC;EACH,UAAU,EAAE,CAAC,CAAC,GAAG,CAAC,CAAC,CxCJf,wBAAI;CwCIuC;;ArCgKrD,MAAM,CAAC,MAAM,MAAM,SAAS,EAAE,KAAK;EqC7LrC,AA8BM,KA9BD,AAeD,QAAS,CAeP,SAAS,CAAC;IAEN,gBAAgB,EzCdX,OAAmB;GyCcK;;;AAhCvC,AAiCM,KAjCD,AAeD,QAAS,CAkBP,CAAC,AAAA,SAAS;AAjChB,AAkCgB,KAlCX,AAeD,QAAS,CAmBP,SAAS,CAAC,CAAC,AAAA,IAAK,CAAA,AAAA,OAAO,EAAE;EACvB,KAAK,ExCVD,wBAAI;CwCamB;;AAtCnC,AAiCM,KAjCD,AAeD,QAAS,CAkBP,CAAC,AAAA,SAAS,AAGzB,MAAwB,EApCf,AAiCM,KAjCD,AAeD,QAAS,CAkBP,CAAC,AAAA,SAAS,AAIzB,UAA4B;AArCnB,AAkCgB,KAlCX,AAeD,QAAS,CAmBP,SAAS,CAAC,CAAC,AAAA,IAAK,CAAA,AAAA,OAAO,CAEtC,MAAwB;AApCf,AAkCgB,KAlCX,AAeD,QAAS,CAmBP,SAAS,CAAC,CAAC,AAAA,IAAK,CAAA,AAAA,OAAO,CAGtC,UAA4B,CAAC;EACV,KAAK,ExCbH,IAAI;CwCaiB;;AAtCjC,AAwCQ,KAxCH,AAeD,QAAS,CAwBP,KAAK,CACH,CAAC,CAAC;EACA,KAAK,ExChBH,IAAI;EwCiBN,OAAO,EAAE,GAAG;CAEM;;AA5C5B,AAwCQ,KAxCH,AAeD,QAAS,CAwBP,KAAK,CACH,CAAC,AAGP,MAAe,CAAC;EACN,OAAO,EAAE,CAAC;CAAI;;AA5C1B,AA8CsB,KA9CjB,AAeD,QAAS,CAwBP,KAAK,CAMH,EAAE,AACR,UAAmB,CAAC,CAAC,CAAC;EACZ,OAAO,EAAE,CAAC;CAAI;;AA/C1B,AAkDU,KAlDL,AAeD,QAAS,CAwBP,KAAK,AASR,SAAe,CAER,CAAC,EAlDX,AAkDU,KAlDL,AAeD,QAAS,CAwBP,KAAK,AAUR,UAAgB,CACT,CAAC,CAAC;EACA,KAAK,ExC1BL,IAAI;CwC4BsC;;AArDtD,AAkDU,KAlDL,AAeD,QAAS,CAwBP,KAAK,AASR,SAAe,CAER,CAAC,AAEhB,MAAwB,EApDnB,AAkDU,KAlDL,AAeD,QAAS,CAwBP,KAAK,AAUR,UAAgB,CACT,CAAC,AAEhB,MAAwB,CAAC;EACN,gBAAgB,EzCrDf,qBAAc;CyCqDuB;;AArDpD,AAsDuB,KAtDlB,AAeD,QAAS,CAwBP,KAAK,AASR,SAAe,CAMR,EAAE,AAAA,UAAU,CAAC,CAAC,EAtDxB,AAsDuB,KAtDlB,AAeD,QAAS,CAwBP,KAAK,AASR,SAAe,CAMR,EAAE,AAAA,UAAU,CAAC,CAAC,AAE7B,MAAwB,EAxDnB,AAsDuB,KAtDlB,AAeD,QAAS,CAwBP,KAAK,AAUR,UAAgB,CAKT,EAAE,AAAA,UAAU,CAAC,CAAC,EAtDxB,AAsDuB,KAtDlB,AAeD,QAAS,CAwBP,KAAK,AAUR,UAAgB,CAKT,EAAE,AAAA,UAAU,CAAC,CAAC,AAE7B,MAAwB,CAAC;EACN,gBAAgB,ExChClB,IAAI;EwCiCF,YAAY,ExCjCd,IAAI;EwCkCF,KAAK,EzCzCJ,OAAmB;CyCyCJ;;AA3D9B,AA6DM,KA7DD,AAeD,QAAS,AA8Cf,QAAiB,CAAC;EAGR,gBAAgB,EAAE,8DAAuF;CAGW;;ArC0H1H,MAAM,CAAC,MAAM,MAAM,SAAS,EAAE,KAAK;EqC7LrC,AAkEU,KAlEL,AAeD,QAAS,AA8CZ,QAAc,CAKL,SAAS,CAAC;IACR,gBAAgB,EAAE,8DAAuF;GAAG;;;ArC0HtH,MAAM,CAAC,MAAM,MAAM,SAAS,EAAE,KAAK;EqC7LrC,AAuEU,KAvEL,AAeD,QAAS,CAuDL,WAAW,CACT,IAAI,CAAC;IACH,gBAAgB,ExC/ChB,IAAI;GwC+C8B;EAxE9C,AAsEQ,KAtEH,AAeD,QAAS,CAuDL,WAAW,AAGjB,MAAe,CAAC;IACN,gBAAgB,EzC1Eb,qBAAc;GyC0EqB;EA1ElD,AA4EY,KA5EP,AAeD,QAAS,CAuDL,WAAW,AAKd,UAAgB,CACT,IAAI,CAAC;IACH,gBAAgB,ExCpDlB,IAAI;GwCoDgC;EA7EhD,AA+EU,KA/EL,AAeD,QAAS,CA+DL,SAAS,CACP,SAAS,CAAC;IACR,gBAAgB,ExCvDhB,wBAAI;GwCuDyC;;;AAhFzD,AAeI,KAfC,AAeD,WAAY,CAAE;EACZ,gBAAgB,EzCAP,OAAmB;EyCC5B,KAAK,ExCQC,IAAI;CwCuD+C;;AAhF/D,AAkBM,KAlBD,AAeD,WAAY,CAGV,CAAC,AAAA,IAAK,CAAA,AAAA,OAAO;AAlBnB,AAmBM,KAnBD,AAeD,WAAY,CAIV,MAAM,CAAC;EACL,KAAK,EAAE,OAAO;CAAI;;AApB1B,AAqBM,KArBD,AAeD,WAAY,CAMV,MAAM,CAAC;EACL,KAAK,ExCGD,IAAI;CwCHe;;AAtB/B,AAuBM,KAvBD,AAeD,WAAY,CAQV,SAAS,CAAC;EACR,KAAK,ExCCD,wBAAI;CwCEmB;;AA3BnC,AAyBQ,KAzBH,AAeD,WAAY,CAQV,SAAS,CAEP,CAAC,AAAA,IAAK,CAAA,AAAA,OAAO;AAzBrB,AA0BQ,KA1BH,AAeD,WAAY,CAQV,SAAS,CAGP,MAAM,CAAC;EACL,KAAK,ExCFH,IAAI;CwCEiB;;AA3BjC,AA4BM,KA5BD,AAeD,WAAY,CAaV,IAAI,CAAC;EACH,UAAU,EAAE,CAAC,CAAC,GAAG,CAAC,CAAC,CxCJf,wBAAI;CwCIuC;;ArCgKrD,MAAM,CAAC,MAAM,MAAM,SAAS,EAAE,KAAK;EqC7LrC,AA8BM,KA9BD,AAeD,WAAY,CAeV,SAAS,CAAC;IAEN,gBAAgB,EzChBX,OAAmB;GyCgBK;;;AAhCvC,AAiCM,KAjCD,AAeD,WAAY,CAkBV,CAAC,AAAA,SAAS;AAjChB,AAkCgB,KAlCX,AAeD,WAAY,CAmBV,SAAS,CAAC,CAAC,AAAA,IAAK,CAAA,AAAA,OAAO,EAAE;EACvB,KAAK,ExCVD,wBAAI;CwCamB;;AAtCnC,AAiCM,KAjCD,AAeD,WAAY,CAkBV,CAAC,AAAA,SAAS,AAGzB,MAAwB,EApCf,AAiCM,KAjCD,AAeD,WAAY,CAkBV,CAAC,AAAA,SAAS,AAIzB,UAA4B;AArCnB,AAkCgB,KAlCX,AAeD,WAAY,CAmBV,SAAS,CAAC,CAAC,AAAA,IAAK,CAAA,AAAA,OAAO,CAEtC,MAAwB;AApCf,AAkCgB,KAlCX,AAeD,WAAY,CAmBV,SAAS,CAAC,CAAC,AAAA,IAAK,CAAA,AAAA,OAAO,CAGtC,UAA4B,CAAC;EACV,KAAK,ExCbH,IAAI;CwCaiB;;AAtCjC,AAwCQ,KAxCH,AAeD,WAAY,CAwBV,KAAK,CACH,CAAC,CAAC;EACA,KAAK,ExChBH,IAAI;EwCiBN,OAAO,EAAE,GAAG;CAEM;;AA5C5B,AAwCQ,KAxCH,AAeD,WAAY,CAwBV,KAAK,CACH,CAAC,AAGP,MAAe,CAAC;EACN,OAAO,EAAE,CAAC;CAAI;;AA5C1B,AA8CsB,KA9CjB,AAeD,WAAY,CAwBV,KAAK,CAMH,EAAE,AACR,UAAmB,CAAC,CAAC,CAAC;EACZ,OAAO,EAAE,CAAC;CAAI;;AA/C1B,AAkDU,KAlDL,AAeD,WAAY,CAwBV,KAAK,AAST,SAAgB,CAER,CAAC,EAlDX,AAkDU,KAlDL,AAeD,WAAY,CAwBV,KAAK,AAUT,UAAiB,CACT,CAAC,CAAC;EACA,KAAK,ExC1BL,IAAI;CwC4BsC;;AArDtD,AAkDU,KAlDL,AAeD,WAAY,CAwBV,KAAK,AAST,SAAgB,CAER,CAAC,AAEhB,MAAwB,EApDnB,AAkDU,KAlDL,AAeD,WAAY,CAwBV,KAAK,AAUT,UAAiB,CACT,CAAC,AAEhB,MAAwB,CAAC;EACN,gBAAgB,EzCrDf,qBAAc;CyCqDuB;;AArDpD,AAsDuB,KAtDlB,AAeD,WAAY,CAwBV,KAAK,AAST,SAAgB,CAMR,EAAE,AAAA,UAAU,CAAC,CAAC,EAtDxB,AAsDuB,KAtDlB,AAeD,WAAY,CAwBV,KAAK,AAST,SAAgB,CAMR,EAAE,AAAA,UAAU,CAAC,CAAC,AAE7B,MAAwB,EAxDnB,AAsDuB,KAtDlB,AAeD,WAAY,CAwBV,KAAK,AAUT,UAAiB,CAKT,EAAE,AAAA,UAAU,CAAC,CAAC,EAtDxB,AAsDuB,KAtDlB,AAeD,WAAY,CAwBV,KAAK,AAUT,UAAiB,CAKT,EAAE,AAAA,UAAU,CAAC,CAAC,AAE7B,MAAwB,CAAC;EACN,gBAAgB,ExChClB,IAAI;EwCiCF,YAAY,ExCjCd,IAAI;EwCkCF,KAAK,EzC3CJ,OAAmB;CyC2CJ;;AA3D9B,AA6DM,KA7DD,AAeD,WAAY,AA8ClB,QAAiB,CAAC;EAGR,gBAAgB,EAAE,8DAAuF;CAGW;;ArC0H1H,MAAM,CAAC,MAAM,MAAM,SAAS,EAAE,KAAK;EqC7LrC,AAkEU,KAlEL,AAeD,WAAY,AA8ChB,QAAe,CAKL,SAAS,CAAC;IACR,gBAAgB,EAAE,8DAAuF;GAAG;;;ArC0HtH,MAAM,CAAC,MAAM,MAAM,SAAS,EAAE,KAAK;EqC7LrC,AAuEU,KAvEL,AAeD,WAAY,CAuDR,WAAW,CACT,IAAI,CAAC;IACH,gBAAgB,ExC/ChB,IAAI;GwC+C8B;EAxE9C,AAsEQ,KAtEH,AAeD,WAAY,CAuDR,WAAW,AAGjB,MAAe,CAAC;IACN,gBAAgB,EzC1Eb,qBAAc;GyC0EqB;EA1ElD,AA4EY,KA5EP,AAeD,WAAY,CAuDR,WAAW,AAKf,UAAiB,CACT,IAAI,CAAC;IACH,gBAAgB,ExCpDlB,IAAI;GwCoDgC;EA7EhD,AA+EU,KA/EL,AAeD,WAAY,CA+DR,SAAS,CACP,SAAS,CAAC;IACR,gBAAgB,ExCvDhB,wBAAI;GwCuDyC;;;AAhFzD,AAeI,KAfC,AAeD,WAAY,CAAE;EACZ,gBAAgB,EzCDP,OAAmB;EyCE5B,KAAK,ExCMM,kBAAI;CwCyD0C;;AAhF/D,AAkBM,KAlBD,AAeD,WAAY,CAGV,CAAC,AAAA,IAAK,CAAA,AAAA,OAAO;AAlBnB,AAmBM,KAnBD,AAeD,WAAY,CAIV,MAAM,CAAC;EACL,KAAK,EAAE,OAAO;CAAI;;AApB1B,AAqBM,KArBD,AAeD,WAAY,CAMV,MAAM,CAAC;EACL,KAAK,ExCCI,kBAAI;CwCDU;;AAtB/B,AAuBM,KAvBD,AAeD,WAAY,CAQV,SAAS,CAAC;EACR,KAAK,ExCDI,kBAAI;CwCIc;;AA3BnC,AAyBQ,KAzBH,AAeD,WAAY,CAQV,SAAS,CAEP,CAAC,AAAA,IAAK,CAAA,AAAA,OAAO;AAzBrB,AA0BQ,KA1BH,AAeD,WAAY,CAQV,SAAS,CAGP,MAAM,CAAC;EACL,KAAK,ExCJE,kBAAI;CwCIY;;AA3BjC,AA4BM,KA5BD,AAeD,WAAY,CAaV,IAAI,CAAC;EACH,UAAU,EAAE,CAAC,CAAC,GAAG,CAAC,CAAC,CxCNV,kBAAI;CwCMkC;;ArCgKrD,MAAM,CAAC,MAAM,MAAM,SAAS,EAAE,KAAK;EqC7LrC,AA8BM,KA9BD,AAeD,WAAY,CAeV,SAAS,CAAC;IAEN,gBAAgB,EzCjBX,OAAmB;GyCiBK;;;AAhCvC,AAiCM,KAjCD,AAeD,WAAY,CAkBV,CAAC,AAAA,SAAS;AAjChB,AAkCgB,KAlCX,AAeD,WAAY,CAmBV,SAAS,CAAC,CAAC,AAAA,IAAK,CAAA,AAAA,OAAO,EAAE;EACvB,KAAK,ExCZI,kBAAI;CwCec;;AAtCnC,AAiCM,KAjCD,AAeD,WAAY,CAkBV,CAAC,AAAA,SAAS,AAGzB,MAAwB,EApCf,AAiCM,KAjCD,AAeD,WAAY,CAkBV,CAAC,AAAA,SAAS,AAIzB,UAA4B;AArCnB,AAkCgB,KAlCX,AAeD,WAAY,CAmBV,SAAS,CAAC,CAAC,AAAA,IAAK,CAAA,AAAA,OAAO,CAEtC,MAAwB;AApCf,AAkCgB,KAlCX,AAeD,WAAY,CAmBV,SAAS,CAAC,CAAC,AAAA,IAAK,CAAA,AAAA,OAAO,CAGtC,UAA4B,CAAC;EACV,KAAK,ExCfE,kBAAI;CwCeY;;AAtCjC,AAwCQ,KAxCH,AAeD,WAAY,CAwBV,KAAK,CACH,CAAC,CAAC;EACA,KAAK,ExClBE,kBAAI;EwCmBX,OAAO,EAAE,GAAG;CAEM;;AA5C5B,AAwCQ,KAxCH,AAeD,WAAY,CAwBV,KAAK,CACH,CAAC,AAGP,MAAe,CAAC;EACN,OAAO,EAAE,CAAC;CAAI;;AA5C1B,AA8CsB,KA9CjB,AAeD,WAAY,CAwBV,KAAK,CAMH,EAAE,AACR,UAAmB,CAAC,CAAC,CAAC;EACZ,OAAO,EAAE,CAAC;CAAI;;AA/C1B,AAkDU,KAlDL,AAeD,WAAY,CAwBV,KAAK,AASV,SAAiB,CAER,CAAC,EAlDX,AAkDU,KAlDL,AAeD,WAAY,CAwBV,KAAK,AAUV,UAAkB,CACT,CAAC,CAAC;EACA,KAAK,ExC5BA,kBAAI;CwC8BiC;;AArDtD,AAkDU,KAlDL,AAeD,WAAY,CAwBV,KAAK,AASV,SAAiB,CAER,CAAC,AAEhB,MAAwB,EApDnB,AAkDU,KAlDL,AAeD,WAAY,CAwBV,KAAK,AAUV,UAAkB,CACT,CAAC,AAEhB,MAAwB,CAAC;EACN,gBAAgB,EzCrDf,qBAAc;CyCqDuB;;AArDpD,AAsDuB,KAtDlB,AAeD,WAAY,CAwBV,KAAK,AASV,SAAiB,CAMR,EAAE,AAAA,UAAU,CAAC,CAAC,EAtDxB,AAsDuB,KAtDlB,AAeD,WAAY,CAwBV,KAAK,AASV,SAAiB,CAMR,EAAE,AAAA,UAAU,CAAC,CAAC,AAE7B,MAAwB,EAxDnB,AAsDuB,KAtDlB,AAeD,WAAY,CAwBV,KAAK,AAUV,UAAkB,CAKT,EAAE,AAAA,UAAU,CAAC,CAAC,EAtDxB,AAsDuB,KAtDlB,AAeD,WAAY,CAwBV,KAAK,AAUV,UAAkB,CAKT,EAAE,AAAA,UAAU,CAAC,CAAC,AAE7B,MAAwB,CAAC;EACN,gBAAgB,ExClCb,kBAAI;EwCmCP,YAAY,ExCnCT,kBAAI;EwCoCP,KAAK,EzC5CJ,OAAmB;CyC4CJ;;AA3D9B,AA6DM,KA7DD,AAeD,WAAY,AA8ClB,QAAiB,CAAC;EAGR,gBAAgB,EAAE,8DAAuF;CAGW;;ArC0H1H,MAAM,CAAC,MAAM,MAAM,SAAS,EAAE,KAAK;EqC7LrC,AAkEU,KAlEL,AAeD,WAAY,AA8CjB,QAAgB,CAKL,SAAS,CAAC;IACR,gBAAgB,EAAE,8DAAuF;GAAG;;;ArC0HtH,MAAM,CAAC,MAAM,MAAM,SAAS,EAAE,KAAK;EqC7LrC,AAuEU,KAvEL,AAeD,WAAY,CAuDR,WAAW,CACT,IAAI,CAAC;IACH,gBAAgB,ExCjDX,kBAAI;GwCiDyB;EAxE9C,AAsEQ,KAtEH,AAeD,WAAY,CAuDR,WAAW,AAGjB,MAAe,CAAC;IACN,gBAAgB,EzC1Eb,qBAAc;GyC0EqB;EA1ElD,AA4EY,KA5EP,AAeD,WAAY,CAuDR,WAAW,AAKhB,UAAkB,CACT,IAAI,CAAC;IACH,gBAAgB,ExCtDb,kBAAI;GwCsD2B;EA7EhD,AA+EU,KA/EL,AAeD,WAAY,CA+DR,SAAS,CACP,SAAS,CAAC;IACR,gBAAgB,ExCzDX,kBAAI;GwCyDoC;;;AAhFzD,AAeI,KAfC,AAeD,UAAW,CAAG;EACZ,gBAAgB,EzCIP,OAAmB;EyCH5B,KAAK,ExCQC,IAAI;CwCuD+C;;AAhF/D,AAkBM,KAlBD,AAeD,UAAW,CAGT,CAAC,AAAA,IAAK,CAAA,AAAA,OAAO;AAlBnB,AAmBM,KAnBD,AAeD,UAAW,CAIT,MAAM,CAAC;EACL,KAAK,EAAE,OAAO;CAAI;;AApB1B,AAqBM,KArBD,AAeD,UAAW,CAMT,MAAM,CAAC;EACL,KAAK,ExCGD,IAAI;CwCHe;;AAtB/B,AAuBM,KAvBD,AAeD,UAAW,CAQT,SAAS,CAAC;EACR,KAAK,ExCCD,wBAAI;CwCEmB;;AA3BnC,AAyBQ,KAzBH,AAeD,UAAW,CAQT,SAAS,CAEP,CAAC,AAAA,IAAK,CAAA,AAAA,OAAO;AAzBrB,AA0BQ,KA1BH,AAeD,UAAW,CAQT,SAAS,CAGP,MAAM,CAAC;EACL,KAAK,ExCFH,IAAI;CwCEiB;;AA3BjC,AA4BM,KA5BD,AAeD,UAAW,CAaT,IAAI,CAAC;EACH,UAAU,EAAE,CAAC,CAAC,GAAG,CAAC,CAAC,CxCJf,wBAAI;CwCIuC;;ArCgKrD,MAAM,CAAC,MAAM,MAAM,SAAS,EAAE,KAAK;EqC7LrC,AA8BM,KA9BD,AAeD,UAAW,CAeT,SAAS,CAAC;IAEN,gBAAgB,EzCZX,OAAmB;GyCYK;;;AAhCvC,AAiCM,KAjCD,AAeD,UAAW,CAkBT,CAAC,AAAA,SAAS;AAjChB,AAkCgB,KAlCX,AAeD,UAAW,CAmBT,SAAS,CAAC,CAAC,AAAA,IAAK,CAAA,AAAA,OAAO,EAAE;EACvB,KAAK,ExCVD,wBAAI;CwCamB;;AAtCnC,AAiCM,KAjCD,AAeD,UAAW,CAkBT,CAAC,AAAA,SAAS,AAGzB,MAAwB,EApCf,AAiCM,KAjCD,AAeD,UAAW,CAkBT,CAAC,AAAA,SAAS,AAIzB,UAA4B;AArCnB,AAkCgB,KAlCX,AAeD,UAAW,CAmBT,SAAS,CAAC,CAAC,AAAA,IAAK,CAAA,AAAA,OAAO,CAEtC,MAAwB;AApCf,AAkCgB,KAlCX,AAeD,UAAW,CAmBT,SAAS,CAAC,CAAC,AAAA,IAAK,CAAA,AAAA,OAAO,CAGtC,UAA4B,CAAC;EACV,KAAK,ExCbH,IAAI;CwCaiB;;AAtCjC,AAwCQ,KAxCH,AAeD,UAAW,CAwBT,KAAK,CACH,CAAC,CAAC;EACA,KAAK,ExChBH,IAAI;EwCiBN,OAAO,EAAE,GAAG;CAEM;;AA5C5B,AAwCQ,KAxCH,AAeD,UAAW,CAwBT,KAAK,CACH,CAAC,AAGP,MAAe,CAAC;EACN,OAAO,EAAE,CAAC;CAAI;;AA5C1B,AA8CsB,KA9CjB,AAeD,UAAW,CAwBT,KAAK,CAMH,EAAE,AACR,UAAmB,CAAC,CAAC,CAAC;EACZ,OAAO,EAAE,CAAC;CAAI;;AA/C1B,AAkDU,KAlDL,AAeD,UAAW,CAwBT,KAAK,AASX,SAAkB,CAER,CAAC,EAlDX,AAkDU,KAlDL,AAeD,UAAW,CAwBT,KAAK,AAUX,UAAmB,CACT,CAAC,CAAC;EACA,KAAK,ExC1BL,IAAI;CwC4BsC;;AArDtD,AAkDU,KAlDL,AAeD,UAAW,CAwBT,KAAK,AASX,SAAkB,CAER,CAAC,AAEhB,MAAwB,EApDnB,AAkDU,KAlDL,AAeD,UAAW,CAwBT,KAAK,AAUX,UAAmB,CACT,CAAC,AAEhB,MAAwB,CAAC;EACN,gBAAgB,EzCrDf,qBAAc;CyCqDuB;;AArDpD,AAsDuB,KAtDlB,AAeD,UAAW,CAwBT,KAAK,AASX,SAAkB,CAMR,EAAE,AAAA,UAAU,CAAC,CAAC,EAtDxB,AAsDuB,KAtDlB,AAeD,UAAW,CAwBT,KAAK,AASX,SAAkB,CAMR,EAAE,AAAA,UAAU,CAAC,CAAC,AAE7B,MAAwB,EAxDnB,AAsDuB,KAtDlB,AAeD,UAAW,CAwBT,KAAK,AAUX,UAAmB,CAKT,EAAE,AAAA,UAAU,CAAC,CAAC,EAtDxB,AAsDuB,KAtDlB,AAeD,UAAW,CAwBT,KAAK,AAUX,UAAmB,CAKT,EAAE,AAAA,UAAU,CAAC,CAAC,AAE7B,MAAwB,CAAC;EACN,gBAAgB,ExChClB,IAAI;EwCiCF,YAAY,ExCjCd,IAAI;EwCkCF,KAAK,EzCvCJ,OAAmB;CyCuCJ;;AA3D9B,AA6DM,KA7DD,AAeD,UAAW,AA8CjB,QAAiB,CAAC;EAGR,gBAAgB,EAAE,8DAAuF;CAGW;;ArC0H1H,MAAM,CAAC,MAAM,MAAM,SAAS,EAAE,KAAK;EqC7LrC,AAkEU,KAlEL,AAeD,UAAW,AA8CjB,QAAiB,CAKL,SAAS,CAAC;IACR,gBAAgB,EAAE,8DAAuF;GAAG;;;ArC0HtH,MAAM,CAAC,MAAM,MAAM,SAAS,EAAE,KAAK;EqC7LrC,AAuEU,KAvEL,AAeD,UAAW,CAuDP,WAAW,CACT,IAAI,CAAC;IACH,gBAAgB,ExC/ChB,IAAI;GwC+C8B;EAxE9C,AAsEQ,KAtEH,AAeD,UAAW,CAuDP,WAAW,AAGjB,MAAe,CAAC;IACN,gBAAgB,EzC1Eb,qBAAc;GyC0EqB;EA1ElD,AA4EY,KA5EP,AAeD,UAAW,CAuDP,WAAW,AAKjB,UAAmB,CACT,IAAI,CAAC;IACH,gBAAgB,ExCpDlB,IAAI;GwCoDgC;EA7EhD,AA+EU,KA/EL,AAeD,UAAW,CA+DP,SAAS,CACP,SAAS,CAAC;IACR,gBAAgB,ExCvDhB,wBAAI;GwCuDyC;;;ArCiHvD,MAAM,CAAC,MAAM,MAAM,SAAS,EAAE,KAAK,GAAG,KAAK;EqCjM7C,AAoFM,KApFD,AAkFH,UAAW,CAEP,UAAU,CAAC;IACT,cAAc,EAAE,IAAI;IACpB,WAAW,EAAE,IAAI;GAAI;;;ArC2G3B,MAAM,CAAC,MAAM,MAAM,SAAS,EAAE,KAAK,GAAG,KAAK;EqCjM7C,AAyFM,KAzFD,AAuFH,SAAU,CAEN,UAAU,CAAC;IACT,cAAc,EAAE,KAAK;IACrB,WAAW,EAAE,KAAK;GAAI;;;AA3F9B,AA8FI,KA9FC,AA4FH,cAAe,CAEb,UAAU,EA9Fd,AA8FI,KA9FC,AA6FH,cAAe,CACb,UAAU,CAAC;EACT,WAAW,EAAE,MAAM;EACnB,OAAO,EAAE,IAAI;CAGS;;AAnG5B,AAiGU,KAjGL,AA4FH,cAAe,CAEb,UAAU,GAGJ,UAAU,EAjGpB,AAiGU,KAjGL,AA6FH,cAAe,CACb,UAAU,GAGJ,UAAU,CAAC;EACb,SAAS,EAAE,CAAC;EACZ,WAAW,EAAE,CAAC;CAAI;;AAnG1B,AAoGE,KApGG,AAoGH,cAAe,CAAC;EACd,UAAU,EAAE,IAAI;CAAI;;AArGxB,AAsGE,KAtGG,AAsGH,cAAe,CAAC;EACd,UAAU,EAAE,KAAK;CAAI;;AAIzB,AAAA,WAAW,CAAC;ErCoDV,MAAM,EADgB,CAAC;EAEvB,IAAI,EAFkB,CAAC;EAGvB,QAAQ,EAAE,QAAQ;EAClB,KAAK,EAJiB,CAAC;EAKvB,GAAG,EALmB,CAAC;EqCjDvB,QAAQ,EAAE,MAAM;CAaK;;AAfvB,AAGE,WAHS,CAGT,KAAK,CAAC;EACJ,IAAI,EAAE,GAAG;EACT,UAAU,EAAE,IAAI;EAChB,SAAS,EAAE,IAAI;EACf,QAAQ,EAAE,QAAQ;EAClB,GAAG,EAAE,GAAG;EACR,SAAS,EAAE,0BAA0B;CAAG;;AAT5C,AAWE,WAXS,AAWT,eAAgB,CAAC;EACf,OAAO,EAAE,GAAG;CAAI;;ArCsElB,MAAM,CAAC,MAAM,MAAM,SAAS,EAAE,KAAK;EqClFrC,AAAA,WAAW,CAAC;IAeR,OAAO,EAAE,IAAI;GAAM;;;AAEvB,AAAA,aAAa,CAAC;EACZ,UAAU,EAAE,MAAM;CAWc;;ArCqDhC,MAAM,CAAC,MAAM,MAAM,SAAS,EAAE,KAAK;EqCjErC,AAII,aAJS,CAIT,OAAO,CAAC;IACN,OAAO,EAAE,IAAI;GAEiB;EAPpC,AAII,aAJS,CAIT,OAAO,AAEL,IAAM,CAAA,AAAA,WAAW,EAAE;IACjB,aAAa,EAAE,OAAO;GAAI;;;ArC8DhC,MAAM,CAAC,MAAM,MAAM,SAAS,EAAE,KAAK,GAAG,KAAK;EqCrE7C,AAAA,aAAa,CAAC;IASV,OAAO,EAAE,IAAI;IACb,eAAe,EAAE,MAAM;GAEO;EAZlC,AAWI,aAXS,CAWT,OAAO,AAAA,IAAK,CAAA,AAAA,WAAW,EAAE;IACvB,YAAY,EAAE,MAAM;GAAI;;;AAI9B,AAAA,UAAU;AACV,AAAA,UAAU,CAAC;EACT,SAAS,EAAE,CAAC;EACZ,WAAW,EAAE,CAAC;CAAI;;AAEpB,AAAA,UAAU,CAAC;EACT,SAAS,EAAE,CAAC;EACZ,WAAW,EAAE,CAAC;EACd,OAAO,EAAE,WAAW;CAAI;;AClJ1B,AAAA,QAAQ,CAAC;EACP,OAAO,EALS,IAAI,CAAC,MAAM;CAYe;;AtCmM1C,MAAM,CAAC,MAAM,MAAM,SAAS,EAAE,MAAM;EsC3MtC,AAKI,QALI,AAKJ,UAAW,CAAC;IACV,OAAO,EATY,IAAI,CAAC,MAAM;GASK;EANzC,AAOI,QAPI,AAOJ,SAAU,CAAC;IACT,OAAO,EAVW,KAAK,CAAC,MAAM;GAUI;;;ACVxC,AAAA,OAAO,CAAC;EACN,gBAAgB,E3CSH,UAAe;E2CR5B,OAAO,EAAE,gBAAgB;CAAI"
-}
\ No newline at end of file
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/docs/blog.html b/hshassets/assets/sass/lib/bulma-0.5.0/docs/blog.html
deleted file mode 100644
index 7b76277e89557cc096ac9b7eb7a5ddab33e71b45..0000000000000000000000000000000000000000
--- a/hshassets/assets/sass/lib/bulma-0.5.0/docs/blog.html
+++ /dev/null
@@ -1,49 +0,0 @@
----
-layout: default
-route: blog
----
-
-{% include blog-hero.html %}
-
- <section class="section">
- <div class="container">
- {% for post in site.posts %}
- <article class="box article">
- <div class="columns">
- <div class="column is-narrow">
- <a class="article-image is-{{ post.color }}" href="{{ post.url }}">
- <span class="article-overlay"></span>
- <span class="article-icon">
- <span class="icon">
- <i class="fa fa-{{ post.icon }}"></i>
- </span>
- </span>
- <strong class="article-title">
- {{ post.name }}
- </strong>
- </a>
- </div>
- <div class="column">
- <div class="columns">
- <div class="column">
- <p class="subtitle">
- {{ post.date | date_to_string }}
- </p>
- <h2 class="title">
- <a href="{{ post.url }}">
- {{ post.title }}
- </a>
- </h2>
- </div>
- <div class="column">
- <div class="content is-medium">
- {{ post.introduction | markdownify }}
- </div>
- </div>
- </div>
- </div>
- </div>
- </article>
- {% endfor %}
- </div>
- </section>
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/.editorconfig b/hshassets/assets/sass/lib/bulma-0.5.1/.editorconfig
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/.editorconfig
rename to hshassets/assets/sass/lib/bulma-0.5.1/.editorconfig
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/.github/CONTRIBUTING.md b/hshassets/assets/sass/lib/bulma-0.5.1/.github/CONTRIBUTING.md
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/.github/CONTRIBUTING.md
rename to hshassets/assets/sass/lib/bulma-0.5.1/.github/CONTRIBUTING.md
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/.github/ISSUE_TEMPLATE.md b/hshassets/assets/sass/lib/bulma-0.5.1/.github/ISSUE_TEMPLATE.md
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/.github/ISSUE_TEMPLATE.md
rename to hshassets/assets/sass/lib/bulma-0.5.1/.github/ISSUE_TEMPLATE.md
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/.github/PULL_REQUEST_TEMPLATE.md b/hshassets/assets/sass/lib/bulma-0.5.1/.github/PULL_REQUEST_TEMPLATE.md
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/.github/PULL_REQUEST_TEMPLATE.md
rename to hshassets/assets/sass/lib/bulma-0.5.1/.github/PULL_REQUEST_TEMPLATE.md
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/.gitignore b/hshassets/assets/sass/lib/bulma-0.5.1/.gitignore
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/.gitignore
rename to hshassets/assets/sass/lib/bulma-0.5.1/.gitignore
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/CHANGELOG.md b/hshassets/assets/sass/lib/bulma-0.5.1/CHANGELOG.md
similarity index 95%
rename from hshassets/assets/sass/lib/bulma-0.5.0/CHANGELOG.md
rename to hshassets/assets/sass/lib/bulma-0.5.1/CHANGELOG.md
index f1b1f9b3e0b59ce4fbc0cb0d99464b78eef13259..c3809d384261e79e30e1faccf515d6d16dfa641d 100644
--- a/hshassets/assets/sass/lib/bulma-0.5.0/CHANGELOG.md
+++ b/hshassets/assets/sass/lib/bulma-0.5.1/CHANGELOG.md
@@ -1,10 +1,29 @@
# Bulma Changelog
+## 0.5.1
+
+### New features
+
+* 🎉 #280 [File upload element](http://bulma.io/documentation/form/file/)
+* `$container-offset` variable to determine the `.container` breakpoints
+* #1001 Text case helpers
+
+### Issues closed
+
+* #1030 Add `!importnant` to non responsive display helpers
+* #1020 Customizing `.navbar-item img` max height
+* #998 `.navbar-dropdown` with **right** alignment
+* #877 `.pagination` isn't using `$pagination-background`
+* #989 `navbar-brand` overflowing on mobile
+* #975 Variable `$table-head-color` isn't used
+* #964 Tabs sass file throwing error with `!important`
+* #949 `.is-size-7` helper is missing
+
## 0.5.0
### New features
-* [List of tags](http://bulma.io/documentation/elements/tag/#list-of-tags)
+* 🎉 [List of tags](http://bulma.io/documentation/elements/tag/#list-of-tags)
* New **variable naming system**: `component`-`subcomponent`-`state`-`property`
* Improved **customization** thanks to new set of variables
* #934 New `.is-shadowless` helper
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/LICENSE b/hshassets/assets/sass/lib/bulma-0.5.1/LICENSE
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/LICENSE
rename to hshassets/assets/sass/lib/bulma-0.5.1/LICENSE
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/README.md b/hshassets/assets/sass/lib/bulma-0.5.1/README.md
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/README.md
rename to hshassets/assets/sass/lib/bulma-0.5.1/README.md
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/bower.json b/hshassets/assets/sass/lib/bulma-0.5.1/bower.json
similarity index 95%
rename from hshassets/assets/sass/lib/bulma-0.5.0/bower.json
rename to hshassets/assets/sass/lib/bulma-0.5.1/bower.json
index c4b27126cf6c79837b83ff7d50c3ef655106f452..5297ad67990d5b028efd9c71c830052eaa9d070e 100644
--- a/hshassets/assets/sass/lib/bulma-0.5.0/bower.json
+++ b/hshassets/assets/sass/lib/bulma-0.5.1/bower.json
@@ -1,6 +1,6 @@
{
"name": "bulma",
- "version": "0.5.0",
+ "version": "0.5.1",
"homepage": "http://bulma.io",
"authors": [
"jgthms <bbxdesign@gmail.com>"
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/bulma.sass b/hshassets/assets/sass/lib/bulma-0.5.1/bulma.sass
similarity index 74%
rename from hshassets/assets/sass/lib/bulma-0.5.0/bulma.sass
rename to hshassets/assets/sass/lib/bulma-0.5.1/bulma.sass
index 18c163ccdf0ca75bd11a1bbfa86331902c546eea..8f6b1b4adb6e89f31af4c6be6c3c836ddac318e5 100644
--- a/hshassets/assets/sass/lib/bulma-0.5.0/bulma.sass
+++ b/hshassets/assets/sass/lib/bulma-0.5.1/bulma.sass
@@ -1,5 +1,5 @@
@charset "utf-8"
-/*! bulma.io v0.5.0 | MIT License | github.com/jgthms/bulma */
+/*! bulma.io v0.5.1 | MIT License | github.com/jgthms/bulma */
@import "sass/utilities/_all"
@import "sass/base/_all"
@import "sass/elements/_all"
diff --git a/hshassets/assets/sass/lib/bulma-0.5.1/css/bulma.css b/hshassets/assets/sass/lib/bulma-0.5.1/css/bulma.css
new file mode 100644
index 0000000000000000000000000000000000000000..816453a6b86a0e605b58a69ef58eb5e077cf3a8b
--- /dev/null
+++ b/hshassets/assets/sass/lib/bulma-0.5.1/css/bulma.css
@@ -0,0 +1,9503 @@
+/*! bulma.io v0.5.1 | MIT License | github.com/jgthms/bulma */
+@-webkit-keyframes spinAround {
+ from {
+ -webkit-transform: rotate(0deg);
+ transform: rotate(0deg);
+ }
+ to {
+ -webkit-transform: rotate(359deg);
+ transform: rotate(359deg);
+ }
+}
+@keyframes spinAround {
+ from {
+ -webkit-transform: rotate(0deg);
+ transform: rotate(0deg);
+ }
+ to {
+ -webkit-transform: rotate(359deg);
+ transform: rotate(359deg);
+ }
+}
+
+/*! minireset.css v0.0.2 | MIT License | github.com/jgthms/minireset.css */
+html,
+body,
+p,
+ol,
+ul,
+li,
+dl,
+dt,
+dd,
+blockquote,
+figure,
+fieldset,
+legend,
+textarea,
+pre,
+iframe,
+hr,
+h1,
+h2,
+h3,
+h4,
+h5,
+h6 {
+ margin: 0;
+ padding: 0;
+}
+
+h1,
+h2,
+h3,
+h4,
+h5,
+h6 {
+ font-size: 100%;
+ font-weight: normal;
+}
+
+ul {
+ list-style: none;
+}
+
+button,
+input,
+select,
+textarea {
+ margin: 0;
+}
+
+html {
+ -webkit-box-sizing: border-box;
+ box-sizing: border-box;
+}
+
+* {
+ -webkit-box-sizing: inherit;
+ box-sizing: inherit;
+}
+
+*:before, *:after {
+ -webkit-box-sizing: inherit;
+ box-sizing: inherit;
+}
+
+img,
+embed,
+object,
+audio,
+video {
+ max-width: 100%;
+}
+
+iframe {
+ border: 0;
+}
+
+table {
+ border-collapse: collapse;
+ border-spacing: 0;
+}
+
+td,
+th {
+ padding: 0;
+ text-align: left;
+}
+
+html {
+ background-color: #fff;
+ font-size: 16px;
+ -moz-osx-font-smoothing: grayscale;
+ -webkit-font-smoothing: antialiased;
+ min-width: 300px;
+ overflow-x: hidden;
+ overflow-y: scroll;
+ text-rendering: optimizeLegibility;
+}
+
+article,
+aside,
+figure,
+footer,
+header,
+hgroup,
+section {
+ display: block;
+}
+
+body,
+button,
+input,
+select,
+textarea {
+ font-family: BlinkMacSystemFont, -apple-system, "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", "Helvetica", "Arial", sans-serif;
+}
+
+code,
+pre {
+ -moz-osx-font-smoothing: auto;
+ -webkit-font-smoothing: auto;
+ font-family: monospace;
+}
+
+body {
+ color: #4a4a4a;
+ font-size: 1rem;
+ font-weight: 400;
+ line-height: 1.5;
+}
+
+a {
+ color: #00d1b2;
+ cursor: pointer;
+ text-decoration: none;
+}
+
+a strong {
+ color: currentColor;
+}
+
+a:hover {
+ color: #363636;
+}
+
+code {
+ background-color: whitesmoke;
+ color: #ff3860;
+ font-size: 0.875em;
+ font-weight: normal;
+ padding: 0.25em 0.5em 0.25em;
+}
+
+hr {
+ background-color: #dbdbdb;
+ border: none;
+ display: block;
+ height: 1px;
+ margin: 1.5rem 0;
+}
+
+img {
+ height: auto;
+ max-width: 100%;
+}
+
+input[type="checkbox"],
+input[type="radio"] {
+ vertical-align: baseline;
+}
+
+small {
+ font-size: 0.875em;
+}
+
+span {
+ font-style: inherit;
+ font-weight: inherit;
+}
+
+strong {
+ color: #363636;
+ font-weight: 700;
+}
+
+pre {
+ background-color: whitesmoke;
+ color: #4a4a4a;
+ font-size: 0.875em;
+ white-space: pre;
+ word-wrap: normal;
+}
+
+pre code {
+ -webkit-overflow-scrolling: touch;
+ background: none;
+ color: inherit;
+ display: block;
+ font-size: 1em;
+ overflow-x: auto;
+ padding: 1.25rem 1.5rem;
+}
+
+table td,
+table th {
+ text-align: left;
+ vertical-align: top;
+}
+
+table th {
+ color: #363636;
+}
+
+.is-clearfix:after {
+ clear: both;
+ content: " ";
+ display: table;
+}
+
+.is-pulled-left {
+ float: left !important;
+}
+
+.is-pulled-right {
+ float: right !important;
+}
+
+.is-clipped {
+ overflow: hidden !important;
+}
+
+.is-overlay {
+ bottom: 0;
+ left: 0;
+ position: absolute;
+ right: 0;
+ top: 0;
+}
+
+.is-size-1 {
+ font-size: 3rem !important;
+}
+
+@media screen and (max-width: 768px) {
+ .is-size-1-mobile {
+ font-size: 3rem !important;
+ }
+}
+
+@media screen and (min-width: 769px), print {
+ .is-size-1-tablet {
+ font-size: 3rem !important;
+ }
+}
+
+@media screen and (max-width: 1007px) {
+ .is-size-1-touch {
+ font-size: 3rem !important;
+ }
+}
+
+@media screen and (min-width: 1008px) {
+ .is-size-1-desktop {
+ font-size: 3rem !important;
+ }
+}
+
+@media screen and (min-width: 1200px) {
+ .is-size-1-widescreen {
+ font-size: 3rem !important;
+ }
+}
+
+@media screen and (min-width: 1392px) {
+ .is-size-1-fullhd {
+ font-size: 3rem !important;
+ }
+}
+
+.is-size-2 {
+ font-size: 2.5rem !important;
+}
+
+@media screen and (max-width: 768px) {
+ .is-size-2-mobile {
+ font-size: 2.5rem !important;
+ }
+}
+
+@media screen and (min-width: 769px), print {
+ .is-size-2-tablet {
+ font-size: 2.5rem !important;
+ }
+}
+
+@media screen and (max-width: 1007px) {
+ .is-size-2-touch {
+ font-size: 2.5rem !important;
+ }
+}
+
+@media screen and (min-width: 1008px) {
+ .is-size-2-desktop {
+ font-size: 2.5rem !important;
+ }
+}
+
+@media screen and (min-width: 1200px) {
+ .is-size-2-widescreen {
+ font-size: 2.5rem !important;
+ }
+}
+
+@media screen and (min-width: 1392px) {
+ .is-size-2-fullhd {
+ font-size: 2.5rem !important;
+ }
+}
+
+.is-size-3 {
+ font-size: 2rem !important;
+}
+
+@media screen and (max-width: 768px) {
+ .is-size-3-mobile {
+ font-size: 2rem !important;
+ }
+}
+
+@media screen and (min-width: 769px), print {
+ .is-size-3-tablet {
+ font-size: 2rem !important;
+ }
+}
+
+@media screen and (max-width: 1007px) {
+ .is-size-3-touch {
+ font-size: 2rem !important;
+ }
+}
+
+@media screen and (min-width: 1008px) {
+ .is-size-3-desktop {
+ font-size: 2rem !important;
+ }
+}
+
+@media screen and (min-width: 1200px) {
+ .is-size-3-widescreen {
+ font-size: 2rem !important;
+ }
+}
+
+@media screen and (min-width: 1392px) {
+ .is-size-3-fullhd {
+ font-size: 2rem !important;
+ }
+}
+
+.is-size-4 {
+ font-size: 1.5rem !important;
+}
+
+@media screen and (max-width: 768px) {
+ .is-size-4-mobile {
+ font-size: 1.5rem !important;
+ }
+}
+
+@media screen and (min-width: 769px), print {
+ .is-size-4-tablet {
+ font-size: 1.5rem !important;
+ }
+}
+
+@media screen and (max-width: 1007px) {
+ .is-size-4-touch {
+ font-size: 1.5rem !important;
+ }
+}
+
+@media screen and (min-width: 1008px) {
+ .is-size-4-desktop {
+ font-size: 1.5rem !important;
+ }
+}
+
+@media screen and (min-width: 1200px) {
+ .is-size-4-widescreen {
+ font-size: 1.5rem !important;
+ }
+}
+
+@media screen and (min-width: 1392px) {
+ .is-size-4-fullhd {
+ font-size: 1.5rem !important;
+ }
+}
+
+.is-size-5 {
+ font-size: 1.25rem !important;
+}
+
+@media screen and (max-width: 768px) {
+ .is-size-5-mobile {
+ font-size: 1.25rem !important;
+ }
+}
+
+@media screen and (min-width: 769px), print {
+ .is-size-5-tablet {
+ font-size: 1.25rem !important;
+ }
+}
+
+@media screen and (max-width: 1007px) {
+ .is-size-5-touch {
+ font-size: 1.25rem !important;
+ }
+}
+
+@media screen and (min-width: 1008px) {
+ .is-size-5-desktop {
+ font-size: 1.25rem !important;
+ }
+}
+
+@media screen and (min-width: 1200px) {
+ .is-size-5-widescreen {
+ font-size: 1.25rem !important;
+ }
+}
+
+@media screen and (min-width: 1392px) {
+ .is-size-5-fullhd {
+ font-size: 1.25rem !important;
+ }
+}
+
+.is-size-6 {
+ font-size: 1rem !important;
+}
+
+@media screen and (max-width: 768px) {
+ .is-size-6-mobile {
+ font-size: 1rem !important;
+ }
+}
+
+@media screen and (min-width: 769px), print {
+ .is-size-6-tablet {
+ font-size: 1rem !important;
+ }
+}
+
+@media screen and (max-width: 1007px) {
+ .is-size-6-touch {
+ font-size: 1rem !important;
+ }
+}
+
+@media screen and (min-width: 1008px) {
+ .is-size-6-desktop {
+ font-size: 1rem !important;
+ }
+}
+
+@media screen and (min-width: 1200px) {
+ .is-size-6-widescreen {
+ font-size: 1rem !important;
+ }
+}
+
+@media screen and (min-width: 1392px) {
+ .is-size-6-fullhd {
+ font-size: 1rem !important;
+ }
+}
+
+.is-size-7 {
+ font-size: 0.75rem !important;
+}
+
+@media screen and (max-width: 768px) {
+ .is-size-7-mobile {
+ font-size: 0.75rem !important;
+ }
+}
+
+@media screen and (min-width: 769px), print {
+ .is-size-7-tablet {
+ font-size: 0.75rem !important;
+ }
+}
+
+@media screen and (max-width: 1007px) {
+ .is-size-7-touch {
+ font-size: 0.75rem !important;
+ }
+}
+
+@media screen and (min-width: 1008px) {
+ .is-size-7-desktop {
+ font-size: 0.75rem !important;
+ }
+}
+
+@media screen and (min-width: 1200px) {
+ .is-size-7-widescreen {
+ font-size: 0.75rem !important;
+ }
+}
+
+@media screen and (min-width: 1392px) {
+ .is-size-7-fullhd {
+ font-size: 0.75rem !important;
+ }
+}
+
+.has-text-centered {
+ text-align: center !important;
+}
+
+@media screen and (max-width: 768px) {
+ .has-text-centered-mobile {
+ text-align: center !important;
+ }
+}
+
+@media screen and (min-width: 769px), print {
+ .has-text-centered-tablet {
+ text-align: center !important;
+ }
+}
+
+@media screen and (min-width: 769px) and (max-width: 1007px) {
+ .has-text-centered-tablet-only {
+ text-align: center !important;
+ }
+}
+
+@media screen and (max-width: 1007px) {
+ .has-text-centered-touch {
+ text-align: center !important;
+ }
+}
+
+@media screen and (min-width: 1008px) {
+ .has-text-centered-desktop {
+ text-align: center !important;
+ }
+}
+
+@media screen and (min-width: 1008px) and (max-width: 1199px) {
+ .has-text-centered-desktop-only {
+ text-align: center !important;
+ }
+}
+
+@media screen and (min-width: 1200px) {
+ .has-text-centered-widescreen {
+ text-align: center !important;
+ }
+}
+
+@media screen and (min-width: 1200px) and (max-width: 1391px) {
+ .has-text-centered-widescreen-only {
+ text-align: center !important;
+ }
+}
+
+@media screen and (min-width: 1392px) {
+ .has-text-centered-fullhd {
+ text-align: center !important;
+ }
+}
+
+.has-text-left {
+ text-align: left !important;
+}
+
+@media screen and (max-width: 768px) {
+ .has-text-left-mobile {
+ text-align: left !important;
+ }
+}
+
+@media screen and (min-width: 769px), print {
+ .has-text-left-tablet {
+ text-align: left !important;
+ }
+}
+
+@media screen and (min-width: 769px) and (max-width: 1007px) {
+ .has-text-left-tablet-only {
+ text-align: left !important;
+ }
+}
+
+@media screen and (max-width: 1007px) {
+ .has-text-left-touch {
+ text-align: left !important;
+ }
+}
+
+@media screen and (min-width: 1008px) {
+ .has-text-left-desktop {
+ text-align: left !important;
+ }
+}
+
+@media screen and (min-width: 1008px) and (max-width: 1199px) {
+ .has-text-left-desktop-only {
+ text-align: left !important;
+ }
+}
+
+@media screen and (min-width: 1200px) {
+ .has-text-left-widescreen {
+ text-align: left !important;
+ }
+}
+
+@media screen and (min-width: 1200px) and (max-width: 1391px) {
+ .has-text-left-widescreen-only {
+ text-align: left !important;
+ }
+}
+
+@media screen and (min-width: 1392px) {
+ .has-text-left-fullhd {
+ text-align: left !important;
+ }
+}
+
+.has-text-right {
+ text-align: right !important;
+}
+
+@media screen and (max-width: 768px) {
+ .has-text-right-mobile {
+ text-align: right !important;
+ }
+}
+
+@media screen and (min-width: 769px), print {
+ .has-text-right-tablet {
+ text-align: right !important;
+ }
+}
+
+@media screen and (min-width: 769px) and (max-width: 1007px) {
+ .has-text-right-tablet-only {
+ text-align: right !important;
+ }
+}
+
+@media screen and (max-width: 1007px) {
+ .has-text-right-touch {
+ text-align: right !important;
+ }
+}
+
+@media screen and (min-width: 1008px) {
+ .has-text-right-desktop {
+ text-align: right !important;
+ }
+}
+
+@media screen and (min-width: 1008px) and (max-width: 1199px) {
+ .has-text-right-desktop-only {
+ text-align: right !important;
+ }
+}
+
+@media screen and (min-width: 1200px) {
+ .has-text-right-widescreen {
+ text-align: right !important;
+ }
+}
+
+@media screen and (min-width: 1200px) and (max-width: 1391px) {
+ .has-text-right-widescreen-only {
+ text-align: right !important;
+ }
+}
+
+@media screen and (min-width: 1392px) {
+ .has-text-right-fullhd {
+ text-align: right !important;
+ }
+}
+
+.is-capitalized {
+ text-transform: capitalize !important;
+}
+
+.is-lowercase {
+ text-transform: lowercase !important;
+}
+
+.is-uppercase {
+ text-transform: uppercase !important;
+}
+
+.has-text-white {
+ color: white !important;
+}
+
+a.has-text-white:hover, a.has-text-white:focus {
+ color: #e6e6e6 !important;
+}
+
+.has-text-black {
+ color: #0a0a0a !important;
+}
+
+a.has-text-black:hover, a.has-text-black:focus {
+ color: black !important;
+}
+
+.has-text-light {
+ color: whitesmoke !important;
+}
+
+a.has-text-light:hover, a.has-text-light:focus {
+ color: #dbdbdb !important;
+}
+
+.has-text-dark {
+ color: #363636 !important;
+}
+
+a.has-text-dark:hover, a.has-text-dark:focus {
+ color: #1c1c1c !important;
+}
+
+.has-text-primary {
+ color: #00d1b2 !important;
+}
+
+a.has-text-primary:hover, a.has-text-primary:focus {
+ color: #009e86 !important;
+}
+
+.has-text-info {
+ color: #3273dc !important;
+}
+
+a.has-text-info:hover, a.has-text-info:focus {
+ color: #205bbc !important;
+}
+
+.has-text-success {
+ color: #23d160 !important;
+}
+
+a.has-text-success:hover, a.has-text-success:focus {
+ color: #1ca64c !important;
+}
+
+.has-text-warning {
+ color: #ffdd57 !important;
+}
+
+a.has-text-warning:hover, a.has-text-warning:focus {
+ color: #ffd324 !important;
+}
+
+.has-text-danger {
+ color: #ff3860 !important;
+}
+
+a.has-text-danger:hover, a.has-text-danger:focus {
+ color: #ff0537 !important;
+}
+
+.has-text-black-bis {
+ color: #121212 !important;
+}
+
+.has-text-black-ter {
+ color: #242424 !important;
+}
+
+.has-text-grey-darker {
+ color: #363636 !important;
+}
+
+.has-text-grey-dark {
+ color: #4a4a4a !important;
+}
+
+.has-text-grey {
+ color: #7a7a7a !important;
+}
+
+.has-text-grey-light {
+ color: #b5b5b5 !important;
+}
+
+.has-text-grey-lighter {
+ color: #dbdbdb !important;
+}
+
+.has-text-white-ter {
+ color: whitesmoke !important;
+}
+
+.has-text-white-bis {
+ color: #fafafa !important;
+}
+
+.is-block {
+ display: block !important;
+}
+
+@media screen and (max-width: 768px) {
+ .is-block-mobile {
+ display: block !important;
+ }
+}
+
+@media screen and (min-width: 769px), print {
+ .is-block-tablet {
+ display: block !important;
+ }
+}
+
+@media screen and (min-width: 769px) and (max-width: 1007px) {
+ .is-block-tablet-only {
+ display: block !important;
+ }
+}
+
+@media screen and (max-width: 1007px) {
+ .is-block-touch {
+ display: block !important;
+ }
+}
+
+@media screen and (min-width: 1008px) {
+ .is-block-desktop {
+ display: block !important;
+ }
+}
+
+@media screen and (min-width: 1008px) and (max-width: 1199px) {
+ .is-block-desktop-only {
+ display: block !important;
+ }
+}
+
+@media screen and (min-width: 1200px) {
+ .is-block-widescreen {
+ display: block !important;
+ }
+}
+
+@media screen and (min-width: 1200px) and (max-width: 1391px) {
+ .is-block-widescreen-only {
+ display: block !important;
+ }
+}
+
+@media screen and (min-width: 1392px) {
+ .is-block-fullhd {
+ display: block !important;
+ }
+}
+
+.is-flex {
+ display: -webkit-box !important;
+ display: -ms-flexbox !important;
+ display: flex !important;
+}
+
+@media screen and (max-width: 768px) {
+ .is-flex-mobile {
+ display: -webkit-box !important;
+ display: -ms-flexbox !important;
+ display: flex !important;
+ }
+}
+
+@media screen and (min-width: 769px), print {
+ .is-flex-tablet {
+ display: -webkit-box !important;
+ display: -ms-flexbox !important;
+ display: flex !important;
+ }
+}
+
+@media screen and (min-width: 769px) and (max-width: 1007px) {
+ .is-flex-tablet-only {
+ display: -webkit-box !important;
+ display: -ms-flexbox !important;
+ display: flex !important;
+ }
+}
+
+@media screen and (max-width: 1007px) {
+ .is-flex-touch {
+ display: -webkit-box !important;
+ display: -ms-flexbox !important;
+ display: flex !important;
+ }
+}
+
+@media screen and (min-width: 1008px) {
+ .is-flex-desktop {
+ display: -webkit-box !important;
+ display: -ms-flexbox !important;
+ display: flex !important;
+ }
+}
+
+@media screen and (min-width: 1008px) and (max-width: 1199px) {
+ .is-flex-desktop-only {
+ display: -webkit-box !important;
+ display: -ms-flexbox !important;
+ display: flex !important;
+ }
+}
+
+@media screen and (min-width: 1200px) {
+ .is-flex-widescreen {
+ display: -webkit-box !important;
+ display: -ms-flexbox !important;
+ display: flex !important;
+ }
+}
+
+@media screen and (min-width: 1200px) and (max-width: 1391px) {
+ .is-flex-widescreen-only {
+ display: -webkit-box !important;
+ display: -ms-flexbox !important;
+ display: flex !important;
+ }
+}
+
+@media screen and (min-width: 1392px) {
+ .is-flex-fullhd {
+ display: -webkit-box !important;
+ display: -ms-flexbox !important;
+ display: flex !important;
+ }
+}
+
+.is-inline {
+ display: inline !important;
+}
+
+@media screen and (max-width: 768px) {
+ .is-inline-mobile {
+ display: inline !important;
+ }
+}
+
+@media screen and (min-width: 769px), print {
+ .is-inline-tablet {
+ display: inline !important;
+ }
+}
+
+@media screen and (min-width: 769px) and (max-width: 1007px) {
+ .is-inline-tablet-only {
+ display: inline !important;
+ }
+}
+
+@media screen and (max-width: 1007px) {
+ .is-inline-touch {
+ display: inline !important;
+ }
+}
+
+@media screen and (min-width: 1008px) {
+ .is-inline-desktop {
+ display: inline !important;
+ }
+}
+
+@media screen and (min-width: 1008px) and (max-width: 1199px) {
+ .is-inline-desktop-only {
+ display: inline !important;
+ }
+}
+
+@media screen and (min-width: 1200px) {
+ .is-inline-widescreen {
+ display: inline !important;
+ }
+}
+
+@media screen and (min-width: 1200px) and (max-width: 1391px) {
+ .is-inline-widescreen-only {
+ display: inline !important;
+ }
+}
+
+@media screen and (min-width: 1392px) {
+ .is-inline-fullhd {
+ display: inline !important;
+ }
+}
+
+.is-inline-block {
+ display: inline-block !important;
+}
+
+@media screen and (max-width: 768px) {
+ .is-inline-block-mobile {
+ display: inline-block !important;
+ }
+}
+
+@media screen and (min-width: 769px), print {
+ .is-inline-block-tablet {
+ display: inline-block !important;
+ }
+}
+
+@media screen and (min-width: 769px) and (max-width: 1007px) {
+ .is-inline-block-tablet-only {
+ display: inline-block !important;
+ }
+}
+
+@media screen and (max-width: 1007px) {
+ .is-inline-block-touch {
+ display: inline-block !important;
+ }
+}
+
+@media screen and (min-width: 1008px) {
+ .is-inline-block-desktop {
+ display: inline-block !important;
+ }
+}
+
+@media screen and (min-width: 1008px) and (max-width: 1199px) {
+ .is-inline-block-desktop-only {
+ display: inline-block !important;
+ }
+}
+
+@media screen and (min-width: 1200px) {
+ .is-inline-block-widescreen {
+ display: inline-block !important;
+ }
+}
+
+@media screen and (min-width: 1200px) and (max-width: 1391px) {
+ .is-inline-block-widescreen-only {
+ display: inline-block !important;
+ }
+}
+
+@media screen and (min-width: 1392px) {
+ .is-inline-block-fullhd {
+ display: inline-block !important;
+ }
+}
+
+.is-inline-flex {
+ display: -webkit-inline-box !important;
+ display: -ms-inline-flexbox !important;
+ display: inline-flex !important;
+}
+
+@media screen and (max-width: 768px) {
+ .is-inline-flex-mobile {
+ display: -webkit-inline-box !important;
+ display: -ms-inline-flexbox !important;
+ display: inline-flex !important;
+ }
+}
+
+@media screen and (min-width: 769px), print {
+ .is-inline-flex-tablet {
+ display: -webkit-inline-box !important;
+ display: -ms-inline-flexbox !important;
+ display: inline-flex !important;
+ }
+}
+
+@media screen and (min-width: 769px) and (max-width: 1007px) {
+ .is-inline-flex-tablet-only {
+ display: -webkit-inline-box !important;
+ display: -ms-inline-flexbox !important;
+ display: inline-flex !important;
+ }
+}
+
+@media screen and (max-width: 1007px) {
+ .is-inline-flex-touch {
+ display: -webkit-inline-box !important;
+ display: -ms-inline-flexbox !important;
+ display: inline-flex !important;
+ }
+}
+
+@media screen and (min-width: 1008px) {
+ .is-inline-flex-desktop {
+ display: -webkit-inline-box !important;
+ display: -ms-inline-flexbox !important;
+ display: inline-flex !important;
+ }
+}
+
+@media screen and (min-width: 1008px) and (max-width: 1199px) {
+ .is-inline-flex-desktop-only {
+ display: -webkit-inline-box !important;
+ display: -ms-inline-flexbox !important;
+ display: inline-flex !important;
+ }
+}
+
+@media screen and (min-width: 1200px) {
+ .is-inline-flex-widescreen {
+ display: -webkit-inline-box !important;
+ display: -ms-inline-flexbox !important;
+ display: inline-flex !important;
+ }
+}
+
+@media screen and (min-width: 1200px) and (max-width: 1391px) {
+ .is-inline-flex-widescreen-only {
+ display: -webkit-inline-box !important;
+ display: -ms-inline-flexbox !important;
+ display: inline-flex !important;
+ }
+}
+
+@media screen and (min-width: 1392px) {
+ .is-inline-flex-fullhd {
+ display: -webkit-inline-box !important;
+ display: -ms-inline-flexbox !important;
+ display: inline-flex !important;
+ }
+}
+
+.is-hidden {
+ display: none !important;
+}
+
+@media screen and (max-width: 768px) {
+ .is-hidden-mobile {
+ display: none !important;
+ }
+}
+
+@media screen and (min-width: 769px), print {
+ .is-hidden-tablet {
+ display: none !important;
+ }
+}
+
+@media screen and (min-width: 769px) and (max-width: 1007px) {
+ .is-hidden-tablet-only {
+ display: none !important;
+ }
+}
+
+@media screen and (max-width: 1007px) {
+ .is-hidden-touch {
+ display: none !important;
+ }
+}
+
+@media screen and (min-width: 1008px) {
+ .is-hidden-desktop {
+ display: none !important;
+ }
+}
+
+@media screen and (min-width: 1008px) and (max-width: 1199px) {
+ .is-hidden-desktop-only {
+ display: none !important;
+ }
+}
+
+@media screen and (min-width: 1200px) {
+ .is-hidden-widescreen {
+ display: none !important;
+ }
+}
+
+@media screen and (min-width: 1200px) and (max-width: 1391px) {
+ .is-hidden-widescreen-only {
+ display: none !important;
+ }
+}
+
+@media screen and (min-width: 1392px) {
+ .is-hidden-fullhd {
+ display: none !important;
+ }
+}
+
+.is-marginless {
+ margin: 0 !important;
+}
+
+.is-paddingless {
+ padding: 0 !important;
+}
+
+.is-radiusless {
+ border-radius: 0 !important;
+}
+
+.is-shadowless {
+ -webkit-box-shadow: none !important;
+ box-shadow: none !important;
+}
+
+.is-unselectable {
+ -webkit-touch-callout: none;
+ -webkit-user-select: none;
+ -moz-user-select: none;
+ -ms-user-select: none;
+ user-select: none;
+}
+
+.box {
+ background-color: white;
+ border-radius: 5px;
+ -webkit-box-shadow: 0 2px 3px rgba(10, 10, 10, 0.1), 0 0 0 1px rgba(10, 10, 10, 0.1);
+ box-shadow: 0 2px 3px rgba(10, 10, 10, 0.1), 0 0 0 1px rgba(10, 10, 10, 0.1);
+ color: #4a4a4a;
+ display: block;
+ padding: 1.25rem;
+}
+
+.box:not(:last-child) {
+ margin-bottom: 1.5rem;
+}
+
+a.box:hover, a.box:focus {
+ -webkit-box-shadow: 0 2px 3px rgba(10, 10, 10, 0.1), 0 0 0 1px #00d1b2;
+ box-shadow: 0 2px 3px rgba(10, 10, 10, 0.1), 0 0 0 1px #00d1b2;
+}
+
+a.box:active {
+ -webkit-box-shadow: inset 0 1px 2px rgba(10, 10, 10, 0.2), 0 0 0 1px #00d1b2;
+ box-shadow: inset 0 1px 2px rgba(10, 10, 10, 0.2), 0 0 0 1px #00d1b2;
+}
+
+.button {
+ -moz-appearance: none;
+ -webkit-appearance: none;
+ -webkit-box-align: center;
+ -ms-flex-align: center;
+ align-items: center;
+ border: 1px solid transparent;
+ border-radius: 3px;
+ -webkit-box-shadow: none;
+ box-shadow: none;
+ display: -webkit-inline-box;
+ display: -ms-inline-flexbox;
+ display: inline-flex;
+ font-size: 1rem;
+ height: 2.25em;
+ -webkit-box-pack: start;
+ -ms-flex-pack: start;
+ justify-content: flex-start;
+ line-height: 1.5;
+ padding-bottom: calc(0.375em - 1px);
+ padding-left: calc(0.625em - 1px);
+ padding-right: calc(0.625em - 1px);
+ padding-top: calc(0.375em - 1px);
+ position: relative;
+ vertical-align: top;
+ -webkit-touch-callout: none;
+ -webkit-user-select: none;
+ -moz-user-select: none;
+ -ms-user-select: none;
+ user-select: none;
+ background-color: white;
+ border-color: #dbdbdb;
+ color: #363636;
+ cursor: pointer;
+ -webkit-box-pack: center;
+ -ms-flex-pack: center;
+ justify-content: center;
+ padding-left: 0.75em;
+ padding-right: 0.75em;
+ text-align: center;
+ white-space: nowrap;
+}
+
+.button:focus, .button.is-focused, .button:active, .button.is-active {
+ outline: none;
+}
+
+.button[disabled] {
+ cursor: not-allowed;
+}
+
+.button strong {
+ color: inherit;
+}
+
+.button .icon, .button .icon.is-small, .button .icon.is-medium, .button .icon.is-large {
+ height: 1.5em;
+ width: 1.5em;
+}
+
+.button .icon:first-child:not(:last-child) {
+ margin-left: calc(-0.375em - 1px);
+ margin-right: 0.1875em;
+}
+
+.button .icon:last-child:not(:first-child) {
+ margin-left: 0.1875em;
+ margin-right: calc(-0.375em - 1px);
+}
+
+.button .icon:first-child:last-child {
+ margin-left: calc(-0.375em - 1px);
+ margin-right: calc(-0.375em - 1px);
+}
+
+.button:hover, .button.is-hovered {
+ border-color: #b5b5b5;
+ color: #363636;
+}
+
+.button:focus, .button.is-focused {
+ border-color: #00d1b2;
+ color: #363636;
+}
+
+.button:active, .button.is-active {
+ border-color: #4a4a4a;
+ -webkit-box-shadow: inset 0 1px 2px rgba(10, 10, 10, 0.2);
+ box-shadow: inset 0 1px 2px rgba(10, 10, 10, 0.2);
+ color: #363636;
+}
+
+.button.is-link {
+ background-color: transparent;
+ border-color: transparent;
+ color: #4a4a4a;
+ text-decoration: underline;
+}
+
+.button.is-link:hover, .button.is-link.is-hovered, .button.is-link:focus, .button.is-link.is-focused, .button.is-link:active, .button.is-link.is-active {
+ background-color: whitesmoke;
+ color: #363636;
+}
+
+.button.is-link[disabled] {
+ background-color: transparent;
+ border-color: transparent;
+ -webkit-box-shadow: none;
+ box-shadow: none;
+}
+
+.button.is-white {
+ background-color: white;
+ border-color: transparent;
+ color: #0a0a0a;
+}
+
+.button.is-white:hover, .button.is-white.is-hovered {
+ background-color: #f9f9f9;
+ border-color: transparent;
+ color: #0a0a0a;
+}
+
+.button.is-white:focus, .button.is-white.is-focused {
+ border-color: transparent;
+ -webkit-box-shadow: 0 0 0.5em rgba(255, 255, 255, 0.25);
+ box-shadow: 0 0 0.5em rgba(255, 255, 255, 0.25);
+ color: #0a0a0a;
+}
+
+.button.is-white:active, .button.is-white.is-active {
+ background-color: #f2f2f2;
+ border-color: transparent;
+ -webkit-box-shadow: inset 0 1px 2px rgba(10, 10, 10, 0.2);
+ box-shadow: inset 0 1px 2px rgba(10, 10, 10, 0.2);
+ color: #0a0a0a;
+}
+
+.button.is-white[disabled] {
+ background-color: white;
+ border-color: transparent;
+ -webkit-box-shadow: none;
+ box-shadow: none;
+}
+
+.button.is-white.is-inverted {
+ background-color: #0a0a0a;
+ color: white;
+}
+
+.button.is-white.is-inverted:hover {
+ background-color: black;
+}
+
+.button.is-white.is-inverted[disabled] {
+ background-color: #0a0a0a;
+ border-color: transparent;
+ -webkit-box-shadow: none;
+ box-shadow: none;
+ color: white;
+}
+
+.button.is-white.is-loading:after {
+ border-color: transparent transparent #0a0a0a #0a0a0a !important;
+}
+
+.button.is-white.is-outlined {
+ background-color: transparent;
+ border-color: white;
+ color: white;
+}
+
+.button.is-white.is-outlined:hover, .button.is-white.is-outlined:focus {
+ background-color: white;
+ border-color: white;
+ color: #0a0a0a;
+}
+
+.button.is-white.is-outlined.is-loading:after {
+ border-color: transparent transparent white white !important;
+}
+
+.button.is-white.is-outlined[disabled] {
+ background-color: transparent;
+ border-color: white;
+ -webkit-box-shadow: none;
+ box-shadow: none;
+ color: white;
+}
+
+.button.is-white.is-inverted.is-outlined {
+ background-color: transparent;
+ border-color: #0a0a0a;
+ color: #0a0a0a;
+}
+
+.button.is-white.is-inverted.is-outlined:hover, .button.is-white.is-inverted.is-outlined:focus {
+ background-color: #0a0a0a;
+ color: white;
+}
+
+.button.is-white.is-inverted.is-outlined[disabled] {
+ background-color: transparent;
+ border-color: #0a0a0a;
+ -webkit-box-shadow: none;
+ box-shadow: none;
+ color: #0a0a0a;
+}
+
+.button.is-black {
+ background-color: #0a0a0a;
+ border-color: transparent;
+ color: white;
+}
+
+.button.is-black:hover, .button.is-black.is-hovered {
+ background-color: #040404;
+ border-color: transparent;
+ color: white;
+}
+
+.button.is-black:focus, .button.is-black.is-focused {
+ border-color: transparent;
+ -webkit-box-shadow: 0 0 0.5em rgba(10, 10, 10, 0.25);
+ box-shadow: 0 0 0.5em rgba(10, 10, 10, 0.25);
+ color: white;
+}
+
+.button.is-black:active, .button.is-black.is-active {
+ background-color: black;
+ border-color: transparent;
+ -webkit-box-shadow: inset 0 1px 2px rgba(10, 10, 10, 0.2);
+ box-shadow: inset 0 1px 2px rgba(10, 10, 10, 0.2);
+ color: white;
+}
+
+.button.is-black[disabled] {
+ background-color: #0a0a0a;
+ border-color: transparent;
+ -webkit-box-shadow: none;
+ box-shadow: none;
+}
+
+.button.is-black.is-inverted {
+ background-color: white;
+ color: #0a0a0a;
+}
+
+.button.is-black.is-inverted:hover {
+ background-color: #f2f2f2;
+}
+
+.button.is-black.is-inverted[disabled] {
+ background-color: white;
+ border-color: transparent;
+ -webkit-box-shadow: none;
+ box-shadow: none;
+ color: #0a0a0a;
+}
+
+.button.is-black.is-loading:after {
+ border-color: transparent transparent white white !important;
+}
+
+.button.is-black.is-outlined {
+ background-color: transparent;
+ border-color: #0a0a0a;
+ color: #0a0a0a;
+}
+
+.button.is-black.is-outlined:hover, .button.is-black.is-outlined:focus {
+ background-color: #0a0a0a;
+ border-color: #0a0a0a;
+ color: white;
+}
+
+.button.is-black.is-outlined.is-loading:after {
+ border-color: transparent transparent #0a0a0a #0a0a0a !important;
+}
+
+.button.is-black.is-outlined[disabled] {
+ background-color: transparent;
+ border-color: #0a0a0a;
+ -webkit-box-shadow: none;
+ box-shadow: none;
+ color: #0a0a0a;
+}
+
+.button.is-black.is-inverted.is-outlined {
+ background-color: transparent;
+ border-color: white;
+ color: white;
+}
+
+.button.is-black.is-inverted.is-outlined:hover, .button.is-black.is-inverted.is-outlined:focus {
+ background-color: white;
+ color: #0a0a0a;
+}
+
+.button.is-black.is-inverted.is-outlined[disabled] {
+ background-color: transparent;
+ border-color: white;
+ -webkit-box-shadow: none;
+ box-shadow: none;
+ color: white;
+}
+
+.button.is-light {
+ background-color: whitesmoke;
+ border-color: transparent;
+ color: #363636;
+}
+
+.button.is-light:hover, .button.is-light.is-hovered {
+ background-color: #eeeeee;
+ border-color: transparent;
+ color: #363636;
+}
+
+.button.is-light:focus, .button.is-light.is-focused {
+ border-color: transparent;
+ -webkit-box-shadow: 0 0 0.5em rgba(245, 245, 245, 0.25);
+ box-shadow: 0 0 0.5em rgba(245, 245, 245, 0.25);
+ color: #363636;
+}
+
+.button.is-light:active, .button.is-light.is-active {
+ background-color: #e8e8e8;
+ border-color: transparent;
+ -webkit-box-shadow: inset 0 1px 2px rgba(10, 10, 10, 0.2);
+ box-shadow: inset 0 1px 2px rgba(10, 10, 10, 0.2);
+ color: #363636;
+}
+
+.button.is-light[disabled] {
+ background-color: whitesmoke;
+ border-color: transparent;
+ -webkit-box-shadow: none;
+ box-shadow: none;
+}
+
+.button.is-light.is-inverted {
+ background-color: #363636;
+ color: whitesmoke;
+}
+
+.button.is-light.is-inverted:hover {
+ background-color: #292929;
+}
+
+.button.is-light.is-inverted[disabled] {
+ background-color: #363636;
+ border-color: transparent;
+ -webkit-box-shadow: none;
+ box-shadow: none;
+ color: whitesmoke;
+}
+
+.button.is-light.is-loading:after {
+ border-color: transparent transparent #363636 #363636 !important;
+}
+
+.button.is-light.is-outlined {
+ background-color: transparent;
+ border-color: whitesmoke;
+ color: whitesmoke;
+}
+
+.button.is-light.is-outlined:hover, .button.is-light.is-outlined:focus {
+ background-color: whitesmoke;
+ border-color: whitesmoke;
+ color: #363636;
+}
+
+.button.is-light.is-outlined.is-loading:after {
+ border-color: transparent transparent whitesmoke whitesmoke !important;
+}
+
+.button.is-light.is-outlined[disabled] {
+ background-color: transparent;
+ border-color: whitesmoke;
+ -webkit-box-shadow: none;
+ box-shadow: none;
+ color: whitesmoke;
+}
+
+.button.is-light.is-inverted.is-outlined {
+ background-color: transparent;
+ border-color: #363636;
+ color: #363636;
+}
+
+.button.is-light.is-inverted.is-outlined:hover, .button.is-light.is-inverted.is-outlined:focus {
+ background-color: #363636;
+ color: whitesmoke;
+}
+
+.button.is-light.is-inverted.is-outlined[disabled] {
+ background-color: transparent;
+ border-color: #363636;
+ -webkit-box-shadow: none;
+ box-shadow: none;
+ color: #363636;
+}
+
+.button.is-dark {
+ background-color: #363636;
+ border-color: transparent;
+ color: whitesmoke;
+}
+
+.button.is-dark:hover, .button.is-dark.is-hovered {
+ background-color: #2f2f2f;
+ border-color: transparent;
+ color: whitesmoke;
+}
+
+.button.is-dark:focus, .button.is-dark.is-focused {
+ border-color: transparent;
+ -webkit-box-shadow: 0 0 0.5em rgba(54, 54, 54, 0.25);
+ box-shadow: 0 0 0.5em rgba(54, 54, 54, 0.25);
+ color: whitesmoke;
+}
+
+.button.is-dark:active, .button.is-dark.is-active {
+ background-color: #292929;
+ border-color: transparent;
+ -webkit-box-shadow: inset 0 1px 2px rgba(10, 10, 10, 0.2);
+ box-shadow: inset 0 1px 2px rgba(10, 10, 10, 0.2);
+ color: whitesmoke;
+}
+
+.button.is-dark[disabled] {
+ background-color: #363636;
+ border-color: transparent;
+ -webkit-box-shadow: none;
+ box-shadow: none;
+}
+
+.button.is-dark.is-inverted {
+ background-color: whitesmoke;
+ color: #363636;
+}
+
+.button.is-dark.is-inverted:hover {
+ background-color: #e8e8e8;
+}
+
+.button.is-dark.is-inverted[disabled] {
+ background-color: whitesmoke;
+ border-color: transparent;
+ -webkit-box-shadow: none;
+ box-shadow: none;
+ color: #363636;
+}
+
+.button.is-dark.is-loading:after {
+ border-color: transparent transparent whitesmoke whitesmoke !important;
+}
+
+.button.is-dark.is-outlined {
+ background-color: transparent;
+ border-color: #363636;
+ color: #363636;
+}
+
+.button.is-dark.is-outlined:hover, .button.is-dark.is-outlined:focus {
+ background-color: #363636;
+ border-color: #363636;
+ color: whitesmoke;
+}
+
+.button.is-dark.is-outlined.is-loading:after {
+ border-color: transparent transparent #363636 #363636 !important;
+}
+
+.button.is-dark.is-outlined[disabled] {
+ background-color: transparent;
+ border-color: #363636;
+ -webkit-box-shadow: none;
+ box-shadow: none;
+ color: #363636;
+}
+
+.button.is-dark.is-inverted.is-outlined {
+ background-color: transparent;
+ border-color: whitesmoke;
+ color: whitesmoke;
+}
+
+.button.is-dark.is-inverted.is-outlined:hover, .button.is-dark.is-inverted.is-outlined:focus {
+ background-color: whitesmoke;
+ color: #363636;
+}
+
+.button.is-dark.is-inverted.is-outlined[disabled] {
+ background-color: transparent;
+ border-color: whitesmoke;
+ -webkit-box-shadow: none;
+ box-shadow: none;
+ color: whitesmoke;
+}
+
+.button.is-primary {
+ background-color: #00d1b2;
+ border-color: transparent;
+ color: #fff;
+}
+
+.button.is-primary:hover, .button.is-primary.is-hovered {
+ background-color: #00c4a7;
+ border-color: transparent;
+ color: #fff;
+}
+
+.button.is-primary:focus, .button.is-primary.is-focused {
+ border-color: transparent;
+ -webkit-box-shadow: 0 0 0.5em rgba(0, 209, 178, 0.25);
+ box-shadow: 0 0 0.5em rgba(0, 209, 178, 0.25);
+ color: #fff;
+}
+
+.button.is-primary:active, .button.is-primary.is-active {
+ background-color: #00b89c;
+ border-color: transparent;
+ -webkit-box-shadow: inset 0 1px 2px rgba(10, 10, 10, 0.2);
+ box-shadow: inset 0 1px 2px rgba(10, 10, 10, 0.2);
+ color: #fff;
+}
+
+.button.is-primary[disabled] {
+ background-color: #00d1b2;
+ border-color: transparent;
+ -webkit-box-shadow: none;
+ box-shadow: none;
+}
+
+.button.is-primary.is-inverted {
+ background-color: #fff;
+ color: #00d1b2;
+}
+
+.button.is-primary.is-inverted:hover {
+ background-color: #f2f2f2;
+}
+
+.button.is-primary.is-inverted[disabled] {
+ background-color: #fff;
+ border-color: transparent;
+ -webkit-box-shadow: none;
+ box-shadow: none;
+ color: #00d1b2;
+}
+
+.button.is-primary.is-loading:after {
+ border-color: transparent transparent #fff #fff !important;
+}
+
+.button.is-primary.is-outlined {
+ background-color: transparent;
+ border-color: #00d1b2;
+ color: #00d1b2;
+}
+
+.button.is-primary.is-outlined:hover, .button.is-primary.is-outlined:focus {
+ background-color: #00d1b2;
+ border-color: #00d1b2;
+ color: #fff;
+}
+
+.button.is-primary.is-outlined.is-loading:after {
+ border-color: transparent transparent #00d1b2 #00d1b2 !important;
+}
+
+.button.is-primary.is-outlined[disabled] {
+ background-color: transparent;
+ border-color: #00d1b2;
+ -webkit-box-shadow: none;
+ box-shadow: none;
+ color: #00d1b2;
+}
+
+.button.is-primary.is-inverted.is-outlined {
+ background-color: transparent;
+ border-color: #fff;
+ color: #fff;
+}
+
+.button.is-primary.is-inverted.is-outlined:hover, .button.is-primary.is-inverted.is-outlined:focus {
+ background-color: #fff;
+ color: #00d1b2;
+}
+
+.button.is-primary.is-inverted.is-outlined[disabled] {
+ background-color: transparent;
+ border-color: #fff;
+ -webkit-box-shadow: none;
+ box-shadow: none;
+ color: #fff;
+}
+
+.button.is-info {
+ background-color: #3273dc;
+ border-color: transparent;
+ color: #fff;
+}
+
+.button.is-info:hover, .button.is-info.is-hovered {
+ background-color: #276cda;
+ border-color: transparent;
+ color: #fff;
+}
+
+.button.is-info:focus, .button.is-info.is-focused {
+ border-color: transparent;
+ -webkit-box-shadow: 0 0 0.5em rgba(50, 115, 220, 0.25);
+ box-shadow: 0 0 0.5em rgba(50, 115, 220, 0.25);
+ color: #fff;
+}
+
+.button.is-info:active, .button.is-info.is-active {
+ background-color: #2366d1;
+ border-color: transparent;
+ -webkit-box-shadow: inset 0 1px 2px rgba(10, 10, 10, 0.2);
+ box-shadow: inset 0 1px 2px rgba(10, 10, 10, 0.2);
+ color: #fff;
+}
+
+.button.is-info[disabled] {
+ background-color: #3273dc;
+ border-color: transparent;
+ -webkit-box-shadow: none;
+ box-shadow: none;
+}
+
+.button.is-info.is-inverted {
+ background-color: #fff;
+ color: #3273dc;
+}
+
+.button.is-info.is-inverted:hover {
+ background-color: #f2f2f2;
+}
+
+.button.is-info.is-inverted[disabled] {
+ background-color: #fff;
+ border-color: transparent;
+ -webkit-box-shadow: none;
+ box-shadow: none;
+ color: #3273dc;
+}
+
+.button.is-info.is-loading:after {
+ border-color: transparent transparent #fff #fff !important;
+}
+
+.button.is-info.is-outlined {
+ background-color: transparent;
+ border-color: #3273dc;
+ color: #3273dc;
+}
+
+.button.is-info.is-outlined:hover, .button.is-info.is-outlined:focus {
+ background-color: #3273dc;
+ border-color: #3273dc;
+ color: #fff;
+}
+
+.button.is-info.is-outlined.is-loading:after {
+ border-color: transparent transparent #3273dc #3273dc !important;
+}
+
+.button.is-info.is-outlined[disabled] {
+ background-color: transparent;
+ border-color: #3273dc;
+ -webkit-box-shadow: none;
+ box-shadow: none;
+ color: #3273dc;
+}
+
+.button.is-info.is-inverted.is-outlined {
+ background-color: transparent;
+ border-color: #fff;
+ color: #fff;
+}
+
+.button.is-info.is-inverted.is-outlined:hover, .button.is-info.is-inverted.is-outlined:focus {
+ background-color: #fff;
+ color: #3273dc;
+}
+
+.button.is-info.is-inverted.is-outlined[disabled] {
+ background-color: transparent;
+ border-color: #fff;
+ -webkit-box-shadow: none;
+ box-shadow: none;
+ color: #fff;
+}
+
+.button.is-success {
+ background-color: #23d160;
+ border-color: transparent;
+ color: #fff;
+}
+
+.button.is-success:hover, .button.is-success.is-hovered {
+ background-color: #22c65b;
+ border-color: transparent;
+ color: #fff;
+}
+
+.button.is-success:focus, .button.is-success.is-focused {
+ border-color: transparent;
+ -webkit-box-shadow: 0 0 0.5em rgba(35, 209, 96, 0.25);
+ box-shadow: 0 0 0.5em rgba(35, 209, 96, 0.25);
+ color: #fff;
+}
+
+.button.is-success:active, .button.is-success.is-active {
+ background-color: #20bc56;
+ border-color: transparent;
+ -webkit-box-shadow: inset 0 1px 2px rgba(10, 10, 10, 0.2);
+ box-shadow: inset 0 1px 2px rgba(10, 10, 10, 0.2);
+ color: #fff;
+}
+
+.button.is-success[disabled] {
+ background-color: #23d160;
+ border-color: transparent;
+ -webkit-box-shadow: none;
+ box-shadow: none;
+}
+
+.button.is-success.is-inverted {
+ background-color: #fff;
+ color: #23d160;
+}
+
+.button.is-success.is-inverted:hover {
+ background-color: #f2f2f2;
+}
+
+.button.is-success.is-inverted[disabled] {
+ background-color: #fff;
+ border-color: transparent;
+ -webkit-box-shadow: none;
+ box-shadow: none;
+ color: #23d160;
+}
+
+.button.is-success.is-loading:after {
+ border-color: transparent transparent #fff #fff !important;
+}
+
+.button.is-success.is-outlined {
+ background-color: transparent;
+ border-color: #23d160;
+ color: #23d160;
+}
+
+.button.is-success.is-outlined:hover, .button.is-success.is-outlined:focus {
+ background-color: #23d160;
+ border-color: #23d160;
+ color: #fff;
+}
+
+.button.is-success.is-outlined.is-loading:after {
+ border-color: transparent transparent #23d160 #23d160 !important;
+}
+
+.button.is-success.is-outlined[disabled] {
+ background-color: transparent;
+ border-color: #23d160;
+ -webkit-box-shadow: none;
+ box-shadow: none;
+ color: #23d160;
+}
+
+.button.is-success.is-inverted.is-outlined {
+ background-color: transparent;
+ border-color: #fff;
+ color: #fff;
+}
+
+.button.is-success.is-inverted.is-outlined:hover, .button.is-success.is-inverted.is-outlined:focus {
+ background-color: #fff;
+ color: #23d160;
+}
+
+.button.is-success.is-inverted.is-outlined[disabled] {
+ background-color: transparent;
+ border-color: #fff;
+ -webkit-box-shadow: none;
+ box-shadow: none;
+ color: #fff;
+}
+
+.button.is-warning {
+ background-color: #ffdd57;
+ border-color: transparent;
+ color: rgba(0, 0, 0, 0.7);
+}
+
+.button.is-warning:hover, .button.is-warning.is-hovered {
+ background-color: #ffdb4a;
+ border-color: transparent;
+ color: rgba(0, 0, 0, 0.7);
+}
+
+.button.is-warning:focus, .button.is-warning.is-focused {
+ border-color: transparent;
+ -webkit-box-shadow: 0 0 0.5em rgba(255, 221, 87, 0.25);
+ box-shadow: 0 0 0.5em rgba(255, 221, 87, 0.25);
+ color: rgba(0, 0, 0, 0.7);
+}
+
+.button.is-warning:active, .button.is-warning.is-active {
+ background-color: #ffd83d;
+ border-color: transparent;
+ -webkit-box-shadow: inset 0 1px 2px rgba(10, 10, 10, 0.2);
+ box-shadow: inset 0 1px 2px rgba(10, 10, 10, 0.2);
+ color: rgba(0, 0, 0, 0.7);
+}
+
+.button.is-warning[disabled] {
+ background-color: #ffdd57;
+ border-color: transparent;
+ -webkit-box-shadow: none;
+ box-shadow: none;
+}
+
+.button.is-warning.is-inverted {
+ background-color: rgba(0, 0, 0, 0.7);
+ color: #ffdd57;
+}
+
+.button.is-warning.is-inverted:hover {
+ background-color: rgba(0, 0, 0, 0.7);
+}
+
+.button.is-warning.is-inverted[disabled] {
+ background-color: rgba(0, 0, 0, 0.7);
+ border-color: transparent;
+ -webkit-box-shadow: none;
+ box-shadow: none;
+ color: #ffdd57;
+}
+
+.button.is-warning.is-loading:after {
+ border-color: transparent transparent rgba(0, 0, 0, 0.7) rgba(0, 0, 0, 0.7) !important;
+}
+
+.button.is-warning.is-outlined {
+ background-color: transparent;
+ border-color: #ffdd57;
+ color: #ffdd57;
+}
+
+.button.is-warning.is-outlined:hover, .button.is-warning.is-outlined:focus {
+ background-color: #ffdd57;
+ border-color: #ffdd57;
+ color: rgba(0, 0, 0, 0.7);
+}
+
+.button.is-warning.is-outlined.is-loading:after {
+ border-color: transparent transparent #ffdd57 #ffdd57 !important;
+}
+
+.button.is-warning.is-outlined[disabled] {
+ background-color: transparent;
+ border-color: #ffdd57;
+ -webkit-box-shadow: none;
+ box-shadow: none;
+ color: #ffdd57;
+}
+
+.button.is-warning.is-inverted.is-outlined {
+ background-color: transparent;
+ border-color: rgba(0, 0, 0, 0.7);
+ color: rgba(0, 0, 0, 0.7);
+}
+
+.button.is-warning.is-inverted.is-outlined:hover, .button.is-warning.is-inverted.is-outlined:focus {
+ background-color: rgba(0, 0, 0, 0.7);
+ color: #ffdd57;
+}
+
+.button.is-warning.is-inverted.is-outlined[disabled] {
+ background-color: transparent;
+ border-color: rgba(0, 0, 0, 0.7);
+ -webkit-box-shadow: none;
+ box-shadow: none;
+ color: rgba(0, 0, 0, 0.7);
+}
+
+.button.is-danger {
+ background-color: #ff3860;
+ border-color: transparent;
+ color: #fff;
+}
+
+.button.is-danger:hover, .button.is-danger.is-hovered {
+ background-color: #ff2b56;
+ border-color: transparent;
+ color: #fff;
+}
+
+.button.is-danger:focus, .button.is-danger.is-focused {
+ border-color: transparent;
+ -webkit-box-shadow: 0 0 0.5em rgba(255, 56, 96, 0.25);
+ box-shadow: 0 0 0.5em rgba(255, 56, 96, 0.25);
+ color: #fff;
+}
+
+.button.is-danger:active, .button.is-danger.is-active {
+ background-color: #ff1f4b;
+ border-color: transparent;
+ -webkit-box-shadow: inset 0 1px 2px rgba(10, 10, 10, 0.2);
+ box-shadow: inset 0 1px 2px rgba(10, 10, 10, 0.2);
+ color: #fff;
+}
+
+.button.is-danger[disabled] {
+ background-color: #ff3860;
+ border-color: transparent;
+ -webkit-box-shadow: none;
+ box-shadow: none;
+}
+
+.button.is-danger.is-inverted {
+ background-color: #fff;
+ color: #ff3860;
+}
+
+.button.is-danger.is-inverted:hover {
+ background-color: #f2f2f2;
+}
+
+.button.is-danger.is-inverted[disabled] {
+ background-color: #fff;
+ border-color: transparent;
+ -webkit-box-shadow: none;
+ box-shadow: none;
+ color: #ff3860;
+}
+
+.button.is-danger.is-loading:after {
+ border-color: transparent transparent #fff #fff !important;
+}
+
+.button.is-danger.is-outlined {
+ background-color: transparent;
+ border-color: #ff3860;
+ color: #ff3860;
+}
+
+.button.is-danger.is-outlined:hover, .button.is-danger.is-outlined:focus {
+ background-color: #ff3860;
+ border-color: #ff3860;
+ color: #fff;
+}
+
+.button.is-danger.is-outlined.is-loading:after {
+ border-color: transparent transparent #ff3860 #ff3860 !important;
+}
+
+.button.is-danger.is-outlined[disabled] {
+ background-color: transparent;
+ border-color: #ff3860;
+ -webkit-box-shadow: none;
+ box-shadow: none;
+ color: #ff3860;
+}
+
+.button.is-danger.is-inverted.is-outlined {
+ background-color: transparent;
+ border-color: #fff;
+ color: #fff;
+}
+
+.button.is-danger.is-inverted.is-outlined:hover, .button.is-danger.is-inverted.is-outlined:focus {
+ background-color: #fff;
+ color: #ff3860;
+}
+
+.button.is-danger.is-inverted.is-outlined[disabled] {
+ background-color: transparent;
+ border-color: #fff;
+ -webkit-box-shadow: none;
+ box-shadow: none;
+ color: #fff;
+}
+
+.button.is-small {
+ border-radius: 2px;
+ font-size: 0.75rem;
+}
+
+.button.is-medium {
+ font-size: 1.25rem;
+}
+
+.button.is-large {
+ font-size: 1.5rem;
+}
+
+.button[disabled] {
+ background-color: white;
+ border-color: #dbdbdb;
+ -webkit-box-shadow: none;
+ box-shadow: none;
+ opacity: 0.5;
+}
+
+.button.is-fullwidth {
+ display: -webkit-box;
+ display: -ms-flexbox;
+ display: flex;
+ width: 100%;
+}
+
+.button.is-loading {
+ color: transparent !important;
+ pointer-events: none;
+}
+
+.button.is-loading:after {
+ -webkit-animation: spinAround 500ms infinite linear;
+ animation: spinAround 500ms infinite linear;
+ border: 2px solid #dbdbdb;
+ border-radius: 290486px;
+ border-right-color: transparent;
+ border-top-color: transparent;
+ content: "";
+ display: block;
+ height: 1em;
+ position: relative;
+ width: 1em;
+ position: absolute;
+ left: calc(50% - (1em / 2));
+ top: calc(50% - (1em / 2));
+ position: absolute !important;
+}
+
+.button.is-static {
+ background-color: whitesmoke;
+ border-color: #dbdbdb;
+ color: #7a7a7a;
+ -webkit-box-shadow: none;
+ box-shadow: none;
+ pointer-events: none;
+}
+
+.container {
+ margin: 0 auto;
+ position: relative;
+}
+
+@media screen and (min-width: 1068px) {
+ .container {
+ max-width: 960px;
+ width: 960px;
+ }
+ .container.is-fluid {
+ margin-left: 24px;
+ margin-right: 24px;
+ max-width: none;
+ width: auto;
+ }
+}
+
+@media screen and (max-width: 1259px) {
+ .container.is-widescreen {
+ max-width: 1152px;
+ width: auto;
+ }
+}
+
+@media screen and (max-width: 1451px) {
+ .container.is-fullhd {
+ max-width: 1344px;
+ width: auto;
+ }
+}
+
+@media screen and (min-width: 1260px) {
+ .container {
+ max-width: 1152px;
+ width: 1152px;
+ }
+}
+
+@media screen and (min-width: 1452px) {
+ .container {
+ max-width: 1344px;
+ width: 1344px;
+ }
+}
+
+.content:not(:last-child) {
+ margin-bottom: 1.5rem;
+}
+
+.content li + li {
+ margin-top: 0.25em;
+}
+
+.content p:not(:last-child),
+.content dl:not(:last-child),
+.content ol:not(:last-child),
+.content ul:not(:last-child),
+.content blockquote:not(:last-child),
+.content pre:not(:last-child),
+.content table:not(:last-child) {
+ margin-bottom: 1em;
+}
+
+.content h1,
+.content h2,
+.content h3,
+.content h4,
+.content h5,
+.content h6 {
+ color: #363636;
+ font-weight: 400;
+ line-height: 1.125;
+}
+
+.content h1 {
+ font-size: 2em;
+ margin-bottom: 0.5em;
+}
+
+.content h1:not(:first-child) {
+ margin-top: 1em;
+}
+
+.content h2 {
+ font-size: 1.75em;
+ margin-bottom: 0.5714em;
+}
+
+.content h2:not(:first-child) {
+ margin-top: 1.1428em;
+}
+
+.content h3 {
+ font-size: 1.5em;
+ margin-bottom: 0.6666em;
+}
+
+.content h3:not(:first-child) {
+ margin-top: 1.3333em;
+}
+
+.content h4 {
+ font-size: 1.25em;
+ margin-bottom: 0.8em;
+}
+
+.content h5 {
+ font-size: 1.125em;
+ margin-bottom: 0.8888em;
+}
+
+.content h6 {
+ font-size: 1em;
+ margin-bottom: 1em;
+}
+
+.content blockquote {
+ background-color: whitesmoke;
+ border-left: 5px solid #dbdbdb;
+ padding: 1.25em 1.5em;
+}
+
+.content ol {
+ list-style: decimal outside;
+ margin-left: 2em;
+ margin-top: 1em;
+}
+
+.content ul {
+ list-style: disc outside;
+ margin-left: 2em;
+ margin-top: 1em;
+}
+
+.content ul ul {
+ list-style-type: circle;
+ margin-top: 0.5em;
+}
+
+.content ul ul ul {
+ list-style-type: square;
+}
+
+.content dd {
+ margin-left: 2em;
+}
+
+.content figure {
+ margin: 2em;
+ text-align: center;
+}
+
+.content figure img {
+ display: inline-block;
+}
+
+.content figure figcaption {
+ font-style: italic;
+}
+
+.content pre {
+ -webkit-overflow-scrolling: touch;
+ overflow-x: auto;
+ padding: 1.25em 1.5em;
+ white-space: pre;
+ word-wrap: normal;
+}
+
+.content sup,
+.content sub {
+ font-size: 75%;
+}
+
+.content table {
+ width: 100%;
+}
+
+.content table td,
+.content table th {
+ border: 1px solid #dbdbdb;
+ border-width: 0 0 1px;
+ padding: 0.5em 0.75em;
+ vertical-align: top;
+}
+
+.content table th {
+ color: #363636;
+ text-align: left;
+}
+
+.content table tr:hover {
+ background-color: whitesmoke;
+}
+
+.content table thead td,
+.content table thead th {
+ border-width: 0 0 2px;
+ color: #363636;
+}
+
+.content table tfoot td,
+.content table tfoot th {
+ border-width: 2px 0 0;
+ color: #363636;
+}
+
+.content table tbody tr:last-child td,
+.content table tbody tr:last-child th {
+ border-bottom-width: 0;
+}
+
+.content.is-small {
+ font-size: 0.75rem;
+}
+
+.content.is-medium {
+ font-size: 1.25rem;
+}
+
+.content.is-large {
+ font-size: 1.5rem;
+}
+
+.input,
+.textarea {
+ -moz-appearance: none;
+ -webkit-appearance: none;
+ -webkit-box-align: center;
+ -ms-flex-align: center;
+ align-items: center;
+ border: 1px solid transparent;
+ border-radius: 3px;
+ -webkit-box-shadow: none;
+ box-shadow: none;
+ display: -webkit-inline-box;
+ display: -ms-inline-flexbox;
+ display: inline-flex;
+ font-size: 1rem;
+ height: 2.25em;
+ -webkit-box-pack: start;
+ -ms-flex-pack: start;
+ justify-content: flex-start;
+ line-height: 1.5;
+ padding-bottom: calc(0.375em - 1px);
+ padding-left: calc(0.625em - 1px);
+ padding-right: calc(0.625em - 1px);
+ padding-top: calc(0.375em - 1px);
+ position: relative;
+ vertical-align: top;
+ background-color: white;
+ border-color: #dbdbdb;
+ color: #363636;
+ -webkit-box-shadow: inset 0 1px 2px rgba(10, 10, 10, 0.1);
+ box-shadow: inset 0 1px 2px rgba(10, 10, 10, 0.1);
+ max-width: 100%;
+ width: 100%;
+}
+
+.input:focus, .input.is-focused, .input:active, .input.is-active,
+.textarea:focus,
+.textarea.is-focused,
+.textarea:active,
+.textarea.is-active {
+ outline: none;
+}
+
+.input[disabled],
+.textarea[disabled] {
+ cursor: not-allowed;
+}
+
+.input:hover, .input.is-hovered,
+.textarea:hover,
+.textarea.is-hovered {
+ border-color: #b5b5b5;
+}
+
+.input:focus, .input.is-focused, .input:active, .input.is-active,
+.textarea:focus,
+.textarea.is-focused,
+.textarea:active,
+.textarea.is-active {
+ border-color: #00d1b2;
+}
+
+.input[disabled],
+.textarea[disabled] {
+ background-color: whitesmoke;
+ border-color: whitesmoke;
+ -webkit-box-shadow: none;
+ box-shadow: none;
+ color: #7a7a7a;
+}
+
+.input[disabled]::-moz-placeholder,
+.textarea[disabled]::-moz-placeholder {
+ color: rgba(122, 122, 122, 0.3);
+}
+
+.input[disabled]::-webkit-input-placeholder,
+.textarea[disabled]::-webkit-input-placeholder {
+ color: rgba(122, 122, 122, 0.3);
+}
+
+.input[disabled]:-moz-placeholder,
+.textarea[disabled]:-moz-placeholder {
+ color: rgba(122, 122, 122, 0.3);
+}
+
+.input[disabled]:-ms-input-placeholder,
+.textarea[disabled]:-ms-input-placeholder {
+ color: rgba(122, 122, 122, 0.3);
+}
+
+.input[type="search"],
+.textarea[type="search"] {
+ border-radius: 290486px;
+}
+
+.input.is-white,
+.textarea.is-white {
+ border-color: white;
+}
+
+.input.is-black,
+.textarea.is-black {
+ border-color: #0a0a0a;
+}
+
+.input.is-light,
+.textarea.is-light {
+ border-color: whitesmoke;
+}
+
+.input.is-dark,
+.textarea.is-dark {
+ border-color: #363636;
+}
+
+.input.is-primary,
+.textarea.is-primary {
+ border-color: #00d1b2;
+}
+
+.input.is-info,
+.textarea.is-info {
+ border-color: #3273dc;
+}
+
+.input.is-success,
+.textarea.is-success {
+ border-color: #23d160;
+}
+
+.input.is-warning,
+.textarea.is-warning {
+ border-color: #ffdd57;
+}
+
+.input.is-danger,
+.textarea.is-danger {
+ border-color: #ff3860;
+}
+
+.input.is-small,
+.textarea.is-small {
+ border-radius: 2px;
+ font-size: 0.75rem;
+}
+
+.input.is-medium,
+.textarea.is-medium {
+ font-size: 1.25rem;
+}
+
+.input.is-large,
+.textarea.is-large {
+ font-size: 1.5rem;
+}
+
+.input.is-fullwidth,
+.textarea.is-fullwidth {
+ display: block;
+ width: 100%;
+}
+
+.input.is-inline,
+.textarea.is-inline {
+ display: inline;
+ width: auto;
+}
+
+.textarea {
+ display: block;
+ max-width: 100%;
+ min-width: 100%;
+ padding: 0.625em;
+ resize: vertical;
+}
+
+.textarea:not([rows]) {
+ max-height: 600px;
+ min-height: 120px;
+}
+
+.textarea[rows] {
+ height: unset;
+}
+
+.checkbox,
+.radio {
+ cursor: pointer;
+ display: inline-block;
+ line-height: 1.25;
+ position: relative;
+}
+
+.checkbox input,
+.radio input {
+ cursor: pointer;
+}
+
+.checkbox:hover,
+.radio:hover {
+ color: #363636;
+}
+
+.checkbox[disabled],
+.radio[disabled] {
+ color: #7a7a7a;
+ cursor: not-allowed;
+}
+
+.radio + .radio {
+ margin-left: 0.5em;
+}
+
+.select {
+ display: inline-block;
+ max-width: 100%;
+ position: relative;
+ vertical-align: top;
+}
+
+.select:not(.is-multiple) {
+ height: 2.25em;
+}
+
+.select:not(.is-multiple)::after {
+ border: 1px solid #00d1b2;
+ border-right: 0;
+ border-top: 0;
+ content: " ";
+ display: block;
+ height: 0.5em;
+ pointer-events: none;
+ position: absolute;
+ -webkit-transform: rotate(-45deg);
+ transform: rotate(-45deg);
+ width: 0.5em;
+ margin-top: -0.375em;
+ right: 1.125em;
+ top: 50%;
+ z-index: 4;
+}
+
+.select select {
+ -moz-appearance: none;
+ -webkit-appearance: none;
+ -webkit-box-align: center;
+ -ms-flex-align: center;
+ align-items: center;
+ border: 1px solid transparent;
+ border-radius: 3px;
+ -webkit-box-shadow: none;
+ box-shadow: none;
+ display: -webkit-inline-box;
+ display: -ms-inline-flexbox;
+ display: inline-flex;
+ font-size: 1rem;
+ height: 2.25em;
+ -webkit-box-pack: start;
+ -ms-flex-pack: start;
+ justify-content: flex-start;
+ line-height: 1.5;
+ padding-bottom: calc(0.375em - 1px);
+ padding-left: calc(0.625em - 1px);
+ padding-right: calc(0.625em - 1px);
+ padding-top: calc(0.375em - 1px);
+ position: relative;
+ vertical-align: top;
+ background-color: white;
+ border-color: #dbdbdb;
+ color: #363636;
+ cursor: pointer;
+ display: block;
+ font-size: 1em;
+ max-width: 100%;
+ outline: none;
+}
+
+.select select:focus, .select select.is-focused, .select select:active, .select select.is-active {
+ outline: none;
+}
+
+.select select[disabled] {
+ cursor: not-allowed;
+}
+
+.select select:hover, .select select.is-hovered {
+ border-color: #b5b5b5;
+}
+
+.select select:focus, .select select.is-focused, .select select:active, .select select.is-active {
+ border-color: #00d1b2;
+}
+
+.select select[disabled] {
+ background-color: whitesmoke;
+ border-color: whitesmoke;
+ -webkit-box-shadow: none;
+ box-shadow: none;
+ color: #7a7a7a;
+}
+
+.select select[disabled]::-moz-placeholder {
+ color: rgba(122, 122, 122, 0.3);
+}
+
+.select select[disabled]::-webkit-input-placeholder {
+ color: rgba(122, 122, 122, 0.3);
+}
+
+.select select[disabled]:-moz-placeholder {
+ color: rgba(122, 122, 122, 0.3);
+}
+
+.select select[disabled]:-ms-input-placeholder {
+ color: rgba(122, 122, 122, 0.3);
+}
+
+.select select:hover {
+ border-color: #b5b5b5;
+}
+
+.select select:focus, .select select.is-focused, .select select:active, .select select.is-active {
+ border-color: #00d1b2;
+}
+
+.select select::-ms-expand {
+ display: none;
+}
+
+.select select[disabled]:hover {
+ border-color: whitesmoke;
+}
+
+.select select:not([multiple]) {
+ padding-right: 2.5em;
+}
+
+.select select[multiple] {
+ height: unset;
+ padding: 0;
+}
+
+.select select[multiple] option {
+ padding: 0.5em 1em;
+}
+
+.select:hover::after {
+ border-color: #363636;
+}
+
+.select.is-white select {
+ border-color: white;
+}
+
+.select.is-black select {
+ border-color: #0a0a0a;
+}
+
+.select.is-light select {
+ border-color: whitesmoke;
+}
+
+.select.is-dark select {
+ border-color: #363636;
+}
+
+.select.is-primary select {
+ border-color: #00d1b2;
+}
+
+.select.is-info select {
+ border-color: #3273dc;
+}
+
+.select.is-success select {
+ border-color: #23d160;
+}
+
+.select.is-warning select {
+ border-color: #ffdd57;
+}
+
+.select.is-danger select {
+ border-color: #ff3860;
+}
+
+.select.is-small {
+ border-radius: 2px;
+ font-size: 0.75rem;
+}
+
+.select.is-medium {
+ font-size: 1.25rem;
+}
+
+.select.is-large {
+ font-size: 1.5rem;
+}
+
+.select.is-disabled::after {
+ border-color: #7a7a7a;
+}
+
+.select.is-fullwidth {
+ width: 100%;
+}
+
+.select.is-fullwidth select {
+ width: 100%;
+}
+
+.select.is-loading::after {
+ -webkit-animation: spinAround 500ms infinite linear;
+ animation: spinAround 500ms infinite linear;
+ border: 2px solid #dbdbdb;
+ border-radius: 290486px;
+ border-right-color: transparent;
+ border-top-color: transparent;
+ content: "";
+ display: block;
+ height: 1em;
+ position: relative;
+ width: 1em;
+ margin-top: 0;
+ position: absolute;
+ right: 0.625em;
+ top: 0.625em;
+ -webkit-transform: none;
+ transform: none;
+}
+
+.select.is-loading.is-small:after {
+ font-size: 0.75rem;
+}
+
+.select.is-loading.is-medium:after {
+ font-size: 1.25rem;
+}
+
+.select.is-loading.is-large:after {
+ font-size: 1.5rem;
+}
+
+.file {
+ -webkit-touch-callout: none;
+ -webkit-user-select: none;
+ -moz-user-select: none;
+ -ms-user-select: none;
+ user-select: none;
+ -webkit-box-align: stretch;
+ -ms-flex-align: stretch;
+ align-items: stretch;
+ display: -webkit-box;
+ display: -ms-flexbox;
+ display: flex;
+ -webkit-box-pack: start;
+ -ms-flex-pack: start;
+ justify-content: flex-start;
+ position: relative;
+}
+
+.file.is-white .file-cta {
+ background-color: white;
+ border-color: transparent;
+ color: #0a0a0a;
+}
+
+.file.is-white:hover .file-cta, .file.is-white.is-hovered .file-cta {
+ background-color: #f9f9f9;
+ border-color: transparent;
+ color: #0a0a0a;
+}
+
+.file.is-white:focus .file-cta, .file.is-white.is-focused .file-cta {
+ border-color: transparent;
+ -webkit-box-shadow: 0 0 0.5em rgba(255, 255, 255, 0.25);
+ box-shadow: 0 0 0.5em rgba(255, 255, 255, 0.25);
+ color: #0a0a0a;
+}
+
+.file.is-white:active .file-cta, .file.is-white.is-active .file-cta {
+ background-color: #f2f2f2;
+ border-color: transparent;
+ color: #0a0a0a;
+}
+
+.file.is-black .file-cta {
+ background-color: #0a0a0a;
+ border-color: transparent;
+ color: white;
+}
+
+.file.is-black:hover .file-cta, .file.is-black.is-hovered .file-cta {
+ background-color: #040404;
+ border-color: transparent;
+ color: white;
+}
+
+.file.is-black:focus .file-cta, .file.is-black.is-focused .file-cta {
+ border-color: transparent;
+ -webkit-box-shadow: 0 0 0.5em rgba(10, 10, 10, 0.25);
+ box-shadow: 0 0 0.5em rgba(10, 10, 10, 0.25);
+ color: white;
+}
+
+.file.is-black:active .file-cta, .file.is-black.is-active .file-cta {
+ background-color: black;
+ border-color: transparent;
+ color: white;
+}
+
+.file.is-light .file-cta {
+ background-color: whitesmoke;
+ border-color: transparent;
+ color: #363636;
+}
+
+.file.is-light:hover .file-cta, .file.is-light.is-hovered .file-cta {
+ background-color: #eeeeee;
+ border-color: transparent;
+ color: #363636;
+}
+
+.file.is-light:focus .file-cta, .file.is-light.is-focused .file-cta {
+ border-color: transparent;
+ -webkit-box-shadow: 0 0 0.5em rgba(245, 245, 245, 0.25);
+ box-shadow: 0 0 0.5em rgba(245, 245, 245, 0.25);
+ color: #363636;
+}
+
+.file.is-light:active .file-cta, .file.is-light.is-active .file-cta {
+ background-color: #e8e8e8;
+ border-color: transparent;
+ color: #363636;
+}
+
+.file.is-dark .file-cta {
+ background-color: #363636;
+ border-color: transparent;
+ color: whitesmoke;
+}
+
+.file.is-dark:hover .file-cta, .file.is-dark.is-hovered .file-cta {
+ background-color: #2f2f2f;
+ border-color: transparent;
+ color: whitesmoke;
+}
+
+.file.is-dark:focus .file-cta, .file.is-dark.is-focused .file-cta {
+ border-color: transparent;
+ -webkit-box-shadow: 0 0 0.5em rgba(54, 54, 54, 0.25);
+ box-shadow: 0 0 0.5em rgba(54, 54, 54, 0.25);
+ color: whitesmoke;
+}
+
+.file.is-dark:active .file-cta, .file.is-dark.is-active .file-cta {
+ background-color: #292929;
+ border-color: transparent;
+ color: whitesmoke;
+}
+
+.file.is-primary .file-cta {
+ background-color: #00d1b2;
+ border-color: transparent;
+ color: #fff;
+}
+
+.file.is-primary:hover .file-cta, .file.is-primary.is-hovered .file-cta {
+ background-color: #00c4a7;
+ border-color: transparent;
+ color: #fff;
+}
+
+.file.is-primary:focus .file-cta, .file.is-primary.is-focused .file-cta {
+ border-color: transparent;
+ -webkit-box-shadow: 0 0 0.5em rgba(0, 209, 178, 0.25);
+ box-shadow: 0 0 0.5em rgba(0, 209, 178, 0.25);
+ color: #fff;
+}
+
+.file.is-primary:active .file-cta, .file.is-primary.is-active .file-cta {
+ background-color: #00b89c;
+ border-color: transparent;
+ color: #fff;
+}
+
+.file.is-info .file-cta {
+ background-color: #3273dc;
+ border-color: transparent;
+ color: #fff;
+}
+
+.file.is-info:hover .file-cta, .file.is-info.is-hovered .file-cta {
+ background-color: #276cda;
+ border-color: transparent;
+ color: #fff;
+}
+
+.file.is-info:focus .file-cta, .file.is-info.is-focused .file-cta {
+ border-color: transparent;
+ -webkit-box-shadow: 0 0 0.5em rgba(50, 115, 220, 0.25);
+ box-shadow: 0 0 0.5em rgba(50, 115, 220, 0.25);
+ color: #fff;
+}
+
+.file.is-info:active .file-cta, .file.is-info.is-active .file-cta {
+ background-color: #2366d1;
+ border-color: transparent;
+ color: #fff;
+}
+
+.file.is-success .file-cta {
+ background-color: #23d160;
+ border-color: transparent;
+ color: #fff;
+}
+
+.file.is-success:hover .file-cta, .file.is-success.is-hovered .file-cta {
+ background-color: #22c65b;
+ border-color: transparent;
+ color: #fff;
+}
+
+.file.is-success:focus .file-cta, .file.is-success.is-focused .file-cta {
+ border-color: transparent;
+ -webkit-box-shadow: 0 0 0.5em rgba(35, 209, 96, 0.25);
+ box-shadow: 0 0 0.5em rgba(35, 209, 96, 0.25);
+ color: #fff;
+}
+
+.file.is-success:active .file-cta, .file.is-success.is-active .file-cta {
+ background-color: #20bc56;
+ border-color: transparent;
+ color: #fff;
+}
+
+.file.is-warning .file-cta {
+ background-color: #ffdd57;
+ border-color: transparent;
+ color: rgba(0, 0, 0, 0.7);
+}
+
+.file.is-warning:hover .file-cta, .file.is-warning.is-hovered .file-cta {
+ background-color: #ffdb4a;
+ border-color: transparent;
+ color: rgba(0, 0, 0, 0.7);
+}
+
+.file.is-warning:focus .file-cta, .file.is-warning.is-focused .file-cta {
+ border-color: transparent;
+ -webkit-box-shadow: 0 0 0.5em rgba(255, 221, 87, 0.25);
+ box-shadow: 0 0 0.5em rgba(255, 221, 87, 0.25);
+ color: rgba(0, 0, 0, 0.7);
+}
+
+.file.is-warning:active .file-cta, .file.is-warning.is-active .file-cta {
+ background-color: #ffd83d;
+ border-color: transparent;
+ color: rgba(0, 0, 0, 0.7);
+}
+
+.file.is-danger .file-cta {
+ background-color: #ff3860;
+ border-color: transparent;
+ color: #fff;
+}
+
+.file.is-danger:hover .file-cta, .file.is-danger.is-hovered .file-cta {
+ background-color: #ff2b56;
+ border-color: transparent;
+ color: #fff;
+}
+
+.file.is-danger:focus .file-cta, .file.is-danger.is-focused .file-cta {
+ border-color: transparent;
+ -webkit-box-shadow: 0 0 0.5em rgba(255, 56, 96, 0.25);
+ box-shadow: 0 0 0.5em rgba(255, 56, 96, 0.25);
+ color: #fff;
+}
+
+.file.is-danger:active .file-cta, .file.is-danger.is-active .file-cta {
+ background-color: #ff1f4b;
+ border-color: transparent;
+ color: #fff;
+}
+
+.file.is-small {
+ font-size: 0.75rem;
+}
+
+.file.is-medium {
+ font-size: 1.25rem;
+}
+
+.file.is-medium .file-icon .fa {
+ font-size: 21px;
+}
+
+.file.is-large {
+ font-size: 1.5rem;
+}
+
+.file.is-large .file-icon .fa {
+ font-size: 28px;
+}
+
+.file.has-name .file-cta {
+ border-bottom-right-radius: 0;
+ border-top-right-radius: 0;
+}
+
+.file.has-name .file-name {
+ border-bottom-left-radius: 0;
+ border-top-left-radius: 0;
+}
+
+.file.is-centered {
+ -webkit-box-pack: center;
+ -ms-flex-pack: center;
+ justify-content: center;
+}
+
+.file.is-right {
+ -webkit-box-pack: end;
+ -ms-flex-pack: end;
+ justify-content: flex-end;
+}
+
+.file.is-boxed .file-label {
+ -webkit-box-orient: vertical;
+ -webkit-box-direction: normal;
+ -ms-flex-direction: column;
+ flex-direction: column;
+}
+
+.file.is-boxed .file-cta {
+ -webkit-box-orient: vertical;
+ -webkit-box-direction: normal;
+ -ms-flex-direction: column;
+ flex-direction: column;
+ height: auto;
+ padding: 1em 3em;
+}
+
+.file.is-boxed .file-name {
+ border-width: 0 1px 1px;
+}
+
+.file.is-boxed .file-icon {
+ height: 1.5em;
+ width: 1.5em;
+}
+
+.file.is-boxed .file-icon .fa {
+ font-size: 21px;
+}
+
+.file.is-boxed.is-small .file-icon .fa {
+ font-size: 14px;
+}
+
+.file.is-boxed.is-medium .file-icon .fa {
+ font-size: 28px;
+}
+
+.file.is-boxed.is-large .file-icon .fa {
+ font-size: 35px;
+}
+
+.file.is-boxed.has-name .file-cta {
+ border-radius: 3px 3px 0 0;
+}
+
+.file.is-boxed.has-name .file-name {
+ border-radius: 0 0 3px 3px;
+ border-width: 0 1px 1px;
+}
+
+.file.is-right .file-cta {
+ border-radius: 0 3px 3px 0;
+}
+
+.file.is-right .file-name {
+ border-radius: 3px 0 0 3px;
+ border-width: 1px 0 1px 1px;
+ -webkit-box-ordinal-group: 0;
+ -ms-flex-order: -1;
+ order: -1;
+}
+
+.file.is-fullwidth .file-label {
+ width: 100%;
+}
+
+.file.is-fullwidth .file-name {
+ -webkit-box-flex: 1;
+ -ms-flex-positive: 1;
+ flex-grow: 1;
+ max-width: none;
+}
+
+.file-label {
+ -webkit-box-align: stretch;
+ -ms-flex-align: stretch;
+ align-items: stretch;
+ display: -webkit-box;
+ display: -ms-flexbox;
+ display: flex;
+ cursor: pointer;
+ -webkit-box-pack: start;
+ -ms-flex-pack: start;
+ justify-content: flex-start;
+ overflow: hidden;
+ position: relative;
+}
+
+.file-label:hover .file-cta {
+ background-color: #eeeeee;
+ color: #363636;
+}
+
+.file-label:hover .file-name {
+ border-color: #d5d5d5;
+}
+
+.file-label:active .file-cta {
+ background-color: #e8e8e8;
+ color: #363636;
+}
+
+.file-label:active .file-name {
+ border-color: #cfcfcf;
+}
+
+.file-input {
+ height: 0.01em;
+ left: 0;
+ outline: none;
+ position: absolute;
+ top: 0;
+ width: 0.01em;
+}
+
+.file-cta,
+.file-name {
+ -moz-appearance: none;
+ -webkit-appearance: none;
+ -webkit-box-align: center;
+ -ms-flex-align: center;
+ align-items: center;
+ border: 1px solid transparent;
+ border-radius: 3px;
+ -webkit-box-shadow: none;
+ box-shadow: none;
+ display: -webkit-inline-box;
+ display: -ms-inline-flexbox;
+ display: inline-flex;
+ font-size: 1rem;
+ height: 2.25em;
+ -webkit-box-pack: start;
+ -ms-flex-pack: start;
+ justify-content: flex-start;
+ line-height: 1.5;
+ padding-bottom: calc(0.375em - 1px);
+ padding-left: calc(0.625em - 1px);
+ padding-right: calc(0.625em - 1px);
+ padding-top: calc(0.375em - 1px);
+ position: relative;
+ vertical-align: top;
+ border-color: #dbdbdb;
+ border-radius: 3px;
+ font-size: 1em;
+ padding-left: 1em;
+ padding-right: 1em;
+ white-space: nowrap;
+}
+
+.file-cta:focus, .file-cta.is-focused, .file-cta:active, .file-cta.is-active,
+.file-name:focus,
+.file-name.is-focused,
+.file-name:active,
+.file-name.is-active {
+ outline: none;
+}
+
+.file-cta[disabled],
+.file-name[disabled] {
+ cursor: not-allowed;
+}
+
+.file-cta {
+ background-color: whitesmoke;
+ color: #4a4a4a;
+}
+
+.file-name {
+ border-color: #dbdbdb;
+ border-style: solid;
+ border-width: 1px 1px 1px 0;
+ display: block;
+ max-width: 16em;
+ overflow: hidden;
+ text-align: left;
+ text-overflow: ellipsis;
+}
+
+.file-icon {
+ -webkit-box-align: center;
+ -ms-flex-align: center;
+ align-items: center;
+ display: -webkit-box;
+ display: -ms-flexbox;
+ display: flex;
+ height: 1em;
+ -webkit-box-pack: center;
+ -ms-flex-pack: center;
+ justify-content: center;
+ margin-right: 0.5em;
+ width: 1em;
+}
+
+.file-icon .fa {
+ font-size: 14px;
+}
+
+.label {
+ color: #363636;
+ display: block;
+ font-size: 1rem;
+ font-weight: 700;
+}
+
+.label:not(:last-child) {
+ margin-bottom: 0.5em;
+}
+
+.label.is-small {
+ font-size: 0.75rem;
+}
+
+.label.is-medium {
+ font-size: 1.25rem;
+}
+
+.label.is-large {
+ font-size: 1.5rem;
+}
+
+.help {
+ display: block;
+ font-size: 0.75rem;
+ margin-top: 0.25rem;
+}
+
+.help.is-white {
+ color: white;
+}
+
+.help.is-black {
+ color: #0a0a0a;
+}
+
+.help.is-light {
+ color: whitesmoke;
+}
+
+.help.is-dark {
+ color: #363636;
+}
+
+.help.is-primary {
+ color: #00d1b2;
+}
+
+.help.is-info {
+ color: #3273dc;
+}
+
+.help.is-success {
+ color: #23d160;
+}
+
+.help.is-warning {
+ color: #ffdd57;
+}
+
+.help.is-danger {
+ color: #ff3860;
+}
+
+.field:not(:last-child) {
+ margin-bottom: 0.75rem;
+}
+
+.field.has-addons {
+ display: -webkit-box;
+ display: -ms-flexbox;
+ display: flex;
+ -webkit-box-pack: start;
+ -ms-flex-pack: start;
+ justify-content: flex-start;
+}
+
+.field.has-addons .control:not(:last-child) {
+ margin-right: -1px;
+}
+
+.field.has-addons .control:first-child .button,
+.field.has-addons .control:first-child .input,
+.field.has-addons .control:first-child .select select {
+ border-bottom-left-radius: 3px;
+ border-top-left-radius: 3px;
+}
+
+.field.has-addons .control:last-child .button,
+.field.has-addons .control:last-child .input,
+.field.has-addons .control:last-child .select select {
+ border-bottom-right-radius: 3px;
+ border-top-right-radius: 3px;
+}
+
+.field.has-addons .control .button,
+.field.has-addons .control .input,
+.field.has-addons .control .select select {
+ border-radius: 0;
+}
+
+.field.has-addons .control .button:hover, .field.has-addons .control .button.is-hovered,
+.field.has-addons .control .input:hover,
+.field.has-addons .control .input.is-hovered,
+.field.has-addons .control .select select:hover,
+.field.has-addons .control .select select.is-hovered {
+ z-index: 2;
+}
+
+.field.has-addons .control .button:focus, .field.has-addons .control .button.is-focused, .field.has-addons .control .button:active, .field.has-addons .control .button.is-active,
+.field.has-addons .control .input:focus,
+.field.has-addons .control .input.is-focused,
+.field.has-addons .control .input:active,
+.field.has-addons .control .input.is-active,
+.field.has-addons .control .select select:focus,
+.field.has-addons .control .select select.is-focused,
+.field.has-addons .control .select select:active,
+.field.has-addons .control .select select.is-active {
+ z-index: 3;
+}
+
+.field.has-addons .control .button:focus:hover, .field.has-addons .control .button.is-focused:hover, .field.has-addons .control .button:active:hover, .field.has-addons .control .button.is-active:hover,
+.field.has-addons .control .input:focus:hover,
+.field.has-addons .control .input.is-focused:hover,
+.field.has-addons .control .input:active:hover,
+.field.has-addons .control .input.is-active:hover,
+.field.has-addons .control .select select:focus:hover,
+.field.has-addons .control .select select.is-focused:hover,
+.field.has-addons .control .select select:active:hover,
+.field.has-addons .control .select select.is-active:hover {
+ z-index: 4;
+}
+
+.field.has-addons .control.is-expanded {
+ -webkit-box-flex: 1;
+ -ms-flex-positive: 1;
+ flex-grow: 1;
+}
+
+.field.has-addons.has-addons-centered {
+ -webkit-box-pack: center;
+ -ms-flex-pack: center;
+ justify-content: center;
+}
+
+.field.has-addons.has-addons-right {
+ -webkit-box-pack: end;
+ -ms-flex-pack: end;
+ justify-content: flex-end;
+}
+
+.field.has-addons.has-addons-fullwidth .control {
+ -webkit-box-flex: 1;
+ -ms-flex-positive: 1;
+ flex-grow: 1;
+ -ms-flex-negative: 0;
+ flex-shrink: 0;
+}
+
+.field.is-grouped {
+ display: -webkit-box;
+ display: -ms-flexbox;
+ display: flex;
+ -webkit-box-pack: start;
+ -ms-flex-pack: start;
+ justify-content: flex-start;
+}
+
+.field.is-grouped > .control {
+ -ms-flex-negative: 0;
+ flex-shrink: 0;
+}
+
+.field.is-grouped > .control:not(:last-child) {
+ margin-bottom: 0;
+ margin-right: 0.75rem;
+}
+
+.field.is-grouped > .control.is-expanded {
+ -webkit-box-flex: 1;
+ -ms-flex-positive: 1;
+ flex-grow: 1;
+ -ms-flex-negative: 1;
+ flex-shrink: 1;
+}
+
+.field.is-grouped.is-grouped-centered {
+ -webkit-box-pack: center;
+ -ms-flex-pack: center;
+ justify-content: center;
+}
+
+.field.is-grouped.is-grouped-right {
+ -webkit-box-pack: end;
+ -ms-flex-pack: end;
+ justify-content: flex-end;
+}
+
+.field.is-grouped.is-grouped-multiline {
+ -ms-flex-wrap: wrap;
+ flex-wrap: wrap;
+}
+
+.field.is-grouped.is-grouped-multiline > .control:last-child, .field.is-grouped.is-grouped-multiline > .control:not(:last-child) {
+ margin-bottom: 0.75rem;
+}
+
+.field.is-grouped.is-grouped-multiline:last-child {
+ margin-bottom: -0.75rem;
+}
+
+.field.is-grouped.is-grouped-multiline:not(:last-child) {
+ margin-bottom: 0;
+}
+
+@media screen and (min-width: 769px), print {
+ .field.is-horizontal {
+ display: -webkit-box;
+ display: -ms-flexbox;
+ display: flex;
+ }
+}
+
+.field-label .label {
+ font-size: inherit;
+}
+
+@media screen and (max-width: 768px) {
+ .field-label {
+ margin-bottom: 0.5rem;
+ }
+}
+
+@media screen and (min-width: 769px), print {
+ .field-label {
+ -ms-flex-preferred-size: 0;
+ flex-basis: 0;
+ -webkit-box-flex: 1;
+ -ms-flex-positive: 1;
+ flex-grow: 1;
+ -ms-flex-negative: 0;
+ flex-shrink: 0;
+ margin-right: 1.5rem;
+ text-align: right;
+ }
+ .field-label.is-small {
+ font-size: 0.75rem;
+ padding-top: 0.375em;
+ }
+ .field-label.is-normal {
+ padding-top: 0.375em;
+ }
+ .field-label.is-medium {
+ font-size: 1.25rem;
+ padding-top: 0.375em;
+ }
+ .field-label.is-large {
+ font-size: 1.5rem;
+ padding-top: 0.375em;
+ }
+}
+
+.field-body .field .field {
+ margin-bottom: 0;
+}
+
+@media screen and (min-width: 769px), print {
+ .field-body {
+ display: -webkit-box;
+ display: -ms-flexbox;
+ display: flex;
+ -ms-flex-preferred-size: 0;
+ flex-basis: 0;
+ -webkit-box-flex: 5;
+ -ms-flex-positive: 5;
+ flex-grow: 5;
+ -ms-flex-negative: 1;
+ flex-shrink: 1;
+ }
+ .field-body .field {
+ margin-bottom: 0;
+ }
+ .field-body > .field {
+ -ms-flex-negative: 1;
+ flex-shrink: 1;
+ }
+ .field-body > .field:not(.is-narrow) {
+ -webkit-box-flex: 1;
+ -ms-flex-positive: 1;
+ flex-grow: 1;
+ }
+ .field-body > .field:not(:last-child) {
+ margin-right: 0.75rem;
+ }
+}
+
+.control {
+ font-size: 1rem;
+ position: relative;
+ text-align: left;
+}
+
+.control.has-icon .icon {
+ color: #dbdbdb;
+ height: 2.25em;
+ pointer-events: none;
+ position: absolute;
+ top: 0;
+ width: 2.25em;
+ z-index: 4;
+}
+
+.control.has-icon .input:focus + .icon {
+ color: #7a7a7a;
+}
+
+.control.has-icon .input.is-small + .icon {
+ font-size: 0.75rem;
+}
+
+.control.has-icon .input.is-medium + .icon {
+ font-size: 1.25rem;
+}
+
+.control.has-icon .input.is-large + .icon {
+ font-size: 1.5rem;
+}
+
+.control.has-icon:not(.has-icon-right) .icon {
+ left: 0;
+}
+
+.control.has-icon:not(.has-icon-right) .input {
+ padding-left: 2.25em;
+}
+
+.control.has-icon.has-icon-right .icon {
+ right: 0;
+}
+
+.control.has-icon.has-icon-right .input {
+ padding-right: 2.25em;
+}
+
+.control.has-icons-left .input:focus ~ .icon,
+.control.has-icons-left .select:focus ~ .icon, .control.has-icons-right .input:focus ~ .icon,
+.control.has-icons-right .select:focus ~ .icon {
+ color: #7a7a7a;
+}
+
+.control.has-icons-left .input.is-small ~ .icon,
+.control.has-icons-left .select.is-small ~ .icon, .control.has-icons-right .input.is-small ~ .icon,
+.control.has-icons-right .select.is-small ~ .icon {
+ font-size: 0.75rem;
+}
+
+.control.has-icons-left .input.is-medium ~ .icon,
+.control.has-icons-left .select.is-medium ~ .icon, .control.has-icons-right .input.is-medium ~ .icon,
+.control.has-icons-right .select.is-medium ~ .icon {
+ font-size: 1.25rem;
+}
+
+.control.has-icons-left .input.is-large ~ .icon,
+.control.has-icons-left .select.is-large ~ .icon, .control.has-icons-right .input.is-large ~ .icon,
+.control.has-icons-right .select.is-large ~ .icon {
+ font-size: 1.5rem;
+}
+
+.control.has-icons-left .icon, .control.has-icons-right .icon {
+ color: #dbdbdb;
+ height: 2.25em;
+ pointer-events: none;
+ position: absolute;
+ top: 0;
+ width: 2.25em;
+ z-index: 4;
+}
+
+.control.has-icons-left .input,
+.control.has-icons-left .select select {
+ padding-left: 2.25em;
+}
+
+.control.has-icons-left .icon.is-left {
+ left: 0;
+}
+
+.control.has-icons-right .input,
+.control.has-icons-right .select select {
+ padding-right: 2.25em;
+}
+
+.control.has-icons-right .icon.is-right {
+ right: 0;
+}
+
+.control.is-loading::after {
+ -webkit-animation: spinAround 500ms infinite linear;
+ animation: spinAround 500ms infinite linear;
+ border: 2px solid #dbdbdb;
+ border-radius: 290486px;
+ border-right-color: transparent;
+ border-top-color: transparent;
+ content: "";
+ display: block;
+ height: 1em;
+ position: relative;
+ width: 1em;
+ position: absolute !important;
+ right: 0.625em;
+ top: 0.625em;
+}
+
+.control.is-loading.is-small:after {
+ font-size: 0.75rem;
+}
+
+.control.is-loading.is-medium:after {
+ font-size: 1.25rem;
+}
+
+.control.is-loading.is-large:after {
+ font-size: 1.5rem;
+}
+
+.icon {
+ -webkit-box-align: center;
+ -ms-flex-align: center;
+ align-items: center;
+ display: -webkit-inline-box;
+ display: -ms-inline-flexbox;
+ display: inline-flex;
+ -webkit-box-pack: center;
+ -ms-flex-pack: center;
+ justify-content: center;
+ height: 1.5rem;
+ width: 1.5rem;
+}
+
+.icon .fa {
+ font-size: 21px;
+}
+
+.icon.is-small {
+ height: 1rem;
+ width: 1rem;
+}
+
+.icon.is-small .fa {
+ font-size: 14px;
+}
+
+.icon.is-medium {
+ height: 2rem;
+ width: 2rem;
+}
+
+.icon.is-medium .fa {
+ font-size: 28px;
+}
+
+.icon.is-large {
+ height: 3rem;
+ width: 3rem;
+}
+
+.icon.is-large .fa {
+ font-size: 42px;
+}
+
+.image {
+ display: block;
+ position: relative;
+}
+
+.image img {
+ display: block;
+ height: auto;
+ width: 100%;
+}
+
+.image.is-square img, .image.is-1by1 img, .image.is-4by3 img, .image.is-3by2 img, .image.is-16by9 img, .image.is-2by1 img {
+ bottom: 0;
+ left: 0;
+ position: absolute;
+ right: 0;
+ top: 0;
+ height: 100%;
+ width: 100%;
+}
+
+.image.is-square, .image.is-1by1 {
+ padding-top: 100%;
+}
+
+.image.is-4by3 {
+ padding-top: 75%;
+}
+
+.image.is-3by2 {
+ padding-top: 66.6666%;
+}
+
+.image.is-16by9 {
+ padding-top: 56.25%;
+}
+
+.image.is-2by1 {
+ padding-top: 50%;
+}
+
+.image.is-16x16 {
+ height: 16px;
+ width: 16px;
+}
+
+.image.is-24x24 {
+ height: 24px;
+ width: 24px;
+}
+
+.image.is-32x32 {
+ height: 32px;
+ width: 32px;
+}
+
+.image.is-48x48 {
+ height: 48px;
+ width: 48px;
+}
+
+.image.is-64x64 {
+ height: 64px;
+ width: 64px;
+}
+
+.image.is-96x96 {
+ height: 96px;
+ width: 96px;
+}
+
+.image.is-128x128 {
+ height: 128px;
+ width: 128px;
+}
+
+.notification {
+ background-color: whitesmoke;
+ border-radius: 3px;
+ padding: 1.25rem 2.5rem 1.25rem 1.5rem;
+ position: relative;
+}
+
+.notification:not(:last-child) {
+ margin-bottom: 1.5rem;
+}
+
+.notification a:not(.button) {
+ color: currentColor;
+ text-decoration: underline;
+}
+
+.notification strong {
+ color: currentColor;
+}
+
+.notification code,
+.notification pre {
+ background: white;
+}
+
+.notification pre code {
+ background: transparent;
+}
+
+.notification > .delete {
+ position: absolute;
+ right: 0.5em;
+ top: 0.5em;
+}
+
+.notification .title,
+.notification .subtitle,
+.notification .content {
+ color: currentColor;
+}
+
+.notification.is-white {
+ background-color: white;
+ color: #0a0a0a;
+}
+
+.notification.is-black {
+ background-color: #0a0a0a;
+ color: white;
+}
+
+.notification.is-light {
+ background-color: whitesmoke;
+ color: #363636;
+}
+
+.notification.is-dark {
+ background-color: #363636;
+ color: whitesmoke;
+}
+
+.notification.is-primary {
+ background-color: #00d1b2;
+ color: #fff;
+}
+
+.notification.is-info {
+ background-color: #3273dc;
+ color: #fff;
+}
+
+.notification.is-success {
+ background-color: #23d160;
+ color: #fff;
+}
+
+.notification.is-warning {
+ background-color: #ffdd57;
+ color: rgba(0, 0, 0, 0.7);
+}
+
+.notification.is-danger {
+ background-color: #ff3860;
+ color: #fff;
+}
+
+.progress {
+ -moz-appearance: none;
+ -webkit-appearance: none;
+ border: none;
+ border-radius: 290486px;
+ display: block;
+ height: 1rem;
+ overflow: hidden;
+ padding: 0;
+ width: 100%;
+}
+
+.progress:not(:last-child) {
+ margin-bottom: 1.5rem;
+}
+
+.progress::-webkit-progress-bar {
+ background-color: #dbdbdb;
+}
+
+.progress::-webkit-progress-value {
+ background-color: #4a4a4a;
+}
+
+.progress::-moz-progress-bar {
+ background-color: #4a4a4a;
+}
+
+.progress.is-white::-webkit-progress-value {
+ background-color: white;
+}
+
+.progress.is-white::-moz-progress-bar {
+ background-color: white;
+}
+
+.progress.is-black::-webkit-progress-value {
+ background-color: #0a0a0a;
+}
+
+.progress.is-black::-moz-progress-bar {
+ background-color: #0a0a0a;
+}
+
+.progress.is-light::-webkit-progress-value {
+ background-color: whitesmoke;
+}
+
+.progress.is-light::-moz-progress-bar {
+ background-color: whitesmoke;
+}
+
+.progress.is-dark::-webkit-progress-value {
+ background-color: #363636;
+}
+
+.progress.is-dark::-moz-progress-bar {
+ background-color: #363636;
+}
+
+.progress.is-primary::-webkit-progress-value {
+ background-color: #00d1b2;
+}
+
+.progress.is-primary::-moz-progress-bar {
+ background-color: #00d1b2;
+}
+
+.progress.is-info::-webkit-progress-value {
+ background-color: #3273dc;
+}
+
+.progress.is-info::-moz-progress-bar {
+ background-color: #3273dc;
+}
+
+.progress.is-success::-webkit-progress-value {
+ background-color: #23d160;
+}
+
+.progress.is-success::-moz-progress-bar {
+ background-color: #23d160;
+}
+
+.progress.is-warning::-webkit-progress-value {
+ background-color: #ffdd57;
+}
+
+.progress.is-warning::-moz-progress-bar {
+ background-color: #ffdd57;
+}
+
+.progress.is-danger::-webkit-progress-value {
+ background-color: #ff3860;
+}
+
+.progress.is-danger::-moz-progress-bar {
+ background-color: #ff3860;
+}
+
+.progress.is-small {
+ height: 0.75rem;
+}
+
+.progress.is-medium {
+ height: 1.25rem;
+}
+
+.progress.is-large {
+ height: 1.5rem;
+}
+
+.table {
+ background-color: white;
+ color: #363636;
+ margin-bottom: 1.5rem;
+}
+
+.table td,
+.table th {
+ border: 1px solid #dbdbdb;
+ border-width: 0 0 1px;
+ padding: 0.5em 0.75em;
+ vertical-align: top;
+}
+
+.table td.is-white,
+.table th.is-white {
+ background-color: white;
+ border-color: white;
+ color: #0a0a0a;
+}
+
+.table td.is-black,
+.table th.is-black {
+ background-color: #0a0a0a;
+ border-color: #0a0a0a;
+ color: white;
+}
+
+.table td.is-light,
+.table th.is-light {
+ background-color: whitesmoke;
+ border-color: whitesmoke;
+ color: #363636;
+}
+
+.table td.is-dark,
+.table th.is-dark {
+ background-color: #363636;
+ border-color: #363636;
+ color: whitesmoke;
+}
+
+.table td.is-primary,
+.table th.is-primary {
+ background-color: #00d1b2;
+ border-color: #00d1b2;
+ color: #fff;
+}
+
+.table td.is-info,
+.table th.is-info {
+ background-color: #3273dc;
+ border-color: #3273dc;
+ color: #fff;
+}
+
+.table td.is-success,
+.table th.is-success {
+ background-color: #23d160;
+ border-color: #23d160;
+ color: #fff;
+}
+
+.table td.is-warning,
+.table th.is-warning {
+ background-color: #ffdd57;
+ border-color: #ffdd57;
+ color: rgba(0, 0, 0, 0.7);
+}
+
+.table td.is-danger,
+.table th.is-danger {
+ background-color: #ff3860;
+ border-color: #ff3860;
+ color: #fff;
+}
+
+.table td.is-narrow,
+.table th.is-narrow {
+ white-space: nowrap;
+ width: 1%;
+}
+
+.table th {
+ color: #363636;
+ text-align: left;
+}
+
+.table tr:hover {
+ background-color: #fafafa;
+}
+
+.table tr.is-selected {
+ background-color: #00d1b2;
+ color: #fff;
+}
+
+.table tr.is-selected a,
+.table tr.is-selected strong {
+ color: currentColor;
+}
+
+.table tr.is-selected td,
+.table tr.is-selected th {
+ border-color: #fff;
+ color: currentColor;
+}
+
+.table thead td,
+.table thead th {
+ border-width: 0 0 2px;
+ color: #363636;
+}
+
+.table tfoot td,
+.table tfoot th {
+ border-width: 2px 0 0;
+ color: #363636;
+}
+
+.table tbody tr:last-child td,
+.table tbody tr:last-child th {
+ border-bottom-width: 0;
+}
+
+.table.is-bordered td,
+.table.is-bordered th {
+ border-width: 1px;
+}
+
+.table.is-bordered tr:last-child td,
+.table.is-bordered tr:last-child th {
+ border-bottom-width: 1px;
+}
+
+.table.is-fullwidth {
+ width: 100%;
+}
+
+.table.is-narrow td,
+.table.is-narrow th {
+ padding: 0.25em 0.5em;
+}
+
+.table.is-striped tbody tr:not(.is-selected):nth-child(even) {
+ background-color: #fafafa;
+}
+
+.table.is-striped tbody tr:not(.is-selected):nth-child(even):hover {
+ background-color: whitesmoke;
+}
+
+.tags {
+ -webkit-box-align: center;
+ -ms-flex-align: center;
+ align-items: center;
+ display: -webkit-box;
+ display: -ms-flexbox;
+ display: flex;
+ -ms-flex-wrap: wrap;
+ flex-wrap: wrap;
+ -webkit-box-pack: start;
+ -ms-flex-pack: start;
+ justify-content: flex-start;
+}
+
+.tags .tag {
+ margin-bottom: 0.5rem;
+}
+
+.tags .tag:not(:last-child) {
+ margin-right: 0.5rem;
+}
+
+.tags:last-child {
+ margin-bottom: -0.5rem;
+}
+
+.tags:not(:last-child) {
+ margin-bottom: 1rem;
+}
+
+.tags.has-addons .tag {
+ margin-right: 0;
+}
+
+.tags.has-addons .tag:not(:first-child) {
+ border-bottom-left-radius: 0;
+ border-top-left-radius: 0;
+}
+
+.tags.has-addons .tag:not(:last-child) {
+ border-bottom-right-radius: 0;
+ border-top-right-radius: 0;
+}
+
+.tag {
+ -webkit-box-align: center;
+ -ms-flex-align: center;
+ align-items: center;
+ background-color: whitesmoke;
+ border-radius: 3px;
+ color: #4a4a4a;
+ display: -webkit-inline-box;
+ display: -ms-inline-flexbox;
+ display: inline-flex;
+ font-size: 0.75rem;
+ height: 2em;
+ -webkit-box-pack: center;
+ -ms-flex-pack: center;
+ justify-content: center;
+ line-height: 1.5;
+ padding-left: 0.75em;
+ padding-right: 0.75em;
+ white-space: nowrap;
+}
+
+.tag .delete {
+ margin-left: 0.25em;
+ margin-right: -0.375em;
+}
+
+.tag.is-white {
+ background-color: white;
+ color: #0a0a0a;
+}
+
+.tag.is-black {
+ background-color: #0a0a0a;
+ color: white;
+}
+
+.tag.is-light {
+ background-color: whitesmoke;
+ color: #363636;
+}
+
+.tag.is-dark {
+ background-color: #363636;
+ color: whitesmoke;
+}
+
+.tag.is-primary {
+ background-color: #00d1b2;
+ color: #fff;
+}
+
+.tag.is-info {
+ background-color: #3273dc;
+ color: #fff;
+}
+
+.tag.is-success {
+ background-color: #23d160;
+ color: #fff;
+}
+
+.tag.is-warning {
+ background-color: #ffdd57;
+ color: rgba(0, 0, 0, 0.7);
+}
+
+.tag.is-danger {
+ background-color: #ff3860;
+ color: #fff;
+}
+
+.tag.is-medium {
+ font-size: 1rem;
+}
+
+.tag.is-large {
+ font-size: 1.25rem;
+}
+
+.tag.is-delete {
+ margin-left: 1px;
+ padding: 0;
+ position: relative;
+ width: 2em;
+}
+
+.tag.is-delete:before, .tag.is-delete:after {
+ background-color: currentColor;
+ content: "";
+ display: block;
+ left: 50%;
+ position: absolute;
+ top: 50%;
+ -webkit-transform: translateX(-50%) translateY(-50%) rotate(45deg);
+ transform: translateX(-50%) translateY(-50%) rotate(45deg);
+ -webkit-transform-origin: center center;
+ transform-origin: center center;
+}
+
+.tag.is-delete:before {
+ height: 1px;
+ width: 50%;
+}
+
+.tag.is-delete:after {
+ height: 50%;
+ width: 1px;
+}
+
+.tag.is-delete:hover, .tag.is-delete:focus {
+ background-color: #e8e8e8;
+}
+
+.tag.is-delete:active {
+ background-color: #dbdbdb;
+}
+
+.tag.is-rounded {
+ border-radius: 290486px;
+}
+
+a.tag:hover {
+ text-decoration: underline;
+}
+
+.title,
+.subtitle {
+ word-break: break-word;
+}
+
+.title:not(:last-child),
+.subtitle:not(:last-child) {
+ margin-bottom: 1.5rem;
+}
+
+.title em,
+.title span,
+.subtitle em,
+.subtitle span {
+ font-weight: inherit;
+}
+
+.title .tag,
+.subtitle .tag {
+ vertical-align: middle;
+}
+
+.title {
+ color: #363636;
+ font-size: 2rem;
+ font-weight: 600;
+ line-height: 1.125;
+}
+
+.title strong {
+ color: inherit;
+ font-weight: inherit;
+}
+
+.title + .highlight {
+ margin-top: -0.75rem;
+}
+
+.title:not(.is-spaced) + .subtitle {
+ margin-top: -1.5rem;
+}
+
+.title.is-1 {
+ font-size: 3rem;
+}
+
+.title.is-2 {
+ font-size: 2.5rem;
+}
+
+.title.is-3 {
+ font-size: 2rem;
+}
+
+.title.is-4 {
+ font-size: 1.5rem;
+}
+
+.title.is-5 {
+ font-size: 1.25rem;
+}
+
+.title.is-6 {
+ font-size: 1rem;
+}
+
+.title.is-7 {
+ font-size: 0.75rem;
+}
+
+.subtitle {
+ color: #4a4a4a;
+ font-size: 1.25rem;
+ font-weight: 400;
+ line-height: 1.25;
+}
+
+.subtitle strong {
+ color: #363636;
+ font-weight: 600;
+}
+
+.subtitle:not(.is-spaced) + .title {
+ margin-top: -1.5rem;
+}
+
+.subtitle.is-1 {
+ font-size: 3rem;
+}
+
+.subtitle.is-2 {
+ font-size: 2.5rem;
+}
+
+.subtitle.is-3 {
+ font-size: 2rem;
+}
+
+.subtitle.is-4 {
+ font-size: 1.5rem;
+}
+
+.subtitle.is-5 {
+ font-size: 1.25rem;
+}
+
+.subtitle.is-6 {
+ font-size: 1rem;
+}
+
+.subtitle.is-7 {
+ font-size: 0.75rem;
+}
+
+.block:not(:last-child) {
+ margin-bottom: 1.5rem;
+}
+
+.delete {
+ -webkit-touch-callout: none;
+ -webkit-user-select: none;
+ -moz-user-select: none;
+ -ms-user-select: none;
+ user-select: none;
+ -moz-appearance: none;
+ -webkit-appearance: none;
+ background-color: rgba(10, 10, 10, 0.2);
+ border: none;
+ border-radius: 290486px;
+ cursor: pointer;
+ display: inline-block;
+ -webkit-box-flex: 0;
+ -ms-flex-positive: 0;
+ flex-grow: 0;
+ -ms-flex-negative: 0;
+ flex-shrink: 0;
+ font-size: 1rem;
+ height: 20px;
+ max-height: 20px;
+ max-width: 20px;
+ min-height: 20px;
+ min-width: 20px;
+ outline: none;
+ position: relative;
+ vertical-align: top;
+ width: 20px;
+}
+
+.delete:before, .delete:after {
+ background-color: white;
+ content: "";
+ display: block;
+ left: 50%;
+ position: absolute;
+ top: 50%;
+ -webkit-transform: translateX(-50%) translateY(-50%) rotate(45deg);
+ transform: translateX(-50%) translateY(-50%) rotate(45deg);
+ -webkit-transform-origin: center center;
+ transform-origin: center center;
+}
+
+.delete:before {
+ height: 2px;
+ width: 50%;
+}
+
+.delete:after {
+ height: 50%;
+ width: 2px;
+}
+
+.delete:hover, .delete:focus {
+ background-color: rgba(10, 10, 10, 0.3);
+}
+
+.delete:active {
+ background-color: rgba(10, 10, 10, 0.4);
+}
+
+.delete.is-small {
+ height: 16px;
+ max-height: 16px;
+ max-width: 16px;
+ min-height: 16px;
+ min-width: 16px;
+ width: 16px;
+}
+
+.delete.is-medium {
+ height: 24px;
+ max-height: 24px;
+ max-width: 24px;
+ min-height: 24px;
+ min-width: 24px;
+ width: 24px;
+}
+
+.delete.is-large {
+ height: 32px;
+ max-height: 32px;
+ max-width: 32px;
+ min-height: 32px;
+ min-width: 32px;
+ width: 32px;
+}
+
+.fa {
+ font-size: 21px;
+ text-align: center;
+ vertical-align: top;
+}
+
+.heading {
+ display: block;
+ font-size: 11px;
+ letter-spacing: 1px;
+ margin-bottom: 5px;
+ text-transform: uppercase;
+}
+
+.highlight {
+ font-weight: 400;
+ max-width: 100%;
+ overflow: hidden;
+ padding: 0;
+}
+
+.highlight:not(:last-child) {
+ margin-bottom: 1.5rem;
+}
+
+.highlight pre {
+ overflow: auto;
+ max-width: 100%;
+}
+
+.loader {
+ -webkit-animation: spinAround 500ms infinite linear;
+ animation: spinAround 500ms infinite linear;
+ border: 2px solid #dbdbdb;
+ border-radius: 290486px;
+ border-right-color: transparent;
+ border-top-color: transparent;
+ content: "";
+ display: block;
+ height: 1em;
+ position: relative;
+ width: 1em;
+}
+
+.number {
+ -webkit-box-align: center;
+ -ms-flex-align: center;
+ align-items: center;
+ background-color: whitesmoke;
+ border-radius: 290486px;
+ display: -webkit-inline-box;
+ display: -ms-inline-flexbox;
+ display: inline-flex;
+ font-size: 1.25rem;
+ height: 2em;
+ -webkit-box-pack: center;
+ -ms-flex-pack: center;
+ justify-content: center;
+ margin-right: 1.5rem;
+ min-width: 2.5em;
+ padding: 0.25rem 0.5rem;
+ text-align: center;
+ vertical-align: top;
+}
+
+.breadcrumb {
+ -webkit-touch-callout: none;
+ -webkit-user-select: none;
+ -moz-user-select: none;
+ -ms-user-select: none;
+ user-select: none;
+ -webkit-box-align: stretch;
+ -ms-flex-align: stretch;
+ align-items: stretch;
+ display: -webkit-box;
+ display: -ms-flexbox;
+ display: flex;
+ font-size: 1rem;
+ overflow: hidden;
+ overflow-x: auto;
+ white-space: nowrap;
+}
+
+.breadcrumb:not(:last-child) {
+ margin-bottom: 1.5rem;
+}
+
+.breadcrumb a {
+ -webkit-box-align: center;
+ -ms-flex-align: center;
+ align-items: center;
+ color: #7a7a7a;
+ display: -webkit-box;
+ display: -ms-flexbox;
+ display: flex;
+ -webkit-box-pack: center;
+ -ms-flex-pack: center;
+ justify-content: center;
+ padding: 0.5em 0.75em;
+}
+
+.breadcrumb a:hover {
+ color: #363636;
+}
+
+.breadcrumb li {
+ -webkit-box-align: center;
+ -ms-flex-align: center;
+ align-items: center;
+ display: -webkit-box;
+ display: -ms-flexbox;
+ display: flex;
+}
+
+.breadcrumb li.is-active a {
+ color: #363636;
+ cursor: default;
+ pointer-events: none;
+}
+
+.breadcrumb li + li::before {
+ color: #4a4a4a;
+ content: "\0002f";
+}
+
+.breadcrumb ul, .breadcrumb ol {
+ -webkit-box-align: center;
+ -ms-flex-align: center;
+ align-items: center;
+ display: -webkit-box;
+ display: -ms-flexbox;
+ display: flex;
+ -webkit-box-flex: 1;
+ -ms-flex-positive: 1;
+ flex-grow: 1;
+ -ms-flex-negative: 0;
+ flex-shrink: 0;
+ -webkit-box-pack: start;
+ -ms-flex-pack: start;
+ justify-content: flex-start;
+}
+
+.breadcrumb .icon:first-child {
+ margin-right: 0.5em;
+}
+
+.breadcrumb .icon:last-child {
+ margin-left: 0.5em;
+}
+
+.breadcrumb.is-centered ol, .breadcrumb.is-centered ul {
+ -webkit-box-pack: center;
+ -ms-flex-pack: center;
+ justify-content: center;
+}
+
+.breadcrumb.is-right ol, .breadcrumb.is-right ul {
+ -webkit-box-pack: end;
+ -ms-flex-pack: end;
+ justify-content: flex-end;
+}
+
+.breadcrumb.is-small {
+ font-size: 0.75rem;
+}
+
+.breadcrumb.is-medium {
+ font-size: 1.25rem;
+}
+
+.breadcrumb.is-large {
+ font-size: 1.5rem;
+}
+
+.breadcrumb.has-arrow-separator li + li::before {
+ content: "\02192";
+}
+
+.breadcrumb.has-bullet-separator li + li::before {
+ content: "\02022";
+}
+
+.breadcrumb.has-dot-separator li + li::before {
+ content: "\000b7";
+}
+
+.breadcrumb.has-succeeds-separator li + li::before {
+ content: "\0227B";
+}
+
+.card {
+ background-color: white;
+ -webkit-box-shadow: 0 2px 3px rgba(10, 10, 10, 0.1), 0 0 0 1px rgba(10, 10, 10, 0.1);
+ box-shadow: 0 2px 3px rgba(10, 10, 10, 0.1), 0 0 0 1px rgba(10, 10, 10, 0.1);
+ color: #4a4a4a;
+ max-width: 100%;
+ position: relative;
+}
+
+.card-header {
+ -webkit-box-align: stretch;
+ -ms-flex-align: stretch;
+ align-items: stretch;
+ -webkit-box-shadow: 0 1px 2px rgba(10, 10, 10, 0.1);
+ box-shadow: 0 1px 2px rgba(10, 10, 10, 0.1);
+ display: -webkit-box;
+ display: -ms-flexbox;
+ display: flex;
+}
+
+.card-header-title {
+ -webkit-box-align: center;
+ -ms-flex-align: center;
+ align-items: center;
+ color: #363636;
+ display: -webkit-box;
+ display: -ms-flexbox;
+ display: flex;
+ -webkit-box-flex: 1;
+ -ms-flex-positive: 1;
+ flex-grow: 1;
+ font-weight: 700;
+ padding: 0.75rem;
+}
+
+.card-header-icon {
+ -webkit-box-align: center;
+ -ms-flex-align: center;
+ align-items: center;
+ cursor: pointer;
+ display: -webkit-box;
+ display: -ms-flexbox;
+ display: flex;
+ -webkit-box-pack: center;
+ -ms-flex-pack: center;
+ justify-content: center;
+ padding: 0.75rem;
+}
+
+.card-image {
+ display: block;
+ position: relative;
+}
+
+.card-content {
+ padding: 1.5rem;
+}
+
+.card-footer {
+ border-top: 1px solid #dbdbdb;
+ -webkit-box-align: stretch;
+ -ms-flex-align: stretch;
+ align-items: stretch;
+ display: -webkit-box;
+ display: -ms-flexbox;
+ display: flex;
+}
+
+.card-footer-item {
+ -webkit-box-align: center;
+ -ms-flex-align: center;
+ align-items: center;
+ display: -webkit-box;
+ display: -ms-flexbox;
+ display: flex;
+ -ms-flex-preferred-size: 0;
+ flex-basis: 0;
+ -webkit-box-flex: 1;
+ -ms-flex-positive: 1;
+ flex-grow: 1;
+ -ms-flex-negative: 0;
+ flex-shrink: 0;
+ -webkit-box-pack: center;
+ -ms-flex-pack: center;
+ justify-content: center;
+ padding: 0.75rem;
+}
+
+.card-footer-item:not(:last-child) {
+ border-right: 1px solid #dbdbdb;
+}
+
+.card .media:not(:last-child) {
+ margin-bottom: 0.75rem;
+}
+
+.dropdown {
+ display: -webkit-inline-box;
+ display: -ms-inline-flexbox;
+ display: inline-flex;
+ position: relative;
+ vertical-align: top;
+}
+
+.dropdown.is-active .dropdown-menu, .dropdown.is-hoverable:hover .dropdown-menu {
+ display: block;
+}
+
+.dropdown.is-right .dropdown-menu {
+ left: auto;
+ right: 0;
+}
+
+.dropdown-menu {
+ display: none;
+ left: 0;
+ min-width: 12rem;
+ padding-top: 4px;
+ position: absolute;
+ top: 100%;
+ z-index: 20;
+}
+
+.dropdown-content {
+ background-color: white;
+ border-radius: 3px;
+ -webkit-box-shadow: 0 2px 3px rgba(10, 10, 10, 0.1), 0 0 0 1px rgba(10, 10, 10, 0.1);
+ box-shadow: 0 2px 3px rgba(10, 10, 10, 0.1), 0 0 0 1px rgba(10, 10, 10, 0.1);
+ padding-bottom: 0.5rem;
+ padding-top: 0.5rem;
+}
+
+.dropdown-item {
+ color: #4a4a4a;
+ display: block;
+ font-size: 0.875rem;
+ line-height: 1.5;
+ padding: 0.375rem 1rem;
+ position: relative;
+}
+
+a.dropdown-item {
+ padding-right: 3rem;
+ white-space: nowrap;
+}
+
+a.dropdown-item:hover {
+ background-color: whitesmoke;
+ color: #0a0a0a;
+}
+
+a.dropdown-item.is-active {
+ background-color: #00d1b2;
+ color: #fff;
+}
+
+.dropdown-divider {
+ background-color: #dbdbdb;
+ border: none;
+ display: block;
+ height: 1px;
+ margin: 0.5rem 0;
+}
+
+.level {
+ -webkit-box-align: center;
+ -ms-flex-align: center;
+ align-items: center;
+ -webkit-box-pack: justify;
+ -ms-flex-pack: justify;
+ justify-content: space-between;
+}
+
+.level:not(:last-child) {
+ margin-bottom: 1.5rem;
+}
+
+.level code {
+ border-radius: 3px;
+}
+
+.level img {
+ display: inline-block;
+ vertical-align: top;
+}
+
+.level.is-mobile {
+ display: -webkit-box;
+ display: -ms-flexbox;
+ display: flex;
+}
+
+.level.is-mobile .level-left,
+.level.is-mobile .level-right {
+ display: -webkit-box;
+ display: -ms-flexbox;
+ display: flex;
+}
+
+.level.is-mobile .level-left + .level-right {
+ margin-top: 0;
+}
+
+.level.is-mobile .level-item:not(:last-child) {
+ margin-bottom: 0;
+}
+
+.level.is-mobile .level-item:not(.is-narrow) {
+ -webkit-box-flex: 1;
+ -ms-flex-positive: 1;
+ flex-grow: 1;
+}
+
+@media screen and (min-width: 769px), print {
+ .level {
+ display: -webkit-box;
+ display: -ms-flexbox;
+ display: flex;
+ }
+ .level > .level-item:not(.is-narrow) {
+ -webkit-box-flex: 1;
+ -ms-flex-positive: 1;
+ flex-grow: 1;
+ }
+}
+
+.level-item {
+ -webkit-box-align: center;
+ -ms-flex-align: center;
+ align-items: center;
+ display: -webkit-box;
+ display: -ms-flexbox;
+ display: flex;
+ -ms-flex-preferred-size: auto;
+ flex-basis: auto;
+ -webkit-box-flex: 0;
+ -ms-flex-positive: 0;
+ flex-grow: 0;
+ -ms-flex-negative: 0;
+ flex-shrink: 0;
+ -webkit-box-pack: center;
+ -ms-flex-pack: center;
+ justify-content: center;
+}
+
+.level-item .title,
+.level-item .subtitle {
+ margin-bottom: 0;
+}
+
+@media screen and (max-width: 768px) {
+ .level-item:not(:last-child) {
+ margin-bottom: 0.75rem;
+ }
+}
+
+.level-left,
+.level-right {
+ -ms-flex-preferred-size: auto;
+ flex-basis: auto;
+ -webkit-box-flex: 0;
+ -ms-flex-positive: 0;
+ flex-grow: 0;
+ -ms-flex-negative: 0;
+ flex-shrink: 0;
+}
+
+.level-left .level-item:not(:last-child),
+.level-right .level-item:not(:last-child) {
+ margin-right: 0.75rem;
+}
+
+.level-left .level-item.is-flexible,
+.level-right .level-item.is-flexible {
+ -webkit-box-flex: 1;
+ -ms-flex-positive: 1;
+ flex-grow: 1;
+}
+
+.level-left {
+ -webkit-box-align: center;
+ -ms-flex-align: center;
+ align-items: center;
+ -webkit-box-pack: start;
+ -ms-flex-pack: start;
+ justify-content: flex-start;
+}
+
+@media screen and (max-width: 768px) {
+ .level-left + .level-right {
+ margin-top: 1.5rem;
+ }
+}
+
+@media screen and (min-width: 769px), print {
+ .level-left {
+ display: -webkit-box;
+ display: -ms-flexbox;
+ display: flex;
+ }
+}
+
+.level-right {
+ -webkit-box-align: center;
+ -ms-flex-align: center;
+ align-items: center;
+ -webkit-box-pack: end;
+ -ms-flex-pack: end;
+ justify-content: flex-end;
+}
+
+@media screen and (min-width: 769px), print {
+ .level-right {
+ display: -webkit-box;
+ display: -ms-flexbox;
+ display: flex;
+ }
+}
+
+.media {
+ -webkit-box-align: start;
+ -ms-flex-align: start;
+ align-items: flex-start;
+ display: -webkit-box;
+ display: -ms-flexbox;
+ display: flex;
+ text-align: left;
+}
+
+.media .content:not(:last-child) {
+ margin-bottom: 0.75rem;
+}
+
+.media .media {
+ border-top: 1px solid rgba(219, 219, 219, 0.5);
+ display: -webkit-box;
+ display: -ms-flexbox;
+ display: flex;
+ padding-top: 0.75rem;
+}
+
+.media .media .content:not(:last-child),
+.media .media .control:not(:last-child) {
+ margin-bottom: 0.5rem;
+}
+
+.media .media .media {
+ padding-top: 0.5rem;
+}
+
+.media .media .media + .media {
+ margin-top: 0.5rem;
+}
+
+.media + .media {
+ border-top: 1px solid rgba(219, 219, 219, 0.5);
+ margin-top: 1rem;
+ padding-top: 1rem;
+}
+
+.media.is-large + .media {
+ margin-top: 1.5rem;
+ padding-top: 1.5rem;
+}
+
+.media-left,
+.media-right {
+ -ms-flex-preferred-size: auto;
+ flex-basis: auto;
+ -webkit-box-flex: 0;
+ -ms-flex-positive: 0;
+ flex-grow: 0;
+ -ms-flex-negative: 0;
+ flex-shrink: 0;
+}
+
+.media-left {
+ margin-right: 1rem;
+}
+
+.media-right {
+ margin-left: 1rem;
+}
+
+.media-content {
+ -ms-flex-preferred-size: auto;
+ flex-basis: auto;
+ -webkit-box-flex: 1;
+ -ms-flex-positive: 1;
+ flex-grow: 1;
+ -ms-flex-negative: 1;
+ flex-shrink: 1;
+ text-align: left;
+}
+
+.menu {
+ font-size: 1rem;
+}
+
+.menu.is-small {
+ font-size: 0.75rem;
+}
+
+.menu.is-medium {
+ font-size: 1.25rem;
+}
+
+.menu.is-large {
+ font-size: 1.5rem;
+}
+
+.menu-list {
+ line-height: 1.25;
+}
+
+.menu-list a {
+ border-radius: 2px;
+ color: #4a4a4a;
+ display: block;
+ padding: 0.5em 0.75em;
+}
+
+.menu-list a:hover {
+ background-color: whitesmoke;
+ color: #363636;
+}
+
+.menu-list a.is-active {
+ background-color: #00d1b2;
+ color: #fff;
+}
+
+.menu-list li ul {
+ border-left: 1px solid #dbdbdb;
+ margin: 0.75em;
+ padding-left: 0.75em;
+}
+
+.menu-label {
+ color: #7a7a7a;
+ font-size: 0.75em;
+ letter-spacing: 0.1em;
+ text-transform: uppercase;
+}
+
+.menu-label:not(:first-child) {
+ margin-top: 1em;
+}
+
+.menu-label:not(:last-child) {
+ margin-bottom: 1em;
+}
+
+.message {
+ background-color: whitesmoke;
+ border-radius: 3px;
+ font-size: 1rem;
+}
+
+.message:not(:last-child) {
+ margin-bottom: 1.5rem;
+}
+
+.message.is-small {
+ font-size: 0.75rem;
+}
+
+.message.is-medium {
+ font-size: 1.25rem;
+}
+
+.message.is-large {
+ font-size: 1.5rem;
+}
+
+.message.is-white {
+ background-color: white;
+}
+
+.message.is-white .message-header {
+ background-color: white;
+ color: #0a0a0a;
+}
+
+.message.is-white .message-body {
+ border-color: white;
+ color: #4d4d4d;
+}
+
+.message.is-black {
+ background-color: #fafafa;
+}
+
+.message.is-black .message-header {
+ background-color: #0a0a0a;
+ color: white;
+}
+
+.message.is-black .message-body {
+ border-color: #0a0a0a;
+ color: #090909;
+}
+
+.message.is-light {
+ background-color: #fafafa;
+}
+
+.message.is-light .message-header {
+ background-color: whitesmoke;
+ color: #363636;
+}
+
+.message.is-light .message-body {
+ border-color: whitesmoke;
+ color: #505050;
+}
+
+.message.is-dark {
+ background-color: #fafafa;
+}
+
+.message.is-dark .message-header {
+ background-color: #363636;
+ color: whitesmoke;
+}
+
+.message.is-dark .message-body {
+ border-color: #363636;
+ color: #2a2a2a;
+}
+
+.message.is-primary {
+ background-color: #f5fffd;
+}
+
+.message.is-primary .message-header {
+ background-color: #00d1b2;
+ color: #fff;
+}
+
+.message.is-primary .message-body {
+ border-color: #00d1b2;
+ color: #021310;
+}
+
+.message.is-info {
+ background-color: #f6f9fe;
+}
+
+.message.is-info .message-header {
+ background-color: #3273dc;
+ color: #fff;
+}
+
+.message.is-info .message-body {
+ border-color: #3273dc;
+ color: #22509a;
+}
+
+.message.is-success {
+ background-color: #f6fef9;
+}
+
+.message.is-success .message-header {
+ background-color: #23d160;
+ color: #fff;
+}
+
+.message.is-success .message-body {
+ border-color: #23d160;
+ color: #0e301a;
+}
+
+.message.is-warning {
+ background-color: #fffdf5;
+}
+
+.message.is-warning .message-header {
+ background-color: #ffdd57;
+ color: rgba(0, 0, 0, 0.7);
+}
+
+.message.is-warning .message-body {
+ border-color: #ffdd57;
+ color: #3b3108;
+}
+
+.message.is-danger {
+ background-color: #fff5f7;
+}
+
+.message.is-danger .message-header {
+ background-color: #ff3860;
+ color: #fff;
+}
+
+.message.is-danger .message-body {
+ border-color: #ff3860;
+ color: #cd0930;
+}
+
+.message-header {
+ -webkit-box-align: center;
+ -ms-flex-align: center;
+ align-items: center;
+ background-color: #4a4a4a;
+ border-radius: 3px 3px 0 0;
+ color: #fff;
+ display: -webkit-box;
+ display: -ms-flexbox;
+ display: flex;
+ -webkit-box-pack: justify;
+ -ms-flex-pack: justify;
+ justify-content: space-between;
+ line-height: 1.25;
+ padding: 0.5em 0.75em;
+ position: relative;
+}
+
+.message-header a:not(.button),
+.message-header strong {
+ color: currentColor;
+}
+
+.message-header a:not(.button) {
+ text-decoration: underline;
+}
+
+.message-header .delete {
+ -webkit-box-flex: 0;
+ -ms-flex-positive: 0;
+ flex-grow: 0;
+ -ms-flex-negative: 0;
+ flex-shrink: 0;
+ margin-left: 0.75em;
+}
+
+.message-header + .message-body {
+ border-top-left-radius: 0;
+ border-top-right-radius: 0;
+ border-top: none;
+}
+
+.message-body {
+ border: 1px solid #dbdbdb;
+ border-radius: 3px;
+ color: #4a4a4a;
+ padding: 1em 1.25em;
+}
+
+.message-body a:not(.button),
+.message-body strong {
+ color: currentColor;
+}
+
+.message-body a:not(.button) {
+ text-decoration: underline;
+}
+
+.message-body code,
+.message-body pre {
+ background-color: white;
+}
+
+.message-body pre code {
+ background-color: transparent;
+}
+
+.modal {
+ bottom: 0;
+ left: 0;
+ position: absolute;
+ right: 0;
+ top: 0;
+ -webkit-box-align: center;
+ -ms-flex-align: center;
+ align-items: center;
+ display: none;
+ -webkit-box-pack: center;
+ -ms-flex-pack: center;
+ justify-content: center;
+ overflow: hidden;
+ position: fixed;
+ z-index: 20;
+}
+
+.modal.is-active {
+ display: -webkit-box;
+ display: -ms-flexbox;
+ display: flex;
+}
+
+.modal-background {
+ bottom: 0;
+ left: 0;
+ position: absolute;
+ right: 0;
+ top: 0;
+ background-color: rgba(10, 10, 10, 0.86);
+}
+
+.modal-content,
+.modal-card {
+ margin: 0 20px;
+ max-height: calc(100vh - 160px);
+ overflow: auto;
+ position: relative;
+ width: 100%;
+}
+
+@media screen and (min-width: 769px), print {
+ .modal-content,
+ .modal-card {
+ margin: 0 auto;
+ max-height: calc(100vh - 40px);
+ width: 640px;
+ }
+}
+
+.modal-close {
+ -webkit-touch-callout: none;
+ -webkit-user-select: none;
+ -moz-user-select: none;
+ -ms-user-select: none;
+ user-select: none;
+ -moz-appearance: none;
+ -webkit-appearance: none;
+ background-color: rgba(10, 10, 10, 0.2);
+ border: none;
+ border-radius: 290486px;
+ cursor: pointer;
+ display: inline-block;
+ -webkit-box-flex: 0;
+ -ms-flex-positive: 0;
+ flex-grow: 0;
+ -ms-flex-negative: 0;
+ flex-shrink: 0;
+ font-size: 1rem;
+ height: 20px;
+ max-height: 20px;
+ max-width: 20px;
+ min-height: 20px;
+ min-width: 20px;
+ outline: none;
+ position: relative;
+ vertical-align: top;
+ width: 20px;
+ background: none;
+ height: 40px;
+ position: fixed;
+ right: 20px;
+ top: 20px;
+ width: 40px;
+}
+
+.modal-close:before, .modal-close:after {
+ background-color: white;
+ content: "";
+ display: block;
+ left: 50%;
+ position: absolute;
+ top: 50%;
+ -webkit-transform: translateX(-50%) translateY(-50%) rotate(45deg);
+ transform: translateX(-50%) translateY(-50%) rotate(45deg);
+ -webkit-transform-origin: center center;
+ transform-origin: center center;
+}
+
+.modal-close:before {
+ height: 2px;
+ width: 50%;
+}
+
+.modal-close:after {
+ height: 50%;
+ width: 2px;
+}
+
+.modal-close:hover, .modal-close:focus {
+ background-color: rgba(10, 10, 10, 0.3);
+}
+
+.modal-close:active {
+ background-color: rgba(10, 10, 10, 0.4);
+}
+
+.modal-close.is-small {
+ height: 16px;
+ max-height: 16px;
+ max-width: 16px;
+ min-height: 16px;
+ min-width: 16px;
+ width: 16px;
+}
+
+.modal-close.is-medium {
+ height: 24px;
+ max-height: 24px;
+ max-width: 24px;
+ min-height: 24px;
+ min-width: 24px;
+ width: 24px;
+}
+
+.modal-close.is-large {
+ height: 32px;
+ max-height: 32px;
+ max-width: 32px;
+ min-height: 32px;
+ min-width: 32px;
+ width: 32px;
+}
+
+.modal-card {
+ display: -webkit-box;
+ display: -ms-flexbox;
+ display: flex;
+ -webkit-box-orient: vertical;
+ -webkit-box-direction: normal;
+ -ms-flex-direction: column;
+ flex-direction: column;
+ max-height: calc(100vh - 40px);
+ overflow: hidden;
+}
+
+.modal-card-head,
+.modal-card-foot {
+ -webkit-box-align: center;
+ -ms-flex-align: center;
+ align-items: center;
+ background-color: whitesmoke;
+ display: -webkit-box;
+ display: -ms-flexbox;
+ display: flex;
+ -ms-flex-negative: 0;
+ flex-shrink: 0;
+ -webkit-box-pack: start;
+ -ms-flex-pack: start;
+ justify-content: flex-start;
+ padding: 20px;
+ position: relative;
+}
+
+.modal-card-head {
+ border-bottom: 1px solid #dbdbdb;
+ border-top-left-radius: 5px;
+ border-top-right-radius: 5px;
+}
+
+.modal-card-title {
+ color: #363636;
+ -webkit-box-flex: 1;
+ -ms-flex-positive: 1;
+ flex-grow: 1;
+ -ms-flex-negative: 0;
+ flex-shrink: 0;
+ font-size: 1.5rem;
+ line-height: 1;
+}
+
+.modal-card-foot {
+ border-bottom-left-radius: 5px;
+ border-bottom-right-radius: 5px;
+ border-top: 1px solid #dbdbdb;
+}
+
+.modal-card-foot .button:not(:last-child) {
+ margin-right: 10px;
+}
+
+.modal-card-body {
+ -webkit-overflow-scrolling: touch;
+ background-color: white;
+ -webkit-box-flex: 1;
+ -ms-flex-positive: 1;
+ flex-grow: 1;
+ -ms-flex-negative: 1;
+ flex-shrink: 1;
+ overflow: auto;
+ padding: 20px;
+}
+
+.nav-toggle {
+ cursor: pointer;
+ display: block;
+ height: 3.25rem;
+ position: relative;
+ width: 3.25rem;
+}
+
+.nav-toggle span {
+ background-color: #4a4a4a;
+ display: block;
+ height: 1px;
+ left: 50%;
+ margin-left: -7px;
+ position: absolute;
+ top: 50%;
+ -webkit-transition: none 86ms ease-out;
+ transition: none 86ms ease-out;
+ -webkit-transition-property: background, left, opacity, -webkit-transform;
+ transition-property: background, left, opacity, -webkit-transform;
+ transition-property: background, left, opacity, transform;
+ transition-property: background, left, opacity, transform, -webkit-transform;
+ width: 15px;
+}
+
+.nav-toggle span:nth-child(1) {
+ margin-top: -6px;
+}
+
+.nav-toggle span:nth-child(2) {
+ margin-top: -1px;
+}
+
+.nav-toggle span:nth-child(3) {
+ margin-top: 4px;
+}
+
+.nav-toggle:hover {
+ background-color: whitesmoke;
+}
+
+.nav-toggle.is-active span {
+ background-color: #00d1b2;
+}
+
+.nav-toggle.is-active span:nth-child(1) {
+ margin-left: -5px;
+ -webkit-transform: rotate(45deg);
+ transform: rotate(45deg);
+ -webkit-transform-origin: left top;
+ transform-origin: left top;
+}
+
+.nav-toggle.is-active span:nth-child(2) {
+ opacity: 0;
+}
+
+.nav-toggle.is-active span:nth-child(3) {
+ margin-left: -5px;
+ -webkit-transform: rotate(-45deg);
+ transform: rotate(-45deg);
+ -webkit-transform-origin: left bottom;
+ transform-origin: left bottom;
+}
+
+@media screen and (min-width: 769px), print {
+ .nav-toggle {
+ display: none;
+ }
+}
+
+.nav-item {
+ -webkit-box-align: center;
+ -ms-flex-align: center;
+ align-items: center;
+ display: -webkit-box;
+ display: -ms-flexbox;
+ display: flex;
+ -webkit-box-flex: 0;
+ -ms-flex-positive: 0;
+ flex-grow: 0;
+ -ms-flex-negative: 0;
+ flex-shrink: 0;
+ font-size: 1rem;
+ -webkit-box-pack: center;
+ -ms-flex-pack: center;
+ justify-content: center;
+ line-height: 1.5;
+ padding: 0.5rem 0.75rem;
+}
+
+.nav-item a {
+ -webkit-box-flex: 1;
+ -ms-flex-positive: 1;
+ flex-grow: 1;
+ -ms-flex-negative: 0;
+ flex-shrink: 0;
+}
+
+.nav-item img {
+ max-height: 1.75rem;
+}
+
+.nav-item .tag:first-child:not(:last-child) {
+ margin-right: 0.5rem;
+}
+
+.nav-item .tag:last-child:not(:first-child) {
+ margin-left: 0.5rem;
+}
+
+@media screen and (max-width: 768px) {
+ .nav-item {
+ -webkit-box-pack: start;
+ -ms-flex-pack: start;
+ justify-content: flex-start;
+ }
+}
+
+.nav-item a:not(.button),
+a.nav-item:not(.button) {
+ color: #7a7a7a;
+}
+
+.nav-item a:not(.button):hover,
+a.nav-item:not(.button):hover {
+ color: #363636;
+}
+
+.nav-item a:not(.button).is-active,
+a.nav-item:not(.button).is-active {
+ color: #363636;
+}
+
+.nav-item a:not(.button).is-tab,
+a.nav-item:not(.button).is-tab {
+ border-bottom: 1px solid transparent;
+ border-top: 1px solid transparent;
+ padding-bottom: calc(0.75rem - 1px);
+ padding-left: 1rem;
+ padding-right: 1rem;
+ padding-top: calc(0.75rem - 1px);
+}
+
+.nav-item a:not(.button).is-tab:hover,
+a.nav-item:not(.button).is-tab:hover {
+ border-bottom-color: #00d1b2;
+ border-top-color: transparent;
+}
+
+.nav-item a:not(.button).is-tab.is-active,
+a.nav-item:not(.button).is-tab.is-active {
+ border-bottom: 3px solid #00d1b2;
+ color: #00d1b2;
+ padding-bottom: calc(0.75rem - 3px);
+}
+
+@media screen and (min-width: 1008px) {
+ .nav-item a:not(.button).is-brand,
+ a.nav-item:not(.button).is-brand {
+ padding-left: 0;
+ }
+}
+
+.nav-left,
+.nav-right {
+ -webkit-overflow-scrolling: touch;
+ -webkit-box-align: stretch;
+ -ms-flex-align: stretch;
+ align-items: stretch;
+ display: -webkit-box;
+ display: -ms-flexbox;
+ display: flex;
+ -webkit-box-flex: 1;
+ -ms-flex-positive: 1;
+ flex-grow: 1;
+ -ms-flex-negative: 0;
+ flex-shrink: 0;
+ max-width: 100%;
+ overflow: auto;
+}
+
+@media screen and (min-width: 1200px) {
+ .nav-left,
+ .nav-right {
+ -ms-flex-preferred-size: 0;
+ flex-basis: 0;
+ }
+}
+
+.nav-left {
+ -webkit-box-pack: start;
+ -ms-flex-pack: start;
+ justify-content: flex-start;
+ white-space: nowrap;
+}
+
+.nav-right {
+ -webkit-box-pack: end;
+ -ms-flex-pack: end;
+ justify-content: flex-end;
+}
+
+.nav-center {
+ -webkit-box-align: stretch;
+ -ms-flex-align: stretch;
+ align-items: stretch;
+ display: -webkit-box;
+ display: -ms-flexbox;
+ display: flex;
+ -webkit-box-flex: 0;
+ -ms-flex-positive: 0;
+ flex-grow: 0;
+ -ms-flex-negative: 0;
+ flex-shrink: 0;
+ -webkit-box-pack: center;
+ -ms-flex-pack: center;
+ justify-content: center;
+ margin-left: auto;
+ margin-right: auto;
+}
+
+@media screen and (max-width: 768px) {
+ .nav-menu.nav-right {
+ background-color: white;
+ -webkit-box-shadow: 0 4px 7px rgba(10, 10, 10, 0.1);
+ box-shadow: 0 4px 7px rgba(10, 10, 10, 0.1);
+ left: 0;
+ display: none;
+ right: 0;
+ top: 100%;
+ position: absolute;
+ }
+ .nav-menu.nav-right .nav-item {
+ border-top: 1px solid rgba(219, 219, 219, 0.5);
+ padding: 0.75rem;
+ }
+ .nav-menu.nav-right.is-active {
+ display: block;
+ }
+}
+
+.nav {
+ -webkit-box-align: stretch;
+ -ms-flex-align: stretch;
+ align-items: stretch;
+ background-color: white;
+ display: -webkit-box;
+ display: -ms-flexbox;
+ display: flex;
+ height: 3.25rem;
+ position: relative;
+ text-align: center;
+ z-index: 10;
+}
+
+.nav > .container {
+ -webkit-box-align: stretch;
+ -ms-flex-align: stretch;
+ align-items: stretch;
+ display: -webkit-box;
+ display: -ms-flexbox;
+ display: flex;
+ min-height: 3.25rem;
+ width: 100%;
+}
+
+.nav.has-shadow {
+ -webkit-box-shadow: 0 2px 3px rgba(10, 10, 10, 0.1);
+ box-shadow: 0 2px 3px rgba(10, 10, 10, 0.1);
+}
+
+.navbar {
+ background-color: white;
+ min-height: 3.25rem;
+ position: relative;
+}
+
+.navbar > .container {
+ -webkit-box-align: stretch;
+ -ms-flex-align: stretch;
+ align-items: stretch;
+ display: -webkit-box;
+ display: -ms-flexbox;
+ display: flex;
+ min-height: 3.25rem;
+ width: 100%;
+}
+
+.navbar.has-shadow {
+ -webkit-box-shadow: 0 2px 3px rgba(10, 10, 10, 0.1);
+ box-shadow: 0 2px 3px rgba(10, 10, 10, 0.1);
+}
+
+.navbar-brand {
+ -webkit-overflow-scrolling: touch;
+ -webkit-box-align: stretch;
+ -ms-flex-align: stretch;
+ align-items: stretch;
+ display: -webkit-box;
+ display: -ms-flexbox;
+ display: flex;
+ -ms-flex-negative: 0;
+ flex-shrink: 0;
+ max-width: 100vw;
+ min-height: 3.25rem;
+ overflow-x: auto;
+ overflow-y: hidden;
+}
+
+.navbar-burger {
+ cursor: pointer;
+ display: block;
+ height: 3.25rem;
+ position: relative;
+ width: 3.25rem;
+ margin-left: auto;
+}
+
+.navbar-burger span {
+ background-color: #4a4a4a;
+ display: block;
+ height: 1px;
+ left: 50%;
+ margin-left: -7px;
+ position: absolute;
+ top: 50%;
+ -webkit-transition: none 86ms ease-out;
+ transition: none 86ms ease-out;
+ -webkit-transition-property: background, left, opacity, -webkit-transform;
+ transition-property: background, left, opacity, -webkit-transform;
+ transition-property: background, left, opacity, transform;
+ transition-property: background, left, opacity, transform, -webkit-transform;
+ width: 15px;
+}
+
+.navbar-burger span:nth-child(1) {
+ margin-top: -6px;
+}
+
+.navbar-burger span:nth-child(2) {
+ margin-top: -1px;
+}
+
+.navbar-burger span:nth-child(3) {
+ margin-top: 4px;
+}
+
+.navbar-burger:hover {
+ background-color: whitesmoke;
+}
+
+.navbar-burger.is-active span {
+ background-color: #00d1b2;
+}
+
+.navbar-burger.is-active span:nth-child(1) {
+ margin-left: -5px;
+ -webkit-transform: rotate(45deg);
+ transform: rotate(45deg);
+ -webkit-transform-origin: left top;
+ transform-origin: left top;
+}
+
+.navbar-burger.is-active span:nth-child(2) {
+ opacity: 0;
+}
+
+.navbar-burger.is-active span:nth-child(3) {
+ margin-left: -5px;
+ -webkit-transform: rotate(-45deg);
+ transform: rotate(-45deg);
+ -webkit-transform-origin: left bottom;
+ transform-origin: left bottom;
+}
+
+.navbar-menu {
+ display: none;
+}
+
+.navbar-item,
+.navbar-link {
+ color: #4a4a4a;
+ display: block;
+ line-height: 1.5;
+ padding: 0.5rem 1rem;
+ position: relative;
+}
+
+a.navbar-item:hover, a.navbar-item.is-active,
+.navbar-link:hover,
+.navbar-link.is-active {
+ background-color: whitesmoke;
+ color: #0a0a0a;
+}
+
+.navbar-item {
+ -webkit-box-flex: 0;
+ -ms-flex-positive: 0;
+ flex-grow: 0;
+ -ms-flex-negative: 0;
+ flex-shrink: 0;
+}
+
+.navbar-item img {
+ max-height: 1.75rem;
+}
+
+.navbar-item.has-dropdown {
+ padding: 0;
+}
+
+.navbar-item.is-tab {
+ border-bottom: 1px solid transparent;
+ min-height: 3.25rem;
+ padding-bottom: calc(0.5rem - 1px);
+}
+
+.navbar-item.is-tab:hover {
+ background-color: transparent;
+ border-bottom-color: #00d1b2;
+}
+
+.navbar-item.is-tab.is-active {
+ background-color: transparent;
+ border-bottom-color: #00d1b2;
+ border-bottom-style: solid;
+ border-bottom-width: 3px;
+ color: #00d1b2;
+ padding-bottom: calc(0.5rem - 3px);
+}
+
+.navbar-content {
+ -webkit-box-flex: 1;
+ -ms-flex-positive: 1;
+ flex-grow: 1;
+ -ms-flex-negative: 1;
+ flex-shrink: 1;
+}
+
+.navbar-link {
+ padding-right: 2.5em;
+}
+
+.navbar-dropdown {
+ font-size: 0.875rem;
+ padding-bottom: 0.5rem;
+ padding-top: 0.5rem;
+}
+
+.navbar-dropdown .navbar-item {
+ padding-left: 1.5rem;
+ padding-right: 1.5rem;
+}
+
+.navbar-divider {
+ background-color: #dbdbdb;
+ border: none;
+ display: none;
+ height: 1px;
+ margin: 0.5rem 0;
+}
+
+@media screen and (max-width: 1007px) {
+ .navbar > .container {
+ display: block;
+ }
+ .navbar-brand .navbar-item {
+ -webkit-box-align: center;
+ -ms-flex-align: center;
+ align-items: center;
+ display: -webkit-box;
+ display: -ms-flexbox;
+ display: flex;
+ }
+ .navbar-menu {
+ -webkit-box-shadow: 0 8px 16px rgba(10, 10, 10, 0.1);
+ box-shadow: 0 8px 16px rgba(10, 10, 10, 0.1);
+ padding: 0.5rem 0;
+ }
+ .navbar-menu.is-active {
+ display: block;
+ }
+}
+
+@media screen and (min-width: 1008px) {
+ .navbar,
+ .navbar-menu,
+ .navbar-start,
+ .navbar-end {
+ -webkit-box-align: stretch;
+ -ms-flex-align: stretch;
+ align-items: stretch;
+ display: -webkit-box;
+ display: -ms-flexbox;
+ display: flex;
+ }
+ .navbar {
+ min-height: 3.25rem;
+ }
+ .navbar.is-transparent a.navbar-item:hover, .navbar.is-transparent a.navbar-item.is-active,
+ .navbar.is-transparent .navbar-link:hover,
+ .navbar.is-transparent .navbar-link.is-active {
+ background-color: transparent;
+ }
+ .navbar.is-transparent .navbar-item.has-dropdown.is-active .navbar-link, .navbar.is-transparent .navbar-item.has-dropdown.is-hoverable:hover .navbar-link {
+ background-color: transparent;
+ }
+ .navbar.is-transparent .navbar-dropdown a.navbar-item:hover {
+ background-color: whitesmoke;
+ color: #0a0a0a;
+ }
+ .navbar.is-transparent .navbar-dropdown a.navbar-item.is-active {
+ background-color: whitesmoke;
+ color: #00d1b2;
+ }
+ .navbar-burger {
+ display: none;
+ }
+ .navbar-item,
+ .navbar-link {
+ -webkit-box-align: center;
+ -ms-flex-align: center;
+ align-items: center;
+ display: -webkit-box;
+ display: -ms-flexbox;
+ display: flex;
+ }
+ .navbar-item.has-dropdown {
+ -webkit-box-align: stretch;
+ -ms-flex-align: stretch;
+ align-items: stretch;
+ }
+ .navbar-item.is-active .navbar-dropdown, .navbar-item.is-hoverable:hover .navbar-dropdown {
+ display: block;
+ }
+ .navbar-item.is-active .navbar-dropdown.is-boxed, .navbar-item.is-hoverable:hover .navbar-dropdown.is-boxed {
+ opacity: 1;
+ pointer-events: auto;
+ -webkit-transform: translateY(0);
+ transform: translateY(0);
+ }
+ .navbar-link::after {
+ border: 1px solid #00d1b2;
+ border-right: 0;
+ border-top: 0;
+ content: " ";
+ display: block;
+ height: 0.5em;
+ pointer-events: none;
+ position: absolute;
+ -webkit-transform: rotate(-45deg);
+ transform: rotate(-45deg);
+ width: 0.5em;
+ margin-top: -0.375em;
+ right: 1.125em;
+ top: 50%;
+ }
+ .navbar-menu {
+ -webkit-box-flex: 1;
+ -ms-flex-positive: 1;
+ flex-grow: 1;
+ -ms-flex-negative: 0;
+ flex-shrink: 0;
+ }
+ .navbar-start {
+ -webkit-box-pack: start;
+ -ms-flex-pack: start;
+ justify-content: flex-start;
+ margin-right: auto;
+ }
+ .navbar-end {
+ -webkit-box-pack: end;
+ -ms-flex-pack: end;
+ justify-content: flex-end;
+ margin-left: auto;
+ }
+ .navbar-dropdown {
+ background-color: white;
+ border-bottom-left-radius: 5px;
+ border-bottom-right-radius: 5px;
+ border-top: 1px solid #dbdbdb;
+ -webkit-box-shadow: 0 8px 8px rgba(10, 10, 10, 0.1);
+ box-shadow: 0 8px 8px rgba(10, 10, 10, 0.1);
+ display: none;
+ font-size: 0.875rem;
+ left: 0;
+ min-width: 100%;
+ position: absolute;
+ top: 100%;
+ z-index: 20;
+ }
+ .navbar-dropdown .navbar-item {
+ padding: 0.375rem 1rem;
+ white-space: nowrap;
+ }
+ .navbar-dropdown a.navbar-item {
+ padding-right: 3rem;
+ }
+ .navbar-dropdown a.navbar-item:hover {
+ background-color: whitesmoke;
+ color: #0a0a0a;
+ }
+ .navbar-dropdown a.navbar-item.is-active {
+ background-color: whitesmoke;
+ color: #00d1b2;
+ }
+ .navbar-dropdown.is-boxed {
+ border-radius: 5px;
+ border-top: none;
+ -webkit-box-shadow: 0 8px 8px rgba(10, 10, 10, 0.1), 0 0 0 1px rgba(10, 10, 10, 0.1);
+ box-shadow: 0 8px 8px rgba(10, 10, 10, 0.1), 0 0 0 1px rgba(10, 10, 10, 0.1);
+ display: block;
+ opacity: 0;
+ pointer-events: none;
+ top: calc(100% + (-4px));
+ -webkit-transform: translateY(-5px);
+ transform: translateY(-5px);
+ -webkit-transition-duration: 86ms;
+ transition-duration: 86ms;
+ -webkit-transition-property: opacity, -webkit-transform;
+ transition-property: opacity, -webkit-transform;
+ transition-property: opacity, transform;
+ transition-property: opacity, transform, -webkit-transform;
+ }
+ .navbar-dropdown.is-right {
+ left: auto;
+ right: 0;
+ }
+ .navbar-divider {
+ display: block;
+ }
+ .container > .navbar {
+ margin-left: -1rem;
+ margin-right: -1rem;
+ }
+ a.navbar-item.is-active,
+ .navbar-link.is-active {
+ color: #0a0a0a;
+ }
+ a.navbar-item.is-active:not(:hover),
+ .navbar-link.is-active:not(:hover) {
+ background-color: transparent;
+ }
+ .navbar-item.has-dropdown:hover .navbar-link, .navbar-item.has-dropdown.is-active .navbar-link {
+ background-color: whitesmoke;
+ }
+}
+
+.pagination {
+ font-size: 1rem;
+ margin: -0.25rem;
+}
+
+.pagination.is-small {
+ font-size: 0.75rem;
+}
+
+.pagination.is-medium {
+ font-size: 1.25rem;
+}
+
+.pagination.is-large {
+ font-size: 1.5rem;
+}
+
+.pagination,
+.pagination-list {
+ -webkit-box-align: center;
+ -ms-flex-align: center;
+ align-items: center;
+ display: -webkit-box;
+ display: -ms-flexbox;
+ display: flex;
+ -webkit-box-pack: center;
+ -ms-flex-pack: center;
+ justify-content: center;
+ text-align: center;
+}
+
+.pagination-previous,
+.pagination-next,
+.pagination-link,
+.pagination-ellipsis {
+ -moz-appearance: none;
+ -webkit-appearance: none;
+ -webkit-box-align: center;
+ -ms-flex-align: center;
+ align-items: center;
+ border: 1px solid transparent;
+ border-radius: 3px;
+ -webkit-box-shadow: none;
+ box-shadow: none;
+ display: -webkit-inline-box;
+ display: -ms-inline-flexbox;
+ display: inline-flex;
+ font-size: 1rem;
+ height: 2.25em;
+ -webkit-box-pack: start;
+ -ms-flex-pack: start;
+ justify-content: flex-start;
+ line-height: 1.5;
+ padding-bottom: calc(0.375em - 1px);
+ padding-left: calc(0.625em - 1px);
+ padding-right: calc(0.625em - 1px);
+ padding-top: calc(0.375em - 1px);
+ position: relative;
+ vertical-align: top;
+ -webkit-touch-callout: none;
+ -webkit-user-select: none;
+ -moz-user-select: none;
+ -ms-user-select: none;
+ user-select: none;
+ font-size: 1em;
+ padding-left: 0.5em;
+ padding-right: 0.5em;
+ -webkit-box-pack: center;
+ -ms-flex-pack: center;
+ justify-content: center;
+ margin: 0.25rem;
+ text-align: center;
+}
+
+.pagination-previous:focus, .pagination-previous.is-focused, .pagination-previous:active, .pagination-previous.is-active,
+.pagination-next:focus,
+.pagination-next.is-focused,
+.pagination-next:active,
+.pagination-next.is-active,
+.pagination-link:focus,
+.pagination-link.is-focused,
+.pagination-link:active,
+.pagination-link.is-active,
+.pagination-ellipsis:focus,
+.pagination-ellipsis.is-focused,
+.pagination-ellipsis:active,
+.pagination-ellipsis.is-active {
+ outline: none;
+}
+
+.pagination-previous[disabled],
+.pagination-next[disabled],
+.pagination-link[disabled],
+.pagination-ellipsis[disabled] {
+ cursor: not-allowed;
+}
+
+.pagination-previous,
+.pagination-next,
+.pagination-link {
+ border-color: #dbdbdb;
+ min-width: 2.25em;
+}
+
+.pagination-previous:hover,
+.pagination-next:hover,
+.pagination-link:hover {
+ border-color: #b5b5b5;
+ color: #363636;
+}
+
+.pagination-previous:focus,
+.pagination-next:focus,
+.pagination-link:focus {
+ border-color: #00d1b2;
+}
+
+.pagination-previous:active,
+.pagination-next:active,
+.pagination-link:active {
+ -webkit-box-shadow: inset 0 1px 2px rgba(10, 10, 10, 0.2);
+ box-shadow: inset 0 1px 2px rgba(10, 10, 10, 0.2);
+}
+
+.pagination-previous[disabled],
+.pagination-next[disabled],
+.pagination-link[disabled] {
+ background-color: #dbdbdb;
+ border-color: #dbdbdb;
+ -webkit-box-shadow: none;
+ box-shadow: none;
+ color: #7a7a7a;
+ opacity: 0.5;
+}
+
+.pagination-previous,
+.pagination-next {
+ padding-left: 0.75em;
+ padding-right: 0.75em;
+ white-space: nowrap;
+}
+
+.pagination-link.is-current {
+ background-color: #00d1b2;
+ border-color: #00d1b2;
+ color: #fff;
+}
+
+.pagination-ellipsis {
+ color: #b5b5b5;
+ pointer-events: none;
+}
+
+.pagination-list {
+ -ms-flex-wrap: wrap;
+ flex-wrap: wrap;
+}
+
+@media screen and (max-width: 768px) {
+ .pagination {
+ -ms-flex-wrap: wrap;
+ flex-wrap: wrap;
+ }
+ .pagination-previous,
+ .pagination-next {
+ -webkit-box-flex: 1;
+ -ms-flex-positive: 1;
+ flex-grow: 1;
+ -ms-flex-negative: 1;
+ flex-shrink: 1;
+ }
+ .pagination-list li {
+ -webkit-box-flex: 1;
+ -ms-flex-positive: 1;
+ flex-grow: 1;
+ -ms-flex-negative: 1;
+ flex-shrink: 1;
+ }
+}
+
+@media screen and (min-width: 769px), print {
+ .pagination-list {
+ -webkit-box-flex: 1;
+ -ms-flex-positive: 1;
+ flex-grow: 1;
+ -ms-flex-negative: 1;
+ flex-shrink: 1;
+ -webkit-box-pack: start;
+ -ms-flex-pack: start;
+ justify-content: flex-start;
+ -webkit-box-ordinal-group: 2;
+ -ms-flex-order: 1;
+ order: 1;
+ }
+ .pagination-previous {
+ -webkit-box-ordinal-group: 3;
+ -ms-flex-order: 2;
+ order: 2;
+ }
+ .pagination-next {
+ -webkit-box-ordinal-group: 4;
+ -ms-flex-order: 3;
+ order: 3;
+ }
+ .pagination {
+ -webkit-box-pack: justify;
+ -ms-flex-pack: justify;
+ justify-content: space-between;
+ }
+ .pagination.is-centered .pagination-previous {
+ -webkit-box-ordinal-group: 2;
+ -ms-flex-order: 1;
+ order: 1;
+ }
+ .pagination.is-centered .pagination-list {
+ -webkit-box-pack: center;
+ -ms-flex-pack: center;
+ justify-content: center;
+ -webkit-box-ordinal-group: 3;
+ -ms-flex-order: 2;
+ order: 2;
+ }
+ .pagination.is-centered .pagination-next {
+ -webkit-box-ordinal-group: 4;
+ -ms-flex-order: 3;
+ order: 3;
+ }
+ .pagination.is-right .pagination-previous {
+ -webkit-box-ordinal-group: 2;
+ -ms-flex-order: 1;
+ order: 1;
+ }
+ .pagination.is-right .pagination-next {
+ -webkit-box-ordinal-group: 3;
+ -ms-flex-order: 2;
+ order: 2;
+ }
+ .pagination.is-right .pagination-list {
+ -webkit-box-pack: end;
+ -ms-flex-pack: end;
+ justify-content: flex-end;
+ -webkit-box-ordinal-group: 4;
+ -ms-flex-order: 3;
+ order: 3;
+ }
+}
+
+.panel {
+ font-size: 1rem;
+}
+
+.panel:not(:last-child) {
+ margin-bottom: 1.5rem;
+}
+
+.panel-heading,
+.panel-tabs,
+.panel-block {
+ border-bottom: 1px solid #dbdbdb;
+ border-left: 1px solid #dbdbdb;
+ border-right: 1px solid #dbdbdb;
+}
+
+.panel-heading:first-child,
+.panel-tabs:first-child,
+.panel-block:first-child {
+ border-top: 1px solid #dbdbdb;
+}
+
+.panel-heading {
+ background-color: whitesmoke;
+ border-radius: 3px 3px 0 0;
+ color: #363636;
+ font-size: 1.25em;
+ font-weight: 300;
+ line-height: 1.25;
+ padding: 0.5em 0.75em;
+}
+
+.panel-tabs {
+ -webkit-box-align: end;
+ -ms-flex-align: end;
+ align-items: flex-end;
+ display: -webkit-box;
+ display: -ms-flexbox;
+ display: flex;
+ font-size: 0.875em;
+ -webkit-box-pack: center;
+ -ms-flex-pack: center;
+ justify-content: center;
+}
+
+.panel-tabs a {
+ border-bottom: 1px solid #dbdbdb;
+ margin-bottom: -1px;
+ padding: 0.5em;
+}
+
+.panel-tabs a.is-active {
+ border-bottom-color: #4a4a4a;
+ color: #363636;
+}
+
+.panel-list a {
+ color: #4a4a4a;
+}
+
+.panel-list a:hover {
+ color: #00d1b2;
+}
+
+.panel-block {
+ -webkit-box-align: center;
+ -ms-flex-align: center;
+ align-items: center;
+ color: #363636;
+ display: -webkit-box;
+ display: -ms-flexbox;
+ display: flex;
+ -webkit-box-pack: start;
+ -ms-flex-pack: start;
+ justify-content: flex-start;
+ padding: 0.5em 0.75em;
+}
+
+.panel-block input[type="checkbox"] {
+ margin-right: 0.75em;
+}
+
+.panel-block > .control {
+ -webkit-box-flex: 1;
+ -ms-flex-positive: 1;
+ flex-grow: 1;
+ -ms-flex-negative: 1;
+ flex-shrink: 1;
+ width: 100%;
+}
+
+.panel-block.is-wrapped {
+ -ms-flex-wrap: wrap;
+ flex-wrap: wrap;
+}
+
+.panel-block.is-active {
+ border-left-color: #00d1b2;
+ color: #363636;
+}
+
+.panel-block.is-active .panel-icon {
+ color: #00d1b2;
+}
+
+a.panel-block,
+label.panel-block {
+ cursor: pointer;
+}
+
+a.panel-block:hover,
+label.panel-block:hover {
+ background-color: whitesmoke;
+}
+
+.panel-icon {
+ display: inline-block;
+ font-size: 14px;
+ height: 1em;
+ line-height: 1em;
+ text-align: center;
+ vertical-align: top;
+ width: 1em;
+ color: #7a7a7a;
+ margin-right: 0.75em;
+}
+
+.panel-icon .fa {
+ font-size: inherit;
+ line-height: inherit;
+}
+
+.tabs {
+ -webkit-overflow-scrolling: touch;
+ -webkit-touch-callout: none;
+ -webkit-user-select: none;
+ -moz-user-select: none;
+ -ms-user-select: none;
+ user-select: none;
+ -webkit-box-align: stretch;
+ -ms-flex-align: stretch;
+ align-items: stretch;
+ display: -webkit-box;
+ display: -ms-flexbox;
+ display: flex;
+ font-size: 1rem;
+ -webkit-box-pack: justify;
+ -ms-flex-pack: justify;
+ justify-content: space-between;
+ overflow: hidden;
+ overflow-x: auto;
+ white-space: nowrap;
+}
+
+.tabs:not(:last-child) {
+ margin-bottom: 1.5rem;
+}
+
+.tabs a {
+ -webkit-box-align: center;
+ -ms-flex-align: center;
+ align-items: center;
+ border-bottom-color: #dbdbdb;
+ border-bottom-style: solid;
+ border-bottom-width: 1px;
+ color: #4a4a4a;
+ display: -webkit-box;
+ display: -ms-flexbox;
+ display: flex;
+ -webkit-box-pack: center;
+ -ms-flex-pack: center;
+ justify-content: center;
+ margin-bottom: -1px;
+ padding: 0.5em 1em;
+ vertical-align: top;
+}
+
+.tabs a:hover {
+ border-bottom-color: #363636;
+ color: #363636;
+}
+
+.tabs li {
+ display: block;
+}
+
+.tabs li.is-active a {
+ border-bottom-color: #00d1b2;
+ color: #00d1b2;
+}
+
+.tabs ul {
+ -webkit-box-align: center;
+ -ms-flex-align: center;
+ align-items: center;
+ border-bottom-color: #dbdbdb;
+ border-bottom-style: solid;
+ border-bottom-width: 1px;
+ display: -webkit-box;
+ display: -ms-flexbox;
+ display: flex;
+ -webkit-box-flex: 1;
+ -ms-flex-positive: 1;
+ flex-grow: 1;
+ -ms-flex-negative: 0;
+ flex-shrink: 0;
+ -webkit-box-pack: start;
+ -ms-flex-pack: start;
+ justify-content: flex-start;
+}
+
+.tabs ul.is-left {
+ padding-right: 0.75em;
+}
+
+.tabs ul.is-center {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ -webkit-box-pack: center;
+ -ms-flex-pack: center;
+ justify-content: center;
+ padding-left: 0.75em;
+ padding-right: 0.75em;
+}
+
+.tabs ul.is-right {
+ -webkit-box-pack: end;
+ -ms-flex-pack: end;
+ justify-content: flex-end;
+ padding-left: 0.75em;
+}
+
+.tabs .icon:first-child {
+ margin-right: 0.5em;
+}
+
+.tabs .icon:last-child {
+ margin-left: 0.5em;
+}
+
+.tabs.is-centered ul {
+ -webkit-box-pack: center;
+ -ms-flex-pack: center;
+ justify-content: center;
+}
+
+.tabs.is-right ul {
+ -webkit-box-pack: end;
+ -ms-flex-pack: end;
+ justify-content: flex-end;
+}
+
+.tabs.is-boxed a {
+ border: 1px solid transparent;
+ border-radius: 3px 3px 0 0;
+}
+
+.tabs.is-boxed a:hover {
+ background-color: whitesmoke;
+ border-bottom-color: #dbdbdb;
+}
+
+.tabs.is-boxed li.is-active a {
+ background-color: white;
+ border-color: #dbdbdb;
+ border-bottom-color: transparent !important;
+}
+
+.tabs.is-fullwidth li {
+ -webkit-box-flex: 1;
+ -ms-flex-positive: 1;
+ flex-grow: 1;
+ -ms-flex-negative: 0;
+ flex-shrink: 0;
+}
+
+.tabs.is-toggle a {
+ border-color: #dbdbdb;
+ border-style: solid;
+ border-width: 1px;
+ margin-bottom: 0;
+ position: relative;
+}
+
+.tabs.is-toggle a:hover {
+ background-color: whitesmoke;
+ border-color: #b5b5b5;
+ z-index: 2;
+}
+
+.tabs.is-toggle li + li {
+ margin-left: -1px;
+}
+
+.tabs.is-toggle li:first-child a {
+ border-radius: 3px 0 0 3px;
+}
+
+.tabs.is-toggle li:last-child a {
+ border-radius: 0 3px 3px 0;
+}
+
+.tabs.is-toggle li.is-active a {
+ background-color: #00d1b2;
+ border-color: #00d1b2;
+ color: #fff;
+ z-index: 1;
+}
+
+.tabs.is-toggle ul {
+ border-bottom: none;
+}
+
+.tabs.is-small {
+ font-size: 0.75rem;
+}
+
+.tabs.is-medium {
+ font-size: 1.25rem;
+}
+
+.tabs.is-large {
+ font-size: 1.5rem;
+}
+
+.column {
+ display: block;
+ -ms-flex-preferred-size: 0;
+ flex-basis: 0;
+ -webkit-box-flex: 1;
+ -ms-flex-positive: 1;
+ flex-grow: 1;
+ -ms-flex-negative: 1;
+ flex-shrink: 1;
+ padding: 0.75rem;
+}
+
+.columns.is-mobile > .column.is-narrow {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+}
+
+.columns.is-mobile > .column.is-full {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 100%;
+}
+
+.columns.is-mobile > .column.is-three-quarters {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 75%;
+}
+
+.columns.is-mobile > .column.is-two-thirds {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 66.6666%;
+}
+
+.columns.is-mobile > .column.is-half {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 50%;
+}
+
+.columns.is-mobile > .column.is-one-third {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 33.3333%;
+}
+
+.columns.is-mobile > .column.is-one-quarter {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 25%;
+}
+
+.columns.is-mobile > .column.is-offset-three-quarters {
+ margin-left: 75%;
+}
+
+.columns.is-mobile > .column.is-offset-two-thirds {
+ margin-left: 66.6666%;
+}
+
+.columns.is-mobile > .column.is-offset-half {
+ margin-left: 50%;
+}
+
+.columns.is-mobile > .column.is-offset-one-third {
+ margin-left: 33.3333%;
+}
+
+.columns.is-mobile > .column.is-offset-one-quarter {
+ margin-left: 25%;
+}
+
+.columns.is-mobile > .column.is-1 {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 8.33333%;
+}
+
+.columns.is-mobile > .column.is-offset-1 {
+ margin-left: 8.33333%;
+}
+
+.columns.is-mobile > .column.is-2 {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 16.66667%;
+}
+
+.columns.is-mobile > .column.is-offset-2 {
+ margin-left: 16.66667%;
+}
+
+.columns.is-mobile > .column.is-3 {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 25%;
+}
+
+.columns.is-mobile > .column.is-offset-3 {
+ margin-left: 25%;
+}
+
+.columns.is-mobile > .column.is-4 {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 33.33333%;
+}
+
+.columns.is-mobile > .column.is-offset-4 {
+ margin-left: 33.33333%;
+}
+
+.columns.is-mobile > .column.is-5 {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 41.66667%;
+}
+
+.columns.is-mobile > .column.is-offset-5 {
+ margin-left: 41.66667%;
+}
+
+.columns.is-mobile > .column.is-6 {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 50%;
+}
+
+.columns.is-mobile > .column.is-offset-6 {
+ margin-left: 50%;
+}
+
+.columns.is-mobile > .column.is-7 {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 58.33333%;
+}
+
+.columns.is-mobile > .column.is-offset-7 {
+ margin-left: 58.33333%;
+}
+
+.columns.is-mobile > .column.is-8 {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 66.66667%;
+}
+
+.columns.is-mobile > .column.is-offset-8 {
+ margin-left: 66.66667%;
+}
+
+.columns.is-mobile > .column.is-9 {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 75%;
+}
+
+.columns.is-mobile > .column.is-offset-9 {
+ margin-left: 75%;
+}
+
+.columns.is-mobile > .column.is-10 {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 83.33333%;
+}
+
+.columns.is-mobile > .column.is-offset-10 {
+ margin-left: 83.33333%;
+}
+
+.columns.is-mobile > .column.is-11 {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 91.66667%;
+}
+
+.columns.is-mobile > .column.is-offset-11 {
+ margin-left: 91.66667%;
+}
+
+.columns.is-mobile > .column.is-12 {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 100%;
+}
+
+.columns.is-mobile > .column.is-offset-12 {
+ margin-left: 100%;
+}
+
+@media screen and (max-width: 768px) {
+ .column.is-narrow-mobile {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ }
+ .column.is-full-mobile {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 100%;
+ }
+ .column.is-three-quarters-mobile {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 75%;
+ }
+ .column.is-two-thirds-mobile {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 66.6666%;
+ }
+ .column.is-half-mobile {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 50%;
+ }
+ .column.is-one-third-mobile {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 33.3333%;
+ }
+ .column.is-one-quarter-mobile {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 25%;
+ }
+ .column.is-offset-three-quarters-mobile {
+ margin-left: 75%;
+ }
+ .column.is-offset-two-thirds-mobile {
+ margin-left: 66.6666%;
+ }
+ .column.is-offset-half-mobile {
+ margin-left: 50%;
+ }
+ .column.is-offset-one-third-mobile {
+ margin-left: 33.3333%;
+ }
+ .column.is-offset-one-quarter-mobile {
+ margin-left: 25%;
+ }
+ .column.is-1-mobile {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 8.33333%;
+ }
+ .column.is-offset-1-mobile {
+ margin-left: 8.33333%;
+ }
+ .column.is-2-mobile {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 16.66667%;
+ }
+ .column.is-offset-2-mobile {
+ margin-left: 16.66667%;
+ }
+ .column.is-3-mobile {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 25%;
+ }
+ .column.is-offset-3-mobile {
+ margin-left: 25%;
+ }
+ .column.is-4-mobile {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 33.33333%;
+ }
+ .column.is-offset-4-mobile {
+ margin-left: 33.33333%;
+ }
+ .column.is-5-mobile {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 41.66667%;
+ }
+ .column.is-offset-5-mobile {
+ margin-left: 41.66667%;
+ }
+ .column.is-6-mobile {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 50%;
+ }
+ .column.is-offset-6-mobile {
+ margin-left: 50%;
+ }
+ .column.is-7-mobile {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 58.33333%;
+ }
+ .column.is-offset-7-mobile {
+ margin-left: 58.33333%;
+ }
+ .column.is-8-mobile {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 66.66667%;
+ }
+ .column.is-offset-8-mobile {
+ margin-left: 66.66667%;
+ }
+ .column.is-9-mobile {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 75%;
+ }
+ .column.is-offset-9-mobile {
+ margin-left: 75%;
+ }
+ .column.is-10-mobile {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 83.33333%;
+ }
+ .column.is-offset-10-mobile {
+ margin-left: 83.33333%;
+ }
+ .column.is-11-mobile {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 91.66667%;
+ }
+ .column.is-offset-11-mobile {
+ margin-left: 91.66667%;
+ }
+ .column.is-12-mobile {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 100%;
+ }
+ .column.is-offset-12-mobile {
+ margin-left: 100%;
+ }
+}
+
+@media screen and (min-width: 769px), print {
+ .column.is-narrow, .column.is-narrow-tablet {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ }
+ .column.is-full, .column.is-full-tablet {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 100%;
+ }
+ .column.is-three-quarters, .column.is-three-quarters-tablet {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 75%;
+ }
+ .column.is-two-thirds, .column.is-two-thirds-tablet {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 66.6666%;
+ }
+ .column.is-half, .column.is-half-tablet {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 50%;
+ }
+ .column.is-one-third, .column.is-one-third-tablet {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 33.3333%;
+ }
+ .column.is-one-quarter, .column.is-one-quarter-tablet {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 25%;
+ }
+ .column.is-offset-three-quarters, .column.is-offset-three-quarters-tablet {
+ margin-left: 75%;
+ }
+ .column.is-offset-two-thirds, .column.is-offset-two-thirds-tablet {
+ margin-left: 66.6666%;
+ }
+ .column.is-offset-half, .column.is-offset-half-tablet {
+ margin-left: 50%;
+ }
+ .column.is-offset-one-third, .column.is-offset-one-third-tablet {
+ margin-left: 33.3333%;
+ }
+ .column.is-offset-one-quarter, .column.is-offset-one-quarter-tablet {
+ margin-left: 25%;
+ }
+ .column.is-1, .column.is-1-tablet {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 8.33333%;
+ }
+ .column.is-offset-1, .column.is-offset-1-tablet {
+ margin-left: 8.33333%;
+ }
+ .column.is-2, .column.is-2-tablet {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 16.66667%;
+ }
+ .column.is-offset-2, .column.is-offset-2-tablet {
+ margin-left: 16.66667%;
+ }
+ .column.is-3, .column.is-3-tablet {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 25%;
+ }
+ .column.is-offset-3, .column.is-offset-3-tablet {
+ margin-left: 25%;
+ }
+ .column.is-4, .column.is-4-tablet {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 33.33333%;
+ }
+ .column.is-offset-4, .column.is-offset-4-tablet {
+ margin-left: 33.33333%;
+ }
+ .column.is-5, .column.is-5-tablet {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 41.66667%;
+ }
+ .column.is-offset-5, .column.is-offset-5-tablet {
+ margin-left: 41.66667%;
+ }
+ .column.is-6, .column.is-6-tablet {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 50%;
+ }
+ .column.is-offset-6, .column.is-offset-6-tablet {
+ margin-left: 50%;
+ }
+ .column.is-7, .column.is-7-tablet {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 58.33333%;
+ }
+ .column.is-offset-7, .column.is-offset-7-tablet {
+ margin-left: 58.33333%;
+ }
+ .column.is-8, .column.is-8-tablet {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 66.66667%;
+ }
+ .column.is-offset-8, .column.is-offset-8-tablet {
+ margin-left: 66.66667%;
+ }
+ .column.is-9, .column.is-9-tablet {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 75%;
+ }
+ .column.is-offset-9, .column.is-offset-9-tablet {
+ margin-left: 75%;
+ }
+ .column.is-10, .column.is-10-tablet {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 83.33333%;
+ }
+ .column.is-offset-10, .column.is-offset-10-tablet {
+ margin-left: 83.33333%;
+ }
+ .column.is-11, .column.is-11-tablet {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 91.66667%;
+ }
+ .column.is-offset-11, .column.is-offset-11-tablet {
+ margin-left: 91.66667%;
+ }
+ .column.is-12, .column.is-12-tablet {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 100%;
+ }
+ .column.is-offset-12, .column.is-offset-12-tablet {
+ margin-left: 100%;
+ }
+}
+
+@media screen and (max-width: 1007px) {
+ .column.is-narrow-touch {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ }
+ .column.is-full-touch {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 100%;
+ }
+ .column.is-three-quarters-touch {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 75%;
+ }
+ .column.is-two-thirds-touch {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 66.6666%;
+ }
+ .column.is-half-touch {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 50%;
+ }
+ .column.is-one-third-touch {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 33.3333%;
+ }
+ .column.is-one-quarter-touch {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 25%;
+ }
+ .column.is-offset-three-quarters-touch {
+ margin-left: 75%;
+ }
+ .column.is-offset-two-thirds-touch {
+ margin-left: 66.6666%;
+ }
+ .column.is-offset-half-touch {
+ margin-left: 50%;
+ }
+ .column.is-offset-one-third-touch {
+ margin-left: 33.3333%;
+ }
+ .column.is-offset-one-quarter-touch {
+ margin-left: 25%;
+ }
+ .column.is-1-touch {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 8.33333%;
+ }
+ .column.is-offset-1-touch {
+ margin-left: 8.33333%;
+ }
+ .column.is-2-touch {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 16.66667%;
+ }
+ .column.is-offset-2-touch {
+ margin-left: 16.66667%;
+ }
+ .column.is-3-touch {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 25%;
+ }
+ .column.is-offset-3-touch {
+ margin-left: 25%;
+ }
+ .column.is-4-touch {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 33.33333%;
+ }
+ .column.is-offset-4-touch {
+ margin-left: 33.33333%;
+ }
+ .column.is-5-touch {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 41.66667%;
+ }
+ .column.is-offset-5-touch {
+ margin-left: 41.66667%;
+ }
+ .column.is-6-touch {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 50%;
+ }
+ .column.is-offset-6-touch {
+ margin-left: 50%;
+ }
+ .column.is-7-touch {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 58.33333%;
+ }
+ .column.is-offset-7-touch {
+ margin-left: 58.33333%;
+ }
+ .column.is-8-touch {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 66.66667%;
+ }
+ .column.is-offset-8-touch {
+ margin-left: 66.66667%;
+ }
+ .column.is-9-touch {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 75%;
+ }
+ .column.is-offset-9-touch {
+ margin-left: 75%;
+ }
+ .column.is-10-touch {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 83.33333%;
+ }
+ .column.is-offset-10-touch {
+ margin-left: 83.33333%;
+ }
+ .column.is-11-touch {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 91.66667%;
+ }
+ .column.is-offset-11-touch {
+ margin-left: 91.66667%;
+ }
+ .column.is-12-touch {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 100%;
+ }
+ .column.is-offset-12-touch {
+ margin-left: 100%;
+ }
+}
+
+@media screen and (min-width: 1008px) {
+ .column.is-narrow-desktop {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ }
+ .column.is-full-desktop {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 100%;
+ }
+ .column.is-three-quarters-desktop {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 75%;
+ }
+ .column.is-two-thirds-desktop {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 66.6666%;
+ }
+ .column.is-half-desktop {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 50%;
+ }
+ .column.is-one-third-desktop {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 33.3333%;
+ }
+ .column.is-one-quarter-desktop {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 25%;
+ }
+ .column.is-offset-three-quarters-desktop {
+ margin-left: 75%;
+ }
+ .column.is-offset-two-thirds-desktop {
+ margin-left: 66.6666%;
+ }
+ .column.is-offset-half-desktop {
+ margin-left: 50%;
+ }
+ .column.is-offset-one-third-desktop {
+ margin-left: 33.3333%;
+ }
+ .column.is-offset-one-quarter-desktop {
+ margin-left: 25%;
+ }
+ .column.is-1-desktop {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 8.33333%;
+ }
+ .column.is-offset-1-desktop {
+ margin-left: 8.33333%;
+ }
+ .column.is-2-desktop {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 16.66667%;
+ }
+ .column.is-offset-2-desktop {
+ margin-left: 16.66667%;
+ }
+ .column.is-3-desktop {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 25%;
+ }
+ .column.is-offset-3-desktop {
+ margin-left: 25%;
+ }
+ .column.is-4-desktop {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 33.33333%;
+ }
+ .column.is-offset-4-desktop {
+ margin-left: 33.33333%;
+ }
+ .column.is-5-desktop {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 41.66667%;
+ }
+ .column.is-offset-5-desktop {
+ margin-left: 41.66667%;
+ }
+ .column.is-6-desktop {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 50%;
+ }
+ .column.is-offset-6-desktop {
+ margin-left: 50%;
+ }
+ .column.is-7-desktop {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 58.33333%;
+ }
+ .column.is-offset-7-desktop {
+ margin-left: 58.33333%;
+ }
+ .column.is-8-desktop {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 66.66667%;
+ }
+ .column.is-offset-8-desktop {
+ margin-left: 66.66667%;
+ }
+ .column.is-9-desktop {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 75%;
+ }
+ .column.is-offset-9-desktop {
+ margin-left: 75%;
+ }
+ .column.is-10-desktop {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 83.33333%;
+ }
+ .column.is-offset-10-desktop {
+ margin-left: 83.33333%;
+ }
+ .column.is-11-desktop {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 91.66667%;
+ }
+ .column.is-offset-11-desktop {
+ margin-left: 91.66667%;
+ }
+ .column.is-12-desktop {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 100%;
+ }
+ .column.is-offset-12-desktop {
+ margin-left: 100%;
+ }
+}
+
+@media screen and (min-width: 1200px) {
+ .column.is-narrow-widescreen {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ }
+ .column.is-full-widescreen {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 100%;
+ }
+ .column.is-three-quarters-widescreen {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 75%;
+ }
+ .column.is-two-thirds-widescreen {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 66.6666%;
+ }
+ .column.is-half-widescreen {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 50%;
+ }
+ .column.is-one-third-widescreen {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 33.3333%;
+ }
+ .column.is-one-quarter-widescreen {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 25%;
+ }
+ .column.is-offset-three-quarters-widescreen {
+ margin-left: 75%;
+ }
+ .column.is-offset-two-thirds-widescreen {
+ margin-left: 66.6666%;
+ }
+ .column.is-offset-half-widescreen {
+ margin-left: 50%;
+ }
+ .column.is-offset-one-third-widescreen {
+ margin-left: 33.3333%;
+ }
+ .column.is-offset-one-quarter-widescreen {
+ margin-left: 25%;
+ }
+ .column.is-1-widescreen {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 8.33333%;
+ }
+ .column.is-offset-1-widescreen {
+ margin-left: 8.33333%;
+ }
+ .column.is-2-widescreen {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 16.66667%;
+ }
+ .column.is-offset-2-widescreen {
+ margin-left: 16.66667%;
+ }
+ .column.is-3-widescreen {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 25%;
+ }
+ .column.is-offset-3-widescreen {
+ margin-left: 25%;
+ }
+ .column.is-4-widescreen {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 33.33333%;
+ }
+ .column.is-offset-4-widescreen {
+ margin-left: 33.33333%;
+ }
+ .column.is-5-widescreen {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 41.66667%;
+ }
+ .column.is-offset-5-widescreen {
+ margin-left: 41.66667%;
+ }
+ .column.is-6-widescreen {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 50%;
+ }
+ .column.is-offset-6-widescreen {
+ margin-left: 50%;
+ }
+ .column.is-7-widescreen {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 58.33333%;
+ }
+ .column.is-offset-7-widescreen {
+ margin-left: 58.33333%;
+ }
+ .column.is-8-widescreen {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 66.66667%;
+ }
+ .column.is-offset-8-widescreen {
+ margin-left: 66.66667%;
+ }
+ .column.is-9-widescreen {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 75%;
+ }
+ .column.is-offset-9-widescreen {
+ margin-left: 75%;
+ }
+ .column.is-10-widescreen {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 83.33333%;
+ }
+ .column.is-offset-10-widescreen {
+ margin-left: 83.33333%;
+ }
+ .column.is-11-widescreen {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 91.66667%;
+ }
+ .column.is-offset-11-widescreen {
+ margin-left: 91.66667%;
+ }
+ .column.is-12-widescreen {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 100%;
+ }
+ .column.is-offset-12-widescreen {
+ margin-left: 100%;
+ }
+}
+
+@media screen and (min-width: 1392px) {
+ .column.is-narrow-fullhd {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ }
+ .column.is-full-fullhd {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 100%;
+ }
+ .column.is-three-quarters-fullhd {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 75%;
+ }
+ .column.is-two-thirds-fullhd {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 66.6666%;
+ }
+ .column.is-half-fullhd {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 50%;
+ }
+ .column.is-one-third-fullhd {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 33.3333%;
+ }
+ .column.is-one-quarter-fullhd {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 25%;
+ }
+ .column.is-offset-three-quarters-fullhd {
+ margin-left: 75%;
+ }
+ .column.is-offset-two-thirds-fullhd {
+ margin-left: 66.6666%;
+ }
+ .column.is-offset-half-fullhd {
+ margin-left: 50%;
+ }
+ .column.is-offset-one-third-fullhd {
+ margin-left: 33.3333%;
+ }
+ .column.is-offset-one-quarter-fullhd {
+ margin-left: 25%;
+ }
+ .column.is-1-fullhd {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 8.33333%;
+ }
+ .column.is-offset-1-fullhd {
+ margin-left: 8.33333%;
+ }
+ .column.is-2-fullhd {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 16.66667%;
+ }
+ .column.is-offset-2-fullhd {
+ margin-left: 16.66667%;
+ }
+ .column.is-3-fullhd {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 25%;
+ }
+ .column.is-offset-3-fullhd {
+ margin-left: 25%;
+ }
+ .column.is-4-fullhd {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 33.33333%;
+ }
+ .column.is-offset-4-fullhd {
+ margin-left: 33.33333%;
+ }
+ .column.is-5-fullhd {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 41.66667%;
+ }
+ .column.is-offset-5-fullhd {
+ margin-left: 41.66667%;
+ }
+ .column.is-6-fullhd {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 50%;
+ }
+ .column.is-offset-6-fullhd {
+ margin-left: 50%;
+ }
+ .column.is-7-fullhd {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 58.33333%;
+ }
+ .column.is-offset-7-fullhd {
+ margin-left: 58.33333%;
+ }
+ .column.is-8-fullhd {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 66.66667%;
+ }
+ .column.is-offset-8-fullhd {
+ margin-left: 66.66667%;
+ }
+ .column.is-9-fullhd {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 75%;
+ }
+ .column.is-offset-9-fullhd {
+ margin-left: 75%;
+ }
+ .column.is-10-fullhd {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 83.33333%;
+ }
+ .column.is-offset-10-fullhd {
+ margin-left: 83.33333%;
+ }
+ .column.is-11-fullhd {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 91.66667%;
+ }
+ .column.is-offset-11-fullhd {
+ margin-left: 91.66667%;
+ }
+ .column.is-12-fullhd {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 100%;
+ }
+ .column.is-offset-12-fullhd {
+ margin-left: 100%;
+ }
+}
+
+.columns {
+ margin-left: -0.75rem;
+ margin-right: -0.75rem;
+ margin-top: -0.75rem;
+}
+
+.columns:last-child {
+ margin-bottom: -0.75rem;
+}
+
+.columns:not(:last-child) {
+ margin-bottom: 0.75rem;
+}
+
+.columns.is-centered {
+ -webkit-box-pack: center;
+ -ms-flex-pack: center;
+ justify-content: center;
+}
+
+.columns.is-gapless {
+ margin-left: 0;
+ margin-right: 0;
+ margin-top: 0;
+}
+
+.columns.is-gapless:last-child {
+ margin-bottom: 0;
+}
+
+.columns.is-gapless:not(:last-child) {
+ margin-bottom: 1.5rem;
+}
+
+.columns.is-gapless > .column {
+ margin: 0;
+ padding: 0;
+}
+
+@media screen and (min-width: 769px), print {
+ .columns.is-grid {
+ -ms-flex-wrap: wrap;
+ flex-wrap: wrap;
+ }
+ .columns.is-grid > .column {
+ max-width: 33.3333%;
+ padding: 0.75rem;
+ width: 33.3333%;
+ }
+ .columns.is-grid > .column + .column {
+ margin-left: 0;
+ }
+}
+
+.columns.is-mobile {
+ display: -webkit-box;
+ display: -ms-flexbox;
+ display: flex;
+}
+
+.columns.is-multiline {
+ -ms-flex-wrap: wrap;
+ flex-wrap: wrap;
+}
+
+.columns.is-vcentered {
+ -webkit-box-align: center;
+ -ms-flex-align: center;
+ align-items: center;
+}
+
+@media screen and (min-width: 769px), print {
+ .columns:not(.is-desktop) {
+ display: -webkit-box;
+ display: -ms-flexbox;
+ display: flex;
+ }
+}
+
+@media screen and (min-width: 1008px) {
+ .columns.is-desktop {
+ display: -webkit-box;
+ display: -ms-flexbox;
+ display: flex;
+ }
+}
+
+.tile {
+ -webkit-box-align: stretch;
+ -ms-flex-align: stretch;
+ align-items: stretch;
+ display: block;
+ -ms-flex-preferred-size: 0;
+ flex-basis: 0;
+ -webkit-box-flex: 1;
+ -ms-flex-positive: 1;
+ flex-grow: 1;
+ -ms-flex-negative: 1;
+ flex-shrink: 1;
+ min-height: -webkit-min-content;
+ min-height: -moz-min-content;
+ min-height: min-content;
+}
+
+.tile.is-ancestor {
+ margin-left: -0.75rem;
+ margin-right: -0.75rem;
+ margin-top: -0.75rem;
+}
+
+.tile.is-ancestor:last-child {
+ margin-bottom: -0.75rem;
+}
+
+.tile.is-ancestor:not(:last-child) {
+ margin-bottom: 0.75rem;
+}
+
+.tile.is-child {
+ margin: 0 !important;
+}
+
+.tile.is-parent {
+ padding: 0.75rem;
+}
+
+.tile.is-vertical {
+ -webkit-box-orient: vertical;
+ -webkit-box-direction: normal;
+ -ms-flex-direction: column;
+ flex-direction: column;
+}
+
+.tile.is-vertical > .tile.is-child:not(:last-child) {
+ margin-bottom: 1.5rem !important;
+}
+
+@media screen and (min-width: 769px), print {
+ .tile:not(.is-child) {
+ display: -webkit-box;
+ display: -ms-flexbox;
+ display: flex;
+ }
+ .tile.is-1 {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 8.33333%;
+ }
+ .tile.is-2 {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 16.66667%;
+ }
+ .tile.is-3 {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 25%;
+ }
+ .tile.is-4 {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 33.33333%;
+ }
+ .tile.is-5 {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 41.66667%;
+ }
+ .tile.is-6 {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 50%;
+ }
+ .tile.is-7 {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 58.33333%;
+ }
+ .tile.is-8 {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 66.66667%;
+ }
+ .tile.is-9 {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 75%;
+ }
+ .tile.is-10 {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 83.33333%;
+ }
+ .tile.is-11 {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 91.66667%;
+ }
+ .tile.is-12 {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 100%;
+ }
+}
+
+.hero {
+ -webkit-box-align: stretch;
+ -ms-flex-align: stretch;
+ align-items: stretch;
+ display: -webkit-box;
+ display: -ms-flexbox;
+ display: flex;
+ -webkit-box-orient: vertical;
+ -webkit-box-direction: normal;
+ -ms-flex-direction: column;
+ flex-direction: column;
+ -webkit-box-pack: justify;
+ -ms-flex-pack: justify;
+ justify-content: space-between;
+}
+
+.hero .nav {
+ background: none;
+ -webkit-box-shadow: 0 1px 0 rgba(219, 219, 219, 0.3);
+ box-shadow: 0 1px 0 rgba(219, 219, 219, 0.3);
+}
+
+.hero .tabs ul {
+ border-bottom: none;
+}
+
+.hero.is-white {
+ background-color: white;
+ color: #0a0a0a;
+}
+
+.hero.is-white a:not(.button),
+.hero.is-white strong {
+ color: inherit;
+}
+
+.hero.is-white .title {
+ color: #0a0a0a;
+}
+
+.hero.is-white .subtitle {
+ color: rgba(10, 10, 10, 0.9);
+}
+
+.hero.is-white .subtitle a:not(.button),
+.hero.is-white .subtitle strong {
+ color: #0a0a0a;
+}
+
+.hero.is-white .nav {
+ -webkit-box-shadow: 0 1px 0 rgba(10, 10, 10, 0.2);
+ box-shadow: 0 1px 0 rgba(10, 10, 10, 0.2);
+}
+
+@media screen and (max-width: 768px) {
+ .hero.is-white .nav-menu {
+ background-color: white;
+ }
+}
+
+.hero.is-white a.nav-item,
+.hero.is-white .nav-item a:not(.button) {
+ color: rgba(10, 10, 10, 0.7);
+}
+
+.hero.is-white a.nav-item:hover, .hero.is-white a.nav-item.is-active,
+.hero.is-white .nav-item a:not(.button):hover,
+.hero.is-white .nav-item a:not(.button).is-active {
+ color: #0a0a0a;
+}
+
+.hero.is-white .tabs a {
+ color: #0a0a0a;
+ opacity: 0.9;
+}
+
+.hero.is-white .tabs a:hover {
+ opacity: 1;
+}
+
+.hero.is-white .tabs li.is-active a {
+ opacity: 1;
+}
+
+.hero.is-white .tabs.is-boxed a, .hero.is-white .tabs.is-toggle a {
+ color: #0a0a0a;
+}
+
+.hero.is-white .tabs.is-boxed a:hover, .hero.is-white .tabs.is-toggle a:hover {
+ background-color: rgba(10, 10, 10, 0.1);
+}
+
+.hero.is-white .tabs.is-boxed li.is-active a, .hero.is-white .tabs.is-boxed li.is-active a:hover, .hero.is-white .tabs.is-toggle li.is-active a, .hero.is-white .tabs.is-toggle li.is-active a:hover {
+ background-color: #0a0a0a;
+ border-color: #0a0a0a;
+ color: white;
+}
+
+.hero.is-white.is-bold {
+ background-image: linear-gradient(141deg, #e6e6e6 0%, white 71%, white 100%);
+}
+
+@media screen and (max-width: 768px) {
+ .hero.is-white.is-bold .nav-menu {
+ background-image: linear-gradient(141deg, #e6e6e6 0%, white 71%, white 100%);
+ }
+}
+
+@media screen and (max-width: 768px) {
+ .hero.is-white .nav-toggle span {
+ background-color: #0a0a0a;
+ }
+ .hero.is-white .nav-toggle:hover {
+ background-color: rgba(10, 10, 10, 0.1);
+ }
+ .hero.is-white .nav-toggle.is-active span {
+ background-color: #0a0a0a;
+ }
+ .hero.is-white .nav-menu .nav-item {
+ border-top-color: rgba(10, 10, 10, 0.2);
+ }
+}
+
+.hero.is-black {
+ background-color: #0a0a0a;
+ color: white;
+}
+
+.hero.is-black a:not(.button),
+.hero.is-black strong {
+ color: inherit;
+}
+
+.hero.is-black .title {
+ color: white;
+}
+
+.hero.is-black .subtitle {
+ color: rgba(255, 255, 255, 0.9);
+}
+
+.hero.is-black .subtitle a:not(.button),
+.hero.is-black .subtitle strong {
+ color: white;
+}
+
+.hero.is-black .nav {
+ -webkit-box-shadow: 0 1px 0 rgba(255, 255, 255, 0.2);
+ box-shadow: 0 1px 0 rgba(255, 255, 255, 0.2);
+}
+
+@media screen and (max-width: 768px) {
+ .hero.is-black .nav-menu {
+ background-color: #0a0a0a;
+ }
+}
+
+.hero.is-black a.nav-item,
+.hero.is-black .nav-item a:not(.button) {
+ color: rgba(255, 255, 255, 0.7);
+}
+
+.hero.is-black a.nav-item:hover, .hero.is-black a.nav-item.is-active,
+.hero.is-black .nav-item a:not(.button):hover,
+.hero.is-black .nav-item a:not(.button).is-active {
+ color: white;
+}
+
+.hero.is-black .tabs a {
+ color: white;
+ opacity: 0.9;
+}
+
+.hero.is-black .tabs a:hover {
+ opacity: 1;
+}
+
+.hero.is-black .tabs li.is-active a {
+ opacity: 1;
+}
+
+.hero.is-black .tabs.is-boxed a, .hero.is-black .tabs.is-toggle a {
+ color: white;
+}
+
+.hero.is-black .tabs.is-boxed a:hover, .hero.is-black .tabs.is-toggle a:hover {
+ background-color: rgba(10, 10, 10, 0.1);
+}
+
+.hero.is-black .tabs.is-boxed li.is-active a, .hero.is-black .tabs.is-boxed li.is-active a:hover, .hero.is-black .tabs.is-toggle li.is-active a, .hero.is-black .tabs.is-toggle li.is-active a:hover {
+ background-color: white;
+ border-color: white;
+ color: #0a0a0a;
+}
+
+.hero.is-black.is-bold {
+ background-image: linear-gradient(141deg, black 0%, #0a0a0a 71%, #181616 100%);
+}
+
+@media screen and (max-width: 768px) {
+ .hero.is-black.is-bold .nav-menu {
+ background-image: linear-gradient(141deg, black 0%, #0a0a0a 71%, #181616 100%);
+ }
+}
+
+@media screen and (max-width: 768px) {
+ .hero.is-black .nav-toggle span {
+ background-color: white;
+ }
+ .hero.is-black .nav-toggle:hover {
+ background-color: rgba(10, 10, 10, 0.1);
+ }
+ .hero.is-black .nav-toggle.is-active span {
+ background-color: white;
+ }
+ .hero.is-black .nav-menu .nav-item {
+ border-top-color: rgba(255, 255, 255, 0.2);
+ }
+}
+
+.hero.is-light {
+ background-color: whitesmoke;
+ color: #363636;
+}
+
+.hero.is-light a:not(.button),
+.hero.is-light strong {
+ color: inherit;
+}
+
+.hero.is-light .title {
+ color: #363636;
+}
+
+.hero.is-light .subtitle {
+ color: rgba(54, 54, 54, 0.9);
+}
+
+.hero.is-light .subtitle a:not(.button),
+.hero.is-light .subtitle strong {
+ color: #363636;
+}
+
+.hero.is-light .nav {
+ -webkit-box-shadow: 0 1px 0 rgba(54, 54, 54, 0.2);
+ box-shadow: 0 1px 0 rgba(54, 54, 54, 0.2);
+}
+
+@media screen and (max-width: 768px) {
+ .hero.is-light .nav-menu {
+ background-color: whitesmoke;
+ }
+}
+
+.hero.is-light a.nav-item,
+.hero.is-light .nav-item a:not(.button) {
+ color: rgba(54, 54, 54, 0.7);
+}
+
+.hero.is-light a.nav-item:hover, .hero.is-light a.nav-item.is-active,
+.hero.is-light .nav-item a:not(.button):hover,
+.hero.is-light .nav-item a:not(.button).is-active {
+ color: #363636;
+}
+
+.hero.is-light .tabs a {
+ color: #363636;
+ opacity: 0.9;
+}
+
+.hero.is-light .tabs a:hover {
+ opacity: 1;
+}
+
+.hero.is-light .tabs li.is-active a {
+ opacity: 1;
+}
+
+.hero.is-light .tabs.is-boxed a, .hero.is-light .tabs.is-toggle a {
+ color: #363636;
+}
+
+.hero.is-light .tabs.is-boxed a:hover, .hero.is-light .tabs.is-toggle a:hover {
+ background-color: rgba(10, 10, 10, 0.1);
+}
+
+.hero.is-light .tabs.is-boxed li.is-active a, .hero.is-light .tabs.is-boxed li.is-active a:hover, .hero.is-light .tabs.is-toggle li.is-active a, .hero.is-light .tabs.is-toggle li.is-active a:hover {
+ background-color: #363636;
+ border-color: #363636;
+ color: whitesmoke;
+}
+
+.hero.is-light.is-bold {
+ background-image: linear-gradient(141deg, #dfd8d9 0%, whitesmoke 71%, white 100%);
+}
+
+@media screen and (max-width: 768px) {
+ .hero.is-light.is-bold .nav-menu {
+ background-image: linear-gradient(141deg, #dfd8d9 0%, whitesmoke 71%, white 100%);
+ }
+}
+
+@media screen and (max-width: 768px) {
+ .hero.is-light .nav-toggle span {
+ background-color: #363636;
+ }
+ .hero.is-light .nav-toggle:hover {
+ background-color: rgba(10, 10, 10, 0.1);
+ }
+ .hero.is-light .nav-toggle.is-active span {
+ background-color: #363636;
+ }
+ .hero.is-light .nav-menu .nav-item {
+ border-top-color: rgba(54, 54, 54, 0.2);
+ }
+}
+
+.hero.is-dark {
+ background-color: #363636;
+ color: whitesmoke;
+}
+
+.hero.is-dark a:not(.button),
+.hero.is-dark strong {
+ color: inherit;
+}
+
+.hero.is-dark .title {
+ color: whitesmoke;
+}
+
+.hero.is-dark .subtitle {
+ color: rgba(245, 245, 245, 0.9);
+}
+
+.hero.is-dark .subtitle a:not(.button),
+.hero.is-dark .subtitle strong {
+ color: whitesmoke;
+}
+
+.hero.is-dark .nav {
+ -webkit-box-shadow: 0 1px 0 rgba(245, 245, 245, 0.2);
+ box-shadow: 0 1px 0 rgba(245, 245, 245, 0.2);
+}
+
+@media screen and (max-width: 768px) {
+ .hero.is-dark .nav-menu {
+ background-color: #363636;
+ }
+}
+
+.hero.is-dark a.nav-item,
+.hero.is-dark .nav-item a:not(.button) {
+ color: rgba(245, 245, 245, 0.7);
+}
+
+.hero.is-dark a.nav-item:hover, .hero.is-dark a.nav-item.is-active,
+.hero.is-dark .nav-item a:not(.button):hover,
+.hero.is-dark .nav-item a:not(.button).is-active {
+ color: whitesmoke;
+}
+
+.hero.is-dark .tabs a {
+ color: whitesmoke;
+ opacity: 0.9;
+}
+
+.hero.is-dark .tabs a:hover {
+ opacity: 1;
+}
+
+.hero.is-dark .tabs li.is-active a {
+ opacity: 1;
+}
+
+.hero.is-dark .tabs.is-boxed a, .hero.is-dark .tabs.is-toggle a {
+ color: whitesmoke;
+}
+
+.hero.is-dark .tabs.is-boxed a:hover, .hero.is-dark .tabs.is-toggle a:hover {
+ background-color: rgba(10, 10, 10, 0.1);
+}
+
+.hero.is-dark .tabs.is-boxed li.is-active a, .hero.is-dark .tabs.is-boxed li.is-active a:hover, .hero.is-dark .tabs.is-toggle li.is-active a, .hero.is-dark .tabs.is-toggle li.is-active a:hover {
+ background-color: whitesmoke;
+ border-color: whitesmoke;
+ color: #363636;
+}
+
+.hero.is-dark.is-bold {
+ background-image: linear-gradient(141deg, #1f191a 0%, #363636 71%, #46403f 100%);
+}
+
+@media screen and (max-width: 768px) {
+ .hero.is-dark.is-bold .nav-menu {
+ background-image: linear-gradient(141deg, #1f191a 0%, #363636 71%, #46403f 100%);
+ }
+}
+
+@media screen and (max-width: 768px) {
+ .hero.is-dark .nav-toggle span {
+ background-color: whitesmoke;
+ }
+ .hero.is-dark .nav-toggle:hover {
+ background-color: rgba(10, 10, 10, 0.1);
+ }
+ .hero.is-dark .nav-toggle.is-active span {
+ background-color: whitesmoke;
+ }
+ .hero.is-dark .nav-menu .nav-item {
+ border-top-color: rgba(245, 245, 245, 0.2);
+ }
+}
+
+.hero.is-primary {
+ background-color: #00d1b2;
+ color: #fff;
+}
+
+.hero.is-primary a:not(.button),
+.hero.is-primary strong {
+ color: inherit;
+}
+
+.hero.is-primary .title {
+ color: #fff;
+}
+
+.hero.is-primary .subtitle {
+ color: rgba(255, 255, 255, 0.9);
+}
+
+.hero.is-primary .subtitle a:not(.button),
+.hero.is-primary .subtitle strong {
+ color: #fff;
+}
+
+.hero.is-primary .nav {
+ -webkit-box-shadow: 0 1px 0 rgba(255, 255, 255, 0.2);
+ box-shadow: 0 1px 0 rgba(255, 255, 255, 0.2);
+}
+
+@media screen and (max-width: 768px) {
+ .hero.is-primary .nav-menu {
+ background-color: #00d1b2;
+ }
+}
+
+.hero.is-primary a.nav-item,
+.hero.is-primary .nav-item a:not(.button) {
+ color: rgba(255, 255, 255, 0.7);
+}
+
+.hero.is-primary a.nav-item:hover, .hero.is-primary a.nav-item.is-active,
+.hero.is-primary .nav-item a:not(.button):hover,
+.hero.is-primary .nav-item a:not(.button).is-active {
+ color: #fff;
+}
+
+.hero.is-primary .tabs a {
+ color: #fff;
+ opacity: 0.9;
+}
+
+.hero.is-primary .tabs a:hover {
+ opacity: 1;
+}
+
+.hero.is-primary .tabs li.is-active a {
+ opacity: 1;
+}
+
+.hero.is-primary .tabs.is-boxed a, .hero.is-primary .tabs.is-toggle a {
+ color: #fff;
+}
+
+.hero.is-primary .tabs.is-boxed a:hover, .hero.is-primary .tabs.is-toggle a:hover {
+ background-color: rgba(10, 10, 10, 0.1);
+}
+
+.hero.is-primary .tabs.is-boxed li.is-active a, .hero.is-primary .tabs.is-boxed li.is-active a:hover, .hero.is-primary .tabs.is-toggle li.is-active a, .hero.is-primary .tabs.is-toggle li.is-active a:hover {
+ background-color: #fff;
+ border-color: #fff;
+ color: #00d1b2;
+}
+
+.hero.is-primary.is-bold {
+ background-image: linear-gradient(141deg, #009e6c 0%, #00d1b2 71%, #00e7eb 100%);
+}
+
+@media screen and (max-width: 768px) {
+ .hero.is-primary.is-bold .nav-menu {
+ background-image: linear-gradient(141deg, #009e6c 0%, #00d1b2 71%, #00e7eb 100%);
+ }
+}
+
+@media screen and (max-width: 768px) {
+ .hero.is-primary .nav-toggle span {
+ background-color: #fff;
+ }
+ .hero.is-primary .nav-toggle:hover {
+ background-color: rgba(10, 10, 10, 0.1);
+ }
+ .hero.is-primary .nav-toggle.is-active span {
+ background-color: #fff;
+ }
+ .hero.is-primary .nav-menu .nav-item {
+ border-top-color: rgba(255, 255, 255, 0.2);
+ }
+}
+
+.hero.is-info {
+ background-color: #3273dc;
+ color: #fff;
+}
+
+.hero.is-info a:not(.button),
+.hero.is-info strong {
+ color: inherit;
+}
+
+.hero.is-info .title {
+ color: #fff;
+}
+
+.hero.is-info .subtitle {
+ color: rgba(255, 255, 255, 0.9);
+}
+
+.hero.is-info .subtitle a:not(.button),
+.hero.is-info .subtitle strong {
+ color: #fff;
+}
+
+.hero.is-info .nav {
+ -webkit-box-shadow: 0 1px 0 rgba(255, 255, 255, 0.2);
+ box-shadow: 0 1px 0 rgba(255, 255, 255, 0.2);
+}
+
+@media screen and (max-width: 768px) {
+ .hero.is-info .nav-menu {
+ background-color: #3273dc;
+ }
+}
+
+.hero.is-info a.nav-item,
+.hero.is-info .nav-item a:not(.button) {
+ color: rgba(255, 255, 255, 0.7);
+}
+
+.hero.is-info a.nav-item:hover, .hero.is-info a.nav-item.is-active,
+.hero.is-info .nav-item a:not(.button):hover,
+.hero.is-info .nav-item a:not(.button).is-active {
+ color: #fff;
+}
+
+.hero.is-info .tabs a {
+ color: #fff;
+ opacity: 0.9;
+}
+
+.hero.is-info .tabs a:hover {
+ opacity: 1;
+}
+
+.hero.is-info .tabs li.is-active a {
+ opacity: 1;
+}
+
+.hero.is-info .tabs.is-boxed a, .hero.is-info .tabs.is-toggle a {
+ color: #fff;
+}
+
+.hero.is-info .tabs.is-boxed a:hover, .hero.is-info .tabs.is-toggle a:hover {
+ background-color: rgba(10, 10, 10, 0.1);
+}
+
+.hero.is-info .tabs.is-boxed li.is-active a, .hero.is-info .tabs.is-boxed li.is-active a:hover, .hero.is-info .tabs.is-toggle li.is-active a, .hero.is-info .tabs.is-toggle li.is-active a:hover {
+ background-color: #fff;
+ border-color: #fff;
+ color: #3273dc;
+}
+
+.hero.is-info.is-bold {
+ background-image: linear-gradient(141deg, #1577c6 0%, #3273dc 71%, #4366e5 100%);
+}
+
+@media screen and (max-width: 768px) {
+ .hero.is-info.is-bold .nav-menu {
+ background-image: linear-gradient(141deg, #1577c6 0%, #3273dc 71%, #4366e5 100%);
+ }
+}
+
+@media screen and (max-width: 768px) {
+ .hero.is-info .nav-toggle span {
+ background-color: #fff;
+ }
+ .hero.is-info .nav-toggle:hover {
+ background-color: rgba(10, 10, 10, 0.1);
+ }
+ .hero.is-info .nav-toggle.is-active span {
+ background-color: #fff;
+ }
+ .hero.is-info .nav-menu .nav-item {
+ border-top-color: rgba(255, 255, 255, 0.2);
+ }
+}
+
+.hero.is-success {
+ background-color: #23d160;
+ color: #fff;
+}
+
+.hero.is-success a:not(.button),
+.hero.is-success strong {
+ color: inherit;
+}
+
+.hero.is-success .title {
+ color: #fff;
+}
+
+.hero.is-success .subtitle {
+ color: rgba(255, 255, 255, 0.9);
+}
+
+.hero.is-success .subtitle a:not(.button),
+.hero.is-success .subtitle strong {
+ color: #fff;
+}
+
+.hero.is-success .nav {
+ -webkit-box-shadow: 0 1px 0 rgba(255, 255, 255, 0.2);
+ box-shadow: 0 1px 0 rgba(255, 255, 255, 0.2);
+}
+
+@media screen and (max-width: 768px) {
+ .hero.is-success .nav-menu {
+ background-color: #23d160;
+ }
+}
+
+.hero.is-success a.nav-item,
+.hero.is-success .nav-item a:not(.button) {
+ color: rgba(255, 255, 255, 0.7);
+}
+
+.hero.is-success a.nav-item:hover, .hero.is-success a.nav-item.is-active,
+.hero.is-success .nav-item a:not(.button):hover,
+.hero.is-success .nav-item a:not(.button).is-active {
+ color: #fff;
+}
+
+.hero.is-success .tabs a {
+ color: #fff;
+ opacity: 0.9;
+}
+
+.hero.is-success .tabs a:hover {
+ opacity: 1;
+}
+
+.hero.is-success .tabs li.is-active a {
+ opacity: 1;
+}
+
+.hero.is-success .tabs.is-boxed a, .hero.is-success .tabs.is-toggle a {
+ color: #fff;
+}
+
+.hero.is-success .tabs.is-boxed a:hover, .hero.is-success .tabs.is-toggle a:hover {
+ background-color: rgba(10, 10, 10, 0.1);
+}
+
+.hero.is-success .tabs.is-boxed li.is-active a, .hero.is-success .tabs.is-boxed li.is-active a:hover, .hero.is-success .tabs.is-toggle li.is-active a, .hero.is-success .tabs.is-toggle li.is-active a:hover {
+ background-color: #fff;
+ border-color: #fff;
+ color: #23d160;
+}
+
+.hero.is-success.is-bold {
+ background-image: linear-gradient(141deg, #12af2f 0%, #23d160 71%, #2ce28a 100%);
+}
+
+@media screen and (max-width: 768px) {
+ .hero.is-success.is-bold .nav-menu {
+ background-image: linear-gradient(141deg, #12af2f 0%, #23d160 71%, #2ce28a 100%);
+ }
+}
+
+@media screen and (max-width: 768px) {
+ .hero.is-success .nav-toggle span {
+ background-color: #fff;
+ }
+ .hero.is-success .nav-toggle:hover {
+ background-color: rgba(10, 10, 10, 0.1);
+ }
+ .hero.is-success .nav-toggle.is-active span {
+ background-color: #fff;
+ }
+ .hero.is-success .nav-menu .nav-item {
+ border-top-color: rgba(255, 255, 255, 0.2);
+ }
+}
+
+.hero.is-warning {
+ background-color: #ffdd57;
+ color: rgba(0, 0, 0, 0.7);
+}
+
+.hero.is-warning a:not(.button),
+.hero.is-warning strong {
+ color: inherit;
+}
+
+.hero.is-warning .title {
+ color: rgba(0, 0, 0, 0.7);
+}
+
+.hero.is-warning .subtitle {
+ color: rgba(0, 0, 0, 0.9);
+}
+
+.hero.is-warning .subtitle a:not(.button),
+.hero.is-warning .subtitle strong {
+ color: rgba(0, 0, 0, 0.7);
+}
+
+.hero.is-warning .nav {
+ -webkit-box-shadow: 0 1px 0 rgba(0, 0, 0, 0.2);
+ box-shadow: 0 1px 0 rgba(0, 0, 0, 0.2);
+}
+
+@media screen and (max-width: 768px) {
+ .hero.is-warning .nav-menu {
+ background-color: #ffdd57;
+ }
+}
+
+.hero.is-warning a.nav-item,
+.hero.is-warning .nav-item a:not(.button) {
+ color: rgba(0, 0, 0, 0.7);
+}
+
+.hero.is-warning a.nav-item:hover, .hero.is-warning a.nav-item.is-active,
+.hero.is-warning .nav-item a:not(.button):hover,
+.hero.is-warning .nav-item a:not(.button).is-active {
+ color: rgba(0, 0, 0, 0.7);
+}
+
+.hero.is-warning .tabs a {
+ color: rgba(0, 0, 0, 0.7);
+ opacity: 0.9;
+}
+
+.hero.is-warning .tabs a:hover {
+ opacity: 1;
+}
+
+.hero.is-warning .tabs li.is-active a {
+ opacity: 1;
+}
+
+.hero.is-warning .tabs.is-boxed a, .hero.is-warning .tabs.is-toggle a {
+ color: rgba(0, 0, 0, 0.7);
+}
+
+.hero.is-warning .tabs.is-boxed a:hover, .hero.is-warning .tabs.is-toggle a:hover {
+ background-color: rgba(10, 10, 10, 0.1);
+}
+
+.hero.is-warning .tabs.is-boxed li.is-active a, .hero.is-warning .tabs.is-boxed li.is-active a:hover, .hero.is-warning .tabs.is-toggle li.is-active a, .hero.is-warning .tabs.is-toggle li.is-active a:hover {
+ background-color: rgba(0, 0, 0, 0.7);
+ border-color: rgba(0, 0, 0, 0.7);
+ color: #ffdd57;
+}
+
+.hero.is-warning.is-bold {
+ background-image: linear-gradient(141deg, #ffaf24 0%, #ffdd57 71%, #fffa70 100%);
+}
+
+@media screen and (max-width: 768px) {
+ .hero.is-warning.is-bold .nav-menu {
+ background-image: linear-gradient(141deg, #ffaf24 0%, #ffdd57 71%, #fffa70 100%);
+ }
+}
+
+@media screen and (max-width: 768px) {
+ .hero.is-warning .nav-toggle span {
+ background-color: rgba(0, 0, 0, 0.7);
+ }
+ .hero.is-warning .nav-toggle:hover {
+ background-color: rgba(10, 10, 10, 0.1);
+ }
+ .hero.is-warning .nav-toggle.is-active span {
+ background-color: rgba(0, 0, 0, 0.7);
+ }
+ .hero.is-warning .nav-menu .nav-item {
+ border-top-color: rgba(0, 0, 0, 0.2);
+ }
+}
+
+.hero.is-danger {
+ background-color: #ff3860;
+ color: #fff;
+}
+
+.hero.is-danger a:not(.button),
+.hero.is-danger strong {
+ color: inherit;
+}
+
+.hero.is-danger .title {
+ color: #fff;
+}
+
+.hero.is-danger .subtitle {
+ color: rgba(255, 255, 255, 0.9);
+}
+
+.hero.is-danger .subtitle a:not(.button),
+.hero.is-danger .subtitle strong {
+ color: #fff;
+}
+
+.hero.is-danger .nav {
+ -webkit-box-shadow: 0 1px 0 rgba(255, 255, 255, 0.2);
+ box-shadow: 0 1px 0 rgba(255, 255, 255, 0.2);
+}
+
+@media screen and (max-width: 768px) {
+ .hero.is-danger .nav-menu {
+ background-color: #ff3860;
+ }
+}
+
+.hero.is-danger a.nav-item,
+.hero.is-danger .nav-item a:not(.button) {
+ color: rgba(255, 255, 255, 0.7);
+}
+
+.hero.is-danger a.nav-item:hover, .hero.is-danger a.nav-item.is-active,
+.hero.is-danger .nav-item a:not(.button):hover,
+.hero.is-danger .nav-item a:not(.button).is-active {
+ color: #fff;
+}
+
+.hero.is-danger .tabs a {
+ color: #fff;
+ opacity: 0.9;
+}
+
+.hero.is-danger .tabs a:hover {
+ opacity: 1;
+}
+
+.hero.is-danger .tabs li.is-active a {
+ opacity: 1;
+}
+
+.hero.is-danger .tabs.is-boxed a, .hero.is-danger .tabs.is-toggle a {
+ color: #fff;
+}
+
+.hero.is-danger .tabs.is-boxed a:hover, .hero.is-danger .tabs.is-toggle a:hover {
+ background-color: rgba(10, 10, 10, 0.1);
+}
+
+.hero.is-danger .tabs.is-boxed li.is-active a, .hero.is-danger .tabs.is-boxed li.is-active a:hover, .hero.is-danger .tabs.is-toggle li.is-active a, .hero.is-danger .tabs.is-toggle li.is-active a:hover {
+ background-color: #fff;
+ border-color: #fff;
+ color: #ff3860;
+}
+
+.hero.is-danger.is-bold {
+ background-image: linear-gradient(141deg, #ff0561 0%, #ff3860 71%, #ff5257 100%);
+}
+
+@media screen and (max-width: 768px) {
+ .hero.is-danger.is-bold .nav-menu {
+ background-image: linear-gradient(141deg, #ff0561 0%, #ff3860 71%, #ff5257 100%);
+ }
+}
+
+@media screen and (max-width: 768px) {
+ .hero.is-danger .nav-toggle span {
+ background-color: #fff;
+ }
+ .hero.is-danger .nav-toggle:hover {
+ background-color: rgba(10, 10, 10, 0.1);
+ }
+ .hero.is-danger .nav-toggle.is-active span {
+ background-color: #fff;
+ }
+ .hero.is-danger .nav-menu .nav-item {
+ border-top-color: rgba(255, 255, 255, 0.2);
+ }
+}
+
+@media screen and (min-width: 769px), print {
+ .hero.is-medium .hero-body {
+ padding-bottom: 9rem;
+ padding-top: 9rem;
+ }
+}
+
+@media screen and (min-width: 769px), print {
+ .hero.is-large .hero-body {
+ padding-bottom: 18rem;
+ padding-top: 18rem;
+ }
+}
+
+.hero.is-halfheight .hero-body, .hero.is-fullheight .hero-body {
+ -webkit-box-align: center;
+ -ms-flex-align: center;
+ align-items: center;
+ display: -webkit-box;
+ display: -ms-flexbox;
+ display: flex;
+}
+
+.hero.is-halfheight .hero-body > .container, .hero.is-fullheight .hero-body > .container {
+ -webkit-box-flex: 1;
+ -ms-flex-positive: 1;
+ flex-grow: 1;
+ -ms-flex-negative: 1;
+ flex-shrink: 1;
+}
+
+.hero.is-halfheight {
+ min-height: 50vh;
+}
+
+.hero.is-fullheight {
+ min-height: 100vh;
+}
+
+.hero-video {
+ bottom: 0;
+ left: 0;
+ position: absolute;
+ right: 0;
+ top: 0;
+ overflow: hidden;
+}
+
+.hero-video video {
+ left: 50%;
+ min-height: 100%;
+ min-width: 100%;
+ position: absolute;
+ top: 50%;
+ -webkit-transform: translate3d(-50%, -50%, 0);
+ transform: translate3d(-50%, -50%, 0);
+}
+
+.hero-video.is-transparent {
+ opacity: 0.3;
+}
+
+@media screen and (max-width: 768px) {
+ .hero-video {
+ display: none;
+ }
+}
+
+.hero-buttons {
+ margin-top: 1.5rem;
+}
+
+@media screen and (max-width: 768px) {
+ .hero-buttons .button {
+ display: -webkit-box;
+ display: -ms-flexbox;
+ display: flex;
+ }
+ .hero-buttons .button:not(:last-child) {
+ margin-bottom: 0.75rem;
+ }
+}
+
+@media screen and (min-width: 769px), print {
+ .hero-buttons {
+ display: -webkit-box;
+ display: -ms-flexbox;
+ display: flex;
+ -webkit-box-pack: center;
+ -ms-flex-pack: center;
+ justify-content: center;
+ }
+ .hero-buttons .button:not(:last-child) {
+ margin-right: 1.5rem;
+ }
+}
+
+.hero-head,
+.hero-foot {
+ -webkit-box-flex: 0;
+ -ms-flex-positive: 0;
+ flex-grow: 0;
+ -ms-flex-negative: 0;
+ flex-shrink: 0;
+}
+
+.hero-body {
+ -webkit-box-flex: 1;
+ -ms-flex-positive: 1;
+ flex-grow: 1;
+ -ms-flex-negative: 0;
+ flex-shrink: 0;
+ padding: 3rem 1.5rem;
+}
+
+.section {
+ padding: 3rem 1.5rem;
+}
+
+@media screen and (min-width: 1008px) {
+ .section.is-medium {
+ padding: 9rem 1.5rem;
+ }
+ .section.is-large {
+ padding: 18rem 1.5rem;
+ }
+}
+
+.footer {
+ background-color: whitesmoke;
+ padding: 3rem 1.5rem 6rem;
+}
+/*# sourceMappingURL=bulma.css.map */
\ No newline at end of file
diff --git a/hshassets/assets/sass/lib/bulma-0.5.1/css/bulma.css.map b/hshassets/assets/sass/lib/bulma-0.5.1/css/bulma.css.map
new file mode 100644
index 0000000000000000000000000000000000000000..9e6b6eb2204de00ff0438cee151de9a77e2dab8e
--- /dev/null
+++ b/hshassets/assets/sass/lib/bulma-0.5.1/css/bulma.css.map
@@ -0,0 +1 @@
+{"version":3,"sources":["../bulma.sass","../sass/utilities/animations.sass","bulma.css","../sass/base/minireset.sass","../sass/base/generic.sass","../sass/utilities/initial-variables.sass","../sass/utilities/mixins.sass","../sass/base/helpers.sass","../sass/elements/box.sass","../sass/elements/button.sass","../sass/utilities/controls.sass","../sass/utilities/functions.sass","../sass/elements/container.sass","../sass/elements/content.sass","../sass/elements/form.sass","../sass/elements/icon.sass","../sass/elements/image.sass","../sass/elements/notification.sass","../sass/elements/progress.sass","../sass/elements/table.sass","../sass/elements/tag.sass","../sass/elements/title.sass","../sass/elements/other.sass","../sass/components/breadcrumb.sass","../sass/components/card.sass","../sass/components/dropdown.sass","../sass/components/level.sass","../sass/components/media.sass","../sass/components/menu.sass","../sass/components/message.sass","../sass/components/modal.sass","../sass/components/nav.sass","../sass/components/navbar.sass","../sass/components/pagination.sass","../sass/components/panel.sass","../sass/components/tabs.sass","../sass/grid/columns.sass","../sass/grid/tiles.sass","../sass/layout/hero.sass","../sass/layout/section.sass","../sass/layout/footer.sass"],"names":[],"mappings":"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4TnC;;AItIC;ECpLE;IACE,2BAA2B;GAAG;CL+TnC;;AKlVC;EACE,6BAA2B;CAAG;;ADqKhC;ECnKE;IACE,6BAA2B;GAAG;CLwVnC;;AIlLC;ECpKE;IACE,6BAA2B;GAAG;CL2VnC;;AIhLC;ECzKE;IACE,6BAA2B;GAAG;CL8VnC;;AIlLC;EC1KE;IACE,6BAA2B;GAAG;CLiWnC;;AIhLC;EC/KE;IACE,6BAA2B;GAAG;CLoWnC;;AI9KC;ECpLE;IACE,6BAA2B;GAAG;CLuWnC;;AK1XC;EACE,8BAA2B;CAAG;;ADqKhC;ECnKE;IACE,8BAA2B;GAAG;CLgYnC;;AI1NC;ECpKE;IACE,8BAA2B;GAAG;CLmYnC;;AIxNC;ECzKE;IACE,8BAA2B;GAAG;CLsYnC;;AI1NC;EC1KE;IACE,8BAA2B;GAAG;CLyYnC;;AIxNC;EC/KE;IACE,8BAA2B;GAAG;CL4YnC;;AItNC;ECpLE;IACE,8BAA2B;GAAG;CL+YnC;;AKlaC;EACE,2BAA2B;CAAG;;ADqKhC;ECnKE;IACE,2BAA2B;GAAG;CLwanC;;AIlQC;ECpKE;IACE,2BAA2B;GAAG;CL2anC;;AIhQC;ECzKE;IACE,2BAA2B;GAAG;CL8anC;;AIlQC;EC1KE;IACE,2BAA2B;GAAG;CLibnC;;AIhQC;EC/KE;IACE,2BAA2B;GAAG;CLobnC;;AI9PC;ECpLE;IACE,2BAA2B;GAAG;CLubnC;;AK1cC;EACE,8BAA2B;CAAG;;ADqKhC;ECnKE;IACE,8BAA2B;GAAG;CLgdnC;;AI1SC;ECpKE;IACE,8BAA2B;GAAG;CLmdnC;;AIxSC;ECzKE;IACE,8BAA2B;GAAG;CLsdnC;;AI1SC;EC1KE;IACE,8BAA2B;GAAG;CLydnC;;AIxSC;EC/KE;IACE,8BAA2B;GAAG;CL4dnC;;AItSC;ECpLE;IACE,8BAA2B;GAAG;CL+dnC;;AK1dC;EACE,8BAAqC;CAAG;;AD6I1C;EC3IE;IACE,8BAAqC;GAAG;CLge7C;;AIlVC;EC5IE;IACE,8BAAqC;GAAG;CLme7C;;AIpVC;EC7IE;IACE,8BAAqC;GAAG;CLse7C;;AItVC;EC9IE;IACE,8BAAqC;GAAG;CLye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B;CaeK;;AAxBnC;EAsBQ,0BbnBsB;CamBK;;AAtBnC;EAwBQ,0BbrBsB;CaqBK;;AAxBnC;EAsBQ,0BbN0B;CaMC;;AAtBnC;EAwBQ,0BbR0B;CaQC;;AAxBnC;EAsBQ,0BbL0B;CaKC;;AAtBnC;EAwBQ,0BbP0B;CaOC;;AAxBnC;EAsBQ,0BbP0B;CaOC;;AAtBnC;EAwBQ,0BbT0B;CaSC;;AAxBnC;EAsBQ,0BbR0B;CaQC;;AAtBnC;EAwBQ,0BbV0B;CaUC;;AAxBnC;EAsBQ,0BbH0B;CaGC;;AAtBnC;EAwBQ,0BbL0B;CaKC;;AAxBnC;EA2BI,gBbMY;CaNU;;AA3B1B;EA6BI,gBbEY;CaFW;;AA7B3B;EA+BI,ebDW;CaCW;;ACb1B;EACE,wBdR6B;EcS7B,edjB4B;EckB5B,sBAAqB;CAyEkE;;AA5EzF;;EAMI,0BdjB0B;EckB1B,sBAxB6B;EAyB7B,sBAxB6B;EAyB7B,oBAAmB;CAYF;;AArBrB;;EAeQ,wBdtBuB;EcuBvB,oBdvBuB;EcwBvB,edpCqB;CcoCE;;AAjB/B;;EAeQ,0BdlCqB;EcmCrB,sBdnCqB;EcoCrB,adxBuB;CcwBA;;AAjB/B;;EAeQ,6BdxBsB;EcyBtB,yBdzBsB;Ec0BtB,edhCsB;CcgCC;;AAjB/B;;EAeQ,0Bd9BsB;Ec+BtB,sBd/BsB;EcgCtB,kBd1BsB;Cc0BC;;AAjB/B;;EAeQ,0BdjB0B;EckB1B,sBdlB0B;EcmB1B,YRXQ;CQWe;;AAjB/B;;EAeQ,0BdhB0B;EciB1B,sBdjB0B;EckB1B,YRXQ;CQWe;;AAjB/B;;EAeQ,0BdlB0B;EcmB1B,sBdnB0B;EcoB1B,YRXQ;CQWe;;AAjB/B;;EAeQ,0BdnB0B;EcoB1B,sBdpB0B;EcqB1B,0BRba;CQaU;;AAjB/B;;EAeQ,0Bdd0B;Ece1B,sBdf0B;EcgB1B,YRXQ;CQWe;;AAjB/B;;EAoBM,oBAAmB;EACnB,UAAS;CAAI;;AArBnB;EAuBI,edtC0B;EcuC1B,iBAAgB;CAAI;;AAxBxB;EA2BM,0BdnCwB;CcmC8B;;AA3B5D;EA6BM,0Bd/B4B;EcgC5B,YRxBU;CQ+BiB;;AArCjC;;EAiCQ,oBAAmB;CAAI;;AAjC/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CZwB;EiCaxB,kBjCPwB;CiCsEiC;;AAhF/D;;EAoBQ,eAAc;CAAI;;AApB1B;EAsBQ,kBjCZsB;CiCYC;;AAtB/B;EAwBQ,gCjCdsB;CiCiBK;;AA3BnC;;EA2BU,kBjCjBoB;CiCiBG;;AA3BjC;EA6BQ,qDjCnBsB;UiCmBtB,6CjCnBsB;CiCmByB;;AhCgKrD;EgC7LF;IAgCU,0BjC5BoB;GiC4BS;CpCqoPtC;;AoCrqPD;;EAmCQ,gCjCzBsB;CiC4BK;;AAtCnC;;;EAsCU,kBjC5BoB;CiC4BG;;AAtCjC;EAyCU,kBjC/BoB;EiCgCpB,aAAY;CAEM;;AA5C5B;EA4CY,WAAU;CAAI;;AA5C1B;EA+CY,WAAU;CAAI;;AA/C1B;EAmDY,kBjCzCkB;CiC2CwB;;AArDtD;EAqDc,wCjCrDe;CiCqDuB;;AArDpD;EAyDc,6BjC/CgB;EiCgDhB,yBjChDgB;EiCiDhB,ejCvDgB;CiCuDA;;AA3D9B;EAgEQ,iFAAyG;CAGW;;AhC0H1H;EgC7LF;IAmEY,iFAAyG;GAAG;CpCkpPvH;;AIxhPC;EgC7LF;IAwEY,6BjC9DkB;GiC8DgB;EAxE9C;IA0EY,wCjC1EiB;GiC0EqB;EA1ElD;IA6Ec,6BjCnEgB;GiCmEkB;EA7EhD;IAgFY,2CjCtEkB;GiCsE2B;CpCopPxD;;AoCpuPD;EAgBM,0BjCC4B;EiCA5B,Y3BQU;C2BuD+C;;AAhF/D;;EAoBQ,eAAc;CAAI;;AApB1B;EAsBQ,Y3BGQ;C2BHe;;AAtB/B;EAwBQ,gC3BCQ;C2BEmB;;AA3BnC;;EA2BU,Y3BFM;C2BEiB;;AA3BjC;EA6BQ,qD3BJQ;U2BIR,6C3BJQ;C2BIuC;;AhCgKrD;EgC7LF;IAgCU,0BjCfwB;GiCeK;CpCquPtC;;AoCrwPD;;EAmCQ,gC3BVQ;C2BamB;;AAtCnC;;;EAsCU,Y3BbM;C2BaiB;;AAtCjC;EAyCU,Y3BhBM;E2BiBN,aAAY;CAEM;;AA5C5B;EA4CY,WAAU;CAAI;;AA5C1B;EA+CY,WAAU;CAAI;;AA/C1B;EAmDY,Y3B1BI;C2B4BsC;;AArDtD;EAqDc,wCjCrDe;CiCqDuB;;AArDpD;EAyDc,uB3BhCE;E2BiCF,mB3BjCE;E2BkCF,ejC1CoB;CiC0CJ;;AA3D9B;EAgEQ,iFAAyG;CAGW;;AhC0H1H;EgC7LF;IAmEY,iFAAyG;GAAG;CpCkvPvH;;AIxnPC;EgC7LF;IAwEY,uB3B/CI;G2B+C8B;EAxE9C;IA0EY,wCjC1EiB;GiC0EqB;EA1ElD;IA6Ec,uB3BpDE;G2BoDgC;EA7EhD;IAgFY,2C3BvDI;G2BuDyC;CpCovPxD;;AoCp0PD;EAgBM,0BjCE4B;EiCD5B,Y3BQU;C2BuD+C;;AAhF/D;;EAoBQ,eAAc;CAAI;;AApB1B;EAsBQ,Y3BGQ;C2BHe;;AAtB/B;EAwBQ,gC3BCQ;C2BEmB;;AA3BnC;;EA2BU,Y3BFM;C2BEiB;;AA3BjC;EA6BQ,qD3BJQ;U2BIR,6C3BJQ;C2BIuC;;AhCgKrD;EgC7LF;IAgCU,0BjCdwB;GiCcK;CpCq0PtC;;AoCr2PD;;EAmCQ,gC3BVQ;C2BamB;;AAtCnC;;;EAsCU,Y3BbM;C2BaiB;;AAtCjC;EAyCU,Y3BhBM;E2BiBN,aAAY;CAEM;;AA5C5B;EA4CY,WAAU;CAAI;;AA5C1B;EA+CY,WAAU;CAAI;;AA/C1B;EAmDY,Y3B1BI;C2B4BsC;;AArDtD;EAqDc,wCjCrDe;CiCqDuB;;AArDpD;EAyDc,uB3BhCE;E2BiCF,mB3BjCE;E2BkCF,ejCzCoB;CiCyCJ;;AA3D9B;EAgEQ,iFAAyG;CAGW;;AhC0H1H;EgC7LF;IAmEY,iFAAyG;GAAG;CpCk1PvH;;AIxtPC;EgC7LF;IAwEY,uB3B/CI;G2B+C8B;EAxE9C;IA0EY,wCjC1EiB;GiC0EqB;EA1ElD;IA6Ec,uB3BpDE;G2BoDgC;EA7EhD;IAgFY,2C3BvDI;G2BuDyC;CpCo1PxD;;AoCp6PD;EAgBM,0BjCA4B;EiCC5B,Y3BQU;C2BuD+C;;AAhF/D;;EAoBQ,eAAc;CAAI;;AApB1B;EAsBQ,Y3BGQ;C2BHe;;AAtB/B;EAwBQ,gC3BCQ;C2BEmB;;AA3BnC;;EA2BU,Y3BFM;C2BEiB;;AA3BjC;EA6BQ,qD3BJQ;U2BIR,6C3BJQ;C2BIuC;;AhCgKrD;EgC7LF;IAgCU,0BjChBwB;GiCgBK;CpCq6PtC;;AoCr8PD;;EAmCQ,gC3BVQ;C2BamB;;AAtCn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","file":"bulma.css"}
\ No newline at end of file
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/docs/.babelrc b/hshassets/assets/sass/lib/bulma-0.5.1/docs/.babelrc
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/docs/.babelrc
rename to hshassets/assets/sass/lib/bulma-0.5.1/docs/.babelrc
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/docs/.gitignore b/hshassets/assets/sass/lib/bulma-0.5.1/docs/.gitignore
similarity index 93%
rename from hshassets/assets/sass/lib/bulma-0.5.0/docs/.gitignore
rename to hshassets/assets/sass/lib/bulma-0.5.1/docs/.gitignore
index f9522fff114b42ee9a72be59330077d13c179cd2..3cae42c56436ec1a3910149ffb8adbf5431d21ef 100644
--- a/hshassets/assets/sass/lib/bulma-0.5.0/docs/.gitignore
+++ b/hshassets/assets/sass/lib/bulma-0.5.1/docs/.gitignore
@@ -6,6 +6,7 @@ _config.version.yml
bulma-test.sass
bulma-website-local.sass
css/bulma-test.css
+PUBLISHING.md
npm-debug.log
# Folders
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/docs/CNAME b/hshassets/assets/sass/lib/bulma-0.5.1/docs/CNAME
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/docs/CNAME
rename to hshassets/assets/sass/lib/bulma-0.5.1/docs/CNAME
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/docs/LICENSE b/hshassets/assets/sass/lib/bulma-0.5.1/docs/LICENSE
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/docs/LICENSE
rename to hshassets/assets/sass/lib/bulma-0.5.1/docs/LICENSE
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/docs/README.md b/hshassets/assets/sass/lib/bulma-0.5.1/docs/README.md
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/docs/README.md
rename to hshassets/assets/sass/lib/bulma-0.5.1/docs/README.md
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/docs/_config.yml b/hshassets/assets/sass/lib/bulma-0.5.1/docs/_config.yml
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/docs/_config.yml
rename to hshassets/assets/sass/lib/bulma-0.5.1/docs/_config.yml
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/docs/_includes/blog-hero.html b/hshassets/assets/sass/lib/bulma-0.5.1/docs/_includes/blog-hero.html
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/docs/_includes/blog-hero.html
rename to hshassets/assets/sass/lib/bulma-0.5.1/docs/_includes/blog-hero.html
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/docs/_includes/bp/desktop.html b/hshassets/assets/sass/lib/bulma-0.5.1/docs/_includes/bp/desktop.html
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/docs/_includes/bp/desktop.html
rename to hshassets/assets/sass/lib/bulma-0.5.1/docs/_includes/bp/desktop.html
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/docs/_includes/bp/fullhd.html b/hshassets/assets/sass/lib/bulma-0.5.1/docs/_includes/bp/fullhd.html
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/docs/_includes/bp/fullhd.html
rename to hshassets/assets/sass/lib/bulma-0.5.1/docs/_includes/bp/fullhd.html
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/docs/_includes/bp/touch.html b/hshassets/assets/sass/lib/bulma-0.5.1/docs/_includes/bp/touch.html
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/docs/_includes/bp/touch.html
rename to hshassets/assets/sass/lib/bulma-0.5.1/docs/_includes/bp/touch.html
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/docs/_includes/bp/widescreen.html b/hshassets/assets/sass/lib/bulma-0.5.1/docs/_includes/bp/widescreen.html
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/docs/_includes/bp/widescreen.html
rename to hshassets/assets/sass/lib/bulma-0.5.1/docs/_includes/bp/widescreen.html
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/docs/_includes/bsa.html b/hshassets/assets/sass/lib/bulma-0.5.1/docs/_includes/bsa.html
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/docs/_includes/bsa.html
rename to hshassets/assets/sass/lib/bulma-0.5.1/docs/_includes/bsa.html
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/docs/_includes/carbon.html b/hshassets/assets/sass/lib/bulma-0.5.1/docs/_includes/carbon.html
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/docs/_includes/carbon.html
rename to hshassets/assets/sass/lib/bulma-0.5.1/docs/_includes/carbon.html
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/docs/_includes/color/black-bis.html b/hshassets/assets/sass/lib/bulma-0.5.1/docs/_includes/color/black-bis.html
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/docs/_includes/color/black-bis.html
rename to hshassets/assets/sass/lib/bulma-0.5.1/docs/_includes/color/black-bis.html
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/docs/_includes/color/black-ter.html b/hshassets/assets/sass/lib/bulma-0.5.1/docs/_includes/color/black-ter.html
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/docs/_includes/color/black-ter.html
rename to hshassets/assets/sass/lib/bulma-0.5.1/docs/_includes/color/black-ter.html
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/docs/_includes/color/black.html b/hshassets/assets/sass/lib/bulma-0.5.1/docs/_includes/color/black.html
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/docs/_includes/color/black.html
rename to hshassets/assets/sass/lib/bulma-0.5.1/docs/_includes/color/black.html
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/docs/_includes/color/blue.html b/hshassets/assets/sass/lib/bulma-0.5.1/docs/_includes/color/blue.html
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/docs/_includes/color/blue.html
rename to hshassets/assets/sass/lib/bulma-0.5.1/docs/_includes/color/blue.html
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/docs/_includes/color/green.html b/hshassets/assets/sass/lib/bulma-0.5.1/docs/_includes/color/green.html
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/docs/_includes/color/green.html
rename to hshassets/assets/sass/lib/bulma-0.5.1/docs/_includes/color/green.html
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/docs/_includes/color/grey-dark.html b/hshassets/assets/sass/lib/bulma-0.5.1/docs/_includes/color/grey-dark.html
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/docs/_includes/color/grey-dark.html
rename to hshassets/assets/sass/lib/bulma-0.5.1/docs/_includes/color/grey-dark.html
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/docs/_includes/color/grey-darker.html b/hshassets/assets/sass/lib/bulma-0.5.1/docs/_includes/color/grey-darker.html
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/docs/_includes/color/grey-darker.html
rename to hshassets/assets/sass/lib/bulma-0.5.1/docs/_includes/color/grey-darker.html
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/docs/_includes/color/grey-light.html b/hshassets/assets/sass/lib/bulma-0.5.1/docs/_includes/color/grey-light.html
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/docs/_includes/color/grey-light.html
rename to hshassets/assets/sass/lib/bulma-0.5.1/docs/_includes/color/grey-light.html
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/docs/_includes/color/grey-lighter.html b/hshassets/assets/sass/lib/bulma-0.5.1/docs/_includes/color/grey-lighter.html
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/docs/_includes/color/grey-lighter.html
rename to hshassets/assets/sass/lib/bulma-0.5.1/docs/_includes/color/grey-lighter.html
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/docs/_includes/color/grey.html b/hshassets/assets/sass/lib/bulma-0.5.1/docs/_includes/color/grey.html
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/docs/_includes/color/grey.html
rename to hshassets/assets/sass/lib/bulma-0.5.1/docs/_includes/color/grey.html
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/docs/_includes/color/orange.html b/hshassets/assets/sass/lib/bulma-0.5.1/docs/_includes/color/orange.html
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/docs/_includes/color/orange.html
rename to hshassets/assets/sass/lib/bulma-0.5.1/docs/_includes/color/orange.html
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/docs/_includes/color/purple.html b/hshassets/assets/sass/lib/bulma-0.5.1/docs/_includes/color/purple.html
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/docs/_includes/color/purple.html
rename to hshassets/assets/sass/lib/bulma-0.5.1/docs/_includes/color/purple.html
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/docs/_includes/color/red.html b/hshassets/assets/sass/lib/bulma-0.5.1/docs/_includes/color/red.html
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/docs/_includes/color/red.html
rename to hshassets/assets/sass/lib/bulma-0.5.1/docs/_includes/color/red.html
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/docs/_includes/color/turquoise.html b/hshassets/assets/sass/lib/bulma-0.5.1/docs/_includes/color/turquoise.html
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/docs/_includes/color/turquoise.html
rename to hshassets/assets/sass/lib/bulma-0.5.1/docs/_includes/color/turquoise.html
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/docs/_includes/color/white-bis.html b/hshassets/assets/sass/lib/bulma-0.5.1/docs/_includes/color/white-bis.html
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/docs/_includes/color/white-bis.html
rename to hshassets/assets/sass/lib/bulma-0.5.1/docs/_includes/color/white-bis.html
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/docs/_includes/color/white-ter.html b/hshassets/assets/sass/lib/bulma-0.5.1/docs/_includes/color/white-ter.html
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/docs/_includes/color/white-ter.html
rename to hshassets/assets/sass/lib/bulma-0.5.1/docs/_includes/color/white-ter.html
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/docs/_includes/color/white.html b/hshassets/assets/sass/lib/bulma-0.5.1/docs/_includes/color/white.html
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/docs/_includes/color/white.html
rename to hshassets/assets/sass/lib/bulma-0.5.1/docs/_includes/color/white.html
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/docs/_includes/color/yellow.html b/hshassets/assets/sass/lib/bulma-0.5.1/docs/_includes/color/yellow.html
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/docs/_includes/color/yellow.html
rename to hshassets/assets/sass/lib/bulma-0.5.1/docs/_includes/color/yellow.html
diff --git a/hshassets/assets/sass/lib/bulma-0.5.1/docs/_includes/comparison.html b/hshassets/assets/sass/lib/bulma-0.5.1/docs/_includes/comparison.html
new file mode 100644
index 0000000000000000000000000000000000000000..ebcd807765ac3fee521f1f12c2384ac6e613cff9
--- /dev/null
+++ b/hshassets/assets/sass/lib/bulma-0.5.1/docs/_includes/comparison.html
@@ -0,0 +1,592 @@
+
+<tr>
+ <th colspan="2">
+ Grid system
+ </th>
+</tr>
+<tr>
+ <td>
+ <a href="{{ site.url }}/documentation/grid/columns/">
+ columns
+ </a>
+ </td>
+ <td>
+ <a href="http://getbootstrap.com/css/#grid" target="_blank">
+ row
+ </a>
+ </td>
+</tr>
+<tr>
+ <td>
+ <a href="{{ site.url }}/documentation/grid/columns/">
+ column
+ </a>
+ </td>
+ <td>
+ <a href="http://getbootstrap.com/css/#grid" target="_blank">
+ col
+ </a>
+ </td>
+</tr>
+<tr>
+ <td class="is-unique">
+ <a href="{{ site.url }}/documentation/grid/tiles/">
+ tile
+ </a>
+ </td>
+ <td class="is-empty">
+ <span>–</span>
+ </td>
+</tr>
+<tr>
+ <th colspan="2">
+ Form
+ </th>
+</tr>
+<tr>
+ <td class="is-unique">
+ <a href="{{ site.url }}/documentation/form/general/">
+ field
+ </a>
+ </td>
+ <td class="is-empty">
+ <span>–</span>
+ </td>
+</tr>
+<tr>
+ <td>
+ <a href="{{ site.url }}/documentation/form/general/">
+ field is-grouped
+ </a>
+ </td>
+ <td>
+ <a href="http://getbootstrap.com/components/#btn-groups" target="_blank">
+ button groups
+ </a>
+ </td>
+</tr>
+<tr>
+ <td>
+ <a href="{{ site.url }}/documentation/form/general/">
+ field is-grouped
+ </a>
+ </td>
+ <td>
+ <a href="http://getbootstrap.com/components/#input-groups" target="_blank">
+ input groups
+ </a>
+ </td>
+</tr>
+<tr>
+ <td>
+ <a href="{{ site.url }}/documentation/form/general/">
+ control
+ </a>
+ </td>
+ <td>
+ <a href="http://getbootstrap.com/css/#forms" target="_blank">
+ form-group
+ </a>
+ </td>
+</tr>
+<tr>
+ <td>
+ <a href="{{ site.url }}/documentation/form/general/">
+ label
+ </a>
+ </td>
+ <td>
+ <a href="http://getbootstrap.com/css/#forms" target="_blank">
+ label
+ </a>
+ </td>
+</tr>
+<tr>
+ <td>
+ <a href="{{ site.url }}/documentation/form/input/">
+ input
+ </a>
+ </td>
+ <td>
+ <a href="http://getbootstrap.com/css/#forms" target="_blank">
+ form-control
+ </a>
+ </td>
+</tr>
+<tr>
+ <td>
+ <a href="{{ site.url }}/documentation/form/textarea/">
+ textarea
+ </a>
+ </td>
+ <td>
+ <a href="http://getbootstrap.com/css/#forms" target="_blank">
+ form-control
+ </a>
+ </td>
+</tr>
+<tr>
+ <td class="is-unique">
+ <a href="{{ site.url }}/documentation/form/select/">
+ select
+ </a>
+ </td>
+ <td class="is-empty">
+ <span>–</span>
+ </td>
+</tr>
+<tr>
+ <td>
+ <a href="{{ site.url }}/documentation/form/checkbox/">
+ checkbox
+ </a>
+ </td>
+ <td>
+ <a href="http://getbootstrap.com/css/#forms" target="_blank">
+ checkbox
+ </a>
+ </td>
+</tr>
+<tr>
+ <td>
+ <a href="{{ site.url }}/documentation/form/radio/">
+ radio
+ </a>
+ </td>
+ <td>
+ <a href="http://getbootstrap.com/css/#forms" target="_blank">
+ radio
+ </a>
+ </td>
+</tr>
+<tr>
+ <td class="is-unique">
+ <a href="{{ site.url }}/documentation/form/file/">
+ file
+ </a>
+ </td>
+ <td class="is-empty">
+ <span>–</span>
+ </td>
+</tr>
+<tr>
+ <td>
+ <a href="{{ site.url }}/documentation/elements/button/">
+ button is-static
+ </a>
+ </td>
+ <td>
+ <a href="http://getbootstrap.com/css/#forms" target="_blank">
+ form-control-static
+ </a>
+ </td>
+</tr>
+<tr>
+ <th colspan="2">
+ Elements
+ </th>
+</tr>
+<tr>
+ <td class="is-unique">
+ <a href="{{ site.url }}/documentation/elements/box/">
+ box
+ </a>
+ </td>
+ <td class="is-empty">
+ <span>–</span>
+ </td>
+</tr>
+<tr>
+ <td>
+ <a href="{{ site.url }}/documentation/elements/button/">
+ button
+ </a>
+ </td>
+ <td>
+ <a href="http://getbootstrap.com/css/#buttons" target="_blank">
+ button
+ </a>
+ </td>
+</tr>
+<tr>
+ <td class="is-unique">
+ <a href="{{ site.url }}/documentation/elements/content/">
+ content
+ </a>
+ </td>
+ <td class="is-empty">
+ <span>–</span>
+ </td>
+</tr>
+<tr>
+ <td>
+ <a href="{{ site.url }}/documentation/elements/delete/">
+ delete
+ </a>
+ </td>
+ <td>
+ <a href="http://getbootstrap.com/css/#helper-classes-close" target="_blank">
+ close
+ </a>
+ </td>
+</tr>
+<tr>
+ <td>
+ <a href="{{ site.url }}/documentation/elements/icon/">
+ icon
+ </a>
+ </td>
+ <td>
+ <a href="http://getbootstrap.com/components/#glyphicons" target="_blank">
+ glyphicon
+ </a>
+ </td>
+</tr>
+<tr>
+ <td>
+ <a href="{{ site.url }}/documentation/elements/image/">
+ image
+ </a>
+ </td>
+ <td>
+ <a href="http://getbootstrap.com/components/#thumbnails" target="_blank">
+ thumbnails
+ </a>
+ </td>
+</tr>
+<tr>
+ <td>
+ <a href="{{ site.url }}/documentation/elements/image/">
+ image is-16by9
+ </a>
+ </td>
+ <td>
+ <a href="http://getbootstrap.com/components/#responsive-embed" target="_blank">
+ responsive embed
+ </a>
+ </td>
+</tr>
+<tr>
+ <td>
+ <a href="{{ site.url }}/documentation/elements/notification/">
+ notification
+ </a>
+ </td>
+ <td>
+ <a href="http://getbootstrap.com/components/#alerts" target="_blank">
+ alerts
+ </a>
+ </td>
+</tr>
+<tr>
+ <td>
+ <a href="{{ site.url }}/documentation/elements/progress/">
+ progress
+ </a>
+ </td>
+ <td>
+ <a href="http://getbootstrap.com/components/#progress" target="_blank">
+ progress bars
+ </a>
+ </td>
+</tr>
+<tr>
+ <td>
+ <a href="{{ site.url }}/documentation/elements/table/">
+ table
+ </a>
+ </td>
+ <td>
+ <a href="http://getbootstrap.com/css/#tables" target="_blank">
+ table
+ </a>
+ </td>
+</tr>
+<tr>
+ <td>
+ <a href="{{ site.url }}/documentation/elements/tag/">
+ tag
+ </a>
+ </td>
+ <td>
+ <a href="http://getbootstrap.com/components/#labels" target="_blank">
+ labels
+ </a>
+ </td>
+</tr>
+<tr>
+ <td>
+ <a href="{{ site.url }}/documentation/elements/tag/">
+ tag is-rounded
+ </a>
+ </td>
+ <td>
+ <a href="http://getbootstrap.com/components/#badges" target="_blank">
+ badges
+ </a>
+ </td>
+</tr>
+<tr>
+ <td>
+ <a href="{{ site.url }}/documentation/elements/title/">
+ title
+ </a>
+ </td>
+ <td>
+ <a href="http://getbootstrap.com/css/#type" target="_blank">
+ h1 .. h6
+ </a>
+ </td>
+</tr>
+<tr>
+ <td>
+ <a href="{{ site.url }}/documentation/elements/title/">
+ subtitle
+ </a>
+ </td>
+ <td>
+ <a href="http://getbootstrap.com/css/#type" target="_blank">
+ h1 .. h6
+ </a>
+ </td>
+</tr>
+<tr>
+ <td class="is-empty">
+ –
+ </td>
+ <td class="is-unique">
+ <a href="http://getbootstrap.com/css/#type-lists" target="_blank">
+ lists
+ </a>
+ </td>
+</tr>
+<tr>
+ <td class="is-empty">
+ –
+ </td>
+ <td class="is-unique">
+ <a href="http://getbootstrap.com/css/#caret" target="_blank">
+ caret
+ </a>
+ </td>
+</tr>
+<tr>
+ <th colspan="2">
+ Components
+ </th>
+</tr>
+<tr>
+ <td>
+ <a href="{{ site.url }}/documentation/components/breadcrumb/">
+ breadcrumb
+ </a>
+ </td>
+ <td>
+ <a href="http://getbootstrap.com/components/#breadcrumbs" target="_blank">
+ breadcrumbs
+ </a>
+ </td>
+</tr>
+<tr>
+ <td class="is-unique">
+ <a href="{{ site.url }}/documentation/components/card/">
+ card
+ </a>
+ </td>
+ <td class="is-empty">
+ <span>–</span>
+ </td>
+</tr>
+<tr>
+ <td>
+ <a href="{{ site.url }}/documentation/components/dropdown/">
+ dropdown
+ </a>
+ </td>
+ <td>
+ <a href="http://getbootstrap.com/components/#btn-dropdowns" target="_blank">
+ dropdowns
+ </a>
+ </td>
+</tr>
+<tr>
+ <td class="is-unique">
+ <a href="{{ site.url }}/documentation/components/level/">
+ level
+ </a>
+ </td>
+ <td class="is-empty">
+ <span>–</span>
+ </td>
+</tr>
+<tr>
+ <td class="is-empty">
+ –
+ </td>
+ <td class="is-unique">
+ <a href="http://getbootstrap.com/components/#list-group" target="_blank">
+ list group
+ </a>
+ </td>
+</tr>
+<tr>
+ <td>
+ <a href="{{ site.url }}/documentation/components/media-object/">
+ media object
+ </a>
+ </td>
+ <td>
+ <a href="http://getbootstrap.com/components/#media" target="_blank">
+ media object
+ </a>
+ </td>
+</tr>
+<tr>
+ <td class="is-unique">
+ <a href="{{ site.url }}/documentation/components/menu/">
+ menu
+ </a>
+ </td>
+ <td class="is-empty">
+ <span>–</span>
+ </td>
+</tr>
+<tr>
+ <td>
+ <a href="{{ site.url }}/documentation/components/message/">
+ message
+ </a>
+ </td>
+ <td>
+ <a href="http://getbootstrap.com/components/#panels" target="_blank">
+ panels
+ </a>
+ </td>
+</tr>
+<tr>
+ <td>
+ <a href="{{ site.url }}/documentation/components/modal/">
+ modal
+ </a>
+ </td>
+ <td>
+ <a href="http://getbootstrap.com/javascript/#modals" target="_blank">
+ modal
+ </a>
+ </td>
+</tr>
+<tr>
+ <td>
+ <a href="{{ site.url }}/documentation/components/navbar/">
+ navbar
+ </a>
+ </td>
+ <td>
+ <a href="http://getbootstrap.com/components/#navbar" target="_blank">
+ navbar
+ </a>
+ </td>
+</tr>
+<tr>
+ <td class="is-empty">
+ –
+ </td>
+ <td class="is-unique">
+ <a href="http://getbootstrap.com/components/#page-header" target="_blank">
+ page header
+ </a>
+ </td>
+</tr>
+<tr>
+ <td>
+ <a href="{{ site.url }}/documentation/components/pagination/">
+ pagination
+ </a>
+ </td>
+ <td>
+ <a href="http://getbootstrap.com/components/#pagination" target="_blank">
+ pagination
+ </a>
+ </td>
+</tr>
+<tr>
+ <td class="is-unique">
+ <a href="{{ site.url }}/documentation/components/panel/">
+ panel
+ </a>
+ </td>
+ <td class="is-empty">
+ <span>–</span>
+ </td>
+</tr>
+<tr>
+ <td>
+ <a href="{{ site.url }}/documentation/components/tabs/">
+ tabs
+ </a>
+ </td>
+ <td>
+ <a href="http://getbootstrap.com/components/#navs" target="_blank">
+ navs
+ </a>
+ </td>
+</tr>
+<tr>
+ <td class="is-empty">
+ –
+ </td>
+ <td class="is-unique">
+ <a href="http://getbootstrap.com/components/#wells" target="_blank">
+ wells
+ </a>
+ </td>
+</tr>
+<tr>
+ <th colspan="2">
+ Layout
+ </th>
+</tr>
+<tr>
+ <td>
+ <a href="{{ site.url }}/documentation/layout/container/">
+ container
+ </a>
+ </td>
+ <td>
+ <a href="http://getbootstrap.com/css/#overview-container" target="_blank">
+ container
+ </a>
+ </td>
+</tr>
+<tr>
+ <td>
+ <a href="{{ site.url }}/documentation/layout/hero/">
+ hero
+ </a>
+ </td>
+ <td>
+ <a href="http://getbootstrap.com/components/#jumbotron" target="_blank">
+ jumbotron
+ </a>
+ </td>
+</tr>
+<tr>
+ <td class="is-unique">
+ <a href="{{ site.url }}/documentation/layout/section/">
+ section
+ </a>
+ </td>
+ <td class="is-empty">
+ <span>–</span>
+ </td>
+</tr>
+<tr>
+ <td class="is-unique">
+ <a href="{{ site.url }}/documentation/layout/footer/">
+ footer
+ </a>
+ </td>
+ <td class="is-empty">
+ <span>–</span>
+ </td>
+</tr>
\ No newline at end of file
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/docs/_includes/deprecated.html b/hshassets/assets/sass/lib/bulma-0.5.1/docs/_includes/deprecated.html
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/docs/_includes/deprecated.html
rename to hshassets/assets/sass/lib/bulma-0.5.1/docs/_includes/deprecated.html
diff --git a/hshassets/assets/sass/lib/bulma-0.5.1/docs/_includes/elements/tw-button.html b/hshassets/assets/sass/lib/bulma-0.5.1/docs/_includes/elements/tw-button.html
new file mode 100644
index 0000000000000000000000000000000000000000..c15d2b3e3c19c1b66f4a8d6899944023098778af
--- /dev/null
+++ b/hshassets/assets/sass/lib/bulma-0.5.1/docs/_includes/elements/tw-button.html
@@ -0,0 +1,13 @@
+<a class="tw-button button"
+ data-social-network="Twitter"
+ data-social-action="tweet"
+ data-social-target="{{ site.url }}"
+ target="_blank"
+ href="https://twitter.com/intent/tweet?text={{ site.title | urlencode }}&hashtags=bulmaio&url={{ site.url }}&via=jgthms">
+ <span class="icon">
+ <i class="fa fa-twitter"></i>
+ </span>
+ <span>
+ {{ include.label }}
+ </span>
+</a>
\ No newline at end of file
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/docs/_includes/features.html b/hshassets/assets/sass/lib/bulma-0.5.1/docs/_includes/features.html
similarity index 99%
rename from hshassets/assets/sass/lib/bulma-0.5.0/docs/_includes/features.html
rename to hshassets/assets/sass/lib/bulma-0.5.1/docs/_includes/features.html
index f730449cd95f5b3276d9e908456f703c6be268e5..b5cef5510f9184308ef7106a6d0d4c7d47847cc9 100644
--- a/hshassets/assets/sass/lib/bulma-0.5.0/docs/_includes/features.html
+++ b/hshassets/assets/sass/lib/bulma-0.5.1/docs/_includes/features.html
@@ -125,7 +125,7 @@
{% endcapture %}
{% capture cards %}
-<div class="columns is-mobile">
+<div class="columns">
<div class="column is-half">
<div class="card">
<div class="card-image">
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/docs/_includes/footer.html b/hshassets/assets/sass/lib/bulma-0.5.1/docs/_includes/footer.html
similarity index 97%
rename from hshassets/assets/sass/lib/bulma-0.5.0/docs/_includes/footer.html
rename to hshassets/assets/sass/lib/bulma-0.5.1/docs/_includes/footer.html
index 34c2d11197c9e8bc0774d9d8ce29ed98e986c09f..291fee5a01b62a3822056c9ce4a12fe7b6ba042d 100644
--- a/hshassets/assets/sass/lib/bulma-0.5.0/docs/_includes/footer.html
+++ b/hshassets/assets/sass/lib/bulma-0.5.1/docs/_includes/footer.html
@@ -47,6 +47,9 @@
<div class="column is-3">
<div id="about" class="content">
<strong xmlns:dct="http://purl.org/dc/terms/" href="http://purl.org/dc/dcmitype/Text" property="dct:title" rel="dct:type">Bulma</strong> by <a xmlns:cc="http://creativecommons.org/ns#" href="http://jgthms.com" property="cc:attributionName" rel="cc:attributionURL">Jeremy Thomas</a>.
+ <p id="alternative">
+ <a href="{{ site.url }}/alternative-to-bootstrap/">An alternative to <strong>Bootstrap</strong></a>
+ </p>
{% unless site.env == "development" %}
<div class="twitter-container">
<a href="{{ site.twitter }}" class="twitter-follow-button" data-show-count="true" data-lang="en" data-size="large">@jgthms</a>
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/docs/_includes/getting-started.html b/hshassets/assets/sass/lib/bulma-0.5.1/docs/_includes/getting-started.html
similarity index 94%
rename from hshassets/assets/sass/lib/bulma-0.5.0/docs/_includes/getting-started.html
rename to hshassets/assets/sass/lib/bulma-0.5.1/docs/_includes/getting-started.html
index 5e08d4c27bae5f8059b3289ac66c820d270f1ca4..eb30d11eba0d1fa0bd97b5201e820fa9451309ad 100644
--- a/hshassets/assets/sass/lib/bulma-0.5.0/docs/_includes/getting-started.html
+++ b/hshassets/assets/sass/lib/bulma-0.5.1/docs/_includes/getting-started.html
@@ -1,6 +1,7 @@
<!DOCTYPE html>
<html>
<head>
+ <meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Hello Bulma!</title>
<link rel="stylesheet" href="{{ site.fontawesome }}">
@@ -18,4 +19,4 @@
</div>
</section>
</body>
-</html>
\ No newline at end of file
+</html>
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/docs/_includes/head.html b/hshassets/assets/sass/lib/bulma-0.5.1/docs/_includes/head.html
similarity index 93%
rename from hshassets/assets/sass/lib/bulma-0.5.0/docs/_includes/head.html
rename to hshassets/assets/sass/lib/bulma-0.5.1/docs/_includes/head.html
index 45d483ea19848325b7cbe1f3129db39cca5c1095..e4bc3b894074fd4a06fe3cfe12a151bc8188cd58 100644
--- a/hshassets/assets/sass/lib/bulma-0.5.0/docs/_includes/head.html
+++ b/hshassets/assets/sass/lib/bulma-0.5.1/docs/_includes/head.html
@@ -4,7 +4,7 @@
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta name="description" content="{% if page.excerpt %}{{ page.excerpt | strip_html | strip_newlines | truncate: 160 }}{% else %}{{ site.description }}{% endif %}">
- <title>{% if page.title %}{{ page.title }} | {% endif %}{{ site.title }}</title>
+ <title>{% if page.fulltitle %}{{ page.fulltitle }}{% else %}{% if page.title %}{{ page.title }} | {% endif %}{{ site.title }}{% endif %}</title>
<link rel="stylesheet" href="{{ site.fontawesome }}">
<link rel="stylesheet" href="{{ site.url }}/css/bulma-docs.css">
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/docs/_includes/header.html b/hshassets/assets/sass/lib/bulma-0.5.1/docs/_includes/header.html
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/docs/_includes/header.html
rename to hshassets/assets/sass/lib/bulma-0.5.1/docs/_includes/header.html
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/docs/_includes/heading.html b/hshassets/assets/sass/lib/bulma-0.5.1/docs/_includes/heading.html
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/docs/_includes/heading.html
rename to hshassets/assets/sass/lib/bulma-0.5.1/docs/_includes/heading.html
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/docs/_includes/meta.html b/hshassets/assets/sass/lib/bulma-0.5.1/docs/_includes/meta.html
similarity index 83%
rename from hshassets/assets/sass/lib/bulma-0.5.0/docs/_includes/meta.html
rename to hshassets/assets/sass/lib/bulma-0.5.1/docs/_includes/meta.html
index f8e86275b5efb6c8abaeb1735e71f7f729858eb5..94bbdca32a9e5ed22e3085926394a1f88447af28 100644
--- a/hshassets/assets/sass/lib/bulma-0.5.0/docs/_includes/meta.html
+++ b/hshassets/assets/sass/lib/bulma-0.5.1/docs/_includes/meta.html
@@ -1,4 +1,4 @@
-<div id="meta" class="field is-grouped">
+<div id="meta" class="field is-grouped is-grouped-multiline">
{% if include.new %}
<div class="control">
@@ -8,6 +8,14 @@
</div>
{% endif %}
+ {% if include.experimental %}
+ <div class="control">
+ <div class="tags">
+ <span class="tag is-warning">Experimental</span>
+ </div>
+ </div>
+ {% endif %}
+
{% if include.since %}
<div class="control">
<div class="tags has-addons">
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/docs/_includes/navbar.html b/hshassets/assets/sass/lib/bulma-0.5.1/docs/_includes/navbar.html
similarity index 89%
rename from hshassets/assets/sass/lib/bulma-0.5.0/docs/_includes/navbar.html
rename to hshassets/assets/sass/lib/bulma-0.5.1/docs/_includes/navbar.html
index 7d3eb2780ce61b68d2fac3e40375a0da7780e4a3..f16a7d1f33978510777cca1ef78a64c359a21259 100644
--- a/hshassets/assets/sass/lib/bulma-0.5.0/docs/_includes/navbar.html
+++ b/hshassets/assets/sass/lib/bulma-0.5.1/docs/_includes/navbar.html
@@ -25,9 +25,6 @@
<div id="navMenu{{ include.id }}" class="navbar-menu">
<div class="navbar-start">
- <a class="navbar-item {% if page.route == 'index' %}is-active{% endif %}" href="{{ site.url }}/">
- Home
- </a>
<div class="navbar-item has-dropdown is-hoverable">
<a class="navbar-link {% if page.route == 'documentation' %}is-active{% endif %} {% if page.layout == 'documentation' %}is-active{% endif %}" href="{{ site.documentation }}">
Docs
@@ -42,6 +39,9 @@
<a class="navbar-item {% if page.doc-tab == 'grid' %}is-active{% endif %}" href="{{ site.url }}/documentation/grid/columns/">
Grid
</a>
+ <a class="navbar-item {% if page.doc-tab == 'layout' %}is-active{% endif %}" href="{{ site.url }}/documentation/layout/container/">
+ Layout
+ </a>
<a class="navbar-item {% if page.doc-tab == 'form' %}is-active{% endif %}" href="{{ site.url }}/documentation/form/general/">
Form
</a>
@@ -57,9 +57,6 @@
Components
</a>
{% endif %}
- <a class="navbar-item {% if page.doc-tab == 'layout' %}is-active{% endif %}" href="{{ site.url }}/documentation/layout/container/">
- Layout
- </a>
<hr class="navbar-divider">
<div class="navbar-item">
<div>
@@ -144,30 +141,27 @@
</a>
</div>
</div>
+ <a class="navbar-item {% if page.route == 'expo' %}is-active{% endif %}" href="{{ site.url }}/expo/">
+ <span class="emoji">🎨</span>
+ Expo
+ </a>
+ <a class="navbar-item {% if page.route == 'love' %}is-active{% endif %}" href="{{ site.url }}/love/">
+ <span class="emoji">❤️</span>
+ Love
+ </a>
</div>
<div class="navbar-end">
- <a class="navbar-item" href="{{ site.github }}" target="_blank">
+ <a class="navbar-item is-hidden-desktop-only" href="{{ site.github }}" target="_blank">
Github
</a>
- <a class="navbar-item" href="{{ site.twitter }}" target="_blank">
+ <a class="navbar-item is-hidden-desktop-only" href="{{ site.twitter }}" target="_blank">
Twitter
</a>
<div class="navbar-item">
<div class="field is-grouped">
<p class="control">
- <a id="twitter"
- class="button"
- data-social-network="Twitter"
- data-social-action="tweet"
- data-social-target="{{ site.url }}"
- target="_blank"
- href="https://twitter.com/intent/tweet?text={{ site.title | urlencode }}&url={{ site.url }}&via=jgthms">
- <span class="icon">
- <i class="fa fa-twitter"></i>
- </span>
- <span>Tweet</span>
- </a>
+ {% include elements/tw-button.html label="Tweet" %}
</p>
<p class="control">
<a class="button is-primary" href="{{ site.download }}">
diff --git a/hshassets/assets/sass/lib/bulma-0.5.1/docs/_includes/pro.html b/hshassets/assets/sass/lib/bulma-0.5.1/docs/_includes/pro.html
new file mode 100644
index 0000000000000000000000000000000000000000..40d8cbb22c4d0d2974c3557117b932f0b2e43843
--- /dev/null
+++ b/hshassets/assets/sass/lib/bulma-0.5.1/docs/_includes/pro.html
@@ -0,0 +1,15 @@
+<article class="media pro is-{{ include.type }}">
+ <aside class="media-left">
+ <span class="icon">
+ <i class="fa fa-{{ include.icon }}"></i>
+ </span>
+ </aside>
+ <div class="media-content">
+ <p class="title is-5 pro-title">
+ {{ include.title }}
+ </p>
+ <div class="pro-content">
+ {{ include.content | markdownify }}
+ </div>
+ </div>
+</article>
\ No newline at end of file
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/docs/_includes/subnav-components.html b/hshassets/assets/sass/lib/bulma-0.5.1/docs/_includes/subnav-components.html
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/docs/_includes/subnav-components.html
rename to hshassets/assets/sass/lib/bulma-0.5.1/docs/_includes/subnav-components.html
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/docs/_includes/subnav-elements.html b/hshassets/assets/sass/lib/bulma-0.5.1/docs/_includes/subnav-elements.html
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/docs/_includes/subnav-elements.html
rename to hshassets/assets/sass/lib/bulma-0.5.1/docs/_includes/subnav-elements.html
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/docs/_includes/subnav-form.html b/hshassets/assets/sass/lib/bulma-0.5.1/docs/_includes/subnav-form.html
similarity index 81%
rename from hshassets/assets/sass/lib/bulma-0.5.0/docs/_includes/subnav-form.html
rename to hshassets/assets/sass/lib/bulma-0.5.1/docs/_includes/subnav-form.html
index 76e0503327a7a2f20db9183ef52728a64fa9e4e6..69152fdaf486c03ad3acf41d4497b8f489d0916c 100644
--- a/hshassets/assets/sass/lib/bulma-0.5.0/docs/_includes/subnav-form.html
+++ b/hshassets/assets/sass/lib/bulma-0.5.1/docs/_includes/subnav-form.html
@@ -19,6 +19,12 @@
<a class="navbar-item is-tab {% if page.doc-subtab == 'radio' %}is-active{% endif %}" href="{{ site.url }}/documentation/form/radio/">
Radio
</a>
+ <a class="navbar-item is-tab {% if page.doc-subtab == 'file' %}is-active{% endif %}" href="{{ site.url }}/documentation/form/file/">
+ File
+ <span class="tag is-success" style="margin-left: 1em;">
+ New!
+ </span>
+ </a>
</div>
</div>
</nav>
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/docs/_includes/subnav-grid.html b/hshassets/assets/sass/lib/bulma-0.5.1/docs/_includes/subnav-grid.html
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/docs/_includes/subnav-grid.html
rename to hshassets/assets/sass/lib/bulma-0.5.1/docs/_includes/subnav-grid.html
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/docs/_includes/subnav-layout.html b/hshassets/assets/sass/lib/bulma-0.5.1/docs/_includes/subnav-layout.html
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/docs/_includes/subnav-layout.html
rename to hshassets/assets/sass/lib/bulma-0.5.1/docs/_includes/subnav-layout.html
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/docs/_includes/subnav-modifiers.html b/hshassets/assets/sass/lib/bulma-0.5.1/docs/_includes/subnav-modifiers.html
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/docs/_includes/subnav-modifiers.html
rename to hshassets/assets/sass/lib/bulma-0.5.1/docs/_includes/subnav-modifiers.html
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/docs/_includes/subnav-overview.html b/hshassets/assets/sass/lib/bulma-0.5.1/docs/_includes/subnav-overview.html
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/docs/_includes/subnav-overview.html
rename to hshassets/assets/sass/lib/bulma-0.5.1/docs/_includes/subnav-overview.html
diff --git a/hshassets/assets/sass/lib/bulma-0.5.1/docs/_includes/svg/bootstrap-icon.svg b/hshassets/assets/sass/lib/bulma-0.5.1/docs/_includes/svg/bootstrap-icon.svg
new file mode 100644
index 0000000000000000000000000000000000000000..034c0605e0c2468f3a0563fdbae210a5e1ec668a
--- /dev/null
+++ b/hshassets/assets/sass/lib/bulma-0.5.1/docs/_includes/svg/bootstrap-icon.svg
@@ -0,0 +1,14 @@
+<svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
+ viewBox="0 0 612 612" enable-background="new 0 0 612 612" xml:space="preserve">
+<g odipodi:docname="twitter_bootstrap_logo.svg" inkscape:version="0.48.1 r9760" xmlns:svg="http://www.w3.org/2000/svg" xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd" xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#" xmlns:dc="http://purl.org/dc/elements/1.1/" xmlns:cc="http://creativecommons.org/ns#" xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape">
+ <path fill="#563D7C" d="M612,510c0,56.1-45.9,102-102,102H102C45.9,612,0,566.1,0,510V102C0,45.9,45.9,0,102,0h408
+ c56.1,0,102,45.9,102,102V510z"/>
+ <g enable-background="new">
+ <path fill="#FFFFFF" d="M166.3,133h173.5c32,0,57.7,7.3,77,22s29,36.8,29,66.5c0,18-4.4,33.4-13.2,46.2
+ c-8.8,12.8-21.4,22.8-37.8,29.8v1c22,4.7,38.7,15.1,50,31.2c11.3,16.2,17,36.4,17,60.8c0,14-2.5,27.1-7.5,39.2
+ c-5,12.2-12.8,22.7-23.5,31.5s-24.3,15.8-41,21s-36.5,7.8-59.5,7.8h-164L166.3,133L166.3,133z M228.8,282.5h102
+ c15,0,27.5-4.2,37.5-12.8s15-20.8,15-36.8c0-18-4.5-30.7-13.5-38s-22-11-39-11h-102L228.8,282.5L228.8,282.5z M228.8,439h110.5
+ c19,0,33.8-4.9,44.2-14.8c10.5-9.8,15.8-23.8,15.8-41.8c0-17.7-5.2-31.2-15.8-40.8s-25.2-14.2-44.2-14.2H228.8V439z"/>
+ </g>
+</g>
+</svg>
diff --git a/hshassets/assets/sass/lib/bulma-0.5.1/docs/_includes/svg/bulma-b.svg b/hshassets/assets/sass/lib/bulma-0.5.1/docs/_includes/svg/bulma-b.svg
new file mode 100644
index 0000000000000000000000000000000000000000..77feb712f30e6488b7fe47914b1d7a5d9b5f40f7
--- /dev/null
+++ b/hshassets/assets/sass/lib/bulma-0.5.1/docs/_includes/svg/bulma-b.svg
@@ -0,0 +1,7 @@
+<svg width="220px" height="320px" viewBox="0 0 220 320" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+ <g stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+ <g fill="#00D1B2">
+ <polygon id="Path" points="0 220 20 80 100 0 200 100 140 160 220 240 100 320"></polygon>
+ </g>
+ </g>
+</svg>
\ No newline at end of file
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/docs/_includes/svg/bulma-icon.svg b/hshassets/assets/sass/lib/bulma-0.5.1/docs/_includes/svg/bulma-icon.svg
similarity index 86%
rename from hshassets/assets/sass/lib/bulma-0.5.0/docs/_includes/svg/bulma-icon.svg
rename to hshassets/assets/sass/lib/bulma-0.5.1/docs/_includes/svg/bulma-icon.svg
index db74a8945a7327e700922a062cecdfef3b35f54b..4602fa1750ff21bd0af68591197a7297ca7221a5 100644
--- a/hshassets/assets/sass/lib/bulma-0.5.0/docs/_includes/svg/bulma-icon.svg
+++ b/hshassets/assets/sass/lib/bulma-0.5.1/docs/_includes/svg/bulma-icon.svg
@@ -1,4 +1,3 @@
-<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<svg width="480px" height="480px" viewBox="0 0 480 480" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<g stroke="none" stroke-width="1" fill="#00d1b2" fill-rule="evenodd">
<polygon id="Path" points="136 296 156 156 236 76 336 176 276 236 356 316 236 396"></polygon>
diff --git a/hshassets/assets/sass/lib/bulma-0.5.1/docs/_includes/testimonials.html b/hshassets/assets/sass/lib/bulma-0.5.1/docs/_includes/testimonials.html
new file mode 100644
index 0000000000000000000000000000000000000000..3140a43c266819cf6487a1b5f8e3de43f4822e4f
--- /dev/null
+++ b/hshassets/assets/sass/lib/bulma-0.5.1/docs/_includes/testimonials.html
@@ -0,0 +1,41 @@
+<div class="container">
+ <div class="columns">
+ <div class="column is-4">
+ <article class="testimonial">
+ <blockquote class="twitter-tweet" data-lang="en"><p lang="en" dir="ltr">So, I was making an exam and in a matter of 30 minutes I had my structure complete with responsive, Bulma is crazy. Thanks <a href="https://twitter.com/jgthms">@jgthms</a></p>— Francisco Cruz (@atFranCruz) <a href="https://twitter.com/atFranCruz/status/868829487072464897">May 28, 2017</a></blockquote>
+ </article>
+
+ <article class="testimonial">
+ <blockquote class="twitter-tweet" data-lang="en"><p lang="en" dir="ltr"><a href="https://twitter.com/jgthms">@jgthms</a> Hey Jeremy! Been putting Bulma into a project during the last days - absolutely love it! Well done! 😍</p>— Simon Jaeger (@simonjaegr) <a href="https://twitter.com/simonjaegr/status/834140257054502913">February 21, 2017</a></blockquote>
+ </article>
+ </div>
+
+ <div class="column is-4">
+ <article class="testimonial">
+ <blockquote class="twitter-tweet" data-cards="hidden" data-lang="en"><p lang="en" dir="ltr">Bulma, I think I'm in love. <a href="https://t.co/APYefmC1Bs">https://t.co/APYefmC1Bs</a> via <a href="https://twitter.com/jgthms">@jgthms</a></p>— Jesse Schoff (@jesseschoff) <a href="https://twitter.com/jesseschoff/status/869284735440363520">May 29, 2017</a></blockquote>
+ </article>
+
+ <article class="testimonial">
+ <blockquote class="twitter-tweet" data-cards="hidden" data-lang="en"><p lang="en" dir="ltr"><a href="https://t.co/ClYmBd8tGR">https://t.co/ClYmBd8tGR</a> is an impressive CSS framework. Flexbox grid, no JS, modular components (use what you need), Sass.<br><br>💯 <a href="https://twitter.com/jgthms">@jgthms</a>.</p>— scottgallant (@scottgallant) <a href="https://twitter.com/scottgallant/status/835834634655174658">February 26, 2017</a></blockquote>
+ </article>
+ </div>
+
+ <div class="column is-4">
+ <article class="testimonial">
+ <blockquote class="twitter-tweet" data-cards="hidden" data-lang="en"><p lang="en" dir="ltr">I usually hate having to write CSS, but I really like working with the lightweight Bulma (<a href="https://t.co/OAMLjKWzak">https://t.co/OAMLjKWzak</a>) by <a href="https://twitter.com/jgthms">@jgthms</a> so far 👍</p>— mario zupan (@mzupzup) <a href="https://twitter.com/mzupzup/status/874925154475929602">June 14, 2017</a></blockquote>
+ </article>
+
+ <article class="testimonial">
+ <blockquote class="twitter-tweet" data-lang="en"><p lang="en" dir="ltr"><a href="https://twitter.com/jgthms">@jgthms</a> Hey.I just stopped by here to say thank you so much for Bulma. It made my website looks 100 times better 😍</p>— juliooooo (@juliooooo000) <a href="https://twitter.com/juliooooo000/status/819710615337857024">January 13, 2017</a></blockquote>
+ </article>
+ </div>
+ </div>
+
+ <div class="more-loves">
+ <p class="more-loves-container">
+ <a class="button is-medium is-danger rainbow" href="{{ site.url }}/love/">
+ <span>See more <strong>love</strong> 🤗</span>
+ </a>
+ </p>
+ </div>
+</div>
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/docs/_includes/variables.html b/hshassets/assets/sass/lib/bulma-0.5.1/docs/_includes/variables.html
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/docs/_includes/variables.html
rename to hshassets/assets/sass/lib/bulma-0.5.1/docs/_includes/variables.html
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/docs/_javascript/bulma.js b/hshassets/assets/sass/lib/bulma-0.5.1/docs/_javascript/bulma.js
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/docs/_javascript/bulma.js
rename to hshassets/assets/sass/lib/bulma-0.5.1/docs/_javascript/bulma.js
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/docs/_javascript/index.js b/hshassets/assets/sass/lib/bulma-0.5.1/docs/_javascript/index.js
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/docs/_javascript/index.js
rename to hshassets/assets/sass/lib/bulma-0.5.1/docs/_javascript/index.js
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/docs/_javascript/main.js b/hshassets/assets/sass/lib/bulma-0.5.1/docs/_javascript/main.js
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/docs/_javascript/main.js
rename to hshassets/assets/sass/lib/bulma-0.5.1/docs/_javascript/main.js
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/docs/_layouts/default.html b/hshassets/assets/sass/lib/bulma-0.5.1/docs/_layouts/default.html
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/docs/_layouts/default.html
rename to hshassets/assets/sass/lib/bulma-0.5.1/docs/_layouts/default.html
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/docs/_layouts/documentation.html b/hshassets/assets/sass/lib/bulma-0.5.1/docs/_layouts/documentation.html
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/docs/_layouts/documentation.html
rename to hshassets/assets/sass/lib/bulma-0.5.1/docs/_layouts/documentation.html
index 05e3693c0bcca6001c7b02cdc384d197791bfe15..aaa1fa7dcb92be822ff76dcfbcdc04ee9c73de70 100644
--- a/hshassets/assets/sass/lib/bulma-0.5.0/docs/_layouts/documentation.html
+++ b/hshassets/assets/sass/lib/bulma-0.5.1/docs/_layouts/documentation.html
@@ -39,6 +39,9 @@ route: documentation
<li {% if page.doc-tab == 'grid' %}class="is-active"{% endif %}>
<a href="{{ site.url }}/documentation/grid/columns">Grid</a>
</li>
+ <li {% if page.doc-tab == 'layout' %}class="is-active"{% endif %}>
+ <a href="{{ site.url }}/documentation/layout/container/">Layout</a>
+ </li>
<li {% if page.doc-tab == 'form' %}class="is-active"{% endif %}>
<a href="{{ site.url }}/documentation/form/general">Form</a>
</li>
@@ -52,9 +55,6 @@ route: documentation
<a href="{{ site.url }}/documentation/components/card/">Components</a>
{% endif %}
</li>
- <li {% if page.doc-tab == 'layout' %}class="is-active"{% endif %}>
- <a href="{{ site.url }}/documentation/layout/container/">Layout</a>
- </li>
</ul>
</div>
</div>
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/docs/_layouts/post.html b/hshassets/assets/sass/lib/bulma-0.5.1/docs/_layouts/post.html
similarity index 61%
rename from hshassets/assets/sass/lib/bulma-0.5.0/docs/_layouts/post.html
rename to hshassets/assets/sass/lib/bulma-0.5.1/docs/_layouts/post.html
index 86e5d23eaee4cbd3e2beb39a1ec1154610707bb3..0b55962e827e475d2957e458e1d4994ac5696ac6 100644
--- a/hshassets/assets/sass/lib/bulma-0.5.0/docs/_layouts/post.html
+++ b/hshassets/assets/sass/lib/bulma-0.5.1/docs/_layouts/post.html
@@ -12,19 +12,21 @@ route: blog
<div class="article-image is-single is-{{ page.color }}">
<span class="article-overlay"></span>
<span class="article-icon">
- <span class="icon">
- <i class="fa fa-{{ page.icon }}"></i>
- </span>
+ <i class="fa fa-{{ page.icon }}"></i>
</span>
- <strong class="article-title">
- {{ page.name }}
+ <strong class="article-info">
+ <span>
+ <time class="article-date" datetime="{{ page.date | date_to_xmlschema }}">
+ {{ page.date | date_to_string }}
+ </time>
+ <strong class="article-title">
+ {{ page.name }}
+ </strong>
+ </span>
</strong>
</div>
<p class="subtitle is-6">
- <a class="article-back href="{{ site.url }}/blog">Back</a>
- </p>
- <p class="subtitle is-4">
- {{ page.date | date_to_string }}
+ <a class="article-back" href="{{ site.url }}/blog">Back</a>
</p>
<h1 class="title is-2">
{{ page.title }}
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/docs/_posts/2016-02-09-blog-launched-new-responsive-columns-new-helpers.md b/hshassets/assets/sass/lib/bulma-0.5.1/docs/_posts/2016-02-09-blog-launched-new-responsive-columns-new-helpers.md
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/docs/_posts/2016-02-09-blog-launched-new-responsive-columns-new-helpers.md
rename to hshassets/assets/sass/lib/bulma-0.5.1/docs/_posts/2016-02-09-blog-launched-new-responsive-columns-new-helpers.md
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/docs/_posts/2016-04-11-metro-ui-css-grid-with-bulma-tiles.md b/hshassets/assets/sass/lib/bulma-0.5.1/docs/_posts/2016-04-11-metro-ui-css-grid-with-bulma-tiles.md
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/docs/_posts/2016-04-11-metro-ui-css-grid-with-bulma-tiles.md
rename to hshassets/assets/sass/lib/bulma-0.5.1/docs/_posts/2016-04-11-metro-ui-css-grid-with-bulma-tiles.md
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/docs/_posts/2017-03-10-new-field-element.md b/hshassets/assets/sass/lib/bulma-0.5.1/docs/_posts/2017-03-10-new-field-element.md
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/docs/_posts/2017-03-10-new-field-element.md
rename to hshassets/assets/sass/lib/bulma-0.5.1/docs/_posts/2017-03-10-new-field-element.md
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/docs/_posts/2017-07-24-access-previous-bulma-versions.md b/hshassets/assets/sass/lib/bulma-0.5.1/docs/_posts/2017-07-24-access-previous-bulma-versions.md
similarity index 76%
rename from hshassets/assets/sass/lib/bulma-0.5.0/docs/_posts/2017-07-24-access-previous-bulma-versions.md
rename to hshassets/assets/sass/lib/bulma-0.5.1/docs/_posts/2017-07-24-access-previous-bulma-versions.md
index e2ff423e728977e3ce15f1cac959d78e0d9cf399..776ba71303ba0621e6583a0ae2594bb138b43386 100644
--- a/hshassets/assets/sass/lib/bulma-0.5.0/docs/_posts/2017-07-24-access-previous-bulma-versions.md
+++ b/hshassets/assets/sass/lib/bulma-0.5.1/docs/_posts/2017-07-24-access-previous-bulma-versions.md
@@ -9,10 +9,4 @@ icon: "undo"
It is now possible to **access previous versions** of Bulma. Just head towards: [http://bulma.io/versions/](http://bulma.io/versions/)
-<figure>
- <a href="/versions/">
- <img src="/images/blog/bulma-previous-versions.png" alt="Previous versions of Bulma" width="520" height="240">
- </a>
-</figure>
-
While only version [0.4.4](http://bulma.io/versions/0.4.4) is accessible now, each **new release** will remain available forever.
diff --git a/hshassets/assets/sass/lib/bulma-0.5.1/docs/_posts/2017-08-01-bulma-bootstrap-comparison.md b/hshassets/assets/sass/lib/bulma-0.5.1/docs/_posts/2017-08-01-bulma-bootstrap-comparison.md
new file mode 100644
index 0000000000000000000000000000000000000000..e8260e67a253bc6751cc7637f4218e8fc0a2fa1d
--- /dev/null
+++ b/hshassets/assets/sass/lib/bulma-0.5.1/docs/_posts/2017-08-01-bulma-bootstrap-comparison.md
@@ -0,0 +1,14 @@
+---
+layout: post
+title: "Bulma / Bootstrap comparison"
+introduction: "If you're unsure _how_ or _why_ you should try out Bulma if you're familiar to Bootstrap, the new page [\"Alternative to Bootstrap\"](http://bulma.io/alternative-to-bootstrap/) tries to help you answer questions you might have."
+color: "bootstrap"
+name: "Bulma over Bootstrap?"
+icon: "heart"
+---
+
+Bulma has always been a Bootstrap fan, inspired by its goal and purpose.
+
+Some users ask why they should use Bulma over Bootstrap, and there is **no definite answer**, because while both CSS frameworks share _similarities_, they also **differ** in many ways.
+
+The new page [\"Alternative to Bootstrap\"](http://bulma.io/alternative-to-bootstrap/) draws a **feature comparison** to help undecided users choose the right tool for their web design needs, which can be either Bulma or Bootstrap.
\ No newline at end of file
diff --git a/hshassets/assets/sass/lib/bulma-0.5.1/docs/_posts/2017-08-03-list-of-tags.md b/hshassets/assets/sass/lib/bulma-0.5.1/docs/_posts/2017-08-03-list-of-tags.md
new file mode 100644
index 0000000000000000000000000000000000000000..4806fb49678f4552b3e857f865302c0abd34a540
--- /dev/null
+++ b/hshassets/assets/sass/lib/bulma-0.5.1/docs/_posts/2017-08-03-list-of-tags.md
@@ -0,0 +1,20 @@
+---
+layout: post
+title: "New feature: list of tags"
+introduction: "What's better than one tag? Multiple tags!"
+color: "orange"
+name: "List of tags"
+icon: "tag"
+---
+
+The [tag](/documentation/elements/tag/) is a small but useful element that can be used in many contexts, to **enhance** the meaning of the text it's attached to.
+
+A tag rarely comes on its own though, so Bulma now supports [list of tags](/documentation/elements/tag/#list-of-tags). The same way you can [group controls](together), you can now **group tags together** to form a list that can span multiple lines.
+
+<figure>
+ <a href="/documentation/elements/tag/#list-of-tags">
+ <img src="/images/blog/list-of-tags.png" alt="List of tags in CSS" width="660" height="401">
+ </a>
+</figure>
+
+As a **bonus**, there is also a [delete tag](/documentation/elements/tag/#combinations) available!
\ No newline at end of file
diff --git a/hshassets/assets/sass/lib/bulma-0.5.1/docs/_sass/bootstrap.sass b/hshassets/assets/sass/lib/bulma-0.5.1/docs/_sass/bootstrap.sass
new file mode 100644
index 0000000000000000000000000000000000000000..7878c8e8db826de4a3339473ba5e352ba56780dd
--- /dev/null
+++ b/hshassets/assets/sass/lib/bulma-0.5.1/docs/_sass/bootstrap.sass
@@ -0,0 +1,97 @@
+$bootstrap: #6f5499
+$bootstrap-invert: #fff
+
+.bootstrap
+ .hero
+ background-color: $bootstrap
+ color: $bootstrap-invert
+ .title,
+ .subtitle
+ color: currentColor
+ .subtitle
+ color: rgba($bootstrap-invert, 0.5)
+ .subtitle a
+ border-bottom: 1px solid currentColor
+ color: currentColor
+ &:hover
+ color: $bootstrap-invert
+
+.pros-heading
+ padding: 0 2rem
+ text-align: center
+
+.pros-icon
+ margin-bottom: 3rem
+ text-align: center
+ svg
+ height: 3rem
+ width: auto
+
+.pros-list
+ margin: 0 auto
+ max-width: 540px
+
+.pro
+ .icon
+ position: relative
+ top: -1px
+ .title
+ margin-bottom: 0.5rem
+
+.pro + .pro
+ margin-top: 2rem
+ padding-top: 2rem
+
+.pro-content
+ p:not(:last-child)
+ margin-bottom: 0.5rem
+
+.pro.is-bulma
+ .icon
+ color: $primary
+
+.pro.is-bootstrap
+ .icon
+ color: $bootstrap
+
+.separator
+ color: $border
+ margin: 0 0.25em
+
+.comparison
+ margin: 0 auto
+ max-width: 42rem
+ .table
+ color: $red
+ thead,
+ tfoot
+ th
+ font-size: 1.5rem
+ text-align: center
+ svg
+ height: 1.5rem
+ margin-right: 1rem
+ position: relative
+ top: 0.25rem
+ width: auto
+ tbody
+ th
+ font-size: 1.25rem
+ text-align: center
+ td
+ font-family: $family-monospace
+ width: 50%
+ a
+ color: currentColor
+ &:hover
+ text-decoration: underline
+ .is-empty
+ background-color: $background
+ color: $text-light
+ .is-unique
+ background-color: rgba($green, 0.25)
+ color: $text-strong
+ font-weight: $weight-bold
+
+.comparison-header
+ margin-bottom: 3rem
\ No newline at end of file
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/docs/_sass/bsa.sass b/hshassets/assets/sass/lib/bulma-0.5.1/docs/_sass/bsa.sass
similarity index 98%
rename from hshassets/assets/sass/lib/bulma-0.5.0/docs/_sass/bsa.sass
rename to hshassets/assets/sass/lib/bulma-0.5.1/docs/_sass/bsa.sass
index c9ed0854090933df73fd358e5a8faf16d1fa40d4..c89087be52c8012d419f013ed5a36ecea47bf4a6 100644
--- a/hshassets/assets/sass/lib/bulma-0.5.0/docs/_sass/bsa.sass
+++ b/hshassets/assets/sass/lib/bulma-0.5.1/docs/_sass/bsa.sass
@@ -69,5 +69,6 @@
top: 0
& > a
margin: 0
+ width: calc(50% - 1rem)
&:not(:nth-child(2))
margin-left: 2rem
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/docs/_sass/callout.sass b/hshassets/assets/sass/lib/bulma-0.5.1/docs/_sass/callout.sass
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/docs/_sass/callout.sass
rename to hshassets/assets/sass/lib/bulma-0.5.1/docs/_sass/callout.sass
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/docs/_sass/example.sass b/hshassets/assets/sass/lib/bulma-0.5.1/docs/_sass/example.sass
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/docs/_sass/example.sass
rename to hshassets/assets/sass/lib/bulma-0.5.1/docs/_sass/example.sass
diff --git a/hshassets/assets/sass/lib/bulma-0.5.1/docs/_sass/expo.sass b/hshassets/assets/sass/lib/bulma-0.5.1/docs/_sass/expo.sass
new file mode 100644
index 0000000000000000000000000000000000000000..73a371a4fa7b3824dcdf7c61ab4229b46e40a12f
--- /dev/null
+++ b/hshassets/assets/sass/lib/bulma-0.5.1/docs/_sass/expo.sass
@@ -0,0 +1,49 @@
+.expo
+ background-color: $background
+ background-color: $white
+ padding: 1.5rem
+
+.website
+ display: block
+ position: relative
+ text-align: center
+ &:last-child
+ margin-bottom: 0
+
+.website-image
+ align-items: center
+ display: flex
+ justify-content: center
+ margin-bottom: 1.5rem
+ position: relative
+ &:hover
+ .website-overlay
+ opacity: 0.25
+
+.website-overlay
+ background-color: $black
+ opacity: 0
+ transition: opacity 200ms $easing
+
++mobile
+ .website:not(:last-child)
+ margin-bottom: 1.5rem
+
++tablet
+ .expo
+ padding-bottom: 3rem
+ padding-top: 3rem
+ .websites
+ display: flex
+ flex-wrap: wrap
+ justify-content: space-between
+ .website
+ margin-top: 3rem
+ width: calc(50% - 3rem)
+ &:nth-child(1),
+ &:nth-child(2)
+ margin-top: 0
+ &.is-highlighted
+ width: 100%
+ .website-image
+ margin-bottom: 3rem
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/docs/_sass/footer.sass b/hshassets/assets/sass/lib/bulma-0.5.1/docs/_sass/footer.sass
similarity index 90%
rename from hshassets/assets/sass/lib/bulma-0.5.0/docs/_sass/footer.sass
rename to hshassets/assets/sass/lib/bulma-0.5.1/docs/_sass/footer.sass
index 8154b8fda83a65c2754cd410befc8b948440e9ce..84d3702c2556f6d56c388d7dcc4f6320f02eca8f 100644
--- a/hshassets/assets/sass/lib/bulma-0.5.0/docs/_sass/footer.sass
+++ b/hshassets/assets/sass/lib/bulma-0.5.1/docs/_sass/footer.sass
@@ -64,3 +64,10 @@
#tsp
small
display: block
+
+#alternative
+ font-size: 0.875rem
+ a
+ color: $text-light
+ &:hover
+ text-decoration: underline
\ No newline at end of file
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/docs/_sass/global.sass b/hshassets/assets/sass/lib/bulma-0.5.1/docs/_sass/global.sass
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/docs/_sass/global.sass
rename to hshassets/assets/sass/lib/bulma-0.5.1/docs/_sass/global.sass
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/docs/_sass/header.sass b/hshassets/assets/sass/lib/bulma-0.5.1/docs/_sass/header.sass
similarity index 61%
rename from hshassets/assets/sass/lib/bulma-0.5.0/docs/_sass/header.sass
rename to hshassets/assets/sass/lib/bulma-0.5.1/docs/_sass/header.sass
index 773ae6456635eb49fdb2153f0c787da094671d9b..88c3e6657aa4c6b1d03da350f345d1737d116ca0 100644
--- a/hshassets/assets/sass/lib/bulma-0.5.0/docs/_sass/header.sass
+++ b/hshassets/assets/sass/lib/bulma-0.5.1/docs/_sass/header.sass
@@ -1,6 +1,3 @@
-$github: #333333
-$twitter: #55acee
-
#github
color: $github
border-color: $github
@@ -9,12 +6,16 @@ $twitter: #55acee
border-color: $github
color: $white
-#twitter
- color: $twitter
- border-color: $twitter
+.tw-button
+ background-color: $twitter
+ color: $white
+ border-color: transparent !important
&:hover
- background: $twitter
- border-color: $twitter
+ background-color: darken($twitter, 2.5%)
+ color: $white
+ &:active,
+ &:focus
+ background-color: darken($twitter, 5%)
color: $white
+desktop
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/docs/_sass/highlight.sass b/hshassets/assets/sass/lib/bulma-0.5.1/docs/_sass/highlight.sass
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/docs/_sass/highlight.sass
rename to hshassets/assets/sass/lib/bulma-0.5.1/docs/_sass/highlight.sass
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/docs/_sass/index.sass b/hshassets/assets/sass/lib/bulma-0.5.1/docs/_sass/index.sass
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/docs/_sass/index.sass
rename to hshassets/assets/sass/lib/bulma-0.5.1/docs/_sass/index.sass
diff --git a/hshassets/assets/sass/lib/bulma-0.5.1/docs/_sass/love.sass b/hshassets/assets/sass/lib/bulma-0.5.1/docs/_sass/love.sass
new file mode 100644
index 0000000000000000000000000000000000000000..52b398ce08c58686a3d4b12b9e21603462a69408
--- /dev/null
+++ b/hshassets/assets/sass/lib/bulma-0.5.1/docs/_sass/love.sass
@@ -0,0 +1,118 @@
+.testimonials
+ background-color: $background
+
+.testimonial
+ align-items: flex-start
+ display: flex
+ justify-content: center
+
+.more-loves
+ align-items: center
+ display: flex
+ justify-content: center
+ margin-top: 1.5rem
+ text-align: center
+ .button
+ height: auto
+ padding: 0.75em 1.5em
+ span
+ transform-origin: center center
+ transition: transform $speed $easing
+ &:hover
+ span
+ transform: scale(1.04)
+
++mobile
+ .testimonials
+ padding: 1.5rem
+ .testimonial
+ margin-bottom: 1.5rem
+
++tablet
+ .testimonials
+ padding: 3rem
+ .testimonial + .testimonial
+ margin-top: 1.5rem
+
++desktop
+ .testimonials
+ min-height: 595px
+
++widescreen
+ .testimonials
+ min-height: 653px
+
++fullhd
+ .testimonials
+ min-height: 632px
+
+.rainbow
+ animation: rainbow 8s ease infinite
+ background-image: linear-gradient(124deg, $orange, $red, $purple, $blue)
+ background-size: 800% 800%
+
+.hero.is-love
+ .title,
+ .subtitle
+ color: $white
+
+@keyframes rainbow
+ 0%
+ background-position: 0% 80%
+ 50%
+ background-position: 100% 20%
+ 100%
+ background-position: 0% 80%
+
+.hug
+ align-items: flex-start
+ display: flex
+ justify-content: center
+
+.embrace
+ background-color: $background
+ border-radius: $radius
+ padding: 1.5rem
+
++mobile
+ .love
+ padding: 1.5rem
+ .hug
+ margin: 1.5rem
+ .embrace
+ text-align: center
+ &:not(:first-child)
+ margin-top: 1.5rem
+ &:not(:last-child)
+ margin-bottom: 1.5rem
+ .embrace-button
+ margin-top: 0.75rem
+
++tablet
+ .love
+ padding-bottom: 3rem
+ padding-top: 3rem
+ .embrace
+ align-items: center
+ display: flex
+ justify-content: center
+ &:not(:first-child)
+ margin-top: 3rem
+ &:not(:last-child)
+ margin-bottom: 3rem
+ .embrace-button
+ margin-left: 1.5rem
+ .hugs
+ display: flex
+ flex-wrap: wrap
+ padding-bottom: 3rem
+ .hug
+ margin-top: 1.5rem
+ width: calc(33.3333% - 1rem)
+ &:nth-child(1),
+ &:nth-child(2),
+ &:nth-child(3)
+ margin-top: 0
+ &:nth-child(3n-1),
+ &:nth-child(3n)
+ margin-left: 1.5rem
\ No newline at end of file
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/docs/_sass/override.sass b/hshassets/assets/sass/lib/bulma-0.5.1/docs/_sass/override.sass
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/docs/_sass/override.sass
rename to hshassets/assets/sass/lib/bulma-0.5.1/docs/_sass/override.sass
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/docs/_sass/route.sass b/hshassets/assets/sass/lib/bulma-0.5.1/docs/_sass/route.sass
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/docs/_sass/route.sass
rename to hshassets/assets/sass/lib/bulma-0.5.1/docs/_sass/route.sass
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/docs/_sass/specific.sass b/hshassets/assets/sass/lib/bulma-0.5.1/docs/_sass/specific.sass
similarity index 79%
rename from hshassets/assets/sass/lib/bulma-0.5.0/docs/_sass/specific.sass
rename to hshassets/assets/sass/lib/bulma-0.5.1/docs/_sass/specific.sass
index 6e402acfc5c173f571a14f83f4cabe835e82458f..db61ca9d52aaf89ba1d64266937b3c5125c7e08d 100644
--- a/hshassets/assets/sass/lib/bulma-0.5.0/docs/_sass/specific.sass
+++ b/hshassets/assets/sass/lib/bulma-0.5.1/docs/_sass/specific.sass
@@ -37,10 +37,15 @@
.anchor-title
padding-top: 1.5rem
position: relative
+ +until($widescreen)
+ padding-left: 2rem
.anchor-link
position: absolute
right: calc(100% + 1rem)
+ +until($widescreen)
+ left: 0
+ right: auto
.article-image
background-color: $primary
@@ -48,27 +53,28 @@
height: 240px
margin-left: auto
margin-right: auto
- width: 320px
position: relative
text-align: center
@each $name, $pair in $colors
$color: nth($pair, 1)
&.is-#{$name}
background-color: $color
+ &.is-bootstrap
+ background-color: $bootstrap
+ &.is-orange
+ background-color: $orange
&:hover
.article-overlay
opacity: 0.25
.article-icon
- transform: scale(1.1)
- .article-title
+ transform: scale(1.4)
+ .article-date
transform: scale(0.9)
+ .article-title
+ transform: scale(1.1)
&.is-single
margin-bottom: 2rem
width: 100%
- +mobile
- height: 180px
- width: 240px
-
.article-overlay
+overlay
@@ -79,11 +85,15 @@
transition-timing-function: $easing
.article-icon,
-.article-title
+.article-info
+overlay
align-items: center
display: flex
justify-content: center
+
+.article-icon,
+.article-date,
+.article-title
transition-duration: $speed
transition-property: transform
transition-timing-function: $easing
@@ -91,11 +101,26 @@
.article-icon
color: $black
opacity: 0.25
+ & > span
+ display: block
.fa
font-size: 56px
+.article-info
+ padding: 20px
+
+.article-date
+ color: rgba(#000, 0.5)
+ display: block
+
.article-title
color: $white
+ display: block
font-size: 2.5rem
font-weight: $weight-bold
line-height: 1.25
+ padding: 0 20px
+
+.emoji
+ margin-right: 0.5em
+ margin-top: 2px
\ No newline at end of file
diff --git a/hshassets/assets/sass/lib/bulma-0.5.1/docs/_sass/twitter.sass b/hshassets/assets/sass/lib/bulma-0.5.1/docs/_sass/twitter.sass
new file mode 100644
index 0000000000000000000000000000000000000000..36c93ca4c13f50eb2309a33ae32de6ccad3d8c77
--- /dev/null
+++ b/hshassets/assets/sass/lib/bulma-0.5.1/docs/_sass/twitter.sass
@@ -0,0 +1,47 @@
+.tws
+ display: flex
+ flex-wrap: wrap
+ overflow: auto
+ padding: 20px
+
+.tw
+ color: #697882
+ flex-shrink: 0
+ font-family: Helvetica, Roboto, "Segoe UI", Calibri, sans-serif
+ font-size: 16px
+ // height: 270px
+ line-height: 1.4
+ padding: 10px
+ width: 520px
+ a
+ color: currentColor
+ p
+ color: #1c2022
+ font-size: 16px
+ margin-bottom: 3.2px
+ a
+ color: #2b7bb9
+
+.twitter-tweet:not(.twitter-tweet-rendered)
+ background-color: $white
+ border: 1px solid #e1e8ed
+ border-radius: 5px
+ color: #697882
+ font-size: 14px
+ padding: 20px 20px 11.6px
+ a
+ color: currentColor
+ &:hover
+ text-decoration: underline
+ p
+ color: #1c2022
+ font-size: 16px
+ margin-bottom: 3.2px
+ a
+ color: #2b7bb9
+
+.twitter-tweet-rendered
+ border: none
+ border-radius: 0
+ margin: 0 !important
+ padding: 0 !important
\ No newline at end of file
diff --git a/hshassets/assets/sass/lib/bulma-0.5.1/docs/alternative-to-bootstrap.html b/hshassets/assets/sass/lib/bulma-0.5.1/docs/alternative-to-bootstrap.html
new file mode 100644
index 0000000000000000000000000000000000000000..99e9089c99f0ba39373c91682dd78c306fdb3bf7
--- /dev/null
+++ b/hshassets/assets/sass/lib/bulma-0.5.1/docs/alternative-to-bootstrap.html
@@ -0,0 +1,206 @@
+---
+bulma:
+- type: "bulma"
+ icon: "css3"
+ title: "Modern features"
+ content: "By using the latest CSS3 features such as **Flexbox**, and planning on using **CSS Variables** and **CSS Grid**, Bulma aims to stay on the bleeding edge of browser technology."
+- type: "bulma"
+ icon: "pause"
+ title: "Simple grid system"
+ content: "To build a Bulma grid, you only need a single `.columns` container to wrap as many `.column` items as you want."
+- type: "bulma"
+ icon: "heart"
+ title: "Easy-to-learn syntax"
+ content: "With simple readable **class names** like `.button` or `.title`, and a straightforward **modifiers system** like `.is-primary` or `.is-large`, it's easy to pick up Bulma in **minutes**.<br>[More about modifiers](/documentation/modifiers/syntax/)"
+- type: "bulma"
+ icon: "fa"
+ title: "Font Awesome support"
+ content: "Bulma is compatible with [Font Awesome](http://fontawesome.io/) thanks to the `.icon` element."
+- type: "bulma"
+ icon: "plus"
+ title: "100+ useful CSS helpers"
+ content: 'Bulma ships with more than **100 helpers** to specify color, display, and spacing.<br>[Responsive helpers](/documentation/modifiers/responsive-helpers/) <span class="separator">–</span> [Typography helpers](/documentation/modifiers/typography-helpers/) <span class="separator">–</span> [Other helpers](/documentation/modifiers/helpers/)'
+- type: "bulma"
+ icon: "code"
+ title: "No JavaScript"
+ content: '<p>By focusing only on <strong>CSS</strong>, Bulma provides a lightweight solution that can easily be implemented in <strong>any development context</strong>.</p><blockquote class="twitter-tweet" data-cards="hidden" data-lang="en"><p lang="en" dir="ltr"><a href="https://t.co/vY1ZsRScYM">https://t.co/vY1ZsRScYM</a> -- a CSS framework by <a href="https://twitter.com/jgthms">@jgthms</a> -- is lovely! No JS included, which means no JS opinions included!</p>— Robert Stuttaford (@RobStuttaford) <a href="https://twitter.com/RobStuttaford/status/860885116909998080">May 6, 2017</a></blockquote>'
+bootstrap:
+- type: "bootstrap"
+ icon: "plug"
+ title: "jQuery plugins"
+ content: "Bootstrap includes useful jQuery plugins to add **interaction** to your website."
+- type: "bootstrap"
+ icon: "users"
+ title: "Big community"
+ content: "Considering how long it has been around, Bootstrap has a **larger community** than Bulma. As a result, more tools (like theming and plugins) are available, and more questions are answered around the internet."
+- type: "bootstrap"
+ icon: "internet-explorer"
+ title: "Internet Explorer compatibility"
+ content: "While 90% of Bulma works in IE11, Bootstrap has better **compatibility** with this browser."
+- type: "bootstrap"
+ icon: "list"
+ title: "Additional elements"
+ content: "Bootstrap has some **elements** like [list group](http://getbootstrap.com/components/#list-group), [wells](http://getbootstrap.com/components/#wells), or [page header](http://getbootstrap.com/components/#page-header) that Bulma doesn't have."
+---
+
+<!DOCTYPE html>
+<html lang="en">
+ <head>
+ <meta charset="utf-8">
+ <meta http-equiv="X-UA-Compatible" content="IE=edge">
+ <meta name="viewport" content="width=device-width, initial-scale=1">
+ <meta name="description" content="{% if page.excerpt %}{{ page.excerpt | strip_html | strip_newlines | truncate: 160 }}{% else %}{{ site.description }}{% endif %}">
+
+ <title>Bulma: an alternative to Bootstrap</title>
+
+ <link rel="stylesheet" href="{{ site.fontawesome }}">
+ <link rel="stylesheet" href="{{ site.url }}/css/bulma-docs.css">
+
+ <link rel="canonical" href="{{ page.url | replace:'index.html','' | prepend: site.url }}">
+ <link rel="alternate" type="application/rss+xml" title="{{ site.title }}" href="{{ "/feed.xml" | prepend: site.url }}">
+
+ <meta property="og:url" content="{{site.url}}">
+ <meta property="og:type" content="website">
+ <meta property="og:title" content="{{site.title}}">
+ <meta property="og:image" content="{{site.url}}/images/bulma-banner.png">
+ <meta property="og:image:type" content="image/png">
+ <meta property="og:image:width" content="1200">
+ <meta property="og:image:height" content="630">
+ <meta property="og:description" content="{{site.description}}">
+
+ <meta name="twitter:card" content="summary_large_image">
+ <meta name="twitter:site" content="@jgthms">
+ <meta name="twitter:creator" content="@jgthms">
+ <meta name="twitter:title" content="{{site.title}}">
+ <meta name="twitter:image" content="{{site.url}}/images/bulma-banner.png">
+ <meta name="twitter:description" content="{{site.description}}">
+
+ <link rel="apple-touch-icon" sizes="180x180" href="{{site.url}}/favicons/apple-touch-icon.png?v=201701041855">
+ <link rel="icon" type="image/png" href="{{site.url}}/favicons/favicon-32x32.png?v=201701041855" sizes="32x32">
+ <link rel="icon" type="image/png" href="{{site.url}}/favicons/favicon-16x16.png?v=201701041855" sizes="16x16">
+ <link rel="manifest" href="{{site.url}}/favicons/manifest.json?v=201701041855">
+ <link rel="mask-icon" href="{{site.url}}/favicons/safari-pinned-tab.svg?v=201701041855" color="#00d1b2">
+ <link rel="shortcut icon" href="{{site.url}}/favicons/favicon.ico?v=201701041855">
+ <meta name="msapplication-config" content="{{site.url}}/favicons/browserconfig.xml?v=201701041855">
+ <meta name="theme-color" content="#00d1b2">
+ </head>
+ <body>
+ <div class="container">
+ {% include navbar.html id="Documentation" %}
+ </div>
+
+ <main class="bootstrap">
+ <section class="hero is-medium">
+ <div class="hero-body">
+ <div class="container">
+ <div class="columns is-vcentered">
+ <div class="column">
+ <h1 class="title">
+ Bulma: an alternative to Bootstrap
+ </h1>
+ <p class="subtitle">
+ Learn how Bulma can become a replacement for <a href="http://getbootstrap.com/" target="_blank">Bootstrap</a>
+ </p>
+ </div>
+ <div class="column is-narrow">
+ {% include carbon.html %}
+ </div>
+ </div>
+ </div>
+ </div>
+ </section>
+ </main>
+
+ <div class="section notification is-radiusless">
+ <h2 class="subtitle">
+ <div class="container">
+ Both Bulma and Bootstrap are <strong>CSS frameworks</strong> that allow developers to quickly <strong>build web interfaces</strong> with ease. While they have fairly similar features, they still differ in some ways, and you might wonder why you should choose one framework over the other. This page is here to help answer that.
+ </div>
+ </h2>
+ </div>
+
+ <section class="section">
+ <div class="container">
+
+ <div class="columns is-desktop">
+ <div class="column is-half-desktop">
+ <h3 class="subtitle is-3 has-text-centered pros-heading">
+ Why choose <strong>Bulma</strong>
+ </h3>
+ <figure class="pros-icon">
+ {% include svg/bulma-b.svg %}
+ </figure>
+ <div class="pros-list">
+ {% for pro in page.bulma %}
+ {%
+ include pro.html
+ type=pro.type
+ icon=pro.icon
+ title=pro.title
+ content=pro.content
+ %}
+ {% endfor %}
+ </div>
+ </div>
+
+ <div class="column is-half-desktop">
+ <h3 class="subtitle is-3 has-text-centered pros-heading">
+ Why choose <strong>Bootstrap</strong>
+ </h3>
+ <figure class="pros-icon">
+ {% include svg/bootstrap-icon.svg %}
+ </figure>
+ <div class="pros-list">
+ {% for pro in page.bootstrap %}
+ {%
+ include pro.html
+ type=pro.type
+ icon=pro.icon
+ title=pro.title
+ content=pro.content
+ %}
+ {% endfor %}
+ </div>
+ </div>
+ </div>
+
+ </div>
+ </section>
+
+ <hr>
+
+ <section class="section">
+ <div class="container">
+ <div class="comparison">
+ <header class="comparison-header has-text-centered">
+ <h2 class="title">
+ Comparison table
+ </h2>
+ <p class="subtitle">
+ See which elements of the framework exist (or not) in the other
+ </p>
+ </header>
+ <table class="table is-bordered is-fullwidth">
+ <thead>
+ <tr>
+ <th>{% include svg/bulma-b.svg %}Bulma</th>
+ <th>{% include svg/bootstrap-icon.svg %}Bootstrap</th>
+ </tr>
+ </thead>
+ <tfoot>
+ <tr>
+ <th>{% include svg/bulma-b.svg %}Bulma</th>
+ <th>{% include svg/bootstrap-icon.svg %}Bootstrap</th>
+ </tr>
+ </tfoot>
+ <tbody>
+ {% include comparison.html %}
+ </tbody>
+ </table>
+ </div>
+ </div>
+ </section>
+
+ {% include footer.html %}
+ </body>
+</html>
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/docs/atom.xml b/hshassets/assets/sass/lib/bulma-0.5.1/docs/atom.xml
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/docs/atom.xml
rename to hshassets/assets/sass/lib/bulma-0.5.1/docs/atom.xml
diff --git a/hshassets/assets/sass/lib/bulma-0.5.1/docs/blog.html b/hshassets/assets/sass/lib/bulma-0.5.1/docs/blog.html
new file mode 100644
index 0000000000000000000000000000000000000000..581a077f14bd26eb4d2bbfa5eddb565ca1734c8d
--- /dev/null
+++ b/hshassets/assets/sass/lib/bulma-0.5.1/docs/blog.html
@@ -0,0 +1,33 @@
+---
+layout: default
+route: blog
+---
+
+{% include blog-hero.html %}
+
+ <section class="section">
+ <div class="container">
+ <div class="columns is-multiline">
+ {% for post in site.posts %}
+ <article class="column is-4">
+ <a class="article-image is-{{ post.color }}" href="{{ post.url }}">
+ <span class="article-overlay"></span>
+ <span class="article-icon">
+ <i class="fa fa-{{ post.icon }}"></i>
+ </span>
+ <strong class="article-info">
+ <span>
+ <time class="article-date" datetime="{{ post.date | date_to_xmlschema }}">
+ {{ post.date | date_to_string }}
+ </time>
+ <strong class="article-title">
+ {{ post.name }}
+ </strong>
+ </span>
+ </strong>
+ </a>
+ </article>
+ {% endfor %}
+ </div>
+ </div>
+ </section>
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/docs/bulma-docs.sass b/hshassets/assets/sass/lib/bulma-0.5.1/docs/bulma-docs.sass
similarity index 76%
rename from hshassets/assets/sass/lib/bulma-0.5.0/docs/bulma-docs.sass
rename to hshassets/assets/sass/lib/bulma-0.5.1/docs/bulma-docs.sass
index 798829ee6dcb97742078bdfb23f4f9dc6648f49c..3e454a6f0a635f0236bb50003bd18919a8777da6 100644
--- a/hshassets/assets/sass/lib/bulma-0.5.0/docs/bulma-docs.sass
+++ b/hshassets/assets/sass/lib/bulma-0.5.1/docs/bulma-docs.sass
@@ -1,5 +1,9 @@
@charset "utf-8"
+$bootstrap: #6f5499
+$github: #333333
+$twitter: #55acee
+
@import "../bulma"
@import "./_sass/highlight"
@import "./_sass/override"
@@ -12,6 +16,10 @@
@import "./_sass/callout"
@import "./_sass/bsa"
@import "./_sass/route"
+@import "./_sass/twitter"
+@import "./_sass/expo"
+@import "./_sass/love"
+@import "./_sass/bootstrap"
\:root
--primary: #{$primary}
@@ -24,7 +32,3 @@ html
\::selection
background: $primary
color: $primary-invert
-
-@debug "hsl(294, 71%, 79%)"
-@debug colorLuminance(hsl(294, 71%, 79%))
-@debug findColorInvert(hsl(294, 71%, 79%))
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/css/bulma.css b/hshassets/assets/sass/lib/bulma-0.5.1/docs/css/bulma-docs.css
similarity index 64%
rename from hshassets/assets/sass/lib/bulma-0.5.0/css/bulma.css
rename to hshassets/assets/sass/lib/bulma-0.5.1/docs/css/bulma-docs.css
index e105f46f32dd0cc3879d16309a2bd7196d840b62..c809eaed6376e5d2008731e78a012963a47a54e8 100644
--- a/hshassets/assets/sass/lib/bulma-0.5.0/css/bulma.css
+++ b/hshassets/assets/sass/lib/bulma-0.5.1/docs/css/bulma-docs.css
@@ -1,4 +1,5 @@
-/*! bulma.io v0.5.0 | MIT License | github.com/jgthms/bulma */
+@charset "UTF-8";
+/*! bulma.io v0.5.1 | MIT License | github.com/jgthms/bulma */
@-webkit-keyframes spinAround {
from {
-webkit-transform: rotate(0deg);
@@ -156,6 +157,10 @@ a {
text-decoration: none;
}
+a strong {
+ color: currentColor;
+}
+
a:hover {
color: #363636;
}
@@ -494,24 +499,238 @@ table th {
}
}
+.is-size-7 {
+ font-size: 0.75rem !important;
+}
+
+@media screen and (max-width: 768px) {
+ .is-size-7-mobile {
+ font-size: 0.75rem !important;
+ }
+}
+
+@media screen and (min-width: 769px), print {
+ .is-size-7-tablet {
+ font-size: 0.75rem !important;
+ }
+}
+
+@media screen and (max-width: 1007px) {
+ .is-size-7-touch {
+ font-size: 0.75rem !important;
+ }
+}
+
+@media screen and (min-width: 1008px) {
+ .is-size-7-desktop {
+ font-size: 0.75rem !important;
+ }
+}
+
+@media screen and (min-width: 1200px) {
+ .is-size-7-widescreen {
+ font-size: 0.75rem !important;
+ }
+}
+
+@media screen and (min-width: 1392px) {
+ .is-size-7-fullhd {
+ font-size: 0.75rem !important;
+ }
+}
+
.has-text-centered {
text-align: center !important;
}
+@media screen and (max-width: 768px) {
+ .has-text-centered-mobile {
+ text-align: center !important;
+ }
+}
+
+@media screen and (min-width: 769px), print {
+ .has-text-centered-tablet {
+ text-align: center !important;
+ }
+}
+
+@media screen and (min-width: 769px) and (max-width: 1007px) {
+ .has-text-centered-tablet-only {
+ text-align: center !important;
+ }
+}
+
+@media screen and (max-width: 1007px) {
+ .has-text-centered-touch {
+ text-align: center !important;
+ }
+}
+
+@media screen and (min-width: 1008px) {
+ .has-text-centered-desktop {
+ text-align: center !important;
+ }
+}
+
+@media screen and (min-width: 1008px) and (max-width: 1199px) {
+ .has-text-centered-desktop-only {
+ text-align: center !important;
+ }
+}
+
+@media screen and (min-width: 1200px) {
+ .has-text-centered-widescreen {
+ text-align: center !important;
+ }
+}
+
+@media screen and (min-width: 1200px) and (max-width: 1391px) {
+ .has-text-centered-widescreen-only {
+ text-align: center !important;
+ }
+}
+
+@media screen and (min-width: 1392px) {
+ .has-text-centered-fullhd {
+ text-align: center !important;
+ }
+}
+
.has-text-left {
text-align: left !important;
}
+@media screen and (max-width: 768px) {
+ .has-text-left-mobile {
+ text-align: left !important;
+ }
+}
+
+@media screen and (min-width: 769px), print {
+ .has-text-left-tablet {
+ text-align: left !important;
+ }
+}
+
+@media screen and (min-width: 769px) and (max-width: 1007px) {
+ .has-text-left-tablet-only {
+ text-align: left !important;
+ }
+}
+
+@media screen and (max-width: 1007px) {
+ .has-text-left-touch {
+ text-align: left !important;
+ }
+}
+
+@media screen and (min-width: 1008px) {
+ .has-text-left-desktop {
+ text-align: left !important;
+ }
+}
+
+@media screen and (min-width: 1008px) and (max-width: 1199px) {
+ .has-text-left-desktop-only {
+ text-align: left !important;
+ }
+}
+
+@media screen and (min-width: 1200px) {
+ .has-text-left-widescreen {
+ text-align: left !important;
+ }
+}
+
+@media screen and (min-width: 1200px) and (max-width: 1391px) {
+ .has-text-left-widescreen-only {
+ text-align: left !important;
+ }
+}
+
+@media screen and (min-width: 1392px) {
+ .has-text-left-fullhd {
+ text-align: left !important;
+ }
+}
+
.has-text-right {
text-align: right !important;
}
+@media screen and (max-width: 768px) {
+ .has-text-right-mobile {
+ text-align: right !important;
+ }
+}
+
+@media screen and (min-width: 769px), print {
+ .has-text-right-tablet {
+ text-align: right !important;
+ }
+}
+
+@media screen and (min-width: 769px) and (max-width: 1007px) {
+ .has-text-right-tablet-only {
+ text-align: right !important;
+ }
+}
+
+@media screen and (max-width: 1007px) {
+ .has-text-right-touch {
+ text-align: right !important;
+ }
+}
+
+@media screen and (min-width: 1008px) {
+ .has-text-right-desktop {
+ text-align: right !important;
+ }
+}
+
+@media screen and (min-width: 1008px) and (max-width: 1199px) {
+ .has-text-right-desktop-only {
+ text-align: right !important;
+ }
+}
+
+@media screen and (min-width: 1200px) {
+ .has-text-right-widescreen {
+ text-align: right !important;
+ }
+}
+
+@media screen and (min-width: 1200px) and (max-width: 1391px) {
+ .has-text-right-widescreen-only {
+ text-align: right !important;
+ }
+}
+
+@media screen and (min-width: 1392px) {
+ .has-text-right-fullhd {
+ text-align: right !important;
+ }
+}
+
+.is-capitalized {
+ text-transform: capitalize !important;
+}
+
+.is-lowercase {
+ text-transform: lowercase !important;
+}
+
+.is-uppercase {
+ text-transform: uppercase !important;
+}
+
.has-text-white {
color: white !important;
}
a.has-text-white:hover, a.has-text-white:focus {
- color: #e6e6e6;
+ color: #e6e6e6 !important;
}
.has-text-black {
@@ -519,7 +738,7 @@ a.has-text-white:hover, a.has-text-white:focus {
}
a.has-text-black:hover, a.has-text-black:focus {
- color: black;
+ color: black !important;
}
.has-text-light {
@@ -527,7 +746,7 @@ a.has-text-black:hover, a.has-text-black:focus {
}
a.has-text-light:hover, a.has-text-light:focus {
- color: #dbdbdb;
+ color: #dbdbdb !important;
}
.has-text-dark {
@@ -535,7 +754,7 @@ a.has-text-light:hover, a.has-text-light:focus {
}
a.has-text-dark:hover, a.has-text-dark:focus {
- color: #1c1c1c;
+ color: #1c1c1c !important;
}
.has-text-primary {
@@ -543,7 +762,7 @@ a.has-text-dark:hover, a.has-text-dark:focus {
}
a.has-text-primary:hover, a.has-text-primary:focus {
- color: #009e86;
+ color: #009e86 !important;
}
.has-text-info {
@@ -551,7 +770,7 @@ a.has-text-primary:hover, a.has-text-primary:focus {
}
a.has-text-info:hover, a.has-text-info:focus {
- color: #205bbc;
+ color: #205bbc !important;
}
.has-text-success {
@@ -559,7 +778,7 @@ a.has-text-info:hover, a.has-text-info:focus {
}
a.has-text-success:hover, a.has-text-success:focus {
- color: #1ca64c;
+ color: #1ca64c !important;
}
.has-text-warning {
@@ -567,7 +786,7 @@ a.has-text-success:hover, a.has-text-success:focus {
}
a.has-text-warning:hover, a.has-text-warning:focus {
- color: #ffd324;
+ color: #ffd324 !important;
}
.has-text-danger {
@@ -575,7 +794,7 @@ a.has-text-warning:hover, a.has-text-warning:focus {
}
a.has-text-danger:hover, a.has-text-danger:focus {
- color: #ff0537;
+ color: #ff0537 !important;
}
.has-text-black-bis {
@@ -615,7 +834,7 @@ a.has-text-danger:hover, a.has-text-danger:focus {
}
.is-block {
- display: block;
+ display: block !important;
}
@media screen and (max-width: 768px) {
@@ -673,9 +892,9 @@ a.has-text-danger:hover, a.has-text-danger:focus {
}
.is-flex {
- display: -webkit-box;
- display: -ms-flexbox;
- display: flex;
+ display: -webkit-box !important;
+ display: -ms-flexbox !important;
+ display: flex !important;
}
@media screen and (max-width: 768px) {
@@ -751,7 +970,7 @@ a.has-text-danger:hover, a.has-text-danger:focus {
}
.is-inline {
- display: inline;
+ display: inline !important;
}
@media screen and (max-width: 768px) {
@@ -809,7 +1028,7 @@ a.has-text-danger:hover, a.has-text-danger:focus {
}
.is-inline-block {
- display: inline-block;
+ display: inline-block !important;
}
@media screen and (max-width: 768px) {
@@ -867,9 +1086,9 @@ a.has-text-danger:hover, a.has-text-danger:focus {
}
.is-inline-flex {
- display: -webkit-inline-box;
- display: -ms-inline-flexbox;
- display: inline-flex;
+ display: -webkit-inline-box !important;
+ display: -ms-inline-flexbox !important;
+ display: inline-flex !important;
}
@media screen and (max-width: 768px) {
@@ -1133,8 +1352,6 @@ a.box:active {
.button:focus, .button.is-focused {
border-color: #00d1b2;
- -webkit-box-shadow: 0 0 0.5em rgba(0, 209, 178, 0.25);
- box-shadow: 0 0 0.5em rgba(0, 209, 178, 0.25);
color: #363636;
}
@@ -2106,6 +2323,52 @@ a.box:active {
pointer-events: none;
}
+.container {
+ margin: 0 auto;
+ position: relative;
+}
+
+@media screen and (min-width: 1068px) {
+ .container {
+ max-width: 960px;
+ width: 960px;
+ }
+ .container.is-fluid {
+ margin-left: 24px;
+ margin-right: 24px;
+ max-width: none;
+ width: auto;
+ }
+}
+
+@media screen and (max-width: 1259px) {
+ .container.is-widescreen {
+ max-width: 1152px;
+ width: auto;
+ }
+}
+
+@media screen and (max-width: 1451px) {
+ .container.is-fullhd {
+ max-width: 1344px;
+ width: auto;
+ }
+}
+
+@media screen and (min-width: 1260px) {
+ .container {
+ max-width: 1152px;
+ width: 1152px;
+ }
+}
+
+@media screen and (min-width: 1452px) {
+ .container {
+ max-width: 1344px;
+ width: 1344px;
+ }
+}
+
.content:not(:last-child) {
margin-bottom: 1.5rem;
}
@@ -2209,6 +2472,7 @@ a.box:active {
}
.content figure {
+ margin: 2em;
text-align: center;
}
@@ -2727,2644 +2991,2843 @@ a.box:active {
font-size: 1.5rem;
}
-.label {
- color: #363636;
- display: block;
- font-size: 1rem;
- font-weight: 700;
+.file {
+ -webkit-touch-callout: none;
+ -webkit-user-select: none;
+ -moz-user-select: none;
+ -ms-user-select: none;
+ user-select: none;
+ -webkit-box-align: stretch;
+ -ms-flex-align: stretch;
+ align-items: stretch;
+ display: -webkit-box;
+ display: -ms-flexbox;
+ display: flex;
+ -webkit-box-pack: start;
+ -ms-flex-pack: start;
+ justify-content: flex-start;
+ position: relative;
}
-.label:not(:last-child) {
- margin-bottom: 0.5em;
+.file.is-white .file-cta {
+ background-color: white;
+ border-color: transparent;
+ color: #0a0a0a;
}
-.label.is-small {
- font-size: 0.75rem;
+.file.is-white:hover .file-cta, .file.is-white.is-hovered .file-cta {
+ background-color: #f9f9f9;
+ border-color: transparent;
+ color: #0a0a0a;
}
-.label.is-medium {
- font-size: 1.25rem;
+.file.is-white:focus .file-cta, .file.is-white.is-focused .file-cta {
+ border-color: transparent;
+ -webkit-box-shadow: 0 0 0.5em rgba(255, 255, 255, 0.25);
+ box-shadow: 0 0 0.5em rgba(255, 255, 255, 0.25);
+ color: #0a0a0a;
}
-.label.is-large {
- font-size: 1.5rem;
+.file.is-white:active .file-cta, .file.is-white.is-active .file-cta {
+ background-color: #f2f2f2;
+ border-color: transparent;
+ color: #0a0a0a;
}
-.help {
- display: block;
- font-size: 0.75rem;
- margin-top: 0.25rem;
+.file.is-black .file-cta {
+ background-color: #0a0a0a;
+ border-color: transparent;
+ color: white;
}
-.help.is-white {
+.file.is-black:hover .file-cta, .file.is-black.is-hovered .file-cta {
+ background-color: #040404;
+ border-color: transparent;
color: white;
}
-.help.is-black {
- color: #0a0a0a;
+.file.is-black:focus .file-cta, .file.is-black.is-focused .file-cta {
+ border-color: transparent;
+ -webkit-box-shadow: 0 0 0.5em rgba(10, 10, 10, 0.25);
+ box-shadow: 0 0 0.5em rgba(10, 10, 10, 0.25);
+ color: white;
}
-.help.is-light {
- color: whitesmoke;
+.file.is-black:active .file-cta, .file.is-black.is-active .file-cta {
+ background-color: black;
+ border-color: transparent;
+ color: white;
}
-.help.is-dark {
+.file.is-light .file-cta {
+ background-color: whitesmoke;
+ border-color: transparent;
color: #363636;
}
-.help.is-primary {
- color: #00d1b2;
+.file.is-light:hover .file-cta, .file.is-light.is-hovered .file-cta {
+ background-color: #eeeeee;
+ border-color: transparent;
+ color: #363636;
}
-.help.is-info {
- color: #3273dc;
+.file.is-light:focus .file-cta, .file.is-light.is-focused .file-cta {
+ border-color: transparent;
+ -webkit-box-shadow: 0 0 0.5em rgba(245, 245, 245, 0.25);
+ box-shadow: 0 0 0.5em rgba(245, 245, 245, 0.25);
+ color: #363636;
}
-.help.is-success {
- color: #23d160;
+.file.is-light:active .file-cta, .file.is-light.is-active .file-cta {
+ background-color: #e8e8e8;
+ border-color: transparent;
+ color: #363636;
}
-.help.is-warning {
- color: #ffdd57;
+.file.is-dark .file-cta {
+ background-color: #363636;
+ border-color: transparent;
+ color: whitesmoke;
}
-.help.is-danger {
- color: #ff3860;
+.file.is-dark:hover .file-cta, .file.is-dark.is-hovered .file-cta {
+ background-color: #2f2f2f;
+ border-color: transparent;
+ color: whitesmoke;
}
-.field:not(:last-child) {
- margin-bottom: 0.75rem;
+.file.is-dark:focus .file-cta, .file.is-dark.is-focused .file-cta {
+ border-color: transparent;
+ -webkit-box-shadow: 0 0 0.5em rgba(54, 54, 54, 0.25);
+ box-shadow: 0 0 0.5em rgba(54, 54, 54, 0.25);
+ color: whitesmoke;
}
-.field.has-addons {
- display: -webkit-box;
- display: -ms-flexbox;
- display: flex;
- -webkit-box-pack: start;
- -ms-flex-pack: start;
- justify-content: flex-start;
+.file.is-dark:active .file-cta, .file.is-dark.is-active .file-cta {
+ background-color: #292929;
+ border-color: transparent;
+ color: whitesmoke;
}
-.field.has-addons .control:not(:last-child) {
- margin-right: -1px;
+.file.is-primary .file-cta {
+ background-color: #00d1b2;
+ border-color: transparent;
+ color: #fff;
}
-.field.has-addons .control:first-child .button,
-.field.has-addons .control:first-child .input,
-.field.has-addons .control:first-child .select select {
- border-bottom-left-radius: 3px;
- border-top-left-radius: 3px;
+.file.is-primary:hover .file-cta, .file.is-primary.is-hovered .file-cta {
+ background-color: #00c4a7;
+ border-color: transparent;
+ color: #fff;
}
-.field.has-addons .control:last-child .button,
-.field.has-addons .control:last-child .input,
-.field.has-addons .control:last-child .select select {
- border-bottom-right-radius: 3px;
- border-top-right-radius: 3px;
+.file.is-primary:focus .file-cta, .file.is-primary.is-focused .file-cta {
+ border-color: transparent;
+ -webkit-box-shadow: 0 0 0.5em rgba(0, 209, 178, 0.25);
+ box-shadow: 0 0 0.5em rgba(0, 209, 178, 0.25);
+ color: #fff;
}
-.field.has-addons .control .button,
-.field.has-addons .control .input,
-.field.has-addons .control .select select {
- border-radius: 0;
+.file.is-primary:active .file-cta, .file.is-primary.is-active .file-cta {
+ background-color: #00b89c;
+ border-color: transparent;
+ color: #fff;
}
-.field.has-addons .control .button:hover, .field.has-addons .control .button.is-hovered,
-.field.has-addons .control .input:hover,
-.field.has-addons .control .input.is-hovered,
-.field.has-addons .control .select select:hover,
-.field.has-addons .control .select select.is-hovered {
- z-index: 2;
+.file.is-info .file-cta {
+ background-color: #3273dc;
+ border-color: transparent;
+ color: #fff;
}
-.field.has-addons .control .button:focus, .field.has-addons .control .button.is-focused, .field.has-addons .control .button:active, .field.has-addons .control .button.is-active,
-.field.has-addons .control .input:focus,
-.field.has-addons .control .input.is-focused,
-.field.has-addons .control .input:active,
-.field.has-addons .control .input.is-active,
-.field.has-addons .control .select select:focus,
-.field.has-addons .control .select select.is-focused,
-.field.has-addons .control .select select:active,
-.field.has-addons .control .select select.is-active {
- z-index: 3;
+.file.is-info:hover .file-cta, .file.is-info.is-hovered .file-cta {
+ background-color: #276cda;
+ border-color: transparent;
+ color: #fff;
}
-.field.has-addons .control .button:focus:hover, .field.has-addons .control .button.is-focused:hover, .field.has-addons .control .button:active:hover, .field.has-addons .control .button.is-active:hover,
-.field.has-addons .control .input:focus:hover,
-.field.has-addons .control .input.is-focused:hover,
-.field.has-addons .control .input:active:hover,
-.field.has-addons .control .input.is-active:hover,
-.field.has-addons .control .select select:focus:hover,
-.field.has-addons .control .select select.is-focused:hover,
-.field.has-addons .control .select select:active:hover,
-.field.has-addons .control .select select.is-active:hover {
- z-index: 4;
+.file.is-info:focus .file-cta, .file.is-info.is-focused .file-cta {
+ border-color: transparent;
+ -webkit-box-shadow: 0 0 0.5em rgba(50, 115, 220, 0.25);
+ box-shadow: 0 0 0.5em rgba(50, 115, 220, 0.25);
+ color: #fff;
}
-.field.has-addons .control.is-expanded {
- -webkit-box-flex: 1;
- -ms-flex-positive: 1;
- flex-grow: 1;
+.file.is-info:active .file-cta, .file.is-info.is-active .file-cta {
+ background-color: #2366d1;
+ border-color: transparent;
+ color: #fff;
}
-.field.has-addons.has-addons-centered {
- -webkit-box-pack: center;
- -ms-flex-pack: center;
- justify-content: center;
+.file.is-success .file-cta {
+ background-color: #23d160;
+ border-color: transparent;
+ color: #fff;
}
-.field.has-addons.has-addons-right {
- -webkit-box-pack: end;
- -ms-flex-pack: end;
- justify-content: flex-end;
+.file.is-success:hover .file-cta, .file.is-success.is-hovered .file-cta {
+ background-color: #22c65b;
+ border-color: transparent;
+ color: #fff;
}
-.field.has-addons.has-addons-fullwidth .control {
- -webkit-box-flex: 1;
- -ms-flex-positive: 1;
- flex-grow: 1;
- -ms-flex-negative: 0;
- flex-shrink: 0;
+.file.is-success:focus .file-cta, .file.is-success.is-focused .file-cta {
+ border-color: transparent;
+ -webkit-box-shadow: 0 0 0.5em rgba(35, 209, 96, 0.25);
+ box-shadow: 0 0 0.5em rgba(35, 209, 96, 0.25);
+ color: #fff;
}
-.field.is-grouped {
- display: -webkit-box;
- display: -ms-flexbox;
- display: flex;
- -webkit-box-pack: start;
- -ms-flex-pack: start;
- justify-content: flex-start;
+.file.is-success:active .file-cta, .file.is-success.is-active .file-cta {
+ background-color: #20bc56;
+ border-color: transparent;
+ color: #fff;
}
-.field.is-grouped > .control {
- -ms-flex-negative: 0;
- flex-shrink: 0;
+.file.is-warning .file-cta {
+ background-color: #ffdd57;
+ border-color: transparent;
+ color: rgba(0, 0, 0, 0.7);
}
-.field.is-grouped > .control:not(:last-child) {
- margin-bottom: 0;
- margin-right: 0.75rem;
+.file.is-warning:hover .file-cta, .file.is-warning.is-hovered .file-cta {
+ background-color: #ffdb4a;
+ border-color: transparent;
+ color: rgba(0, 0, 0, 0.7);
}
-.field.is-grouped > .control.is-expanded {
- -webkit-box-flex: 1;
- -ms-flex-positive: 1;
- flex-grow: 1;
- -ms-flex-negative: 1;
- flex-shrink: 1;
+.file.is-warning:focus .file-cta, .file.is-warning.is-focused .file-cta {
+ border-color: transparent;
+ -webkit-box-shadow: 0 0 0.5em rgba(255, 221, 87, 0.25);
+ box-shadow: 0 0 0.5em rgba(255, 221, 87, 0.25);
+ color: rgba(0, 0, 0, 0.7);
}
-.field.is-grouped.is-grouped-centered {
- -webkit-box-pack: center;
- -ms-flex-pack: center;
- justify-content: center;
+.file.is-warning:active .file-cta, .file.is-warning.is-active .file-cta {
+ background-color: #ffd83d;
+ border-color: transparent;
+ color: rgba(0, 0, 0, 0.7);
}
-.field.is-grouped.is-grouped-right {
- -webkit-box-pack: end;
- -ms-flex-pack: end;
- justify-content: flex-end;
+.file.is-danger .file-cta {
+ background-color: #ff3860;
+ border-color: transparent;
+ color: #fff;
}
-.field.is-grouped.is-grouped-multiline {
- -ms-flex-wrap: wrap;
- flex-wrap: wrap;
+.file.is-danger:hover .file-cta, .file.is-danger.is-hovered .file-cta {
+ background-color: #ff2b56;
+ border-color: transparent;
+ color: #fff;
}
-.field.is-grouped.is-grouped-multiline > .control:last-child, .field.is-grouped.is-grouped-multiline > .control:not(:last-child) {
- margin-bottom: 0.75rem;
+.file.is-danger:focus .file-cta, .file.is-danger.is-focused .file-cta {
+ border-color: transparent;
+ -webkit-box-shadow: 0 0 0.5em rgba(255, 56, 96, 0.25);
+ box-shadow: 0 0 0.5em rgba(255, 56, 96, 0.25);
+ color: #fff;
}
-.field.is-grouped.is-grouped-multiline:last-child {
- margin-bottom: -0.75rem;
+.file.is-danger:active .file-cta, .file.is-danger.is-active .file-cta {
+ background-color: #ff1f4b;
+ border-color: transparent;
+ color: #fff;
}
-.field.is-grouped.is-grouped-multiline:not(:last-child) {
- margin-bottom: 0;
+.file.is-small {
+ font-size: 0.75rem;
}
-@media screen and (min-width: 769px), print {
- .field.is-horizontal {
- display: -webkit-box;
- display: -ms-flexbox;
- display: flex;
- }
+.file.is-medium {
+ font-size: 1.25rem;
}
-.field-label .label {
- font-size: inherit;
+.file.is-medium .file-icon .fa {
+ font-size: 21px;
}
-@media screen and (max-width: 768px) {
- .field-label {
- margin-bottom: 0.5rem;
- }
+.file.is-large {
+ font-size: 1.5rem;
}
-@media screen and (min-width: 769px), print {
- .field-label {
- -ms-flex-preferred-size: 0;
- flex-basis: 0;
- -webkit-box-flex: 1;
- -ms-flex-positive: 1;
- flex-grow: 1;
- -ms-flex-negative: 0;
- flex-shrink: 0;
- margin-right: 1.5rem;
- text-align: right;
- }
- .field-label.is-small {
- font-size: 0.75rem;
- padding-top: 0.375em;
- }
- .field-label.is-normal {
- padding-top: 0.375em;
- }
- .field-label.is-medium {
- font-size: 1.25rem;
- padding-top: 0.375em;
- }
- .field-label.is-large {
- font-size: 1.5rem;
- padding-top: 0.375em;
- }
+.file.is-large .file-icon .fa {
+ font-size: 28px;
}
-.field-body .field .field {
- margin-bottom: 0;
-}
-
-@media screen and (min-width: 769px), print {
- .field-body {
- display: -webkit-box;
- display: -ms-flexbox;
- display: flex;
- -ms-flex-preferred-size: 0;
- flex-basis: 0;
- -webkit-box-flex: 5;
- -ms-flex-positive: 5;
- flex-grow: 5;
- -ms-flex-negative: 1;
- flex-shrink: 1;
- }
- .field-body .field {
- margin-bottom: 0;
- }
- .field-body > .field {
- -ms-flex-negative: 1;
- flex-shrink: 1;
- }
- .field-body > .field:not(.is-narrow) {
- -webkit-box-flex: 1;
- -ms-flex-positive: 1;
- flex-grow: 1;
- }
- .field-body > .field:not(:last-child) {
- margin-right: 0.75rem;
- }
+.file.has-name .file-cta {
+ border-bottom-right-radius: 0;
+ border-top-right-radius: 0;
}
-.control {
- font-size: 1rem;
- position: relative;
- text-align: left;
+.file.has-name .file-name {
+ border-bottom-left-radius: 0;
+ border-top-left-radius: 0;
}
-.control.has-icon .icon {
- color: #dbdbdb;
- height: 2.25em;
- pointer-events: none;
- position: absolute;
- top: 0;
- width: 2.25em;
- z-index: 4;
+.file.is-centered {
+ -webkit-box-pack: center;
+ -ms-flex-pack: center;
+ justify-content: center;
}
-.control.has-icon .input:focus + .icon {
- color: #7a7a7a;
+.file.is-right {
+ -webkit-box-pack: end;
+ -ms-flex-pack: end;
+ justify-content: flex-end;
}
-.control.has-icon .input.is-small + .icon {
- font-size: 0.75rem;
+.file.is-boxed .file-label {
+ -webkit-box-orient: vertical;
+ -webkit-box-direction: normal;
+ -ms-flex-direction: column;
+ flex-direction: column;
}
-.control.has-icon .input.is-medium + .icon {
- font-size: 1.25rem;
+.file.is-boxed .file-cta {
+ -webkit-box-orient: vertical;
+ -webkit-box-direction: normal;
+ -ms-flex-direction: column;
+ flex-direction: column;
+ height: auto;
+ padding: 1em 3em;
}
-.control.has-icon .input.is-large + .icon {
- font-size: 1.5rem;
+.file.is-boxed .file-name {
+ border-width: 0 1px 1px;
}
-.control.has-icon:not(.has-icon-right) .icon {
- left: 0;
+.file.is-boxed .file-icon {
+ height: 1.5em;
+ width: 1.5em;
}
-.control.has-icon:not(.has-icon-right) .input {
- padding-left: 2.25em;
+.file.is-boxed .file-icon .fa {
+ font-size: 21px;
}
-.control.has-icon.has-icon-right .icon {
- right: 0;
+.file.is-boxed.is-small .file-icon .fa {
+ font-size: 14px;
}
-.control.has-icon.has-icon-right .input {
- padding-right: 2.25em;
+.file.is-boxed.is-medium .file-icon .fa {
+ font-size: 28px;
}
-.control.has-icons-left .input:focus ~ .icon,
-.control.has-icons-left .select:focus ~ .icon, .control.has-icons-right .input:focus ~ .icon,
-.control.has-icons-right .select:focus ~ .icon {
- color: #7a7a7a;
+.file.is-boxed.is-large .file-icon .fa {
+ font-size: 35px;
}
-.control.has-icons-left .input.is-small ~ .icon,
-.control.has-icons-left .select.is-small ~ .icon, .control.has-icons-right .input.is-small ~ .icon,
-.control.has-icons-right .select.is-small ~ .icon {
- font-size: 0.75rem;
+.file.is-boxed.has-name .file-cta {
+ border-radius: 3px 3px 0 0;
}
-.control.has-icons-left .input.is-medium ~ .icon,
-.control.has-icons-left .select.is-medium ~ .icon, .control.has-icons-right .input.is-medium ~ .icon,
-.control.has-icons-right .select.is-medium ~ .icon {
- font-size: 1.25rem;
+.file.is-boxed.has-name .file-name {
+ border-radius: 0 0 3px 3px;
+ border-width: 0 1px 1px;
}
-.control.has-icons-left .input.is-large ~ .icon,
-.control.has-icons-left .select.is-large ~ .icon, .control.has-icons-right .input.is-large ~ .icon,
-.control.has-icons-right .select.is-large ~ .icon {
- font-size: 1.5rem;
+.file.is-right .file-cta {
+ border-radius: 0 3px 3px 0;
}
-.control.has-icons-left .icon, .control.has-icons-right .icon {
- color: #dbdbdb;
- height: 2.25em;
- pointer-events: none;
- position: absolute;
- top: 0;
- width: 2.25em;
- z-index: 4;
+.file.is-right .file-name {
+ border-radius: 3px 0 0 3px;
+ border-width: 1px 0 1px 1px;
+ -webkit-box-ordinal-group: 0;
+ -ms-flex-order: -1;
+ order: -1;
}
-.control.has-icons-left .input,
-.control.has-icons-left .select select {
- padding-left: 2.25em;
+.file.is-fullwidth .file-label {
+ width: 100%;
}
-.control.has-icons-left .icon.is-left {
- left: 0;
+.file.is-fullwidth .file-name {
+ -webkit-box-flex: 1;
+ -ms-flex-positive: 1;
+ flex-grow: 1;
+ max-width: none;
}
-.control.has-icons-right .input,
-.control.has-icons-right .select select {
- padding-right: 2.25em;
+.file-label {
+ -webkit-box-align: stretch;
+ -ms-flex-align: stretch;
+ align-items: stretch;
+ display: -webkit-box;
+ display: -ms-flexbox;
+ display: flex;
+ cursor: pointer;
+ -webkit-box-pack: start;
+ -ms-flex-pack: start;
+ justify-content: flex-start;
+ overflow: hidden;
+ position: relative;
}
-.control.has-icons-right .icon.is-right {
- right: 0;
+.file-label:hover .file-cta {
+ background-color: #eeeeee;
+ color: #363636;
}
-.control.is-loading::after {
- -webkit-animation: spinAround 500ms infinite linear;
- animation: spinAround 500ms infinite linear;
- border: 2px solid #dbdbdb;
- border-radius: 290486px;
- border-right-color: transparent;
- border-top-color: transparent;
- content: "";
- display: block;
- height: 1em;
- position: relative;
- width: 1em;
- position: absolute !important;
- right: 0.625em;
- top: 0.625em;
+.file-label:hover .file-name {
+ border-color: #d5d5d5;
}
-.control.is-loading.is-small:after {
- font-size: 0.75rem;
+.file-label:active .file-cta {
+ background-color: #e8e8e8;
+ color: #363636;
}
-.control.is-loading.is-medium:after {
- font-size: 1.25rem;
+.file-label:active .file-name {
+ border-color: #cfcfcf;
}
-.control.is-loading.is-large:after {
- font-size: 1.5rem;
+.file-input {
+ height: 0.01em;
+ left: 0;
+ outline: none;
+ position: absolute;
+ top: 0;
+ width: 0.01em;
}
-.icon {
+.file-cta,
+.file-name {
+ -moz-appearance: none;
+ -webkit-appearance: none;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
+ border: 1px solid transparent;
+ border-radius: 3px;
+ -webkit-box-shadow: none;
+ box-shadow: none;
display: -webkit-inline-box;
display: -ms-inline-flexbox;
display: inline-flex;
- -webkit-box-pack: center;
- -ms-flex-pack: center;
- justify-content: center;
- height: 1.5rem;
- width: 1.5rem;
+ font-size: 1rem;
+ height: 2.25em;
+ -webkit-box-pack: start;
+ -ms-flex-pack: start;
+ justify-content: flex-start;
+ line-height: 1.5;
+ padding-bottom: calc(0.375em - 1px);
+ padding-left: calc(0.625em - 1px);
+ padding-right: calc(0.625em - 1px);
+ padding-top: calc(0.375em - 1px);
+ position: relative;
+ vertical-align: top;
+ border-color: #dbdbdb;
+ border-radius: 3px;
+ font-size: 1em;
+ padding-left: 1em;
+ padding-right: 1em;
+ white-space: nowrap;
}
-.icon .fa {
- font-size: 21px;
+.file-cta:focus, .file-cta.is-focused, .file-cta:active, .file-cta.is-active,
+.file-name:focus,
+.file-name.is-focused,
+.file-name:active,
+.file-name.is-active {
+ outline: none;
}
-.icon.is-small {
- height: 1rem;
- width: 1rem;
+.file-cta[disabled],
+.file-name[disabled] {
+ cursor: not-allowed;
}
-.icon.is-small .fa {
- font-size: 14px;
+.file-cta {
+ background-color: whitesmoke;
+ color: #4a4a4a;
}
-.icon.is-medium {
- height: 2rem;
- width: 2rem;
+.file-name {
+ border-color: #dbdbdb;
+ border-style: solid;
+ border-width: 1px 1px 1px 0;
+ display: block;
+ max-width: 16em;
+ overflow: hidden;
+ text-align: left;
+ text-overflow: ellipsis;
}
-.icon.is-medium .fa {
- font-size: 28px;
+.file-icon {
+ -webkit-box-align: center;
+ -ms-flex-align: center;
+ align-items: center;
+ display: -webkit-box;
+ display: -ms-flexbox;
+ display: flex;
+ height: 1em;
+ -webkit-box-pack: center;
+ -ms-flex-pack: center;
+ justify-content: center;
+ margin-right: 0.5em;
+ width: 1em;
}
-.icon.is-large {
- height: 3rem;
- width: 3rem;
+.file-icon .fa {
+ font-size: 14px;
}
-.icon.is-large .fa {
- font-size: 42px;
+.label {
+ color: #363636;
+ display: block;
+ font-size: 1rem;
+ font-weight: 700;
}
-.image {
- display: block;
- position: relative;
+.label:not(:last-child) {
+ margin-bottom: 0.5em;
}
-.image img {
- display: block;
- height: auto;
- width: 100%;
+.label.is-small {
+ font-size: 0.75rem;
}
-.image.is-square img, .image.is-1by1 img, .image.is-4by3 img, .image.is-3by2 img, .image.is-16by9 img, .image.is-2by1 img {
- bottom: 0;
- left: 0;
- position: absolute;
- right: 0;
- top: 0;
- height: 100%;
- width: 100%;
+.label.is-medium {
+ font-size: 1.25rem;
}
-.image.is-square, .image.is-1by1 {
- padding-top: 100%;
-}
-
-.image.is-4by3 {
- padding-top: 75%;
-}
-
-.image.is-3by2 {
- padding-top: 66.6666%;
+.label.is-large {
+ font-size: 1.5rem;
}
-.image.is-16by9 {
- padding-top: 56.25%;
+.help {
+ display: block;
+ font-size: 0.75rem;
+ margin-top: 0.25rem;
}
-.image.is-2by1 {
- padding-top: 50%;
+.help.is-white {
+ color: white;
}
-.image.is-16x16 {
- height: 16px;
- width: 16px;
+.help.is-black {
+ color: #0a0a0a;
}
-.image.is-24x24 {
- height: 24px;
- width: 24px;
+.help.is-light {
+ color: whitesmoke;
}
-.image.is-32x32 {
- height: 32px;
- width: 32px;
+.help.is-dark {
+ color: #363636;
}
-.image.is-48x48 {
- height: 48px;
- width: 48px;
+.help.is-primary {
+ color: #00d1b2;
}
-.image.is-64x64 {
- height: 64px;
- width: 64px;
+.help.is-info {
+ color: #3273dc;
}
-.image.is-96x96 {
- height: 96px;
- width: 96px;
+.help.is-success {
+ color: #23d160;
}
-.image.is-128x128 {
- height: 128px;
- width: 128px;
+.help.is-warning {
+ color: #ffdd57;
}
-.notification {
- background-color: whitesmoke;
- border-radius: 3px;
- padding: 1.25rem 2.5rem 1.25rem 1.5rem;
- position: relative;
+.help.is-danger {
+ color: #ff3860;
}
-.notification:not(:last-child) {
- margin-bottom: 1.5rem;
+.field:not(:last-child) {
+ margin-bottom: 0.75rem;
}
-.notification a:not(.button) {
- color: currentColor;
- text-decoration: underline;
+.field.has-addons {
+ display: -webkit-box;
+ display: -ms-flexbox;
+ display: flex;
+ -webkit-box-pack: start;
+ -ms-flex-pack: start;
+ justify-content: flex-start;
}
-.notification strong {
- color: currentColor;
+.field.has-addons .control:not(:last-child) {
+ margin-right: -1px;
}
-.notification code,
-.notification pre {
- background: white;
+.field.has-addons .control:first-child .button,
+.field.has-addons .control:first-child .input,
+.field.has-addons .control:first-child .select select {
+ border-bottom-left-radius: 3px;
+ border-top-left-radius: 3px;
}
-.notification pre code {
- background: transparent;
+.field.has-addons .control:last-child .button,
+.field.has-addons .control:last-child .input,
+.field.has-addons .control:last-child .select select {
+ border-bottom-right-radius: 3px;
+ border-top-right-radius: 3px;
}
-.notification > .delete {
- position: absolute;
- right: 0.5em;
- top: 0.5em;
+.field.has-addons .control .button,
+.field.has-addons .control .input,
+.field.has-addons .control .select select {
+ border-radius: 0;
}
-.notification .title,
-.notification .subtitle,
-.notification .content {
- color: currentColor;
+.field.has-addons .control .button:hover, .field.has-addons .control .button.is-hovered,
+.field.has-addons .control .input:hover,
+.field.has-addons .control .input.is-hovered,
+.field.has-addons .control .select select:hover,
+.field.has-addons .control .select select.is-hovered {
+ z-index: 2;
}
-.notification.is-white {
- background-color: white;
- color: #0a0a0a;
+.field.has-addons .control .button:focus, .field.has-addons .control .button.is-focused, .field.has-addons .control .button:active, .field.has-addons .control .button.is-active,
+.field.has-addons .control .input:focus,
+.field.has-addons .control .input.is-focused,
+.field.has-addons .control .input:active,
+.field.has-addons .control .input.is-active,
+.field.has-addons .control .select select:focus,
+.field.has-addons .control .select select.is-focused,
+.field.has-addons .control .select select:active,
+.field.has-addons .control .select select.is-active {
+ z-index: 3;
}
-.notification.is-black {
- background-color: #0a0a0a;
- color: white;
+.field.has-addons .control .button:focus:hover, .field.has-addons .control .button.is-focused:hover, .field.has-addons .control .button:active:hover, .field.has-addons .control .button.is-active:hover,
+.field.has-addons .control .input:focus:hover,
+.field.has-addons .control .input.is-focused:hover,
+.field.has-addons .control .input:active:hover,
+.field.has-addons .control .input.is-active:hover,
+.field.has-addons .control .select select:focus:hover,
+.field.has-addons .control .select select.is-focused:hover,
+.field.has-addons .control .select select:active:hover,
+.field.has-addons .control .select select.is-active:hover {
+ z-index: 4;
}
-.notification.is-light {
- background-color: whitesmoke;
- color: #363636;
+.field.has-addons .control.is-expanded {
+ -webkit-box-flex: 1;
+ -ms-flex-positive: 1;
+ flex-grow: 1;
}
-.notification.is-dark {
- background-color: #363636;
- color: whitesmoke;
+.field.has-addons.has-addons-centered {
+ -webkit-box-pack: center;
+ -ms-flex-pack: center;
+ justify-content: center;
}
-.notification.is-primary {
- background-color: #00d1b2;
- color: #fff;
+.field.has-addons.has-addons-right {
+ -webkit-box-pack: end;
+ -ms-flex-pack: end;
+ justify-content: flex-end;
}
-.notification.is-info {
- background-color: #3273dc;
- color: #fff;
+.field.has-addons.has-addons-fullwidth .control {
+ -webkit-box-flex: 1;
+ -ms-flex-positive: 1;
+ flex-grow: 1;
+ -ms-flex-negative: 0;
+ flex-shrink: 0;
}
-.notification.is-success {
- background-color: #23d160;
- color: #fff;
+.field.is-grouped {
+ display: -webkit-box;
+ display: -ms-flexbox;
+ display: flex;
+ -webkit-box-pack: start;
+ -ms-flex-pack: start;
+ justify-content: flex-start;
}
-.notification.is-warning {
- background-color: #ffdd57;
- color: rgba(0, 0, 0, 0.7);
+.field.is-grouped > .control {
+ -ms-flex-negative: 0;
+ flex-shrink: 0;
}
-.notification.is-danger {
- background-color: #ff3860;
- color: #fff;
+.field.is-grouped > .control:not(:last-child) {
+ margin-bottom: 0;
+ margin-right: 0.75rem;
}
-.progress {
- -moz-appearance: none;
- -webkit-appearance: none;
- border: none;
- border-radius: 290486px;
- display: block;
- height: 1rem;
- overflow: hidden;
- padding: 0;
- width: 100%;
+.field.is-grouped > .control.is-expanded {
+ -webkit-box-flex: 1;
+ -ms-flex-positive: 1;
+ flex-grow: 1;
+ -ms-flex-negative: 1;
+ flex-shrink: 1;
}
-.progress:not(:last-child) {
- margin-bottom: 1.5rem;
+.field.is-grouped.is-grouped-centered {
+ -webkit-box-pack: center;
+ -ms-flex-pack: center;
+ justify-content: center;
}
-.progress::-webkit-progress-bar {
- background-color: #dbdbdb;
+.field.is-grouped.is-grouped-right {
+ -webkit-box-pack: end;
+ -ms-flex-pack: end;
+ justify-content: flex-end;
}
-.progress::-webkit-progress-value {
- background-color: #4a4a4a;
+.field.is-grouped.is-grouped-multiline {
+ -ms-flex-wrap: wrap;
+ flex-wrap: wrap;
}
-.progress::-moz-progress-bar {
- background-color: #4a4a4a;
+.field.is-grouped.is-grouped-multiline > .control:last-child, .field.is-grouped.is-grouped-multiline > .control:not(:last-child) {
+ margin-bottom: 0.75rem;
}
-.progress.is-white::-webkit-progress-value {
- background-color: white;
+.field.is-grouped.is-grouped-multiline:last-child {
+ margin-bottom: -0.75rem;
}
-.progress.is-white::-moz-progress-bar {
- background-color: white;
+.field.is-grouped.is-grouped-multiline:not(:last-child) {
+ margin-bottom: 0;
}
-.progress.is-black::-webkit-progress-value {
- background-color: #0a0a0a;
+@media screen and (min-width: 769px), print {
+ .field.is-horizontal {
+ display: -webkit-box;
+ display: -ms-flexbox;
+ display: flex;
+ }
}
-.progress.is-black::-moz-progress-bar {
- background-color: #0a0a0a;
+.field-label .label {
+ font-size: inherit;
}
-.progress.is-light::-webkit-progress-value {
- background-color: whitesmoke;
+@media screen and (max-width: 768px) {
+ .field-label {
+ margin-bottom: 0.5rem;
+ }
}
-.progress.is-light::-moz-progress-bar {
- background-color: whitesmoke;
+@media screen and (min-width: 769px), print {
+ .field-label {
+ -ms-flex-preferred-size: 0;
+ flex-basis: 0;
+ -webkit-box-flex: 1;
+ -ms-flex-positive: 1;
+ flex-grow: 1;
+ -ms-flex-negative: 0;
+ flex-shrink: 0;
+ margin-right: 1.5rem;
+ text-align: right;
+ }
+ .field-label.is-small {
+ font-size: 0.75rem;
+ padding-top: 0.375em;
+ }
+ .field-label.is-normal {
+ padding-top: 0.375em;
+ }
+ .field-label.is-medium {
+ font-size: 1.25rem;
+ padding-top: 0.375em;
+ }
+ .field-label.is-large {
+ font-size: 1.5rem;
+ padding-top: 0.375em;
+ }
}
-.progress.is-dark::-webkit-progress-value {
- background-color: #363636;
+.field-body .field .field {
+ margin-bottom: 0;
}
-.progress.is-dark::-moz-progress-bar {
- background-color: #363636;
+@media screen and (min-width: 769px), print {
+ .field-body {
+ display: -webkit-box;
+ display: -ms-flexbox;
+ display: flex;
+ -ms-flex-preferred-size: 0;
+ flex-basis: 0;
+ -webkit-box-flex: 5;
+ -ms-flex-positive: 5;
+ flex-grow: 5;
+ -ms-flex-negative: 1;
+ flex-shrink: 1;
+ }
+ .field-body .field {
+ margin-bottom: 0;
+ }
+ .field-body > .field {
+ -ms-flex-negative: 1;
+ flex-shrink: 1;
+ }
+ .field-body > .field:not(.is-narrow) {
+ -webkit-box-flex: 1;
+ -ms-flex-positive: 1;
+ flex-grow: 1;
+ }
+ .field-body > .field:not(:last-child) {
+ margin-right: 0.75rem;
+ }
}
-.progress.is-primary::-webkit-progress-value {
- background-color: #00d1b2;
+.control {
+ font-size: 1rem;
+ position: relative;
+ text-align: left;
}
-.progress.is-primary::-moz-progress-bar {
- background-color: #00d1b2;
+.control.has-icon .icon {
+ color: #dbdbdb;
+ height: 2.25em;
+ pointer-events: none;
+ position: absolute;
+ top: 0;
+ width: 2.25em;
+ z-index: 4;
}
-.progress.is-info::-webkit-progress-value {
- background-color: #3273dc;
+.control.has-icon .input:focus + .icon {
+ color: #7a7a7a;
}
-.progress.is-info::-moz-progress-bar {
- background-color: #3273dc;
+.control.has-icon .input.is-small + .icon {
+ font-size: 0.75rem;
}
-.progress.is-success::-webkit-progress-value {
- background-color: #23d160;
+.control.has-icon .input.is-medium + .icon {
+ font-size: 1.25rem;
}
-.progress.is-success::-moz-progress-bar {
- background-color: #23d160;
+.control.has-icon .input.is-large + .icon {
+ font-size: 1.5rem;
}
-.progress.is-warning::-webkit-progress-value {
- background-color: #ffdd57;
+.control.has-icon:not(.has-icon-right) .icon {
+ left: 0;
}
-.progress.is-warning::-moz-progress-bar {
- background-color: #ffdd57;
+.control.has-icon:not(.has-icon-right) .input {
+ padding-left: 2.25em;
}
-.progress.is-danger::-webkit-progress-value {
- background-color: #ff3860;
+.control.has-icon.has-icon-right .icon {
+ right: 0;
}
-.progress.is-danger::-moz-progress-bar {
- background-color: #ff3860;
+.control.has-icon.has-icon-right .input {
+ padding-right: 2.25em;
}
-.progress.is-small {
- height: 0.75rem;
+.control.has-icons-left .input:focus ~ .icon,
+.control.has-icons-left .select:focus ~ .icon, .control.has-icons-right .input:focus ~ .icon,
+.control.has-icons-right .select:focus ~ .icon {
+ color: #7a7a7a;
}
-.progress.is-medium {
- height: 1.25rem;
+.control.has-icons-left .input.is-small ~ .icon,
+.control.has-icons-left .select.is-small ~ .icon, .control.has-icons-right .input.is-small ~ .icon,
+.control.has-icons-right .select.is-small ~ .icon {
+ font-size: 0.75rem;
}
-.progress.is-large {
- height: 1.5rem;
+.control.has-icons-left .input.is-medium ~ .icon,
+.control.has-icons-left .select.is-medium ~ .icon, .control.has-icons-right .input.is-medium ~ .icon,
+.control.has-icons-right .select.is-medium ~ .icon {
+ font-size: 1.25rem;
}
-.table {
- background-color: white;
- color: #363636;
- margin-bottom: 1.5rem;
+.control.has-icons-left .input.is-large ~ .icon,
+.control.has-icons-left .select.is-large ~ .icon, .control.has-icons-right .input.is-large ~ .icon,
+.control.has-icons-right .select.is-large ~ .icon {
+ font-size: 1.5rem;
}
-.table td,
-.table th {
- border: 1px solid #dbdbdb;
- border-width: 0 0 1px;
- padding: 0.5em 0.75em;
- vertical-align: top;
+.control.has-icons-left .icon, .control.has-icons-right .icon {
+ color: #dbdbdb;
+ height: 2.25em;
+ pointer-events: none;
+ position: absolute;
+ top: 0;
+ width: 2.25em;
+ z-index: 4;
}
-.table td.is-narrow,
-.table th.is-narrow {
- white-space: nowrap;
- width: 1%;
+.control.has-icons-left .input,
+.control.has-icons-left .select select {
+ padding-left: 2.25em;
}
-.table th {
- color: #363636;
- text-align: left;
+.control.has-icons-left .icon.is-left {
+ left: 0;
}
-.table tr:hover {
- background-color: #fafafa;
+.control.has-icons-right .input,
+.control.has-icons-right .select select {
+ padding-right: 2.25em;
}
-.table tr.is-selected {
- background-color: #00d1b2;
- color: #fff;
+.control.has-icons-right .icon.is-right {
+ right: 0;
}
-.table tr.is-selected a,
-.table tr.is-selected strong {
- color: currentColor;
+.control.is-loading::after {
+ -webkit-animation: spinAround 500ms infinite linear;
+ animation: spinAround 500ms infinite linear;
+ border: 2px solid #dbdbdb;
+ border-radius: 290486px;
+ border-right-color: transparent;
+ border-top-color: transparent;
+ content: "";
+ display: block;
+ height: 1em;
+ position: relative;
+ width: 1em;
+ position: absolute !important;
+ right: 0.625em;
+ top: 0.625em;
}
-.table tr.is-selected td,
-.table tr.is-selected th {
- border-color: #fff;
- color: currentColor;
+.control.is-loading.is-small:after {
+ font-size: 0.75rem;
}
-.table thead td,
-.table thead th {
- border-width: 0 0 2px;
- color: #363636;
+.control.is-loading.is-medium:after {
+ font-size: 1.25rem;
}
-.table tfoot td,
-.table tfoot th {
- border-width: 2px 0 0;
- color: #363636;
+.control.is-loading.is-large:after {
+ font-size: 1.5rem;
}
-.table tbody tr:last-child td,
-.table tbody tr:last-child th {
- border-bottom-width: 0;
+.icon {
+ -webkit-box-align: center;
+ -ms-flex-align: center;
+ align-items: center;
+ display: -webkit-inline-box;
+ display: -ms-inline-flexbox;
+ display: inline-flex;
+ -webkit-box-pack: center;
+ -ms-flex-pack: center;
+ justify-content: center;
+ height: 1.5rem;
+ width: 1.5rem;
}
-.table.is-bordered td,
-.table.is-bordered th {
- border-width: 1px;
+.icon .fa {
+ font-size: 21px;
}
-.table.is-bordered tr:last-child td,
-.table.is-bordered tr:last-child th {
- border-bottom-width: 1px;
+.icon.is-small {
+ height: 1rem;
+ width: 1rem;
}
-.table.is-fullwidth {
- width: 100%;
+.icon.is-small .fa {
+ font-size: 14px;
}
-.table.is-narrow td,
-.table.is-narrow th {
- padding: 0.25em 0.5em;
+.icon.is-medium {
+ height: 2rem;
+ width: 2rem;
}
-.table.is-striped tbody tr:not(.is-selected):nth-child(even) {
- background-color: #fafafa;
+.icon.is-medium .fa {
+ font-size: 28px;
}
-.table.is-striped tbody tr:not(.is-selected):nth-child(even):hover {
- background-color: whitesmoke;
+.icon.is-large {
+ height: 3rem;
+ width: 3rem;
}
-.tags {
- -webkit-box-align: center;
- -ms-flex-align: center;
- align-items: center;
- display: -webkit-box;
- display: -ms-flexbox;
- display: flex;
- -ms-flex-wrap: wrap;
- flex-wrap: wrap;
- -webkit-box-pack: start;
- -ms-flex-pack: start;
- justify-content: flex-start;
+.icon.is-large .fa {
+ font-size: 42px;
}
-.tags .tag {
- margin-bottom: 0.5rem;
+.image {
+ display: block;
+ position: relative;
}
-.tags .tag:not(:last-child) {
- margin-right: 0.5rem;
+.image img {
+ display: block;
+ height: auto;
+ width: 100%;
}
-.tags:last-child {
- margin-bottom: -0.5rem;
+.image.is-square img, .image.is-1by1 img, .image.is-4by3 img, .image.is-3by2 img, .image.is-16by9 img, .image.is-2by1 img {
+ bottom: 0;
+ left: 0;
+ position: absolute;
+ right: 0;
+ top: 0;
+ height: 100%;
+ width: 100%;
}
-.tags:not(:last-child) {
- margin-bottom: 1rem;
+.image.is-square, .image.is-1by1 {
+ padding-top: 100%;
}
-.tags.has-addons .tag {
- margin-right: 0;
+.image.is-4by3 {
+ padding-top: 75%;
}
-.tags.has-addons .tag:not(:first-child) {
- border-bottom-left-radius: 0;
- border-top-left-radius: 0;
+.image.is-3by2 {
+ padding-top: 66.6666%;
}
-.tags.has-addons .tag:not(:last-child) {
- border-bottom-right-radius: 0;
- border-top-right-radius: 0;
+.image.is-16by9 {
+ padding-top: 56.25%;
}
-.tag {
- -webkit-box-align: center;
- -ms-flex-align: center;
- align-items: center;
+.image.is-2by1 {
+ padding-top: 50%;
+}
+
+.image.is-16x16 {
+ height: 16px;
+ width: 16px;
+}
+
+.image.is-24x24 {
+ height: 24px;
+ width: 24px;
+}
+
+.image.is-32x32 {
+ height: 32px;
+ width: 32px;
+}
+
+.image.is-48x48 {
+ height: 48px;
+ width: 48px;
+}
+
+.image.is-64x64 {
+ height: 64px;
+ width: 64px;
+}
+
+.image.is-96x96 {
+ height: 96px;
+ width: 96px;
+}
+
+.image.is-128x128 {
+ height: 128px;
+ width: 128px;
+}
+
+.notification {
background-color: whitesmoke;
border-radius: 3px;
- color: #4a4a4a;
- display: -webkit-inline-box;
- display: -ms-inline-flexbox;
- display: inline-flex;
- font-size: 0.75rem;
- height: 2em;
- -webkit-box-pack: center;
- -ms-flex-pack: center;
- justify-content: center;
- line-height: 1.5;
- padding-left: 0.75em;
- padding-right: 0.75em;
- white-space: nowrap;
+ padding: 1.25rem 2.5rem 1.25rem 1.5rem;
+ position: relative;
}
-.tag .delete {
- margin-left: 0.25em;
- margin-right: -0.375em;
+.notification:not(:last-child) {
+ margin-bottom: 1.5rem;
}
-.tag.is-white {
+.notification a:not(.button) {
+ color: currentColor;
+ text-decoration: underline;
+}
+
+.notification strong {
+ color: currentColor;
+}
+
+.notification code,
+.notification pre {
+ background: white;
+}
+
+.notification pre code {
+ background: transparent;
+}
+
+.notification > .delete {
+ position: absolute;
+ right: 0.5em;
+ top: 0.5em;
+}
+
+.notification .title,
+.notification .subtitle,
+.notification .content {
+ color: currentColor;
+}
+
+.notification.is-white {
background-color: white;
color: #0a0a0a;
}
-.tag.is-black {
+.notification.is-black {
background-color: #0a0a0a;
color: white;
}
-.tag.is-light {
+.notification.is-light {
background-color: whitesmoke;
color: #363636;
}
-.tag.is-dark {
+.notification.is-dark {
background-color: #363636;
color: whitesmoke;
}
-.tag.is-primary {
+.notification.is-primary {
background-color: #00d1b2;
color: #fff;
}
-.tag.is-info {
+.notification.is-info {
background-color: #3273dc;
color: #fff;
}
-.tag.is-success {
+.notification.is-success {
background-color: #23d160;
color: #fff;
}
-.tag.is-warning {
+.notification.is-warning {
background-color: #ffdd57;
color: rgba(0, 0, 0, 0.7);
}
-.tag.is-danger {
+.notification.is-danger {
background-color: #ff3860;
color: #fff;
}
-.tag.is-medium {
- font-size: 1rem;
+.progress {
+ -moz-appearance: none;
+ -webkit-appearance: none;
+ border: none;
+ border-radius: 290486px;
+ display: block;
+ height: 1rem;
+ overflow: hidden;
+ padding: 0;
+ width: 100%;
}
-.tag.is-large {
- font-size: 1.25rem;
+.progress:not(:last-child) {
+ margin-bottom: 1.5rem;
}
-.tag.is-delete {
- margin-left: 1px;
- padding: 0;
- position: relative;
- width: 2em;
+.progress::-webkit-progress-bar {
+ background-color: #dbdbdb;
}
-.tag.is-delete:before, .tag.is-delete:after {
- background-color: currentColor;
- content: "";
- display: block;
- left: 50%;
- position: absolute;
- top: 50%;
- -webkit-transform: translateX(-50%) translateY(-50%) rotate(45deg);
- transform: translateX(-50%) translateY(-50%) rotate(45deg);
- -webkit-transform-origin: center center;
- transform-origin: center center;
+.progress::-webkit-progress-value {
+ background-color: #4a4a4a;
}
-.tag.is-delete:before {
- height: 1px;
- width: 50%;
+.progress::-moz-progress-bar {
+ background-color: #4a4a4a;
}
-.tag.is-delete:after {
- height: 50%;
- width: 1px;
+.progress.is-white::-webkit-progress-value {
+ background-color: white;
}
-.tag.is-delete:hover, .tag.is-delete:focus {
- background-color: #e8e8e8;
+.progress.is-white::-moz-progress-bar {
+ background-color: white;
}
-.tag.is-delete:active {
- background-color: #dbdbdb;
+.progress.is-black::-webkit-progress-value {
+ background-color: #0a0a0a;
}
-.tag.is-rounded {
- border-radius: 290486px;
+.progress.is-black::-moz-progress-bar {
+ background-color: #0a0a0a;
}
-a.tag:hover {
- text-decoration: underline;
+.progress.is-light::-webkit-progress-value {
+ background-color: whitesmoke;
}
-.title,
-.subtitle {
- word-break: break-word;
+.progress.is-light::-moz-progress-bar {
+ background-color: whitesmoke;
}
-.title:not(:last-child),
-.subtitle:not(:last-child) {
- margin-bottom: 1.5rem;
+.progress.is-dark::-webkit-progress-value {
+ background-color: #363636;
}
-.title em,
-.title span,
-.subtitle em,
-.subtitle span {
- font-weight: inherit;
+.progress.is-dark::-moz-progress-bar {
+ background-color: #363636;
}
-.title .tag,
-.subtitle .tag {
- vertical-align: middle;
+.progress.is-primary::-webkit-progress-value {
+ background-color: #00d1b2;
}
-.title {
- color: #363636;
- font-size: 2rem;
- font-weight: 600;
- line-height: 1.125;
+.progress.is-primary::-moz-progress-bar {
+ background-color: #00d1b2;
}
-.title strong {
- color: inherit;
- font-weight: inherit;
+.progress.is-info::-webkit-progress-value {
+ background-color: #3273dc;
}
-.title + .highlight {
- margin-top: -0.75rem;
+.progress.is-info::-moz-progress-bar {
+ background-color: #3273dc;
}
-.title:not(.is-spaced) + .subtitle {
- margin-top: -1.5rem;
+.progress.is-success::-webkit-progress-value {
+ background-color: #23d160;
}
-.title.is-1 {
- font-size: 3rem;
+.progress.is-success::-moz-progress-bar {
+ background-color: #23d160;
}
-.title.is-2 {
- font-size: 2.5rem;
+.progress.is-warning::-webkit-progress-value {
+ background-color: #ffdd57;
}
-.title.is-3 {
- font-size: 2rem;
+.progress.is-warning::-moz-progress-bar {
+ background-color: #ffdd57;
}
-.title.is-4 {
- font-size: 1.5rem;
+.progress.is-danger::-webkit-progress-value {
+ background-color: #ff3860;
}
-.title.is-5 {
- font-size: 1.25rem;
+.progress.is-danger::-moz-progress-bar {
+ background-color: #ff3860;
}
-.title.is-6 {
- font-size: 1rem;
+.progress.is-small {
+ height: 0.75rem;
}
-.subtitle {
- color: #4a4a4a;
- font-size: 1.25rem;
- font-weight: 400;
- line-height: 1.25;
+.progress.is-medium {
+ height: 1.25rem;
}
-.subtitle strong {
- color: #363636;
- font-weight: 600;
+.progress.is-large {
+ height: 1.5rem;
}
-.subtitle:not(.is-spaced) + .title {
- margin-top: -1.5rem;
+.table {
+ background-color: white;
+ color: #363636;
+ margin-bottom: 1.5rem;
}
-.subtitle.is-1 {
- font-size: 3rem;
+.table td,
+.table th {
+ border: 1px solid #dbdbdb;
+ border-width: 0 0 1px;
+ padding: 0.5em 0.75em;
+ vertical-align: top;
}
-.subtitle.is-2 {
- font-size: 2.5rem;
+.table td.is-white,
+.table th.is-white {
+ background-color: white;
+ border-color: white;
+ color: #0a0a0a;
}
-.subtitle.is-3 {
- font-size: 2rem;
+.table td.is-black,
+.table th.is-black {
+ background-color: #0a0a0a;
+ border-color: #0a0a0a;
+ color: white;
}
-.subtitle.is-4 {
- font-size: 1.5rem;
+.table td.is-light,
+.table th.is-light {
+ background-color: whitesmoke;
+ border-color: whitesmoke;
+ color: #363636;
}
-.subtitle.is-5 {
- font-size: 1.25rem;
+.table td.is-dark,
+.table th.is-dark {
+ background-color: #363636;
+ border-color: #363636;
+ color: whitesmoke;
}
-.subtitle.is-6 {
- font-size: 1rem;
+.table td.is-primary,
+.table th.is-primary {
+ background-color: #00d1b2;
+ border-color: #00d1b2;
+ color: #fff;
}
-.block:not(:last-child) {
- margin-bottom: 1.5rem;
+.table td.is-info,
+.table th.is-info {
+ background-color: #3273dc;
+ border-color: #3273dc;
+ color: #fff;
}
-.container {
- margin: 0 auto;
- position: relative;
+.table td.is-success,
+.table th.is-success {
+ background-color: #23d160;
+ border-color: #23d160;
+ color: #fff;
}
-@media screen and (min-width: 1008px) {
- .container {
- max-width: 960px;
- width: 960px;
- }
- .container.is-fluid {
- margin-left: 24px;
- margin-right: 24px;
- max-width: none;
- width: auto;
- }
+.table td.is-warning,
+.table th.is-warning {
+ background-color: #ffdd57;
+ border-color: #ffdd57;
+ color: rgba(0, 0, 0, 0.7);
}
-@media screen and (max-width: 1199px) {
- .container.is-widescreen {
- max-width: 1152px;
- width: auto;
- }
+.table td.is-danger,
+.table th.is-danger {
+ background-color: #ff3860;
+ border-color: #ff3860;
+ color: #fff;
}
-@media screen and (max-width: 1391px) {
- .container.is-fullhd {
- max-width: 1344px;
- width: auto;
- }
+.table td.is-narrow,
+.table th.is-narrow {
+ white-space: nowrap;
+ width: 1%;
}
-@media screen and (min-width: 1200px) {
- .container {
- max-width: 1152px;
- width: 1152px;
- }
+.table th {
+ color: #363636;
+ text-align: left;
}
-@media screen and (min-width: 1392px) {
- .container {
- max-width: 1344px;
- width: 1344px;
- }
+.table tr:hover {
+ background-color: #fafafa;
}
-.delete {
- -webkit-touch-callout: none;
- -webkit-user-select: none;
- -moz-user-select: none;
- -ms-user-select: none;
- user-select: none;
- -moz-appearance: none;
- -webkit-appearance: none;
- background-color: rgba(10, 10, 10, 0.2);
- border: none;
- border-radius: 290486px;
- cursor: pointer;
- display: inline-block;
- -webkit-box-flex: 0;
- -ms-flex-positive: 0;
- flex-grow: 0;
- -ms-flex-negative: 0;
- flex-shrink: 0;
- font-size: 1rem;
- height: 20px;
- max-height: 20px;
- max-width: 20px;
- min-height: 20px;
- min-width: 20px;
- outline: none;
- position: relative;
- vertical-align: top;
- width: 20px;
+.table tr.is-selected {
+ background-color: #00d1b2;
+ color: #fff;
}
-.delete:before, .delete:after {
- background-color: white;
- content: "";
- display: block;
- left: 50%;
- position: absolute;
- top: 50%;
- -webkit-transform: translateX(-50%) translateY(-50%) rotate(45deg);
- transform: translateX(-50%) translateY(-50%) rotate(45deg);
- -webkit-transform-origin: center center;
- transform-origin: center center;
+.table tr.is-selected a,
+.table tr.is-selected strong {
+ color: currentColor;
}
-.delete:before {
- height: 2px;
- width: 50%;
+.table tr.is-selected td,
+.table tr.is-selected th {
+ border-color: #fff;
+ color: currentColor;
}
-.delete:after {
- height: 50%;
- width: 2px;
+.table thead td,
+.table thead th {
+ border-width: 0 0 2px;
+ color: #363636;
}
-.delete:hover, .delete:focus {
- background-color: rgba(10, 10, 10, 0.3);
+.table tfoot td,
+.table tfoot th {
+ border-width: 2px 0 0;
+ color: #363636;
}
-.delete:active {
- background-color: rgba(10, 10, 10, 0.4);
+.table tbody tr:last-child td,
+.table tbody tr:last-child th {
+ border-bottom-width: 0;
}
-.delete.is-small {
- height: 16px;
- max-height: 16px;
- max-width: 16px;
- min-height: 16px;
- min-width: 16px;
- width: 16px;
+.table.is-bordered td,
+.table.is-bordered th {
+ border-width: 1px;
}
-.delete.is-medium {
- height: 24px;
- max-height: 24px;
- max-width: 24px;
- min-height: 24px;
- min-width: 24px;
- width: 24px;
+.table.is-bordered tr:last-child td,
+.table.is-bordered tr:last-child th {
+ border-bottom-width: 1px;
}
-.delete.is-large {
- height: 32px;
- max-height: 32px;
- max-width: 32px;
- min-height: 32px;
- min-width: 32px;
- width: 32px;
+.table.is-fullwidth {
+ width: 100%;
}
-.fa {
- font-size: 21px;
- text-align: center;
- vertical-align: top;
+.table.is-narrow td,
+.table.is-narrow th {
+ padding: 0.25em 0.5em;
}
-.heading {
- display: block;
- font-size: 11px;
- letter-spacing: 1px;
- margin-bottom: 5px;
- text-transform: uppercase;
+.table.is-striped tbody tr:not(.is-selected):nth-child(even) {
+ background-color: #fafafa;
}
-.highlight {
- font-weight: 400;
- max-width: 100%;
- overflow: hidden;
- padding: 0;
+.table.is-striped tbody tr:not(.is-selected):nth-child(even):hover {
+ background-color: whitesmoke;
}
-.highlight:not(:last-child) {
- margin-bottom: 1.5rem;
+.tags {
+ -webkit-box-align: center;
+ -ms-flex-align: center;
+ align-items: center;
+ display: -webkit-box;
+ display: -ms-flexbox;
+ display: flex;
+ -ms-flex-wrap: wrap;
+ flex-wrap: wrap;
+ -webkit-box-pack: start;
+ -ms-flex-pack: start;
+ justify-content: flex-start;
}
-.highlight pre {
- overflow: auto;
- max-width: 100%;
+.tags .tag {
+ margin-bottom: 0.5rem;
}
-.loader {
- -webkit-animation: spinAround 500ms infinite linear;
- animation: spinAround 500ms infinite linear;
- border: 2px solid #dbdbdb;
- border-radius: 290486px;
- border-right-color: transparent;
- border-top-color: transparent;
- content: "";
- display: block;
- height: 1em;
- position: relative;
- width: 1em;
+.tags .tag:not(:last-child) {
+ margin-right: 0.5rem;
}
-.number {
+.tags:last-child {
+ margin-bottom: -0.5rem;
+}
+
+.tags:not(:last-child) {
+ margin-bottom: 1rem;
+}
+
+.tags.has-addons .tag {
+ margin-right: 0;
+}
+
+.tags.has-addons .tag:not(:first-child) {
+ border-bottom-left-radius: 0;
+ border-top-left-radius: 0;
+}
+
+.tags.has-addons .tag:not(:last-child) {
+ border-bottom-right-radius: 0;
+ border-top-right-radius: 0;
+}
+
+.tag {
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
background-color: whitesmoke;
- border-radius: 290486px;
+ border-radius: 3px;
+ color: #4a4a4a;
display: -webkit-inline-box;
display: -ms-inline-flexbox;
display: inline-flex;
- font-size: 1.25rem;
+ font-size: 0.75rem;
height: 2em;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
- margin-right: 1.5rem;
- min-width: 2.5em;
- padding: 0.25rem 0.5rem;
- text-align: center;
- vertical-align: top;
-}
-
-.breadcrumb {
- -webkit-touch-callout: none;
- -webkit-user-select: none;
- -moz-user-select: none;
- -ms-user-select: none;
- user-select: none;
- -webkit-box-align: stretch;
- -ms-flex-align: stretch;
- align-items: stretch;
- display: -webkit-box;
- display: -ms-flexbox;
- display: flex;
- font-size: 1rem;
- overflow: hidden;
- overflow-x: auto;
+ line-height: 1.5;
+ padding-left: 0.75em;
+ padding-right: 0.75em;
white-space: nowrap;
}
-.breadcrumb:not(:last-child) {
- margin-bottom: 1.5rem;
-}
-
-.breadcrumb a {
- -webkit-box-align: center;
- -ms-flex-align: center;
- align-items: center;
- color: #7a7a7a;
- display: -webkit-box;
- display: -ms-flexbox;
- display: flex;
- -webkit-box-pack: center;
- -ms-flex-pack: center;
- justify-content: center;
- padding: 0.5em 0.75em;
+.tag .delete {
+ margin-left: 0.25em;
+ margin-right: -0.375em;
}
-.breadcrumb a:hover {
- color: #363636;
+.tag.is-white {
+ background-color: white;
+ color: #0a0a0a;
}
-.breadcrumb li {
- -webkit-box-align: center;
- -ms-flex-align: center;
- align-items: center;
- display: -webkit-box;
- display: -ms-flexbox;
- display: flex;
+.tag.is-black {
+ background-color: #0a0a0a;
+ color: white;
}
-.breadcrumb li.is-active a {
+.tag.is-light {
+ background-color: whitesmoke;
color: #363636;
- cursor: default;
- pointer-events: none;
}
-.breadcrumb li + li::before {
- color: #4a4a4a;
- content: "\0002f";
+.tag.is-dark {
+ background-color: #363636;
+ color: whitesmoke;
}
-.breadcrumb ul, .breadcrumb ol {
- -webkit-box-align: center;
- -ms-flex-align: center;
- align-items: center;
- display: -webkit-box;
- display: -ms-flexbox;
- display: flex;
- -webkit-box-flex: 1;
- -ms-flex-positive: 1;
- flex-grow: 1;
- -ms-flex-negative: 0;
- flex-shrink: 0;
- -webkit-box-pack: start;
- -ms-flex-pack: start;
- justify-content: flex-start;
+.tag.is-primary {
+ background-color: #00d1b2;
+ color: #fff;
}
-.breadcrumb .icon:first-child {
- margin-right: 0.5em;
+.tag.is-info {
+ background-color: #3273dc;
+ color: #fff;
}
-.breadcrumb .icon:last-child {
- margin-left: 0.5em;
+.tag.is-success {
+ background-color: #23d160;
+ color: #fff;
}
-.breadcrumb.is-centered ol, .breadcrumb.is-centered ul {
- -webkit-box-pack: center;
- -ms-flex-pack: center;
- justify-content: center;
+.tag.is-warning {
+ background-color: #ffdd57;
+ color: rgba(0, 0, 0, 0.7);
}
-.breadcrumb.is-right ol, .breadcrumb.is-right ul {
- -webkit-box-pack: end;
- -ms-flex-pack: end;
- justify-content: flex-end;
+.tag.is-danger {
+ background-color: #ff3860;
+ color: #fff;
}
-.breadcrumb.is-small {
- font-size: 0.75rem;
+.tag.is-medium {
+ font-size: 1rem;
}
-.breadcrumb.is-medium {
+.tag.is-large {
font-size: 1.25rem;
}
-.breadcrumb.is-large {
- font-size: 1.5rem;
+.tag.is-delete {
+ margin-left: 1px;
+ padding: 0;
+ position: relative;
+ width: 2em;
}
-.breadcrumb.has-arrow-separator li + li::before {
- content: "\02192";
+.tag.is-delete:before, .tag.is-delete:after {
+ background-color: currentColor;
+ content: "";
+ display: block;
+ left: 50%;
+ position: absolute;
+ top: 50%;
+ -webkit-transform: translateX(-50%) translateY(-50%) rotate(45deg);
+ transform: translateX(-50%) translateY(-50%) rotate(45deg);
+ -webkit-transform-origin: center center;
+ transform-origin: center center;
}
-.breadcrumb.has-bullet-separator li + li::before {
- content: "\02022";
+.tag.is-delete:before {
+ height: 1px;
+ width: 50%;
}
-.breadcrumb.has-dot-separator li + li::before {
- content: "\000b7";
+.tag.is-delete:after {
+ height: 50%;
+ width: 1px;
}
-.breadcrumb.has-succeeds-separator li + li::before {
- content: "\0227B";
+.tag.is-delete:hover, .tag.is-delete:focus {
+ background-color: #e8e8e8;
}
-.card {
- background-color: white;
- -webkit-box-shadow: 0 2px 3px rgba(10, 10, 10, 0.1), 0 0 0 1px rgba(10, 10, 10, 0.1);
- box-shadow: 0 2px 3px rgba(10, 10, 10, 0.1), 0 0 0 1px rgba(10, 10, 10, 0.1);
- color: #4a4a4a;
- max-width: 100%;
- position: relative;
+.tag.is-delete:active {
+ background-color: #dbdbdb;
}
-.card-header {
- -webkit-box-align: stretch;
- -ms-flex-align: stretch;
- align-items: stretch;
- -webkit-box-shadow: 0 1px 2px rgba(10, 10, 10, 0.1);
- box-shadow: 0 1px 2px rgba(10, 10, 10, 0.1);
- display: -webkit-box;
- display: -ms-flexbox;
- display: flex;
+.tag.is-rounded {
+ border-radius: 290486px;
}
-.card-header-title {
- -webkit-box-align: center;
- -ms-flex-align: center;
- align-items: center;
- color: #363636;
- display: -webkit-box;
- display: -ms-flexbox;
- display: flex;
- -webkit-box-flex: 1;
- -ms-flex-positive: 1;
- flex-grow: 1;
- font-weight: 700;
- padding: 0.75rem;
+a.tag:hover {
+ text-decoration: underline;
}
-.card-header-icon {
- -webkit-box-align: center;
- -ms-flex-align: center;
- align-items: center;
- cursor: pointer;
- display: -webkit-box;
- display: -ms-flexbox;
- display: flex;
- -webkit-box-pack: center;
- -ms-flex-pack: center;
- justify-content: center;
- padding: 0.75rem;
-}
-
-.card-image {
- display: block;
- position: relative;
+.title,
+.subtitle {
+ word-break: break-word;
}
-.card-content {
- padding: 1.5rem;
+.title:not(:last-child),
+.subtitle:not(:last-child) {
+ margin-bottom: 1.5rem;
}
-.card-footer {
- border-top: 1px solid #dbdbdb;
- -webkit-box-align: stretch;
- -ms-flex-align: stretch;
- align-items: stretch;
- display: -webkit-box;
- display: -ms-flexbox;
- display: flex;
+.title em,
+.title span,
+.subtitle em,
+.subtitle span {
+ font-weight: inherit;
}
-.card-footer-item {
- -webkit-box-align: center;
- -ms-flex-align: center;
- align-items: center;
- display: -webkit-box;
- display: -ms-flexbox;
- display: flex;
- -ms-flex-preferred-size: 0;
- flex-basis: 0;
- -webkit-box-flex: 1;
- -ms-flex-positive: 1;
- flex-grow: 1;
- -ms-flex-negative: 0;
- flex-shrink: 0;
- -webkit-box-pack: center;
- -ms-flex-pack: center;
- justify-content: center;
- padding: 0.75rem;
+.title .tag,
+.subtitle .tag {
+ vertical-align: middle;
}
-.card-footer-item:not(:last-child) {
- border-right: 1px solid #dbdbdb;
+.title {
+ color: #363636;
+ font-size: 2rem;
+ font-weight: 600;
+ line-height: 1.125;
}
-.card .media:not(:last-child) {
- margin-bottom: 0.75rem;
+.title strong {
+ color: inherit;
+ font-weight: inherit;
}
-.dropdown {
- display: -webkit-inline-box;
- display: -ms-inline-flexbox;
- display: inline-flex;
- position: relative;
- vertical-align: top;
+.title + .highlight {
+ margin-top: -0.75rem;
}
-.dropdown.is-active .dropdown-menu, .dropdown.is-hoverable:hover .dropdown-menu {
- display: block;
+.title:not(.is-spaced) + .subtitle {
+ margin-top: -1.5rem;
}
-.dropdown.is-right .dropdown-menu {
- left: auto;
- right: 0;
+.title.is-1 {
+ font-size: 3rem;
}
-.dropdown-menu {
- display: none;
- left: 0;
- min-width: 12rem;
- padding-top: 4px;
- position: absolute;
- top: 100%;
- z-index: 20;
+.title.is-2 {
+ font-size: 2.5rem;
}
-.dropdown-content {
- background-color: white;
- border-radius: 3px;
- -webkit-box-shadow: 0 2px 3px rgba(10, 10, 10, 0.1), 0 0 0 1px rgba(10, 10, 10, 0.1);
- box-shadow: 0 2px 3px rgba(10, 10, 10, 0.1), 0 0 0 1px rgba(10, 10, 10, 0.1);
- padding-bottom: 0.5rem;
- padding-top: 0.5rem;
+.title.is-3 {
+ font-size: 2rem;
}
-.dropdown-item {
- color: #4a4a4a;
- display: block;
- font-size: 0.875rem;
- line-height: 1.5;
- padding: 0.375rem 1rem;
- position: relative;
+.title.is-4 {
+ font-size: 1.5rem;
}
-a.dropdown-item {
- padding-right: 3rem;
- white-space: nowrap;
+.title.is-5 {
+ font-size: 1.25rem;
}
-a.dropdown-item:hover {
- background-color: whitesmoke;
- color: #0a0a0a;
+.title.is-6 {
+ font-size: 1rem;
}
-a.dropdown-item.is-active {
- background-color: #00d1b2;
- color: #fff;
+.title.is-7 {
+ font-size: 0.75rem;
}
-.dropdown-divider {
- background-color: #dbdbdb;
- border: none;
- display: block;
- height: 1px;
- margin: 0.5rem 0;
+.subtitle {
+ color: #4a4a4a;
+ font-size: 1.25rem;
+ font-weight: 400;
+ line-height: 1.25;
}
-.level {
- -webkit-box-align: center;
- -ms-flex-align: center;
- align-items: center;
- -webkit-box-pack: justify;
- -ms-flex-pack: justify;
- justify-content: space-between;
+.subtitle strong {
+ color: #363636;
+ font-weight: 600;
}
-.level:not(:last-child) {
- margin-bottom: 1.5rem;
+.subtitle:not(.is-spaced) + .title {
+ margin-top: -1.5rem;
}
-.level code {
- border-radius: 3px;
+.subtitle.is-1 {
+ font-size: 3rem;
}
-.level img {
- display: inline-block;
- vertical-align: top;
+.subtitle.is-2 {
+ font-size: 2.5rem;
}
-.level.is-mobile {
- display: -webkit-box;
- display: -ms-flexbox;
- display: flex;
+.subtitle.is-3 {
+ font-size: 2rem;
}
-.level.is-mobile .level-left,
-.level.is-mobile .level-right {
- display: -webkit-box;
- display: -ms-flexbox;
- display: flex;
+.subtitle.is-4 {
+ font-size: 1.5rem;
}
-.level.is-mobile .level-left + .level-right {
- margin-top: 0;
+.subtitle.is-5 {
+ font-size: 1.25rem;
}
-.level.is-mobile .level-item:not(:last-child) {
- margin-bottom: 0;
+.subtitle.is-6 {
+ font-size: 1rem;
}
-.level.is-mobile .level-item:not(.is-narrow) {
- -webkit-box-flex: 1;
- -ms-flex-positive: 1;
- flex-grow: 1;
+.subtitle.is-7 {
+ font-size: 0.75rem;
}
-@media screen and (min-width: 769px), print {
- .level {
- display: -webkit-box;
- display: -ms-flexbox;
- display: flex;
- }
- .level > .level-item:not(.is-narrow) {
- -webkit-box-flex: 1;
- -ms-flex-positive: 1;
- flex-grow: 1;
- }
+.block:not(:last-child) {
+ margin-bottom: 1.5rem;
}
-.level-item {
- -webkit-box-align: center;
- -ms-flex-align: center;
- align-items: center;
- display: -webkit-box;
- display: -ms-flexbox;
- display: flex;
- -ms-flex-preferred-size: auto;
- flex-basis: auto;
+.delete {
+ -webkit-touch-callout: none;
+ -webkit-user-select: none;
+ -moz-user-select: none;
+ -ms-user-select: none;
+ user-select: none;
+ -moz-appearance: none;
+ -webkit-appearance: none;
+ background-color: rgba(10, 10, 10, 0.2);
+ border: none;
+ border-radius: 290486px;
+ cursor: pointer;
+ display: inline-block;
-webkit-box-flex: 0;
-ms-flex-positive: 0;
flex-grow: 0;
-ms-flex-negative: 0;
flex-shrink: 0;
- -webkit-box-pack: center;
- -ms-flex-pack: center;
- justify-content: center;
+ font-size: 1rem;
+ height: 20px;
+ max-height: 20px;
+ max-width: 20px;
+ min-height: 20px;
+ min-width: 20px;
+ outline: none;
+ position: relative;
+ vertical-align: top;
+ width: 20px;
}
-.level-item .title,
-.level-item .subtitle {
- margin-bottom: 0;
+.delete:before, .delete:after {
+ background-color: white;
+ content: "";
+ display: block;
+ left: 50%;
+ position: absolute;
+ top: 50%;
+ -webkit-transform: translateX(-50%) translateY(-50%) rotate(45deg);
+ transform: translateX(-50%) translateY(-50%) rotate(45deg);
+ -webkit-transform-origin: center center;
+ transform-origin: center center;
}
-@media screen and (max-width: 768px) {
- .level-item:not(:last-child) {
- margin-bottom: 0.75rem;
- }
+.delete:before {
+ height: 2px;
+ width: 50%;
}
-.level-left,
-.level-right {
- -ms-flex-preferred-size: auto;
- flex-basis: auto;
- -webkit-box-flex: 0;
- -ms-flex-positive: 0;
- flex-grow: 0;
- -ms-flex-negative: 0;
- flex-shrink: 0;
+.delete:after {
+ height: 50%;
+ width: 2px;
}
-.level-left .level-item:not(:last-child),
-.level-right .level-item:not(:last-child) {
- margin-right: 0.75rem;
+.delete:hover, .delete:focus {
+ background-color: rgba(10, 10, 10, 0.3);
}
-.level-left .level-item.is-flexible,
-.level-right .level-item.is-flexible {
- -webkit-box-flex: 1;
- -ms-flex-positive: 1;
- flex-grow: 1;
+.delete:active {
+ background-color: rgba(10, 10, 10, 0.4);
}
-.level-left {
- -webkit-box-align: center;
- -ms-flex-align: center;
- align-items: center;
- -webkit-box-pack: start;
- -ms-flex-pack: start;
- justify-content: flex-start;
+.delete.is-small {
+ height: 16px;
+ max-height: 16px;
+ max-width: 16px;
+ min-height: 16px;
+ min-width: 16px;
+ width: 16px;
}
-@media screen and (max-width: 768px) {
- .level-left + .level-right {
- margin-top: 1.5rem;
- }
+.delete.is-medium {
+ height: 24px;
+ max-height: 24px;
+ max-width: 24px;
+ min-height: 24px;
+ min-width: 24px;
+ width: 24px;
}
-@media screen and (min-width: 769px), print {
- .level-left {
- display: -webkit-box;
- display: -ms-flexbox;
- display: flex;
- }
+.delete.is-large {
+ height: 32px;
+ max-height: 32px;
+ max-width: 32px;
+ min-height: 32px;
+ min-width: 32px;
+ width: 32px;
}
-.level-right {
+.fa {
+ font-size: 21px;
+ text-align: center;
+ vertical-align: top;
+}
+
+.heading {
+ display: block;
+ font-size: 11px;
+ letter-spacing: 1px;
+ margin-bottom: 5px;
+ text-transform: uppercase;
+}
+
+.highlight {
+ font-weight: 400;
+ max-width: 100%;
+ overflow: hidden;
+ padding: 0;
+}
+
+.highlight:not(:last-child) {
+ margin-bottom: 1.5rem;
+}
+
+.highlight pre {
+ overflow: auto;
+ max-width: 100%;
+}
+
+.loader {
+ -webkit-animation: spinAround 500ms infinite linear;
+ animation: spinAround 500ms infinite linear;
+ border: 2px solid #dbdbdb;
+ border-radius: 290486px;
+ border-right-color: transparent;
+ border-top-color: transparent;
+ content: "";
+ display: block;
+ height: 1em;
+ position: relative;
+ width: 1em;
+}
+
+.number {
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
- -webkit-box-pack: end;
- -ms-flex-pack: end;
- justify-content: flex-end;
-}
-
-@media screen and (min-width: 769px), print {
- .level-right {
- display: -webkit-box;
- display: -ms-flexbox;
- display: flex;
- }
+ background-color: whitesmoke;
+ border-radius: 290486px;
+ display: -webkit-inline-box;
+ display: -ms-inline-flexbox;
+ display: inline-flex;
+ font-size: 1.25rem;
+ height: 2em;
+ -webkit-box-pack: center;
+ -ms-flex-pack: center;
+ justify-content: center;
+ margin-right: 1.5rem;
+ min-width: 2.5em;
+ padding: 0.25rem 0.5rem;
+ text-align: center;
+ vertical-align: top;
}
-.media {
- -webkit-box-align: start;
- -ms-flex-align: start;
- align-items: flex-start;
+.breadcrumb {
+ -webkit-touch-callout: none;
+ -webkit-user-select: none;
+ -moz-user-select: none;
+ -ms-user-select: none;
+ user-select: none;
+ -webkit-box-align: stretch;
+ -ms-flex-align: stretch;
+ align-items: stretch;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
- text-align: left;
+ font-size: 1rem;
+ overflow: hidden;
+ overflow-x: auto;
+ white-space: nowrap;
}
-.media .content:not(:last-child) {
- margin-bottom: 0.75rem;
+.breadcrumb:not(:last-child) {
+ margin-bottom: 1.5rem;
}
-.media .media {
- border-top: 1px solid rgba(219, 219, 219, 0.5);
+.breadcrumb a {
+ -webkit-box-align: center;
+ -ms-flex-align: center;
+ align-items: center;
+ color: #7a7a7a;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
- padding-top: 0.75rem;
-}
-
-.media .media .content:not(:last-child),
-.media .media .control:not(:last-child) {
- margin-bottom: 0.5rem;
+ -webkit-box-pack: center;
+ -ms-flex-pack: center;
+ justify-content: center;
+ padding: 0.5em 0.75em;
}
-.media .media .media {
- padding-top: 0.5rem;
+.breadcrumb a:hover {
+ color: #363636;
}
-.media .media .media + .media {
- margin-top: 0.5rem;
+.breadcrumb li {
+ -webkit-box-align: center;
+ -ms-flex-align: center;
+ align-items: center;
+ display: -webkit-box;
+ display: -ms-flexbox;
+ display: flex;
}
-.media + .media {
- border-top: 1px solid rgba(219, 219, 219, 0.5);
- margin-top: 1rem;
- padding-top: 1rem;
+.breadcrumb li.is-active a {
+ color: #363636;
+ cursor: default;
+ pointer-events: none;
}
-.media.is-large + .media {
- margin-top: 1.5rem;
- padding-top: 1.5rem;
+.breadcrumb li + li::before {
+ color: #4a4a4a;
+ content: "\0002f";
}
-.media-left,
-.media-right {
- -ms-flex-preferred-size: auto;
- flex-basis: auto;
- -webkit-box-flex: 0;
- -ms-flex-positive: 0;
- flex-grow: 0;
+.breadcrumb ul, .breadcrumb ol {
+ -webkit-box-align: center;
+ -ms-flex-align: center;
+ align-items: center;
+ display: -webkit-box;
+ display: -ms-flexbox;
+ display: flex;
+ -webkit-box-flex: 1;
+ -ms-flex-positive: 1;
+ flex-grow: 1;
-ms-flex-negative: 0;
flex-shrink: 0;
+ -webkit-box-pack: start;
+ -ms-flex-pack: start;
+ justify-content: flex-start;
}
-.media-left {
- margin-right: 1rem;
+.breadcrumb .icon:first-child {
+ margin-right: 0.5em;
}
-.media-right {
- margin-left: 1rem;
+.breadcrumb .icon:last-child {
+ margin-left: 0.5em;
}
-.media-content {
- -ms-flex-preferred-size: auto;
- flex-basis: auto;
- -webkit-box-flex: 1;
- -ms-flex-positive: 1;
- flex-grow: 1;
- -ms-flex-negative: 1;
- flex-shrink: 1;
- text-align: left;
+.breadcrumb.is-centered ol, .breadcrumb.is-centered ul {
+ -webkit-box-pack: center;
+ -ms-flex-pack: center;
+ justify-content: center;
}
-.menu {
- font-size: 1rem;
+.breadcrumb.is-right ol, .breadcrumb.is-right ul {
+ -webkit-box-pack: end;
+ -ms-flex-pack: end;
+ justify-content: flex-end;
}
-.menu.is-small {
+.breadcrumb.is-small {
font-size: 0.75rem;
}
-.menu.is-medium {
+.breadcrumb.is-medium {
font-size: 1.25rem;
}
-.menu.is-large {
+.breadcrumb.is-large {
font-size: 1.5rem;
}
-.menu-list {
- line-height: 1.25;
+.breadcrumb.has-arrow-separator li + li::before {
+ content: "\02192";
}
-.menu-list a {
- border-radius: 2px;
- color: #4a4a4a;
- display: block;
- padding: 0.5em 0.75em;
+.breadcrumb.has-bullet-separator li + li::before {
+ content: "\02022";
}
-.menu-list a:hover {
- background-color: whitesmoke;
- color: #363636;
+.breadcrumb.has-dot-separator li + li::before {
+ content: "\000b7";
}
-.menu-list a.is-active {
- background-color: #00d1b2;
- color: #fff;
+.breadcrumb.has-succeeds-separator li + li::before {
+ content: "\0227B";
}
-.menu-list li ul {
- border-left: 1px solid #dbdbdb;
- margin: 0.75em;
- padding-left: 0.75em;
+.card {
+ background-color: white;
+ -webkit-box-shadow: 0 2px 3px rgba(10, 10, 10, 0.1), 0 0 0 1px rgba(10, 10, 10, 0.1);
+ box-shadow: 0 2px 3px rgba(10, 10, 10, 0.1), 0 0 0 1px rgba(10, 10, 10, 0.1);
+ color: #4a4a4a;
+ max-width: 100%;
+ position: relative;
}
-.menu-label {
- color: #7a7a7a;
- font-size: 0.75em;
- letter-spacing: 0.1em;
- text-transform: uppercase;
+.card-header {
+ -webkit-box-align: stretch;
+ -ms-flex-align: stretch;
+ align-items: stretch;
+ -webkit-box-shadow: 0 1px 2px rgba(10, 10, 10, 0.1);
+ box-shadow: 0 1px 2px rgba(10, 10, 10, 0.1);
+ display: -webkit-box;
+ display: -ms-flexbox;
+ display: flex;
}
-.menu-label:not(:first-child) {
- margin-top: 1em;
+.card-header-title {
+ -webkit-box-align: center;
+ -ms-flex-align: center;
+ align-items: center;
+ color: #363636;
+ display: -webkit-box;
+ display: -ms-flexbox;
+ display: flex;
+ -webkit-box-flex: 1;
+ -ms-flex-positive: 1;
+ flex-grow: 1;
+ font-weight: 700;
+ padding: 0.75rem;
}
-.menu-label:not(:last-child) {
- margin-bottom: 1em;
+.card-header-icon {
+ -webkit-box-align: center;
+ -ms-flex-align: center;
+ align-items: center;
+ cursor: pointer;
+ display: -webkit-box;
+ display: -ms-flexbox;
+ display: flex;
+ -webkit-box-pack: center;
+ -ms-flex-pack: center;
+ justify-content: center;
+ padding: 0.75rem;
}
-.message {
- background-color: whitesmoke;
- border-radius: 3px;
- font-size: 1rem;
+.card-image {
+ display: block;
+ position: relative;
}
-.message:not(:last-child) {
- margin-bottom: 1.5rem;
+.card-content {
+ padding: 1.5rem;
}
-.message.is-small {
- font-size: 0.75rem;
+.card-footer {
+ border-top: 1px solid #dbdbdb;
+ -webkit-box-align: stretch;
+ -ms-flex-align: stretch;
+ align-items: stretch;
+ display: -webkit-box;
+ display: -ms-flexbox;
+ display: flex;
}
-.message.is-medium {
- font-size: 1.25rem;
+.card-footer-item {
+ -webkit-box-align: center;
+ -ms-flex-align: center;
+ align-items: center;
+ display: -webkit-box;
+ display: -ms-flexbox;
+ display: flex;
+ -ms-flex-preferred-size: 0;
+ flex-basis: 0;
+ -webkit-box-flex: 1;
+ -ms-flex-positive: 1;
+ flex-grow: 1;
+ -ms-flex-negative: 0;
+ flex-shrink: 0;
+ -webkit-box-pack: center;
+ -ms-flex-pack: center;
+ justify-content: center;
+ padding: 0.75rem;
}
-.message.is-large {
- font-size: 1.5rem;
+.card-footer-item:not(:last-child) {
+ border-right: 1px solid #dbdbdb;
}
-.message.is-white {
- background-color: white;
+.card .media:not(:last-child) {
+ margin-bottom: 0.75rem;
}
-.message.is-white .message-header {
- background-color: white;
- color: #0a0a0a;
+.dropdown {
+ display: -webkit-inline-box;
+ display: -ms-inline-flexbox;
+ display: inline-flex;
+ position: relative;
+ vertical-align: top;
}
-.message.is-white .message-body {
- border-color: white;
- color: #4d4d4d;
+.dropdown.is-active .dropdown-menu, .dropdown.is-hoverable:hover .dropdown-menu {
+ display: block;
}
-.message.is-black {
- background-color: #fafafa;
+.dropdown.is-right .dropdown-menu {
+ left: auto;
+ right: 0;
}
-.message.is-black .message-header {
- background-color: #0a0a0a;
- color: white;
+.dropdown-menu {
+ display: none;
+ left: 0;
+ min-width: 12rem;
+ padding-top: 4px;
+ position: absolute;
+ top: 100%;
+ z-index: 20;
}
-.message.is-black .message-body {
- border-color: #0a0a0a;
- color: #090909;
+.dropdown-content {
+ background-color: white;
+ border-radius: 3px;
+ -webkit-box-shadow: 0 2px 3px rgba(10, 10, 10, 0.1), 0 0 0 1px rgba(10, 10, 10, 0.1);
+ box-shadow: 0 2px 3px rgba(10, 10, 10, 0.1), 0 0 0 1px rgba(10, 10, 10, 0.1);
+ padding-bottom: 0.5rem;
+ padding-top: 0.5rem;
}
-.message.is-light {
- background-color: #fafafa;
+.dropdown-item {
+ color: #4a4a4a;
+ display: block;
+ font-size: 0.875rem;
+ line-height: 1.5;
+ padding: 0.375rem 1rem;
+ position: relative;
}
-.message.is-light .message-header {
- background-color: whitesmoke;
- color: #363636;
+a.dropdown-item {
+ padding-right: 3rem;
+ white-space: nowrap;
}
-.message.is-light .message-body {
- border-color: whitesmoke;
- color: #505050;
+a.dropdown-item:hover {
+ background-color: whitesmoke;
+ color: #0a0a0a;
}
-.message.is-dark {
- background-color: #fafafa;
+a.dropdown-item.is-active {
+ background-color: #00d1b2;
+ color: #fff;
}
-.message.is-dark .message-header {
- background-color: #363636;
- color: whitesmoke;
+.dropdown-divider {
+ background-color: #dbdbdb;
+ border: none;
+ display: block;
+ height: 1px;
+ margin: 0.5rem 0;
}
-.message.is-dark .message-body {
- border-color: #363636;
- color: #2a2a2a;
+.level {
+ -webkit-box-align: center;
+ -ms-flex-align: center;
+ align-items: center;
+ -webkit-box-pack: justify;
+ -ms-flex-pack: justify;
+ justify-content: space-between;
}
-.message.is-primary {
- background-color: #f5fffd;
+.level:not(:last-child) {
+ margin-bottom: 1.5rem;
}
-.message.is-primary .message-header {
- background-color: #00d1b2;
- color: #fff;
+.level code {
+ border-radius: 3px;
}
-.message.is-primary .message-body {
- border-color: #00d1b2;
- color: #021310;
+.level img {
+ display: inline-block;
+ vertical-align: top;
}
-.message.is-info {
- background-color: #f6f9fe;
+.level.is-mobile {
+ display: -webkit-box;
+ display: -ms-flexbox;
+ display: flex;
}
-.message.is-info .message-header {
- background-color: #3273dc;
- color: #fff;
+.level.is-mobile .level-left,
+.level.is-mobile .level-right {
+ display: -webkit-box;
+ display: -ms-flexbox;
+ display: flex;
}
-.message.is-info .message-body {
- border-color: #3273dc;
- color: #22509a;
+.level.is-mobile .level-left + .level-right {
+ margin-top: 0;
}
-.message.is-success {
- background-color: #f6fef9;
+.level.is-mobile .level-item:not(:last-child) {
+ margin-bottom: 0;
}
-.message.is-success .message-header {
- background-color: #23d160;
- color: #fff;
+.level.is-mobile .level-item:not(.is-narrow) {
+ -webkit-box-flex: 1;
+ -ms-flex-positive: 1;
+ flex-grow: 1;
}
-.message.is-success .message-body {
- border-color: #23d160;
- color: #0e301a;
-}
-
-.message.is-warning {
- background-color: #fffdf5;
-}
-
-.message.is-warning .message-header {
- background-color: #ffdd57;
- color: rgba(0, 0, 0, 0.7);
-}
-
-.message.is-warning .message-body {
- border-color: #ffdd57;
- color: #3b3108;
-}
-
-.message.is-danger {
- background-color: #fff5f7;
-}
-
-.message.is-danger .message-header {
- background-color: #ff3860;
- color: #fff;
-}
-
-.message.is-danger .message-body {
- border-color: #ff3860;
- color: #cd0930;
+@media screen and (min-width: 769px), print {
+ .level {
+ display: -webkit-box;
+ display: -ms-flexbox;
+ display: flex;
+ }
+ .level > .level-item:not(.is-narrow) {
+ -webkit-box-flex: 1;
+ -ms-flex-positive: 1;
+ flex-grow: 1;
+ }
}
-.message-header {
+.level-item {
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
- background-color: #4a4a4a;
- border-radius: 3px 3px 0 0;
- color: #fff;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
- -webkit-box-pack: justify;
- -ms-flex-pack: justify;
- justify-content: space-between;
- line-height: 1.25;
- padding: 0.5em 0.75em;
- position: relative;
+ -ms-flex-preferred-size: auto;
+ flex-basis: auto;
+ -webkit-box-flex: 0;
+ -ms-flex-positive: 0;
+ flex-grow: 0;
+ -ms-flex-negative: 0;
+ flex-shrink: 0;
+ -webkit-box-pack: center;
+ -ms-flex-pack: center;
+ justify-content: center;
}
-.message-header a:not(.button),
-.message-header strong {
- color: currentColor;
+.level-item .title,
+.level-item .subtitle {
+ margin-bottom: 0;
}
-.message-header a:not(.button) {
- text-decoration: underline;
+@media screen and (max-width: 768px) {
+ .level-item:not(:last-child) {
+ margin-bottom: 0.75rem;
+ }
}
-.message-header .delete {
+.level-left,
+.level-right {
+ -ms-flex-preferred-size: auto;
+ flex-basis: auto;
-webkit-box-flex: 0;
-ms-flex-positive: 0;
flex-grow: 0;
-ms-flex-negative: 0;
flex-shrink: 0;
- margin-left: 0.75em;
-}
-
-.message-header + .message-body {
- border-top-left-radius: 0;
- border-top-right-radius: 0;
- border-top: none;
}
-.message-body {
- border: 1px solid #dbdbdb;
- border-radius: 3px;
- color: #4a4a4a;
- padding: 1em 1.25em;
+.level-left .level-item:not(:last-child),
+.level-right .level-item:not(:last-child) {
+ margin-right: 0.75rem;
}
-.message-body a:not(.button),
-.message-body strong {
- color: currentColor;
+.level-left .level-item.is-flexible,
+.level-right .level-item.is-flexible {
+ -webkit-box-flex: 1;
+ -ms-flex-positive: 1;
+ flex-grow: 1;
}
-.message-body a:not(.button) {
- text-decoration: underline;
+.level-left {
+ -webkit-box-align: center;
+ -ms-flex-align: center;
+ align-items: center;
+ -webkit-box-pack: start;
+ -ms-flex-pack: start;
+ justify-content: flex-start;
}
-.message-body code,
-.message-body pre {
- background-color: white;
+@media screen and (max-width: 768px) {
+ .level-left + .level-right {
+ margin-top: 1.5rem;
+ }
}
-.message-body pre code {
- background-color: transparent;
+@media screen and (min-width: 769px), print {
+ .level-left {
+ display: -webkit-box;
+ display: -ms-flexbox;
+ display: flex;
+ }
}
-.modal {
- bottom: 0;
- left: 0;
- position: absolute;
- right: 0;
- top: 0;
+.level-right {
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
- display: none;
- -webkit-box-pack: center;
- -ms-flex-pack: center;
- justify-content: center;
- overflow: hidden;
- position: fixed;
- z-index: 20;
+ -webkit-box-pack: end;
+ -ms-flex-pack: end;
+ justify-content: flex-end;
}
-.modal.is-active {
+@media screen and (min-width: 769px), print {
+ .level-right {
+ display: -webkit-box;
+ display: -ms-flexbox;
+ display: flex;
+ }
+}
+
+.media {
+ -webkit-box-align: start;
+ -ms-flex-align: start;
+ align-items: flex-start;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
+ text-align: left;
}
-.modal-background {
- bottom: 0;
- left: 0;
- position: absolute;
- right: 0;
- top: 0;
- background-color: rgba(10, 10, 10, 0.86);
+.media .content:not(:last-child) {
+ margin-bottom: 0.75rem;
}
-.modal-content,
-.modal-card {
- margin: 0 20px;
- max-height: calc(100vh - 160px);
- overflow: auto;
- position: relative;
- width: 100%;
+.media .media {
+ border-top: 1px solid rgba(219, 219, 219, 0.5);
+ display: -webkit-box;
+ display: -ms-flexbox;
+ display: flex;
+ padding-top: 0.75rem;
}
-@media screen and (min-width: 769px), print {
- .modal-content,
- .modal-card {
- margin: 0 auto;
- max-height: calc(100vh - 40px);
- width: 640px;
- }
+.media .media .content:not(:last-child),
+.media .media .control:not(:last-child) {
+ margin-bottom: 0.5rem;
}
-.modal-close {
- -webkit-touch-callout: none;
- -webkit-user-select: none;
- -moz-user-select: none;
- -ms-user-select: none;
- user-select: none;
- -moz-appearance: none;
- -webkit-appearance: none;
- background-color: rgba(10, 10, 10, 0.2);
- border: none;
- border-radius: 290486px;
- cursor: pointer;
- display: inline-block;
+.media .media .media {
+ padding-top: 0.5rem;
+}
+
+.media .media .media + .media {
+ margin-top: 0.5rem;
+}
+
+.media + .media {
+ border-top: 1px solid rgba(219, 219, 219, 0.5);
+ margin-top: 1rem;
+ padding-top: 1rem;
+}
+
+.media.is-large + .media {
+ margin-top: 1.5rem;
+ padding-top: 1.5rem;
+}
+
+.media-left,
+.media-right {
+ -ms-flex-preferred-size: auto;
+ flex-basis: auto;
-webkit-box-flex: 0;
-ms-flex-positive: 0;
flex-grow: 0;
-ms-flex-negative: 0;
flex-shrink: 0;
- font-size: 1rem;
- height: 20px;
- max-height: 20px;
- max-width: 20px;
- min-height: 20px;
- min-width: 20px;
- outline: none;
- position: relative;
- vertical-align: top;
- width: 20px;
- background: none;
- height: 40px;
- position: fixed;
- right: 20px;
- top: 20px;
- width: 40px;
}
-.modal-close:before, .modal-close:after {
- background-color: white;
- content: "";
- display: block;
- left: 50%;
- position: absolute;
- top: 50%;
- -webkit-transform: translateX(-50%) translateY(-50%) rotate(45deg);
- transform: translateX(-50%) translateY(-50%) rotate(45deg);
- -webkit-transform-origin: center center;
- transform-origin: center center;
+.media-left {
+ margin-right: 1rem;
}
-.modal-close:before {
- height: 2px;
- width: 50%;
+.media-right {
+ margin-left: 1rem;
}
-.modal-close:after {
- height: 50%;
- width: 2px;
+.media-content {
+ -ms-flex-preferred-size: auto;
+ flex-basis: auto;
+ -webkit-box-flex: 1;
+ -ms-flex-positive: 1;
+ flex-grow: 1;
+ -ms-flex-negative: 1;
+ flex-shrink: 1;
+ text-align: left;
}
-.modal-close:hover, .modal-close:focus {
- background-color: rgba(10, 10, 10, 0.3);
+.menu {
+ font-size: 1rem;
}
-.modal-close:active {
- background-color: rgba(10, 10, 10, 0.4);
+.menu.is-small {
+ font-size: 0.75rem;
}
-.modal-close.is-small {
- height: 16px;
- max-height: 16px;
- max-width: 16px;
- min-height: 16px;
- min-width: 16px;
- width: 16px;
+.menu.is-medium {
+ font-size: 1.25rem;
}
-.modal-close.is-medium {
- height: 24px;
- max-height: 24px;
- max-width: 24px;
- min-height: 24px;
- min-width: 24px;
- width: 24px;
+.menu.is-large {
+ font-size: 1.5rem;
}
-.modal-close.is-large {
- height: 32px;
- max-height: 32px;
- max-width: 32px;
- min-height: 32px;
- min-width: 32px;
- width: 32px;
+.menu-list {
+ line-height: 1.25;
}
-.modal-card {
- display: -webkit-box;
- display: -ms-flexbox;
- display: flex;
- -webkit-box-orient: vertical;
- -webkit-box-direction: normal;
- -ms-flex-direction: column;
- flex-direction: column;
- max-height: calc(100vh - 40px);
- overflow: hidden;
+.menu-list a {
+ border-radius: 2px;
+ color: #4a4a4a;
+ display: block;
+ padding: 0.5em 0.75em;
}
-.modal-card-head,
-.modal-card-foot {
- -webkit-box-align: center;
- -ms-flex-align: center;
- align-items: center;
+.menu-list a:hover {
background-color: whitesmoke;
- display: -webkit-box;
- display: -ms-flexbox;
- display: flex;
- -ms-flex-negative: 0;
- flex-shrink: 0;
- -webkit-box-pack: start;
- -ms-flex-pack: start;
- justify-content: flex-start;
- padding: 20px;
- position: relative;
+ color: #363636;
}
-.modal-card-head {
- border-bottom: 1px solid #dbdbdb;
- border-top-left-radius: 5px;
- border-top-right-radius: 5px;
+.menu-list a.is-active {
+ background-color: #00d1b2;
+ color: #fff;
}
-.modal-card-title {
- color: #363636;
- -webkit-box-flex: 1;
- -ms-flex-positive: 1;
- flex-grow: 1;
- -ms-flex-negative: 0;
- flex-shrink: 0;
- font-size: 1.5rem;
- line-height: 1;
+.menu-list li ul {
+ border-left: 1px solid #dbdbdb;
+ margin: 0.75em;
+ padding-left: 0.75em;
}
-.modal-card-foot {
- border-bottom-left-radius: 5px;
- border-bottom-right-radius: 5px;
- border-top: 1px solid #dbdbdb;
+.menu-label {
+ color: #7a7a7a;
+ font-size: 0.75em;
+ letter-spacing: 0.1em;
+ text-transform: uppercase;
}
-.modal-card-foot .button:not(:last-child) {
- margin-right: 10px;
+.menu-label:not(:first-child) {
+ margin-top: 1em;
}
-.modal-card-body {
- -webkit-overflow-scrolling: touch;
- background-color: white;
- -webkit-box-flex: 1;
- -ms-flex-positive: 1;
- flex-grow: 1;
- -ms-flex-negative: 1;
- flex-shrink: 1;
- overflow: auto;
- padding: 20px;
+.menu-label:not(:last-child) {
+ margin-bottom: 1em;
}
-.nav-toggle {
- cursor: pointer;
- display: block;
- height: 3.25rem;
- position: relative;
- width: 3.25rem;
+.message {
+ background-color: whitesmoke;
+ border-radius: 3px;
+ font-size: 1rem;
}
-.nav-toggle span {
- background-color: #4a4a4a;
- display: block;
- height: 1px;
- left: 50%;
- margin-left: -7px;
- position: absolute;
- top: 50%;
- -webkit-transition: none 86ms ease-out;
- transition: none 86ms ease-out;
- -webkit-transition-property: background, left, opacity, -webkit-transform;
- transition-property: background, left, opacity, -webkit-transform;
- transition-property: background, left, opacity, transform;
- transition-property: background, left, opacity, transform, -webkit-transform;
- width: 15px;
+.message:not(:last-child) {
+ margin-bottom: 1.5rem;
}
-.nav-toggle span:nth-child(1) {
- margin-top: -6px;
+.message.is-small {
+ font-size: 0.75rem;
}
-.nav-toggle span:nth-child(2) {
- margin-top: -1px;
+.message.is-medium {
+ font-size: 1.25rem;
}
-.nav-toggle span:nth-child(3) {
- margin-top: 4px;
+.message.is-large {
+ font-size: 1.5rem;
}
-.nav-toggle:hover {
- background-color: whitesmoke;
+.message.is-white {
+ background-color: white;
}
-.nav-toggle.is-active span {
- background-color: #00d1b2;
+.message.is-white .message-header {
+ background-color: white;
+ color: #0a0a0a;
}
-.nav-toggle.is-active span:nth-child(1) {
- margin-left: -5px;
- -webkit-transform: rotate(45deg);
- transform: rotate(45deg);
- -webkit-transform-origin: left top;
- transform-origin: left top;
+.message.is-white .message-body {
+ border-color: white;
+ color: #4d4d4d;
}
-.nav-toggle.is-active span:nth-child(2) {
- opacity: 0;
+.message.is-black {
+ background-color: #fafafa;
}
-.nav-toggle.is-active span:nth-child(3) {
- margin-left: -5px;
- -webkit-transform: rotate(-45deg);
- transform: rotate(-45deg);
- -webkit-transform-origin: left bottom;
- transform-origin: left bottom;
+.message.is-black .message-header {
+ background-color: #0a0a0a;
+ color: white;
}
-@media screen and (min-width: 769px), print {
- .nav-toggle {
- display: none;
- }
+.message.is-black .message-body {
+ border-color: #0a0a0a;
+ color: #090909;
}
-.nav-item {
- -webkit-box-align: center;
- -ms-flex-align: center;
- align-items: center;
- display: -webkit-box;
- display: -ms-flexbox;
- display: flex;
- -webkit-box-flex: 0;
- -ms-flex-positive: 0;
- flex-grow: 0;
- -ms-flex-negative: 0;
- flex-shrink: 0;
- font-size: 1rem;
- -webkit-box-pack: center;
- -ms-flex-pack: center;
- justify-content: center;
- line-height: 1.5;
- padding: 0.5rem 0.75rem;
+.message.is-light {
+ background-color: #fafafa;
}
-.nav-item a {
- -webkit-box-flex: 1;
- -ms-flex-positive: 1;
- flex-grow: 1;
- -ms-flex-negative: 0;
- flex-shrink: 0;
+.message.is-light .message-header {
+ background-color: whitesmoke;
+ color: #363636;
}
-.nav-item img {
- max-height: 1.75rem;
+.message.is-light .message-body {
+ border-color: whitesmoke;
+ color: #505050;
}
-.nav-item .tag:first-child:not(:last-child) {
- margin-right: 0.5rem;
+.message.is-dark {
+ background-color: #fafafa;
}
-.nav-item .tag:last-child:not(:first-child) {
- margin-left: 0.5rem;
+.message.is-dark .message-header {
+ background-color: #363636;
+ color: whitesmoke;
}
-@media screen and (max-width: 768px) {
- .nav-item {
- -webkit-box-pack: start;
- -ms-flex-pack: start;
- justify-content: flex-start;
- }
+.message.is-dark .message-body {
+ border-color: #363636;
+ color: #2a2a2a;
}
-.nav-item a:not(.button),
-a.nav-item:not(.button) {
- color: #7a7a7a;
+.message.is-primary {
+ background-color: #f5fffd;
}
-.nav-item a:not(.button):hover,
-a.nav-item:not(.button):hover {
- color: #363636;
+.message.is-primary .message-header {
+ background-color: #00d1b2;
+ color: #fff;
}
-.nav-item a:not(.button).is-active,
-a.nav-item:not(.button).is-active {
- color: #363636;
+.message.is-primary .message-body {
+ border-color: #00d1b2;
+ color: #021310;
}
-.nav-item a:not(.button).is-tab,
-a.nav-item:not(.button).is-tab {
- border-bottom: 1px solid transparent;
- border-top: 1px solid transparent;
- padding-bottom: calc(0.75rem - 1px);
- padding-left: 1rem;
- padding-right: 1rem;
- padding-top: calc(0.75rem - 1px);
+.message.is-info {
+ background-color: #f6f9fe;
}
-.nav-item a:not(.button).is-tab:hover,
-a.nav-item:not(.button).is-tab:hover {
- border-bottom-color: #00d1b2;
- border-top-color: transparent;
+.message.is-info .message-header {
+ background-color: #3273dc;
+ color: #fff;
}
-.nav-item a:not(.button).is-tab.is-active,
-a.nav-item:not(.button).is-tab.is-active {
- border-bottom: 3px solid #00d1b2;
- color: #00d1b2;
- padding-bottom: calc(0.75rem - 3px);
+.message.is-info .message-body {
+ border-color: #3273dc;
+ color: #22509a;
}
-@media screen and (min-width: 1008px) {
- .nav-item a:not(.button).is-brand,
- a.nav-item:not(.button).is-brand {
- padding-left: 0;
- }
+.message.is-success {
+ background-color: #f6fef9;
}
-.nav-left,
-.nav-right {
- -webkit-overflow-scrolling: touch;
- -webkit-box-align: stretch;
- -ms-flex-align: stretch;
- align-items: stretch;
- display: -webkit-box;
- display: -ms-flexbox;
- display: flex;
- -webkit-box-flex: 1;
- -ms-flex-positive: 1;
- flex-grow: 1;
- -ms-flex-negative: 0;
- flex-shrink: 0;
- max-width: 100%;
- overflow: auto;
+.message.is-success .message-header {
+ background-color: #23d160;
+ color: #fff;
}
-@media screen and (min-width: 1200px) {
- .nav-left,
- .nav-right {
- -ms-flex-preferred-size: 0;
- flex-basis: 0;
- }
+.message.is-success .message-body {
+ border-color: #23d160;
+ color: #0e301a;
}
-.nav-left {
- -webkit-box-pack: start;
- -ms-flex-pack: start;
- justify-content: flex-start;
- white-space: nowrap;
+.message.is-warning {
+ background-color: #fffdf5;
}
-.nav-right {
- -webkit-box-pack: end;
- -ms-flex-pack: end;
- justify-content: flex-end;
+.message.is-warning .message-header {
+ background-color: #ffdd57;
+ color: rgba(0, 0, 0, 0.7);
}
-.nav-center {
- -webkit-box-align: stretch;
- -ms-flex-align: stretch;
- align-items: stretch;
+.message.is-warning .message-body {
+ border-color: #ffdd57;
+ color: #3b3108;
+}
+
+.message.is-danger {
+ background-color: #fff5f7;
+}
+
+.message.is-danger .message-header {
+ background-color: #ff3860;
+ color: #fff;
+}
+
+.message.is-danger .message-body {
+ border-color: #ff3860;
+ color: #cd0930;
+}
+
+.message-header {
+ -webkit-box-align: center;
+ -ms-flex-align: center;
+ align-items: center;
+ background-color: #4a4a4a;
+ border-radius: 3px 3px 0 0;
+ color: #fff;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
+ -webkit-box-pack: justify;
+ -ms-flex-pack: justify;
+ justify-content: space-between;
+ line-height: 1.25;
+ padding: 0.5em 0.75em;
+ position: relative;
+}
+
+.message-header a:not(.button),
+.message-header strong {
+ color: currentColor;
+}
+
+.message-header a:not(.button) {
+ text-decoration: underline;
+}
+
+.message-header .delete {
-webkit-box-flex: 0;
-ms-flex-positive: 0;
flex-grow: 0;
-ms-flex-negative: 0;
flex-shrink: 0;
- -webkit-box-pack: center;
- -ms-flex-pack: center;
- justify-content: center;
- margin-left: auto;
- margin-right: auto;
+ margin-left: 0.75em;
}
-@media screen and (max-width: 768px) {
- .nav-menu.nav-right {
- background-color: white;
- -webkit-box-shadow: 0 4px 7px rgba(10, 10, 10, 0.1);
- box-shadow: 0 4px 7px rgba(10, 10, 10, 0.1);
- left: 0;
- display: none;
- right: 0;
- top: 100%;
- position: absolute;
- }
- .nav-menu.nav-right .nav-item {
- border-top: 1px solid rgba(219, 219, 219, 0.5);
- padding: 0.75rem;
- }
- .nav-menu.nav-right.is-active {
- display: block;
- }
+.message-header + .message-body {
+ border-top-left-radius: 0;
+ border-top-right-radius: 0;
+ border-top: none;
}
-.nav {
- -webkit-box-align: stretch;
- -ms-flex-align: stretch;
- align-items: stretch;
- background-color: white;
- display: -webkit-box;
- display: -ms-flexbox;
- display: flex;
- height: 3.25rem;
- position: relative;
- text-align: center;
- z-index: 10;
+.message-body {
+ border: 1px solid #dbdbdb;
+ border-radius: 3px;
+ color: #4a4a4a;
+ padding: 1em 1.25em;
}
-.nav > .container {
- -webkit-box-align: stretch;
- -ms-flex-align: stretch;
- align-items: stretch;
- display: -webkit-box;
- display: -ms-flexbox;
- display: flex;
- min-height: 3.25rem;
- width: 100%;
+.message-body a:not(.button),
+.message-body strong {
+ color: currentColor;
}
-.nav.has-shadow {
- -webkit-box-shadow: 0 2px 3px rgba(10, 10, 10, 0.1);
- box-shadow: 0 2px 3px rgba(10, 10, 10, 0.1);
+.message-body a:not(.button) {
+ text-decoration: underline;
}
-.navbar {
+.message-body code,
+.message-body pre {
background-color: white;
- min-height: 3.25rem;
- position: relative;
}
-.navbar > .container {
- -webkit-box-align: stretch;
- -ms-flex-align: stretch;
- align-items: stretch;
- display: -webkit-box;
- display: -ms-flexbox;
- display: flex;
- min-height: 3.25rem;
- width: 100%;
+.message-body pre code {
+ background-color: transparent;
}
-.navbar.has-shadow {
- -webkit-box-shadow: 0 2px 3px rgba(10, 10, 10, 0.1);
- box-shadow: 0 2px 3px rgba(10, 10, 10, 0.1);
+.modal {
+ bottom: 0;
+ left: 0;
+ position: absolute;
+ right: 0;
+ top: 0;
+ -webkit-box-align: center;
+ -ms-flex-align: center;
+ align-items: center;
+ display: none;
+ -webkit-box-pack: center;
+ -ms-flex-pack: center;
+ justify-content: center;
+ overflow: hidden;
+ position: fixed;
+ z-index: 20;
}
-.navbar-brand {
- -webkit-overflow-scrolling: touch;
- -webkit-box-align: stretch;
- -ms-flex-align: stretch;
- align-items: stretch;
+.modal.is-active {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
- min-height: 3.25rem;
- overflow-x: auto;
- overflow-y: hidden;
-}
-
-.navbar-burger {
- cursor: pointer;
- display: block;
- height: 3.25rem;
- position: relative;
- width: 3.25rem;
- margin-left: auto;
}
-.navbar-burger span {
- background-color: #4a4a4a;
- display: block;
+.modal-background {
+ bottom: 0;
+ left: 0;
+ position: absolute;
+ right: 0;
+ top: 0;
+ background-color: rgba(10, 10, 10, 0.86);
+}
+
+.modal-content,
+.modal-card {
+ margin: 0 20px;
+ max-height: calc(100vh - 160px);
+ overflow: auto;
+ position: relative;
+ width: 100%;
+}
+
+@media screen and (min-width: 769px), print {
+ .modal-content,
+ .modal-card {
+ margin: 0 auto;
+ max-height: calc(100vh - 40px);
+ width: 640px;
+ }
+}
+
+.modal-close {
+ -webkit-touch-callout: none;
+ -webkit-user-select: none;
+ -moz-user-select: none;
+ -ms-user-select: none;
+ user-select: none;
+ -moz-appearance: none;
+ -webkit-appearance: none;
+ background-color: rgba(10, 10, 10, 0.2);
+ border: none;
+ border-radius: 290486px;
+ cursor: pointer;
+ display: inline-block;
+ -webkit-box-flex: 0;
+ -ms-flex-positive: 0;
+ flex-grow: 0;
+ -ms-flex-negative: 0;
+ flex-shrink: 0;
+ font-size: 1rem;
+ height: 20px;
+ max-height: 20px;
+ max-width: 20px;
+ min-height: 20px;
+ min-width: 20px;
+ outline: none;
+ position: relative;
+ vertical-align: top;
+ width: 20px;
+ background: none;
+ height: 40px;
+ position: fixed;
+ right: 20px;
+ top: 20px;
+ width: 40px;
+}
+
+.modal-close:before, .modal-close:after {
+ background-color: white;
+ content: "";
+ display: block;
+ left: 50%;
+ position: absolute;
+ top: 50%;
+ -webkit-transform: translateX(-50%) translateY(-50%) rotate(45deg);
+ transform: translateX(-50%) translateY(-50%) rotate(45deg);
+ -webkit-transform-origin: center center;
+ transform-origin: center center;
+}
+
+.modal-close:before {
+ height: 2px;
+ width: 50%;
+}
+
+.modal-close:after {
+ height: 50%;
+ width: 2px;
+}
+
+.modal-close:hover, .modal-close:focus {
+ background-color: rgba(10, 10, 10, 0.3);
+}
+
+.modal-close:active {
+ background-color: rgba(10, 10, 10, 0.4);
+}
+
+.modal-close.is-small {
+ height: 16px;
+ max-height: 16px;
+ max-width: 16px;
+ min-height: 16px;
+ min-width: 16px;
+ width: 16px;
+}
+
+.modal-close.is-medium {
+ height: 24px;
+ max-height: 24px;
+ max-width: 24px;
+ min-height: 24px;
+ min-width: 24px;
+ width: 24px;
+}
+
+.modal-close.is-large {
+ height: 32px;
+ max-height: 32px;
+ max-width: 32px;
+ min-height: 32px;
+ min-width: 32px;
+ width: 32px;
+}
+
+.modal-card {
+ display: -webkit-box;
+ display: -ms-flexbox;
+ display: flex;
+ -webkit-box-orient: vertical;
+ -webkit-box-direction: normal;
+ -ms-flex-direction: column;
+ flex-direction: column;
+ max-height: calc(100vh - 40px);
+ overflow: hidden;
+}
+
+.modal-card-head,
+.modal-card-foot {
+ -webkit-box-align: center;
+ -ms-flex-align: center;
+ align-items: center;
+ background-color: whitesmoke;
+ display: -webkit-box;
+ display: -ms-flexbox;
+ display: flex;
+ -ms-flex-negative: 0;
+ flex-shrink: 0;
+ -webkit-box-pack: start;
+ -ms-flex-pack: start;
+ justify-content: flex-start;
+ padding: 20px;
+ position: relative;
+}
+
+.modal-card-head {
+ border-bottom: 1px solid #dbdbdb;
+ border-top-left-radius: 5px;
+ border-top-right-radius: 5px;
+}
+
+.modal-card-title {
+ color: #363636;
+ -webkit-box-flex: 1;
+ -ms-flex-positive: 1;
+ flex-grow: 1;
+ -ms-flex-negative: 0;
+ flex-shrink: 0;
+ font-size: 1.5rem;
+ line-height: 1;
+}
+
+.modal-card-foot {
+ border-bottom-left-radius: 5px;
+ border-bottom-right-radius: 5px;
+ border-top: 1px solid #dbdbdb;
+}
+
+.modal-card-foot .button:not(:last-child) {
+ margin-right: 10px;
+}
+
+.modal-card-body {
+ -webkit-overflow-scrolling: touch;
+ background-color: white;
+ -webkit-box-flex: 1;
+ -ms-flex-positive: 1;
+ flex-grow: 1;
+ -ms-flex-negative: 1;
+ flex-shrink: 1;
+ overflow: auto;
+ padding: 20px;
+}
+
+.nav-toggle {
+ cursor: pointer;
+ display: block;
+ height: 3.25rem;
+ position: relative;
+ width: 3.25rem;
+}
+
+.nav-toggle span {
+ background-color: #4a4a4a;
+ display: block;
height: 1px;
left: 50%;
margin-left: -7px;
@@ -5379,27 +5842,27 @@ a.nav-item:not(.button).is-tab.is-active {
width: 15px;
}
-.navbar-burger span:nth-child(1) {
+.nav-toggle span:nth-child(1) {
margin-top: -6px;
}
-.navbar-burger span:nth-child(2) {
+.nav-toggle span:nth-child(2) {
margin-top: -1px;
}
-.navbar-burger span:nth-child(3) {
+.nav-toggle span:nth-child(3) {
margin-top: 4px;
}
-.navbar-burger:hover {
+.nav-toggle:hover {
background-color: whitesmoke;
}
-.navbar-burger.is-active span {
+.nav-toggle.is-active span {
background-color: #00d1b2;
}
-.navbar-burger.is-active span:nth-child(1) {
+.nav-toggle.is-active span:nth-child(1) {
margin-left: -5px;
-webkit-transform: rotate(45deg);
transform: rotate(45deg);
@@ -5407,11 +5870,11 @@ a.nav-item:not(.button).is-tab.is-active {
transform-origin: left top;
}
-.navbar-burger.is-active span:nth-child(2) {
+.nav-toggle.is-active span:nth-child(2) {
opacity: 0;
}
-.navbar-burger.is-active span:nth-child(3) {
+.nav-toggle.is-active span:nth-child(3) {
margin-left: -5px;
-webkit-transform: rotate(-45deg);
transform: rotate(-45deg);
@@ -5419,989 +5882,1307 @@ a.nav-item:not(.button).is-tab.is-active {
transform-origin: left bottom;
}
-.navbar-menu {
- display: none;
-}
-
-.navbar-item,
-.navbar-link {
- color: #4a4a4a;
- display: block;
- line-height: 1.5;
- padding: 0.5rem 1rem;
- position: relative;
-}
-
-a.navbar-item:hover, a.navbar-item.is-active,
-.navbar-link:hover,
-.navbar-link.is-active {
- background-color: whitesmoke;
- color: #0a0a0a;
+@media screen and (min-width: 769px), print {
+ .nav-toggle {
+ display: none;
+ }
}
-.navbar-item {
+.nav-item {
+ -webkit-box-align: center;
+ -ms-flex-align: center;
+ align-items: center;
+ display: -webkit-box;
+ display: -ms-flexbox;
+ display: flex;
-webkit-box-flex: 0;
-ms-flex-positive: 0;
flex-grow: 0;
-ms-flex-negative: 0;
flex-shrink: 0;
+ font-size: 1rem;
+ -webkit-box-pack: center;
+ -ms-flex-pack: center;
+ justify-content: center;
+ line-height: 1.5;
+ padding: 0.5rem 0.75rem;
}
-.navbar-item img {
- max-height: 1.75rem;
-}
+.nav-item a {
+ -webkit-box-flex: 1;
+ -ms-flex-positive: 1;
+ flex-grow: 1;
+ -ms-flex-negative: 0;
+ flex-shrink: 0;
+}
-.navbar-item.has-dropdown {
- padding: 0;
+.nav-item img {
+ max-height: 1.75rem;
}
-.navbar-item.is-tab {
+.nav-item .tag:first-child:not(:last-child) {
+ margin-right: 0.5rem;
+}
+
+.nav-item .tag:last-child:not(:first-child) {
+ margin-left: 0.5rem;
+}
+
+@media screen and (max-width: 768px) {
+ .nav-item {
+ -webkit-box-pack: start;
+ -ms-flex-pack: start;
+ justify-content: flex-start;
+ }
+}
+
+.nav-item a:not(.button),
+a.nav-item:not(.button) {
+ color: #7a7a7a;
+}
+
+.nav-item a:not(.button):hover,
+a.nav-item:not(.button):hover {
+ color: #363636;
+}
+
+.nav-item a:not(.button).is-active,
+a.nav-item:not(.button).is-active {
+ color: #363636;
+}
+
+.nav-item a:not(.button).is-tab,
+a.nav-item:not(.button).is-tab {
border-bottom: 1px solid transparent;
- min-height: 3.25rem;
- padding-bottom: calc(0.5rem - 1px);
+ border-top: 1px solid transparent;
+ padding-bottom: calc(0.75rem - 1px);
+ padding-left: 1rem;
+ padding-right: 1rem;
+ padding-top: calc(0.75rem - 1px);
}
-.navbar-item.is-tab:hover {
- background-color: transparent;
+.nav-item a:not(.button).is-tab:hover,
+a.nav-item:not(.button).is-tab:hover {
border-bottom-color: #00d1b2;
+ border-top-color: transparent;
}
-.navbar-item.is-tab.is-active {
- background-color: transparent;
- border-bottom-color: #00d1b2;
- border-bottom-style: solid;
- border-bottom-width: 3px;
+.nav-item a:not(.button).is-tab.is-active,
+a.nav-item:not(.button).is-tab.is-active {
+ border-bottom: 3px solid #00d1b2;
color: #00d1b2;
- padding-bottom: calc(0.5rem - 3px);
+ padding-bottom: calc(0.75rem - 3px);
}
-.navbar-content {
+@media screen and (min-width: 1008px) {
+ .nav-item a:not(.button).is-brand,
+ a.nav-item:not(.button).is-brand {
+ padding-left: 0;
+ }
+}
+
+.nav-left,
+.nav-right {
+ -webkit-overflow-scrolling: touch;
+ -webkit-box-align: stretch;
+ -ms-flex-align: stretch;
+ align-items: stretch;
+ display: -webkit-box;
+ display: -ms-flexbox;
+ display: flex;
-webkit-box-flex: 1;
-ms-flex-positive: 1;
flex-grow: 1;
- -ms-flex-negative: 1;
- flex-shrink: 1;
+ -ms-flex-negative: 0;
+ flex-shrink: 0;
+ max-width: 100%;
+ overflow: auto;
}
-.navbar-link {
- padding-right: 2.5em;
+@media screen and (min-width: 1200px) {
+ .nav-left,
+ .nav-right {
+ -ms-flex-preferred-size: 0;
+ flex-basis: 0;
+ }
}
-.navbar-dropdown {
- font-size: 0.875rem;
- padding-bottom: 0.5rem;
- padding-top: 0.5rem;
+.nav-left {
+ -webkit-box-pack: start;
+ -ms-flex-pack: start;
+ justify-content: flex-start;
+ white-space: nowrap;
}
-.navbar-dropdown .navbar-item {
- padding-left: 1.5rem;
- padding-right: 1.5rem;
+.nav-right {
+ -webkit-box-pack: end;
+ -ms-flex-pack: end;
+ justify-content: flex-end;
}
-.navbar-divider {
- background-color: #dbdbdb;
- border: none;
- display: none;
- height: 1px;
- margin: 0.5rem 0;
+.nav-center {
+ -webkit-box-align: stretch;
+ -ms-flex-align: stretch;
+ align-items: stretch;
+ display: -webkit-box;
+ display: -ms-flexbox;
+ display: flex;
+ -webkit-box-flex: 0;
+ -ms-flex-positive: 0;
+ flex-grow: 0;
+ -ms-flex-negative: 0;
+ flex-shrink: 0;
+ -webkit-box-pack: center;
+ -ms-flex-pack: center;
+ justify-content: center;
+ margin-left: auto;
+ margin-right: auto;
}
-@media screen and (max-width: 1007px) {
- .navbar-brand .navbar-item {
- -webkit-box-align: center;
- -ms-flex-align: center;
- align-items: center;
- display: -webkit-box;
- display: -ms-flexbox;
- display: flex;
+@media screen and (max-width: 768px) {
+ .nav-menu.nav-right {
+ background-color: white;
+ -webkit-box-shadow: 0 4px 7px rgba(10, 10, 10, 0.1);
+ box-shadow: 0 4px 7px rgba(10, 10, 10, 0.1);
+ left: 0;
+ display: none;
+ right: 0;
+ top: 100%;
+ position: absolute;
}
- .navbar-menu {
- -webkit-box-shadow: 0 8px 16px rgba(10, 10, 10, 0.1);
- box-shadow: 0 8px 16px rgba(10, 10, 10, 0.1);
- padding: 0.5rem 0;
+ .nav-menu.nav-right .nav-item {
+ border-top: 1px solid rgba(219, 219, 219, 0.5);
+ padding: 0.75rem;
}
- .navbar-menu.is-active {
+ .nav-menu.nav-right.is-active {
display: block;
}
}
-@media screen and (min-width: 1008px) {
- .navbar,
- .navbar-menu,
- .navbar-start,
- .navbar-end {
- -webkit-box-align: stretch;
- -ms-flex-align: stretch;
- align-items: stretch;
- display: -webkit-box;
- display: -ms-flexbox;
- display: flex;
- }
- .navbar {
- min-height: 3.25rem;
- }
- .navbar.is-transparent a.navbar-item:hover, .navbar.is-transparent a.navbar-item.is-active,
- .navbar.is-transparent .navbar-link:hover,
- .navbar.is-transparent .navbar-link.is-active {
- background-color: transparent;
- }
- .navbar.is-transparent .navbar-item.has-dropdown.is-active .navbar-link, .navbar.is-transparent .navbar-item.has-dropdown.is-hoverable:hover .navbar-link {
- background-color: transparent;
- }
- .navbar.is-transparent .navbar-dropdown a.navbar-item:hover {
- background-color: whitesmoke;
- color: #0a0a0a;
- }
- .navbar.is-transparent .navbar-dropdown a.navbar-item.is-active {
- background-color: whitesmoke;
- color: #00d1b2;
- }
- .navbar-burger {
- display: none;
- }
- .navbar-item,
- .navbar-link {
- -webkit-box-align: center;
- -ms-flex-align: center;
- align-items: center;
- display: -webkit-box;
- display: -ms-flexbox;
- display: flex;
- }
- .navbar-item.has-dropdown {
- -webkit-box-align: stretch;
- -ms-flex-align: stretch;
- align-items: stretch;
- }
- .navbar-item.is-active .navbar-dropdown, .navbar-item.is-hoverable:hover .navbar-dropdown {
- display: block;
- }
- .navbar-item.is-active .navbar-dropdown.is-boxed, .navbar-item.is-hoverable:hover .navbar-dropdown.is-boxed {
- opacity: 1;
- pointer-events: auto;
- -webkit-transform: translateY(0);
- transform: translateY(0);
- }
- .navbar-link::after {
- border: 1px solid #00d1b2;
- border-right: 0;
- border-top: 0;
- content: " ";
- display: block;
- height: 0.5em;
- pointer-events: none;
- position: absolute;
- -webkit-transform: rotate(-45deg);
- transform: rotate(-45deg);
- width: 0.5em;
- margin-top: -0.375em;
- right: 1.125em;
- top: 50%;
- }
- .navbar-menu {
- -webkit-box-flex: 1;
- -ms-flex-positive: 1;
- flex-grow: 1;
- -ms-flex-negative: 0;
- flex-shrink: 0;
- }
- .navbar-start {
- -webkit-box-pack: start;
- -ms-flex-pack: start;
- justify-content: flex-start;
- margin-right: auto;
- }
- .navbar-end {
- -webkit-box-pack: end;
- -ms-flex-pack: end;
- justify-content: flex-end;
- margin-left: auto;
- }
- .navbar-dropdown {
- background-color: white;
- border-bottom-left-radius: 5px;
- border-bottom-right-radius: 5px;
- border-top: 1px solid #dbdbdb;
- -webkit-box-shadow: 0 8px 8px rgba(10, 10, 10, 0.1);
- box-shadow: 0 8px 8px rgba(10, 10, 10, 0.1);
- display: none;
- font-size: 0.875rem;
- left: 0;
- min-width: 100%;
- position: absolute;
- top: 100%;
- z-index: 20;
- }
- .navbar-dropdown .navbar-item {
- padding: 0.375rem 1rem;
- white-space: nowrap;
- }
- .navbar-dropdown a.navbar-item {
- padding-right: 3rem;
- }
- .navbar-dropdown a.navbar-item:hover {
- background-color: whitesmoke;
- color: #0a0a0a;
- }
- .navbar-dropdown a.navbar-item.is-active {
- background-color: whitesmoke;
- color: #00d1b2;
- }
- .navbar-dropdown.is-boxed {
- border-radius: 5px;
- border-top: none;
- -webkit-box-shadow: 0 8px 8px rgba(10, 10, 10, 0.1), 0 0 0 1px rgba(10, 10, 10, 0.1);
- box-shadow: 0 8px 8px rgba(10, 10, 10, 0.1), 0 0 0 1px rgba(10, 10, 10, 0.1);
- display: block;
- opacity: 0;
- pointer-events: none;
- top: calc(100% + (-4px));
- -webkit-transform: translateY(-5px);
- transform: translateY(-5px);
- -webkit-transition-duration: 86ms;
- transition-duration: 86ms;
- -webkit-transition-property: opacity, -webkit-transform;
- transition-property: opacity, -webkit-transform;
- transition-property: opacity, transform;
- transition-property: opacity, transform, -webkit-transform;
- }
- .navbar-divider {
- display: block;
- }
- .container > .navbar {
- margin-left: -1rem;
- margin-right: -1rem;
- }
- a.navbar-item.is-active,
- .navbar-link.is-active {
- color: #0a0a0a;
- }
- a.navbar-item.is-active:not(:hover),
- .navbar-link.is-active:not(:hover) {
- background-color: transparent;
- }
- .navbar-item.has-dropdown:hover .navbar-link, .navbar-item.has-dropdown.is-active .navbar-link {
- background-color: whitesmoke;
- }
+.nav {
+ -webkit-box-align: stretch;
+ -ms-flex-align: stretch;
+ align-items: stretch;
+ background-color: white;
+ display: -webkit-box;
+ display: -ms-flexbox;
+ display: flex;
+ height: 3.25rem;
+ position: relative;
+ text-align: center;
+ z-index: 10;
}
-.pagination {
- font-size: 1rem;
- margin: -0.25rem;
+.nav > .container {
+ -webkit-box-align: stretch;
+ -ms-flex-align: stretch;
+ align-items: stretch;
+ display: -webkit-box;
+ display: -ms-flexbox;
+ display: flex;
+ min-height: 3.25rem;
+ width: 100%;
}
-.pagination.is-small {
- font-size: 0.75rem;
+.nav.has-shadow {
+ -webkit-box-shadow: 0 2px 3px rgba(10, 10, 10, 0.1);
+ box-shadow: 0 2px 3px rgba(10, 10, 10, 0.1);
}
-.pagination.is-medium {
- font-size: 1.25rem;
+.navbar {
+ background-color: white;
+ min-height: 3.25rem;
+ position: relative;
}
-.pagination.is-large {
- font-size: 1.5rem;
+.navbar > .container {
+ -webkit-box-align: stretch;
+ -ms-flex-align: stretch;
+ align-items: stretch;
+ display: -webkit-box;
+ display: -ms-flexbox;
+ display: flex;
+ min-height: 3.25rem;
+ width: 100%;
}
-.pagination,
-.pagination-list {
- -webkit-box-align: center;
- -ms-flex-align: center;
- align-items: center;
+.navbar.has-shadow {
+ -webkit-box-shadow: 0 2px 3px rgba(10, 10, 10, 0.1);
+ box-shadow: 0 2px 3px rgba(10, 10, 10, 0.1);
+}
+
+.navbar-brand {
+ -webkit-overflow-scrolling: touch;
+ -webkit-box-align: stretch;
+ -ms-flex-align: stretch;
+ align-items: stretch;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
- -webkit-box-pack: center;
- -ms-flex-pack: center;
- justify-content: center;
- text-align: center;
+ -ms-flex-negative: 0;
+ flex-shrink: 0;
+ max-width: 100vw;
+ min-height: 3.25rem;
+ overflow-x: auto;
+ overflow-y: hidden;
}
-.pagination-previous,
-.pagination-next,
-.pagination-link,
-.pagination-ellipsis {
- -moz-appearance: none;
- -webkit-appearance: none;
- -webkit-box-align: center;
- -ms-flex-align: center;
- align-items: center;
- border: 1px solid transparent;
- border-radius: 3px;
- -webkit-box-shadow: none;
- box-shadow: none;
- display: -webkit-inline-box;
- display: -ms-inline-flexbox;
- display: inline-flex;
- font-size: 1rem;
- height: 2.25em;
- -webkit-box-pack: start;
- -ms-flex-pack: start;
- justify-content: flex-start;
- line-height: 1.5;
- padding-bottom: calc(0.375em - 1px);
- padding-left: calc(0.625em - 1px);
- padding-right: calc(0.625em - 1px);
- padding-top: calc(0.375em - 1px);
+.navbar-burger {
+ cursor: pointer;
+ display: block;
+ height: 3.25rem;
position: relative;
- vertical-align: top;
- -webkit-touch-callout: none;
- -webkit-user-select: none;
- -moz-user-select: none;
- -ms-user-select: none;
- user-select: none;
- font-size: 1em;
- padding-left: 0.5em;
- padding-right: 0.5em;
- -webkit-box-pack: center;
- -ms-flex-pack: center;
- justify-content: center;
- margin: 0.25rem;
- text-align: center;
-}
-
-.pagination-previous:focus, .pagination-previous.is-focused, .pagination-previous:active, .pagination-previous.is-active,
-.pagination-next:focus,
-.pagination-next.is-focused,
-.pagination-next:active,
-.pagination-next.is-active,
-.pagination-link:focus,
-.pagination-link.is-focused,
-.pagination-link:active,
-.pagination-link.is-active,
-.pagination-ellipsis:focus,
-.pagination-ellipsis.is-focused,
-.pagination-ellipsis:active,
-.pagination-ellipsis.is-active {
- outline: none;
+ width: 3.25rem;
+ margin-left: auto;
}
-.pagination-previous[disabled],
-.pagination-next[disabled],
-.pagination-link[disabled],
-.pagination-ellipsis[disabled] {
- cursor: not-allowed;
+.navbar-burger span {
+ background-color: #4a4a4a;
+ display: block;
+ height: 1px;
+ left: 50%;
+ margin-left: -7px;
+ position: absolute;
+ top: 50%;
+ -webkit-transition: none 86ms ease-out;
+ transition: none 86ms ease-out;
+ -webkit-transition-property: background, left, opacity, -webkit-transform;
+ transition-property: background, left, opacity, -webkit-transform;
+ transition-property: background, left, opacity, transform;
+ transition-property: background, left, opacity, transform, -webkit-transform;
+ width: 15px;
}
-.pagination-previous,
-.pagination-next,
-.pagination-link {
- border-color: #dbdbdb;
- min-width: 2.25em;
+.navbar-burger span:nth-child(1) {
+ margin-top: -6px;
}
-.pagination-previous:hover,
-.pagination-next:hover,
-.pagination-link:hover {
- border-color: #b5b5b5;
- color: #363636;
+.navbar-burger span:nth-child(2) {
+ margin-top: -1px;
}
-.pagination-previous:focus,
-.pagination-next:focus,
-.pagination-link:focus {
- border-color: #00d1b2;
+.navbar-burger span:nth-child(3) {
+ margin-top: 4px;
}
-.pagination-previous:active,
-.pagination-next:active,
-.pagination-link:active {
- -webkit-box-shadow: inset 0 1px 2px rgba(10, 10, 10, 0.2);
- box-shadow: inset 0 1px 2px rgba(10, 10, 10, 0.2);
+.navbar-burger:hover {
+ background-color: whitesmoke;
}
-.pagination-previous[disabled],
-.pagination-next[disabled],
-.pagination-link[disabled] {
- background-color: #dbdbdb;
- border-color: #dbdbdb;
- -webkit-box-shadow: none;
- box-shadow: none;
- color: #7a7a7a;
- opacity: 0.5;
+.navbar-burger.is-active span {
+ background-color: #00d1b2;
}
-.pagination-previous,
-.pagination-next {
- padding-left: 0.75em;
- padding-right: 0.75em;
- white-space: nowrap;
-}
-
-.pagination-link.is-current {
- background-color: #00d1b2;
- border-color: #00d1b2;
- color: #fff;
-}
-
-.pagination-ellipsis {
- color: #b5b5b5;
- pointer-events: none;
-}
-
-.pagination-list {
- -ms-flex-wrap: wrap;
- flex-wrap: wrap;
-}
-
-@media screen and (max-width: 768px) {
- .pagination {
- -ms-flex-wrap: wrap;
- flex-wrap: wrap;
- }
- .pagination-previous,
- .pagination-next {
- -webkit-box-flex: 1;
- -ms-flex-positive: 1;
- flex-grow: 1;
- -ms-flex-negative: 1;
- flex-shrink: 1;
- }
- .pagination-list li {
- -webkit-box-flex: 1;
- -ms-flex-positive: 1;
- flex-grow: 1;
- -ms-flex-negative: 1;
- flex-shrink: 1;
- }
-}
-
-@media screen and (min-width: 769px), print {
- .pagination-list {
- -webkit-box-flex: 1;
- -ms-flex-positive: 1;
- flex-grow: 1;
- -ms-flex-negative: 1;
- flex-shrink: 1;
- -webkit-box-pack: start;
- -ms-flex-pack: start;
- justify-content: flex-start;
- -webkit-box-ordinal-group: 2;
- -ms-flex-order: 1;
- order: 1;
- }
- .pagination-previous {
- -webkit-box-ordinal-group: 3;
- -ms-flex-order: 2;
- order: 2;
- }
- .pagination-next {
- -webkit-box-ordinal-group: 4;
- -ms-flex-order: 3;
- order: 3;
- }
- .pagination {
- -webkit-box-pack: justify;
- -ms-flex-pack: justify;
- justify-content: space-between;
- }
- .pagination.is-centered .pagination-previous {
- -webkit-box-ordinal-group: 2;
- -ms-flex-order: 1;
- order: 1;
- }
- .pagination.is-centered .pagination-list {
- -webkit-box-pack: center;
- -ms-flex-pack: center;
- justify-content: center;
- -webkit-box-ordinal-group: 3;
- -ms-flex-order: 2;
- order: 2;
- }
- .pagination.is-centered .pagination-next {
- -webkit-box-ordinal-group: 4;
- -ms-flex-order: 3;
- order: 3;
- }
- .pagination.is-right .pagination-previous {
- -webkit-box-ordinal-group: 2;
- -ms-flex-order: 1;
- order: 1;
- }
- .pagination.is-right .pagination-next {
- -webkit-box-ordinal-group: 3;
- -ms-flex-order: 2;
- order: 2;
- }
- .pagination.is-right .pagination-list {
- -webkit-box-pack: end;
- -ms-flex-pack: end;
- justify-content: flex-end;
- -webkit-box-ordinal-group: 4;
- -ms-flex-order: 3;
- order: 3;
- }
+.navbar-burger.is-active span:nth-child(1) {
+ margin-left: -5px;
+ -webkit-transform: rotate(45deg);
+ transform: rotate(45deg);
+ -webkit-transform-origin: left top;
+ transform-origin: left top;
}
-.panel {
- font-size: 1rem;
+.navbar-burger.is-active span:nth-child(2) {
+ opacity: 0;
}
-.panel:not(:last-child) {
- margin-bottom: 1.5rem;
+.navbar-burger.is-active span:nth-child(3) {
+ margin-left: -5px;
+ -webkit-transform: rotate(-45deg);
+ transform: rotate(-45deg);
+ -webkit-transform-origin: left bottom;
+ transform-origin: left bottom;
}
-.panel-heading,
-.panel-tabs,
-.panel-block {
- border-bottom: 1px solid #dbdbdb;
- border-left: 1px solid #dbdbdb;
- border-right: 1px solid #dbdbdb;
+.navbar-menu {
+ display: none;
}
-.panel-heading:first-child,
-.panel-tabs:first-child,
-.panel-block:first-child {
- border-top: 1px solid #dbdbdb;
+.navbar-item,
+.navbar-link {
+ color: #4a4a4a;
+ display: block;
+ line-height: 1.5;
+ padding: 0.5rem 1rem;
+ position: relative;
}
-.panel-heading {
+a.navbar-item:hover, a.navbar-item.is-active,
+.navbar-link:hover,
+.navbar-link.is-active {
background-color: whitesmoke;
- border-radius: 3px 3px 0 0;
- color: #363636;
- font-size: 1.25em;
- font-weight: 300;
- line-height: 1.25;
- padding: 0.5em 0.75em;
-}
-
-.panel-tabs {
- -webkit-box-align: end;
- -ms-flex-align: end;
- align-items: flex-end;
- display: -webkit-box;
- display: -ms-flexbox;
- display: flex;
- font-size: 0.875em;
- -webkit-box-pack: center;
- -ms-flex-pack: center;
- justify-content: center;
+ color: #0a0a0a;
}
-.panel-tabs a {
- border-bottom: 1px solid #dbdbdb;
- margin-bottom: -1px;
- padding: 0.5em;
+.navbar-item {
+ -webkit-box-flex: 0;
+ -ms-flex-positive: 0;
+ flex-grow: 0;
+ -ms-flex-negative: 0;
+ flex-shrink: 0;
}
-.panel-tabs a.is-active {
- border-bottom-color: #4a4a4a;
- color: #363636;
+.navbar-item img {
+ max-height: 1.75rem;
}
-.panel-list a {
- color: #4a4a4a;
+.navbar-item.has-dropdown {
+ padding: 0;
}
-.panel-list a:hover {
- color: #00d1b2;
+.navbar-item.is-tab {
+ border-bottom: 1px solid transparent;
+ min-height: 3.25rem;
+ padding-bottom: calc(0.5rem - 1px);
}
-.panel-block {
- -webkit-box-align: center;
- -ms-flex-align: center;
- align-items: center;
- color: #363636;
- display: -webkit-box;
- display: -ms-flexbox;
- display: flex;
- -webkit-box-pack: start;
- -ms-flex-pack: start;
- justify-content: flex-start;
- padding: 0.5em 0.75em;
+.navbar-item.is-tab:hover {
+ background-color: transparent;
+ border-bottom-color: #00d1b2;
}
-.panel-block input[type="checkbox"] {
- margin-right: 0.75em;
+.navbar-item.is-tab.is-active {
+ background-color: transparent;
+ border-bottom-color: #00d1b2;
+ border-bottom-style: solid;
+ border-bottom-width: 3px;
+ color: #00d1b2;
+ padding-bottom: calc(0.5rem - 3px);
}
-.panel-block > .control {
+.navbar-content {
-webkit-box-flex: 1;
-ms-flex-positive: 1;
flex-grow: 1;
-ms-flex-negative: 1;
flex-shrink: 1;
- width: 100%;
-}
-
-.panel-block.is-wrapped {
- -ms-flex-wrap: wrap;
- flex-wrap: wrap;
}
-.panel-block.is-active {
- border-left-color: #00d1b2;
- color: #363636;
+.navbar-link {
+ padding-right: 2.5em;
}
-.panel-block.is-active .panel-icon {
- color: #00d1b2;
+.navbar-dropdown {
+ font-size: 0.875rem;
+ padding-bottom: 0.5rem;
+ padding-top: 0.5rem;
}
-a.panel-block,
-label.panel-block {
- cursor: pointer;
+.navbar-dropdown .navbar-item {
+ padding-left: 1.5rem;
+ padding-right: 1.5rem;
}
-a.panel-block:hover,
-label.panel-block:hover {
- background-color: whitesmoke;
+.navbar-divider {
+ background-color: #dbdbdb;
+ border: none;
+ display: none;
+ height: 1px;
+ margin: 0.5rem 0;
}
-.panel-icon {
- display: inline-block;
- font-size: 14px;
- height: 1em;
- line-height: 1em;
- text-align: center;
- vertical-align: top;
- width: 1em;
- color: #7a7a7a;
- margin-right: 0.75em;
+@media screen and (max-width: 1007px) {
+ .navbar > .container {
+ display: block;
+ }
+ .navbar-brand .navbar-item {
+ -webkit-box-align: center;
+ -ms-flex-align: center;
+ align-items: center;
+ display: -webkit-box;
+ display: -ms-flexbox;
+ display: flex;
+ }
+ .navbar-menu {
+ -webkit-box-shadow: 0 8px 16px rgba(10, 10, 10, 0.1);
+ box-shadow: 0 8px 16px rgba(10, 10, 10, 0.1);
+ padding: 0.5rem 0;
+ }
+ .navbar-menu.is-active {
+ display: block;
+ }
}
-.panel-icon .fa {
- font-size: inherit;
- line-height: inherit;
+@media screen and (min-width: 1008px) {
+ .navbar,
+ .navbar-menu,
+ .navbar-start,
+ .navbar-end {
+ -webkit-box-align: stretch;
+ -ms-flex-align: stretch;
+ align-items: stretch;
+ display: -webkit-box;
+ display: -ms-flexbox;
+ display: flex;
+ }
+ .navbar {
+ min-height: 3.25rem;
+ }
+ .navbar.is-transparent a.navbar-item:hover, .navbar.is-transparent a.navbar-item.is-active,
+ .navbar.is-transparent .navbar-link:hover,
+ .navbar.is-transparent .navbar-link.is-active {
+ background-color: transparent;
+ }
+ .navbar.is-transparent .navbar-item.has-dropdown.is-active .navbar-link, .navbar.is-transparent .navbar-item.has-dropdown.is-hoverable:hover .navbar-link {
+ background-color: transparent;
+ }
+ .navbar.is-transparent .navbar-dropdown a.navbar-item:hover {
+ background-color: whitesmoke;
+ color: #0a0a0a;
+ }
+ .navbar.is-transparent .navbar-dropdown a.navbar-item.is-active {
+ background-color: whitesmoke;
+ color: #00d1b2;
+ }
+ .navbar-burger {
+ display: none;
+ }
+ .navbar-item,
+ .navbar-link {
+ -webkit-box-align: center;
+ -ms-flex-align: center;
+ align-items: center;
+ display: -webkit-box;
+ display: -ms-flexbox;
+ display: flex;
+ }
+ .navbar-item.has-dropdown {
+ -webkit-box-align: stretch;
+ -ms-flex-align: stretch;
+ align-items: stretch;
+ }
+ .navbar-item.is-active .navbar-dropdown, .navbar-item.is-hoverable:hover .navbar-dropdown {
+ display: block;
+ }
+ .navbar-item.is-active .navbar-dropdown.is-boxed, .navbar-item.is-hoverable:hover .navbar-dropdown.is-boxed {
+ opacity: 1;
+ pointer-events: auto;
+ -webkit-transform: translateY(0);
+ transform: translateY(0);
+ }
+ .navbar-link::after {
+ border: 1px solid #00d1b2;
+ border-right: 0;
+ border-top: 0;
+ content: " ";
+ display: block;
+ height: 0.5em;
+ pointer-events: none;
+ position: absolute;
+ -webkit-transform: rotate(-45deg);
+ transform: rotate(-45deg);
+ width: 0.5em;
+ margin-top: -0.375em;
+ right: 1.125em;
+ top: 50%;
+ }
+ .navbar-menu {
+ -webkit-box-flex: 1;
+ -ms-flex-positive: 1;
+ flex-grow: 1;
+ -ms-flex-negative: 0;
+ flex-shrink: 0;
+ }
+ .navbar-start {
+ -webkit-box-pack: start;
+ -ms-flex-pack: start;
+ justify-content: flex-start;
+ margin-right: auto;
+ }
+ .navbar-end {
+ -webkit-box-pack: end;
+ -ms-flex-pack: end;
+ justify-content: flex-end;
+ margin-left: auto;
+ }
+ .navbar-dropdown {
+ background-color: white;
+ border-bottom-left-radius: 5px;
+ border-bottom-right-radius: 5px;
+ border-top: 1px solid #dbdbdb;
+ -webkit-box-shadow: 0 8px 8px rgba(10, 10, 10, 0.1);
+ box-shadow: 0 8px 8px rgba(10, 10, 10, 0.1);
+ display: none;
+ font-size: 0.875rem;
+ left: 0;
+ min-width: 100%;
+ position: absolute;
+ top: 100%;
+ z-index: 20;
+ }
+ .navbar-dropdown .navbar-item {
+ padding: 0.375rem 1rem;
+ white-space: nowrap;
+ }
+ .navbar-dropdown a.navbar-item {
+ padding-right: 3rem;
+ }
+ .navbar-dropdown a.navbar-item:hover {
+ background-color: whitesmoke;
+ color: #0a0a0a;
+ }
+ .navbar-dropdown a.navbar-item.is-active {
+ background-color: whitesmoke;
+ color: #00d1b2;
+ }
+ .navbar-dropdown.is-boxed {
+ border-radius: 5px;
+ border-top: none;
+ -webkit-box-shadow: 0 8px 8px rgba(10, 10, 10, 0.1), 0 0 0 1px rgba(10, 10, 10, 0.1);
+ box-shadow: 0 8px 8px rgba(10, 10, 10, 0.1), 0 0 0 1px rgba(10, 10, 10, 0.1);
+ display: block;
+ opacity: 0;
+ pointer-events: none;
+ top: calc(100% + (-4px));
+ -webkit-transform: translateY(-5px);
+ transform: translateY(-5px);
+ -webkit-transition-duration: 86ms;
+ transition-duration: 86ms;
+ -webkit-transition-property: opacity, -webkit-transform;
+ transition-property: opacity, -webkit-transform;
+ transition-property: opacity, transform;
+ transition-property: opacity, transform, -webkit-transform;
+ }
+ .navbar-dropdown.is-right {
+ left: auto;
+ right: 0;
+ }
+ .navbar-divider {
+ display: block;
+ }
+ .container > .navbar {
+ margin-left: -1rem;
+ margin-right: -1rem;
+ }
+ a.navbar-item.is-active,
+ .navbar-link.is-active {
+ color: #0a0a0a;
+ }
+ a.navbar-item.is-active:not(:hover),
+ .navbar-link.is-active:not(:hover) {
+ background-color: transparent;
+ }
+ .navbar-item.has-dropdown:hover .navbar-link, .navbar-item.has-dropdown.is-active .navbar-link {
+ background-color: whitesmoke;
+ }
}
-.tabs {
- -webkit-overflow-scrolling: touch;
- -webkit-touch-callout: none;
- -webkit-user-select: none;
- -moz-user-select: none;
- -ms-user-select: none;
- user-select: none;
- -webkit-box-align: stretch;
- -ms-flex-align: stretch;
- align-items: stretch;
- display: -webkit-box;
- display: -ms-flexbox;
- display: flex;
+.pagination {
font-size: 1rem;
- -webkit-box-pack: justify;
- -ms-flex-pack: justify;
- justify-content: space-between;
- overflow: hidden;
- overflow-x: auto;
- white-space: nowrap;
+ margin: -0.25rem;
}
-.tabs:not(:last-child) {
- margin-bottom: 1.5rem;
+.pagination.is-small {
+ font-size: 0.75rem;
}
-.tabs a {
+.pagination.is-medium {
+ font-size: 1.25rem;
+}
+
+.pagination.is-large {
+ font-size: 1.5rem;
+}
+
+.pagination,
+.pagination-list {
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
- border-bottom-color: #dbdbdb;
- border-bottom-style: solid;
- border-bottom-width: 1px;
- color: #4a4a4a;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
- margin-bottom: -1px;
- padding: 0.5em 1em;
- vertical-align: top;
-}
-
-.tabs a:hover {
- border-bottom-color: #363636;
- color: #363636;
-}
-
-.tabs li {
- display: block;
-}
-
-.tabs li.is-active a {
- border-bottom-color: #00d1b2;
- color: #00d1b2;
+ text-align: center;
}
-.tabs ul {
+.pagination-previous,
+.pagination-next,
+.pagination-link,
+.pagination-ellipsis {
+ -moz-appearance: none;
+ -webkit-appearance: none;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
- border-bottom-color: #dbdbdb;
- border-bottom-style: solid;
- border-bottom-width: 1px;
- display: -webkit-box;
- display: -ms-flexbox;
- display: flex;
- -webkit-box-flex: 1;
- -ms-flex-positive: 1;
- flex-grow: 1;
- -ms-flex-negative: 0;
- flex-shrink: 0;
+ border: 1px solid transparent;
+ border-radius: 3px;
+ -webkit-box-shadow: none;
+ box-shadow: none;
+ display: -webkit-inline-box;
+ display: -ms-inline-flexbox;
+ display: inline-flex;
+ font-size: 1rem;
+ height: 2.25em;
-webkit-box-pack: start;
-ms-flex-pack: start;
justify-content: flex-start;
-}
-
-.tabs ul.is-left {
- padding-right: 0.75em;
-}
-
-.tabs ul.is-center {
- -webkit-box-flex: 0;
- -ms-flex: none;
- flex: none;
+ line-height: 1.5;
+ padding-bottom: calc(0.375em - 1px);
+ padding-left: calc(0.625em - 1px);
+ padding-right: calc(0.625em - 1px);
+ padding-top: calc(0.375em - 1px);
+ position: relative;
+ vertical-align: top;
+ -webkit-touch-callout: none;
+ -webkit-user-select: none;
+ -moz-user-select: none;
+ -ms-user-select: none;
+ user-select: none;
+ font-size: 1em;
+ padding-left: 0.5em;
+ padding-right: 0.5em;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
- padding-left: 0.75em;
- padding-right: 0.75em;
-}
-
-.tabs ul.is-right {
- -webkit-box-pack: end;
- -ms-flex-pack: end;
- justify-content: flex-end;
- padding-left: 0.75em;
+ margin: 0.25rem;
+ text-align: center;
}
-.tabs .icon:first-child {
- margin-right: 0.5em;
+.pagination-previous:focus, .pagination-previous.is-focused, .pagination-previous:active, .pagination-previous.is-active,
+.pagination-next:focus,
+.pagination-next.is-focused,
+.pagination-next:active,
+.pagination-next.is-active,
+.pagination-link:focus,
+.pagination-link.is-focused,
+.pagination-link:active,
+.pagination-link.is-active,
+.pagination-ellipsis:focus,
+.pagination-ellipsis.is-focused,
+.pagination-ellipsis:active,
+.pagination-ellipsis.is-active {
+ outline: none;
}
-.tabs .icon:last-child {
- margin-left: 0.5em;
+.pagination-previous[disabled],
+.pagination-next[disabled],
+.pagination-link[disabled],
+.pagination-ellipsis[disabled] {
+ cursor: not-allowed;
}
-.tabs.is-centered ul {
- -webkit-box-pack: center;
- -ms-flex-pack: center;
- justify-content: center;
+.pagination-previous,
+.pagination-next,
+.pagination-link {
+ border-color: #dbdbdb;
+ min-width: 2.25em;
}
-.tabs.is-right ul {
- -webkit-box-pack: end;
- -ms-flex-pack: end;
- justify-content: flex-end;
+.pagination-previous:hover,
+.pagination-next:hover,
+.pagination-link:hover {
+ border-color: #b5b5b5;
+ color: #363636;
}
-.tabs.is-boxed a {
- border: 1px solid transparent;
- border-radius: 3px 3px 0 0;
+.pagination-previous:focus,
+.pagination-next:focus,
+.pagination-link:focus {
+ border-color: #00d1b2;
}
-.tabs.is-boxed a:hover {
- background-color: whitesmoke;
- border-bottom-color: #dbdbdb;
+.pagination-previous:active,
+.pagination-next:active,
+.pagination-link:active {
+ -webkit-box-shadow: inset 0 1px 2px rgba(10, 10, 10, 0.2);
+ box-shadow: inset 0 1px 2px rgba(10, 10, 10, 0.2);
}
-.tabs.is-boxed li.is-active a {
- background-color: white;
+.pagination-previous[disabled],
+.pagination-next[disabled],
+.pagination-link[disabled] {
+ background-color: #dbdbdb;
border-color: #dbdbdb;
- border-bottom-color: transparent !important;
+ -webkit-box-shadow: none;
+ box-shadow: none;
+ color: #7a7a7a;
+ opacity: 0.5;
}
-.tabs.is-fullwidth li {
- -webkit-box-flex: 1;
- -ms-flex-positive: 1;
- flex-grow: 1;
- -ms-flex-negative: 0;
- flex-shrink: 0;
+.pagination-previous,
+.pagination-next {
+ padding-left: 0.75em;
+ padding-right: 0.75em;
+ white-space: nowrap;
}
-.tabs.is-toggle a {
- border-color: #dbdbdb;
- border-style: solid;
- border-width: 1px;
- margin-bottom: 0;
- position: relative;
+.pagination-link.is-current {
+ background-color: #00d1b2;
+ border-color: #00d1b2;
+ color: #fff;
}
-.tabs.is-toggle a:hover {
- background-color: whitesmoke;
- border-color: #b5b5b5;
- z-index: 2;
+.pagination-ellipsis {
+ color: #b5b5b5;
+ pointer-events: none;
}
-.tabs.is-toggle li + li {
- margin-left: -1px;
+.pagination-list {
+ -ms-flex-wrap: wrap;
+ flex-wrap: wrap;
}
-.tabs.is-toggle li:first-child a {
- border-radius: 3px 0 0 3px;
+@media screen and (max-width: 768px) {
+ .pagination {
+ -ms-flex-wrap: wrap;
+ flex-wrap: wrap;
+ }
+ .pagination-previous,
+ .pagination-next {
+ -webkit-box-flex: 1;
+ -ms-flex-positive: 1;
+ flex-grow: 1;
+ -ms-flex-negative: 1;
+ flex-shrink: 1;
+ }
+ .pagination-list li {
+ -webkit-box-flex: 1;
+ -ms-flex-positive: 1;
+ flex-grow: 1;
+ -ms-flex-negative: 1;
+ flex-shrink: 1;
+ }
}
-.tabs.is-toggle li:last-child a {
- border-radius: 0 3px 3px 0;
+@media screen and (min-width: 769px), print {
+ .pagination-list {
+ -webkit-box-flex: 1;
+ -ms-flex-positive: 1;
+ flex-grow: 1;
+ -ms-flex-negative: 1;
+ flex-shrink: 1;
+ -webkit-box-pack: start;
+ -ms-flex-pack: start;
+ justify-content: flex-start;
+ -webkit-box-ordinal-group: 2;
+ -ms-flex-order: 1;
+ order: 1;
+ }
+ .pagination-previous {
+ -webkit-box-ordinal-group: 3;
+ -ms-flex-order: 2;
+ order: 2;
+ }
+ .pagination-next {
+ -webkit-box-ordinal-group: 4;
+ -ms-flex-order: 3;
+ order: 3;
+ }
+ .pagination {
+ -webkit-box-pack: justify;
+ -ms-flex-pack: justify;
+ justify-content: space-between;
+ }
+ .pagination.is-centered .pagination-previous {
+ -webkit-box-ordinal-group: 2;
+ -ms-flex-order: 1;
+ order: 1;
+ }
+ .pagination.is-centered .pagination-list {
+ -webkit-box-pack: center;
+ -ms-flex-pack: center;
+ justify-content: center;
+ -webkit-box-ordinal-group: 3;
+ -ms-flex-order: 2;
+ order: 2;
+ }
+ .pagination.is-centered .pagination-next {
+ -webkit-box-ordinal-group: 4;
+ -ms-flex-order: 3;
+ order: 3;
+ }
+ .pagination.is-right .pagination-previous {
+ -webkit-box-ordinal-group: 2;
+ -ms-flex-order: 1;
+ order: 1;
+ }
+ .pagination.is-right .pagination-next {
+ -webkit-box-ordinal-group: 3;
+ -ms-flex-order: 2;
+ order: 2;
+ }
+ .pagination.is-right .pagination-list {
+ -webkit-box-pack: end;
+ -ms-flex-pack: end;
+ justify-content: flex-end;
+ -webkit-box-ordinal-group: 4;
+ -ms-flex-order: 3;
+ order: 3;
+ }
}
-.tabs.is-toggle li.is-active a {
- background-color: #00d1b2;
- border-color: #00d1b2;
- color: #fff;
- z-index: 1;
+.panel {
+ font-size: 1rem;
}
-.tabs.is-toggle ul {
- border-bottom: none;
+.panel:not(:last-child) {
+ margin-bottom: 1.5rem;
}
-.tabs.is-small {
- font-size: 0.75rem;
+.panel-heading,
+.panel-tabs,
+.panel-block {
+ border-bottom: 1px solid #dbdbdb;
+ border-left: 1px solid #dbdbdb;
+ border-right: 1px solid #dbdbdb;
}
-.tabs.is-medium {
- font-size: 1.25rem;
+.panel-heading:first-child,
+.panel-tabs:first-child,
+.panel-block:first-child {
+ border-top: 1px solid #dbdbdb;
}
-.tabs.is-large {
- font-size: 1.5rem;
+.panel-heading {
+ background-color: whitesmoke;
+ border-radius: 3px 3px 0 0;
+ color: #363636;
+ font-size: 1.25em;
+ font-weight: 300;
+ line-height: 1.25;
+ padding: 0.5em 0.75em;
}
-.column {
- display: block;
- -ms-flex-preferred-size: 0;
- flex-basis: 0;
- -webkit-box-flex: 1;
- -ms-flex-positive: 1;
- flex-grow: 1;
- -ms-flex-negative: 1;
- flex-shrink: 1;
- padding: 0.75rem;
+.panel-tabs {
+ -webkit-box-align: end;
+ -ms-flex-align: end;
+ align-items: flex-end;
+ display: -webkit-box;
+ display: -ms-flexbox;
+ display: flex;
+ font-size: 0.875em;
+ -webkit-box-pack: center;
+ -ms-flex-pack: center;
+ justify-content: center;
}
-.columns.is-mobile > .column.is-narrow {
- -webkit-box-flex: 0;
- -ms-flex: none;
- flex: none;
+.panel-tabs a {
+ border-bottom: 1px solid #dbdbdb;
+ margin-bottom: -1px;
+ padding: 0.5em;
}
-.columns.is-mobile > .column.is-full {
- -webkit-box-flex: 0;
- -ms-flex: none;
- flex: none;
- width: 100%;
+.panel-tabs a.is-active {
+ border-bottom-color: #4a4a4a;
+ color: #363636;
}
-.columns.is-mobile > .column.is-three-quarters {
- -webkit-box-flex: 0;
- -ms-flex: none;
- flex: none;
- width: 75%;
+.panel-list a {
+ color: #4a4a4a;
}
-.columns.is-mobile > .column.is-two-thirds {
- -webkit-box-flex: 0;
- -ms-flex: none;
- flex: none;
- width: 66.6666%;
+.panel-list a:hover {
+ color: #00d1b2;
}
-.columns.is-mobile > .column.is-half {
- -webkit-box-flex: 0;
- -ms-flex: none;
- flex: none;
- width: 50%;
+.panel-block {
+ -webkit-box-align: center;
+ -ms-flex-align: center;
+ align-items: center;
+ color: #363636;
+ display: -webkit-box;
+ display: -ms-flexbox;
+ display: flex;
+ -webkit-box-pack: start;
+ -ms-flex-pack: start;
+ justify-content: flex-start;
+ padding: 0.5em 0.75em;
}
-.columns.is-mobile > .column.is-one-third {
- -webkit-box-flex: 0;
- -ms-flex: none;
- flex: none;
- width: 33.3333%;
+.panel-block input[type="checkbox"] {
+ margin-right: 0.75em;
}
-.columns.is-mobile > .column.is-one-quarter {
- -webkit-box-flex: 0;
- -ms-flex: none;
- flex: none;
- width: 25%;
+.panel-block > .control {
+ -webkit-box-flex: 1;
+ -ms-flex-positive: 1;
+ flex-grow: 1;
+ -ms-flex-negative: 1;
+ flex-shrink: 1;
+ width: 100%;
}
-.columns.is-mobile > .column.is-offset-three-quarters {
- margin-left: 75%;
+.panel-block.is-wrapped {
+ -ms-flex-wrap: wrap;
+ flex-wrap: wrap;
}
-.columns.is-mobile > .column.is-offset-two-thirds {
- margin-left: 66.6666%;
+.panel-block.is-active {
+ border-left-color: #00d1b2;
+ color: #363636;
}
-.columns.is-mobile > .column.is-offset-half {
- margin-left: 50%;
+.panel-block.is-active .panel-icon {
+ color: #00d1b2;
}
-.columns.is-mobile > .column.is-offset-one-third {
- margin-left: 33.3333%;
+a.panel-block,
+label.panel-block {
+ cursor: pointer;
}
-.columns.is-mobile > .column.is-offset-one-quarter {
- margin-left: 25%;
+a.panel-block:hover,
+label.panel-block:hover {
+ background-color: whitesmoke;
}
-.columns.is-mobile > .column.is-1 {
- -webkit-box-flex: 0;
- -ms-flex: none;
- flex: none;
- width: 8.33333%;
+.panel-icon {
+ display: inline-block;
+ font-size: 14px;
+ height: 1em;
+ line-height: 1em;
+ text-align: center;
+ vertical-align: top;
+ width: 1em;
+ color: #7a7a7a;
+ margin-right: 0.75em;
}
-.columns.is-mobile > .column.is-offset-1 {
- margin-left: 8.33333%;
+.panel-icon .fa {
+ font-size: inherit;
+ line-height: inherit;
}
-.columns.is-mobile > .column.is-2 {
- -webkit-box-flex: 0;
- -ms-flex: none;
- flex: none;
- width: 16.66667%;
+.tabs {
+ -webkit-overflow-scrolling: touch;
+ -webkit-touch-callout: none;
+ -webkit-user-select: none;
+ -moz-user-select: none;
+ -ms-user-select: none;
+ user-select: none;
+ -webkit-box-align: stretch;
+ -ms-flex-align: stretch;
+ align-items: stretch;
+ display: -webkit-box;
+ display: -ms-flexbox;
+ display: flex;
+ font-size: 1rem;
+ -webkit-box-pack: justify;
+ -ms-flex-pack: justify;
+ justify-content: space-between;
+ overflow: hidden;
+ overflow-x: auto;
+ white-space: nowrap;
}
-.columns.is-mobile > .column.is-offset-2 {
- margin-left: 16.66667%;
+.tabs:not(:last-child) {
+ margin-bottom: 1.5rem;
}
-.columns.is-mobile > .column.is-3 {
- -webkit-box-flex: 0;
- -ms-flex: none;
- flex: none;
- width: 25%;
+.tabs a {
+ -webkit-box-align: center;
+ -ms-flex-align: center;
+ align-items: center;
+ border-bottom-color: #dbdbdb;
+ border-bottom-style: solid;
+ border-bottom-width: 1px;
+ color: #4a4a4a;
+ display: -webkit-box;
+ display: -ms-flexbox;
+ display: flex;
+ -webkit-box-pack: center;
+ -ms-flex-pack: center;
+ justify-content: center;
+ margin-bottom: -1px;
+ padding: 0.5em 1em;
+ vertical-align: top;
}
-.columns.is-mobile > .column.is-offset-3 {
- margin-left: 25%;
+.tabs a:hover {
+ border-bottom-color: #363636;
+ color: #363636;
}
-.columns.is-mobile > .column.is-4 {
- -webkit-box-flex: 0;
- -ms-flex: none;
- flex: none;
- width: 33.33333%;
+.tabs li {
+ display: block;
}
-.columns.is-mobile > .column.is-offset-4 {
- margin-left: 33.33333%;
+.tabs li.is-active a {
+ border-bottom-color: #00d1b2;
+ color: #00d1b2;
}
-.columns.is-mobile > .column.is-5 {
- -webkit-box-flex: 0;
- -ms-flex: none;
- flex: none;
- width: 41.66667%;
+.tabs ul {
+ -webkit-box-align: center;
+ -ms-flex-align: center;
+ align-items: center;
+ border-bottom-color: #dbdbdb;
+ border-bottom-style: solid;
+ border-bottom-width: 1px;
+ display: -webkit-box;
+ display: -ms-flexbox;
+ display: flex;
+ -webkit-box-flex: 1;
+ -ms-flex-positive: 1;
+ flex-grow: 1;
+ -ms-flex-negative: 0;
+ flex-shrink: 0;
+ -webkit-box-pack: start;
+ -ms-flex-pack: start;
+ justify-content: flex-start;
}
-.columns.is-mobile > .column.is-offset-5 {
- margin-left: 41.66667%;
+.tabs ul.is-left {
+ padding-right: 0.75em;
}
-.columns.is-mobile > .column.is-6 {
+.tabs ul.is-center {
-webkit-box-flex: 0;
-ms-flex: none;
flex: none;
- width: 50%;
-}
-
-.columns.is-mobile > .column.is-offset-6 {
- margin-left: 50%;
+ -webkit-box-pack: center;
+ -ms-flex-pack: center;
+ justify-content: center;
+ padding-left: 0.75em;
+ padding-right: 0.75em;
+}
+
+.tabs ul.is-right {
+ -webkit-box-pack: end;
+ -ms-flex-pack: end;
+ justify-content: flex-end;
+ padding-left: 0.75em;
+}
+
+.tabs .icon:first-child {
+ margin-right: 0.5em;
+}
+
+.tabs .icon:last-child {
+ margin-left: 0.5em;
+}
+
+.tabs.is-centered ul {
+ -webkit-box-pack: center;
+ -ms-flex-pack: center;
+ justify-content: center;
+}
+
+.tabs.is-right ul {
+ -webkit-box-pack: end;
+ -ms-flex-pack: end;
+ justify-content: flex-end;
+}
+
+.tabs.is-boxed a {
+ border: 1px solid transparent;
+ border-radius: 3px 3px 0 0;
+}
+
+.tabs.is-boxed a:hover {
+ background-color: whitesmoke;
+ border-bottom-color: #dbdbdb;
+}
+
+.tabs.is-boxed li.is-active a {
+ background-color: white;
+ border-color: #dbdbdb;
+ border-bottom-color: transparent !important;
+}
+
+.tabs.is-fullwidth li {
+ -webkit-box-flex: 1;
+ -ms-flex-positive: 1;
+ flex-grow: 1;
+ -ms-flex-negative: 0;
+ flex-shrink: 0;
+}
+
+.tabs.is-toggle a {
+ border-color: #dbdbdb;
+ border-style: solid;
+ border-width: 1px;
+ margin-bottom: 0;
+ position: relative;
+}
+
+.tabs.is-toggle a:hover {
+ background-color: whitesmoke;
+ border-color: #b5b5b5;
+ z-index: 2;
+}
+
+.tabs.is-toggle li + li {
+ margin-left: -1px;
+}
+
+.tabs.is-toggle li:first-child a {
+ border-radius: 3px 0 0 3px;
+}
+
+.tabs.is-toggle li:last-child a {
+ border-radius: 0 3px 3px 0;
+}
+
+.tabs.is-toggle li.is-active a {
+ background-color: #00d1b2;
+ border-color: #00d1b2;
+ color: #fff;
+ z-index: 1;
+}
+
+.tabs.is-toggle ul {
+ border-bottom: none;
+}
+
+.tabs.is-small {
+ font-size: 0.75rem;
+}
+
+.tabs.is-medium {
+ font-size: 1.25rem;
+}
+
+.tabs.is-large {
+ font-size: 1.5rem;
+}
+
+.column {
+ display: block;
+ -ms-flex-preferred-size: 0;
+ flex-basis: 0;
+ -webkit-box-flex: 1;
+ -ms-flex-positive: 1;
+ flex-grow: 1;
+ -ms-flex-negative: 1;
+ flex-shrink: 1;
+ padding: 0.75rem;
+}
+
+.columns.is-mobile > .column.is-narrow {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+}
+
+.columns.is-mobile > .column.is-full {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 100%;
+}
+
+.columns.is-mobile > .column.is-three-quarters {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 75%;
+}
+
+.columns.is-mobile > .column.is-two-thirds {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 66.6666%;
+}
+
+.columns.is-mobile > .column.is-half {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 50%;
+}
+
+.columns.is-mobile > .column.is-one-third {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 33.3333%;
+}
+
+.columns.is-mobile > .column.is-one-quarter {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 25%;
+}
+
+.columns.is-mobile > .column.is-offset-three-quarters {
+ margin-left: 75%;
+}
+
+.columns.is-mobile > .column.is-offset-two-thirds {
+ margin-left: 66.6666%;
+}
+
+.columns.is-mobile > .column.is-offset-half {
+ margin-left: 50%;
+}
+
+.columns.is-mobile > .column.is-offset-one-third {
+ margin-left: 33.3333%;
+}
+
+.columns.is-mobile > .column.is-offset-one-quarter {
+ margin-left: 25%;
+}
+
+.columns.is-mobile > .column.is-1 {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 8.33333%;
+}
+
+.columns.is-mobile > .column.is-offset-1 {
+ margin-left: 8.33333%;
+}
+
+.columns.is-mobile > .column.is-2 {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 16.66667%;
+}
+
+.columns.is-mobile > .column.is-offset-2 {
+ margin-left: 16.66667%;
+}
+
+.columns.is-mobile > .column.is-3 {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 25%;
+}
+
+.columns.is-mobile > .column.is-offset-3 {
+ margin-left: 25%;
+}
+
+.columns.is-mobile > .column.is-4 {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 33.33333%;
+}
+
+.columns.is-mobile > .column.is-offset-4 {
+ margin-left: 33.33333%;
+}
+
+.columns.is-mobile > .column.is-5 {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 41.66667%;
+}
+
+.columns.is-mobile > .column.is-offset-5 {
+ margin-left: 41.66667%;
+}
+
+.columns.is-mobile > .column.is-6 {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 50%;
+}
+
+.columns.is-mobile > .column.is-offset-6 {
+ margin-left: 50%;
}
.columns.is-mobile > .column.is-7 {
@@ -7317,1407 +8098,3371 @@ label.panel-block:hover {
flex: none;
width: 100%;
}
- .column.is-three-quarters-fullhd {
- -webkit-box-flex: 0;
- -ms-flex: none;
- flex: none;
- width: 75%;
- }
- .column.is-two-thirds-fullhd {
- -webkit-box-flex: 0;
- -ms-flex: none;
- flex: none;
- width: 66.6666%;
- }
- .column.is-half-fullhd {
- -webkit-box-flex: 0;
- -ms-flex: none;
- flex: none;
- width: 50%;
- }
- .column.is-one-third-fullhd {
- -webkit-box-flex: 0;
- -ms-flex: none;
- flex: none;
- width: 33.3333%;
- }
- .column.is-one-quarter-fullhd {
- -webkit-box-flex: 0;
- -ms-flex: none;
- flex: none;
- width: 25%;
- }
- .column.is-offset-three-quarters-fullhd {
- margin-left: 75%;
- }
- .column.is-offset-two-thirds-fullhd {
- margin-left: 66.6666%;
- }
- .column.is-offset-half-fullhd {
- margin-left: 50%;
- }
- .column.is-offset-one-third-fullhd {
- margin-left: 33.3333%;
- }
- .column.is-offset-one-quarter-fullhd {
- margin-left: 25%;
- }
- .column.is-1-fullhd {
- -webkit-box-flex: 0;
- -ms-flex: none;
- flex: none;
- width: 8.33333%;
- }
- .column.is-offset-1-fullhd {
- margin-left: 8.33333%;
- }
- .column.is-2-fullhd {
- -webkit-box-flex: 0;
- -ms-flex: none;
- flex: none;
- width: 16.66667%;
+ .column.is-three-quarters-fullhd {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 75%;
+ }
+ .column.is-two-thirds-fullhd {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 66.6666%;
+ }
+ .column.is-half-fullhd {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 50%;
+ }
+ .column.is-one-third-fullhd {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 33.3333%;
+ }
+ .column.is-one-quarter-fullhd {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 25%;
+ }
+ .column.is-offset-three-quarters-fullhd {
+ margin-left: 75%;
+ }
+ .column.is-offset-two-thirds-fullhd {
+ margin-left: 66.6666%;
+ }
+ .column.is-offset-half-fullhd {
+ margin-left: 50%;
+ }
+ .column.is-offset-one-third-fullhd {
+ margin-left: 33.3333%;
+ }
+ .column.is-offset-one-quarter-fullhd {
+ margin-left: 25%;
+ }
+ .column.is-1-fullhd {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 8.33333%;
+ }
+ .column.is-offset-1-fullhd {
+ margin-left: 8.33333%;
+ }
+ .column.is-2-fullhd {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 16.66667%;
+ }
+ .column.is-offset-2-fullhd {
+ margin-left: 16.66667%;
+ }
+ .column.is-3-fullhd {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 25%;
+ }
+ .column.is-offset-3-fullhd {
+ margin-left: 25%;
+ }
+ .column.is-4-fullhd {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 33.33333%;
+ }
+ .column.is-offset-4-fullhd {
+ margin-left: 33.33333%;
+ }
+ .column.is-5-fullhd {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 41.66667%;
+ }
+ .column.is-offset-5-fullhd {
+ margin-left: 41.66667%;
+ }
+ .column.is-6-fullhd {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 50%;
+ }
+ .column.is-offset-6-fullhd {
+ margin-left: 50%;
+ }
+ .column.is-7-fullhd {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 58.33333%;
+ }
+ .column.is-offset-7-fullhd {
+ margin-left: 58.33333%;
+ }
+ .column.is-8-fullhd {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 66.66667%;
+ }
+ .column.is-offset-8-fullhd {
+ margin-left: 66.66667%;
+ }
+ .column.is-9-fullhd {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 75%;
+ }
+ .column.is-offset-9-fullhd {
+ margin-left: 75%;
+ }
+ .column.is-10-fullhd {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 83.33333%;
+ }
+ .column.is-offset-10-fullhd {
+ margin-left: 83.33333%;
+ }
+ .column.is-11-fullhd {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 91.66667%;
+ }
+ .column.is-offset-11-fullhd {
+ margin-left: 91.66667%;
+ }
+ .column.is-12-fullhd {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 100%;
+ }
+ .column.is-offset-12-fullhd {
+ margin-left: 100%;
+ }
+}
+
+.columns {
+ margin-left: -0.75rem;
+ margin-right: -0.75rem;
+ margin-top: -0.75rem;
+}
+
+.columns:last-child {
+ margin-bottom: -0.75rem;
+}
+
+.columns:not(:last-child) {
+ margin-bottom: 0.75rem;
+}
+
+.columns.is-centered {
+ -webkit-box-pack: center;
+ -ms-flex-pack: center;
+ justify-content: center;
+}
+
+.columns.is-gapless {
+ margin-left: 0;
+ margin-right: 0;
+ margin-top: 0;
+}
+
+.columns.is-gapless:last-child {
+ margin-bottom: 0;
+}
+
+.columns.is-gapless:not(:last-child) {
+ margin-bottom: 1.5rem;
+}
+
+.columns.is-gapless > .column {
+ margin: 0;
+ padding: 0;
+}
+
+@media screen and (min-width: 769px), print {
+ .columns.is-grid {
+ -ms-flex-wrap: wrap;
+ flex-wrap: wrap;
+ }
+ .columns.is-grid > .column {
+ max-width: 33.3333%;
+ padding: 0.75rem;
+ width: 33.3333%;
+ }
+ .columns.is-grid > .column + .column {
+ margin-left: 0;
+ }
+}
+
+.columns.is-mobile {
+ display: -webkit-box;
+ display: -ms-flexbox;
+ display: flex;
+}
+
+.columns.is-multiline {
+ -ms-flex-wrap: wrap;
+ flex-wrap: wrap;
+}
+
+.columns.is-vcentered {
+ -webkit-box-align: center;
+ -ms-flex-align: center;
+ align-items: center;
+}
+
+@media screen and (min-width: 769px), print {
+ .columns:not(.is-desktop) {
+ display: -webkit-box;
+ display: -ms-flexbox;
+ display: flex;
+ }
+}
+
+@media screen and (min-width: 1008px) {
+ .columns.is-desktop {
+ display: -webkit-box;
+ display: -ms-flexbox;
+ display: flex;
+ }
+}
+
+.tile {
+ -webkit-box-align: stretch;
+ -ms-flex-align: stretch;
+ align-items: stretch;
+ display: block;
+ -ms-flex-preferred-size: 0;
+ flex-basis: 0;
+ -webkit-box-flex: 1;
+ -ms-flex-positive: 1;
+ flex-grow: 1;
+ -ms-flex-negative: 1;
+ flex-shrink: 1;
+ min-height: -webkit-min-content;
+ min-height: -moz-min-content;
+ min-height: min-content;
+}
+
+.tile.is-ancestor {
+ margin-left: -0.75rem;
+ margin-right: -0.75rem;
+ margin-top: -0.75rem;
+}
+
+.tile.is-ancestor:last-child {
+ margin-bottom: -0.75rem;
+}
+
+.tile.is-ancestor:not(:last-child) {
+ margin-bottom: 0.75rem;
+}
+
+.tile.is-child {
+ margin: 0 !important;
+}
+
+.tile.is-parent {
+ padding: 0.75rem;
+}
+
+.tile.is-vertical {
+ -webkit-box-orient: vertical;
+ -webkit-box-direction: normal;
+ -ms-flex-direction: column;
+ flex-direction: column;
+}
+
+.tile.is-vertical > .tile.is-child:not(:last-child) {
+ margin-bottom: 1.5rem !important;
+}
+
+@media screen and (min-width: 769px), print {
+ .tile:not(.is-child) {
+ display: -webkit-box;
+ display: -ms-flexbox;
+ display: flex;
+ }
+ .tile.is-1 {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 8.33333%;
+ }
+ .tile.is-2 {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 16.66667%;
+ }
+ .tile.is-3 {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 25%;
+ }
+ .tile.is-4 {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 33.33333%;
+ }
+ .tile.is-5 {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 41.66667%;
+ }
+ .tile.is-6 {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 50%;
+ }
+ .tile.is-7 {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 58.33333%;
+ }
+ .tile.is-8 {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 66.66667%;
+ }
+ .tile.is-9 {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 75%;
+ }
+ .tile.is-10 {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 83.33333%;
+ }
+ .tile.is-11 {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 91.66667%;
+ }
+ .tile.is-12 {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 100%;
+ }
+}
+
+.hero {
+ -webkit-box-align: stretch;
+ -ms-flex-align: stretch;
+ align-items: stretch;
+ display: -webkit-box;
+ display: -ms-flexbox;
+ display: flex;
+ -webkit-box-orient: vertical;
+ -webkit-box-direction: normal;
+ -ms-flex-direction: column;
+ flex-direction: column;
+ -webkit-box-pack: justify;
+ -ms-flex-pack: justify;
+ justify-content: space-between;
+}
+
+.hero .nav {
+ background: none;
+ -webkit-box-shadow: 0 1px 0 rgba(219, 219, 219, 0.3);
+ box-shadow: 0 1px 0 rgba(219, 219, 219, 0.3);
+}
+
+.hero .tabs ul {
+ border-bottom: none;
+}
+
+.hero.is-white {
+ background-color: white;
+ color: #0a0a0a;
+}
+
+.hero.is-white a:not(.button),
+.hero.is-white strong {
+ color: inherit;
+}
+
+.hero.is-white .title {
+ color: #0a0a0a;
+}
+
+.hero.is-white .subtitle {
+ color: rgba(10, 10, 10, 0.9);
+}
+
+.hero.is-white .subtitle a:not(.button),
+.hero.is-white .subtitle strong {
+ color: #0a0a0a;
+}
+
+.hero.is-white .nav {
+ -webkit-box-shadow: 0 1px 0 rgba(10, 10, 10, 0.2);
+ box-shadow: 0 1px 0 rgba(10, 10, 10, 0.2);
+}
+
+@media screen and (max-width: 768px) {
+ .hero.is-white .nav-menu {
+ background-color: white;
+ }
+}
+
+.hero.is-white a.nav-item,
+.hero.is-white .nav-item a:not(.button) {
+ color: rgba(10, 10, 10, 0.7);
+}
+
+.hero.is-white a.nav-item:hover, .hero.is-white a.nav-item.is-active,
+.hero.is-white .nav-item a:not(.button):hover,
+.hero.is-white .nav-item a:not(.button).is-active {
+ color: #0a0a0a;
+}
+
+.hero.is-white .tabs a {
+ color: #0a0a0a;
+ opacity: 0.9;
+}
+
+.hero.is-white .tabs a:hover {
+ opacity: 1;
+}
+
+.hero.is-white .tabs li.is-active a {
+ opacity: 1;
+}
+
+.hero.is-white .tabs.is-boxed a, .hero.is-white .tabs.is-toggle a {
+ color: #0a0a0a;
+}
+
+.hero.is-white .tabs.is-boxed a:hover, .hero.is-white .tabs.is-toggle a:hover {
+ background-color: rgba(10, 10, 10, 0.1);
+}
+
+.hero.is-white .tabs.is-boxed li.is-active a, .hero.is-white .tabs.is-boxed li.is-active a:hover, .hero.is-white .tabs.is-toggle li.is-active a, .hero.is-white .tabs.is-toggle li.is-active a:hover {
+ background-color: #0a0a0a;
+ border-color: #0a0a0a;
+ color: white;
+}
+
+.hero.is-white.is-bold {
+ background-image: linear-gradient(141deg, #e6e6e6 0%, white 71%, white 100%);
+}
+
+@media screen and (max-width: 768px) {
+ .hero.is-white.is-bold .nav-menu {
+ background-image: linear-gradient(141deg, #e6e6e6 0%, white 71%, white 100%);
+ }
+}
+
+@media screen and (max-width: 768px) {
+ .hero.is-white .nav-toggle span {
+ background-color: #0a0a0a;
+ }
+ .hero.is-white .nav-toggle:hover {
+ background-color: rgba(10, 10, 10, 0.1);
+ }
+ .hero.is-white .nav-toggle.is-active span {
+ background-color: #0a0a0a;
+ }
+ .hero.is-white .nav-menu .nav-item {
+ border-top-color: rgba(10, 10, 10, 0.2);
+ }
+}
+
+.hero.is-black {
+ background-color: #0a0a0a;
+ color: white;
+}
+
+.hero.is-black a:not(.button),
+.hero.is-black strong {
+ color: inherit;
+}
+
+.hero.is-black .title {
+ color: white;
+}
+
+.hero.is-black .subtitle {
+ color: rgba(255, 255, 255, 0.9);
+}
+
+.hero.is-black .subtitle a:not(.button),
+.hero.is-black .subtitle strong {
+ color: white;
+}
+
+.hero.is-black .nav {
+ -webkit-box-shadow: 0 1px 0 rgba(255, 255, 255, 0.2);
+ box-shadow: 0 1px 0 rgba(255, 255, 255, 0.2);
+}
+
+@media screen and (max-width: 768px) {
+ .hero.is-black .nav-menu {
+ background-color: #0a0a0a;
+ }
+}
+
+.hero.is-black a.nav-item,
+.hero.is-black .nav-item a:not(.button) {
+ color: rgba(255, 255, 255, 0.7);
+}
+
+.hero.is-black a.nav-item:hover, .hero.is-black a.nav-item.is-active,
+.hero.is-black .nav-item a:not(.button):hover,
+.hero.is-black .nav-item a:not(.button).is-active {
+ color: white;
+}
+
+.hero.is-black .tabs a {
+ color: white;
+ opacity: 0.9;
+}
+
+.hero.is-black .tabs a:hover {
+ opacity: 1;
+}
+
+.hero.is-black .tabs li.is-active a {
+ opacity: 1;
+}
+
+.hero.is-black .tabs.is-boxed a, .hero.is-black .tabs.is-toggle a {
+ color: white;
+}
+
+.hero.is-black .tabs.is-boxed a:hover, .hero.is-black .tabs.is-toggle a:hover {
+ background-color: rgba(10, 10, 10, 0.1);
+}
+
+.hero.is-black .tabs.is-boxed li.is-active a, .hero.is-black .tabs.is-boxed li.is-active a:hover, .hero.is-black .tabs.is-toggle li.is-active a, .hero.is-black .tabs.is-toggle li.is-active a:hover {
+ background-color: white;
+ border-color: white;
+ color: #0a0a0a;
+}
+
+.hero.is-black.is-bold {
+ background-image: linear-gradient(141deg, black 0%, #0a0a0a 71%, #181616 100%);
+}
+
+@media screen and (max-width: 768px) {
+ .hero.is-black.is-bold .nav-menu {
+ background-image: linear-gradient(141deg, black 0%, #0a0a0a 71%, #181616 100%);
+ }
+}
+
+@media screen and (max-width: 768px) {
+ .hero.is-black .nav-toggle span {
+ background-color: white;
+ }
+ .hero.is-black .nav-toggle:hover {
+ background-color: rgba(10, 10, 10, 0.1);
+ }
+ .hero.is-black .nav-toggle.is-active span {
+ background-color: white;
+ }
+ .hero.is-black .nav-menu .nav-item {
+ border-top-color: rgba(255, 255, 255, 0.2);
+ }
+}
+
+.hero.is-light {
+ background-color: whitesmoke;
+ color: #363636;
+}
+
+.hero.is-light a:not(.button),
+.hero.is-light strong {
+ color: inherit;
+}
+
+.hero.is-light .title {
+ color: #363636;
+}
+
+.hero.is-light .subtitle {
+ color: rgba(54, 54, 54, 0.9);
+}
+
+.hero.is-light .subtitle a:not(.button),
+.hero.is-light .subtitle strong {
+ color: #363636;
+}
+
+.hero.is-light .nav {
+ -webkit-box-shadow: 0 1px 0 rgba(54, 54, 54, 0.2);
+ box-shadow: 0 1px 0 rgba(54, 54, 54, 0.2);
+}
+
+@media screen and (max-width: 768px) {
+ .hero.is-light .nav-menu {
+ background-color: whitesmoke;
+ }
+}
+
+.hero.is-light a.nav-item,
+.hero.is-light .nav-item a:not(.button) {
+ color: rgba(54, 54, 54, 0.7);
+}
+
+.hero.is-light a.nav-item:hover, .hero.is-light a.nav-item.is-active,
+.hero.is-light .nav-item a:not(.button):hover,
+.hero.is-light .nav-item a:not(.button).is-active {
+ color: #363636;
+}
+
+.hero.is-light .tabs a {
+ color: #363636;
+ opacity: 0.9;
+}
+
+.hero.is-light .tabs a:hover {
+ opacity: 1;
+}
+
+.hero.is-light .tabs li.is-active a {
+ opacity: 1;
+}
+
+.hero.is-light .tabs.is-boxed a, .hero.is-light .tabs.is-toggle a {
+ color: #363636;
+}
+
+.hero.is-light .tabs.is-boxed a:hover, .hero.is-light .tabs.is-toggle a:hover {
+ background-color: rgba(10, 10, 10, 0.1);
+}
+
+.hero.is-light .tabs.is-boxed li.is-active a, .hero.is-light .tabs.is-boxed li.is-active a:hover, .hero.is-light .tabs.is-toggle li.is-active a, .hero.is-light .tabs.is-toggle li.is-active a:hover {
+ background-color: #363636;
+ border-color: #363636;
+ color: whitesmoke;
+}
+
+.hero.is-light.is-bold {
+ background-image: linear-gradient(141deg, #dfd8d9 0%, whitesmoke 71%, white 100%);
+}
+
+@media screen and (max-width: 768px) {
+ .hero.is-light.is-bold .nav-menu {
+ background-image: linear-gradient(141deg, #dfd8d9 0%, whitesmoke 71%, white 100%);
+ }
+}
+
+@media screen and (max-width: 768px) {
+ .hero.is-light .nav-toggle span {
+ background-color: #363636;
+ }
+ .hero.is-light .nav-toggle:hover {
+ background-color: rgba(10, 10, 10, 0.1);
+ }
+ .hero.is-light .nav-toggle.is-active span {
+ background-color: #363636;
+ }
+ .hero.is-light .nav-menu .nav-item {
+ border-top-color: rgba(54, 54, 54, 0.2);
+ }
+}
+
+.hero.is-dark {
+ background-color: #363636;
+ color: whitesmoke;
+}
+
+.hero.is-dark a:not(.button),
+.hero.is-dark strong {
+ color: inherit;
+}
+
+.hero.is-dark .title {
+ color: whitesmoke;
+}
+
+.hero.is-dark .subtitle {
+ color: rgba(245, 245, 245, 0.9);
+}
+
+.hero.is-dark .subtitle a:not(.button),
+.hero.is-dark .subtitle strong {
+ color: whitesmoke;
+}
+
+.hero.is-dark .nav {
+ -webkit-box-shadow: 0 1px 0 rgba(245, 245, 245, 0.2);
+ box-shadow: 0 1px 0 rgba(245, 245, 245, 0.2);
+}
+
+@media screen and (max-width: 768px) {
+ .hero.is-dark .nav-menu {
+ background-color: #363636;
+ }
+}
+
+.hero.is-dark a.nav-item,
+.hero.is-dark .nav-item a:not(.button) {
+ color: rgba(245, 245, 245, 0.7);
+}
+
+.hero.is-dark a.nav-item:hover, .hero.is-dark a.nav-item.is-active,
+.hero.is-dark .nav-item a:not(.button):hover,
+.hero.is-dark .nav-item a:not(.button).is-active {
+ color: whitesmoke;
+}
+
+.hero.is-dark .tabs a {
+ color: whitesmoke;
+ opacity: 0.9;
+}
+
+.hero.is-dark .tabs a:hover {
+ opacity: 1;
+}
+
+.hero.is-dark .tabs li.is-active a {
+ opacity: 1;
+}
+
+.hero.is-dark .tabs.is-boxed a, .hero.is-dark .tabs.is-toggle a {
+ color: whitesmoke;
+}
+
+.hero.is-dark .tabs.is-boxed a:hover, .hero.is-dark .tabs.is-toggle a:hover {
+ background-color: rgba(10, 10, 10, 0.1);
+}
+
+.hero.is-dark .tabs.is-boxed li.is-active a, .hero.is-dark .tabs.is-boxed li.is-active a:hover, .hero.is-dark .tabs.is-toggle li.is-active a, .hero.is-dark .tabs.is-toggle li.is-active a:hover {
+ background-color: whitesmoke;
+ border-color: whitesmoke;
+ color: #363636;
+}
+
+.hero.is-dark.is-bold {
+ background-image: linear-gradient(141deg, #1f191a 0%, #363636 71%, #46403f 100%);
+}
+
+@media screen and (max-width: 768px) {
+ .hero.is-dark.is-bold .nav-menu {
+ background-image: linear-gradient(141deg, #1f191a 0%, #363636 71%, #46403f 100%);
+ }
+}
+
+@media screen and (max-width: 768px) {
+ .hero.is-dark .nav-toggle span {
+ background-color: whitesmoke;
+ }
+ .hero.is-dark .nav-toggle:hover {
+ background-color: rgba(10, 10, 10, 0.1);
+ }
+ .hero.is-dark .nav-toggle.is-active span {
+ background-color: whitesmoke;
+ }
+ .hero.is-dark .nav-menu .nav-item {
+ border-top-color: rgba(245, 245, 245, 0.2);
+ }
+}
+
+.hero.is-primary {
+ background-color: #00d1b2;
+ color: #fff;
+}
+
+.hero.is-primary a:not(.button),
+.hero.is-primary strong {
+ color: inherit;
+}
+
+.hero.is-primary .title {
+ color: #fff;
+}
+
+.hero.is-primary .subtitle {
+ color: rgba(255, 255, 255, 0.9);
+}
+
+.hero.is-primary .subtitle a:not(.button),
+.hero.is-primary .subtitle strong {
+ color: #fff;
+}
+
+.hero.is-primary .nav {
+ -webkit-box-shadow: 0 1px 0 rgba(255, 255, 255, 0.2);
+ box-shadow: 0 1px 0 rgba(255, 255, 255, 0.2);
+}
+
+@media screen and (max-width: 768px) {
+ .hero.is-primary .nav-menu {
+ background-color: #00d1b2;
+ }
+}
+
+.hero.is-primary a.nav-item,
+.hero.is-primary .nav-item a:not(.button) {
+ color: rgba(255, 255, 255, 0.7);
+}
+
+.hero.is-primary a.nav-item:hover, .hero.is-primary a.nav-item.is-active,
+.hero.is-primary .nav-item a:not(.button):hover,
+.hero.is-primary .nav-item a:not(.button).is-active {
+ color: #fff;
+}
+
+.hero.is-primary .tabs a {
+ color: #fff;
+ opacity: 0.9;
+}
+
+.hero.is-primary .tabs a:hover {
+ opacity: 1;
+}
+
+.hero.is-primary .tabs li.is-active a {
+ opacity: 1;
+}
+
+.hero.is-primary .tabs.is-boxed a, .hero.is-primary .tabs.is-toggle a {
+ color: #fff;
+}
+
+.hero.is-primary .tabs.is-boxed a:hover, .hero.is-primary .tabs.is-toggle a:hover {
+ background-color: rgba(10, 10, 10, 0.1);
+}
+
+.hero.is-primary .tabs.is-boxed li.is-active a, .hero.is-primary .tabs.is-boxed li.is-active a:hover, .hero.is-primary .tabs.is-toggle li.is-active a, .hero.is-primary .tabs.is-toggle li.is-active a:hover {
+ background-color: #fff;
+ border-color: #fff;
+ color: #00d1b2;
+}
+
+.hero.is-primary.is-bold {
+ background-image: linear-gradient(141deg, #009e6c 0%, #00d1b2 71%, #00e7eb 100%);
+}
+
+@media screen and (max-width: 768px) {
+ .hero.is-primary.is-bold .nav-menu {
+ background-image: linear-gradient(141deg, #009e6c 0%, #00d1b2 71%, #00e7eb 100%);
+ }
+}
+
+@media screen and (max-width: 768px) {
+ .hero.is-primary .nav-toggle span {
+ background-color: #fff;
+ }
+ .hero.is-primary .nav-toggle:hover {
+ background-color: rgba(10, 10, 10, 0.1);
+ }
+ .hero.is-primary .nav-toggle.is-active span {
+ background-color: #fff;
+ }
+ .hero.is-primary .nav-menu .nav-item {
+ border-top-color: rgba(255, 255, 255, 0.2);
+ }
+}
+
+.hero.is-info {
+ background-color: #3273dc;
+ color: #fff;
+}
+
+.hero.is-info a:not(.button),
+.hero.is-info strong {
+ color: inherit;
+}
+
+.hero.is-info .title {
+ color: #fff;
+}
+
+.hero.is-info .subtitle {
+ color: rgba(255, 255, 255, 0.9);
+}
+
+.hero.is-info .subtitle a:not(.button),
+.hero.is-info .subtitle strong {
+ color: #fff;
+}
+
+.hero.is-info .nav {
+ -webkit-box-shadow: 0 1px 0 rgba(255, 255, 255, 0.2);
+ box-shadow: 0 1px 0 rgba(255, 255, 255, 0.2);
+}
+
+@media screen and (max-width: 768px) {
+ .hero.is-info .nav-menu {
+ background-color: #3273dc;
+ }
+}
+
+.hero.is-info a.nav-item,
+.hero.is-info .nav-item a:not(.button) {
+ color: rgba(255, 255, 255, 0.7);
+}
+
+.hero.is-info a.nav-item:hover, .hero.is-info a.nav-item.is-active,
+.hero.is-info .nav-item a:not(.button):hover,
+.hero.is-info .nav-item a:not(.button).is-active {
+ color: #fff;
+}
+
+.hero.is-info .tabs a {
+ color: #fff;
+ opacity: 0.9;
+}
+
+.hero.is-info .tabs a:hover {
+ opacity: 1;
+}
+
+.hero.is-info .tabs li.is-active a {
+ opacity: 1;
+}
+
+.hero.is-info .tabs.is-boxed a, .hero.is-info .tabs.is-toggle a {
+ color: #fff;
+}
+
+.hero.is-info .tabs.is-boxed a:hover, .hero.is-info .tabs.is-toggle a:hover {
+ background-color: rgba(10, 10, 10, 0.1);
+}
+
+.hero.is-info .tabs.is-boxed li.is-active a, .hero.is-info .tabs.is-boxed li.is-active a:hover, .hero.is-info .tabs.is-toggle li.is-active a, .hero.is-info .tabs.is-toggle li.is-active a:hover {
+ background-color: #fff;
+ border-color: #fff;
+ color: #3273dc;
+}
+
+.hero.is-info.is-bold {
+ background-image: linear-gradient(141deg, #1577c6 0%, #3273dc 71%, #4366e5 100%);
+}
+
+@media screen and (max-width: 768px) {
+ .hero.is-info.is-bold .nav-menu {
+ background-image: linear-gradient(141deg, #1577c6 0%, #3273dc 71%, #4366e5 100%);
+ }
+}
+
+@media screen and (max-width: 768px) {
+ .hero.is-info .nav-toggle span {
+ background-color: #fff;
+ }
+ .hero.is-info .nav-toggle:hover {
+ background-color: rgba(10, 10, 10, 0.1);
+ }
+ .hero.is-info .nav-toggle.is-active span {
+ background-color: #fff;
+ }
+ .hero.is-info .nav-menu .nav-item {
+ border-top-color: rgba(255, 255, 255, 0.2);
+ }
+}
+
+.hero.is-success {
+ background-color: #23d160;
+ color: #fff;
+}
+
+.hero.is-success a:not(.button),
+.hero.is-success strong {
+ color: inherit;
+}
+
+.hero.is-success .title {
+ color: #fff;
+}
+
+.hero.is-success .subtitle {
+ color: rgba(255, 255, 255, 0.9);
+}
+
+.hero.is-success .subtitle a:not(.button),
+.hero.is-success .subtitle strong {
+ color: #fff;
+}
+
+.hero.is-success .nav {
+ -webkit-box-shadow: 0 1px 0 rgba(255, 255, 255, 0.2);
+ box-shadow: 0 1px 0 rgba(255, 255, 255, 0.2);
+}
+
+@media screen and (max-width: 768px) {
+ .hero.is-success .nav-menu {
+ background-color: #23d160;
+ }
+}
+
+.hero.is-success a.nav-item,
+.hero.is-success .nav-item a:not(.button) {
+ color: rgba(255, 255, 255, 0.7);
+}
+
+.hero.is-success a.nav-item:hover, .hero.is-success a.nav-item.is-active,
+.hero.is-success .nav-item a:not(.button):hover,
+.hero.is-success .nav-item a:not(.button).is-active {
+ color: #fff;
+}
+
+.hero.is-success .tabs a {
+ color: #fff;
+ opacity: 0.9;
+}
+
+.hero.is-success .tabs a:hover {
+ opacity: 1;
+}
+
+.hero.is-success .tabs li.is-active a {
+ opacity: 1;
+}
+
+.hero.is-success .tabs.is-boxed a, .hero.is-success .tabs.is-toggle a {
+ color: #fff;
+}
+
+.hero.is-success .tabs.is-boxed a:hover, .hero.is-success .tabs.is-toggle a:hover {
+ background-color: rgba(10, 10, 10, 0.1);
+}
+
+.hero.is-success .tabs.is-boxed li.is-active a, .hero.is-success .tabs.is-boxed li.is-active a:hover, .hero.is-success .tabs.is-toggle li.is-active a, .hero.is-success .tabs.is-toggle li.is-active a:hover {
+ background-color: #fff;
+ border-color: #fff;
+ color: #23d160;
+}
+
+.hero.is-success.is-bold {
+ background-image: linear-gradient(141deg, #12af2f 0%, #23d160 71%, #2ce28a 100%);
+}
+
+@media screen and (max-width: 768px) {
+ .hero.is-success.is-bold .nav-menu {
+ background-image: linear-gradient(141deg, #12af2f 0%, #23d160 71%, #2ce28a 100%);
+ }
+}
+
+@media screen and (max-width: 768px) {
+ .hero.is-success .nav-toggle span {
+ background-color: #fff;
+ }
+ .hero.is-success .nav-toggle:hover {
+ background-color: rgba(10, 10, 10, 0.1);
+ }
+ .hero.is-success .nav-toggle.is-active span {
+ background-color: #fff;
+ }
+ .hero.is-success .nav-menu .nav-item {
+ border-top-color: rgba(255, 255, 255, 0.2);
+ }
+}
+
+.hero.is-warning {
+ background-color: #ffdd57;
+ color: rgba(0, 0, 0, 0.7);
+}
+
+.hero.is-warning a:not(.button),
+.hero.is-warning strong {
+ color: inherit;
+}
+
+.hero.is-warning .title {
+ color: rgba(0, 0, 0, 0.7);
+}
+
+.hero.is-warning .subtitle {
+ color: rgba(0, 0, 0, 0.9);
+}
+
+.hero.is-warning .subtitle a:not(.button),
+.hero.is-warning .subtitle strong {
+ color: rgba(0, 0, 0, 0.7);
+}
+
+.hero.is-warning .nav {
+ -webkit-box-shadow: 0 1px 0 rgba(0, 0, 0, 0.2);
+ box-shadow: 0 1px 0 rgba(0, 0, 0, 0.2);
+}
+
+@media screen and (max-width: 768px) {
+ .hero.is-warning .nav-menu {
+ background-color: #ffdd57;
+ }
+}
+
+.hero.is-warning a.nav-item,
+.hero.is-warning .nav-item a:not(.button) {
+ color: rgba(0, 0, 0, 0.7);
+}
+
+.hero.is-warning a.nav-item:hover, .hero.is-warning a.nav-item.is-active,
+.hero.is-warning .nav-item a:not(.button):hover,
+.hero.is-warning .nav-item a:not(.button).is-active {
+ color: rgba(0, 0, 0, 0.7);
+}
+
+.hero.is-warning .tabs a {
+ color: rgba(0, 0, 0, 0.7);
+ opacity: 0.9;
+}
+
+.hero.is-warning .tabs a:hover {
+ opacity: 1;
+}
+
+.hero.is-warning .tabs li.is-active a {
+ opacity: 1;
+}
+
+.hero.is-warning .tabs.is-boxed a, .hero.is-warning .tabs.is-toggle a {
+ color: rgba(0, 0, 0, 0.7);
+}
+
+.hero.is-warning .tabs.is-boxed a:hover, .hero.is-warning .tabs.is-toggle a:hover {
+ background-color: rgba(10, 10, 10, 0.1);
+}
+
+.hero.is-warning .tabs.is-boxed li.is-active a, .hero.is-warning .tabs.is-boxed li.is-active a:hover, .hero.is-warning .tabs.is-toggle li.is-active a, .hero.is-warning .tabs.is-toggle li.is-active a:hover {
+ background-color: rgba(0, 0, 0, 0.7);
+ border-color: rgba(0, 0, 0, 0.7);
+ color: #ffdd57;
+}
+
+.hero.is-warning.is-bold {
+ background-image: linear-gradient(141deg, #ffaf24 0%, #ffdd57 71%, #fffa70 100%);
+}
+
+@media screen and (max-width: 768px) {
+ .hero.is-warning.is-bold .nav-menu {
+ background-image: linear-gradient(141deg, #ffaf24 0%, #ffdd57 71%, #fffa70 100%);
+ }
+}
+
+@media screen and (max-width: 768px) {
+ .hero.is-warning .nav-toggle span {
+ background-color: rgba(0, 0, 0, 0.7);
+ }
+ .hero.is-warning .nav-toggle:hover {
+ background-color: rgba(10, 10, 10, 0.1);
+ }
+ .hero.is-warning .nav-toggle.is-active span {
+ background-color: rgba(0, 0, 0, 0.7);
+ }
+ .hero.is-warning .nav-menu .nav-item {
+ border-top-color: rgba(0, 0, 0, 0.2);
+ }
+}
+
+.hero.is-danger {
+ background-color: #ff3860;
+ color: #fff;
+}
+
+.hero.is-danger a:not(.button),
+.hero.is-danger strong {
+ color: inherit;
+}
+
+.hero.is-danger .title {
+ color: #fff;
+}
+
+.hero.is-danger .subtitle {
+ color: rgba(255, 255, 255, 0.9);
+}
+
+.hero.is-danger .subtitle a:not(.button),
+.hero.is-danger .subtitle strong {
+ color: #fff;
+}
+
+.hero.is-danger .nav {
+ -webkit-box-shadow: 0 1px 0 rgba(255, 255, 255, 0.2);
+ box-shadow: 0 1px 0 rgba(255, 255, 255, 0.2);
+}
+
+@media screen and (max-width: 768px) {
+ .hero.is-danger .nav-menu {
+ background-color: #ff3860;
+ }
+}
+
+.hero.is-danger a.nav-item,
+.hero.is-danger .nav-item a:not(.button) {
+ color: rgba(255, 255, 255, 0.7);
+}
+
+.hero.is-danger a.nav-item:hover, .hero.is-danger a.nav-item.is-active,
+.hero.is-danger .nav-item a:not(.button):hover,
+.hero.is-danger .nav-item a:not(.button).is-active {
+ color: #fff;
+}
+
+.hero.is-danger .tabs a {
+ color: #fff;
+ opacity: 0.9;
+}
+
+.hero.is-danger .tabs a:hover {
+ opacity: 1;
+}
+
+.hero.is-danger .tabs li.is-active a {
+ opacity: 1;
+}
+
+.hero.is-danger .tabs.is-boxed a, .hero.is-danger .tabs.is-toggle a {
+ color: #fff;
+}
+
+.hero.is-danger .tabs.is-boxed a:hover, .hero.is-danger .tabs.is-toggle a:hover {
+ background-color: rgba(10, 10, 10, 0.1);
+}
+
+.hero.is-danger .tabs.is-boxed li.is-active a, .hero.is-danger .tabs.is-boxed li.is-active a:hover, .hero.is-danger .tabs.is-toggle li.is-active a, .hero.is-danger .tabs.is-toggle li.is-active a:hover {
+ background-color: #fff;
+ border-color: #fff;
+ color: #ff3860;
+}
+
+.hero.is-danger.is-bold {
+ background-image: linear-gradient(141deg, #ff0561 0%, #ff3860 71%, #ff5257 100%);
+}
+
+@media screen and (max-width: 768px) {
+ .hero.is-danger.is-bold .nav-menu {
+ background-image: linear-gradient(141deg, #ff0561 0%, #ff3860 71%, #ff5257 100%);
+ }
+}
+
+@media screen and (max-width: 768px) {
+ .hero.is-danger .nav-toggle span {
+ background-color: #fff;
+ }
+ .hero.is-danger .nav-toggle:hover {
+ background-color: rgba(10, 10, 10, 0.1);
+ }
+ .hero.is-danger .nav-toggle.is-active span {
+ background-color: #fff;
+ }
+ .hero.is-danger .nav-menu .nav-item {
+ border-top-color: rgba(255, 255, 255, 0.2);
+ }
+}
+
+@media screen and (min-width: 769px), print {
+ .hero.is-medium .hero-body {
+ padding-bottom: 9rem;
+ padding-top: 9rem;
+ }
+}
+
+@media screen and (min-width: 769px), print {
+ .hero.is-large .hero-body {
+ padding-bottom: 18rem;
+ padding-top: 18rem;
+ }
+}
+
+.hero.is-halfheight .hero-body, .hero.is-fullheight .hero-body {
+ -webkit-box-align: center;
+ -ms-flex-align: center;
+ align-items: center;
+ display: -webkit-box;
+ display: -ms-flexbox;
+ display: flex;
+}
+
+.hero.is-halfheight .hero-body > .container, .hero.is-fullheight .hero-body > .container {
+ -webkit-box-flex: 1;
+ -ms-flex-positive: 1;
+ flex-grow: 1;
+ -ms-flex-negative: 1;
+ flex-shrink: 1;
+}
+
+.hero.is-halfheight {
+ min-height: 50vh;
+}
+
+.hero.is-fullheight {
+ min-height: 100vh;
+}
+
+.hero-video {
+ bottom: 0;
+ left: 0;
+ position: absolute;
+ right: 0;
+ top: 0;
+ overflow: hidden;
+}
+
+.hero-video video {
+ left: 50%;
+ min-height: 100%;
+ min-width: 100%;
+ position: absolute;
+ top: 50%;
+ -webkit-transform: translate3d(-50%, -50%, 0);
+ transform: translate3d(-50%, -50%, 0);
+}
+
+.hero-video.is-transparent {
+ opacity: 0.3;
+}
+
+@media screen and (max-width: 768px) {
+ .hero-video {
+ display: none;
+ }
+}
+
+.hero-buttons {
+ margin-top: 1.5rem;
+}
+
+@media screen and (max-width: 768px) {
+ .hero-buttons .button {
+ display: -webkit-box;
+ display: -ms-flexbox;
+ display: flex;
+ }
+ .hero-buttons .button:not(:last-child) {
+ margin-bottom: 0.75rem;
+ }
+}
+
+@media screen and (min-width: 769px), print {
+ .hero-buttons {
+ display: -webkit-box;
+ display: -ms-flexbox;
+ display: flex;
+ -webkit-box-pack: center;
+ -ms-flex-pack: center;
+ justify-content: center;
+ }
+ .hero-buttons .button:not(:last-child) {
+ margin-right: 1.5rem;
+ }
+}
+
+.hero-head,
+.hero-foot {
+ -webkit-box-flex: 0;
+ -ms-flex-positive: 0;
+ flex-grow: 0;
+ -ms-flex-negative: 0;
+ flex-shrink: 0;
+}
+
+.hero-body {
+ -webkit-box-flex: 1;
+ -ms-flex-positive: 1;
+ flex-grow: 1;
+ -ms-flex-negative: 0;
+ flex-shrink: 0;
+ padding: 3rem 1.5rem;
+}
+
+.section {
+ padding: 3rem 1.5rem;
+}
+
+@media screen and (min-width: 1008px) {
+ .section.is-medium {
+ padding: 9rem 1.5rem;
+ }
+ .section.is-large {
+ padding: 18rem 1.5rem;
+ }
+}
+
+.footer {
+ background-color: whitesmoke;
+ padding: 3rem 1.5rem 6rem;
+}
+
+.highlight {
+ background-color: #f5f5f5;
+ color: #586e75;
+}
+
+.highlight .c {
+ color: #93a1a1;
+}
+
+.highlight .err,
+.highlight .g {
+ color: #586e75;
+}
+
+.highlight .k {
+ color: #859900;
+}
+
+.highlight .l,
+.highlight .n {
+ color: #586e75;
+}
+
+.highlight .o {
+ color: #859900;
+}
+
+.highlight .x {
+ color: #cb4b16;
+}
+
+.highlight .p {
+ color: #586e75;
+}
+
+.highlight .cm {
+ color: #93a1a1;
+}
+
+.highlight .cp {
+ color: #859900;
+}
+
+.highlight .c1 {
+ color: #93a1a1;
+}
+
+.highlight .cs {
+ color: #859900;
+}
+
+.highlight .gd {
+ color: #2aa198;
+}
+
+.highlight .ge {
+ color: #586e75;
+ font-style: italic;
+}
+
+.highlight .gr {
+ color: #dc322f;
+}
+
+.highlight .gh {
+ color: #cb4b16;
+}
+
+.highlight .gi {
+ color: #859900;
+}
+
+.highlight .go,
+.highlight .gp {
+ color: #586e75;
+}
+
+.highlight .gs {
+ color: #586e75;
+ font-weight: bold;
+}
+
+.highlight .gu {
+ color: #cb4b16;
+}
+
+.highlight .gt {
+ color: #586e75;
+}
+
+.highlight .kc {
+ color: #cb4b16;
+}
+
+.highlight .kd {
+ color: #268bd2;
+}
+
+.highlight .kn,
+.highlight .kp {
+ color: #859900;
+}
+
+.highlight .kr {
+ color: #268bd2;
+}
+
+.highlight .kt {
+ color: #dc322f;
+}
+
+.highlight .ld {
+ color: #586e75;
+}
+
+.highlight .m,
+.highlight .s {
+ color: #2aa198;
+}
+
+.highlight .na {
+ color: #B58900;
+}
+
+.highlight .nb {
+ color: #586e75;
+}
+
+.highlight .nc {
+ color: #268bd2;
+}
+
+.highlight .no {
+ color: #cb4b16;
+}
+
+.highlight .nd {
+ color: #268bd2;
+}
+
+.highlight .ni,
+.highlight .ne {
+ color: #cb4b16;
+}
+
+.highlight .nf {
+ color: #268bd2;
+}
+
+.highlight .nl,
+.highlight .nn,
+.highlight .nx,
+.highlight .py {
+ color: #586e75;
+}
+
+.highlight .nt,
+.highlight .nv {
+ color: #268bd2;
+}
+
+.highlight .ow {
+ color: #859900;
+}
+
+.highlight .w {
+ color: #586e75;
+}
+
+.highlight .mf,
+.highlight .mh,
+.highlight .mi,
+.highlight .mo {
+ color: #2aa198;
+}
+
+.highlight .sb {
+ color: #93a1a1;
+}
+
+.highlight .sc {
+ color: #2aa198;
+}
+
+.highlight .sd {
+ color: #586e75;
+}
+
+.highlight .s2 {
+ color: #2aa198;
+}
+
+.highlight .se {
+ color: #cb4b16;
+}
+
+.highlight .sh {
+ color: #586e75;
+}
+
+.highlight .si,
+.highlight .sx {
+ color: #2aa198;
+}
+
+.highlight .sr {
+ color: #dc322f;
+}
+
+.highlight .s1,
+.highlight .ss {
+ color: #2aa198;
+}
+
+.highlight .bp,
+.highlight .vc,
+.highlight .vg,
+.highlight .vi {
+ color: #268bd2;
+}
+
+.highlight .il {
+ color: #2aa198;
+}
+
+.content .highlight {
+ text-align: left;
+}
+
+@media screen and (min-width: 769px), print {
+ .button small {
+ color: #4a4a4a;
+ left: 0;
+ margin-top: 10px;
+ position: absolute;
+ top: 100%;
+ width: 100%;
+ }
+}
+
+body.page-grid .column > .notification {
+ padding-left: 0;
+ padding-right: 0;
+ text-align: center;
+}
+
+@media screen and (min-width: 769px), print {
+ .header-item .button + .button {
+ margin-left: 0.75rem;
}
- .column.is-offset-2-fullhd {
- margin-left: 16.66667%;
+}
+
+svg {
+ max-height: 100%;
+ max-width: 100%;
+}
+
+#carbon {
+ margin-left: auto;
+ margin-right: auto;
+ max-width: 340px;
+ min-height: 150px;
+ padding: 0;
+ position: relative;
+}
+
+#carbon:hover {
+ -webkit-box-shadow: 0 2px 3px rgba(10, 10, 10, 0.1), 0 0 0 1px #00d1b2;
+ box-shadow: 0 2px 3px rgba(10, 10, 10, 0.1), 0 0 0 1px #00d1b2;
+}
+
+@media screen and (min-width: 769px), print {
+ #carbon {
+ width: 340px;
}
- .column.is-3-fullhd {
- -webkit-box-flex: 0;
- -ms-flex: none;
- flex: none;
- width: 25%;
+}
+
+#carbonads {
+ font-size: 14px;
+ text-align: left;
+}
+
+#carbonads a,
+#carbonads span {
+ display: block;
+}
+
+#carbonads .carbon-wrap {
+ position: relative;
+}
+
+#carbonads .carbon-img {
+ background: whitesmoke;
+ float: left;
+ height: 100px;
+ margin: 15px 0 15px 15px;
+ width: 130px;
+}
+
+#carbonads .carbon-img img {
+ display: block;
+ height: 100px;
+ width: 130px;
+}
+
+#carbonads .carbon-text {
+ display: block;
+ color: #363636;
+ line-height: 20px;
+ padding: 15px 15px 35px 160px;
+}
+
+#carbonads .carbon-poweredby {
+ bottom: 0;
+ color: #7a7a7a;
+ font-size: 0.75rem;
+ left: 160px;
+ line-height: 20px;
+ padding: 0 15px 10px 0;
+ position: absolute;
+ right: 0;
+}
+
+@-webkit-keyframes floatUp {
+ 0% {
+ -webkit-box-shadow: 0 0 0 rgba(10, 10, 10, 0), 0 0 0 rgba(10, 10, 10, 0), 0 0 0 rgba(10, 10, 10, 0);
+ box-shadow: 0 0 0 rgba(10, 10, 10, 0), 0 0 0 rgba(10, 10, 10, 0), 0 0 0 rgba(10, 10, 10, 0);
+ -webkit-transform: scale(0.86);
+ transform: scale(0.86);
}
- .column.is-offset-3-fullhd {
- margin-left: 25%;
+ 67% {
+ -webkit-box-shadow: 0 0 0 rgba(10, 10, 10, 0), 0 5px 10px rgba(10, 10, 10, 0.1), 0 1px 1px rgba(10, 10, 10, 0.2);
+ box-shadow: 0 0 0 rgba(10, 10, 10, 0), 0 5px 10px rgba(10, 10, 10, 0.1), 0 1px 1px rgba(10, 10, 10, 0.2);
+ -webkit-transform: scale(1);
+ transform: scale(1);
}
- .column.is-4-fullhd {
- -webkit-box-flex: 0;
- -ms-flex: none;
- flex: none;
- width: 33.33333%;
+ 100% {
+ -webkit-box-shadow: 0 20px 60px rgba(10, 10, 10, 0.05), 0 5px 10px rgba(10, 10, 10, 0.1), 0 1px 1px rgba(10, 10, 10, 0.2);
+ box-shadow: 0 20px 60px rgba(10, 10, 10, 0.05), 0 5px 10px rgba(10, 10, 10, 0.1), 0 1px 1px rgba(10, 10, 10, 0.2);
+ -webkit-transform: scale(1);
+ transform: scale(1);
}
- .column.is-offset-4-fullhd {
- margin-left: 33.33333%;
+}
+
+@keyframes floatUp {
+ 0% {
+ -webkit-box-shadow: 0 0 0 rgba(10, 10, 10, 0), 0 0 0 rgba(10, 10, 10, 0), 0 0 0 rgba(10, 10, 10, 0);
+ box-shadow: 0 0 0 rgba(10, 10, 10, 0), 0 0 0 rgba(10, 10, 10, 0), 0 0 0 rgba(10, 10, 10, 0);
+ -webkit-transform: scale(0.86);
+ transform: scale(0.86);
}
- .column.is-5-fullhd {
- -webkit-box-flex: 0;
- -ms-flex: none;
- flex: none;
- width: 41.66667%;
+ 67% {
+ -webkit-box-shadow: 0 0 0 rgba(10, 10, 10, 0), 0 5px 10px rgba(10, 10, 10, 0.1), 0 1px 1px rgba(10, 10, 10, 0.2);
+ box-shadow: 0 0 0 rgba(10, 10, 10, 0), 0 5px 10px rgba(10, 10, 10, 0.1), 0 1px 1px rgba(10, 10, 10, 0.2);
+ -webkit-transform: scale(1);
+ transform: scale(1);
}
- .column.is-offset-5-fullhd {
- margin-left: 41.66667%;
+ 100% {
+ -webkit-box-shadow: 0 20px 60px rgba(10, 10, 10, 0.05), 0 5px 10px rgba(10, 10, 10, 0.1), 0 1px 1px rgba(10, 10, 10, 0.2);
+ box-shadow: 0 20px 60px rgba(10, 10, 10, 0.05), 0 5px 10px rgba(10, 10, 10, 0.1), 0 1px 1px rgba(10, 10, 10, 0.2);
+ -webkit-transform: scale(1);
+ transform: scale(1);
}
- .column.is-6-fullhd {
- -webkit-box-flex: 0;
- -ms-flex: none;
- flex: none;
- width: 50%;
+}
+
+@-webkit-keyframes strokePath {
+ from {
+ stroke-dashoffset: 880;
}
- .column.is-offset-6-fullhd {
- margin-left: 50%;
+ to {
+ stroke-dashoffset: 0;
}
- .column.is-7-fullhd {
- -webkit-box-flex: 0;
- -ms-flex: none;
- flex: none;
- width: 58.33333%;
+}
+
+@keyframes strokePath {
+ from {
+ stroke-dashoffset: 880;
}
- .column.is-offset-7-fullhd {
- margin-left: 58.33333%;
+ to {
+ stroke-dashoffset: 0;
}
- .column.is-8-fullhd {
- -webkit-box-flex: 0;
- -ms-flex: none;
- flex: none;
- width: 66.66667%;
+}
+
+@-webkit-keyframes fadeIn {
+ from {
+ opacity: 0;
+ -webkit-transform: scale(0.86);
+ transform: scale(0.86);
}
- .column.is-offset-8-fullhd {
- margin-left: 66.66667%;
+ to {
+ opacity: 1;
+ -webkit-transform: scale(1);
+ transform: scale(1);
}
- .column.is-9-fullhd {
- -webkit-box-flex: 0;
- -ms-flex: none;
- flex: none;
- width: 75%;
+}
+
+@keyframes fadeIn {
+ from {
+ opacity: 0;
+ -webkit-transform: scale(0.86);
+ transform: scale(0.86);
}
- .column.is-offset-9-fullhd {
- margin-left: 75%;
+ to {
+ opacity: 1;
+ -webkit-transform: scale(1);
+ transform: scale(1);
}
- .column.is-10-fullhd {
- -webkit-box-flex: 0;
- -ms-flex: none;
- flex: none;
- width: 83.33333%;
+}
+
+@-webkit-keyframes fadeOut {
+ 0% {
+ opacity: 1;
+ -webkit-transform: scale(0.86);
+ transform: scale(0.86);
}
- .column.is-offset-10-fullhd {
- margin-left: 83.33333%;
+ 67% {
+ opacity: 1;
+ -webkit-transform: scale(0.86);
+ transform: scale(0.86);
}
- .column.is-11-fullhd {
- -webkit-box-flex: 0;
- -ms-flex: none;
- flex: none;
- width: 91.66667%;
+ 100% {
+ opacity: 0;
+ -webkit-transform: scale(1);
+ transform: scale(1);
}
- .column.is-offset-11-fullhd {
- margin-left: 91.66667%;
+}
+
+@keyframes fadeOut {
+ 0% {
+ opacity: 1;
+ -webkit-transform: scale(0.86);
+ transform: scale(0.86);
}
- .column.is-12-fullhd {
- -webkit-box-flex: 0;
- -ms-flex: none;
- flex: none;
- width: 100%;
+ 67% {
+ opacity: 1;
+ -webkit-transform: scale(0.86);
+ transform: scale(0.86);
}
- .column.is-offset-12-fullhd {
- margin-left: 100%;
+ 100% {
+ opacity: 0;
+ -webkit-transform: scale(1);
+ transform: scale(1);
}
}
-.columns {
- margin-left: -0.75rem;
- margin-right: -0.75rem;
- margin-top: -0.75rem;
-}
-
-.columns:last-child {
- margin-bottom: -0.75rem;
+@-webkit-keyframes slideDown {
+ 0% {
+ opacity: 0;
+ -webkit-transform: translateY(-10px);
+ transform: translateY(-10px);
+ }
+ 100% {
+ opacity: 1;
+ -webkit-transform: translateY(0);
+ transform: translateY(0);
+ }
}
-.columns:not(:last-child) {
- margin-bottom: 0.75rem;
+@keyframes slideDown {
+ 0% {
+ opacity: 0;
+ -webkit-transform: translateY(-10px);
+ transform: translateY(-10px);
+ }
+ 100% {
+ opacity: 1;
+ -webkit-transform: translateY(0);
+ transform: translateY(0);
+ }
}
-.columns.is-centered {
- -webkit-box-pack: center;
- -ms-flex-pack: center;
- justify-content: center;
+@-webkit-keyframes slideUp {
+ 0% {
+ opacity: 0;
+ -webkit-transform: translateY(10px);
+ transform: translateY(10px);
+ }
+ 100% {
+ opacity: 1;
+ -webkit-transform: translateY(0);
+ transform: translateY(0);
+ }
}
-.columns.is-gapless {
- margin-left: 0;
- margin-right: 0;
- margin-top: 0;
+@keyframes slideUp {
+ 0% {
+ opacity: 0;
+ -webkit-transform: translateY(10px);
+ transform: translateY(10px);
+ }
+ 100% {
+ opacity: 1;
+ -webkit-transform: translateY(0);
+ transform: translateY(0);
+ }
}
-.columns.is-gapless:last-child {
- margin-bottom: 0;
+#b {
+ -webkit-animation-duration: 1.5s;
+ animation-duration: 1.5s;
+ -webkit-animation-fill-mode: both;
+ animation-fill-mode: both;
+ -webkit-animation-name: floatUp;
+ animation-name: floatUp;
+ -webkit-animation-timing-function: cubic-bezier(0, 0.71, 0.29, 1);
+ animation-timing-function: cubic-bezier(0, 0.71, 0.29, 1);
+ border-radius: 24px;
+ display: inline-block;
+ height: 240px;
+ margin-bottom: 40px;
+ position: relative;
+ vertical-align: top;
+ width: 240px;
}
-.columns.is-gapless:not(:last-child) {
- margin-bottom: 1.5rem;
+#b svg {
+ bottom: 0;
+ left: 0;
+ position: absolute;
+ right: 0;
+ top: 0;
+ display: block;
+ height: 240px;
+ width: 240px;
+}
+
+#b svg:first-child {
+ -webkit-animation-duration: 1.5s;
+ animation-duration: 1.5s;
+ -webkit-animation-fill-mode: both;
+ animation-fill-mode: both;
+ -webkit-animation-name: fadeOut;
+ animation-name: fadeOut;
+ -webkit-animation-timing-function: cubic-bezier(0, 0.71, 0.29, 1);
+ animation-timing-function: cubic-bezier(0, 0.71, 0.29, 1);
+}
+
+#b svg:first-child g {
+ -webkit-animation-duration: 1s;
+ animation-duration: 1s;
+ -webkit-animation-fill-mode: both;
+ animation-fill-mode: both;
+ -webkit-animation-name: strokePath;
+ animation-name: strokePath;
+ -webkit-animation-timing-function: cubic-bezier(0, 0.71, 0.29, 1);
+ animation-timing-function: cubic-bezier(0, 0.71, 0.29, 1);
+ fill: none;
+ stroke: #00d1b2;
+ stroke-dasharray: 880;
+ stroke-width: 2px;
+}
+
+#b svg:last-child {
+ -webkit-animation-delay: 1s;
+ animation-delay: 1s;
+ -webkit-animation-duration: 1s;
+ animation-duration: 1s;
+ -webkit-animation-fill-mode: both;
+ animation-fill-mode: both;
+ -webkit-animation-name: fadeIn;
+ animation-name: fadeIn;
+ -webkit-animation-timing-function: cubic-bezier(0, 0.71, 0.29, 1);
+ animation-timing-function: cubic-bezier(0, 0.71, 0.29, 1);
+}
+
+#b svg:last-child g {
+ fill: #00d1b2;
}
-.columns.is-gapless > .column {
- margin: 0;
- padding: 0;
+@media screen and (max-width: 768px) {
+ #b {
+ border-radius: 16px;
+ height: 160px;
+ width: 160px;
+ }
}
-@media screen and (min-width: 769px), print {
- .columns.is-grid {
- -ms-flex-wrap: wrap;
- flex-wrap: wrap;
- }
- .columns.is-grid > .column {
- max-width: 33.3333%;
- padding: 0.75rem;
- width: 33.3333%;
- }
- .columns.is-grid > .column + .column {
- margin-left: 0;
- }
+#bulma {
+ -webkit-animation: slideDown 500ms both;
+ animation: slideDown 500ms both;
}
-.columns.is-mobile {
+#modern-framework {
+ -webkit-animation: slideUp 500ms both;
+ animation: slideUp 500ms both;
+ -webkit-animation-delay: 0.2s;
+ animation-delay: 0.2s;
+}
+
+#npm {
+ -webkit-box-align: center;
+ -ms-flex-align: center;
+ align-items: center;
+ -webkit-animation: fadeIn 500ms both;
+ animation: fadeIn 500ms both;
+ -webkit-animation-delay: 0.4s;
+ animation-delay: 0.4s;
+ background: none;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
+ -webkit-box-pack: center;
+ -ms-flex-pack: center;
+ justify-content: center;
+ margin: -10px 0 20px;
}
-.columns.is-multiline {
- -ms-flex-wrap: wrap;
- flex-wrap: wrap;
+#npm code {
+ background: whitesmoke;
+ border-radius: 3px;
+ color: #00d1b2;
+ display: inline-block;
+ font-size: 16px;
+ padding: 16px 32px;
}
-.columns.is-vcentered {
- -webkit-box-align: center;
- -ms-flex-align: center;
- align-items: center;
+#ghbtns {
+ -webkit-animation: slideDown 500ms both;
+ animation: slideDown 500ms both;
+ -webkit-animation-delay: 0.6s;
+ animation-delay: 0.6s;
}
-@media screen and (min-width: 769px), print {
- .columns:not(.is-desktop) {
- display: -webkit-box;
- display: -ms-flexbox;
- display: flex;
- }
+html.route-index #carbon {
+ -webkit-animation: slideUp 500ms both;
+ animation: slideUp 500ms both;
+ -webkit-animation-delay: 0.8s;
+ animation-delay: 0.8s;
}
-@media screen and (min-width: 1008px) {
- .columns.is-desktop {
- display: -webkit-box;
- display: -ms-flexbox;
- display: flex;
- }
+#download {
+ -webkit-animation: fadeIn 500ms both;
+ animation: fadeIn 500ms both;
+ -webkit-animation-delay: 1s;
+ animation-delay: 1s;
}
-.tile {
- -webkit-box-align: stretch;
- -ms-flex-align: stretch;
- align-items: stretch;
- display: block;
- -ms-flex-preferred-size: 0;
- flex-basis: 0;
- -webkit-box-flex: 1;
- -ms-flex-positive: 1;
- flex-grow: 1;
- -ms-flex-negative: 1;
- flex-shrink: 1;
- min-height: -webkit-min-content;
- min-height: -moz-min-content;
- min-height: min-content;
+#grid .notification {
+ padding-left: 0;
+ padding-right: 0;
}
-.tile.is-ancestor {
- margin-left: -0.75rem;
- margin-right: -0.75rem;
- margin-top: -0.75rem;
+#message {
+ display: none;
}
-.tile.is-ancestor:last-child {
- margin-bottom: -0.75rem;
+#tweet {
+ background: white;
+ border-radius: 5px;
+ -webkit-box-shadow: 0 2px 3px rgba(10, 10, 10, 0.1), 0 0 0 1px rgba(10, 10, 10, 0.1);
+ box-shadow: 0 2px 3px rgba(10, 10, 10, 0.1), 0 0 0 1px rgba(10, 10, 10, 0.1);
+ padding: 1.5rem;
}
-.tile.is-ancestor:not(:last-child) {
- margin-bottom: 0.75rem;
+#github {
+ color: #333333;
+ border-color: #333333;
}
-.tile.is-child {
- margin: 0 !important;
+#github:hover {
+ background: #333333;
+ border-color: #333333;
+ color: white;
}
-.tile.is-parent {
- padding: 0.75rem;
+.tw-button {
+ background-color: #55acee;
+ color: white;
+ border-color: transparent !important;
}
-.tile.is-vertical {
- -webkit-box-orient: vertical;
- -webkit-box-direction: normal;
- -ms-flex-direction: column;
- flex-direction: column;
+.tw-button:hover {
+ background-color: #49a6ed;
+ color: white;
}
-.tile.is-vertical > .tile.is-child:not(:last-child) {
- margin-bottom: 1.5rem !important;
+.tw-button:active, .tw-button:focus {
+ background-color: #3ea1ec;
+ color: white;
}
-@media screen and (min-width: 769px), print {
- .tile:not(.is-child) {
- display: -webkit-box;
- display: -ms-flexbox;
- display: flex;
- }
- .tile.is-1 {
- -webkit-box-flex: 0;
- -ms-flex: none;
- flex: none;
- width: 8.33333%;
- }
- .tile.is-2 {
- -webkit-box-flex: 0;
- -ms-flex: none;
- flex: none;
- width: 16.66667%;
- }
- .tile.is-3 {
- -webkit-box-flex: 0;
- -ms-flex: none;
- flex: none;
- width: 25%;
- }
- .tile.is-4 {
- -webkit-box-flex: 0;
- -ms-flex: none;
- flex: none;
- width: 33.33333%;
- }
- .tile.is-5 {
- -webkit-box-flex: 0;
- -ms-flex: none;
- flex: none;
- width: 41.66667%;
- }
- .tile.is-6 {
- -webkit-box-flex: 0;
- -ms-flex: none;
- flex: none;
- width: 50%;
- }
- .tile.is-7 {
- -webkit-box-flex: 0;
- -ms-flex: none;
- flex: none;
- width: 58.33333%;
- }
- .tile.is-8 {
- -webkit-box-flex: 0;
- -ms-flex: none;
- flex: none;
- width: 66.66667%;
+@media screen and (min-width: 1008px) {
+ #blogDropdown {
+ width: 16rem;
}
- .tile.is-9 {
- -webkit-box-flex: 0;
- -ms-flex: none;
- flex: none;
- width: 75%;
+ #blogDropdown .navbar-item {
+ white-space: normal;
}
- .tile.is-10 {
- -webkit-box-flex: 0;
- -ms-flex: none;
- flex: none;
- width: 83.33333%;
+ #moreDropdown {
+ width: 16rem;
}
- .tile.is-11 {
- -webkit-box-flex: 0;
- -ms-flex: none;
- flex: none;
- width: 91.66667%;
+ #moreDropdown .navbar-item {
+ padding-right: 1rem;
}
- .tile.is-12 {
- -webkit-box-flex: 0;
- -ms-flex: none;
- flex: none;
- width: 100%;
+ #moreDropdown .navbar-item .level {
+ -webkit-box-flex: 1;
+ -ms-flex-positive: 1;
+ flex-grow: 1;
}
}
-.hero {
- -webkit-box-align: stretch;
- -ms-flex-align: stretch;
- align-items: stretch;
- display: -webkit-box;
- display: -ms-flexbox;
- display: flex;
- -webkit-box-orient: vertical;
- -webkit-box-direction: normal;
- -ms-flex-direction: column;
- flex-direction: column;
- -webkit-box-pack: justify;
- -ms-flex-pack: justify;
- justify-content: space-between;
-}
-
-.hero .nav {
- background: none;
- -webkit-box-shadow: 0 1px 0 rgba(219, 219, 219, 0.3);
- box-shadow: 0 1px 0 rgba(219, 219, 219, 0.3);
+#about .twitter-container {
+ display: block;
+ height: 30px;
+ line-height: 30px;
+ margin-top: 5px;
}
-.hero .tabs ul {
- border-bottom: none;
+#about small {
+ display: block;
+ margin-top: 5px;
}
-.hero.is-white {
- background-color: white;
- color: #0a0a0a;
+#mc_embed_signup .field {
+ margin-bottom: 0;
}
-.hero.is-white a:not(.button),
-.hero.is-white strong {
- color: inherit;
+#mc_embed_signup .notification {
+ margin-top: 0.75rem;
}
-.hero.is-white .title {
- color: #0a0a0a;
+#share form {
+ height: 30px;
+ margin-top: 10px;
}
-.hero.is-white .subtitle {
- color: rgba(10, 10, 10, 0.9);
+#social {
+ -webkit-box-align: center;
+ -ms-flex-align: center;
+ align-items: center;
+ display: -webkit-box;
+ display: -ms-flexbox;
+ display: flex;
+ -ms-flex-wrap: wrap;
+ flex-wrap: wrap;
+ -webkit-box-pack: start;
+ -ms-flex-pack: start;
+ justify-content: flex-start;
}
-.hero.is-white .subtitle a:not(.button),
-.hero.is-white .subtitle strong {
- color: #0a0a0a;
+#social > iframe,
+#social > a,
+#social > form,
+#social > div {
+ display: inline-block;
+ font-size: 11px;
+ height: 30px;
+ line-height: 30px;
+ margin-top: 5px;
}
-.hero.is-white .nav {
- -webkit-box-shadow: 0 1px 0 rgba(10, 10, 10, 0.2);
- box-shadow: 0 1px 0 rgba(10, 10, 10, 0.2);
+#social .github-btn {
+ width: 160px;
}
-@media screen and (max-width: 768px) {
- .hero.is-white .nav-menu {
- background-color: white;
- }
+#social .twitter-share-button {
+ margin-right: 10px;
+ min-width: 76px;
}
-.hero.is-white a.nav-item,
-.hero.is-white .nav-item a:not(.button) {
- color: rgba(10, 10, 10, 0.7);
+#social .paypal-form {
+ min-width: 148px;
}
-.hero.is-white a.nav-item:hover, .hero.is-white a.nav-item.is-active,
-.hero.is-white .nav-item a:not(.button):hover,
-.hero.is-white .nav-item a:not(.button).is-active {
- color: #0a0a0a;
+#social .fb-like {
+ -webkit-box-align: center;
+ -ms-flex-align: center;
+ align-items: center;
+ display: -webkit-box;
+ display: -ms-flexbox;
+ display: flex;
+ width: 130px;
}
-.hero.is-white .tabs a {
- color: #0a0a0a;
- opacity: 0.9;
+#newsletter .input {
+ border-color: white;
+ -webkit-box-shadow: none;
+ box-shadow: none;
}
-.hero.is-white .tabs a:hover {
- opacity: 1;
+#sister ul {
+ display: -webkit-box;
+ display: -ms-flexbox;
+ display: flex;
+ -ms-flex-wrap: wrap;
+ flex-wrap: wrap;
}
-.hero.is-white .tabs li.is-active a {
- opacity: 1;
+#sister li {
+ display: -webkit-box;
+ display: -ms-flexbox;
+ display: flex;
+ height: 30px;
+ margin: 5px 1rem 0 0;
}
-.hero.is-white .tabs.is-boxed a, .hero.is-white .tabs.is-toggle a {
- color: #0a0a0a;
+#sister img {
+ height: 30px;
}
-.hero.is-white .tabs.is-boxed a:hover, .hero.is-white .tabs.is-toggle a:hover {
- background-color: rgba(10, 10, 10, 0.1);
+#tsp small {
+ display: block;
}
-.hero.is-white .tabs.is-boxed li.is-active a, .hero.is-white .tabs.is-boxed li.is-active a:hover, .hero.is-white .tabs.is-toggle li.is-active a, .hero.is-white .tabs.is-toggle li.is-active a:hover {
- background-color: #0a0a0a;
- border-color: #0a0a0a;
- color: white;
+#alternative {
+ font-size: 0.875rem;
}
-.hero.is-white.is-bold {
- background-image: linear-gradient(141deg, #e6e6e6 0%, white 71%, white 100%);
+#alternative a {
+ color: #7a7a7a;
}
-@media screen and (max-width: 768px) {
- .hero.is-white.is-bold .nav-menu {
- background-image: linear-gradient(141deg, #e6e6e6 0%, white 71%, white 100%);
- }
+#alternative a:hover {
+ text-decoration: underline;
}
-@media screen and (max-width: 768px) {
- .hero.is-white .nav-toggle span {
- background-color: #0a0a0a;
- }
- .hero.is-white .nav-toggle:hover {
- background-color: rgba(10, 10, 10, 0.1);
- }
- .hero.is-white .nav-toggle.is-active span {
- background-color: #0a0a0a;
- }
- .hero.is-white .nav-menu .nav-item {
- border-top-color: rgba(10, 10, 10, 0.2);
- }
+#images tr td:nth-child(2) {
+ width: 320px;
}
-.hero.is-black {
- background-color: #0a0a0a;
- color: white;
+.color {
+ border-radius: 2px;
+ -webkit-box-shadow: 0 2px 3px 0 rgba(0, 0, 0, 0.1), inset 0 0 0 1px rgba(0, 0, 0, 0.1);
+ box-shadow: 0 2px 3px 0 rgba(0, 0, 0, 0.1), inset 0 0 0 1px rgba(0, 0, 0, 0.1);
+ display: inline-block;
+ float: left;
+ height: 24px;
+ margin-right: 8px;
+ width: 24px;
}
-.hero.is-black a:not(.button),
-.hero.is-black strong {
- color: inherit;
+.button.is-rss {
+ background-color: #f26522;
+ border-color: transparent;
+ color: #fff;
}
-.hero.is-black .title {
- color: white;
+.button.is-rss:hover {
+ background-color: #ed560e;
}
-.hero.is-black .subtitle {
- color: rgba(255, 255, 255, 0.9);
+.button.is-rss:active {
+ background-color: #d54d0d;
}
-.hero.is-black .subtitle a:not(.button),
-.hero.is-black .subtitle strong {
- color: white;
+.view-all-versions {
+ color: #7a7a7a;
}
-.hero.is-black .nav {
- -webkit-box-shadow: 0 1px 0 rgba(255, 255, 255, 0.2);
- box-shadow: 0 1px 0 rgba(255, 255, 255, 0.2);
+.view-all-versions:hover {
+ text-decoration: underline;
}
-@media screen and (max-width: 768px) {
- .hero.is-black .nav-menu {
- background-color: #0a0a0a;
- }
+.feature-title {
+ color: #7a7a7a;
}
-.hero.is-black a.nav-item,
-.hero.is-black .nav-item a:not(.button) {
- color: rgba(255, 255, 255, 0.7);
+.feature-title a {
+ border-bottom: 1px solid transparent;
+ color: #363636;
}
-.hero.is-black a.nav-item:hover, .hero.is-black a.nav-item.is-active,
-.hero.is-black .nav-item a:not(.button):hover,
-.hero.is-black .nav-item a:not(.button).is-active {
- color: white;
+.feature-title a:hover {
+ border-bottom-color: #00d1b2;
}
-.hero.is-black .tabs a {
- color: white;
- opacity: 0.9;
+.anchor-title {
+ padding-top: 1.5rem;
+ position: relative;
}
-.hero.is-black .tabs a:hover {
- opacity: 1;
+@media screen and (max-width: 1199px) {
+ .anchor-title {
+ padding-left: 2rem;
+ }
}
-.hero.is-black .tabs li.is-active a {
- opacity: 1;
+.anchor-link {
+ position: absolute;
+ right: calc(100% + 1rem);
}
-.hero.is-black .tabs.is-boxed a, .hero.is-black .tabs.is-toggle a {
- color: white;
+@media screen and (max-width: 1199px) {
+ .anchor-link {
+ left: 0;
+ right: auto;
+ }
}
-.hero.is-black .tabs.is-boxed a:hover, .hero.is-black .tabs.is-toggle a:hover {
- background-color: rgba(10, 10, 10, 0.1);
+.article-image {
+ background-color: #00d1b2;
+ display: block;
+ height: 240px;
+ margin-left: auto;
+ margin-right: auto;
+ position: relative;
+ text-align: center;
}
-.hero.is-black .tabs.is-boxed li.is-active a, .hero.is-black .tabs.is-boxed li.is-active a:hover, .hero.is-black .tabs.is-toggle li.is-active a, .hero.is-black .tabs.is-toggle li.is-active a:hover {
+.article-image.is-white {
background-color: white;
- border-color: white;
- color: #0a0a0a;
}
-.hero.is-black.is-bold {
- background-image: linear-gradient(141deg, black 0%, #0a0a0a 71%, #181616 100%);
+.article-image.is-black {
+ background-color: #0a0a0a;
}
-@media screen and (max-width: 768px) {
- .hero.is-black.is-bold .nav-menu {
- background-image: linear-gradient(141deg, black 0%, #0a0a0a 71%, #181616 100%);
- }
+.article-image.is-light {
+ background-color: whitesmoke;
}
-@media screen and (max-width: 768px) {
- .hero.is-black .nav-toggle span {
- background-color: white;
- }
- .hero.is-black .nav-toggle:hover {
- background-color: rgba(10, 10, 10, 0.1);
- }
- .hero.is-black .nav-toggle.is-active span {
- background-color: white;
- }
- .hero.is-black .nav-menu .nav-item {
- border-top-color: rgba(255, 255, 255, 0.2);
- }
+.article-image.is-dark {
+ background-color: #363636;
}
-.hero.is-light {
- background-color: whitesmoke;
- color: #363636;
+.article-image.is-primary {
+ background-color: #00d1b2;
}
-.hero.is-light a:not(.button),
-.hero.is-light strong {
- color: inherit;
+.article-image.is-info {
+ background-color: #3273dc;
}
-.hero.is-light .title {
- color: #363636;
+.article-image.is-success {
+ background-color: #23d160;
}
-.hero.is-light .subtitle {
- color: rgba(54, 54, 54, 0.9);
+.article-image.is-warning {
+ background-color: #ffdd57;
}
-.hero.is-light .subtitle a:not(.button),
-.hero.is-light .subtitle strong {
- color: #363636;
+.article-image.is-danger {
+ background-color: #ff3860;
}
-.hero.is-light .nav {
- -webkit-box-shadow: 0 1px 0 rgba(54, 54, 54, 0.2);
- box-shadow: 0 1px 0 rgba(54, 54, 54, 0.2);
+.article-image.is-bootstrap {
+ background-color: #6f5499;
}
-@media screen and (max-width: 768px) {
- .hero.is-light .nav-menu {
- background-color: whitesmoke;
- }
+.article-image.is-orange {
+ background-color: #ff470f;
}
-.hero.is-light a.nav-item,
-.hero.is-light .nav-item a:not(.button) {
- color: rgba(54, 54, 54, 0.7);
+.article-image:hover .article-overlay {
+ opacity: 0.25;
}
-.hero.is-light a.nav-item:hover, .hero.is-light a.nav-item.is-active,
-.hero.is-light .nav-item a:not(.button):hover,
-.hero.is-light .nav-item a:not(.button).is-active {
- color: #363636;
+.article-image:hover .article-icon {
+ -webkit-transform: scale(1.4);
+ transform: scale(1.4);
}
-.hero.is-light .tabs a {
- color: #363636;
- opacity: 0.9;
+.article-image:hover .article-date {
+ -webkit-transform: scale(0.9);
+ transform: scale(0.9);
}
-.hero.is-light .tabs a:hover {
- opacity: 1;
+.article-image:hover .article-title {
+ -webkit-transform: scale(1.1);
+ transform: scale(1.1);
}
-.hero.is-light .tabs li.is-active a {
- opacity: 1;
+.article-image.is-single {
+ margin-bottom: 2rem;
+ width: 100%;
}
-.hero.is-light .tabs.is-boxed a, .hero.is-light .tabs.is-toggle a {
- color: #363636;
+.article-overlay {
+ bottom: 0;
+ left: 0;
+ position: absolute;
+ right: 0;
+ top: 0;
+ background-color: #0a0a0a;
+ opacity: 0;
+ -webkit-transition-duration: 86ms;
+ transition-duration: 86ms;
+ -webkit-transition-property: opacity;
+ transition-property: opacity;
+ -webkit-transition-timing-function: ease-out;
+ transition-timing-function: ease-out;
}
-.hero.is-light .tabs.is-boxed a:hover, .hero.is-light .tabs.is-toggle a:hover {
- background-color: rgba(10, 10, 10, 0.1);
+.article-icon,
+.article-info {
+ bottom: 0;
+ left: 0;
+ position: absolute;
+ right: 0;
+ top: 0;
+ -webkit-box-align: center;
+ -ms-flex-align: center;
+ align-items: center;
+ display: -webkit-box;
+ display: -ms-flexbox;
+ display: flex;
+ -webkit-box-pack: center;
+ -ms-flex-pack: center;
+ justify-content: center;
}
-.hero.is-light .tabs.is-boxed li.is-active a, .hero.is-light .tabs.is-boxed li.is-active a:hover, .hero.is-light .tabs.is-toggle li.is-active a, .hero.is-light .tabs.is-toggle li.is-active a:hover {
- background-color: #363636;
- border-color: #363636;
- color: whitesmoke;
+.article-icon,
+.article-date,
+.article-title {
+ -webkit-transition-duration: 86ms;
+ transition-duration: 86ms;
+ -webkit-transition-property: -webkit-transform;
+ transition-property: -webkit-transform;
+ transition-property: transform;
+ transition-property: transform, -webkit-transform;
+ -webkit-transition-timing-function: ease-out;
+ transition-timing-function: ease-out;
}
-.hero.is-light.is-bold {
- background-image: linear-gradient(141deg, #dfd8d9 0%, whitesmoke 71%, white 100%);
+.article-icon {
+ color: #0a0a0a;
+ opacity: 0.25;
}
-@media screen and (max-width: 768px) {
- .hero.is-light.is-bold .nav-menu {
- background-image: linear-gradient(141deg, #dfd8d9 0%, whitesmoke 71%, white 100%);
- }
+.article-icon > span {
+ display: block;
}
-@media screen and (max-width: 768px) {
- .hero.is-light .nav-toggle span {
- background-color: #363636;
- }
- .hero.is-light .nav-toggle:hover {
- background-color: rgba(10, 10, 10, 0.1);
- }
- .hero.is-light .nav-toggle.is-active span {
- background-color: #363636;
- }
- .hero.is-light .nav-menu .nav-item {
- border-top-color: rgba(54, 54, 54, 0.2);
- }
+.article-icon .fa {
+ font-size: 56px;
}
-.hero.is-dark {
- background-color: #363636;
- color: whitesmoke;
+.article-info {
+ padding: 20px;
}
-.hero.is-dark a:not(.button),
-.hero.is-dark strong {
- color: inherit;
+.article-date {
+ color: rgba(0, 0, 0, 0.5);
+ display: block;
}
-.hero.is-dark .title {
- color: whitesmoke;
+.article-title {
+ color: white;
+ display: block;
+ font-size: 2.5rem;
+ font-weight: 700;
+ line-height: 1.25;
+ padding: 0 20px;
}
-.hero.is-dark .subtitle {
- color: rgba(245, 245, 245, 0.9);
+.emoji {
+ margin-right: 0.5em;
+ margin-top: 2px;
}
-.hero.is-dark .subtitle a:not(.button),
-.hero.is-dark .subtitle strong {
- color: whitesmoke;
+.example,
+.structure {
+ border: 1px solid #ffdd57;
+ border-top-right-radius: 3px;
+ color: rgba(0, 0, 0, 0.7);
+ padding: 1.5rem;
+ position: relative;
+}
+
+.example:not(:first-child),
+.structure:not(:first-child) {
+ margin-top: 2rem;
}
-.hero.is-dark .nav {
- -webkit-box-shadow: 0 1px 0 rgba(245, 245, 245, 0.2);
- box-shadow: 0 1px 0 rgba(245, 245, 245, 0.2);
+.example:not(:last-child),
+.structure:not(:last-child) {
+ margin-bottom: 1.5rem;
}
-@media screen and (max-width: 768px) {
- .hero.is-dark .nav-menu {
- background-color: #363636;
- }
+.example:before,
+.structure:before {
+ background: #ffdd57;
+ border-radius: 3px 3px 0 0;
+ bottom: 100%;
+ content: "Example";
+ display: inline-block;
+ font-size: 7px;
+ font-weight: bold;
+ left: -1px;
+ letter-spacing: 1px;
+ padding: 3px 5px;
+ position: absolute;
+ text-transform: uppercase;
+ vertical-align: top;
}
-.hero.is-dark a.nav-item,
-.hero.is-dark .nav-item a:not(.button) {
- color: rgba(245, 245, 245, 0.7);
+@media screen and (min-width: 769px), print {
+ .example.is-fullwidth,
+ .structure.is-fullwidth {
+ border-left: none;
+ border-right: none;
+ padding: 0;
+ }
}
-.hero.is-dark a.nav-item:hover, .hero.is-dark a.nav-item.is-active,
-.hero.is-dark .nav-item a:not(.button):hover,
-.hero.is-dark .nav-item a:not(.button).is-active {
- color: whitesmoke;
+.example + .highlight {
+ border: 1px solid #ffdd57;
+ border-radius: 0 0 3px 3px;
+ border-top: none;
+ margin-top: -1.5rem;
}
-.hero.is-dark .tabs a {
- color: whitesmoke;
- opacity: 0.9;
+.example + .highlight:not(:last-child) {
+ margin-bottom: 1.5rem;
}
-.hero.is-dark .tabs a:hover {
- opacity: 1;
+.highlight pre {
+ max-height: 480px;
+ margin-bottom: 0 !important;
+ padding: 0;
}
-.hero.is-dark .tabs li.is-active a {
- opacity: 1;
+.highlight pre code {
+ padding: 1.25em 1.5em;
}
-.hero.is-dark .tabs.is-boxed a, .hero.is-dark .tabs.is-toggle a {
- color: whitesmoke;
+.highlight-full .highlight pre,
+#navbarJsExample .highlight pre {
+ max-height: none;
}
-.hero.is-dark .tabs.is-boxed a:hover, .hero.is-dark .tabs.is-toggle a:hover {
- background-color: rgba(10, 10, 10, 0.1);
+.structure {
+ border-color: #ff3860;
+ border-radius: 3px;
+ padding: 1.5rem;
}
-.hero.is-dark .tabs.is-boxed li.is-active a, .hero.is-dark .tabs.is-boxed li.is-active a:hover, .hero.is-dark .tabs.is-toggle li.is-active a, .hero.is-dark .tabs.is-toggle li.is-active a:hover {
- background-color: whitesmoke;
- border-color: whitesmoke;
- color: #363636;
+.structure:before {
+ background: #ff3860;
+ color: #fff;
+ content: "Structure";
}
-.hero.is-dark.is-bold {
- background-image: linear-gradient(141deg, #1f191a 0%, #363636 71%, #46403f 100%);
+.structure-item {
+ position: relative;
}
-@media screen and (max-width: 768px) {
- .hero.is-dark.is-bold .nav-menu {
- background-image: linear-gradient(141deg, #1f191a 0%, #363636 71%, #46403f 100%);
- }
+.structure-item:before {
+ bottom: 0;
+ left: 0;
+ position: absolute;
+ right: 0;
+ top: 0;
+ background: rgba(10, 10, 10, 0.7);
+ background: whitesmoke;
+ border: 1px solid #dbdbdb;
+ content: "";
+ display: block;
+ z-index: 1;
}
-@media screen and (max-width: 768px) {
- .hero.is-dark .nav-toggle span {
- background-color: whitesmoke;
- }
- .hero.is-dark .nav-toggle:hover {
- background-color: rgba(10, 10, 10, 0.1);
- }
- .hero.is-dark .nav-toggle.is-active span {
- background-color: whitesmoke;
- }
- .hero.is-dark .nav-menu .nav-item {
- border-top-color: rgba(245, 245, 245, 0.2);
- }
+.structure-item:after {
+ bottom: 0;
+ left: 0;
+ position: absolute;
+ right: 0;
+ top: 0;
+ -webkit-box-align: center;
+ -ms-flex-align: center;
+ align-items: center;
+ content: attr(title);
+ display: -webkit-box;
+ display: -ms-flexbox;
+ display: flex;
+ font-family: monospace;
+ font-size: 11px;
+ -webkit-box-pack: center;
+ -ms-flex-pack: center;
+ justify-content: center;
+ padding: 3px 5px;
+ z-index: 2;
}
-.hero.is-primary {
- background-color: #00d1b2;
- color: #fff;
+.structure-item.is-structure-container {
+ padding: 1.5rem 0.75rem 0.75rem;
}
-.hero.is-primary a:not(.button),
-.hero.is-primary strong {
- color: inherit;
+.structure-item.is-structure-container:after {
+ -webkit-box-align: start;
+ -ms-flex-align: start;
+ align-items: flex-start;
+ -webkit-box-pack: start;
+ -ms-flex-pack: start;
+ justify-content: flex-start;
+ padding: 0.5rem 0.75rem;
}
-.hero.is-primary .title {
- color: #fff;
+.highlight {
+ position: relative;
}
-.hero.is-primary .subtitle {
- color: rgba(255, 255, 255, 0.9);
+.highlight .copy,
+.highlight .expand {
+ -webkit-touch-callout: none;
+ -webkit-user-select: none;
+ -moz-user-select: none;
+ -ms-user-select: none;
+ user-select: none;
+ background: white;
+ border: solid #dbdbdb;
+ border-width: 0 0 1px 1px;
+ color: #7a7a7a;
+ cursor: pointer;
+ outline: none;
+ position: absolute;
+ right: 0;
+ top: 0;
}
-.hero.is-primary .subtitle a:not(.button),
-.hero.is-primary .subtitle strong {
- color: #fff;
+.highlight .copy:hover,
+.highlight .expand:hover {
+ border-color: #ff3860;
+ color: #ff3860;
}
-.hero.is-primary .nav {
- -webkit-box-shadow: 0 1px 0 rgba(255, 255, 255, 0.2);
- box-shadow: 0 1px 0 rgba(255, 255, 255, 0.2);
+.highlight .expand {
+ border-right-width: 1px;
+ right: 50px;
}
-@media screen and (max-width: 768px) {
- .hero.is-primary .nav-menu {
- background-color: #00d1b2;
+@media screen and (min-width: 769px), print {
+ .highlight pre {
+ white-space: pre-wrap;
}
}
-.hero.is-primary a.nav-item,
-.hero.is-primary .nav-item a:not(.button) {
- color: rgba(255, 255, 255, 0.7);
+@media screen and (min-width: 769px), print {
+ .section:not(.is-fullwidth) > .example:not(.is-fullwidth) {
+ margin-left: 1.5rem;
+ margin-right: 1.5rem;
+ }
+ .section:not(.is-fullwidth) > .example:not(.is-fullwidth) + .highlight {
+ margin-left: 1.5rem;
+ margin-right: 1.5rem;
+ }
}
-.hero.is-primary a.nav-item:hover, .hero.is-primary a.nav-item.is-active,
-.hero.is-primary .nav-item a:not(.button):hover,
-.hero.is-primary .nav-item a:not(.button).is-active {
- color: #fff;
+.section.is-fullwidth {
+ padding: 0 !important;
}
-.hero.is-primary .tabs a {
- color: #fff;
- opacity: 0.9;
+.section.is-fullwidth .example {
+ border-left: none;
+ border-radius: 0;
+ border-right: none;
+ padding: 0;
}
-.hero.is-primary .tabs a:hover {
- opacity: 1;
+.section.is-fullwidth .example + .highlight {
+ border-left: none;
+ border-radius: 0;
+ border-right: none;
}
-.hero.is-primary .tabs li.is-active a {
- opacity: 1;
+.callout {
+ background-color: whitesmoke;
+ border-radius: 3px;
+ padding: 1.25rem 2.5rem 1.25rem 1.5rem;
+ position: relative;
}
-.hero.is-primary .tabs.is-boxed a, .hero.is-primary .tabs.is-toggle a {
- color: #fff;
+.callout:not(:last-child) {
+ margin-bottom: 1.5rem;
}
-.hero.is-primary .tabs.is-boxed a:hover, .hero.is-primary .tabs.is-toggle a:hover {
- background-color: rgba(10, 10, 10, 0.1);
+.callout.is-white {
+ background-color: white;
+ color: #0a0a0a;
}
-.hero.is-primary .tabs.is-boxed li.is-active a, .hero.is-primary .tabs.is-boxed li.is-active a:hover, .hero.is-primary .tabs.is-toggle li.is-active a, .hero.is-primary .tabs.is-toggle li.is-active a:hover {
- background-color: #fff;
- border-color: #fff;
- color: #00d1b2;
+.callout.is-black {
+ background-color: #0a0a0a;
+ color: white;
}
-.hero.is-primary.is-bold {
- background-image: linear-gradient(141deg, #009e6c 0%, #00d1b2 71%, #00e7eb 100%);
+.callout.is-light {
+ background-color: whitesmoke;
+ color: #363636;
}
-@media screen and (max-width: 768px) {
- .hero.is-primary.is-bold .nav-menu {
- background-image: linear-gradient(141deg, #009e6c 0%, #00d1b2 71%, #00e7eb 100%);
- }
+.callout.is-dark {
+ background-color: #363636;
+ color: whitesmoke;
}
-@media screen and (max-width: 768px) {
- .hero.is-primary .nav-toggle span {
- background-color: #fff;
- }
- .hero.is-primary .nav-toggle:hover {
- background-color: rgba(10, 10, 10, 0.1);
- }
- .hero.is-primary .nav-toggle.is-active span {
- background-color: #fff;
- }
- .hero.is-primary .nav-menu .nav-item {
- border-top-color: rgba(255, 255, 255, 0.2);
- }
+.callout.is-primary {
+ background-color: #00d1b2;
+ color: #fff;
}
-.hero.is-info {
+.callout.is-info {
background-color: #3273dc;
color: #fff;
}
-.hero.is-info a:not(.button),
-.hero.is-info strong {
- color: inherit;
-}
-
-.hero.is-info .title {
+.callout.is-success {
+ background-color: #23d160;
color: #fff;
}
-.hero.is-info .subtitle {
- color: rgba(255, 255, 255, 0.9);
+.callout.is-warning {
+ background-color: #ffdd57;
+ color: rgba(0, 0, 0, 0.7);
}
-.hero.is-info .subtitle a:not(.button),
-.hero.is-info .subtitle strong {
+.callout.is-danger {
+ background-color: #ff3860;
color: #fff;
}
-.hero.is-info .nav {
- -webkit-box-shadow: 0 1px 0 rgba(255, 255, 255, 0.2);
- box-shadow: 0 1px 0 rgba(255, 255, 255, 0.2);
+.bsa {
+ padding: 2rem;
}
-@media screen and (max-width: 768px) {
- .hero.is-info .nav-menu {
- background-color: #3273dc;
- }
+.bsa-cpc {
+ min-height: 1px;
}
-.hero.is-info a.nav-item,
-.hero.is-info .nav-item a:not(.button) {
- color: rgba(255, 255, 255, 0.7);
+#_default_ .default-ad {
+ background-color: rgba(0, 0, 0, 0.3);
+ border-radius: 2px;
+ color: white;
+ display: inline-block;
+ font-size: 10px;
+ font-weight: bold;
+ padding: 0 4px;
+ text-transform: uppercase;
+ vertical-align: top;
}
-.hero.is-info a.nav-item:hover, .hero.is-info a.nav-item.is-active,
-.hero.is-info .nav-item a:not(.button):hover,
-.hero.is-info .nav-item a:not(.button).is-active {
- color: #fff;
+#_default_ > a {
+ background-color: white;
+ border-radius: 5px;
+ -webkit-box-shadow: 0 2px 3px rgba(10, 10, 10, 0.1), 0 0 0 1px rgba(10, 10, 10, 0.1);
+ box-shadow: 0 2px 3px rgba(10, 10, 10, 0.1), 0 0 0 1px rgba(10, 10, 10, 0.1);
+ color: #4a4a4a;
+ display: block;
+ line-height: 1.375;
+ margin-top: 15px;
+ min-height: 70px;
+ padding: 15px;
+ padding-left: 70px;
+ position: relative;
}
-.hero.is-info .tabs a {
- color: #fff;
- opacity: 0.9;
+#_default_ > a:hover, #_default_ > a:focus {
+ -webkit-box-shadow: 0 2px 3px rgba(10, 10, 10, 0.1), 0 0 0 1px #00d1b2;
+ box-shadow: 0 2px 3px rgba(10, 10, 10, 0.1), 0 0 0 1px #00d1b2;
}
-.hero.is-info .tabs a:hover {
- opacity: 1;
+#_default_ > a:active {
+ -webkit-box-shadow: inset 0 1px 2px rgba(10, 10, 10, 0.2), 0 0 0 1px #00d1b2;
+ box-shadow: inset 0 1px 2px rgba(10, 10, 10, 0.2), 0 0 0 1px #00d1b2;
+}
+
+#_default_ > a span {
+ display: block;
}
-.hero.is-info .tabs li.is-active a {
- opacity: 1;
+#_default_ > a .default-image {
+ display: block;
+ left: 15px;
+ height: 40px;
+ position: absolute;
+ top: 15px;
+ width: 40px;
}
-.hero.is-info .tabs.is-boxed a, .hero.is-info .tabs.is-toggle a {
- color: #fff;
+#_default_ > a .default-image img {
+ display: block;
+ height: 40px;
+ width: 40px;
}
-.hero.is-info .tabs.is-boxed a:hover, .hero.is-info .tabs.is-toggle a:hover {
- background-color: rgba(10, 10, 10, 0.1);
+#_default_ > a .default-title {
+ color: #363636;
+ display: inline;
+ font-weight: 700;
}
-.hero.is-info .tabs.is-boxed li.is-active a, .hero.is-info .tabs.is-boxed li.is-active a:hover, .hero.is-info .tabs.is-toggle li.is-active a, .hero.is-info .tabs.is-toggle li.is-active a:hover {
- background-color: #fff;
- border-color: #fff;
- color: #3273dc;
+#_default_ > a .default-title:after {
+ content: " — ";
}
-.hero.is-info.is-bold {
- background-image: linear-gradient(141deg, #1577c6 0%, #3273dc 71%, #4366e5 100%);
+#_default_ > a .default-description {
+ display: inline;
}
-@media screen and (max-width: 768px) {
- .hero.is-info.is-bold .nav-menu {
- background-image: linear-gradient(141deg, #1577c6 0%, #3273dc 71%, #4366e5 100%);
+@media screen and (min-width: 769px), print {
+ .bsa .columns {
+ min-height: 120px;
}
-}
-
-@media screen and (max-width: 768px) {
- .hero.is-info .nav-toggle span {
- background-color: #fff;
+ #_default_ {
+ display: -webkit-box;
+ display: -ms-flexbox;
+ display: flex;
+ -webkit-box-pack: center;
+ -ms-flex-pack: center;
+ justify-content: center;
+ position: relative;
}
- .hero.is-info .nav-toggle:hover {
- background-color: rgba(10, 10, 10, 0.1);
+ #_default_ .default-ad {
+ left: 100%;
+ margin-left: 2rem;
+ position: absolute;
+ top: 0;
}
- .hero.is-info .nav-toggle.is-active span {
- background-color: #fff;
+ #_default_ > a {
+ margin: 0;
+ width: calc(50% - 1rem);
}
- .hero.is-info .nav-menu .nav-item {
- border-top-color: rgba(255, 255, 255, 0.2);
+ #_default_ > a:not(:nth-child(2)) {
+ margin-left: 2rem;
}
}
-.hero.is-success {
- background-color: #23d160;
- color: #fff;
+html.route-index .title.is-2 {
+ position: relative;
}
-.hero.is-success a:not(.button),
-.hero.is-success strong {
- color: inherit;
+html.route-index .title.is-2 a {
+ color: #242424;
+ position: relative;
}
-.hero.is-success .title {
- color: #fff;
+html.route-index .title.is-2 a:hover {
+ color: #00d1b2;
}
-.hero.is-success .subtitle {
- color: rgba(255, 255, 255, 0.9);
+html.route-index .title.is-2 .icon.is-medium {
+ left: -80px;
+ opacity: 0.1;
+ position: absolute;
+ top: 10px;
}
-.hero.is-success .subtitle a:not(.button),
-.hero.is-success .subtitle strong {
- color: #fff;
+html.route-index .title.is-2 .icon.is-medium .fa {
+ font-size: 56px;
}
-.hero.is-success .nav {
- -webkit-box-shadow: 0 1px 0 rgba(255, 255, 255, 0.2);
- box-shadow: 0 1px 0 rgba(255, 255, 255, 0.2);
+html.route-index .hero .title.is-2 a {
+ color: white;
}
-@media screen and (max-width: 768px) {
- .hero.is-success .nav-menu {
- background-color: #23d160;
+html.route-index .hero .title.is-2 a:hover {
+ color: white;
+}
+
+html.route-index .hero.is-primary a.column,
+html.route-index .hero.is-primary a.column:hover {
+ color: white;
+}
+
+html.route-index .hero.is-primary a.column:hover .title strong {
+ border-bottom: 1px solid;
+}
+
+@media screen and (max-width: 979px) {
+ html.route-index .title.is-2 a {
+ padding-left: 0;
+ }
+ html.route-index .title.is-2 .icon.is-medium {
+ display: none;
}
}
-.hero.is-success a.nav-item,
-.hero.is-success .nav-item a:not(.button) {
- color: rgba(255, 255, 255, 0.7);
+.tws {
+ display: -webkit-box;
+ display: -ms-flexbox;
+ display: flex;
+ -ms-flex-wrap: wrap;
+ flex-wrap: wrap;
+ overflow: auto;
+ padding: 20px;
}
-.hero.is-success a.nav-item:hover, .hero.is-success a.nav-item.is-active,
-.hero.is-success .nav-item a:not(.button):hover,
-.hero.is-success .nav-item a:not(.button).is-active {
- color: #fff;
+.tw {
+ color: #697882;
+ -ms-flex-negative: 0;
+ flex-shrink: 0;
+ font-family: Helvetica, Roboto, "Segoe UI", Calibri, sans-serif;
+ font-size: 16px;
+ line-height: 1.4;
+ padding: 10px;
+ width: 520px;
}
-.hero.is-success .tabs a {
- color: #fff;
- opacity: 0.9;
+.tw a {
+ color: currentColor;
}
-.hero.is-success .tabs a:hover {
- opacity: 1;
+.tw p {
+ color: #1c2022;
+ font-size: 16px;
+ margin-bottom: 3.2px;
}
-.hero.is-success .tabs li.is-active a {
- opacity: 1;
+.tw p a {
+ color: #2b7bb9;
}
-.hero.is-success .tabs.is-boxed a, .hero.is-success .tabs.is-toggle a {
- color: #fff;
+.twitter-tweet:not(.twitter-tweet-rendered) {
+ background-color: white;
+ border: 1px solid #e1e8ed;
+ border-radius: 5px;
+ color: #697882;
+ font-size: 14px;
+ padding: 20px 20px 11.6px;
}
-.hero.is-success .tabs.is-boxed a:hover, .hero.is-success .tabs.is-toggle a:hover {
- background-color: rgba(10, 10, 10, 0.1);
+.twitter-tweet:not(.twitter-tweet-rendered) a {
+ color: currentColor;
}
-.hero.is-success .tabs.is-boxed li.is-active a, .hero.is-success .tabs.is-boxed li.is-active a:hover, .hero.is-success .tabs.is-toggle li.is-active a, .hero.is-success .tabs.is-toggle li.is-active a:hover {
- background-color: #fff;
- border-color: #fff;
- color: #23d160;
+.twitter-tweet:not(.twitter-tweet-rendered) a:hover {
+ text-decoration: underline;
}
-.hero.is-success.is-bold {
- background-image: linear-gradient(141deg, #12af2f 0%, #23d160 71%, #2ce28a 100%);
+.twitter-tweet:not(.twitter-tweet-rendered) p {
+ color: #1c2022;
+ font-size: 16px;
+ margin-bottom: 3.2px;
}
-@media screen and (max-width: 768px) {
- .hero.is-success.is-bold .nav-menu {
- background-image: linear-gradient(141deg, #12af2f 0%, #23d160 71%, #2ce28a 100%);
- }
+.twitter-tweet:not(.twitter-tweet-rendered) p a {
+ color: #2b7bb9;
}
-@media screen and (max-width: 768px) {
- .hero.is-success .nav-toggle span {
- background-color: #fff;
- }
- .hero.is-success .nav-toggle:hover {
- background-color: rgba(10, 10, 10, 0.1);
- }
- .hero.is-success .nav-toggle.is-active span {
- background-color: #fff;
- }
- .hero.is-success .nav-menu .nav-item {
- border-top-color: rgba(255, 255, 255, 0.2);
- }
+.twitter-tweet-rendered {
+ border: none;
+ border-radius: 0;
+ margin: 0 !important;
+ padding: 0 !important;
}
-.hero.is-warning {
- background-color: #ffdd57;
- color: rgba(0, 0, 0, 0.7);
+.expo {
+ background-color: whitesmoke;
+ background-color: white;
+ padding: 1.5rem;
}
-.hero.is-warning a:not(.button),
-.hero.is-warning strong {
- color: inherit;
+.website {
+ display: block;
+ position: relative;
+ text-align: center;
}
-.hero.is-warning .title {
- color: rgba(0, 0, 0, 0.7);
+.website:last-child {
+ margin-bottom: 0;
}
-.hero.is-warning .subtitle {
- color: rgba(0, 0, 0, 0.9);
+.website-image {
+ -webkit-box-align: center;
+ -ms-flex-align: center;
+ align-items: center;
+ display: -webkit-box;
+ display: -ms-flexbox;
+ display: flex;
+ -webkit-box-pack: center;
+ -ms-flex-pack: center;
+ justify-content: center;
+ margin-bottom: 1.5rem;
+ position: relative;
}
-.hero.is-warning .subtitle a:not(.button),
-.hero.is-warning .subtitle strong {
- color: rgba(0, 0, 0, 0.7);
+.website-image:hover .website-overlay {
+ opacity: 0.25;
}
-.hero.is-warning .nav {
- -webkit-box-shadow: 0 1px 0 rgba(0, 0, 0, 0.2);
- box-shadow: 0 1px 0 rgba(0, 0, 0, 0.2);
+.website-overlay {
+ background-color: #0a0a0a;
+ opacity: 0;
+ -webkit-transition: opacity 200ms ease-out;
+ transition: opacity 200ms ease-out;
}
@media screen and (max-width: 768px) {
- .hero.is-warning .nav-menu {
- background-color: #ffdd57;
+ .website:not(:last-child) {
+ margin-bottom: 1.5rem;
}
}
-.hero.is-warning a.nav-item,
-.hero.is-warning .nav-item a:not(.button) {
- color: rgba(0, 0, 0, 0.7);
+@media screen and (min-width: 769px), print {
+ .expo {
+ padding-bottom: 3rem;
+ padding-top: 3rem;
+ }
+ .websites {
+ display: -webkit-box;
+ display: -ms-flexbox;
+ display: flex;
+ -ms-flex-wrap: wrap;
+ flex-wrap: wrap;
+ -webkit-box-pack: justify;
+ -ms-flex-pack: justify;
+ justify-content: space-between;
+ }
+ .website {
+ margin-top: 3rem;
+ width: calc(50% - 3rem);
+ }
+ .website:nth-child(1), .website:nth-child(2) {
+ margin-top: 0;
+ }
+ .website.is-highlighted {
+ width: 100%;
+ }
+ .website-image {
+ margin-bottom: 3rem;
+ }
}
-.hero.is-warning a.nav-item:hover, .hero.is-warning a.nav-item.is-active,
-.hero.is-warning .nav-item a:not(.button):hover,
-.hero.is-warning .nav-item a:not(.button).is-active {
- color: rgba(0, 0, 0, 0.7);
+.testimonials {
+ background-color: whitesmoke;
}
-.hero.is-warning .tabs a {
- color: rgba(0, 0, 0, 0.7);
- opacity: 0.9;
+.testimonial {
+ -webkit-box-align: start;
+ -ms-flex-align: start;
+ align-items: flex-start;
+ display: -webkit-box;
+ display: -ms-flexbox;
+ display: flex;
+ -webkit-box-pack: center;
+ -ms-flex-pack: center;
+ justify-content: center;
}
-.hero.is-warning .tabs a:hover {
- opacity: 1;
+.more-loves {
+ -webkit-box-align: center;
+ -ms-flex-align: center;
+ align-items: center;
+ display: -webkit-box;
+ display: -ms-flexbox;
+ display: flex;
+ -webkit-box-pack: center;
+ -ms-flex-pack: center;
+ justify-content: center;
+ margin-top: 1.5rem;
+ text-align: center;
}
-.hero.is-warning .tabs li.is-active a {
- opacity: 1;
+.more-loves .button {
+ height: auto;
+ padding: 0.75em 1.5em;
}
-.hero.is-warning .tabs.is-boxed a, .hero.is-warning .tabs.is-toggle a {
- color: rgba(0, 0, 0, 0.7);
+.more-loves .button span {
+ -webkit-transform-origin: center center;
+ transform-origin: center center;
+ -webkit-transition: -webkit-transform 86ms ease-out;
+ transition: -webkit-transform 86ms ease-out;
+ transition: transform 86ms ease-out;
+ transition: transform 86ms ease-out, -webkit-transform 86ms ease-out;
}
-.hero.is-warning .tabs.is-boxed a:hover, .hero.is-warning .tabs.is-toggle a:hover {
- background-color: rgba(10, 10, 10, 0.1);
+.more-loves .button:hover span {
+ -webkit-transform: scale(1.04);
+ transform: scale(1.04);
}
-.hero.is-warning .tabs.is-boxed li.is-active a, .hero.is-warning .tabs.is-boxed li.is-active a:hover, .hero.is-warning .tabs.is-toggle li.is-active a, .hero.is-warning .tabs.is-toggle li.is-active a:hover {
- background-color: rgba(0, 0, 0, 0.7);
- border-color: rgba(0, 0, 0, 0.7);
- color: #ffdd57;
+@media screen and (max-width: 768px) {
+ .testimonials {
+ padding: 1.5rem;
+ }
+ .testimonial {
+ margin-bottom: 1.5rem;
+ }
}
-.hero.is-warning.is-bold {
- background-image: linear-gradient(141deg, #ffaf24 0%, #ffdd57 71%, #fffa70 100%);
+@media screen and (min-width: 769px), print {
+ .testimonials {
+ padding: 3rem;
+ }
+ .testimonial + .testimonial {
+ margin-top: 1.5rem;
+ }
}
-@media screen and (max-width: 768px) {
- .hero.is-warning.is-bold .nav-menu {
- background-image: linear-gradient(141deg, #ffaf24 0%, #ffdd57 71%, #fffa70 100%);
+@media screen and (min-width: 1008px) {
+ .testimonials {
+ min-height: 595px;
}
}
-@media screen and (max-width: 768px) {
- .hero.is-warning .nav-toggle span {
- background-color: rgba(0, 0, 0, 0.7);
- }
- .hero.is-warning .nav-toggle:hover {
- background-color: rgba(10, 10, 10, 0.1);
- }
- .hero.is-warning .nav-toggle.is-active span {
- background-color: rgba(0, 0, 0, 0.7);
+@media screen and (min-width: 1200px) {
+ .testimonials {
+ min-height: 653px;
}
- .hero.is-warning .nav-menu .nav-item {
- border-top-color: rgba(0, 0, 0, 0.2);
+}
+
+@media screen and (min-width: 1392px) {
+ .testimonials {
+ min-height: 632px;
}
}
-.hero.is-danger {
- background-color: #ff3860;
- color: #fff;
+.rainbow {
+ -webkit-animation: rainbow 8s ease infinite;
+ animation: rainbow 8s ease infinite;
+ background-image: linear-gradient(124deg, #ff470f, #ff3860, #b86bff, #3273dc);
+ background-size: 800% 800%;
}
-.hero.is-danger a:not(.button),
-.hero.is-danger strong {
- color: inherit;
+.hero.is-love .title,
+.hero.is-love .subtitle {
+ color: white;
}
-.hero.is-danger .title {
- color: #fff;
+@-webkit-keyframes rainbow {
+ 0% {
+ background-position: 0% 80%;
+ }
+ 50% {
+ background-position: 100% 20%;
+ }
+ 100% {
+ background-position: 0% 80%;
+ }
}
-.hero.is-danger .subtitle {
- color: rgba(255, 255, 255, 0.9);
+@keyframes rainbow {
+ 0% {
+ background-position: 0% 80%;
+ }
+ 50% {
+ background-position: 100% 20%;
+ }
+ 100% {
+ background-position: 0% 80%;
+ }
}
-.hero.is-danger .subtitle a:not(.button),
-.hero.is-danger .subtitle strong {
- color: #fff;
+.hug {
+ -webkit-box-align: start;
+ -ms-flex-align: start;
+ align-items: flex-start;
+ display: -webkit-box;
+ display: -ms-flexbox;
+ display: flex;
+ -webkit-box-pack: center;
+ -ms-flex-pack: center;
+ justify-content: center;
}
-.hero.is-danger .nav {
- -webkit-box-shadow: 0 1px 0 rgba(255, 255, 255, 0.2);
- box-shadow: 0 1px 0 rgba(255, 255, 255, 0.2);
+.embrace {
+ background-color: whitesmoke;
+ border-radius: 3px;
+ padding: 1.5rem;
}
@media screen and (max-width: 768px) {
- .hero.is-danger .nav-menu {
- background-color: #ff3860;
+ .love {
+ padding: 1.5rem;
+ }
+ .hug {
+ margin: 1.5rem;
+ }
+ .embrace {
+ text-align: center;
+ }
+ .embrace:not(:first-child) {
+ margin-top: 1.5rem;
+ }
+ .embrace:not(:last-child) {
+ margin-bottom: 1.5rem;
+ }
+ .embrace-button {
+ margin-top: 0.75rem;
}
}
-.hero.is-danger a.nav-item,
-.hero.is-danger .nav-item a:not(.button) {
- color: rgba(255, 255, 255, 0.7);
+@media screen and (min-width: 769px), print {
+ .love {
+ padding-bottom: 3rem;
+ padding-top: 3rem;
+ }
+ .embrace {
+ -webkit-box-align: center;
+ -ms-flex-align: center;
+ align-items: center;
+ display: -webkit-box;
+ display: -ms-flexbox;
+ display: flex;
+ -webkit-box-pack: center;
+ -ms-flex-pack: center;
+ justify-content: center;
+ }
+ .embrace:not(:first-child) {
+ margin-top: 3rem;
+ }
+ .embrace:not(:last-child) {
+ margin-bottom: 3rem;
+ }
+ .embrace-button {
+ margin-left: 1.5rem;
+ }
+ .hugs {
+ display: -webkit-box;
+ display: -ms-flexbox;
+ display: flex;
+ -ms-flex-wrap: wrap;
+ flex-wrap: wrap;
+ padding-bottom: 3rem;
+ }
+ .hug {
+ margin-top: 1.5rem;
+ width: calc(33.3333% - 1rem);
+ }
+ .hug:nth-child(1), .hug:nth-child(2), .hug:nth-child(3) {
+ margin-top: 0;
+ }
+ .hug:nth-child(3n-1), .hug:nth-child(3n) {
+ margin-left: 1.5rem;
+ }
}
-.hero.is-danger a.nav-item:hover, .hero.is-danger a.nav-item.is-active,
-.hero.is-danger .nav-item a:not(.button):hover,
-.hero.is-danger .nav-item a:not(.button).is-active {
+.bootstrap .hero {
+ background-color: #6f5499;
color: #fff;
}
-.hero.is-danger .tabs a {
- color: #fff;
- opacity: 0.9;
+.bootstrap .hero .title,
+.bootstrap .hero .subtitle {
+ color: currentColor;
}
-.hero.is-danger .tabs a:hover {
- opacity: 1;
+.bootstrap .hero .subtitle {
+ color: rgba(255, 255, 255, 0.5);
}
-.hero.is-danger .tabs li.is-active a {
- opacity: 1;
+.bootstrap .hero .subtitle a {
+ border-bottom: 1px solid currentColor;
+ color: currentColor;
}
-.hero.is-danger .tabs.is-boxed a, .hero.is-danger .tabs.is-toggle a {
+.bootstrap .hero .subtitle a:hover {
color: #fff;
}
-.hero.is-danger .tabs.is-boxed a:hover, .hero.is-danger .tabs.is-toggle a:hover {
- background-color: rgba(10, 10, 10, 0.1);
+.pros-heading {
+ padding: 0 2rem;
+ text-align: center;
}
-.hero.is-danger .tabs.is-boxed li.is-active a, .hero.is-danger .tabs.is-boxed li.is-active a:hover, .hero.is-danger .tabs.is-toggle li.is-active a, .hero.is-danger .tabs.is-toggle li.is-active a:hover {
- background-color: #fff;
- border-color: #fff;
- color: #ff3860;
+.pros-icon {
+ margin-bottom: 3rem;
+ text-align: center;
}
-.hero.is-danger.is-bold {
- background-image: linear-gradient(141deg, #ff0561 0%, #ff3860 71%, #ff5257 100%);
+.pros-icon svg {
+ height: 3rem;
+ width: auto;
}
-@media screen and (max-width: 768px) {
- .hero.is-danger.is-bold .nav-menu {
- background-image: linear-gradient(141deg, #ff0561 0%, #ff3860 71%, #ff5257 100%);
- }
+.pros-list {
+ margin: 0 auto;
+ max-width: 540px;
}
-@media screen and (max-width: 768px) {
- .hero.is-danger .nav-toggle span {
- background-color: #fff;
- }
- .hero.is-danger .nav-toggle:hover {
- background-color: rgba(10, 10, 10, 0.1);
- }
- .hero.is-danger .nav-toggle.is-active span {
- background-color: #fff;
- }
- .hero.is-danger .nav-menu .nav-item {
- border-top-color: rgba(255, 255, 255, 0.2);
- }
+.pro .icon {
+ position: relative;
+ top: -1px;
}
-@media screen and (min-width: 769px), print {
- .hero.is-medium .hero-body {
- padding-bottom: 9rem;
- padding-top: 9rem;
- }
+.pro .title {
+ margin-bottom: 0.5rem;
}
-@media screen and (min-width: 769px), print {
- .hero.is-large .hero-body {
- padding-bottom: 18rem;
- padding-top: 18rem;
- }
+.pro + .pro {
+ margin-top: 2rem;
+ padding-top: 2rem;
}
-.hero.is-halfheight .hero-body, .hero.is-fullheight .hero-body {
- -webkit-box-align: center;
- -ms-flex-align: center;
- align-items: center;
- display: -webkit-box;
- display: -ms-flexbox;
- display: flex;
+.pro-content p:not(:last-child) {
+ margin-bottom: 0.5rem;
}
-.hero.is-halfheight .hero-body > .container, .hero.is-fullheight .hero-body > .container {
- -webkit-box-flex: 1;
- -ms-flex-positive: 1;
- flex-grow: 1;
- -ms-flex-negative: 1;
- flex-shrink: 1;
+.pro.is-bulma .icon {
+ color: #00d1b2;
}
-.hero.is-halfheight {
- min-height: 50vh;
+.pro.is-bootstrap .icon {
+ color: #6f5499;
}
-.hero.is-fullheight {
- min-height: 100vh;
+.separator {
+ color: #dbdbdb;
+ margin: 0 0.25em;
}
-.hero-video {
- bottom: 0;
- left: 0;
- position: absolute;
- right: 0;
- top: 0;
- overflow: hidden;
+.comparison {
+ margin: 0 auto;
+ max-width: 42rem;
}
-.hero-video video {
- left: 50%;
- min-height: 100%;
- min-width: 100%;
- position: absolute;
- top: 50%;
- -webkit-transform: translate3d(-50%, -50%, 0);
- transform: translate3d(-50%, -50%, 0);
+.comparison .table {
+ color: #ff3860;
}
-.hero-video.is-transparent {
- opacity: 0.3;
+.comparison .table thead th,
+.comparison .table tfoot th {
+ font-size: 1.5rem;
+ text-align: center;
}
-@media screen and (max-width: 768px) {
- .hero-video {
- display: none;
- }
+.comparison .table thead svg,
+.comparison .table tfoot svg {
+ height: 1.5rem;
+ margin-right: 1rem;
+ position: relative;
+ top: 0.25rem;
+ width: auto;
}
-.hero-buttons {
- margin-top: 1.5rem;
+.comparison .table tbody th {
+ font-size: 1.25rem;
+ text-align: center;
}
-@media screen and (max-width: 768px) {
- .hero-buttons .button {
- display: -webkit-box;
- display: -ms-flexbox;
- display: flex;
- }
- .hero-buttons .button:not(:last-child) {
- margin-bottom: 0.75rem;
- }
+.comparison .table tbody td {
+ font-family: monospace;
+ width: 50%;
}
-@media screen and (min-width: 769px), print {
- .hero-buttons {
- display: -webkit-box;
- display: -ms-flexbox;
- display: flex;
- -webkit-box-pack: center;
- -ms-flex-pack: center;
- justify-content: center;
- }
- .hero-buttons .button:not(:last-child) {
- margin-right: 1.5rem;
- }
+.comparison .table tbody a {
+ color: currentColor;
}
-.hero-head,
-.hero-foot {
- -webkit-box-flex: 0;
- -ms-flex-positive: 0;
- flex-grow: 0;
- -ms-flex-negative: 0;
- flex-shrink: 0;
+.comparison .table tbody a:hover {
+ text-decoration: underline;
}
-.hero-body {
- -webkit-box-flex: 1;
- -ms-flex-positive: 1;
- flex-grow: 1;
- -ms-flex-negative: 0;
- flex-shrink: 0;
- padding: 3rem 1.5rem;
+.comparison .table .is-empty {
+ background-color: whitesmoke;
+ color: #7a7a7a;
}
-.section {
- padding: 3rem 1.5rem;
+.comparison .table .is-unique {
+ background-color: rgba(35, 209, 96, 0.25);
+ color: #363636;
+ font-weight: 700;
}
-@media screen and (min-width: 1008px) {
- .section.is-medium {
- padding: 9rem 1.5rem;
- }
- .section.is-large {
- padding: 18rem 1.5rem;
- }
+.comparison-header {
+ margin-bottom: 3rem;
}
-.footer {
- background-color: whitesmoke;
- padding: 3rem 1.5rem 6rem;
+:root {
+ --primary: #00d1b2;
+ --gap: 0.75rem;
+}
+
+html ::-moz-selection {
+ background: #00d1b2;
+ color: #fff;
}
-/*# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uL2J1bG1hLnNhc3MiLCIuLi9zYXNzL3V0aWxpdGllcy9hbmltYXRpb25zLnNhc3MiLCJidWxtYS5jc3MiLCIuLi9zYXNzL2Jhc2UvbWluaXJlc2V0LnNhc3MiLCIuLi9zYXNzL2Jhc2UvZ2VuZXJpYy5zYXNzIiwiLi4vc2Fzcy91dGlsaXRpZXMvaW5pdGlhbC12YXJpYWJsZXMuc2FzcyIsIi4uL3Nhc3MvdXRpbGl0aWVzL21peGlucy5zYXNzIiwiLi4vc2Fzcy9iYXNlL2hlbHBlcnMuc2FzcyIsIi4uL3Nhc3MvZWxlbWVudHMvYm94LnNhc3MiLCIuLi9zYXNzL2VsZW1lbnRzL2J1dHRvbi5zYXNzIiwiLi4vc2Fzcy91dGlsaXRpZXMvY29udHJvbHMuc2FzcyIsIi4uL3Nhc3MvdXRpbGl0aWVzL2Z1bmN0aW9ucy5zYXNzIiwiLi4vc2Fzcy9lbGVtZW50cy9jb250ZW50LnNhc3MiLCIuLi9zYXNzL2VsZW1lbnRzL2Zvcm0uc2FzcyIsIi4uL3Nhc3MvZWxlbWVudHMvaWNvbi5zYXNzIiwiLi4vc2Fzcy9lbGVtZW50cy9pbWFnZS5zYXNzIiwiLi4vc2Fzcy9lbGVtZW50cy9ub3RpZmljYXRpb24uc2FzcyIsIi4uL3Nhc3MvZWxlbWVudHMvcHJvZ3Jlc3Muc2FzcyIsIi4uL3Nhc3MvZWxlbWVudHMvdGFibGUuc2FzcyIsIi4uL3Nhc3MvZWxlbWVudHMvdGFnLnNhc3MiLCIuLi9zYXNzL2VsZW1lbnRzL3RpdGxlLnNhc3MiLCIuLi9zYXNzL2VsZW1lbnRzL290aGVyLnNhc3MiLCIuLi9zYXNzL2NvbXBvbmVudHMvYnJlYWRjcnVtYi5zYXNzIiwiLi4vc2Fzcy9jb21wb25lbnRzL2NhcmQuc2FzcyIsIi4uL3Nhc3MvY29tcG9uZW50cy9kcm9wZG93bi5zYXNzIiwiLi4vc2Fzcy9jb21wb25lbnRzL2xldmVsLnNhc3MiLCIuLi9zYXNzL2NvbXBvbmVudHMvbWVkaWEuc2FzcyIsIi4uL3Nhc3MvY29tcG9uZW50cy9tZW51LnNhc3MiLCIuLi9zYXNzL2NvbXBvbmVudHMvbWVzc2FnZS5zYXNzIiwiLi4vc2Fzcy9jb21wb25lbnRzL21vZGFsLnNhc3MiLCIuLi9zYXNzL2NvbXBvbmVudHMvbmF2LnNhc3MiLCIuLi9zYXNzL2NvbXBvbmVudHMvbmF2YmFyLnNhc3MiLCIuLi9zYXNzL2NvbXBvbmVudHMvcGFnaW5hdGlvbi5zYXNzIiwiLi4vc2Fzcy9jb21wb25lbnRzL3BhbmVsLnNhc3MiLCIuLi9zYXNzL2NvbXBvbmVudHMvdGFicy5zYXNzIiwiLi4vc2Fzcy9ncmlkL2NvbHVtbnMuc2FzcyIsIi4uL3Nhc3MvZ3JpZC90aWxlcy5zYXNzIiwiLi4vc2Fzcy9sYXlvdXQvaGVyby5zYXNzIiwiLi4vc2Fzcy9sYXlvdXQvc2VjdGlvbi5zYXNzIiwiLi4vc2Fzcy9sYXlvdXQvZm9vdGVyLnNhc3MiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQ0EsOERBQThEO0FDRDlEO0VBQ0U7SUFDRSxnQ0FBdUI7WUFBdkIsd0JBQXVCO0dDRXhCO0VEREQ7SUFDRSxrQ0FBeUI7WUFBekIsMEJBQXlCO0dDRzFCO0NBQ0Y7QURSRDtFQUNFO0lBQ0UsZ0NBQXVCO1lBQXZCLHdCQUF1QjtHQ0V4QjtFREREO0lBQ0Usa0NBQXlCO1lBQXpCLDBCQUF5QjtHQ0cxQjtDQUNGOztBQ1JELDJFQUEyRTtBQUUzRTs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7RUF1QkUsVUFBUztFQUNULFdBQVU7Q0FBSTs7QUFHaEI7Ozs7OztFQU1FLGdCQUFlO0VBQ2Ysb0JBQW1CO0NBQUk7O0FBR3pCO0VBQ0UsaUJBQWdCO0NBQUk7O0FBR3RCOzs7O0VBSUUsVUFBUztDQUFJOztBQUdmO0VBQ0UsK0JBQXNCO1VBQXRCLHVCQUFzQjtDQUFJOztBQUU1QjtFQUNFLDRCQUFtQjtVQUFuQixvQkFBbUI7Q0FHUTs7QUFKN0I7RUFJSSw0QkFBbUI7VUFBbkIsb0JBQW1CO0NBQUk7O0FBRzNCOzs7OztFQUtFLGdCQUFlO0NBQUk7O0FBR3JCO0VBQ0UsVUFBUztDQUFJOztBQUdmO0VBQ0UsMEJBQXlCO0VBQ3pCLGtCQUFpQjtD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RVdzQnhCLGVYNUJ3QjtDVzRCRDs7QUE5QjdCO0VBNkJNLDBCWDNCd0I7RVc0QnhCLGtCWHRCd0I7Q1dzQkQ7O0FBOUI3QjtFQTZCTSwwQlhkNEI7RVdlNUIsWUxQVTtDS09hOztBQTlCN0I7RUE2Qk0sMEJYYjRCO0VXYzVCLFlMUFU7Q0tPYTs7QUE5QjdCO0VBNkJNLDBCWGY0QjtFV2dCNUIsWUxQVTtDS09hOztBQTlCN0I7RUE2Qk0sMEJYaEI0QjtFV2lCNUIsMEJMVGU7Q0tTUTs7QUE5QjdCO0VBNkJNLDBCWFg0QjtFV1k1QixZTFBVO0NLT2E7O0FDL0I3QjtFQUVFLHNCQUFxQjtFQUNyQix5QkFBd0I7RUFDeEIsYUFBWTtFQUNaLHdCQUF1QjtFQUN2QixlQUFjO0VBQ2QsYVp5Qlc7RVl4QlgsaUJBQWdCO0VBQ2hCLFdBQVU7RUFDVixZQUFXO0NBcUJlOztBWHJCMUI7RUFDRSxzQkFBcUI7Q0FBSTs7QVdYN0I7RUFZSSwwQlpMMEI7Q1lLeUI7O0FBWnZEO0VBY0ksMEJaVjBCO0NZVTJCOztBQWR6RDtFQWdCSSwwQlpaMEI7Q1lZMkI7O0FBaEJ6RDtFQXNCUSx3QlpYdUI7Q1lXSTs7QUF0Qm5DO0VBd0JRLHdCWmJ1QjtDWWFJOztBQXhCbkM7RUFzQlEsMEJadkJxQjtDWXVCTTs7QUF0Qm5DO0VBd0JRLDBCWnpCcUI7Q1l5Qk07O0FBeEJuQztFQXNCUSw2Qlpic0I7Q1lhSzs7QUF0Qm5DO0VBd0JRLDZCWmZzQjtDWWVLOztBQXhCbkM7RUFzQlEsMEJabkJzQjtDWW1CSzs7QUF0Qm5DO0VBd0JRLDBCWnJCc0I7Q1lxQks7O0FBeEJuQztFQXNCUSwwQlpOMEI7Q1lNQzs7QUF0Qm5DO0VBd0JRLDBCWlIwQjtDWVFDOztBQXhCbkM7RUFzQlEsMEJaTDBCO0NZS0M7O0FBdEJuQztFQXdCUSwwQlpQMEI7Q1lPQzs7QUF4Qm5DO0VBc0JRLDBCWlAwQjtDWU9DOztBQXRCbkM7RUF3QlEsMEJaVDBCO0NZU0M7O0FBeEJuQztFQXNCUSwwQlpSMEI7Q1lRQzs7QUF0Qm5DO0VBd0JRLDBCWlYwQjtDWVVDOztBQXhC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LDZCaEN4QnFCO0NnQzJCTTs7QUEzQm5DOztFQTJCVSxlaEMzQm1CO0NnQzJCSTs7QUEzQmpDO0VBNkJRLGtEaEM3QnFCO1VnQzZCckIsMENoQzdCcUI7Q2dDNkIwQjs7QS9CZ0tyRDtFK0I3TEY7SUFnQ1Usd0JoQ3BCcUI7R2dDb0JRO0NuQ3lvTnRDOztBbUN6cU5EOztFQW1DUSw2QmhDbkNxQjtDZ0NzQ007O0FBdENuQzs7O0VBc0NVLGVoQ3RDbUI7Q2dDc0NJOztBQXRDakM7RUF5Q1UsZWhDekNtQjtFZ0MwQ25CLGFBQVk7Q0FFTTs7QUE1QzVCO0VBNENZLFdBQVU7Q0FBSTs7QUE1QzFCO0VBK0NZLFdBQVU7Q0FBSTs7QUEvQzFCO0VBbURZLGVoQ25EaUI7Q2dDcUR5Qjs7QUFyRHREO0VBcURjLHdDaENyRGU7Q2dDcUR1Qjs7QUFyRHBEO0VBeURjLDBCaEN6RGU7RWdDMERmLHNCaEMxRGU7RWdDMkRmLGFoQy9DaUI7Q2dDK0NEOztBQTNEOUI7RUFnRVEsNkVBQXlHO0NBR1c7O0EvQjBIMUg7RStCN0xGO0lBbUVZLDZFQUF5RztHQUFHO0NuQ3NwTnZIOztBSTVoTkM7RStCN0xGO0lBd0VZLDBCaEN4RWlCO0dnQ3dFaUI7RUF4RTlDO0lBMEVZLHdDaEMxRWlCO0dnQzBFcUI7RUExRWxEO0lBNkVjLDBCaEM3RWU7R2dDNkVtQjtFQTdFaEQ7SUFnRlksd0NoQ2hGaUI7R2dDZ0Y0QjtDbkN3cE54RDs7QW1DeHVORDtFQWdCTSwwQmhDaEJ1QjtFZ0NpQnZCLGFoQ0x5QjtDZ0NvRWdDOztBQWhGL0Q7O0VBb0JRLGVBQWM7Q0FBSTs7QUFwQjFCO0VBc0JRLGFoQ1Z1QjtDZ0NVQTs7QUF0Qi9CO0VBd0JRLGdDaENadUI7Q2dDZUk7O0FBM0JuQzs7RUEyQlUsYWhDZnFCO0NnQ2VFOztBQTNCakM7RUE2QlEscURoQ2pCdUI7VWdDaUJ2Qiw2Q2hDakJ1QjtDZ0NpQndCOztBL0JnS3JEO0UrQjdMRjtJQWdDVSwwQmhDaENtQjtHZ0NnQ1U7Q25DeXVOdEM7O0FtQ3p3TkQ7O0VBbUNRLGdDaEN2QnVCO0NnQzBCSTs7QUF0Q25DOzs7RUFzQ1UsYWhDMUJxQjtDZ0MwQkU7O0FBdENqQztFQXlDVSxhaEM3QnFCO0VnQzhCckIsYUFBWTtDQUVNOztBQTVDNUI7RUE0Q1ksV0FBVTtDQUFJOztBQTVDMUI7RUErQ1ksV0FBVTtDQUFJOztBQS9DMUI7RUFtRFksYWhDdkNtQjtDZ0N5Q3VCOztBQXJEdEQ7RUFxRGMsd0NoQ3JEZTtDZ0NxRHVCOztBQXJEcEQ7RUF5RGMsd0JoQzdDaUI7RWdDOENqQixvQmhDOUNpQjtFZ0MrQ2pCLGVoQzNEZTtDZ0MyREM7O0FBM0Q5QjtFQWdFUSwrRUFBeUc7Q0FHVzs7QS9CMEgxSDtFK0I3TEY7SUFtRVksK0VBQXlHO0dBQUc7Q25Dc3ZOdkg7O0FJNW5OQztFK0I3TEY7SUF3RVksd0JoQzVEbUI7R2dDNERlO0VBeEU5QztJQTBFWSx3Q2hDMUVpQjtHZ0MwRXFCO0VBMUVsRDtJQTZFYyx3QmhDakVpQjtHZ0NpRWlCO0VBN0VoRDtJQWdGWSwyQ2hDcEVtQjtHZ0NvRTBCO0NuQ3d2TnhEOztBbUN4ME5EO0VBZ0JNLDZCaENOd0I7RWdDT3hCLGVoQ2J3QjtDZ0M0RWlDOztBQWhGL0Q7O0VBb0JRLGVBQWM7Q0FBSTs7QUFwQjFCO0VBc0JRLGVoQ2xCc0I7Q2dDa0JDOztBQXRCL0I7RUF3QlEsNkJoQ3BCc0I7Q2dDdUJLOztBQTNCbkM7O0VBMkJVLGVoQ3ZCb0I7Q2dDdUJHOztBQTNCakM7RUE2QlEsa0RoQ3pCc0I7VWdDeUJ0QiwwQ2hDekJzQjtDZ0N5QnlCOztBL0JnS3JEO0UrQjdMRjtJQWdDVSw2QmhDdEJvQjtHZ0NzQlM7Q25DeTBOdEM7O0FtQ3oyTkQ7O0VBbUNRLDZCaEMvQnNCO0NnQ2tDSzs7QUF0Q25DOzs7RUFzQ1UsZWhDbENvQjtDZ0NrQ0c7O0FBdENqQztFQXlDVSxlaENyQ29CO0VnQ3NDcEIsYUFBWTtDQUVNOztBQTVDNUI7RUE0Q1ksV0FBVTtDQUFJOztBQTVDMUI7RUErQ1ksV0FBVTtDQUFJOztBQS9DMUI7RUFtRFksZWhDL0NrQjtDZ0NpRHdCOztBQXJEdEQ7RUFxRGMsd0NoQ3JEZTtDZ0NxRHVCOztBQXJEcEQ7RUF5RGMsMEJoQ3JEZ0I7RWdDc0RoQixzQmhDdERnQjtFZ0N1RGhCLGtCaENqRGdCO0NnQ2lEQTs7QUEzRDlCO0VBZ0VRLGtGQUF5RztDQUdXOztBL0IwSDFIO0UrQjdMRjtJQW1FWSxrRkFBeUc7R0FBRztDbkNzMU52SDs7QUk1dE5DO0UrQjdMRjtJQXdFWSwwQmhDcEVrQjtHZ0NvRWdCO0VBeEU5QztJQTBFWSx3Q2hDMUVpQjtHZ0MwRXFCO0VBMUVsRDtJQTZFYywwQmhDekVnQjtHZ0N5RWtCO0VBN0VoRDtJQWdGWSx3Q2hDNUVrQjtHZ0M0RTJCO0NuQ3cxTnhEOztBbUN4Nk5EO0VBZ0JNLDBCaENad0I7RWdDYXhCLGtCaENQd0I7Q2dDc0VpQzs7QUFoRi9EOztFQW9CUSxlQUFjO0NBQUk7O0FBcEIxQjtFQXNCUSxrQmhDWnNCO0NnQ1lDOztBQXRCL0I7RUF3QlEsZ0NoQ2RzQjtDZ0NpQks7O0FBM0JuQzs7RUEyQlUsa0JoQ2pCb0I7Q2dDaUJHOztBQTNCakM7RUE2QlEscURoQ25Cc0I7VWdDbUJ0Qiw2Q2hDbkJzQjtDZ0NtQnlCOztBL0JnS3JEO0UrQjdMRjtJQWdDVSwwQmhDNUJvQjtHZ0M0QlM7Q25DeTZOdEM7O0FtQ3o4TkQ7O0VBbUNRLGdDaEN6QnNCO0NnQzRCSzs7QUF0Q25DOzs7RUFzQ1Usa0JoQzVCb0I7Q2dDNEJHOztBQXRDakM7RUF5Q1Usa0JoQy9Cb0I7RWdDZ0NwQixhQUFZO0NBRU07O0FBNUM1QjtFQTRDWSxXQUFVO0NBQUk7O0FBNUMxQjtFQStDWSxXQUFVO0NBQUk7O0FBL0MxQjtFQW1EWSxrQmhDekNrQjtDZ0MyQ3dCOztBQXJEdEQ7RUFxRGMsd0NoQ3JEZTtDZ0NxRHVCOztBQXJEcEQ7RUF5RGMsNkJoQy9DZ0I7RWdDZ0RoQix5QmhDaERnQjtFZ0NpRGhCLGVoQ3ZEZ0I7Q2dDdURBOztBQTNEOUI7RUFnRVEsaUZBQXlHO0NBR1c7O0EvQjBIMUg7RStCN0xGO0lBbUVZLGlGQUF5RztHQUFHO0NuQ3M3TnZIOztBSTV6TkM7RStCN0xGO0lBd0VZLDZCaEM5RGtCO0dnQzhEZ0I7RUF4RTlDO0lBMEVZLHdDaEMxRWlCO0dnQzBFcUI7RUExRWxEO0lBNkVjLDZCaENuRWdCO0dnQ21Fa0I7RUE3RWhEO0lBZ0ZZLDJDaEN0RWtCO0dnQ3NFMkI7Q25DdzdOeEQ7O0FtQ3hnT0Q7RUFnQk0sMEJoQ0M0QjtFZ0NBNUIsWTFCUVU7QzBCdUQrQzs7QUFoRi9EOztFQW9CUSxlQUFjO0NBQUk7O0FBcEIxQjtFQXNCUSxZMUJHUTtDMEJIZTs7QUF0Qi9CO0VBd0JRLGdDMUJDUTtDMEJFbUI7O0FBM0JuQzs7RUEyQlUsWTFCRk07QzBCRWlCOztBQTNCakM7RUE2QlEscUQxQkpRO1UwQklSLDZDMUJKUTtDMEJJdUM7O0EvQmdLckQ7RStCN0xGO0lBZ0NVLDBCaENmd0I7R2dDZUs7Q25DeWdPdEM7O0FtQ3ppT0Q7O0VBbUNRLGdDMUJWUTtDMEJhbUI7O0FBdENuQzs7O0VBc0NVLFkxQmJNO0MwQmFpQjs7QUF0Q2pDO0VBeUNVLFkxQmhCTTtFMEJpQk4sYUFBWTtDQUVNOztBQTVDNUI7RUE0Q1ksV0FBVTtDQUFJOztBQTVDMUI7RUErQ1ksV0FBVTtDQUFJOztBQS9DMUI7RUFtRFksWTFCMUJJO0MwQjRCc0M7O0FBckR0RDtFQXFEYyx3Q2hDckRlO0NnQ3FEdUI7O0FBckRwRDtFQXlEYyx1QjFCaENFO0UwQmlDRixtQjFCakNFO0UwQmtDRixlaEMxQ29CO0NnQzBDSjs7QUEzRDlCO0VBZ0VRLGlGQUF5RztDQUdXOztBL0IwSDFIO0UrQjdMRjtJQW1FWSxpRkFBeUc7R0FBRztDbkNzaE92SDs7QUk1NU5DO0UrQjdMRjtJQXdFWSx1QjFCL0NJO0cwQitDOEI7RUF4RTlDO0lBMEVZLHdDaEMxRWlCO0dnQzBFcUI7RUExRWxEO0lBNkVjLHVCMUJwREU7RzBCb0RnQztFQTdFaEQ7SUFnRlksMkMxQnZESTtHMEJ1RHlDO0NuQ3doT3hEOztBbUN4bU9EO0VBZ0JNLDBCaENFNEI7RWdDRDVCLFkxQlFVO0MwQnVEK0M7O0FBaEYvRDs7RUFvQlEsZUFBYztDQUFJOztBQXBCMUI7RUFzQlEsWTFCR1E7QzBCSGU7O0FBdEIvQjtFQXdCUSxnQzFCQ1E7QzBCRW1COztBQTNCbkM7O0VBMkJVLFkxQkZNO0MwQkVpQjs7QUEzQmpDO0VBNkJRLHFEMUJKUTtVMEJJUiw2QzFCSlE7QzBCSXVDOztBL0JnS3JEO0UrQjdMRjtJQWdDVSwwQmhDZHdCO0dnQ2NLO0NuQ3ltT3RDOztBbUN6b09EOztFQW1DUSxnQzFCVlE7QzBCYW1COztBQXRDbkM7OztFQXNDVSxZMUJiTTtDMEJhaUI7O0FBdENqQztFQXlDVSxZMUJoQk07RTBCaUJOLGFBQVk7Q0FFTTs7QUE1QzVCO0VBNENZLFdBQVU7Q0FBSTs7QUE1QzFCO0VBK0NZLFdBQVU7Q0FBSTs7QUEvQzFCO0VBbURZLFkxQjFCSTtDMEI0QnNDOztBQXJEdEQ7RUFxRGMsd0NoQ3JEZTtDZ0NxRHVCOztBQXJEcEQ7RUF5RGMsdUIxQmhDRTtFMEJpQ0YsbUIxQmpDRTtFMEJrQ0YsZWhDekNvQjtDZ0N5Q0o7O0FBM0Q5QjtFQWdFUSxpRkFBeUc7Q0FHVzs7QS9CMEgxSDtFK0I3TEY7SUFtRVksaUZBQXlHO0dBQUc7Q25Dc25Pdkg7O0FJNS9OQztFK0I3TEY7SUF3RVksdUIxQi9DSTtHMEIrQzhCO0VBeEU5QztJQTBFWSx3Q2hDMUVpQjtHZ0MwRXFCO0VBMUVsRDtJQTZFYyx1QjFCcERFO0cwQm9EZ0M7RUE3RWhEO0lBZ0ZZLDJDMUJ2REk7RzBCdUR5QztDbkN3bk94RDs7QW1DeHNPRDtFQWdCTSwwQmhDQTRCO0VnQ0M1QixZMUJRVTtDMEJ1RCtDOztBQWhGL0Q7O0VBb0JRLGVBQWM7Q0FBSTs7QUFwQjFCO0VBc0JRLFkxQkdRO0MwQkhlOztBQXRCL0I7RUF3QlEsZ0MxQkNRO0MwQkVtQjs7QUEzQm5DOztFQTJCVSxZMUJGTTtDMEJFaUI7O0FBM0JqQztFQTZCUSxxRDFCSlE7VTBCSVIsNkMxQkpRO0MwQkl1Qzs7QS9CZ0tyRDtFK0I3TEY7SUFnQ1UsMEJoQ2hCd0I7R2dDZ0JLO0NuQ3lzT3RDOztBbUN6dU9EOztFQW1DUSxnQzFCVlE7QzBCYW1COztBQXRDbkM7OztFQXNDVSxZMUJiTTtDMEJhaUI7O0FBdENqQztFQXlDVSxZMUJoQk07RTBCaUJOLGFBQVk7Q0FFTTs7QUE1QzVCO0VBNENZLFdBQVU7Q0FBSTs7QUE1QzFCO0VBK0NZLFdBQVU7Q0FBSTs7QUEvQzFCO0VBbURZLFkxQjFCSTtDMEI0QnNDOztBQXJEdEQ7RUFxRGMsd0NoQ3JEZTtDZ0NxRHVCOztBQXJEcEQ7RUF5RGMsdUIxQmhDRTtFMEJpQ0YsbUIxQmpDRTtFMEJrQ0YsZWhDM0NvQjtDZ0MyQ0o7O0FBM0Q5QjtFQWdFUSxpRkFBeUc7Q0FHVzs7QS9CMEgxSDtFK0I3TEY7SUFtRVksaUZBQXlHO0dBQUc7Q25Dc3RPdkg7O0FJNWxPQztFK0I3TEY7SUF3RVksdUIxQi9DSTtHMEIrQzhCO0VBeEU5QztJQTBFWSx3Q2hDMUVpQjtHZ0MwRXFCO0VBMUVsRDtJQTZFYyx1QjFCcERFO0cwQm9EZ0M7RUE3RWhEO0lBZ0ZZLDJDMUJ2REk7RzBCdUR5QztDbkN3dE94RDs7QW1DeHlPRDtFQWdCTSwwQmhDRDRCO0VnQ0U1QiwwQjFCTWU7QzBCeUQwQzs7QUFoRi9EOztFQW9CUSxlQUFjO0NBQUk7O0FBcEIxQjtFQXNCUSwwQjFCQ2E7QzBCRFU7O0FBdEIvQjtFQXdCUSwwQjFCRGE7QzBCSWM7O0FBM0JuQzs7RUEyQlUsMEIxQkpXO0MwQklZOztBQTNCakM7RUE2QlEsK0MxQk5hO1UwQk1iLHVDMUJOYTtDMEJNa0M7O0EvQmdLckQ7RStCN0xGO0lBZ0NVLDBCaENqQndCO0dnQ2lCSztDbkN5eU90Qzs7QW1DejBPRDs7RUFtQ1EsMEIxQlphO0MwQmVjOztBQXRDbkM7OztFQXNDVSwwQjFCZlc7QzBCZVk7O0FBdENqQztFQXlDVSwwQjFCbEJXO0UwQm1CWCxhQUFZO0NBRU07O0FBNUM1QjtFQTRDWSxXQUFVO0NBQUk7O0FBNUMxQjtFQStDWSxXQUFVO0NBQUk7O0FBL0MxQjtFQW1EWSwwQjFCNUJTO0MwQjhCaUM7O0FBckR0RDtFQXFEYyx3Q2hDckRlO0NnQ3FEdUI7O0FBckRwRDtFQXlEYyxxQzFCbENPO0UwQm1DUCxpQzFCbkNPO0UwQm9DUCxlaEM1Q29CO0NnQzRDSjs7QUEzRDlCO0VBZ0VRLGlGQUF5RztDQUdXOztBL0IwSDFIO0UrQjdMRjtJQW1FWSxpRkFBeUc7R0FBRztDbkNzek92SDs7QUk1ck9DO0UrQjdMRjtJQXdFWSxxQzFCakRTO0cwQmlEeUI7RUF4RTlDO0lBMEVZLHdDaEMxRWlCO0dnQzBFcUI7RUExRWxEO0lBNkVjLHFDMUJ0RE87RzBCc0QyQjtFQTdFaEQ7SUFnRlkscUMxQnpEUztHMEJ5RG9DO0NuQ3d6T3hEOztBbUN4NE9EO0VBZ0JNLDBCaENJNEI7RWdDSDVCLFkxQlFVO0MwQnVEK0M7O0FBaEYvRDs7RUFvQlEsZUFBYztDQUFJOztBQXBCMUI7RUFzQlEsWTFCR1E7QzBCSGU7O0FBdEIvQjtFQXdCUSxnQzFCQ1E7QzBCRW1COztBQTNCbkM7O0VBMkJVLFkxQkZNO0MwQkVpQjs7QUEzQmpDO0VBNkJRLHFEMUJKUTtVMEJJUiw2QzFCSlE7QzBCSXVDOztBL0JnS3JEO0UrQjdMRjtJQWdDVSwwQmhDWndCO0dnQ1lLO0NuQ3k0T3RDOztBbUN6Nk9EOztFQW1DUSxnQzFCVlE7QzBCYW1COztBQXRDbkM7OztFQXNDVSxZMUJiTTtDMEJhaUI7O0FBdENqQztFQXlDVSxZMUJoQk07RTBCaUJOLGFBQVk7Q0FFTTs7QUE1QzVCO0VBNENZLFdBQVU7Q0FBSTs7QUE1QzFCO0VBK0NZLFdBQVU7Q0FBSTs7QUEvQzFCO0VBbURZLFkxQjFCSTtDMEI0QnNDOztBQXJEdEQ7RUFxRGMsd0NoQ3JEZTtDZ0NxRHVCOztBQXJEcEQ7RUF5RGMsdUIxQmhDRTtFMEJpQ0YsbUIxQmpDRTtFMEJrQ0YsZWhDdkNvQjtDZ0N1Q0o7O0FBM0Q5QjtFQWdFUSxpRkFBeUc7Q0FHVzs7QS9CMEgxSDtFK0I3TEY7SUFtRVksaUZBQXlHO0dBQUc7Q25DczVPdkg7O0FJNXhPQztFK0I3TEY7SUF3RVksdUIxQi9DSTtHMEIrQzhCO0VBeEU5QztJQTBFWSx3Q2hDMUVpQjtHZ0MwRXFCO0VBMUVsRDtJQTZFYyx1QjFCcERFO0cwQm9EZ0M7RUE3RWhEO0lBZ0ZZLDJDMUJ2REk7RzBCdUR5QztDbkN3NU94RDs7QUl2eU9DO0UrQmpNRjtJQXFGUSxxQkFBb0I7SUFDcEIsa0JBQWlCO0dBQUk7Q25DeTVPNUI7O0FJOXlPQztFK0JqTUY7SUEwRlEsc0JBQXFCO0lBQ3JCLG1CQUFrQjtHQUFJO0NuQzI1TzdCOztBbUN0L09EO0VBK0ZNLDBCQUFtQjtNQUFuQix1QkFBbUI7VUFBbkIsb0JBQW1CO0VBQ25CLHFCQUFhO0VBQWIscUJBQWE7RUFBYixjQUFhO0NBR1M7O0FBbkc1QjtFQWtHUSxvQkFBWTtNQUFaLHFCQUFZO1VBQVosYUFBWTtFQUNaLHFCQUFjO01BQWQsZUFBYztDQUFJOztBQW5HMUI7RUFxR0ksaUJBQWdCO0NBQUk7O0FBckd4QjtFQXVHSSxrQkFBaUI7Q0FBSTs7QUFJekI7RS9Cb0RFLFVBRHVCO0VBRXZCLFFBRnVCO0VBR3ZCLG1CQUFrQjtFQUNsQixTQUp1QjtFQUt2QixPQUx1QjtFK0JqRHZCLGlCQUFnQjtDQWFLOztBQWZ2QjtFQUlJLFVBQVM7RUFDVCxpQkFBZ0I7RUFDaEIsZ0JBQWU7RUFDZixtQkFBa0I7RUFDbEIsU0FBUTtFQUNSLDhDQUFxQztVQUFyQyxzQ0FBcUM7Q0FBRzs7QUFUNUM7RUFZSSxhQUFZO0NBQUk7O0EvQnNFbEI7RStCbEZGO0lBZUksY0FBYTtHQUFNO0NuQzA2T3RCOztBbUN4Nk9EO0VBQ0UsbUJBQWtCO0NBV2M7O0EvQnFEaEM7RStCakVGO0lBS00scUJBQWE7SUFBYixxQkFBYTtJQUFiLGNBQWE7R0FFaUI7RUFQcEM7SUFPUSx1QkFBc0I7R0FBSTtDbkM4Nk9qQzs7QUloM09DO0UrQnJFRjtJQVNJLHFCQUFhO0lBQWIscUJBQWE7SUFBYixjQUFhO0lBQ2IseUJBQXVCO1FBQXZCLHNCQUF1QjtZQUF2Qix3QkFBdUI7R0FFTztFQVpsQztJQVlNLHFCQUFvQjtHQUFJO0NuQ203TzdCOztBbUMvNk9EOztFQUVFLG9CQUFZO01BQVoscUJBQVk7VUFBWixhQUFZO0VBQ1oscUJBQWM7TUFBZCxlQUFjO0NBQUk7O0FBRXBCO0VBQ0Usb0JBQVk7TUFBWixxQkFBWTtVQUFaLGFBQVk7RUFDWixxQkFBYztNQUFkLGVBQWM7RUFDZCxxQkFBb0I7Q0FBSTs7QUNsSjFCO0VBQ0UscUJBTDJCO0NBWWU7O0FoQ21NMUM7RWdDM01GO0lBTU0scUJBVDhCO0dBU0s7RUFOekM7SUFRTSxzQkFWOEI7R0FVSTtDcEMwa1B2Qzs7QXFDcGxQRDtFQUNFLDZCbENTNEI7RWtDUjVCLDBCQUF5QjtDQUFJIiwiZmlsZSI6ImJ1bG1hLmNzcyJ9 */
\ No newline at end of file
+
+html ::selection {
+ background: #00d1b2;
+ color: #fff;
+}
+
+/*# sourceMappingURL=bulma-docs.css.map */
\ No newline at end of file
diff --git a/hshassets/assets/sass/lib/bulma-0.5.1/docs/css/bulma-docs.css.map b/hshassets/assets/sass/lib/bulma-0.5.1/docs/css/bulma-docs.css.map
new file mode 100644
index 0000000000000000000000000000000000000000..6ab040011d08df7619b012a7f7e9e91507ed6c56
--- /dev/null
+++ b/hshassets/assets/sass/lib/bulma-0.5.1/docs/css/bulma-docs.css.map
@@ -0,0 +1 @@
+{"version":3,"sources":["bulma-docs.css"],"names":[],"mappings":"AAAA,iBAAiB;AACjB,8DAA8D;AAC9D;EACE;IACE,gCAAwB;YAAxB,wBAAwB;GACzB;EACD;IACE,kCAA0B;YAA1B,0BAA0B;GAC3B;CACF;AAPD;EACE;IACE,gCAAwB;YAAxB,wBAAwB;GACzB;EACD;IACE,kCAA0B;YAA1B,0BAA0B;GAC3B;CACF;;AAED,2EAA2E;AAC3E;;;;;;;;;;;;;;;;;;;;;;;EAuBE,UAAU;EACV,WAAW;CACZ;;AAED;;;;;;EAME,gBAAgB;EAChB,oBAAoB;CACrB;;AAED;EACE,iBAAiB;CAClB;;AAED;;;;EAIE,UAAU;CACX;;AAED;EACE,+BAAuB;UAAvB,uBAAuB;CACxB;;AAED;EACE,4BAAoB;UAApB,oBAAoB;CACrB;;AAED;EACE,4BAAoB;UAApB,oBAAoB;CACrB;;AAED;;;;;EAKE,gBAAgB;CACjB;;AAED;EACE,UAAU;CACX;;AAED;EACE,0BAA0B;EAC1B,kBAAkB;CACnB;;AAED;;EAEE,WAAW;EACX,iBAAiB;CAClB;;AAED;EACE,uBAAuB;EACvB,gBAAgB;EAChB,mCAAmC;EACnC,oCAAoC;EACpC,iBAAiB;EACjB,mBAAmB;EACnB,mBAAmB;EACnB,mCAAmC;CACpC;;AAED;;;;;;;EAOE,eAAe;CAChB;;AAED;;;;;EAKE,qLAAqL;CACtL;;AAED;;EAEE,8BAA8B;EAC9B,6BAA6B;EAC7B,uBAAuB;CACxB;;AAED;EACE,eAAe;EACf,gBAAgB;EAChB,iBAAiB;EACjB,iBAAiB;CAClB;;AAED;EACE,eAAe;EACf,gBAAgB;EAChB,sBAAsB;CACvB;;AAED;EACE,oBAAoB;CACrB;;AAED;EACE,eAAe;CAChB;;AAED;EACE,6BAA6B;EAC7B,eAAe;EACf,mBAAmB;EACnB,oBAAoB;EACpB,6BAA6B;CAC9B;;AAED;EACE,0BAA0B;EAC1B,aAAa;EACb,eAAe;EACf,YAAY;EACZ,iBAAiB;CAClB;;AAED;EACE,aAAa;EACb,gBAAgB;CACjB;;AAED;;EAEE,yBAAyB;CAC1B;;AAED;EACE,mBAAmB;CACpB;;AAED;EACE,oBAAoB;EACpB,qBAAqB;CACtB;;AAED;EACE,eAAe;EACf,iBAAiB;CAClB;;AAED;EACE,6BAA6B;EAC7B,eAAe;EACf,mBAAmB;EACnB,iBAAiB;EACjB,kBAAkB;CACnB;;AAED;EACE,kCAAkC;EAClC,iBAAiB;EACjB,eAAe;EACf,eAAe;EACf,eAAe;EACf,iBAAiB;EACjB,wBAAwB;CACzB;;AAED;;EAEE,iBAAiB;EACjB,oBAAoB;CACrB;;AAED;EACE,eAAe;CAChB;;AAED;EACE,YAAY;EACZ,aAAa;EACb,eAAe;CAChB;;AAED;EACE,uBAAuB;CACxB;;AAED;EACE,wBAAwB;CACzB;;AAED;EACE,4BAA4B;CAC7B;;AAED;EACE,UAAU;EACV,QAAQ;EACR,mBAAmB;EACnB,SAAS;EACT,OAAO;CACR;;AAED;EACE,2BAA2B;CAC5B;;AAED;EACE;IACE,2BAA2B;GAC5B;CACF;;AAED;EACE;IACE,2BAA2B;GAC5B;CACF;;AAED;EACE;IACE,2BAA2B;GAC5B;CACF;;AAED;EACE;IACE,2BAA2B;GAC5B;CACF;;AAED;EACE;IACE,2BAA2B;GAC5B;CACF;;AAED;EACE;IACE,2BAA2B;GAC5B;CACF;;AAED;EACE,6BAA6B;CAC9B;;AAED;EACE;IACE,6BAA6B;GAC9B;CACF;;AAED;EACE;IACE,6BAA6B;GAC9B;CACF;;AAED;EACE;IACE,6BAA6B;GAC9B;CACF;;AAED;EACE;IACE,6BAA6B;GAC9B;CACF;;AAED;EACE;IACE,6BAA6B;GAC9B;CACF;;AAED;EACE;IACE,6BAA6B;GAC9B;CACF;;AAED;EACE,2BAA2B;CAC5B;;AAED;EACE;IACE,2BAA2B;GAC5B;CACF;;AAED;EACE;IACE,2BAA2B;GAC5B;CACF;;AAED;EACE;IACE,2BAA2B;GAC5B;CACF;;AAED;EACE;IACE,2BAA2B;GAC5B;CACF;;AAED;EACE;IACE,2BAA2B;GAC5B;CACF;;AAED;EACE;IACE,2BAA2B;GAC5B;CACF;;AAED;EACE,6BAA6B;CAC9B;;AAED;EACE;IACE,6BAA6B;GAC9B;CACF;;AAED;EACE;IACE,6BAA6B;GAC9B;CACF;;AAED;EACE;IACE,6BAA6B;GAC9B;CACF;;AAED;EACE;IACE,6BAA6B;GAC9B;CACF;;AAED;EACE;IACE,6BAA6B;GAC9B;CACF;;AAED;EACE;IACE,6BAA6B;GAC9B;CACF;;AAED;EACE,8BAA8B;CAC/B;;AAED;EACE;IACE,8BAA8B;GAC/B;CACF;;AAED;EACE;IACE,8BAA8B;GAC/B;CACF;;AAED;EACE;IACE,8BAA8B;GAC/B;CACF;;AAED;EACE;IACE,8BAA8B;GAC/B;CACF;;AAED;EACE;IACE,8BAA8B;GAC/B;CACF;;AAED;EACE;IACE,8BAA8B;GAC/B;CACF;;AAED;EACE,2BAA2B;CAC5B;;AAED;EACE;IACE,2BAA2B;GAC5B;CACF;;AAED;EACE;IACE,2BAA2B;GAC5B;CACF;;AAED;EACE;IACE,2BAA2B;GAC5B;CACF;;AAED;EACE;IACE,2BAA2B;GAC5B;CACF;;AAED;EACE;IACE,2BAA2B;GAC5B;CACF;;AAED;EACE;IACE,2BAA2B;GAC5B;CACF;;AAED;EACE,8BAA8B;CAC/B;;AAED;EACE;IACE,8BAA8B;GAC/B;CACF;;AAED;EACE;IACE,8BAA8B;GAC/B;CACF;;AAED;EACE;IACE,8BAA8B;GAC/B;CACF;;AAED;EACE;IACE,8BAA8B;GAC/B;CACF;;AAED;EACE;IACE,8BAA8B;GAC/B;CACF;;AAED;EACE;IACE,8BAA8B;GAC/B;CACF;;AAED;EACE,8BAA8B;CAC/B;;AAED;EACE;IACE,8BAA8B;GAC/B;CACF;;AAED;EACE;IACE,8BAA8B;GAC/B;CACF;;AAED;EACE;IACE,8BAA8B;GAC/B;CACF;;AAED;EACE;IACE,8BAA8B;GAC/B;CACF;;AAED;EACE;IACE,8BAA8B;GAC/B;CACF;;AAED;EACE;IACE,8BAA8B;GAC/B;CACF;;AAED;EACE;IACE,8BAA8B;GAC/B;CACF;;AAED;EACE;IACE,8BAA8B;GAC/B;CACF;;AAED;EACE;IACE,8BAA8B;GAC/B;CACF;;AAED;EACE,4BAA4B;CAC7B;;AAED;EACE;IACE,4BAA4B;GAC7B;CACF;;AAED;EACE;IACE,4BAA4B;GAC7B;CACF;;AAED;EACE;IACE,4BAA4B;GAC7B;CACF;;AAED;EACE;IACE,4BAA4B;GAC7B;CACF;;AAED;EACE;IACE,4BAA4B;GAC7B;CACF;;AAED;EACE;IACE,4BAA4B;GAC7B;CACF;;AAED;EACE;IACE,4BAA4B;GAC7B;CACF;;AAED;EACE;IACE,4BAA4B;GAC7B;CACF;;AAED;EACE;IACE,4BAA4B;GAC7B;CACF;;AAED;EACE,6BAA6B;CAC9B;;AAED;EACE;IACE,6BAA6B;GAC9B;CACF;;AAED;EACE;IACE,6BAA6B;GAC9B;CACF;;AAED;EACE;IACE,6BAA6B;GAC9B;CACF;;AAED;EACE;IACE,6BAA6B;GAC9B;CACF;;AAED;EACE;IACE,6BAA6B;GAC9B;CACF;;AAED;EACE;IACE,6BAA6B;GAC9B;CACF;;AAED;EACE;IACE,6BAA6B;GAC9B;CACF;;AAED;EACE;IACE,6BAA6B;GAC9B;CACF;;AAED;EACE;IACE,6BAA6B;GAC9B;CACF;;AAED;EACE,sCAAsC;CACvC;;AAED;EACE,qCAAqC;CACtC;;AAED;EACE,qCAAqC;CACtC;;AAED;EACE,wBAAwB;CACzB;;AAED;EACE,0BAA0B;CAC3B;;AAED;EACE,0BAA0B;CAC3B;;AAED;EACE,wBAAwB;CACzB;;AAED;EACE,6BAA6B;CAC9B;;AAED;EACE,0BAA0B;CAC3B;;AAED;EACE,0BAA0B;CAC3B;;AAED;EACE,0BAA0B;CAC3B;;AAED;EACE,0BAA0B;CAC3B;;AAED;EACE,0BAA0B;CAC3B;;AAED;EACE,0BAA0B;CAC3B;;AAED;EACE,0BAA0B;CAC3B;;AAED;EACE,0BAA0B;CAC3B;;AAED;EACE,0BAA0B;CAC3B;;AAED;EACE,0BAA0B;CAC3B;;AAED;EACE,0BAA0B;CAC3B;;AAED;EACE,0BAA0B;CAC3B;;AAED;EACE,0BAA0B;CAC3B;;AAED;EACE,0BAA0B;CAC3B;;AAED;EACE,0BAA0B;CAC3B;;AAED;EACE,0BAA0B;CAC3B;;AAED;EACE,0BAA0B;CAC3B;;AAED;EACE,0BAA0B;CAC3B;;AAED;EACE,0BAA0B;CAC3B;;AAED;EACE,0BAA0B;CAC3B;;AAED;EACE,6BAA6B;CAC9B;;AAED;EACE,0BAA0B;CAC3B;;AAED;EACE,0BAA0B;CAC3B;;AAED;EACE;IACE,0BAA0B;GAC3B;CACF;;AAED;EACE;IACE,0BAA0B;GAC3B;CACF;;AAED;EACE;IACE,0BAA0B;GAC3B;CACF;;AAED;EACE;IACE,0BAA0B;GAC3B;CACF;;AAED;EACE;IACE,0BAA0B;GAC3B;CACF;;AAED;EACE;IACE,0BAA0B;GAC3B;CACF;;AAED;EACE;IACE,0BAA0B;GAC3B;CACF;;AAED;EACE;IACE,0BAA0B;GAC3B;CACF;;AAED;EACE;IACE,0BAA0B;GAC3B;CACF;;AAED;EACE,gCAAyB;EAAzB,gCAAyB;EAAzB,yBAAyB;CAC1B;;AAED;EACE;IACE,gCAAyB;IAAzB,gCAAyB;IAAzB,yBAAyB;GAC1B;CACF;;AAED;EACE;IACE,gCAAyB;IAAzB,gCAAyB;IAAzB,yBAAyB;GAC1B;CACF;;AAED;EACE;IACE,gCAAyB;IAAzB,gCAAyB;IAAzB,yBAAyB;GAC1B;CACF;;AAED;EACE;IACE,gCAAyB;IAAzB,gCAAyB;IAAzB,yBAAyB;GAC1B;CACF;;AAED;EACE;IACE,gCAAyB;IAAzB,gCAAyB;IAAzB,yBAAyB;GAC1B;CACF;;AAED;EACE;IACE,gCAAyB;IAAzB,gCAAyB;IAAzB,yBAAyB;GAC1B;CACF;;AAED;EACE;IACE,gCAAyB;IAAzB,gCAAyB;IAAzB,yBAAyB;GAC1B;CACF;;AAED;EACE;IACE,gCAAyB;IAAzB,gCAAyB;IAAzB,yBAAyB;GAC1B;CACF;;AAED;EACE;IACE,gCAAyB;IAAzB,gCAAyB;IAAzB,yBAAyB;GAC1B;CACF;;AAED;EACE,2BAA2B;CAC5B;;AAED;EACE;IACE,2BAA2B;GAC5B;CACF;;AAED;EACE;IACE,2BAA2B;GAC5B;CACF;;AAED;EACE;IACE,2BAA2B;GAC5B;CACF;;AAED;EACE;IACE,2BAA2B;GAC5B;CACF;;AAED;EACE;IACE,2BAA2B;GAC5B;CACF;;AAED;EACE;IACE,2BAA2B;GAC5B;CACF;;AAED;EACE;IACE,2BAA2B;GAC5B;CACF;;AAED;EACE;IACE,2BAA2B;GAC5B;CACF;;AAED;EACE;IACE,2BAA2B;GAC5B;CACF;;AAED;EACE,iCAAiC;CAClC;;AAED;EACE;IACE,iCAAiC;GAClC;CACF;;AAED;EACE;IACE,iCAAiC;GAClC;CACF;;AAED;EACE;IACE,iCAAiC;GAClC;CACF;;AAED;EACE;IACE,iCAAiC;GAClC;CACF;;AAED;EACE;IACE,iCAAiC;GAClC;CACF;;AAED;EACE;IACE,iCAAiC;GAClC;CACF;;AAED;EACE;IACE,iCAAiC;GAClC;CACF;;AAED;EACE;IACE,iCAAiC;GAClC;CACF;;AAED;EACE;IACE,iCAAiC;GAClC;CACF;;AAED;EACE,uCAAgC;EAAhC,uCAAgC;EAAhC,gCAAgC;CACjC;;AAED;EACE;IACE,uCAAgC;IAAhC,uCAAgC;IAAhC,gCAAgC;GACjC;CACF;;AAED;EACE;IACE,uCAAgC;IAAhC,uCAAgC;IAAhC,gCAAgC;GACjC;CACF;;AAED;EACE;IACE,uCAAgC;IAAhC,uCAAgC;IAAhC,gCAAgC;GACjC;CACF;;AAED;EACE;IACE,uCAAgC;IAAhC,uCAAgC;IAAhC,gCAAgC;GACjC;CACF;;AAED;EACE;IACE,uCAAgC;IAAhC,uCAAgC;IAAhC,gCAAgC;GACjC;CACF;;AAED;EACE;IACE,uCAAgC;IAAhC,uCAAgC;IAAhC,gCAAgC;GACjC;CACF;;AAED;EACE;IACE,uCAAgC;IAAhC,uCAAgC;IAAhC,gCAAgC;GACjC;CACF;;AAED;EACE;IACE,uCAAgC;IAAhC,uCAAgC;IAAhC,gCAAgC;GACjC;CACF;;AAED;EACE;IACE,uCAAgC;IAAhC,uCAAgC;IAAhC,gCAAgC;GACjC;CACF;;AAED;EACE,yBAAyB;CAC1B;;AAED;EACE;IACE,yBAAyB;GAC1B;CACF;;AAED;EACE;IAC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,kBAAkB;IAClB,YAAY;GACb;CACF;;AAED;EACE;IACE,kBAAkB;IAClB,cAAc;GACf;CACF;;AAED;EACE;IACE,kBAAkB;IAClB,cAAc;GACf;CACF;;AAED;EACE,sBAAsB;CACvB;;AAED;EACE,mBAAmB;CACpB;;AAED;;;;;;;EAOE,mBAAmB;CACpB;;AAED;;;;;;EAME,eAAe;EACf,iBAAiB;EACjB,mBAAmB;CACpB;;AAED;EACE,eAAe;EACf,qBAAqB;CACtB;;AAED;EACE,gBAAgB;CACjB;;AAED;EACE,kBAAkB;EAClB,wBAAwB;CACzB;;AAED;EACE,qBAAqB;CACtB;;AAED;EACE,iBAAiB;EACjB,wBAAwB;CACzB;;AAED;EACE,qBAAqB;CACtB;;AAED;EACE,kBAAkB;EAClB,qBAAqB;CACtB;;AAED;EACE,mBAAmB;EACnB,wBAAwB;CACzB;;AAED;EACE,eAAe;EACf,mBAAmB;CACpB;;AAED;EACE,6BAA6B;EAC7B,+BAA+B;EAC/B,sBAAsB;CACvB;;AAED;EACE,4BAA4B;EAC5B,iBAAiB;EACjB,gBAAgB;CACjB;;AAED;EACE,yBAAyB;EACzB,iBAAiB;EACjB,gBAAgB;CACjB;;AAED;EACE,wBAAwB;EACxB,kBAAkB;CACnB;;AAED;EACE,wBAAwB;CACzB;;AAED;EACE,iBAAiB;CAClB;;AAED;EACE,YAAY;EACZ,mBAAmB;CACpB;;AAED;EACE,sBAAsB;CACvB;;AAED;EACE,mBAAmB;CACpB;;AAED;EACE,kCAAkC;EAClC,iBAAiB;EACjB,sBAAsB;EACtB,iBAAiB;EACjB,kBAAkB;CACnB;;AAED;;EAEE,eAAe;CAChB;;AAED;EACE,YAAY;CACb;;AAED;;EAEE,0BAA0B;EAC1B,sBAAsB;EACtB,sBAAsB;EACtB,oBAAoB;CACrB;;AAED;EACE,eAAe;EACf,iBAAiB;CAClB;;AAED;EACE,6BAA6B;CAC9B;;AAED;;EAEE,sBAAsB;EACtB,eAAe;CAChB;;AAED;;EAEE,sBAAsB;EACtB,eAAe;CAChB;;AAED;;EAEE,uBAAuB;CACxB;;AAED;EAC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wB;UAAxB,wBAAwB;CACzB;;AAED;EACE,sBAA0B;MAA1B,mBAA0B;UAA1B,0BAA0B;CAC3B;;AAED;EACE,oBAAgB;MAAhB,gBAAgB;CACjB;;AAED;EACE,uBAAuB;CACxB;;AAED;EACE,wBAAwB;CACzB;;AAED;EACE,iBAAiB;CAClB;;AAED;EACE;IACE,qBAAc;IAAd,qBAAc;IAAd,cAAc;GACf;CACF;;AAED;EACE,mBAAmB;CACpB;;AAED;EACE;IACE,sBAAsB;GACvB;CACF;;AAED;EACE;IACE,2BAAc;QAAd,cAAc;IACd,oBAAa;QAAb,qBAAa;YAAb,aAAa;IACb,qBAAe;QAAf,eAAe;IACf,qBAAqB;IACrB,kBAAkB;GACnB;EACD;IACE,mBAAmB;IACnB,qBAAqB;GACtB;EACD;IACE,qBAAqB;GACtB;EACD;IACE,mBAAmB;IACnB,qBAAqB;GACtB;EACD;IACE,kBAAkB;IAClB,qBAAqB;GACtB;CACF;;AAED;EACE,iBAAiB;CAClB;;AAED;EACE;IACE,qBAAc;IAAd,qBAAc;IAAd,cAAc;IACd,2BAAc;QAAd,cAAc;IACd,oBAAa;QAAb,qBAAa;YAAb,aAAa;IACb,qBAAe;QAAf,eAAe;GAChB;EACD;IACE,iBAAiB;GAClB;EACD;IACE,qBAAe;QAAf,eAAe;GAChB;EACD;IACE,oBAAa;QAAb,qBAAa;YAAb,aAAa;GACd;EACD;IACE,sBAAsB;GACvB;CACF;;AAED;EACE,gBAAgB;EAChB,mBAAmB;EACnB,iBAAiB;CAClB;;AAED;EACE,eAAe;EACf,eAAe;EACf,qBAAqB;EACrB,mBAAmB;EACnB,OAAO;EACP,cAAc;EACd,WAAW;CACZ;;AAED;EACE,eAAe;CAChB;;AAED;EACE,mBAAmB;CACpB;;AAED;EACE,mBAAmB;CACpB;;AAED;EACE,kBAAkB;CACnB;;AAED;EACE,QAAQ;CACT;;AAED;EACE,qBAAqB;CACtB;;AAED;EACE,SAAS;CACV;;AAED;EACE,sBAAsB;CACvB;;AAED;;;EAGE,eAAe;CAChB;;AAED;;;EAGE,mBAAmB;CACpB;;AAED;;;EAGE,mBAAmB;CACpB;;AAED;;;EAGE,kBAAkB;CACnB;;AAED;EACE,eAAe;EACf,eAAe;EACf,qBAAqB;EACrB,mBAAmB;EACnB,OAAO;EACP,cAAc;EACd,WAAW;CACZ;;AAED;;EAEE,qBAAqB;CACtB;;AAED;EACE,QAAQ;CACT;;AAED;;EAEE,sBAAsB;CACvB;;AAED;EACE,SAAS;CACV;;AAED;EACE,oDAA4C;UAA5C,4CAA4C;EAC5C,0BAA0B;EAC1B,wBAAwB;EACxB,gCAAgC;EAChC,8BAA8B;EAC9B,YAAY;EACZ,eAAe;EACf,YAAY;EACZ,mBAAmB;EACnB,WAAW;EACX,8BAA8B;EAC9B,eAAe;EACf,aAAa;CACd;;AAED;EACE,mBAAmB;CACpB;;AAED;EACE,mBAAmB;CACpB;;AAED;EACE,kBAAkB;CACnB;;AAED;EACE,0BAAoB;MAApB,uBAAoB;UAApB,oBAAoB;EACpB,4BAAqB;EAArB,4BAAqB;EAArB,qBAAqB;EACrB,yBAAwB;MAAxB,sBAAwB;UAAxB,wBAAwB;EACxB,eAAe;EACf,cAAc;CACf;;AAED;EACE,gBAAgB;CACjB;;AAED;EACE,aAAa;EACb,YAAY;CACb;;AAED;EACE,gBAAgB;CACjB;;AAED;EACE,aAAa;EACb,YAAY;CACb;;AAED;EACE,gBAAgB;CACjB;;AAED;EACE,aAAa;EACb,YAAY;CACb;;AAED;EACE,gBAAgB;CACjB;;AAED;EACE,eAAe;EACf,mBAAmB;CACpB;;AAED;EACE,eAAe;EACf,aAAa;EACb,YAAY;CACb;;AAED;EACE,UAAU;EACV,QAAQ;EACR,mBAAmB;EACnB,SAAS;EACT,OAAO;EACP,aAAa;EACb,YAAY;CACb;;AAED;EACE,kBAAkB;CACnB;;AAED;EACE,iBAAiB;CAClB;;AAED;EACE,sBAAsB;CACvB;;AAED;EACE,oBAAoB;CACrB;;AAED;EACE,iBAAiB;CAClB;;AAED;EACE,aAAa;EACb,YAAY;CACb;;AAED;EACE,aAAa;EACb,YAAY;CACb;;AAED;EACE,aAAa;EACb,YAAY;CACb;;AAED;EACE,aAAa;EACb,YAAY;CACb;;AAED;EACE,aAAa;EACb,YAAY;CACb;;AAED;EACE,aAAa;EACb,YAAY;CACb;;AAED;EACE,cAAc;EACd,aAAa;CACd;;AAED;EACE,6BAA6B;EAC7B,mBAAmB;EACnB,uCAAuC;EACvC,mBAAmB;CACpB;;AAED;EACE,sBAAsB;CACvB;;AAED;EACE,oBAAoB;EACpB,2BAA2B;CAC5B;;AAED;EACE,oBAAoB;CACrB;;AAED;;EAEE,kBAAkB;CACnB;;AAED;EACE,wBAAwB;CACzB;;AAED;EACE,mBAAmB;EACnB,aAAa;EACb,WAAW;CACZ;;AAED;;;EAGE,oBAAoB;CACrB;;AAED;EACE,wBAAwB;EACxB,eAAe;CAChB;;AAED;EACE,0BAA0B;EAC1B,aAAa;CACd;;AAED;EACE,6BAA6B;EAC7B,eAAe;CAChB;;AAED;EACE,0BAA0B;EAC1B,kBAAkB;CACnB;;AAED;EACE,0BAA0B;EAC1B,YAAY;CACb;;AAED;EACE,0BAA0B;EAC1B,YAAY;CACb;;AAED;EACE,0BAA0B;EAC1B,YAAY;CACb;;AAED;EACE,0BAA0B;EAC1B,0BAA0B;CAC3B;;AAED;EACE,0BAA0B;EAC1B,YAAY;CACb;;AAED;EACE,sBAAsB;EACtB,yBAAyB;EACzB,aAAa;EACb,wBAAwB;EACxB,eAAe;EACf,aAAa;EACb,iBAAiB;EACjB,WAAW;EACX,YAAY;CACb;;AAED;EACE,sBAAsB;CACvB;;AAED;EACE,0BAA0B;CAC3B;;AAED;EACE,0BAA0B;CAC3B;;AAED;EACE,0BAA0B;CAC3B;;AAED;EACE,wBAAwB;CACzB;;AAED;EACE,wBAAwB;CACzB;;AAED;EACE,0BAA0B;CAC3B;;AAED;EACE,0BAA0B;CAC3B;;AAED;EACE,6BAA6B;CAC9B;;AAED;EACE,6BAA6B;CAC9B;;AAED;EACE,0BAA0B;CAC3B;;AAED;EACE,0BAA0B;CAC3B;;AAED;EACE,0BAA0B;CAC3B;;AAED;EACE,0BAA0B;CAC3B;;AAED;EACE,0BAA0B;CAC3B;;AAED;EACE,0BAA0B;CAC3B;;AAED;EACE,0BAA0B;CAC3B;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AAED;EACE,0BAA0B;CAC3B;;AAED;EACE,0BAA0B;CAC3B;;AAED;EACE,wBAAwB;CACzB;;AAED;EACE,2BAA2B;CAC5B;;AAED;;EAEE,uBAAuB;CACxB;;AAED;;EAEE,sBAAsB;CACvB;;AAED;;;;EAIE,qBAAqB;CACtB;;AAED;;EAEE,uBAAuB;CACxB;;AAED;EACE,eAAe;EACf,gBAAgB;EAChB,iBAAiB;EACjB,mBAAmB;CACpB;;AAED;EACE,eAAe;EACf,qBAAqB;CACtB;;AAED;EACE,qBAAqB;CACtB;;AAED;EACE,oBAAoB;CACrB;;AAED;EACE,gBAAgB;CACjB;;AAED;EACE,kBAAkB;CACnB;;AAED;EACE,gBAAgB;CACjB;;AAED;EACE,kBAAkB;CACnB;;AAED;EACE,mBAAmB;CACpB;;AAED;EACE,gBAAgB;CACjB;;AAED;EACE,mBAAmB;CACpB;;AAED;EACE,eAAe;EACf,mBAAmB;EACnB,iBAAiB;EACjB,kBAAkB;CACnB;;AAED;EACE,eAAe;EACf,iBAAiB;CAClB;;AAED;EACE,oBAAoB;CACrB;;AAED;EACE,gBAAgB;CACjB;;AAED;EACE,kBAAkB;CACnB;;AAED;EACE,gBAAgB;CACjB;;AAED;EACE,kBAAkB;CACnB;;AAED;EACE,mBAAmB;CACpB;;AAED;EACE,gBAAgB;CACjB;;AAED;EACE,mBAAmB;CACpB;;AAED;EACE,sBAAsB;CACvB;;AAED;EACE,4BAA4B;EAC5B,0BAA0B;EAC1B,uBAAuB;EACvB,sBAAsB;EACtB,kBAAkB;EAClB,sBAAsB;EACtB,yBAAyB;EACzB,wCAAwC;EACxC,aAAa;EACb,wBAAwB;EACxB,gBAAgB;EAChB,sBAAsB;EACtB,oBAAa;MAAb,qBAAa;UAAb,aAAa;EACb,qBAAe;MAAf,eAAe;EACf,gBAAgB;EAChB,aAAa;EACb,iBAAiB;EACjB,gBAAgB;EAChB,iBAAiB;EACjB,gBAAgB;EAChB,cAAc;EACd,mBAAmB;EACnB,oBAAoB;EACpB,YAAY;CACb;;AAED;EACE,wBAAwB;EACxB,YAAY;EACZ,eAAe;EACf,U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EACxB,qBAAc;EAAd,qBAAc;EAAd,cAAc;EACd,iBAAiB;CAClB;;AAED;EACE,uBAAuB;CACxB;;AAED;EACE,+CAA+C;EAC/C,qBAAc;EAAd,qBAAc;EAAd,cAAc;EACd,qBAAqB;CACtB;;AAED;;EAEE,sBAAsB;CACvB;;AAED;EACE,oBAAoB;CACrB;;AAED;EACE,mBAAmB;CACpB;;AAED;EACE,+CAA+C;EAC/C,iBAAiB;EACjB,kBAAkB;CACnB;;AAED;EACE,mBAAmB;EACnB,oBAAoB;CACrB;;AAED;;EAEE,8BAAiB;MAAjB,iBAAiB;EACjB,oBAAa;MAAb,qBAAa;UAAb,aAAa;EACb,qBAAe;MAAf,eAAe;CAChB;;AAED;EACE,mBAAmB;CACpB;;AAED;EACE,kBAAkB;CACnB;;AAED;EACE,8BAAiB;MAAjB,iBAAiB;EACjB,oBAAa;MAAb,qBAAa;UAAb,aAAa;EACb,qBAAe;MAAf,eAAe;EACf,iBAAiB;CAClB;;AAED;EACE,gBAAgB;CACjB;;AAED;EACE,mBAAmB;CACpB;;AAED;EACE,mBAAmB;CACpB;;AAED;EACE,kBAAkB;CACnB;;AAED;EACE,kBAAkB;CACnB;;AAED;EACE,mBAAmB;EACnB,eAAe;EACf,eAAe;EACf,sBAAsB;CACvB;;AAED;EACE,6BAA6B;EAC7B,eAAe;CAChB;;AAED;EACE,0BAA0B;EAC1B,YAAY;CACb;;AAED;EACE,+BAA+B;EAC/B,eAAe;EACf,qBAAqB;CACtB;;AAED;EACE,eAAe;EACf,kBAAkB;EAClB,sBAAsB;EACtB,0BAA0B;CAC3B;;AAED;EACE,gBAAgB;CACjB;;AAED;EACE,mBAAmB;CACpB;;AAED;EACE,6BAA6B;EAC7B,mBAAmB;EACnB,gBAAgB;CACjB;;AAED;EACE,sBAAsB;CACvB;;AAED;EACE,mBAAmB;CACpB;;AAED;EACE,mBAAmB;CACpB;;AAED;EACE,kBAAkB;CACnB;;AAED;EACE,wBAAwB;CACzB;;AAED;EACE,wBAAwB;EACxB,eAAe;CAChB;;AAED;EACE,oBAAoB;EACpB,eAAe;CAChB;;AAED;EACE,0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AW;QAAX,eAAW;YAAX,WAAW;IACX,iBAAiB;GAClB;EACD;IACE,uBAAuB;GACxB;EACD;IACE,oBAAW;QAAX,eAAW;YAAX,WAAW;IACX,iBAAiB;GAClB;EACD;IACE,uBAAuB;GACxB;EACD;IACE,oBAAW;QAAX,eAAW;YAAX,WAAW;IACX,WAAW;GACZ;EACD;IACE,iBAAiB;GAClB;EACD;IACE,oBAAW;QAAX,eAAW;YAAX,WAAW;IACX,iBAAiB;GAClB;EACD;IACE,uBAAuB;GACxB;EACD;IACE,oBAAW;QAAX,eAAW;YAAX,WAAW;IACX,iBAAiB;GAClB;EACD;IACE,uBAAuB;GACxB;EACD;IACE,oBAAW;QAAX,eAAW;YAAX,WAAW;IACX,YAAY;GACb;EACD;IACE,kBAAkB;GACnB;CACF;;AAED;EACE,sBAAsB;EACtB,uBAAuB;EACvB,qBAAqB;CACtB;;AAED;EACE,wBAAwB;CACzB;;AAED;EACE,uBAAuB;CACxB;;AAED;EACE,yBAAwB;MAAxB,sBAAwB;UAAxB,wBAAwB;CACzB;;AAED;EACE,eAAe;EACf,gBAAgB;EAChB,cAAc;CACf;;AAED;EACE,iBAAiB;CAClB;;AAED;EACE,sBAAsB;CACvB;;AAED;EACE,UAAU;EACV,WAAW;CACZ;;AAED;EACE;IACE,oBAAgB;QAAhB,gBAAgB;GACjB;EACD;IACE,oBAAoB;IACpB,iBAAiB;IACjB,gBAAgB;GACjB;EACD;IACE,eAAe;GAChB;CACF;;AAED;EACE,qBAAc;EAAd,qBAAc;EAAd,cAAc;CACf;;AAED;EACE,oBAAgB;MAAhB,gBAAgB;CACjB;;AAED;EACE,0BAAoB;MAApB,uBAAoB;UAApB,oBAAoB;CACrB;;AAED;EACE;IACE,qBAAc;IAAd,qBAAc;IAAd,cAAc;GACf;CACF;;AAED;EACE;IACE,qBAAc;IAAd,qBAAc;IAAd,cAAc;GACf;CACF;;AAED;EACE,2BAAqB;MAArB,wBAAqB;UAArB,qBAAqB;EACrB,eAAe;EACf,2BAAc;MAAd,cAAc;EACd,oBAAa;MAAb,qBAAa;UAAb,aAAa;EACb,qBAAe;MAAf,eAAe;EACf,gCAAwB;EAAxB,6BAAwB;EAAxB,wBAAwB;CACzB;;AAED;EACE,sBAAsB;EACtB,uBAAuB;EACvB,qBAAqB;CACtB;;AAED;EACE,wBAAwB;CACzB;;AAED;EACE,uBAAuB;CACxB;;AAED;EACE,qBAAqB;CACtB;;AAED;EACE,iBAAiB;CAClB;;AAED;EACE,6BAAuB;EAAvB,8BAAuB;MAAvB,2BAAuB;UAAvB,uBAAuB;CACxB;;AAED;EACE,iCAAiC;CAClC;;AAED;EACE;IACE,qBAAc;IAAd,qBAAc;IAAd,cAAc;GACf;EACD;IACE,oBAAW;QAAX,eAAW;YAAX,WAAW;IACX,gBAAgB;GACjB;EACD;IACE,oBAAW;QAAX,eAAW;YAAX,WAAW;IACX,iBAAiB;GAClB;EACD;IACE,oBAAW;QAAX,eAAW;YAAX,WAAW;IACX,WAAW;GACZ;EACD;IACE,oBAAW;QAAX,eAAW;YAAX,WAAW;IACX,iBAAiB;GAClB;EACD;IACE,oBAAW;QAAX,eAAW;YAAX,WAAW;IACX,iBAAiB;GAClB;EACD;IACE,oBAAW;QAAX,eAAW;YAAX,WAAW;IACX,WAAW;GACZ;EACD;IACE,oBAAW;QAAX,eAAW;YAAX,WAAW;IACX,iBAAiB;GAClB;EACD;IACE,oBAAW;QAAX,eAAW;YAAX,WAAW;IACX,iBAAiB;GAClB;EACD;IACE,oBAAW;QAAX,eAAW;YAAX,WAAW;IACX,WAAW;GACZ;EACD;IACE,oBAAW;QAAX,eAAW;YAAX,WAAW;IACX,iBAAiB;GAClB;EACD;IACE,oBAAW;QAAX,eAAW;YAAX,WAAW;IACX,iBAAiB;GAClB;EACD;IACE,oBAAW;QAAX,eAAW;YAAX,WAAW;IACX,YAAY;GACb;CACF;;AAED;EACE,2BAAqB;MAArB,wBAAqB;UAArB,qBAAqB;EACrB,qBAAc;EAAd,qBAAc;EAAd,cAAc;EACd,6BAAuB;EAAvB,8BAAuB;MAAvB,2BAAuB;UAAvB,uBAAuB;EACvB,0BAA+B;MAA/B,uBAA+B;UAA/B,+BAA+B;CAChC;;AAED;EACE,iBAAiB;EACjB,qDAA6C;UAA7C,6CAA6C;CAC9C;;AAED;EACE,oBAAoB;CACrB;;AAED;EACE,wBAAwB;EACxB,eAAe;CAChB;;AAED;;EAEE,eAAe;CAChB;;AAED;EACE,eAAe;CAChB;;AAED;EACE,6BAA6B;CAC9B;;AAED;;EAEE,eAAe;CAChB;;AAED;EACE,kDAA0C;UAA1C,0CAA0C;CAC3C;;AAED;EACE;IACE,wBAAwB;GACzB;CACF;;AAED;;EAEE,6BAA6B;CAC9B;;AAED;;;EAGE,eAAe;CAChB;;AAED;EACE,eAAe;EACf,aAAa;CACd;;AAED;EACE,WAAW;CACZ;;AAED;EACE,WAAW;CACZ;;AAED;EACE,eAAe;CAChB;;AAED;EACE,wCAAwC;CACzC;;AAED;EACE,0BAA0B;EAC1B,sBAAsB;EACtB,aAAa;CACd;;AAED;EACE,6EAA6E;CAC9E;;AAED;EACE;IACE,6EAA6E;GAC9E;CACF;;AAED;EACE;IACE,0BAA0B;GAC3B;EACD;IACE,wCAAwC;GACzC;EACD;IACE,0BAA0B;GAC3B;EACD;IACE,wCAAwC;GACzC;CACF;;AAED;EACE,0BAA0B;EAC1B,aAAa;CACd;;AAED;;EAEE,eAAe;CAChB;;AAED;EACE,aAAa;CACd;;AAED;EACE,gCAAgC;CACjC;;AAED;;EAEE,aAAa;CACd;;AAED;EACE,qDAA6C;UAA7C,6CAA6C;CAC9C;;AAED;EACE;IACE,0BAA0B;GAC3B;CACF;;AAED;;EAEE,gCAAgC;CACjC;;AAED;;;EAGE,aAAa;CACd;;AAED;EACE,aAAa;EACb,aAAa;CACd;;AAED;EACE,WAAW;CACZ;;AAED;EACE,WAAW;CACZ;;AAED;EACE,aAAa;CACd;;AAED;EACE,wCAAwC;CACzC;;AAED;EACE,wBAAwB;EACxB,oBAAoB;EACpB,eAAe;CAChB;;AAED;EACE,+EAA+E;CAChF;;AAED;EACE;IACE,+EAA+E;GAChF;CACF;;AAED;EACE;IACE,wBAAwB;GACzB;EACD;IACE,wCAAwC;GACzC;EACD;IACE,wBAAwB;GACzB;EACD;IACE,2CAA2C;GAC5C;CACF;;AAED;EACE,6BAA6B;EAC7B,eAAe;CAChB;;AAED;;EAEE,eAAe;CAChB;;AAED;EACE,eAAe;CAChB;;AAED;EACE,6BAA6B;CAC9B;;AAED;;EAEE,eAAe;CAChB;;AAED;EACE,kDAA0C;UAA1C,0CAA0C;CAC3C;;AAED;EACE;IACE,6BAA6B;GAC9B;CACF;;AAED;;EAEE,6BAA6B;CAC9B;;AAED;;;EAGE,eAAe;CAChB;;AAED;EACE,eAAe;EACf,aAAa;CACd;;AAED;EACE,WAAW;CACZ;;AAED;EACE,WAAW;CACZ;;AAED;EACE,eAAe;CAChB;;AAED;EACE,wCAAwC;CACzC;;AAED;EACE,0BAA0B;EAC1B,sBAAsB;EACtB,kBAAkB;CACnB;;AAED;EACE,kFAAkF;CACnF;;AAED;EACE;IACE,kFAAkF;GACnF;CACF;;AAED;EACE;IACE,0BAA0B;GAC3B;EACD;IACE,wCAAwC;GACzC;EACD;IACE,0BAA0B;GAC3B;EACD;IACE,wCAAwC;GACzC;CACF;;AAED;EACE,0BAA0B;EAC1B,kBAAkB;CACnB;;AAED;;EAEE,eAAe;CAChB;;AAED;EACE,kBAAkB;CACnB;;AAED;EACE,gCAAgC;CACjC;;AAED;;EAEE,kBAAkB;CACnB;;AAED;EACE,qDAA6C;UAA7C,6CAA6C;CAC9C;;AAED;EACE;IACE,0BAA0B;GAC3B;CACF;;AAED;;EAEE,gCAAgC;CACjC;;AAED;;;EAGE,kBAAkB;CACnB;;AAED;EACE,kBAAkB;EAClB,aAAa;CACd;;AAED;EACE,WAAW;CACZ;;AAED;EACE,WAAW;CACZ;;AAED;EACE,kBAAkB;CACnB;;AAED;EACE,wCAAwC;CACzC;;AAED;EACE,6BAA6B;EAC7B,yBAAyB;EACzB,eAAe;CAChB;;AAED;EACE,iFAAiF;CAClF;;AAED;EACE;IACE,iFAAiF;GAClF;CACF;;AAED;EACE;IACE,6BAA6B;GAC9B;EACD;IACE,wCAAwC;GACzC;EACD;IACE,6BAA6B;GAC9B;EACD;IACE,2CAA2C;GAC5C;CACF;;AAED;EACE,0BAA0B;EAC1B,YAAY;CACb;;AAED;;EAEE,eAAe;CAChB;;AAED;EACE,YAAY;CACb;;AAED;EACE,gCAAgC;CACjC;;AAED;;EAEE,YAAY;CACb;;AAED;EACE,qDAA6C;UAA7C,6CAA6C;CAC9C;;AAED;EACE;IACE,0BAA0B;GAC3B;CACF;;AAED;;EAEE,gCAAgC;CACjC;;AAED;;;EAGE,YAAY;CACb;;AAED;EACE,YAAY;EACZ,aAAa;CACd;;AAED;EACE,WAAW;CACZ;;AAED;EACE,WAAW;CACZ;;AAED;EACE,YAAY;CACb;;AAED;EACE,wCAAwC;CACzC;;AAED;EACE,uBAAuB;EACvB,mBAAmB;EACnB,eAAe;CAChB;;AAED;EACE,iFAAiF;CAClF;;AAED;EACE;IACE,iFAAiF;GAClF;CACF;;AAED;EACE;IACE,uBAAuB;GACxB;EACD;IACE,wCAAwC;GACzC;EACD;IACE,uBAAuB;GACxB;EACD;IACE,2CAA2C;GAC5C;CACF;;AAED;EACE,0BAA0B;EAC1B,YAAY;CACb;;AAED;;EAEE,eAAe;CAChB;;AAED;EACE,YAAY;CACb;;AAED;EACE,gCAAgC;CACjC;;AAED;;EAEE,YAAY;CACb;;AAED;EACE,qDAA6C;UAA7C,6CAA6C;CAC9C;;AAED;EACE;IACE,0BAA0B;GAC3B;CACF;;AAED;;EAEE,gCAAgC;CACjC;;AAED;;;EAGE,YAAY;CACb;;AAED;EACE,YAAY;EACZ,aAAa;CACd;;AAED;EACE,WAAW;CACZ;;AAED;EACE,WAAW;CACZ;;AAED;EACE,YAAY;CACb;;AAED;EACE,wCAAwC;CACzC;;AAED;EACE,uBAAuB;EACvB,mBAAmB;EACnB,eAAe;CAChB;;AAED;EACE,iFAAiF;CAClF;;AAED;EACE;IACE,iFAAiF;GAClF;CACF;;AAED;EACE;IACE,uBAAuB;GACxB;EACD;IACE,wCAAwC;GACzC;EACD;IACE,uBAAuB;GACxB;EACD;IACE,2CAA2C;GAC5C;CACF;;AAED;EACE,0BAA0B;EAC1B,YAAY;CACb;;AAED;;EAEE,eAAe;CAChB;;AAED;EACE,YAAY;CACb;;AAED;EACE,gCAAgC;CACjC;;AAED;;EAEE,YAAY;CACb;;AAED;EACE,qDAA6C;UAA7C,6CAA6C;CAC9C;;AAED;EACE;IACE,0BAA0B;GAC3B;CACF;;AAED;;EAEE,gCAAgC;CACjC;;AAED;;;EAGE,YAAY;CACb;;AAED;EACE,YAAY;EACZ,aAAa;CACd;;AAED;EACE,WAAW;CACZ;;AAED;EACE,WAAW;CACZ;;AAED;EACE,YAAY;CACb;;AAED;EACE,wCAAwC;CACzC;;AAED;EACE,uBAAuB;EACvB,mBAAmB;EACnB,eAAe;CAChB;;AAED;EACE,iFAAiF;CAClF;;AAED;EACE;IACE,iFAAiF;GAClF;CACF;;AAED;EACE;IACE,uBAAuB;GACxB;EACD;IACE,wCAAwC;GACzC;EACD;IACE,uBAAuB;GACxB;EACD;IACE,2CAA2C;GAC5C;CACF;;AAED;EACE,0BAA0B;EAC1B,0BAA0B;CAC3B;;AAED;;EAEE,eAAe;CAChB;;AAED;EACE,0BAA0B;CAC3B;;AAED;EACE,0BAA0B;CAC3B;;AAED;;EAEE,0BAA0B;CAC3B;;AAED;EACE,+CAAuC;UAAvC,uCAAuC;CACxC;;AAED;EACE;IACE,0BAA0B;GAC3B;CACF;;AAED;;EAEE,0BAA0B;CAC3B;;AAED;;;EAGE,0BAA0B;CAC3B;;AAED;EACE,0BAA0B;EAC1B,aAAa;CACd;;AAED;EACE,WAAW;CACZ;;AAED;EACE,WAAW;CACZ;;AAED;EACE,0BAA0B;CAC3B;;AAED;EACE,wCAAwC;CACzC;;AAED;EACE,qCAAqC;EACrC,iCAAiC;EACjC,eAAe;CAChB;;AAED;EACE,iFAAiF;CAClF;;AAED;EACE;IACE,iFAAiF;GAClF;CACF;;AAED;EACE;IACE,qCAAqC;GACtC;EACD;IACE,wCAAwC;GACzC;EACD;IACE,qCAAqC;GACtC;EACD;IACE,qCAAqC;GACtC;CACF;;AAED;EACE,0BAA0B;EAC1B,YAAY;CACb;;AAED;;EAEE,eAAe;CAChB;;AAED;EACE,YAAY;CACb;;AAED;EACE,gCAAgC;CACjC;;AAED;;EAEE,YAAY;CACb;;AAED;EACE,qDAA6C;UAA7C,6CAA6C;CAC9C;;AAED;EACE;IACE,0BAA0B;GAC3B;CACF;;AAED;;EAEE,gCAAgC;CACjC;;AAED;;;EAGE,YAAY;CACb;;AAED;EACE,YAAY;EACZ,aAAa;CACd;;AAED;EACE,WAAW;CACZ;;AAED;EACE,WAAW;CACZ;;AAED;EACE,YAAY;CACb;;AAED;EACE,wCAAwC;CACzC;;AAED;EACE,uBAAuB;EACvB,mBAAmB;EACnB,eAAe;CAChB;;AAED;EACE,iFAAiF;CAClF;;AAED;EACE;IACE,iFAAiF;GAClF;CACF;;AAED;EACE;IACE,uBAAuB;GACxB;EACD;IACE,wCAAwC;GACzC;EACD;IACE,uBAAuB;GACxB;EACD;IACE,2CAA2C;GAC5C;CACF;;AAED;EACE;IACE,qBAAqB;IACrB,kBAAkB;GACnB;CACF;;AAED;EACE;IACE,sBAAsB;IACtB,mBAAmB;GACpB;CACF;;AAED;EACE,0BAAoB;MAApB,uBAAoB;UAApB,oBAAoB;EACpB,qBAAc;EAAd,qBAAc;EAAd,cAAc;CACf;;AAED;EACE,oBAAa;MAAb,qBAAa;UAAb,aAAa;EACb,qBAAe;MAAf,eAAe;CAChB;;AAED;EACE,iBAAiB;CAClB;;AAED;EACE,kBAAkB;CACnB;;AAED;EACE,UAAU;EACV,QAAQ;EACR,mBAAmB;EACnB,SAAS;EACT,OAAO;EACP,iBAAiB;CAClB;;AAED;EACE,UAAU;EACV,iBAAiB;EACjB,gBAAgB;EAChB,mBAAmB;EACnB,SAAS;EACT,8CAAsC;UAAtC,sCAAsC;CACvC;;AAED;EACE,aAAa;CACd;;AAED;EACE;IACE,cAAc;GACf;CACF;;AAED;EACE,mBAAmB;CACpB;;AAED;EACE;IACE,qBAAc;IAAd,qBAAc;IAAd,cAAc;GACf;EACD;IACE,uBAAuB;GACxB;CACF;;AAED;EACE;IACE,qBAAc;IAAd,qBAAc;IAAd,cAAc;IACd,yBAAwB;QAAxB,sBAAwB;YAAxB,wBAAwB;GACzB;EACD;IACE,qBAAqB;GACtB;CACF;;AAED;;EAEE,oBAAa;MAAb,qBAAa;UAAb,aAAa;EACb,qBAAe;MAAf,eAAe;CAChB;;AAED;EACE,oBAAa;MAAb,qBAAa;UAAb,aAAa;EACb,qBAAe;MAAf,eAAe;EACf,qBAAqB;CACtB;;AAED;EACE,qBAAqB;CACtB;;AAED;EACE;IACE,qBAAqB;GACtB;EACD;IACE,sBAAsB;GACvB;CACF;;AAED;EACE,6BAA6B;EAC7B,0BAA0B;CAC3B;;AAED;EACE,0BAA0B;EAC1B,eAAe;CAChB;;AAED;EACE,eAAe;CAChB;;AAED;;EAEE,eAAe;CAChB;;AAED;EACE,eAAe;CAChB;;AAED;;EAEE,eAAe;CAChB;;AAED;EACE,eAAe;CAChB;;AAED;EACE,eAAe;CAChB;;AAED;EACE,eAAe;CAChB;;AAED;EACE,eAAe;CAChB;;AAED;EACE,eAAe;CAChB;;AAED;EACE,eAAe;CAChB;;AAED;EACE,eAAe;CAChB;;AAED;EACE,eAAe;CAChB;;AAED;EACE,eAAe;EACf,mBAAmB;CACpB;;AAED;EACE,eAAe;CAChB;;AAED;EACE,eAAe;CAChB;;AAED;EACE,eAAe;CAChB;;AAED;;EAEE,eAAe;CAChB;;AAED;EACE,eAAe;EACf,kBAAkB;CACnB;;AAED;EACE,eAAe;CAChB;;AAED;EACE,eAAe;CAChB;;AAED;EACE,eAAe;CAChB;;AAED;EACE,eAAe;CAChB;;AAED;;EAEE,eAAe;CAChB;;AAED;EACE,eAAe;CAChB;;AAED;EACE,eAAe;CAChB;;AAED;EACE,eAAe;CAChB;;AAED;;EAEE,eAAe;CAChB;;AAED;EACE,eAAe;CAChB;;AAED;EACE,eAAe;CAChB;;AAED;EACE,eAAe;CAChB;;AAED;EACE,eAAe;CAChB;;AAED;EACE,eAAe;CAChB;;AAED;;EAEE,eAAe;CAChB;;AAED;EACE,eAAe;CAChB;;AAED;;;;EAIE,eAAe;CAChB;;AAED;;EAEE,eAAe;CAChB;;AAED;EACE,eAAe;CAChB;;AAED;EACE,eAAe;CAChB;;AAED;;;;EAIE,eAAe;CAChB;;AAED;EACE,eAAe;CAChB;;AAED;EACE,eAAe;CAChB;;AAED;EACE,eAAe;CAChB;;AAED;EACE,eAAe;CAChB;;AAED;EACE,eAAe;CAChB;;AAED;EACE,eAAe;CAChB;;AAED;;EAEE,eAAe;CAChB;;AAED;EACE,eAAe;CAChB;;AAED;;EAEE,eAAe;CAChB;;AAED;;;;EAIE,eAAe;CAChB;;AAED;EACE,eAAe;CAChB;;AAED;EACE,iBAAiB;CAClB;;AAED;EACE;IACE,eAAe;IACf,QAAQ;IACR,iBAAiB;IACjB,mBAAmB;IACnB,UAAU;IACV,YAAY;GACb;CACF;;AAED;EACE,gBAAgB;EAChB,iBAAiB;EACjB,mBAAmB;CACpB;;AAED;EACE;IACE,qBAAqB;GACtB;CACF;;AAED;EACE,iBAAiB;EACjB,gBAAgB;CACjB;;AAED;EACE,kBAAkB;EAClB,mBAAmB;EACnB,iBAAiB;EACjB,kBAAkB;EAClB,WAAW;EACX,mBAAmB;CACpB;;AAED;EACE,uEAA+D;UAA/D,+DAA+D;CAChE;;AAED;EACE;IACE,aAAa;GACd;CACF;;AAED;EACE,gBAAgB;EAChB,iBAAiB;CAClB;;AAED;;EAEE,eAAe;CAChB;;AAED;EACE,mBAAmB;CACpB;;AAED;EACE,uBAAuB;EACvB,YAAY;EACZ,cAAc;EACd,yBAAyB;EACzB,aAAa;CACd;;AAED;EACE,eAAe;EACf,cAAc;EACd,aAAa;CACd;;AAED;EACE,eAAe;EACf,eAAe;EACf,kBAAkB;EAClB,8BAA8B;CAC/B;;AAED;EACE,UAAU;EACV,eAAe;EACf,mBAAmB;EACnB,YAAY;EACZ,kBAAkB;EAClB,uBAAuB;EACvB,mBAAmB;EACnB,SAAS;CACV;;AAED;EACE;IACE,oGAA4F;YAA5F,4FAA4F;IAC5F,+BAAuB;YAAvB,uBAAuB;GACxB;EACD;IACE,iHAAyG;YAAzG,yGAAyG;IACzG,4BAAoB;YAApB,oBAAoB;GACrB;EACD;IACE,0HAAkH;YAAlH,kHAAkH;IAClH,4BAAoB;YAApB,oBAAoB;GACrB;CACF;;AAbD;EACE;IACE,oGAA4F;YAA5F,4FAA4F;IAC5F,+BAAuB;YAAvB,uBAAuB;GACxB;EACD;IACE,iHAAyG;YAAzG,yGAAyG;IACzG,4BA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EAAd,cAAc;EACd,oBAAgB;MAAhB,gBAAgB;CACjB;;AAED;EACE,qBAAc;EAAd,qBAAc;EAAd,cAAc;EACd,aAAa;EACb,qBAAqB;CACtB;;AAED;EACE,aAAa;CACd;;AAED;EACE,eAAe;CAChB;;AAED;EACE,oBAAoB;CACrB;;AAED;EACE,eAAe;CAChB;;AAED;EACE,2BAA2B;CAC5B;;AAED;EACE,aAAa;CACd;;AAED;EACE,mBAAmB;EACnB,uFAA+E;UAA/E,+EAA+E;EAC/E,sBAAsB;EACtB,YAAY;EACZ,aAAa;EACb,kBAAkB;EAClB,YAAY;CACb;;AAED;EACE,0BAA0B;EAC1B,0BAA0B;EAC1B,YAAY;CACb;;AAED;EACE,0BAA0B;CAC3B;;AAED;EACE,0BAA0B;CAC3B;;AAED;EACE,eAAe;CAChB;;AAED;EACE,2BAA2B;CAC5B;;AAED;EACE,eAAe;CAChB;;AAED;EACE,qCAAqC;EACrC,eAAe;CAChB;;AAED;EACE,6BAA6B;CAC9B;;AAED;EACE,oBAAoB;EACpB,mBAAmB;CACpB;;AAED;EACE;IACE,mBAAmB;GACpB;CACF;;AAED;EACE,mBAAmB;EACnB,yBAAyB;CAC1B;;AAED;EACE;IACE,QAAQ;IACR,YAAY;GACb;CACF;;AAED;EACE,0BAA0B;EAC1B,eAAe;EACf,cAAc;EACd,kBAAkB;EAClB,mBAAmB;EACnB,mBAAmB;EACnB,mBAAmB;CACpB;;AAED;EACE,wBAAwB;CACzB;;AAED;EACE,0BAA0B;CAC3B;;AAED;EACE,6BAA6B;CAC9B;;AAED;EACE,0BAA0B;CAC3B;;AAED;EACE,0BAA0B;CAC3B;;AAED;EACE,0BAA0B;CAC3B;;AAED;EACE,0BAA0B;CAC3B;;AAED;EACE,0BAA0B;CAC3B;;AAED;EACE,0BAA0B;CAC3B;;AAED;EACE,0BAA0B;CAC3B;;AAED;EACE,0BAA0B;CAC3B;;AAED;EACE,cAAc;CACf;;AAED;EACE,8BAAsB;UAAtB,sBAAsB;CACvB;;AAED;EACE,8BAAsB;UAAtB,sBAAsB;CACvB;;AAED;EACE,8BAAsB;UAAtB,sBA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AAkB;EAClB,iBAAiB;EACjB,mBAAmB;CACpB;;AAED;EACE,6BAA6B;EAC7B,mBAAmB;EACnB,uCAAuC;EACvC,mBAAmB;CACpB;;AAED;EACE,sBAAsB;CACvB;;AAED;EACE,wBAAwB;EACxB,eAAe;CAChB;;AAED;EACE,0BAA0B;EAC1B,aAAa;CACd;;AAED;EACE,6BAA6B;EAC7B,eAAe;CAChB;;AAED;EACE,0BAA0B;EAC1B,kBAAkB;CACnB;;AAED;EACE,0BAA0B;EAC1B,YAAY;CACb;;AAED;EACE,0BAA0B;EAC1B,YAAY;CACb;;AAED;EACE,0BAA0B;EAC1B,YAAY;CACb;;AAED;EACE,0BAA0B;EAC1B,0BAA0B;CAC3B;;AAED;EACE,0BAA0B;EAC1B,YAAY;CACb;;AAED;EACE,cAAc;CACf;;AAED;EACE,gBAAgB;CACjB;;AAED;EACE,qCAAqC;EACrC,mBAAmB;EACnB,aAAa;EACb,sBAAsB;EACtB,gBAAgB;EAChB,kBAAkB;EAClB,eAAe;EACf,0BAA0B;EAC1B,oBAAoB;CACrB;;AAED;EACE,wBAAwB;EACxB,mBAAmB;EACnB,qFAA6E;UAA7E,6EAA6E;EAC7E,eAAe;EACf,eAAe;EACf,mBAAmB;EACnB,iBAAiB;EACjB,iBAAiB;EACjB,cAAc;EACd,mBAAmB;EACnB,mBAAmB;CACpB;;AAED;EACE,uEAA+D;UAA/D,+DAA+D;CAChE;;AAED;EACE,6EAAqE;UAArE,qEAAqE;CACtE;;AAED;EACE,eAAe;CAChB;;AAED;EACE,eAAe;EACf,WAAW;EACX,aAAa;EACb,mBAAmB;EACnB,UAAU;EACV,YAAY;CACb;;AAED;EACE,eAAe;EACf,aAAa;EACb,YAAY;CACb;;AAED;EACE,eAAe;EACf,gBAAgB;EAChB,iBAAiB;CAClB;;AAED;EACE,eAAe;CAChB;;AAED;EACE,gBAAgB;CACjB;;AAED;EACE;IACE,kBAAkB;GACnB;EACD;IACE,qBAAc;IAAd,qBAAc;IAAd,cAAc;IACd,yBAAwB;QAAxB,sBAAwB;YAAxB,wBAAwB;IACxB,mBAAmB;GACpB;EACD;IACE,WAAW;IACX,kBAAkB;IAClB,mBAAmB;IACnB,OAAO;GACR;EACD;IACE,UAAU;IACV,wBAAwB;GACzB;EACD;IACE,kBAAkB;GACnB;CACF;;AAED;EACE,mBAAmB;CACpB;;AAED;EACE,eAAe;EACf,mBAAmB;CACpB;;AAED;EACE,eAAe;CAChB;;AAED;EACE,YAAY;EACZ,aAAa;EACb,mBAAmB;EACnB,UAAU;CACX;;AAED;EACE,gBAAgB;CACjB;;AAED;EACE,aAAa;CACd;;AAED;EACE,aAAa;CACd;;AAED;;EAEE,aAAa;CACd;;AAED;EACE,yBAAyB;CAC1B;;AAED;EACE;IACE,gBAAgB;GACjB;EACD;IACE,cAAc;GACf;CACF;;AAED;EACE,qBAAc;EAAd,qBAAc;EAAd,cAAc;EACd,oBAAgB;MAAhB,gBAAgB;EAChB,eAAe;EACf,cAAc;CACf;;AAED;EACE,eAAe;EACf,qBAAe;MAAf,eAAe;EACf,gEAAgE;EAChE,gBAAgB;EAChB,iBAAiB;EACjB,cAAc;EACd,aAAa;CACd;;AAED;EACE,oBAAoB;CACrB;;AAED;EACE,eAAe;EACf,gBAAgB;EAChB,qBAAqB;CACtB;;AAED;EACE,eAAe;CAChB;;AAED;EACE,wBAAwB;EACxB,0BAA0B;EAC1B,mBAAmB;EACnB,eAAe;EACf,gBAAgB;EAChB,0BAA0B;CAC3B;;AAED;EACE,oBAAoB;CACrB;;AAED;EACE,2BAA2B;CAC5B;;AAED;EACE,eAAe;EACf,gBAAgB;EAChB,qBAAqB;CACtB;;AAED;EACE,eAAe;CAChB;;AAED;EACE,aAAa;EACb,iBAAiB;EACjB,qBAAqB;EACrB,sBAAsB;CACvB;;AAED;EACE,6BAA6B;EAC7B,wBAAwB;EACxB,gBAAgB;CACjB;;AAED;EACE,eAAe;EACf,mBAAmB;EACnB,mBAAmB;CACpB;;AAED;EACE,iBAAiB;CAClB;;AAED;EACE,0BAAoB;MAApB,uBAAoB;UAApB,oBAAoB;EACpB,qBAAc;EAAd,qBAAc;EAAd,cAAc;EACd,yBAAwB;MAAxB,sBAAwB;UAAxB,wBAAwB;EACxB,sBAAsB;EACtB,mBAAmB;CACpB;;AAED;EACE,cAAc;CACf;;AAED;EACE,0BAA0B;EAC1B,WAAW;EACX,2CAAmC;EAAnC,mCAAmC;CACpC;;AAED;EACE;IACE,sBAAsB;GACvB;CACF;;AAED;EACE;IACE,qBAAqB;IACrB,kBAAkB;GACnB;EACD;IACE,qBAAc;IAAd,qBAAc;IAAd,cAAc;IACd,oBAAgB;QAAhB,gBAAgB;IAChB,0BAA+B;QAA/B,uBAA+B;YAA/B,+BAA+B;GAChC;EACD;IACE,iBAAiB;IACjB,wBAAwB;GACzB;EACD;IACE,cAAc;GACf;EACD;IACE,YAAY;GACb;EACD;IACE,oBAAoB;GACrB;CACF;;AAED;EACE,6BAA6B;CAC9B;;AAED;EACE,yBAAwB;MAAxB,sBAAwB;UAAxB,wBAAwB;EACxB,qBAAc;EAAd,qBAAc;EAAd,cAAc;EACd,yBAAwB;MAAxB,sBAAwB;UAAxB,wBAAwB;CACzB;;AAED;EACE,0BAAoB;MAApB,uBAAoB;UAApB,oBAAoB;EACpB,qBAAc;EAAd,qBAAc;EAAd,cAAc;EACd,yBAAwB;MAAxB,sBAAwB;UAAxB,wBAAwB;EACxB,mBAAmB;EACnB,mBAAmB;CACpB;;AAED;EACE,aAAa;EACb,sBAAsB;CACvB;;AAED;EACE,wCAAgC;UAAhC,gCAAgC;EAChC,oDAAoC;EAApC,4CAAoC;EAApC,oCAAoC;EAApC,qEAAoC;CACrC;;AAED;EACE,+BAAuB;UAAvB,uBAAuB;CACxB;;AAED;EACE;IACE,gBAAgB;GACjB;EACD;IACE,sBAAsB;GACvB;CACF;;AAED;EACE;IACE,cAAc;GACf;EACD;IACE,mBAAmB;GACpB;CACF;;AAED;EACE;IACE,kBAAkB;GACnB;CACF;;AAED;EACE;IACE,kBAAkB;GACnB;CACF;;AAED;EACE;IACE,kBAAkB;GACnB;CACF;;AAED;EACE,4CAAoC;UAApC,oCAAoC;EACpC,8EAA8E;EAC9E,2BAA2B;CAC5B;;AAED;;EAEE,aAAa;CACd;;AAED;EACE;IACE,4BAA4B;GAC7B;EACD;IACE,8BAA8B;GAC/B;EACD;IACE,4BAA4B;GAC7B;CACF;;AAVD;EACE;IACE,4BAA4B;GAC7B;EACD;IACE,8BAA8B;GAC/B;EACD;IACE,4BAA4B;GAC7B;CACF;;AAED;EACE,yBAAwB;MAAxB,sBAAwB;UAAxB,wBAAwB;EACxB,qBAAc;EAAd,qBAAc;EAAd,cAAc;EACd,yBAAwB;MAAxB,sBAAwB;UAAxB,wBAAwB;CACzB;;AAED;EACE,6BAA6B;EAC7B,mBAAmB;EACnB,gBAAgB;CACjB;;AAED;EACE;IACE,gBAAgB;GACjB;EACD;IACE,eAAe;GAChB;EACD;IACE,mBAAmB;GACpB;EACD;IACE,mBAAmB;GACpB;EACD;IACE,sBAAsB;GACvB;EACD;IACE,oBAAoB;GACrB;CACF;;AAED;EACE;IACE,qBAAqB;IACrB,kBAAkB;GACnB;EACD;IACE,0BAAoB;QAApB,uBAAoB;YAApB,oBAAoB;IACpB,qBAAc;IAAd,qBAAc;IAAd,cAAc;IACd,yBAAwB;QAAxB,sBAAwB;YAAxB,wBAAwB;GACzB;EACD;IACE,iBAAiB;GAClB;EACD;IACE,oBAAoB;GACrB;EACD;IACE,oBAAoB;GACrB;EACD;IACE,qBAAc;IAAd,qBAAc;IAAd,cAAc;IACd,oBAAgB;QAAhB,gBAAgB;IAChB,qBAAqB;GACtB;EACD;IACE,mBAAmB;IACnB,6BAA6B;GAC9B;EACD;IACE,cAAc;GACf;EACD;IACE,oBAAoB;GACrB;CACF;;AAED;EACE,0BAA0B;EAC1B,YAAY;CACb;;AAED;;EAEE,oBAAoB;CACrB;;AAED;EACE,gCAAgC;CACjC;;AAED;EACE,sCAAsC;EACtC,oBAAoB;CACrB;;AAED;EACE,YAAY;CACb;;AAED;EACE,gBAAgB;EAChB,mBAAmB;CACpB;;AAED;EACE,oBAAoB;EACpB,mBAAmB;CACpB;;AAED;EACE,aAAa;EACb,YAAY;CACb;;AAED;EACE,eAAe;EACf,iBAAiB;CAClB;;AAED;EACE,mBAAmB;EACnB,UAAU;CACX;;AAED;EACE,sBAAsB;CACvB;;AAED;EACE,iBAAiB;EACjB,kBAAkB;CACnB;;AAED;EACE,sBAAsB;CACvB;;AAED;EACE,eAAe;CAChB;;AAED;EACE,eAAe;CAChB;;AAED;EACE,eAAe;EACf,iBAAiB;CAClB;;AAED;EACE,eAAe;EACf,iBAAiB;CAClB;;AAED;EACE,eAAe;CAChB;;AAED;;EAEE,kBAAkB;EAClB,mBAAmB;CACpB;;AAED;;EAEE,eAAe;EACf,mBAAmB;EACnB,mBAAmB;EACnB,aAAa;EACb,YAAY;CACb;;AAED;EACE,mBAAmB;EACnB,mBAAmB;CACpB;;AAED;EACE,uBAAuB;EACvB,WAAW;CACZ;;AAED;EACE,oBAAoB;CACrB;;AAED;EACE,2BAA2B;CAC5B;;AAED;EACE,6BAA6B;EAC7B,eAAe;CAChB;;AAED;EACE,0CAA0C;EAC1C,eAAe;EACf,iBAAiB;CAClB;;AAED;EACE,oBAAoB;CACrB;;AAED;EACE,mBAAmB;EACnB,eAAe;CAChB;;AAED;EACE,oBAAoB;EACpB,YAAY;CACb;;AAED;EACE,oBAAoB;EACpB,YAAY;CACb","file":"bulma-docs.css","sourcesContent":["@charset \"UTF-8\";\n/*! bulma.io v0.5.1 | MIT License | github.com/jgthms/bulma */\n@keyframes spinAround {\n from {\n transform: rotate(0deg);\n }\n to {\n transform: rotate(359deg);\n }\n}\n\n/*! minireset.css v0.0.2 | MIT License | github.com/jgthms/minireset.css */\nhtml,\nbody,\np,\nol,\nul,\nli,\ndl,\ndt,\ndd,\nblockquote,\nfigure,\nfieldset,\nlegend,\ntextarea,\npre,\niframe,\nhr,\nh1,\nh2,\nh3,\nh4,\nh5,\nh6 {\n margin: 0;\n padding: 0;\n}\n\nh1,\nh2,\nh3,\nh4,\nh5,\nh6 {\n font-size: 100%;\n font-weight: normal;\n}\n\nul {\n list-style: none;\n}\n\nbutton,\ninput,\nselect,\ntextarea {\n margin: 0;\n}\n\nhtml {\n box-sizing: border-box;\n}\n\n* {\n box-sizing: inherit;\n}\n\n*:before, *:after {\n box-sizing: inherit;\n}\n\nimg,\nembed,\nobject,\naudio,\nvideo {\n max-width: 100%;\n}\n\niframe {\n border: 0;\n}\n\ntable {\n border-collapse: collapse;\n border-spacing: 0;\n}\n\ntd,\nth {\n padding: 0;\n text-align: left;\n}\n\nhtml {\n background-color: #fff;\n font-size: 16px;\n -moz-osx-font-smoothing: grayscale;\n -webkit-font-smoothing: antialiased;\n min-width: 300px;\n overflow-x: hidden;\n overflow-y: scroll;\n text-rendering: optimizeLegibility;\n}\n\narticle,\naside,\nfigure,\nfooter,\nheader,\nhgroup,\nsection {\n display: block;\n}\n\nbody,\nbutton,\ninput,\nselect,\ntextarea {\n font-family: BlinkMacSystemFont, -apple-system, \"Segoe UI\", \"Roboto\", \"Oxygen\", \"Ubuntu\", \"Cantarell\", \"Fira Sans\", \"Droid Sans\", \"Helvetica Neue\", \"Helvetica\", \"Arial\", sans-serif;\n}\n\ncode,\npre {\n -moz-osx-font-smoothing: auto;\n -webkit-font-smoothing: auto;\n font-family: monospace;\n}\n\nbody {\n color: #4a4a4a;\n font-size: 1rem;\n font-weight: 400;\n line-height: 1.5;\n}\n\na {\n color: #00d1b2;\n cursor: pointer;\n text-decoration: none;\n}\n\na strong {\n color: currentColor;\n}\n\na:hover {\n color: #363636;\n}\n\ncode {\n background-color: whitesmoke;\n color: #ff3860;\n font-size: 0.875em;\n font-weight: normal;\n padding: 0.25em 0.5em 0.25em;\n}\n\nhr {\n background-color: #dbdbdb;\n border: none;\n display: block;\n height: 1px;\n margin: 1.5rem 0;\n}\n\nimg {\n height: auto;\n max-width: 100%;\n}\n\ninput[type=\"checkbox\"],\ninput[type=\"radio\"] {\n vertical-align: baseline;\n}\n\nsmall {\n font-size: 0.875em;\n}\n\nspan {\n font-style: inherit;\n font-weight: inherit;\n}\n\nstrong {\n color: #363636;\n font-weight: 700;\n}\n\npre {\n background-color: whitesmoke;\n color: #4a4a4a;\n font-size: 0.875em;\n white-space: pre;\n word-wrap: normal;\n}\n\npre code {\n -webkit-overflow-scrolling: touch;\n background: none;\n color: inherit;\n display: block;\n font-size: 1em;\n overflow-x: auto;\n padding: 1.25rem 1.5rem;\n}\n\ntable td,\ntable th {\n text-align: left;\n vertical-align: top;\n}\n\ntable th {\n color: #363636;\n}\n\n.is-clearfix:after {\n clear: both;\n content: \" \";\n display: table;\n}\n\n.is-pulled-left {\n float: left !important;\n}\n\n.is-pulled-right {\n float: right !important;\n}\n\n.is-clipped {\n overflow: hidden !important;\n}\n\n.is-overlay {\n bottom: 0;\n left: 0;\n position: absolute;\n right: 0;\n top: 0;\n}\n\n.is-size-1 {\n font-size: 3rem !important;\n}\n\n@media screen and (max-width: 768px) {\n .is-size-1-mobile {\n font-size: 3rem !important;\n }\n}\n\n@media screen and (min-width: 769px), print {\n .is-size-1-tablet {\n font-size: 3rem !important;\n }\n}\n\n@media screen and (max-width: 1007px) {\n .is-size-1-touch {\n font-size: 3rem !important;\n }\n}\n\n@media screen and (min-width: 1008px) {\n .is-size-1-desktop {\n font-size: 3rem !important;\n }\n}\n\n@media screen and (min-width: 1200px) {\n .is-size-1-widescreen {\n font-size: 3rem !important;\n }\n}\n\n@media screen and (min-width: 1392px) {\n .is-size-1-fullhd {\n font-size: 3rem !important;\n }\n}\n\n.is-size-2 {\n font-size: 2.5rem !important;\n}\n\n@media screen and (max-width: 768px) {\n .is-size-2-mobile {\n font-size: 2.5rem !important;\n }\n}\n\n@media screen and (min-width: 769px), print {\n .is-size-2-tablet {\n font-size: 2.5rem !important;\n }\n}\n\n@media screen and (max-width: 1007px) {\n .is-size-2-touch {\n font-size: 2.5rem !important;\n }\n}\n\n@media screen and (min-width: 1008px) {\n .is-size-2-desktop {\n font-size: 2.5rem !important;\n }\n}\n\n@media screen and (min-width: 1200px) {\n .is-size-2-widescreen {\n font-size: 2.5rem !important;\n }\n}\n\n@media screen and (min-width: 1392px) {\n .is-size-2-fullhd {\n font-size: 2.5rem !important;\n }\n}\n\n.is-size-3 {\n font-size: 2rem !important;\n}\n\n@media screen and (max-width: 768px) {\n .is-size-3-mobile {\n font-size: 2rem !important;\n }\n}\n\n@media screen and (min-width: 769px), print {\n .is-size-3-tablet {\n font-size: 2rem !important;\n }\n}\n\n@media screen and (max-width: 1007px) {\n .is-size-3-touch {\n font-size: 2rem !important;\n }\n}\n\n@media screen and (min-width: 1008px) {\n .is-size-3-desktop {\n font-size: 2rem !important;\n }\n}\n\n@media screen and (min-width: 1200px) {\n .is-size-3-widescreen {\n font-size: 2rem !important;\n }\n}\n\n@media screen and (min-width: 1392px) {\n .is-size-3-fullhd {\n font-size: 2rem !important;\n }\n}\n\n.is-size-4 {\n font-size: 1.5rem !important;\n}\n\n@media screen and (max-width: 768px) {\n .is-size-4-mobile {\n font-size: 1.5rem !important;\n }\n}\n\n@media screen and (min-width: 769px), print {\n .is-size-4-tablet {\n font-size: 1.5rem !important;\n }\n}\n\n@media screen and (max-width: 1007px) {\n .is-size-4-touch {\n font-size: 1.5rem !important;\n }\n}\n\n@media screen and (min-width: 1008px) {\n .is-size-4-desktop {\n font-size: 1.5rem !important;\n }\n}\n\n@media screen and (min-width: 1200px) {\n .is-size-4-widescreen {\n font-size: 1.5rem !important;\n }\n}\n\n@media screen and (min-width: 1392px) {\n .is-size-4-fullhd {\n font-size: 1.5rem !important;\n }\n}\n\n.is-size-5 {\n font-size: 1.25rem !important;\n}\n\n@media screen and (max-width: 768px) {\n .is-size-5-mobile {\n font-size: 1.25rem !important;\n }\n}\n\n@media screen and (min-width: 769px), print {\n .is-size-5-tablet {\n font-size: 1.25rem !important;\n }\n}\n\n@media screen and (max-width: 1007px) {\n .is-size-5-touch {\n font-size: 1.25rem !important;\n }\n}\n\n@media screen and (min-width: 1008px) {\n .is-size-5-desktop {\n font-size: 1.25rem !important;\n }\n}\n\n@media screen and (min-width: 1200px) {\n .is-size-5-widescreen {\n font-size: 1.25rem !important;\n }\n}\n\n@media screen and (min-width: 1392px) {\n .is-size-5-fullhd {\n font-size: 1.25rem !important;\n }\n}\n\n.is-size-6 {\n font-size: 1rem !important;\n}\n\n@media screen and (max-width: 768px) {\n .is-size-6-mobile {\n font-size: 1rem !important;\n }\n}\n\n@media screen and (min-width: 769px), print {\n .is-size-6-tablet {\n font-size: 1rem !important;\n }\n}\n\n@media screen and (max-width: 1007px) {\n .is-size-6-touch {\n font-size: 1rem !important;\n }\n}\n\n@media screen and (min-width: 1008px) {\n .is-size-6-desktop {\n font-size: 1rem !important;\n }\n}\n\n@media screen and (min-width: 1200px) {\n .is-size-6-widescreen {\n font-size: 1rem !important;\n }\n}\n\n@media screen and (min-width: 1392px) {\n .is-size-6-fullhd {\n font-size: 1rem !important;\n }\n}\n\n.is-size-7 {\n font-size: 0.75rem !important;\n}\n\n@media screen and (max-width: 768px) {\n .is-size-7-mobile {\n font-size: 0.75rem !important;\n }\n}\n\n@media screen and (min-width: 769px), print {\n .is-size-7-tablet {\n font-size: 0.75rem !important;\n }\n}\n\n@media screen and (max-width: 1007px) {\n .is-size-7-touch {\n font-size: 0.75rem !important;\n }\n}\n\n@media screen and (min-width: 1008px) {\n .is-size-7-desktop {\n font-size: 0.75rem !important;\n }\n}\n\n@media screen and (min-width: 1200px) {\n .is-size-7-widescreen {\n font-size: 0.75rem !important;\n }\n}\n\n@media screen and (min-width: 1392px) {\n .is-size-7-fullhd {\n font-size: 0.75rem !important;\n }\n}\n\n.has-text-centered {\n text-align: center !important;\n}\n\n@media screen and (max-width: 768px) {\n .has-text-centered-mobile {\n text-align: center !important;\n }\n}\n\n@media screen and (min-width: 769px), print {\n .has-text-centered-tablet {\n text-align: center !important;\n }\n}\n\n@media screen and (min-width: 769px) and (max-width: 1007px) {\n .has-text-centered-tablet-only {\n text-align: center !important;\n }\n}\n\n@media screen and (max-width: 1007px) {\n .has-text-centered-touch {\n text-align: center !important;\n }\n}\n\n@media screen and (min-width: 1008px) {\n .has-text-centered-desktop {\n text-align: center !important;\n }\n}\n\n@media screen and (min-width: 1008px) and (max-width: 1199px) {\n .has-text-centered-desktop-only {\n text-align: center !important;\n }\n}\n\n@media screen and (min-width: 1200px) {\n .has-text-centered-widescreen {\n text-align: center !important;\n }\n}\n\n@media screen and (min-width: 1200px) and (max-width: 1391px) {\n .has-text-centered-widescreen-only {\n text-align: center !important;\n }\n}\n\n@media screen and (min-width: 1392px) {\n .has-text-centered-fullhd {\n text-align: center !important;\n }\n}\n\n.has-text-left {\n text-align: left !important;\n}\n\n@media screen and (max-width: 768px) {\n .has-text-left-mobile {\n text-align: left !important;\n }\n}\n\n@media screen and (min-width: 769px), print {\n .has-text-left-tablet {\n text-align: left !important;\n }\n}\n\n@media screen and (min-width: 769px) and (max-width: 1007px) {\n .has-text-left-tablet-only {\n text-align: left !important;\n }\n}\n\n@media screen and (max-width: 1007px) {\n .has-text-left-touch {\n text-align: left !important;\n }\n}\n\n@media screen and (min-width: 1008px) {\n .has-text-left-desktop {\n text-align: left !important;\n }\n}\n\n@media screen and (min-width: 1008px) and (max-width: 1199px) {\n .has-text-left-desktop-only {\n text-align: left !important;\n }\n}\n\n@media screen and (min-width: 1200px) {\n .has-text-left-widescreen {\n text-align: left !important;\n }\n}\n\n@media screen and (min-width: 1200px) and (max-width: 1391px) {\n .has-text-left-widescreen-only {\n text-align: left !important;\n }\n}\n\n@media screen and (min-width: 1392px) {\n .has-text-left-fullhd {\n text-align: left !important;\n }\n}\n\n.has-text-right {\n text-align: right !important;\n}\n\n@media screen and (max-width: 768px) {\n .has-text-right-mobile {\n text-align: right !important;\n }\n}\n\n@media screen and (min-width: 769px), print {\n .has-text-right-tablet {\n text-align: right !important;\n }\n}\n\n@media screen and (min-width: 769px) and (max-width: 1007px) {\n .has-text-right-tablet-only {\n text-align: right !important;\n }\n}\n\n@media screen and (max-width: 1007px) {\n .has-text-right-touch {\n text-align: right !important;\n }\n}\n\n@media screen and (min-width: 1008px) {\n .has-text-right-desktop {\n text-align: right !important;\n }\n}\n\n@media screen and (min-width: 1008px) and (max-width: 1199px) {\n .has-text-right-desktop-only {\n text-align: right !important;\n }\n}\n\n@media screen and (min-width: 1200px) {\n .has-text-right-widescreen {\n text-align: right !important;\n }\n}\n\n@media screen and (min-width: 1200px) and (max-width: 1391px) {\n .has-text-right-widescreen-only {\n text-align: right !important;\n }\n}\n\n@media screen and (min-width: 1392px) {\n .has-text-right-fullhd {\n text-align: right !important;\n }\n}\n\n.is-capitalized {\n text-transform: capitalize !important;\n}\n\n.is-lowercase {\n text-transform: lowercase !important;\n}\n\n.is-uppercase {\n text-transform: uppercase !important;\n}\n\n.has-text-white {\n color: white !important;\n}\n\na.has-text-white:hover, a.has-text-white:focus {\n color: #e6e6e6 !important;\n}\n\n.has-text-black {\n color: #0a0a0a !important;\n}\n\na.has-text-black:hover, a.has-text-black:focus {\n color: black !important;\n}\n\n.has-text-light {\n color: whitesmoke !important;\n}\n\na.has-text-light:hover, a.has-text-light:focus {\n color: #dbdbdb !important;\n}\n\n.has-text-dark {\n color: #363636 !important;\n}\n\na.has-text-dark:hover, a.has-text-dark:focus {\n color: #1c1c1c !important;\n}\n\n.has-text-primary {\n color: #00d1b2 !important;\n}\n\na.has-text-primary:hover, a.has-text-primary:focus {\n color: #009e86 !important;\n}\n\n.has-text-info {\n color: #3273dc !important;\n}\n\na.has-text-info:hover, a.has-text-info:focus {\n color: #205bbc !important;\n}\n\n.has-text-success {\n color: #23d160 !important;\n}\n\na.has-text-success:hover, a.has-text-success:focus {\n color: #1ca64c !important;\n}\n\n.has-text-warning {\n color: #ffdd57 !important;\n}\n\na.has-text-warning:hover, a.has-text-warning:focus {\n color: #ffd324 !important;\n}\n\n.has-text-danger {\n color: #ff3860 !important;\n}\n\na.has-text-danger:hover, a.has-text-danger:focus {\n color: #ff0537 !important;\n}\n\n.has-text-black-bis {\n color: #121212 !important;\n}\n\n.has-text-black-ter {\n color: #242424 !important;\n}\n\n.has-text-grey-darker {\n color: #363636 !important;\n}\n\n.has-text-grey-dark {\n color: #4a4a4a !important;\n}\n\n.has-text-grey {\n color: #7a7a7a !important;\n}\n\n.has-text-grey-light {\n color: #b5b5b5 !important;\n}\n\n.has-text-grey-lighter {\n color: #dbdbdb !important;\n}\n\n.has-text-white-ter {\n color: whitesmoke !important;\n}\n\n.has-text-white-bis {\n color: #fafafa !important;\n}\n\n.is-block {\n display: block !important;\n}\n\n@media screen and (max-width: 768px) {\n .is-block-mobile {\n display: block !important;\n }\n}\n\n@media screen and (min-width: 769px), print {\n .is-block-tablet {\n display: block !important;\n }\n}\n\n@media screen and (min-width: 769px) and (max-width: 1007px) {\n .is-block-tablet-only {\n display: block !important;\n }\n}\n\n@media screen and (max-width: 1007px) {\n .is-block-touch {\n display: block !important;\n }\n}\n\n@media screen and (min-width: 1008px) {\n .is-block-desktop {\n display: block !important;\n }\n}\n\n@media screen and (min-width: 1008px) and (max-width: 1199px) {\n .is-block-desktop-only {\n display: block !important;\n }\n}\n\n@media screen and (min-width: 1200px) {\n .is-block-widescreen {\n display: block !important;\n }\n}\n\n@media screen and (min-width: 1200px) and (max-width: 1391px) {\n .is-block-widescreen-only {\n display: block !important;\n }\n}\n\n@media screen and (min-width: 1392px) {\n .is-block-fullhd {\n display: block !important;\n }\n}\n\n.is-flex {\n display: flex !important;\n}\n\n@media screen and (max-width: 768px) {\n .is-flex-mobile {\n display: flex !important;\n }\n}\n\n@media screen and (min-width: 769px), print {\n .is-flex-tablet {\n display: flex !important;\n }\n}\n\n@media screen and (min-width: 769px) and (max-width: 1007px) {\n .is-flex-tablet-only {\n display: flex !important;\n }\n}\n\n@media screen and (max-width: 1007px) {\n .is-flex-touch {\n display: flex !important;\n }\n}\n\n@media screen and (min-width: 1008px) {\n .is-flex-desktop {\n display: flex !important;\n }\n}\n\n@media screen and (min-width: 1008px) and (max-width: 1199px) {\n .is-flex-desktop-only {\n display: flex !important;\n }\n}\n\n@media screen and (min-width: 1200px) {\n .is-flex-widescreen {\n display: flex !important;\n }\n}\n\n@media screen and (min-width: 1200px) and (max-width: 1391px) {\n .is-flex-widescreen-only {\n display: flex !important;\n }\n}\n\n@media screen and (min-width: 1392px) {\n .is-flex-fullhd {\n display: flex !important;\n }\n}\n\n.is-inline {\n display: inline !important;\n}\n\n@media screen and (max-width: 768px) {\n .is-inline-mobile {\n display: inline !important;\n }\n}\n\n@media screen and (min-width: 769px), print {\n .is-inline-tablet {\n display: inline !important;\n }\n}\n\n@media screen and (min-width: 769px) and (max-width: 1007px) {\n .is-inline-tablet-only {\n display: inline !important;\n }\n}\n\n@media screen and (max-width: 1007px) {\n .is-inline-touch {\n display: inline !important;\n }\n}\n\n@media screen and (min-width: 1008px) {\n .is-inline-desktop {\n display: inline !important;\n }\n}\n\n@media screen and (min-width: 1008px) and (max-width: 1199px) {\n .is-inline-desktop-only {\n display: inline !important;\n }\n}\n\n@media screen and (min-width: 1200px) {\n .is-inline-widescreen {\n display: inline !important;\n }\n}\n\n@media screen and (min-width: 1200px) and (max-width: 1391px) {\n .is-inline-widescreen-only {\n display: inline !important;\n }\n}\n\n@media screen and (min-width: 1392px) {\n .is-inline-fullhd {\n display: inline !important;\n }\n}\n\n.is-inline-block {\n display: inline-block !important;\n}\n\n@media screen and (max-width: 768px) {\n .is-inline-block-mobile {\n display: inline-block !important;\n }\n}\n\n@media screen and (min-width: 769px), print {\n .is-inline-block-tablet {\n display: inline-block !important;\n }\n}\n\n@media screen and (min-width: 769px) and (max-width: 1007px) {\n .is-inline-block-tablet-only {\n display: inline-block !important;\n }\n}\n\n@media screen and (max-width: 1007px) {\n .is-inline-block-touch {\n display: inline-block !important;\n }\n}\n\n@media screen and (min-width: 1008px) {\n .is-inline-block-desktop {\n display: inline-block !important;\n }\n}\n\n@media screen and (min-width: 1008px) and (max-width: 1199px) {\n .is-inline-block-desktop-only {\n display: inline-block !important;\n }\n}\n\n@media screen and (min-width: 1200px) {\n .is-inline-block-widescreen {\n display: inline-block !important;\n }\n}\n\n@media screen and (min-width: 1200px) and (max-width: 1391px) {\n .is-inline-block-widescreen-only {\n display: inline-block !important;\n }\n}\n\n@media screen and (min-width: 1392px) {\n .is-inline-block-fullhd {\n display: inline-block !important;\n }\n}\n\n.is-inline-flex {\n display: inline-flex !important;\n}\n\n@media screen and (max-width: 768px) {\n .is-inline-flex-mobile {\n display: inline-flex !important;\n }\n}\n\n@media screen and (min-width: 769px), print {\n .is-inline-flex-tablet {\n display: inline-flex !important;\n }\n}\n\n@media screen and (min-width: 769px) and (max-width: 1007px) {\n .is-inline-flex-tablet-only {\n display: inline-flex !important;\n }\n}\n\n@media screen and (max-width: 1007px) {\n .is-inline-flex-touch {\n display: inline-flex !important;\n }\n}\n\n@media screen and (min-width: 1008px) {\n .is-inline-flex-desktop {\n display: inline-flex !important;\n }\n}\n\n@media screen and (min-width: 1008px) and (max-width: 1199px) {\n .is-inline-flex-desktop-only {\n display: inline-flex !important;\n }\n}\n\n@media screen and (min-width: 1200px) {\n .is-inline-flex-widescreen {\n display: inline-flex !important;\n }\n}\n\n@media screen and (min-width: 1200px) and (max-width: 1391px) {\n .is-inline-flex-widescreen-only {\n display: inline-flex !important;\n }\n}\n\n@media screen and (min-width: 1392px) {\n .is-inline-flex-fullhd {\n display: inline-flex !important;\n }\n}\n\n.is-hidden {\n display: none !important;\n}\n\n@media screen and (max-width: 768px) {\n .is-hidden-mobile {\n display: none !important;\n }\n}\n\n@media screen and (min-width: 769px), print {\n .is-hidden-tablet {\n display: none !important;\n }\n}\n\n@media screen and (min-width: 769px) and (max-width: 1007px) {\n .is-hidden-tablet-only {\n display: none !important;\n }\n}\n\n@media screen and (max-width: 1007px) {\n .is-hidden-touch {\n display: none !important;\n }\n}\n\n@media screen and (min-width: 1008px) {\n .is-hidden-desktop {\n display: none !important;\n }\n}\n\n@media screen and (min-width: 1008px) and (max-width: 1199px) {\n .is-hidden-desktop-only {\n display: none !important;\n }\n}\n\n@media screen and (min-width: 1200px) {\n .is-hidden-widescreen {\n display: none !important;\n }\n}\n\n@media screen and (min-width: 1200px) and (max-width: 1391px) {\n .is-hidden-widescreen-only {\n display: none !important;\n }\n}\n\n@media screen and (min-width: 1392px) {\n .is-hidden-fullhd {\n display: none !important;\n }\n}\n\n.is-marginless {\n margin: 0 !important;\n}\n\n.is-paddingless {\n padding: 0 !important;\n}\n\n.is-radiusless {\n border-radius: 0 !important;\n}\n\n.is-shadowless {\n box-shadow: none !important;\n}\n\n.is-unselectable {\n -webkit-touch-callout: none;\n -webkit-user-select: none;\n -moz-user-select: none;\n -ms-user-select: none;\n user-select: none;\n}\n\n.box {\n background-color: white;\n border-radius: 5px;\n box-shadow: 0 2px 3px rgba(10, 10, 10, 0.1), 0 0 0 1px rgba(10, 10, 10, 0.1);\n color: #4a4a4a;\n display: block;\n padding: 1.25rem;\n}\n\n.box:not(:last-child) {\n margin-bottom: 1.5rem;\n}\n\na.box:hover, a.box:focus {\n box-shadow: 0 2px 3px rgba(10, 10, 10, 0.1), 0 0 0 1px #00d1b2;\n}\n\na.box:active {\n box-shadow: inset 0 1px 2px rgba(10, 10, 10, 0.2), 0 0 0 1px #00d1b2;\n}\n\n.button {\n -moz-appearance: none;\n -webkit-appearance: none;\n align-items: center;\n border: 1px solid transparent;\n border-radius: 3px;\n box-shadow: none;\n display: inline-flex;\n font-size: 1rem;\n height: 2.25em;\n justify-content: flex-start;\n line-height: 1.5;\n padding-bottom: calc(0.375em - 1px);\n padding-left: calc(0.625em - 1px);\n padding-right: calc(0.625em - 1px);\n padding-top: calc(0.375em - 1px);\n position: relative;\n vertical-align: top;\n -webkit-touch-callout: none;\n -webkit-user-select: none;\n -moz-user-select: none;\n -ms-user-select: none;\n user-select: none;\n background-color: white;\n border-color: #dbdbdb;\n color: #363636;\n cursor: pointer;\n justify-content: center;\n padding-left: 0.75em;\n padding-right: 0.75em;\n text-align: center;\n white-space: nowrap;\n}\n\n.button:focus, .button.is-focused, .button:active, .button.is-active {\n outline: none;\n}\n\n.button[disabled] {\n cursor: not-allowed;\n}\n\n.button strong {\n color: inherit;\n}\n\n.button .icon, .button .icon.is-small, .button .icon.is-medium, .button .icon.is-large {\n height: 1.5em;\n width: 1.5em;\n}\n\n.button .icon:first-child:not(:last-child) {\n margin-left: calc(-0.375em - 1px);\n margin-right: 0.1875em;\n}\n\n.button .icon:last-child:not(:first-child) {\n margin-left: 0.1875em;\n margin-right: calc(-0.375em - 1px);\n}\n\n.button .icon:first-child:last-child {\n margin-left: calc(-0.375em - 1px);\n margin-right: calc(-0.375em - 1px);\n}\n\n.button:hover, .button.is-hovered {\n border-color: #b5b5b5;\n color: #363636;\n}\n\n.button:focus, .button.is-focused {\n border-color: #00d1b2;\n color: #363636;\n}\n\n.button:active, .button.is-active {\n border-color: #4a4a4a;\n box-shadow: inset 0 1px 2px rgba(10, 10, 10, 0.2);\n color: #363636;\n}\n\n.button.is-link {\n background-color: transparent;\n border-color: transparent;\n color: #4a4a4a;\n text-decoration: underline;\n}\n\n.button.is-link:hover, .button.is-link.is-hovered, .button.is-link:focus, .button.is-link.is-focused, .button.is-link:active, .button.is-link.is-active {\n background-color: whitesmoke;\n color: #363636;\n}\n\n.button.is-link[disabled] {\n background-color: transparent;\n border-color: transparent;\n box-shadow: none;\n}\n\n.button.is-white {\n background-color: white;\n border-color: transparent;\n color: #0a0a0a;\n}\n\n.button.is-white:hover, .button.is-white.is-hovered {\n background-color: #f9f9f9;\n border-color: transparent;\n color: #0a0a0a;\n}\n\n.button.is-white:focus, .button.is-white.is-focused {\n border-color: transparent;\n box-shadow: 0 0 0.5em rgba(255, 255, 255, 0.25);\n color: #0a0a0a;\n}\n\n.button.is-white:active, .button.is-white.is-active {\n background-color: #f2f2f2;\n border-color: transparent;\n box-shadow: inset 0 1px 2px rgba(10, 10, 10, 0.2);\n color: #0a0a0a;\n}\n\n.button.is-white[disabled] {\n background-color: white;\n border-color: transparent;\n box-shadow: none;\n}\n\n.button.is-white.is-inverted {\n background-color: #0a0a0a;\n color: white;\n}\n\n.button.is-white.is-inverted:hover {\n background-color: black;\n}\n\n.button.is-white.is-inverted[disabled] {\n background-color: #0a0a0a;\n border-color: transparent;\n box-shadow: none;\n color: white;\n}\n\n.button.is-white.is-loading:after {\n border-color: transparent transparent #0a0a0a #0a0a0a !important;\n}\n\n.button.is-white.is-outlined {\n background-color: transparent;\n border-color: white;\n color: white;\n}\n\n.button.is-white.is-outlined:hover, .button.is-white.is-outlined:focus {\n background-color: white;\n border-color: white;\n color: #0a0a0a;\n}\n\n.button.is-white.is-outlined.is-loading:after {\n border-color: transparent transparent white white !important;\n}\n\n.button.is-white.is-outlined[disabled] {\n background-color: transparent;\n border-color: white;\n box-shadow: none;\n color: white;\n}\n\n.button.is-white.is-inverted.is-outlined {\n background-color: transparent;\n border-color: #0a0a0a;\n color: #0a0a0a;\n}\n\n.button.is-white.is-inverted.is-outlined:hover, .button.is-white.is-inverted.is-outlined:focus {\n background-color: #0a0a0a;\n color: white;\n}\n\n.button.is-white.is-inverted.is-outlined[disabled] {\n background-color: transparent;\n border-color: #0a0a0a;\n box-shadow: none;\n color: #0a0a0a;\n}\n\n.button.is-black {\n background-color: #0a0a0a;\n border-color: transparent;\n color: white;\n}\n\n.button.is-black:hover, .button.is-black.is-hovered {\n background-color: #040404;\n border-color: transparent;\n color: white;\n}\n\n.button.is-black:focus, .button.is-black.is-focused {\n border-color: transparent;\n box-shadow: 0 0 0.5em rgba(10, 10, 10, 0.25);\n color: white;\n}\n\n.button.is-black:active, .button.is-black.is-active {\n background-color: black;\n border-color: transparent;\n box-shadow: inset 0 1px 2px rgba(10, 10, 10, 0.2);\n color: white;\n}\n\n.button.is-black[disabled] {\n background-color: #0a0a0a;\n border-color: transparent;\n box-shadow: none;\n}\n\n.button.is-black.is-inverted {\n background-color: white;\n color: #0a0a0a;\n}\n\n.button.is-black.is-inverted:hover {\n background-color: #f2f2f2;\n}\n\n.button.is-black.is-inverted[disabled] {\n background-color: white;\n border-color: transparent;\n box-shadow: none;\n color: #0a0a0a;\n}\n\n.button.is-black.is-loading:after {\n border-color: transparent transparent white white !important;\n}\n\n.button.is-black.is-outlined {\n background-color: transparent;\n border-color: #0a0a0a;\n color: #0a0a0a;\n}\n\n.button.is-black.is-outlined:hover, .button.is-black.is-outlined:focus {\n background-color: #0a0a0a;\n border-color: #0a0a0a;\n color: white;\n}\n\n.button.is-black.is-outlined.is-loading:after {\n border-color: transparent transparent #0a0a0a #0a0a0a !important;\n}\n\n.button.is-black.is-outlined[disabled] {\n background-color: transparent;\n border-color: #0a0a0a;\n box-shadow: none;\n color: #0a0a0a;\n}\n\n.button.is-black.is-inverted.is-outlined {\n background-color: transparent;\n border-color: white;\n color: white;\n}\n\n.button.is-black.is-inverted.is-outlined:hover, .button.is-black.is-inverted.is-outlined:focus {\n background-color: white;\n color: #0a0a0a;\n}\n\n.button.is-black.is-inverted.is-outlined[disabled] {\n background-color: transparent;\n border-color: white;\n box-shadow: none;\n color: white;\n}\n\n.button.is-light {\n background-color: whitesmoke;\n border-color: transparent;\n color: #363636;\n}\n\n.button.is-light:hover, .button.is-light.is-hovered {\n background-color: #eeeeee;\n border-color: transparent;\n color: #363636;\n}\n\n.button.is-light:focus, .button.is-light.is-focused {\n border-color: transparent;\n box-shadow: 0 0 0.5em rgba(245, 245, 245, 0.25);\n color: #363636;\n}\n\n.button.is-light:active, .button.is-light.is-active {\n background-color: #e8e8e8;\n border-color: transparent;\n box-shadow: inset 0 1px 2px rgba(10, 10, 10, 0.2);\n color: #363636;\n}\n\n.button.is-light[disabled] {\n background-color: whitesmoke;\n border-color: transparent;\n box-shadow: none;\n}\n\n.button.is-light.is-inverted {\n background-color: #363636;\n color: whitesmoke;\n}\n\n.button.is-light.is-inverted:hover {\n background-color: #292929;\n}\n\n.button.is-light.is-inverted[disabled] {\n background-color: #363636;\n border-color: transparent;\n box-shadow: none;\n color: whitesmoke;\n}\n\n.button.is-light.is-loading:after {\n border-color: transparent transparent #363636 #363636 !important;\n}\n\n.button.is-light.is-outlined {\n background-color: transparent;\n border-color: whitesmoke;\n color: whitesmoke;\n}\n\n.button.is-light.is-outlined:hover, .button.is-light.is-outlined:focus {\n background-color: whitesmoke;\n border-color: whitesmoke;\n color: #363636;\n}\n\n.button.is-light.is-outlined.is-loading:after {\n border-color: transparent transparent whitesmoke whitesmoke !important;\n}\n\n.button.is-light.is-outlined[disabled] {\n background-color: transparent;\n border-color: whitesmoke;\n box-shadow: none;\n color: whitesmoke;\n}\n\n.button.is-light.is-inverted.is-outlined {\n background-color: transparent;\n border-color: #363636;\n color: #363636;\n}\n\n.button.is-light.is-inverted.is-outlined:hover, .button.is-light.is-inverted.is-outlined:focus {\n background-color: #363636;\n color: whitesmoke;\n}\n\n.button.is-light.is-inverted.is-outlined[disabled] {\n background-color: transparent;\n border-color: #363636;\n box-shadow: none;\n color: #363636;\n}\n\n.button.is-dark {\n background-color: #363636;\n border-color: transparent;\n color: whitesmoke;\n}\n\n.button.is-dark:hover, .button.is-dark.is-hovered {\n background-color: #2f2f2f;\n border-color: transparent;\n color: whitesmoke;\n}\n\n.button.is-dark:focus, .button.is-dark.is-focused {\n border-color: transparent;\n box-shadow: 0 0 0.5em rgba(54, 54, 54, 0.25);\n color: whitesmoke;\n}\n\n.button.is-dark:active, .button.is-dark.is-active {\n background-color: #292929;\n border-color: transparent;\n box-shadow: inset 0 1px 2px rgba(10, 10, 10, 0.2);\n color: whitesmoke;\n}\n\n.button.is-dark[disabled] {\n background-color: #363636;\n border-color: transparent;\n box-shadow: none;\n}\n\n.button.is-dark.is-inverted {\n background-color: whitesmoke;\n color: #363636;\n}\n\n.button.is-dark.is-inverted:hover {\n background-color: #e8e8e8;\n}\n\n.button.is-dark.is-inverted[disabled] {\n background-color: whitesmoke;\n border-color: transparent;\n box-shadow: none;\n color: #363636;\n}\n\n.button.is-dark.is-loading:after {\n border-color: transparent transparent whitesmoke whitesmoke !important;\n}\n\n.button.is-dark.is-outlined {\n background-color: transparent;\n border-color: #363636;\n color: #363636;\n}\n\n.button.is-dark.is-outlined:hover, .button.is-dark.is-outlined:focus {\n background-color: #363636;\n border-color: #363636;\n color: whitesmoke;\n}\n\n.button.is-dark.is-outlined.is-loading:after {\n border-color: transparent transparent #363636 #363636 !important;\n}\n\n.button.is-dark.is-outlined[disabled] {\n background-color: transparent;\n border-color: #363636;\n box-shadow: none;\n color: #363636;\n}\n\n.button.is-dark.is-inverted.is-outlined {\n background-color: transparent;\n border-color: whitesmoke;\n color: whitesmoke;\n}\n\n.button.is-dark.is-inverted.is-outlined:hover, .button.is-dark.is-inverted.is-outlined:focus {\n background-color: whitesmoke;\n color: #363636;\n}\n\n.button.is-dark.is-inverted.is-outlined[disabled] {\n background-color: transparent;\n border-color: whitesmoke;\n box-shadow: none;\n color: whitesmoke;\n}\n\n.button.is-primary {\n background-color: #00d1b2;\n border-color: transparent;\n color: #fff;\n}\n\n.button.is-primary:hover, .button.is-primary.is-hovered {\n background-color: #00c4a7;\n border-color: transparent;\n color: #fff;\n}\n\n.button.is-primary:focus, .button.is-primary.is-focused {\n border-color: transparent;\n box-shadow: 0 0 0.5em rgba(0, 209, 178, 0.25);\n color: #fff;\n}\n\n.button.is-primary:active, .button.is-primary.is-active {\n background-color: #00b89c;\n border-color: transparent;\n box-shadow: inset 0 1px 2px rgba(10, 10, 10, 0.2);\n color: #fff;\n}\n\n.button.is-primary[disabled] {\n background-color: #00d1b2;\n border-color: transparent;\n box-shadow: none;\n}\n\n.button.is-primary.is-inverted {\n background-color: #fff;\n color: #00d1b2;\n}\n\n.button.is-primary.is-inverted:hover {\n background-color: #f2f2f2;\n}\n\n.button.is-primary.is-inverted[disabled] {\n background-color: #fff;\n border-color: transparent;\n box-shadow: none;\n color: #00d1b2;\n}\n\n.button.is-primary.is-loading:after {\n border-color: transparent transparent #fff #fff !important;\n}\n\n.button.is-primary.is-outlined {\n background-color: transparent;\n border-color: #00d1b2;\n color: #00d1b2;\n}\n\n.button.is-primary.is-outlined:hover, .button.is-primary.is-outlined:focus {\n background-color: #00d1b2;\n border-color: #00d1b2;\n color: #fff;\n}\n\n.button.is-primary.is-outlined.is-loading:after {\n border-color: transparent transparent #00d1b2 #00d1b2 !important;\n}\n\n.button.is-primary.is-outlined[disabled] {\n background-color: transparent;\n border-color: #00d1b2;\n box-shadow: none;\n color: #00d1b2;\n}\n\n.button.is-primary.is-inverted.is-outlined {\n background-color: transparent;\n border-color: #fff;\n color: #fff;\n}\n\n.button.is-primary.is-inverted.is-outlined:hover, .button.is-primary.is-inverted.is-outlined:focus {\n background-color: #fff;\n color: #00d1b2;\n}\n\n.button.is-primary.is-inverted.is-outlined[disabled] {\n background-color: transparent;\n border-color: #fff;\n box-shadow: none;\n color: #fff;\n}\n\n.button.is-info {\n background-color: #3273dc;\n border-color: transparent;\n color: #fff;\n}\n\n.button.is-info:hover, .button.is-info.is-hovered {\n background-color: #276cda;\n border-color: transparent;\n color: #fff;\n}\n\n.button.is-info:focus, .button.is-info.is-focused {\n border-color: transparent;\n box-shadow: 0 0 0.5em rgba(50, 115, 220, 0.25);\n color: #fff;\n}\n\n.button.is-info:active, .button.is-info.is-active {\n background-color: #2366d1;\n border-color: transparent;\n box-shadow: inset 0 1px 2px rgba(10, 10, 10, 0.2);\n color: #fff;\n}\n\n.button.is-info[disabled] {\n background-color: #3273dc;\n border-color: transparent;\n box-shadow: none;\n}\n\n.button.is-info.is-inverted {\n background-color: #fff;\n color: #3273dc;\n}\n\n.button.is-info.is-inverted:hover {\n background-color: #f2f2f2;\n}\n\n.button.is-info.is-inverted[disabled] {\n background-color: #fff;\n border-color: transparent;\n box-shadow: none;\n color: #3273dc;\n}\n\n.button.is-info.is-loading:after {\n border-color: transparent transparent #fff #fff !important;\n}\n\n.button.is-info.is-outlined {\n background-color: transparent;\n border-color: #3273dc;\n color: #3273dc;\n}\n\n.button.is-info.is-outlined:hover, .button.is-info.is-outlined:focus {\n background-color: #3273dc;\n border-color: #3273dc;\n color: #fff;\n}\n\n.button.is-info.is-outlined.is-loading:after {\n border-color: transparent transparent #3273dc #3273dc !important;\n}\n\n.button.is-info.is-outlined[disabled] {\n background-color: transparent;\n border-color: #3273dc;\n box-shadow: none;\n color: #3273dc;\n}\n\n.button.is-info.is-inverted.is-outlined {\n background-color: transparent;\n border-color: #fff;\n color: #fff;\n}\n\n.button.is-info.is-inverted.is-outlined:hover, .button.is-info.is-inverted.is-outlined:focus {\n background-color: #fff;\n color: #3273dc;\n}\n\n.button.is-info.is-inverted.is-outlined[disabled] {\n background-color: transparent;\n border-color: #fff;\n box-shadow: none;\n color: #fff;\n}\n\n.button.is-success {\n background-color: #23d160;\n border-color: transparent;\n color: #fff;\n}\n\n.button.is-success:hover, .button.is-success.is-hovered {\n background-color: #22c65b;\n border-color: transparent;\n color: #fff;\n}\n\n.button.is-success:focus, .button.is-success.is-focused {\n border-color: transparent;\n box-shadow: 0 0 0.5em rgba(35, 209, 96, 0.25);\n color: #fff;\n}\n\n.button.is-success:active, .button.is-success.is-active {\n background-color: #20bc56;\n border-color: transparent;\n box-shadow: inset 0 1px 2px rgba(10, 10, 10, 0.2);\n color: #fff;\n}\n\n.button.is-success[disabled] {\n background-color: #23d160;\n border-color: transparent;\n box-shadow: none;\n}\n\n.button.is-success.is-inverted {\n background-color: #fff;\n color: #23d160;\n}\n\n.button.is-success.is-inverted:hover {\n background-color: #f2f2f2;\n}\n\n.button.is-success.is-inverted[disabled] {\n background-color: #fff;\n border-color: transparent;\n box-shadow: none;\n color: #23d160;\n}\n\n.button.is-success.is-loading:after {\n border-color: transparent transparent #fff #fff !important;\n}\n\n.button.is-success.is-outlined {\n background-color: transparent;\n border-color: #23d160;\n color: #23d160;\n}\n\n.button.is-success.is-outlined:hover, .button.is-success.is-outlined:focus {\n background-color: #23d160;\n border-color: #23d160;\n color: #fff;\n}\n\n.button.is-success.is-outlined.is-loading:after {\n border-color: transparent transparent #23d160 #23d160 !important;\n}\n\n.button.is-success.is-outlined[disabled] {\n background-color: transparent;\n border-color: #23d160;\n box-shadow: none;\n color: #23d160;\n}\n\n.button.is-success.is-inverted.is-outlined {\n background-color: transparent;\n border-color: #fff;\n color: #fff;\n}\n\n.button.is-success.is-inverted.is-outlined:hover, .button.is-success.is-inverted.is-outlined:focus {\n background-color: #fff;\n color: #23d160;\n}\n\n.button.is-success.is-inverted.is-outlined[disabled] {\n background-color: transparent;\n border-color: #fff;\n box-shadow: none;\n color: #fff;\n}\n\n.button.is-warning {\n background-color: #ffdd57;\n border-color: transparent;\n color: rgba(0, 0, 0, 0.7);\n}\n\n.button.is-warning:hover, .button.is-warning.is-hovered {\n background-color: #ffdb4a;\n border-color: transparent;\n color: rgba(0, 0, 0, 0.7);\n}\n\n.button.is-warning:focus, .button.is-warning.is-focused {\n border-color: transparent;\n box-shadow: 0 0 0.5em rgba(255, 221, 87, 0.25);\n color: rgba(0, 0, 0, 0.7);\n}\n\n.button.is-warning:active, .button.is-warning.is-active {\n background-color: #ffd83d;\n border-color: transparent;\n box-shadow: inset 0 1px 2px rgba(10, 10, 10, 0.2);\n color: rgba(0, 0, 0, 0.7);\n}\n\n.button.is-warning[disabled] {\n background-color: #ffdd57;\n border-color: transparent;\n box-shadow: none;\n}\n\n.button.is-warning.is-inverted {\n background-color: rgba(0, 0, 0, 0.7);\n color: #ffdd57;\n}\n\n.button.is-warning.is-inverted:hover {\n background-color: rgba(0, 0, 0, 0.7);\n}\n\n.button.is-warning.is-inverted[disabled] {\n background-color: rgba(0, 0, 0, 0.7);\n border-color: transparent;\n box-shadow: none;\n color: #ffdd57;\n}\n\n.button.is-warning.is-loading:after {\n border-color: transparent transparent rgba(0, 0, 0, 0.7) rgba(0, 0, 0, 0.7) !important;\n}\n\n.button.is-warning.is-outlined {\n background-color: transparent;\n border-color: #ffdd57;\n color: #ffdd57;\n}\n\n.button.is-warning.is-outlined:hover, .button.is-warning.is-outlined:focus {\n background-color: #ffdd57;\n border-color: #ffdd57;\n color: rgba(0, 0, 0, 0.7);\n}\n\n.button.is-warning.is-outlined.is-loading:after {\n border-color: transparent transparent #ffdd57 #ffdd57 !important;\n}\n\n.button.is-warning.is-outlined[disabled] {\n background-color: transparent;\n border-color: #ffdd57;\n box-shadow: none;\n color: #ffdd57;\n}\n\n.button.is-warning.is-inverted.is-outlined {\n background-color: transparent;\n border-color: rgba(0, 0, 0, 0.7);\n color: rgba(0, 0, 0, 0.7);\n}\n\n.button.is-warning.is-inverted.is-outlined:hover, .button.is-warning.is-inverted.is-outlined:focus {\n background-color: rgba(0, 0, 0, 0.7);\n color: #ffdd57;\n}\n\n.button.is-warning.is-inverted.is-outlined[disabled] {\n background-color: transparent;\n border-color: rgba(0, 0, 0, 0.7);\n box-shadow: none;\n color: rgba(0, 0, 0, 0.7);\n}\n\n.button.is-danger {\n background-color: #ff3860;\n border-color: transparent;\n color: #fff;\n}\n\n.button.is-danger:hover, .button.is-danger.is-hovered {\n background-color: #ff2b56;\n border-color: transparent;\n color: #fff;\n}\n\n.button.is-danger:focus, .button.is-danger.is-focused {\n border-color: transparent;\n box-shadow: 0 0 0.5em rgba(255, 56, 96, 0.25);\n color: #fff;\n}\n\n.button.is-danger:active, .button.is-danger.is-active {\n background-color: #ff1f4b;\n border-color: transparent;\n box-shadow: inset 0 1px 2px rgba(10, 10, 10, 0.2);\n color: #fff;\n}\n\n.button.is-danger[disabled] {\n background-color: #ff3860;\n border-color: transparent;\n box-shadow: none;\n}\n\n.button.is-danger.is-inverted {\n background-color: #fff;\n color: #ff3860;\n}\n\n.button.is-danger.is-inverted:hover {\n background-color: #f2f2f2;\n}\n\n.button.is-danger.is-inverted[disabled] {\n background-color: #fff;\n border-color: transparent;\n box-shadow: none;\n color: #ff3860;\n}\n\n.button.is-danger.is-loading:after {\n border-color: transparent transparent #fff #fff !important;\n}\n\n.button.is-danger.is-outlined {\n background-color: transparent;\n border-color: #ff3860;\n color: #ff3860;\n}\n\n.button.is-danger.is-outlined:hover, .button.is-danger.is-outlined:focus {\n background-color: #ff3860;\n border-color: #ff3860;\n color: #fff;\n}\n\n.button.is-danger.is-outlined.is-loading:after {\n border-color: transparent transparent #ff3860 #ff3860 !important;\n}\n\n.button.is-danger.is-outlined[disabled] {\n background-color: transparent;\n border-color: #ff3860;\n box-shadow: none;\n color: #ff3860;\n}\n\n.button.is-danger.is-inverted.is-outlined {\n background-color: transparent;\n border-color: #fff;\n color: #fff;\n}\n\n.button.is-danger.is-inverted.is-outlined:hover, .button.is-danger.is-inverted.is-outlined:focus {\n background-color: #fff;\n color: #ff3860;\n}\n\n.button.is-danger.is-inverted.is-outlined[disabled] {\n background-color: transparent;\n border-color: #fff;\n box-shadow: none;\n color: #fff;\n}\n\n.button.is-small {\n border-radius: 2px;\n font-size: 0.75rem;\n}\n\n.button.is-medium {\n font-size: 1.25rem;\n}\n\n.button.is-large {\n font-size: 1.5rem;\n}\n\n.button[disabled] {\n background-color: white;\n border-color: #dbdbdb;\n box-shadow: none;\n opacity: 0.5;\n}\n\n.button.is-fullwidth {\n display: flex;\n width: 100%;\n}\n\n.button.is-loading {\n color: transparent !important;\n pointer-events: none;\n}\n\n.button.is-loading:after {\n animation: spinAround 500ms infinite linear;\n border: 2px solid #dbdbdb;\n border-radius: 290486px;\n border-right-color: transparent;\n border-top-color: transparent;\n content: \"\";\n display: block;\n height: 1em;\n position: relative;\n width: 1em;\n position: absolute;\n left: calc(50% - (1em / 2));\n top: calc(50% - (1em / 2));\n position: absolute !important;\n}\n\n.button.is-static {\n background-color: whitesmoke;\n border-color: #dbdbdb;\n color: #7a7a7a;\n box-shadow: none;\n pointer-events: none;\n}\n\n.container {\n margin: 0 auto;\n position: relative;\n}\n\n@media screen and (min-width: 1068px) {\n .container {\n max-width: 960px;\n width: 960px;\n }\n .container.is-fluid {\n margin-left: 24px;\n margin-right: 24px;\n max-width: none;\n width: auto;\n }\n}\n\n@media screen and (max-width: 1259px) {\n .container.is-widescreen {\n max-width: 1152px;\n width: auto;\n }\n}\n\n@media screen and (max-width: 1451px) {\n .container.is-fullhd {\n max-width: 1344px;\n width: auto;\n }\n}\n\n@media screen and (min-width: 1260px) {\n .container {\n max-width: 1152px;\n width: 1152px;\n }\n}\n\n@media screen and (min-width: 1452px) {\n .container {\n max-width: 1344px;\n width: 1344px;\n }\n}\n\n.content:not(:last-child) {\n margin-bottom: 1.5rem;\n}\n\n.content li + li {\n margin-top: 0.25em;\n}\n\n.content p:not(:last-child),\n.content dl:not(:last-child),\n.content ol:not(:last-child),\n.content ul:not(:last-child),\n.content blockquote:not(:last-child),\n.content pre:not(:last-child),\n.content table:not(:last-child) {\n margin-bottom: 1em;\n}\n\n.content h1,\n.content h2,\n.content h3,\n.content h4,\n.content h5,\n.content h6 {\n color: #363636;\n font-weight: 400;\n line-height: 1.125;\n}\n\n.content h1 {\n font-size: 2em;\n margin-bottom: 0.5em;\n}\n\n.content h1:not(:first-child) {\n margin-top: 1em;\n}\n\n.content h2 {\n font-size: 1.75em;\n margin-bottom: 0.5714em;\n}\n\n.content h2:not(:first-child) {\n margin-top: 1.1428em;\n}\n\n.content h3 {\n font-size: 1.5em;\n margin-bottom: 0.6666em;\n}\n\n.content h3:not(:first-child) {\n margin-top: 1.3333em;\n}\n\n.content h4 {\n font-size: 1.25em;\n margin-bottom: 0.8em;\n}\n\n.content h5 {\n font-size: 1.125em;\n margin-bottom: 0.8888em;\n}\n\n.content h6 {\n font-size: 1em;\n margin-bottom: 1em;\n}\n\n.content blockquote {\n background-color: whitesmoke;\n border-left: 5px solid #dbdbdb;\n padding: 1.25em 1.5em;\n}\n\n.content ol {\n list-style: decimal outside;\n margin-left: 2em;\n margin-top: 1em;\n}\n\n.content ul {\n list-style: disc outside;\n margin-left: 2em;\n margin-top: 1em;\n}\n\n.content ul ul {\n list-style-type: circle;\n margin-top: 0.5em;\n}\n\n.content ul ul ul {\n list-style-type: square;\n}\n\n.content dd {\n margin-left: 2em;\n}\n\n.content figure {\n margin: 2em;\n text-align: center;\n}\n\n.content figure img {\n display: inline-block;\n}\n\n.content figure figcaption {\n font-style: italic;\n}\n\n.content pre {\n -webkit-overflow-scrolling: touch;\n overflow-x: auto;\n padding: 1.25em 1.5em;\n white-space: pre;\n word-wrap: normal;\n}\n\n.content sup,\n.content sub {\n font-size: 75%;\n}\n\n.content table {\n width: 100%;\n}\n\n.content table td,\n.content table th {\n border: 1px solid #dbdbdb;\n border-width: 0 0 1px;\n padding: 0.5em 0.75em;\n vertical-align: top;\n}\n\n.content table th {\n color: #363636;\n text-align: left;\n}\n\n.content table tr:hover {\n background-color: whitesmoke;\n}\n\n.content table thead td,\n.content table thead th {\n border-width: 0 0 2px;\n color: #363636;\n}\n\n.content table tfoot td,\n.content table tfoot th {\n border-width: 2px 0 0;\n color: #363636;\n}\n\n.content table tbody tr:last-child td,\n.content table tbody tr:last-child th {\n border-bottom-width: 0;\n}\n\n.content.is-small {\n font-size: 0.75rem;\n}\n\n.content.is-medium {\n font-size: 1.25rem;\n}\n\n.content.is-large {\n font-size: 1.5rem;\n}\n\n.input,\n.textarea {\n -moz-appearance: none;\n -webkit-appearance: none;\n align-items: center;\n border: 1px solid transparent;\n border-radius: 3px;\n box-shadow: none;\n display: inline-flex;\n font-size: 1rem;\n height: 2.25em;\n justify-content: flex-start;\n line-height: 1.5;\n padding-bottom: calc(0.375em - 1px);\n padding-left: calc(0.625em - 1px);\n padding-right: calc(0.625em - 1px);\n padding-top: calc(0.375em - 1px);\n position: relative;\n vertical-align: top;\n background-color: white;\n border-color: #dbdbdb;\n color: #363636;\n box-shadow: inset 0 1px 2px rgba(10, 10, 10, 0.1);\n max-width: 100%;\n width: 100%;\n}\n\n.input:focus, .input.is-focused, .input:active, .input.is-active,\n.textarea:focus,\n.textarea.is-focused,\n.textarea:active,\n.textarea.is-active {\n outline: none;\n}\n\n.input[disabled],\n.textarea[disabled] {\n cursor: not-allowed;\n}\n\n.input:hover, .input.is-hovered,\n.textarea:hover,\n.textarea.is-hovered {\n border-color: #b5b5b5;\n}\n\n.input:focus, .input.is-focused, .input:active, .input.is-active,\n.textarea:focus,\n.textarea.is-focused,\n.textarea:active,\n.textarea.is-active {\n border-color: #00d1b2;\n}\n\n.input[disabled],\n.textarea[disabled] {\n background-color: whitesmoke;\n border-color: whitesmoke;\n box-shadow: none;\n color: #7a7a7a;\n}\n\n.input[disabled]::-moz-placeholder,\n.textarea[disabled]::-moz-placeholder {\n color: rgba(122, 122, 122, 0.3);\n}\n\n.input[disabled]::-webkit-input-placeholder,\n.textarea[disabled]::-webkit-input-placeholder {\n color: rgba(122, 122, 122, 0.3);\n}\n\n.input[disabled]:-moz-placeholder,\n.textarea[disabled]:-moz-placeholder {\n color: rgba(122, 122, 122, 0.3);\n}\n\n.input[disabled]:-ms-input-placeholder,\n.textarea[disabled]:-ms-input-placeholder {\n color: rgba(122, 122, 122, 0.3);\n}\n\n.input[type=\"search\"],\n.textarea[type=\"search\"] {\n border-radius: 290486px;\n}\n\n.input.is-white,\n.textarea.is-white {\n border-color: white;\n}\n\n.input.is-black,\n.textarea.is-black {\n border-color: #0a0a0a;\n}\n\n.input.is-light,\n.textarea.is-light {\n border-color: whitesmoke;\n}\n\n.input.is-dark,\n.textarea.is-dark {\n border-color: #363636;\n}\n\n.input.is-primary,\n.textarea.is-primary {\n border-color: #00d1b2;\n}\n\n.input.is-info,\n.textarea.is-info {\n border-color: #3273dc;\n}\n\n.input.is-success,\n.textarea.is-success {\n border-color: #23d160;\n}\n\n.input.is-warning,\n.textarea.is-warning {\n border-color: #ffdd57;\n}\n\n.input.is-danger,\n.textarea.is-danger {\n border-color: #ff3860;\n}\n\n.input.is-small,\n.textarea.is-small {\n border-radius: 2px;\n font-size: 0.75rem;\n}\n\n.input.is-medium,\n.textarea.is-medium {\n font-size: 1.25rem;\n}\n\n.input.is-large,\n.textarea.is-large {\n font-size: 1.5rem;\n}\n\n.input.is-fullwidth,\n.textarea.is-fullwidth {\n display: block;\n width: 100%;\n}\n\n.input.is-inline,\n.textarea.is-inline {\n display: inline;\n width: auto;\n}\n\n.textarea {\n display: block;\n max-width: 100%;\n min-width: 100%;\n padding: 0.625em;\n resize: vertical;\n}\n\n.textarea:not([rows]) {\n max-height: 600px;\n min-height: 120px;\n}\n\n.textarea[rows] {\n height: unset;\n}\n\n.checkbox,\n.radio {\n cursor: pointer;\n display: inline-block;\n line-height: 1.25;\n position: relative;\n}\n\n.checkbox input,\n.radio input {\n cursor: pointer;\n}\n\n.checkbox:hover,\n.radio:hover {\n color: #363636;\n}\n\n.checkbox[disabled],\n.radio[disabled] {\n color: #7a7a7a;\n cursor: not-allowed;\n}\n\n.radio + .radio {\n margin-left: 0.5em;\n}\n\n.select {\n display: inline-block;\n max-width: 100%;\n position: relative;\n vertical-align: top;\n}\n\n.select:not(.is-multiple) {\n height: 2.25em;\n}\n\n.select:not(.is-multiple)::after {\n border: 1px solid #00d1b2;\n border-right: 0;\n border-top: 0;\n content: \" \";\n display: block;\n height: 0.5em;\n pointer-events: none;\n position: absolute;\n transform: rotate(-45deg);\n width: 0.5em;\n margin-top: -0.375em;\n right: 1.125em;\n top: 50%;\n z-index: 4;\n}\n\n.select select {\n -moz-appearance: none;\n -webkit-appearance: none;\n align-items: center;\n border: 1px solid transparent;\n border-radius: 3px;\n box-shadow: none;\n display: inline-flex;\n font-size: 1rem;\n height: 2.25em;\n justify-content: flex-start;\n line-height: 1.5;\n padding-bottom: calc(0.375em - 1px);\n padding-left: calc(0.625em - 1px);\n padding-right: calc(0.625em - 1px);\n padding-top: calc(0.375em - 1px);\n position: relative;\n vertical-align: top;\n background-color: white;\n border-color: #dbdbdb;\n color: #363636;\n cursor: pointer;\n display: block;\n font-size: 1em;\n max-width: 100%;\n outline: none;\n}\n\n.select select:focus, .select select.is-focused, .select select:active, .select select.is-active {\n outline: none;\n}\n\n.select select[disabled] {\n cursor: not-allowed;\n}\n\n.select select:hover, .select select.is-hovered {\n border-color: #b5b5b5;\n}\n\n.select select:focus, .select select.is-focused, .select select:active, .select select.is-active {\n border-color: #00d1b2;\n}\n\n.select select[disabled] {\n background-color: whitesmoke;\n border-color: whitesmoke;\n box-shadow: none;\n color: #7a7a7a;\n}\n\n.select select[disabled]::-moz-placeholder {\n color: rgba(122, 122, 122, 0.3);\n}\n\n.select select[disabled]::-webkit-input-placeholder {\n color: rgba(122, 122, 122, 0.3);\n}\n\n.select select[disabled]:-moz-placeholder {\n color: rgba(122, 122, 122, 0.3);\n}\n\n.select select[disabled]:-ms-input-placeholder {\n color: rgba(122, 122, 122, 0.3);\n}\n\n.select select:hover {\n border-color: #b5b5b5;\n}\n\n.select select:focus, .select select.is-focused, .select select:active, .select select.is-active {\n border-color: #00d1b2;\n}\n\n.select select::-ms-expand {\n display: none;\n}\n\n.select select[disabled]:hover {\n border-color: whitesmoke;\n}\n\n.select select:not([multiple]) {\n padding-right: 2.5em;\n}\n\n.select select[multiple] {\n height: unset;\n padding: 0;\n}\n\n.select select[multiple] option {\n padding: 0.5em 1em;\n}\n\n.select:hover::after {\n border-color: #363636;\n}\n\n.select.is-white select {\n border-color: white;\n}\n\n.select.is-black select {\n border-color: #0a0a0a;\n}\n\n.select.is-light select {\n border-color: whitesmoke;\n}\n\n.select.is-dark select {\n border-color: #363636;\n}\n\n.select.is-primary select {\n border-color: #00d1b2;\n}\n\n.select.is-info select {\n border-color: #3273dc;\n}\n\n.select.is-success select {\n border-color: #23d160;\n}\n\n.select.is-warning select {\n border-color: #ffdd57;\n}\n\n.select.is-danger select {\n border-color: #ff3860;\n}\n\n.select.is-small {\n border-radius: 2px;\n font-size: 0.75rem;\n}\n\n.select.is-medium {\n font-size: 1.25rem;\n}\n\n.select.is-large {\n font-size: 1.5rem;\n}\n\n.select.is-disabled::after {\n border-color: #7a7a7a;\n}\n\n.select.is-fullwidth {\n width: 100%;\n}\n\n.select.is-fullwidth select {\n width: 100%;\n}\n\n.select.is-loading::after {\n animation: spinAround 500ms infinite linear;\n border: 2px solid #dbdbdb;\n border-radius: 290486px;\n border-right-color: transparent;\n border-top-color: transparent;\n content: \"\";\n display: block;\n height: 1em;\n position: relative;\n width: 1em;\n margin-top: 0;\n position: absolute;\n right: 0.625em;\n top: 0.625em;\n transform: none;\n}\n\n.select.is-loading.is-small:after {\n font-size: 0.75rem;\n}\n\n.select.is-loading.is-medium:after {\n font-size: 1.25rem;\n}\n\n.select.is-loading.is-large:after {\n font-size: 1.5rem;\n}\n\n.file {\n -webkit-touch-callout: none;\n -webkit-user-select: none;\n -moz-user-select: none;\n -ms-user-select: none;\n user-select: none;\n align-items: stretch;\n display: flex;\n justify-content: flex-start;\n position: relative;\n}\n\n.file.is-white .file-cta {\n background-color: white;\n border-color: transparent;\n color: #0a0a0a;\n}\n\n.file.is-white:hover .file-cta, .file.is-white.is-hovered .file-cta {\n background-color: #f9f9f9;\n border-color: transparent;\n color: #0a0a0a;\n}\n\n.file.is-white:focus .file-cta, .file.is-white.is-focused .file-cta {\n border-color: transparent;\n box-shadow: 0 0 0.5em rgba(255, 255, 255, 0.25);\n color: #0a0a0a;\n}\n\n.file.is-white:active .file-cta, .file.is-white.is-active .file-cta {\n background-color: #f2f2f2;\n border-color: transparent;\n color: #0a0a0a;\n}\n\n.file.is-black .file-cta {\n background-color: #0a0a0a;\n border-color: transparent;\n color: white;\n}\n\n.file.is-black:hover .file-cta, .file.is-black.is-hovered .file-cta {\n background-color: #040404;\n border-color: transparent;\n color: white;\n}\n\n.file.is-black:focus .file-cta, .file.is-black.is-focused .file-cta {\n border-color: transparent;\n box-shadow: 0 0 0.5em rgba(10, 10, 10, 0.25);\n color: white;\n}\n\n.file.is-black:active .file-cta, .file.is-black.is-active .file-cta {\n background-color: black;\n border-color: transparent;\n color: white;\n}\n\n.file.is-light .file-cta {\n background-color: whitesmoke;\n border-color: transparent;\n color: #363636;\n}\n\n.file.is-light:hover .file-cta, .file.is-light.is-hovered .file-cta {\n background-color: #eeeeee;\n border-color: transparent;\n color: #363636;\n}\n\n.file.is-light:focus .file-cta, .file.is-light.is-focused .file-cta {\n border-color: transparent;\n box-shadow: 0 0 0.5em rgba(245, 245, 245, 0.25);\n color: #363636;\n}\n\n.file.is-light:active .file-cta, .file.is-light.is-active .file-cta {\n background-color: #e8e8e8;\n border-color: transparent;\n color: #363636;\n}\n\n.file.is-dark .file-cta {\n background-color: #363636;\n border-color: transparent;\n color: whitesmoke;\n}\n\n.file.is-dark:hover .file-cta, .file.is-dark.is-hovered .file-cta {\n background-color: #2f2f2f;\n border-color: transparent;\n color: whitesmoke;\n}\n\n.file.is-dark:focus .file-cta, .file.is-dark.is-focused .file-cta {\n border-color: transparent;\n box-shadow: 0 0 0.5em rgba(54, 54, 54, 0.25);\n color: whitesmoke;\n}\n\n.file.is-dark:active .file-cta, .file.is-dark.is-active .file-cta {\n background-color: #292929;\n border-color: transparent;\n color: whitesmoke;\n}\n\n.file.is-primary .file-cta {\n background-color: #00d1b2;\n border-color: transparent;\n color: #fff;\n}\n\n.file.is-primary:hover .file-cta, .file.is-primary.is-hovered .file-cta {\n background-color: #00c4a7;\n border-color: transparent;\n color: #fff;\n}\n\n.file.is-primary:focus .file-cta, .file.is-primary.is-focused .file-cta {\n border-color: transparent;\n box-shadow: 0 0 0.5em rgba(0, 209, 178, 0.25);\n color: #fff;\n}\n\n.file.is-primary:active .file-cta, .file.is-primary.is-active .file-cta {\n background-color: #00b89c;\n border-color: transparent;\n color: #fff;\n}\n\n.file.is-info .file-cta {\n background-color: #3273dc;\n border-color: transparent;\n color: #fff;\n}\n\n.file.is-info:hover .file-cta, .file.is-info.is-hovered .file-cta {\n background-color: #276cda;\n border-color: transparent;\n color: #fff;\n}\n\n.file.is-info:focus .file-cta, .file.is-info.is-focused .file-cta {\n border-color: transparent;\n box-shadow: 0 0 0.5em rgba(50, 115, 220, 0.25);\n color: #fff;\n}\n\n.file.is-info:active .file-cta, .file.is-info.is-active .file-cta {\n background-color: #2366d1;\n border-color: transparent;\n color: #fff;\n}\n\n.file.is-success .file-cta {\n background-color: #23d160;\n border-color: transparent;\n color: #fff;\n}\n\n.file.is-success:hover .file-cta, .file.is-success.is-hovered .file-cta {\n background-color: #22c65b;\n border-color: transparent;\n color: #fff;\n}\n\n.file.is-success:focus .file-cta, .file.is-success.is-focused .file-cta {\n border-color: transparent;\n box-shadow: 0 0 0.5em rgba(35, 209, 96, 0.25);\n color: #fff;\n}\n\n.file.is-success:active .file-cta, .file.is-success.is-active .file-cta {\n background-color: #20bc56;\n border-color: transparent;\n color: #fff;\n}\n\n.file.is-warning .file-cta {\n background-color: #ffdd57;\n border-color: transparent;\n color: rgba(0, 0, 0, 0.7);\n}\n\n.file.is-warning:hover .file-cta, .file.is-warning.is-hovered .file-cta {\n background-color: #ffdb4a;\n border-color: transparent;\n color: rgba(0, 0, 0, 0.7);\n}\n\n.file.is-warning:focus .file-cta, .file.is-warning.is-focused .file-cta {\n border-color: transparent;\n box-shadow: 0 0 0.5em rgba(255, 221, 87, 0.25);\n color: rgba(0, 0, 0, 0.7);\n}\n\n.file.is-warning:active .file-cta, .file.is-warning.is-active .file-cta {\n background-color: #ffd83d;\n border-color: transparent;\n color: rgba(0, 0, 0, 0.7);\n}\n\n.file.is-danger .file-cta {\n background-color: #ff3860;\n border-color: transparent;\n color: #fff;\n}\n\n.file.is-danger:hover .file-cta, .file.is-danger.is-hovered .file-cta {\n background-color: #ff2b56;\n border-color: transparent;\n color: #fff;\n}\n\n.file.is-danger:focus .file-cta, .file.is-danger.is-focused .file-cta {\n border-color: transparent;\n box-shadow: 0 0 0.5em rgba(255, 56, 96, 0.25);\n color: #fff;\n}\n\n.file.is-danger:active .file-cta, .file.is-danger.is-active .file-cta {\n background-color: #ff1f4b;\n border-color: transparent;\n color: #fff;\n}\n\n.file.is-small {\n font-size: 0.75rem;\n}\n\n.file.is-medium {\n font-size: 1.25rem;\n}\n\n.file.is-medium .file-icon .fa {\n font-size: 21px;\n}\n\n.file.is-large {\n font-size: 1.5rem;\n}\n\n.file.is-large .file-icon .fa {\n font-size: 28px;\n}\n\n.file.has-name .file-cta {\n border-bottom-right-radius: 0;\n border-top-right-radius: 0;\n}\n\n.file.has-name .file-name {\n border-bottom-left-radius: 0;\n border-top-left-radius: 0;\n}\n\n.file.is-centered {\n justify-content: center;\n}\n\n.file.is-right {\n justify-content: flex-end;\n}\n\n.file.is-boxed .file-label {\n flex-direction: column;\n}\n\n.file.is-boxed .file-cta {\n flex-direction: column;\n height: auto;\n padding: 1em 3em;\n}\n\n.file.is-boxed .file-name {\n border-width: 0 1px 1px;\n}\n\n.file.is-boxed .file-icon {\n height: 1.5em;\n width: 1.5em;\n}\n\n.file.is-boxed .file-icon .fa {\n font-size: 21px;\n}\n\n.file.is-boxed.is-small .file-icon .fa {\n font-size: 14px;\n}\n\n.file.is-boxed.is-medium .file-icon .fa {\n font-size: 28px;\n}\n\n.file.is-boxed.is-large .file-icon .fa {\n font-size: 35px;\n}\n\n.file.is-boxed.has-name .file-cta {\n border-radius: 3px 3px 0 0;\n}\n\n.file.is-boxed.has-name .file-name {\n border-radius: 0 0 3px 3px;\n border-width: 0 1px 1px;\n}\n\n.file.is-right .file-cta {\n border-radius: 0 3px 3px 0;\n}\n\n.file.is-right .file-name {\n border-radius: 3px 0 0 3px;\n border-width: 1px 0 1px 1px;\n order: -1;\n}\n\n.file.is-fullwidth .file-label {\n width: 100%;\n}\n\n.file.is-fullwidth .file-name {\n flex-grow: 1;\n max-width: none;\n}\n\n.file-label {\n align-items: stretch;\n display: flex;\n cursor: pointer;\n justify-content: flex-start;\n overflow: hidden;\n position: relative;\n}\n\n.file-label:hover .file-cta {\n background-color: #eeeeee;\n color: #363636;\n}\n\n.file-label:hover .file-name {\n border-color: #d5d5d5;\n}\n\n.file-label:active .file-cta {\n background-color: #e8e8e8;\n color: #363636;\n}\n\n.file-label:active .file-name {\n border-color: #cfcfcf;\n}\n\n.file-input {\n height: 0.01em;\n left: 0;\n outline: none;\n position: absolute;\n top: 0;\n width: 0.01em;\n}\n\n.file-cta,\n.file-name {\n -moz-appearance: none;\n -webkit-appearance: none;\n align-items: center;\n border: 1px solid transparent;\n border-radius: 3px;\n box-shadow: none;\n display: inline-flex;\n font-size: 1rem;\n height: 2.25em;\n justify-content: flex-start;\n line-height: 1.5;\n padding-bottom: calc(0.375em - 1px);\n padding-left: calc(0.625em - 1px);\n padding-right: calc(0.625em - 1px);\n padding-top: calc(0.375em - 1px);\n position: relative;\n vertical-align: top;\n border-color: #dbdbdb;\n border-radius: 3px;\n font-size: 1em;\n padding-left: 1em;\n padding-right: 1em;\n white-space: nowrap;\n}\n\n.file-cta:focus, .file-cta.is-focused, .file-cta:active, .file-cta.is-active,\n.file-name:focus,\n.file-name.is-focused,\n.file-name:active,\n.file-name.is-active {\n outline: none;\n}\n\n.file-cta[disabled],\n.file-name[disabled] {\n cursor: not-allowed;\n}\n\n.file-cta {\n background-color: whitesmoke;\n color: #4a4a4a;\n}\n\n.file-name {\n border-color: #dbdbdb;\n border-style: solid;\n border-width: 1px 1px 1px 0;\n display: block;\n max-width: 16em;\n overflow: hidden;\n text-align: left;\n text-overflow: ellipsis;\n}\n\n.file-icon {\n align-items: center;\n display: flex;\n height: 1em;\n justify-content: center;\n margin-right: 0.5em;\n width: 1em;\n}\n\n.file-icon .fa {\n font-size: 14px;\n}\n\n.label {\n color: #363636;\n display: block;\n font-size: 1rem;\n font-weight: 700;\n}\n\n.label:not(:last-child) {\n margin-bottom: 0.5em;\n}\n\n.label.is-small {\n font-size: 0.75rem;\n}\n\n.label.is-medium {\n font-size: 1.25rem;\n}\n\n.label.is-large {\n font-size: 1.5rem;\n}\n\n.help {\n display: block;\n font-size: 0.75rem;\n margin-top: 0.25rem;\n}\n\n.help.is-white {\n color: white;\n}\n\n.help.is-black {\n color: #0a0a0a;\n}\n\n.help.is-light {\n color: whitesmoke;\n}\n\n.help.is-dark {\n color: #363636;\n}\n\n.help.is-primary {\n color: #00d1b2;\n}\n\n.help.is-info {\n color: #3273dc;\n}\n\n.help.is-success {\n color: #23d160;\n}\n\n.help.is-warning {\n color: #ffdd57;\n}\n\n.help.is-danger {\n color: #ff3860;\n}\n\n.field:not(:last-child) {\n margin-bottom: 0.75rem;\n}\n\n.field.has-addons {\n display: flex;\n justify-content: flex-start;\n}\n\n.field.has-addons .control:not(:last-child) {\n margin-right: -1px;\n}\n\n.field.has-addons .control:first-child .button,\n.field.has-addons .control:first-child .input,\n.field.has-addons .control:first-child .select select {\n border-bottom-left-radius: 3px;\n border-top-left-radius: 3px;\n}\n\n.field.has-addons .control:last-child .button,\n.field.has-addons .control:last-child .input,\n.field.has-addons .control:last-child .select select {\n border-bottom-right-radius: 3px;\n border-top-right-radius: 3px;\n}\n\n.field.has-addons .control .button,\n.field.has-addons .control .input,\n.field.has-addons .control .select select {\n border-radius: 0;\n}\n\n.field.has-addons .control .button:hover, .field.has-addons .control .button.is-hovered,\n.field.has-addons .control .input:hover,\n.field.has-addons .control .input.is-hovered,\n.field.has-addons .control .select select:hover,\n.field.has-addons .control .select select.is-hovered {\n z-index: 2;\n}\n\n.field.has-addons .control .button:focus, .field.has-addons .control .button.is-focused, .field.has-addons .control .button:active, .field.has-addons .control .button.is-active,\n.field.has-addons .control .input:focus,\n.field.has-addons .control .input.is-focused,\n.field.has-addons .control .input:active,\n.field.has-addons .control .input.is-active,\n.field.has-addons .control .select select:focus,\n.field.has-addons .control .select select.is-focused,\n.field.has-addons .control .select select:active,\n.field.has-addons .control .select select.is-active {\n z-index: 3;\n}\n\n.field.has-addons .control .button:focus:hover, .field.has-addons .control .button.is-focused:hover, .field.has-addons .control .button:active:hover, .field.has-addons .control .button.is-active:hover,\n.field.has-addons .control .input:focus:hover,\n.field.has-addons .control .input.is-focused:hover,\n.field.has-addons .control .input:active:hover,\n.field.has-addons .control .input.is-active:hover,\n.field.has-addons .control .select select:focus:hover,\n.field.has-addons .control .select select.is-focused:hover,\n.field.has-addons .control .select select:active:hover,\n.field.has-addons .control .select select.is-active:hover {\n z-index: 4;\n}\n\n.field.has-addons .control.is-expanded {\n flex-grow: 1;\n}\n\n.field.has-addons.has-addons-centered {\n justify-content: center;\n}\n\n.field.has-addons.has-addons-right {\n justify-content: flex-end;\n}\n\n.field.has-addons.has-addons-fullwidth .control {\n flex-grow: 1;\n flex-shrink: 0;\n}\n\n.field.is-grouped {\n display: flex;\n justify-content: flex-start;\n}\n\n.field.is-grouped > .control {\n flex-shrink: 0;\n}\n\n.field.is-grouped > .control:not(:last-child) {\n margin-bottom: 0;\n margin-right: 0.75rem;\n}\n\n.field.is-grouped > .control.is-expanded {\n flex-grow: 1;\n flex-shrink: 1;\n}\n\n.field.is-grouped.is-grouped-centered {\n justify-content: center;\n}\n\n.field.is-grouped.is-grouped-right {\n justify-content: flex-end;\n}\n\n.field.is-grouped.is-grouped-multiline {\n flex-wrap: wrap;\n}\n\n.field.is-grouped.is-grouped-multiline > .control:last-child, .field.is-grouped.is-grouped-multiline > .control:not(:last-child) {\n margin-bottom: 0.75rem;\n}\n\n.field.is-grouped.is-grouped-multiline:last-child {\n margin-bottom: -0.75rem;\n}\n\n.field.is-grouped.is-grouped-multiline:not(:last-child) {\n margin-bottom: 0;\n}\n\n@media screen and (min-width: 769px), print {\n .field.is-horizontal {\n display: flex;\n }\n}\n\n.field-label .label {\n font-size: inherit;\n}\n\n@media screen and (max-width: 768px) {\n .field-label {\n margin-bottom: 0.5rem;\n }\n}\n\n@media screen and (min-width: 769px), print {\n .field-label {\n flex-basis: 0;\n flex-grow: 1;\n flex-shrink: 0;\n margin-right: 1.5rem;\n text-align: right;\n }\n .field-label.is-small {\n font-size: 0.75rem;\n padding-top: 0.375em;\n }\n .field-label.is-normal {\n padding-top: 0.375em;\n }\n .field-label.is-medium {\n font-size: 1.25rem;\n padding-top: 0.375em;\n }\n .field-label.is-large {\n font-size: 1.5rem;\n padding-top: 0.375em;\n }\n}\n\n.field-body .field .field {\n margin-bottom: 0;\n}\n\n@media screen and (min-width: 769px), print {\n .field-body {\n display: flex;\n flex-basis: 0;\n flex-grow: 5;\n flex-shrink: 1;\n }\n .field-body .field {\n margin-bottom: 0;\n }\n .field-body > .field {\n flex-shrink: 1;\n }\n .field-body > .field:not(.is-narrow) {\n flex-grow: 1;\n }\n .field-body > .field:not(:last-child) {\n margin-right: 0.75rem;\n }\n}\n\n.control {\n font-size: 1rem;\n position: relative;\n text-align: left;\n}\n\n.control.has-icon .icon {\n color: #dbdbdb;\n height: 2.25em;\n pointer-events: none;\n position: absolute;\n top: 0;\n width: 2.25em;\n z-index: 4;\n}\n\n.control.has-icon .input:focus + .icon {\n color: #7a7a7a;\n}\n\n.control.has-icon .input.is-small + .icon {\n font-size: 0.75rem;\n}\n\n.control.has-icon .input.is-medium + .icon {\n font-size: 1.25rem;\n}\n\n.control.has-icon .input.is-large + .icon {\n font-size: 1.5rem;\n}\n\n.control.has-icon:not(.has-icon-right) .icon {\n left: 0;\n}\n\n.control.has-icon:not(.has-icon-right) .input {\n padding-left: 2.25em;\n}\n\n.control.has-icon.has-icon-right .icon {\n right: 0;\n}\n\n.control.has-icon.has-icon-right .input {\n padding-right: 2.25em;\n}\n\n.control.has-icons-left .input:focus ~ .icon,\n.control.has-icons-left .select:focus ~ .icon, .control.has-icons-right .input:focus ~ .icon,\n.control.has-icons-right .select:focus ~ .icon {\n color: #7a7a7a;\n}\n\n.control.has-icons-left .input.is-small ~ .icon,\n.control.has-icons-left .select.is-small ~ .icon, .control.has-icons-right .input.is-small ~ .icon,\n.control.has-icons-right .select.is-small ~ .icon {\n font-size: 0.75rem;\n}\n\n.control.has-icons-left .input.is-medium ~ .icon,\n.control.has-icons-left .select.is-medium ~ .icon, .control.has-icons-right .input.is-medium ~ .icon,\n.control.has-icons-right .select.is-medium ~ .icon {\n font-size: 1.25rem;\n}\n\n.control.has-icons-left .input.is-large ~ .icon,\n.control.has-icons-left .select.is-large ~ .icon, .control.has-icons-right .input.is-large ~ .icon,\n.control.has-icons-right .select.is-large ~ .icon {\n font-size: 1.5rem;\n}\n\n.control.has-icons-left .icon, .control.has-icons-right .icon {\n color: #dbdbdb;\n height: 2.25em;\n pointer-events: none;\n position: absolute;\n top: 0;\n width: 2.25em;\n z-index: 4;\n}\n\n.control.has-icons-left .input,\n.control.has-icons-left .select select {\n padding-left: 2.25em;\n}\n\n.control.has-icons-left .icon.is-left {\n left: 0;\n}\n\n.control.has-icons-right .input,\n.control.has-icons-right .select select {\n padding-right: 2.25em;\n}\n\n.control.has-icons-right .icon.is-right {\n right: 0;\n}\n\n.control.is-loading::after {\n animation: spinAround 500ms infinite linear;\n border: 2px solid #dbdbdb;\n border-radius: 290486px;\n border-right-color: transparent;\n border-top-color: transparent;\n content: \"\";\n display: block;\n height: 1em;\n position: relative;\n width: 1em;\n position: absolute !important;\n right: 0.625em;\n top: 0.625em;\n}\n\n.control.is-loading.is-small:after {\n font-size: 0.75rem;\n}\n\n.control.is-loading.is-medium:after {\n font-size: 1.25rem;\n}\n\n.control.is-loading.is-large:after {\n font-size: 1.5rem;\n}\n\n.icon {\n align-items: center;\n display: inline-flex;\n justify-content: center;\n height: 1.5rem;\n width: 1.5rem;\n}\n\n.icon .fa {\n font-size: 21px;\n}\n\n.icon.is-small {\n height: 1rem;\n width: 1rem;\n}\n\n.icon.is-small .fa {\n font-size: 14px;\n}\n\n.icon.is-medium {\n height: 2rem;\n width: 2rem;\n}\n\n.icon.is-medium .fa {\n font-size: 28px;\n}\n\n.icon.is-large {\n height: 3rem;\n width: 3rem;\n}\n\n.icon.is-large .fa {\n font-size: 42px;\n}\n\n.image {\n display: block;\n position: relative;\n}\n\n.image img {\n display: block;\n height: auto;\n width: 100%;\n}\n\n.image.is-square img, .image.is-1by1 img, .image.is-4by3 img, .image.is-3by2 img, .image.is-16by9 img, .image.is-2by1 img {\n bottom: 0;\n left: 0;\n position: absolute;\n right: 0;\n top: 0;\n height: 100%;\n width: 100%;\n}\n\n.image.is-square, .image.is-1by1 {\n padding-top: 100%;\n}\n\n.image.is-4by3 {\n padding-top: 75%;\n}\n\n.image.is-3by2 {\n padding-top: 66.6666%;\n}\n\n.image.is-16by9 {\n padding-top: 56.25%;\n}\n\n.image.is-2by1 {\n padding-top: 50%;\n}\n\n.image.is-16x16 {\n height: 16px;\n width: 16px;\n}\n\n.image.is-24x24 {\n height: 24px;\n width: 24px;\n}\n\n.image.is-32x32 {\n height: 32px;\n width: 32px;\n}\n\n.image.is-48x48 {\n height: 48px;\n width: 48px;\n}\n\n.image.is-64x64 {\n height: 64px;\n width: 64px;\n}\n\n.image.is-96x96 {\n height: 96px;\n width: 96px;\n}\n\n.image.is-128x128 {\n height: 128px;\n width: 128px;\n}\n\n.notification {\n background-color: whitesmoke;\n border-radius: 3px;\n padding: 1.25rem 2.5rem 1.25rem 1.5rem;\n position: relative;\n}\n\n.notification:not(:last-child) {\n margin-bottom: 1.5rem;\n}\n\n.notification a:not(.button) {\n color: currentColor;\n text-decoration: underline;\n}\n\n.notification strong {\n color: currentColor;\n}\n\n.notification code,\n.notification pre {\n background: white;\n}\n\n.notification pre code {\n background: transparent;\n}\n\n.notification > .delete {\n position: absolute;\n right: 0.5em;\n top: 0.5em;\n}\n\n.notification .title,\n.notification .subtitle,\n.notification .content {\n color: currentColor;\n}\n\n.notification.is-white {\n background-color: white;\n color: #0a0a0a;\n}\n\n.notification.is-black {\n background-color: #0a0a0a;\n color: white;\n}\n\n.notification.is-light {\n background-color: whitesmoke;\n color: #363636;\n}\n\n.notification.is-dark {\n background-color: #363636;\n color: whitesmoke;\n}\n\n.notification.is-primary {\n background-color: #00d1b2;\n color: #fff;\n}\n\n.notification.is-info {\n background-color: #3273dc;\n color: #fff;\n}\n\n.notification.is-success {\n background-color: #23d160;\n color: #fff;\n}\n\n.notification.is-warning {\n background-color: #ffdd57;\n color: rgba(0, 0, 0, 0.7);\n}\n\n.notification.is-danger {\n background-color: #ff3860;\n color: #fff;\n}\n\n.progress {\n -moz-appearance: none;\n -webkit-appearance: none;\n border: none;\n border-radius: 290486px;\n display: block;\n height: 1rem;\n overflow: hidden;\n padding: 0;\n width: 100%;\n}\n\n.progress:not(:last-child) {\n margin-bottom: 1.5rem;\n}\n\n.progress::-webkit-progress-bar {\n background-color: #dbdbdb;\n}\n\n.progress::-webkit-progress-value {\n background-color: #4a4a4a;\n}\n\n.progress::-moz-progress-bar {\n background-color: #4a4a4a;\n}\n\n.progress.is-white::-webkit-progress-value {\n background-color: white;\n}\n\n.progress.is-white::-moz-progress-bar {\n background-color: white;\n}\n\n.progress.is-black::-webkit-progress-value {\n background-color: #0a0a0a;\n}\n\n.progress.is-black::-moz-progress-bar {\n background-color: #0a0a0a;\n}\n\n.progress.is-light::-webkit-progress-value {\n background-color: whitesmoke;\n}\n\n.progress.is-light::-moz-progress-bar {\n background-color: whitesmoke;\n}\n\n.progress.is-dark::-webkit-progress-value {\n background-color: #363636;\n}\n\n.progress.is-dark::-moz-progress-bar {\n background-color: #363636;\n}\n\n.progress.is-primary::-webkit-progress-value {\n background-color: #00d1b2;\n}\n\n.progress.is-primary::-moz-progress-bar {\n background-color: #00d1b2;\n}\n\n.progress.is-info::-webkit-progress-value {\n background-color: #3273dc;\n}\n\n.progress.is-info::-moz-progress-bar {\n background-color: #3273dc;\n}\n\n.progress.is-success::-webkit-progress-value {\n background-color: #23d160;\n}\n\n.progress.is-success::-moz-progress-bar {\n background-color: #23d160;\n}\n\n.progress.is-warning::-webkit-progress-value {\n background-color: #ffdd57;\n}\n\n.progress.is-warning::-moz-progress-bar {\n background-color: #ffdd57;\n}\n\n.progress.is-danger::-webkit-progress-value {\n background-color: #ff3860;\n}\n\n.progress.is-danger::-moz-progress-bar {\n background-color: #ff3860;\n}\n\n.progress.is-small {\n height: 0.75rem;\n}\n\n.progress.is-medium {\n height: 1.25rem;\n}\n\n.progress.is-large {\n height: 1.5rem;\n}\n\n.table {\n background-color: white;\n color: #363636;\n margin-bottom: 1.5rem;\n}\n\n.table td,\n.table th {\n border: 1px solid #dbdbdb;\n border-width: 0 0 1px;\n padding: 0.5em 0.75em;\n vertical-align: top;\n}\n\n.table td.is-white,\n.table th.is-white {\n background-color: white;\n border-color: white;\n color: #0a0a0a;\n}\n\n.table td.is-black,\n.table th.is-black {\n background-color: #0a0a0a;\n border-color: #0a0a0a;\n color: white;\n}\n\n.table td.is-light,\n.table th.is-light {\n background-color: whitesmoke;\n border-color: whitesmoke;\n color: #363636;\n}\n\n.table td.is-dark,\n.table th.is-dark {\n background-color: #363636;\n border-color: #363636;\n color: whitesmoke;\n}\n\n.table td.is-primary,\n.table th.is-primary {\n background-color: #00d1b2;\n border-color: #00d1b2;\n color: #fff;\n}\n\n.table td.is-info,\n.table th.is-info {\n background-color: #3273dc;\n border-color: #3273dc;\n color: #fff;\n}\n\n.table td.is-success,\n.table th.is-success {\n background-color: #23d160;\n border-color: #23d160;\n color: #fff;\n}\n\n.table td.is-warning,\n.table th.is-warning {\n background-color: #ffdd57;\n border-color: #ffdd57;\n color: rgba(0, 0, 0, 0.7);\n}\n\n.table td.is-danger,\n.table th.is-danger {\n background-color: #ff3860;\n border-color: #ff3860;\n color: #fff;\n}\n\n.table td.is-narrow,\n.table th.is-narrow {\n white-space: nowrap;\n width: 1%;\n}\n\n.table th {\n color: #363636;\n text-align: left;\n}\n\n.table tr:hover {\n background-color: #fafafa;\n}\n\n.table tr.is-selected {\n background-color: #00d1b2;\n color: #fff;\n}\n\n.table tr.is-selected a,\n.table tr.is-selected strong {\n color: currentColor;\n}\n\n.table tr.is-selected td,\n.table tr.is-selected th {\n border-color: #fff;\n color: currentColor;\n}\n\n.table thead td,\n.table thead th {\n border-width: 0 0 2px;\n color: #363636;\n}\n\n.table tfoot td,\n.table tfoot th {\n border-width: 2px 0 0;\n color: #363636;\n}\n\n.table tbody tr:last-child td,\n.table tbody tr:last-child th {\n border-bottom-width: 0;\n}\n\n.table.is-bordered td,\n.table.is-bordered th {\n border-width: 1px;\n}\n\n.table.is-bordered tr:last-child td,\n.table.is-bordered tr:last-child th {\n border-bottom-width: 1px;\n}\n\n.table.is-fullwidth {\n width: 100%;\n}\n\n.table.is-narrow td,\n.table.is-narrow th {\n padding: 0.25em 0.5em;\n}\n\n.table.is-striped tbody tr:not(.is-selected):nth-child(even) {\n background-color: #fafafa;\n}\n\n.table.is-striped tbody tr:not(.is-selected):nth-child(even):hover {\n background-color: whitesmoke;\n}\n\n.tags {\n align-items: center;\n display: flex;\n flex-wrap: wrap;\n justify-content: flex-start;\n}\n\n.tags .tag {\n margin-bottom: 0.5rem;\n}\n\n.tags .tag:not(:last-child) {\n margin-right: 0.5rem;\n}\n\n.tags:last-child {\n margin-bottom: -0.5rem;\n}\n\n.tags:not(:last-child) {\n margin-bottom: 1rem;\n}\n\n.tags.has-addons .tag {\n margin-right: 0;\n}\n\n.tags.has-addons .tag:not(:first-child) {\n border-bottom-left-radius: 0;\n border-top-left-radius: 0;\n}\n\n.tags.has-addons .tag:not(:last-child) {\n border-bottom-right-radius: 0;\n border-top-right-radius: 0;\n}\n\n.tag {\n align-items: center;\n background-color: whitesmoke;\n border-radius: 3px;\n color: #4a4a4a;\n display: inline-flex;\n font-size: 0.75rem;\n height: 2em;\n justify-content: center;\n line-height: 1.5;\n padding-left: 0.75em;\n padding-right: 0.75em;\n white-space: nowrap;\n}\n\n.tag .delete {\n margin-left: 0.25em;\n margin-right: -0.375em;\n}\n\n.tag.is-white {\n background-color: white;\n color: #0a0a0a;\n}\n\n.tag.is-black {\n background-color: #0a0a0a;\n color: white;\n}\n\n.tag.is-light {\n background-color: whitesmoke;\n color: #363636;\n}\n\n.tag.is-dark {\n background-color: #363636;\n color: whitesmoke;\n}\n\n.tag.is-primary {\n background-color: #00d1b2;\n color: #fff;\n}\n\n.tag.is-info {\n background-color: #3273dc;\n color: #fff;\n}\n\n.tag.is-success {\n background-color: #23d160;\n color: #fff;\n}\n\n.tag.is-warning {\n background-color: #ffdd57;\n color: rgba(0, 0, 0, 0.7);\n}\n\n.tag.is-danger {\n background-color: #ff3860;\n color: #fff;\n}\n\n.tag.is-medium {\n font-size: 1rem;\n}\n\n.tag.is-large {\n font-size: 1.25rem;\n}\n\n.tag.is-delete {\n margin-left: 1px;\n padding: 0;\n position: relative;\n width: 2em;\n}\n\n.tag.is-delete:before, .tag.is-delete:after {\n background-color: currentColor;\n content: \"\";\n display: block;\n left: 50%;\n position: absolute;\n top: 50%;\n transform: translateX(-50%) translateY(-50%) rotate(45deg);\n transform-origin: center center;\n}\n\n.tag.is-delete:before {\n height: 1px;\n width: 50%;\n}\n\n.tag.is-delete:after {\n height: 50%;\n width: 1px;\n}\n\n.tag.is-delete:hover, .tag.is-delete:focus {\n background-color: #e8e8e8;\n}\n\n.tag.is-delete:active {\n background-color: #dbdbdb;\n}\n\n.tag.is-rounded {\n border-radius: 290486px;\n}\n\na.tag:hover {\n text-decoration: underline;\n}\n\n.title,\n.subtitle {\n word-break: break-word;\n}\n\n.title:not(:last-child),\n.subtitle:not(:last-child) {\n margin-bottom: 1.5rem;\n}\n\n.title em,\n.title span,\n.subtitle em,\n.subtitle span {\n font-weight: inherit;\n}\n\n.title .tag,\n.subtitle .tag {\n vertical-align: middle;\n}\n\n.title {\n color: #363636;\n font-size: 2rem;\n font-weight: 600;\n line-height: 1.125;\n}\n\n.title strong {\n color: inherit;\n font-weight: inherit;\n}\n\n.title + .highlight {\n margin-top: -0.75rem;\n}\n\n.title:not(.is-spaced) + .subtitle {\n margin-top: -1.5rem;\n}\n\n.title.is-1 {\n font-size: 3rem;\n}\n\n.title.is-2 {\n font-size: 2.5rem;\n}\n\n.title.is-3 {\n font-size: 2rem;\n}\n\n.title.is-4 {\n font-size: 1.5rem;\n}\n\n.title.is-5 {\n font-size: 1.25rem;\n}\n\n.title.is-6 {\n font-size: 1rem;\n}\n\n.title.is-7 {\n font-size: 0.75rem;\n}\n\n.subtitle {\n color: #4a4a4a;\n font-size: 1.25rem;\n font-weight: 400;\n line-height: 1.25;\n}\n\n.subtitle strong {\n color: #363636;\n font-weight: 600;\n}\n\n.subtitle:not(.is-spaced) + .title {\n margin-top: -1.5rem;\n}\n\n.subtitle.is-1 {\n font-size: 3rem;\n}\n\n.subtitle.is-2 {\n font-size: 2.5rem;\n}\n\n.subtitle.is-3 {\n font-size: 2rem;\n}\n\n.subtitle.is-4 {\n font-size: 1.5rem;\n}\n\n.subtitle.is-5 {\n font-size: 1.25rem;\n}\n\n.subtitle.is-6 {\n font-size: 1rem;\n}\n\n.subtitle.is-7 {\n font-size: 0.75rem;\n}\n\n.block:not(:last-child) {\n margin-bottom: 1.5rem;\n}\n\n.delete {\n -webkit-touch-callout: none;\n -webkit-user-select: none;\n -moz-user-select: none;\n -ms-user-select: none;\n user-select: none;\n -moz-appearance: none;\n -webkit-appearance: none;\n background-color: rgba(10, 10, 10, 0.2);\n border: none;\n border-radius: 290486px;\n cursor: pointer;\n display: inline-block;\n flex-grow: 0;\n flex-shrink: 0;\n font-size: 1rem;\n height: 20px;\n max-height: 20px;\n max-width: 20px;\n min-height: 20px;\n min-width: 20px;\n outline: none;\n position: relative;\n vertical-align: top;\n width: 20px;\n}\n\n.delete:before, .delete:after {\n background-color: white;\n content: \"\";\n display: block;\n left: 50%;\n position: absolute;\n top: 50%;\n transform: translateX(-50%) translateY(-50%) rotate(45deg);\n transform-origin: center center;\n}\n\n.delete:before {\n height: 2px;\n width: 50%;\n}\n\n.delete:after {\n height: 50%;\n width: 2px;\n}\n\n.delete:hover, .delete:focus {\n background-color: rgba(10, 10, 10, 0.3);\n}\n\n.delete:active {\n background-color: rgba(10, 10, 10, 0.4);\n}\n\n.delete.is-small {\n height: 16px;\n max-height: 16px;\n max-width: 16px;\n min-height: 16px;\n min-width: 16px;\n width: 16px;\n}\n\n.delete.is-medium {\n height: 24px;\n max-height: 24px;\n max-width: 24px;\n min-height: 24px;\n min-width: 24px;\n width: 24px;\n}\n\n.delete.is-large {\n height: 32px;\n max-height: 32px;\n max-width: 32px;\n min-height: 32px;\n min-width: 32px;\n width: 32px;\n}\n\n.fa {\n font-size: 21px;\n text-align: center;\n vertical-align: top;\n}\n\n.heading {\n display: block;\n font-size: 11px;\n letter-spacing: 1px;\n margin-bottom: 5px;\n text-transform: uppercase;\n}\n\n.highlight {\n font-weight: 400;\n max-width: 100%;\n overflow: hidden;\n padding: 0;\n}\n\n.highlight:not(:last-child) {\n margin-bottom: 1.5rem;\n}\n\n.highlight pre {\n overflow: auto;\n max-width: 100%;\n}\n\n.loader {\n animation: spinAround 500ms infinite linear;\n border: 2px solid #dbdbdb;\n border-radius: 290486px;\n border-right-color: transparent;\n border-top-color: transparent;\n content: \"\";\n display: block;\n height: 1em;\n position: relative;\n width: 1em;\n}\n\n.number {\n align-items: center;\n background-color: whitesmoke;\n border-radius: 290486px;\n display: inline-flex;\n font-size: 1.25rem;\n height: 2em;\n justify-content: center;\n margin-right: 1.5rem;\n min-width: 2.5em;\n padding: 0.25rem 0.5rem;\n text-align: center;\n vertical-align: top;\n}\n\n.breadcrumb {\n -webkit-touch-callout: none;\n -webkit-user-select: none;\n -moz-user-select: none;\n -ms-user-select: none;\n user-select: none;\n align-items: stretch;\n display: flex;\n font-size: 1rem;\n overflow: hidden;\n overflow-x: auto;\n white-space: nowrap;\n}\n\n.breadcrumb:not(:last-child) {\n margin-bottom: 1.5rem;\n}\n\n.breadcrumb a {\n align-items: center;\n color: #7a7a7a;\n display: flex;\n justify-content: center;\n padding: 0.5em 0.75em;\n}\n\n.breadcrumb a:hover {\n color: #363636;\n}\n\n.breadcrumb li {\n align-items: center;\n display: flex;\n}\n\n.breadcrumb li.is-active a {\n color: #363636;\n cursor: default;\n pointer-events: none;\n}\n\n.breadcrumb li + li::before {\n color: #4a4a4a;\n content: \"\\0002f\";\n}\n\n.breadcrumb ul, .breadcrumb ol {\n align-items: center;\n display: flex;\n flex-grow: 1;\n flex-shrink: 0;\n justify-content: flex-start;\n}\n\n.breadcrumb .icon:first-child {\n margin-right: 0.5em;\n}\n\n.breadcrumb .icon:last-child {\n margin-left: 0.5em;\n}\n\n.breadcrumb.is-centered ol, .breadcrumb.is-centered ul {\n justify-content: center;\n}\n\n.breadcrumb.is-right ol, .breadcrumb.is-right ul {\n justify-content: flex-end;\n}\n\n.breadcrumb.is-small {\n font-size: 0.75rem;\n}\n\n.breadcrumb.is-medium {\n font-size: 1.25rem;\n}\n\n.breadcrumb.is-large {\n font-size: 1.5rem;\n}\n\n.breadcrumb.has-arrow-separator li + li::before {\n content: \"\\02192\";\n}\n\n.breadcrumb.has-bullet-separator li + li::before {\n content: \"\\02022\";\n}\n\n.breadcrumb.has-dot-separator li + li::before {\n content: \"\\000b7\";\n}\n\n.breadcrumb.has-succeeds-separator li + li::before {\n content: \"\\0227B\";\n}\n\n.card {\n background-color: white;\n box-shadow: 0 2px 3px rgba(10, 10, 10, 0.1), 0 0 0 1px rgba(10, 10, 10, 0.1);\n color: #4a4a4a;\n max-width: 100%;\n position: relative;\n}\n\n.card-header {\n align-items: stretch;\n box-shadow: 0 1px 2px rgba(10, 10, 10, 0.1);\n display: flex;\n}\n\n.card-header-title {\n align-items: center;\n color: #363636;\n display: flex;\n flex-grow: 1;\n font-weight: 700;\n padding: 0.75rem;\n}\n\n.card-header-icon {\n align-items: center;\n cursor: pointer;\n display: flex;\n justify-content: center;\n padding: 0.75rem;\n}\n\n.card-image {\n display: block;\n position: relative;\n}\n\n.card-content {\n padding: 1.5rem;\n}\n\n.card-footer {\n border-top: 1px solid #dbdbdb;\n align-items: stretch;\n display: flex;\n}\n\n.card-footer-item {\n align-items: center;\n display: flex;\n flex-basis: 0;\n flex-grow: 1;\n flex-shrink: 0;\n justify-content: center;\n padding: 0.75rem;\n}\n\n.card-footer-item:not(:last-child) {\n border-right: 1px solid #dbdbdb;\n}\n\n.card .media:not(:last-child) {\n margin-bottom: 0.75rem;\n}\n\n.dropdown {\n display: inline-flex;\n position: relative;\n vertical-align: top;\n}\n\n.dropdown.is-active .dropdown-menu, .dropdown.is-hoverable:hover .dropdown-menu {\n display: block;\n}\n\n.dropdown.is-right .dropdown-menu {\n left: auto;\n right: 0;\n}\n\n.dropdown-menu {\n display: none;\n left: 0;\n min-width: 12rem;\n padding-top: 4px;\n position: absolute;\n top: 100%;\n z-index: 20;\n}\n\n.dropdown-content {\n background-color: white;\n border-radius: 3px;\n box-shadow: 0 2px 3px rgba(10, 10, 10, 0.1), 0 0 0 1px rgba(10, 10, 10, 0.1);\n padding-bottom: 0.5rem;\n padding-top: 0.5rem;\n}\n\n.dropdown-item {\n color: #4a4a4a;\n display: block;\n font-size: 0.875rem;\n line-height: 1.5;\n padding: 0.375rem 1rem;\n position: relative;\n}\n\na.dropdown-item {\n padding-right: 3rem;\n white-space: nowrap;\n}\n\na.dropdown-item:hover {\n background-color: whitesmoke;\n color: #0a0a0a;\n}\n\na.dropdown-item.is-active {\n background-color: #00d1b2;\n color: #fff;\n}\n\n.dropdown-divider {\n background-color: #dbdbdb;\n border: none;\n display: block;\n height: 1px;\n margin: 0.5rem 0;\n}\n\n.level {\n align-items: center;\n justify-content: space-between;\n}\n\n.level:not(:last-child) {\n margin-bottom: 1.5rem;\n}\n\n.level code {\n border-radius: 3px;\n}\n\n.level img {\n display: inline-block;\n vertical-align: top;\n}\n\n.level.is-mobile {\n display: flex;\n}\n\n.level.is-mobile .level-left,\n.level.is-mobile .level-right {\n display: flex;\n}\n\n.level.is-mobile .level-left + .level-right {\n margin-top: 0;\n}\n\n.level.is-mobile .level-item:not(:last-child) {\n margin-bottom: 0;\n}\n\n.level.is-mobile .level-item:not(.is-narrow) {\n flex-grow: 1;\n}\n\n@media screen and (min-width: 769px), print {\n .level {\n display: flex;\n }\n .level > .level-item:not(.is-narrow) {\n flex-grow: 1;\n }\n}\n\n.level-item {\n align-items: center;\n display: flex;\n flex-basis: auto;\n flex-grow: 0;\n flex-shrink: 0;\n justify-content: center;\n}\n\n.level-item .title,\n.level-item .subtitle {\n margin-bottom: 0;\n}\n\n@media screen and (max-width: 768px) {\n .level-item:not(:last-child) {\n margin-bottom: 0.75rem;\n }\n}\n\n.level-left,\n.level-right {\n flex-basis: auto;\n flex-grow: 0;\n flex-shrink: 0;\n}\n\n.level-left .level-item:not(:last-child),\n.level-right .level-item:not(:last-child) {\n margin-right: 0.75rem;\n}\n\n.level-left .level-item.is-flexible,\n.level-right .level-item.is-flexible {\n flex-grow: 1;\n}\n\n.level-left {\n align-items: center;\n justify-content: flex-start;\n}\n\n@media screen and (max-width: 768px) {\n .level-left + .level-right {\n margin-top: 1.5rem;\n }\n}\n\n@media screen and (min-width: 769px), print {\n .level-left {\n display: flex;\n }\n}\n\n.level-right {\n align-items: center;\n justify-content: flex-end;\n}\n\n@media screen and (min-width: 769px), print {\n .level-right {\n display: flex;\n }\n}\n\n.media {\n align-items: flex-start;\n display: flex;\n text-align: left;\n}\n\n.media .content:not(:last-child) {\n margin-bottom: 0.75rem;\n}\n\n.media .media {\n border-top: 1px solid rgba(219, 219, 219, 0.5);\n display: flex;\n padding-top: 0.75rem;\n}\n\n.media .media .content:not(:last-child),\n.media .media .control:not(:last-child) {\n margin-bottom: 0.5rem;\n}\n\n.media .media .media {\n padding-top: 0.5rem;\n}\n\n.media .media .media + .media {\n margin-top: 0.5rem;\n}\n\n.media + .media {\n border-top: 1px solid rgba(219, 219, 219, 0.5);\n margin-top: 1rem;\n padding-top: 1rem;\n}\n\n.media.is-large + .media {\n margin-top: 1.5rem;\n padding-top: 1.5rem;\n}\n\n.media-left,\n.media-right {\n flex-basis: auto;\n flex-grow: 0;\n flex-shrink: 0;\n}\n\n.media-left {\n margin-right: 1rem;\n}\n\n.media-right {\n margin-left: 1rem;\n}\n\n.media-content {\n flex-basis: auto;\n flex-grow: 1;\n flex-shrink: 1;\n text-align: left;\n}\n\n.menu {\n font-size: 1rem;\n}\n\n.menu.is-small {\n font-size: 0.75rem;\n}\n\n.menu.is-medium {\n font-size: 1.25rem;\n}\n\n.menu.is-large {\n font-size: 1.5rem;\n}\n\n.menu-list {\n line-height: 1.25;\n}\n\n.menu-list a {\n border-radius: 2px;\n color: #4a4a4a;\n display: block;\n padding: 0.5em 0.75em;\n}\n\n.menu-list a:hover {\n background-color: whitesmoke;\n color: #363636;\n}\n\n.menu-list a.is-active {\n background-color: #00d1b2;\n color: #fff;\n}\n\n.menu-list li ul {\n border-left: 1px solid #dbdbdb;\n margin: 0.75em;\n padding-left: 0.75em;\n}\n\n.menu-label {\n color: #7a7a7a;\n font-size: 0.75em;\n letter-spacing: 0.1em;\n text-transform: uppercase;\n}\n\n.menu-label:not(:first-child) {\n margin-top: 1em;\n}\n\n.menu-label:not(:last-child) {\n margin-bottom: 1em;\n}\n\n.message {\n background-color: whitesmoke;\n border-radius: 3px;\n font-size: 1rem;\n}\n\n.message:not(:last-child) {\n margin-bottom: 1.5rem;\n}\n\n.message.is-small {\n font-size: 0.75rem;\n}\n\n.message.is-medium {\n font-size: 1.25rem;\n}\n\n.message.is-large {\n font-size: 1.5rem;\n}\n\n.message.is-white {\n background-color: white;\n}\n\n.message.is-white .message-header {\n background-color: white;\n color: #0a0a0a;\n}\n\n.message.is-white .message-body {\n border-color: white;\n color: #4d4d4d;\n}\n\n.message.is-black {\n background-color: #fafafa;\n}\n\n.message.is-black .message-header {\n background-color: #0a0a0a;\n color: white;\n}\n\n.message.is-black .message-body {\n border-color: #0a0a0a;\n color: #090909;\n}\n\n.message.is-light {\n background-color: #fafafa;\n}\n\n.message.is-light .message-header {\n background-color: whitesmoke;\n color: #363636;\n}\n\n.message.is-light .message-body {\n border-color: whitesmoke;\n color: #505050;\n}\n\n.message.is-dark {\n background-color: #fafafa;\n}\n\n.message.is-dark .message-header {\n background-color: #363636;\n color: whitesmoke;\n}\n\n.message.is-dark .message-body {\n border-color: #363636;\n color: #2a2a2a;\n}\n\n.message.is-primary {\n background-color: #f5fffd;\n}\n\n.message.is-primary .message-header {\n background-color: #00d1b2;\n color: #fff;\n}\n\n.message.is-primary .message-body {\n border-color: #00d1b2;\n color: #021310;\n}\n\n.message.is-info {\n background-color: #f6f9fe;\n}\n\n.message.is-info .message-header {\n background-color: #3273dc;\n color: #fff;\n}\n\n.message.is-info .message-body {\n border-color: #3273dc;\n color: #22509a;\n}\n\n.message.is-success {\n background-color: #f6fef9;\n}\n\n.message.is-success .message-header {\n background-color: #23d160;\n color: #fff;\n}\n\n.message.is-success .message-body {\n border-color: #23d160;\n color: #0e301a;\n}\n\n.message.is-warning {\n background-color: #fffdf5;\n}\n\n.message.is-warning .message-header {\n background-color: #ffdd57;\n color: rgba(0, 0, 0, 0.7);\n}\n\n.message.is-warning .message-body {\n border-color: #ffdd57;\n color: #3b3108;\n}\n\n.message.is-danger {\n background-color: #fff5f7;\n}\n\n.message.is-danger .message-header {\n background-color: #ff3860;\n color: #fff;\n}\n\n.message.is-danger .message-body {\n border-color: #ff3860;\n color: #cd0930;\n}\n\n.message-header {\n align-items: center;\n background-color: #4a4a4a;\n border-radius: 3px 3px 0 0;\n color: #fff;\n display: flex;\n justify-content: space-between;\n line-height: 1.25;\n padding: 0.5em 0.75em;\n position: relative;\n}\n\n.message-header a:not(.button),\n.message-header strong {\n color: currentColor;\n}\n\n.message-header a:not(.button) {\n text-decoration: underline;\n}\n\n.message-header .delete {\n flex-grow: 0;\n flex-shrink: 0;\n margin-left: 0.75em;\n}\n\n.message-header + .message-body {\n border-top-left-radius: 0;\n border-top-right-radius: 0;\n border-top: none;\n}\n\n.message-body {\n border: 1px solid #dbdbdb;\n border-radius: 3px;\n color: #4a4a4a;\n padding: 1em 1.25em;\n}\n\n.message-body a:not(.button),\n.message-body strong {\n color: currentColor;\n}\n\n.message-body a:not(.button) {\n text-decoration: underline;\n}\n\n.message-body code,\n.message-body pre {\n background-color: white;\n}\n\n.message-body pre code {\n background-color: transparent;\n}\n\n.modal {\n bottom: 0;\n left: 0;\n position: absolute;\n right: 0;\n top: 0;\n align-items: center;\n display: none;\n justify-content: center;\n overflow: hidden;\n position: fixed;\n z-index: 20;\n}\n\n.modal.is-active {\n display: flex;\n}\n\n.modal-background {\n bottom: 0;\n left: 0;\n position: absolute;\n right: 0;\n top: 0;\n background-color: rgba(10, 10, 10, 0.86);\n}\n\n.modal-content,\n.modal-card {\n margin: 0 20px;\n max-height: calc(100vh - 160px);\n overflow: auto;\n position: relative;\n width: 100%;\n}\n\n@media screen and (min-width: 769px), print {\n .modal-content,\n .modal-card {\n margin: 0 auto;\n max-height: calc(100vh - 40px);\n width: 640px;\n }\n}\n\n.modal-close {\n -webkit-touch-callout: none;\n -webkit-user-select: none;\n -moz-user-select: none;\n -ms-user-select: none;\n user-select: none;\n -moz-appearance: none;\n -webkit-appearance: none;\n background-color: rgba(10, 10, 10, 0.2);\n border: none;\n border-radius: 290486px;\n cursor: pointer;\n display: inline-block;\n flex-grow: 0;\n flex-shrink: 0;\n font-size: 1rem;\n height: 20px;\n max-height: 20px;\n max-width: 20px;\n min-height: 20px;\n min-width: 20px;\n outline: none;\n position: relative;\n vertical-align: top;\n width: 20px;\n background: none;\n height: 40px;\n position: fixed;\n right: 20px;\n top: 20px;\n width: 40px;\n}\n\n.modal-close:before, .modal-close:after {\n background-color: white;\n content: \"\";\n display: block;\n left: 50%;\n position: absolute;\n top: 50%;\n transform: translateX(-50%) translateY(-50%) rotate(45deg);\n transform-origin: center center;\n}\n\n.modal-close:before {\n height: 2px;\n width: 50%;\n}\n\n.modal-close:after {\n height: 50%;\n width: 2px;\n}\n\n.modal-close:hover, .modal-close:focus {\n background-color: rgba(10, 10, 10, 0.3);\n}\n\n.modal-close:active {\n background-color: rgba(10, 10, 10, 0.4);\n}\n\n.modal-close.is-small {\n height: 16px;\n max-height: 16px;\n max-width: 16px;\n min-height: 16px;\n min-width: 16px;\n width: 16px;\n}\n\n.modal-close.is-medium {\n height: 24px;\n max-height: 24px;\n max-width: 24px;\n min-height: 24px;\n min-width: 24px;\n width: 24px;\n}\n\n.modal-close.is-large {\n height: 32px;\n max-height: 32px;\n max-width: 32px;\n min-height: 32px;\n min-width: 32px;\n width: 32px;\n}\n\n.modal-card {\n display: flex;\n flex-direction: column;\n max-height: calc(100vh - 40px);\n overflow: hidden;\n}\n\n.modal-card-head,\n.modal-card-foot {\n align-items: center;\n background-color: whitesmoke;\n display: flex;\n flex-shrink: 0;\n justify-content: flex-start;\n padding: 20px;\n position: relative;\n}\n\n.modal-card-head {\n border-bottom: 1px solid #dbdbdb;\n border-top-left-radius: 5px;\n border-top-right-radius: 5px;\n}\n\n.modal-card-title {\n color: #363636;\n flex-grow: 1;\n flex-shrink: 0;\n font-size: 1.5rem;\n line-height: 1;\n}\n\n.modal-card-foot {\n border-bottom-left-radius: 5px;\n border-bottom-right-radius: 5px;\n border-top: 1px solid #dbdbdb;\n}\n\n.modal-card-foot .button:not(:last-child) {\n margin-right: 10px;\n}\n\n.modal-card-body {\n -webkit-overflow-scrolling: touch;\n background-color: white;\n flex-grow: 1;\n flex-shrink: 1;\n overflow: auto;\n padding: 20px;\n}\n\n.nav-toggle {\n cursor: pointer;\n display: block;\n height: 3.25rem;\n position: relative;\n width: 3.25rem;\n}\n\n.nav-toggle span {\n background-color: #4a4a4a;\n display: block;\n height: 1px;\n left: 50%;\n margin-left: -7px;\n position: absolute;\n top: 50%;\n transition: none 86ms ease-out;\n transition-property: background, left, opacity, transform;\n width: 15px;\n}\n\n.nav-toggle span:nth-child(1) {\n margin-top: -6px;\n}\n\n.nav-toggle span:nth-child(2) {\n margin-top: -1px;\n}\n\n.nav-toggle span:nth-child(3) {\n margin-top: 4px;\n}\n\n.nav-toggle:hover {\n background-color: whitesmoke;\n}\n\n.nav-toggle.is-active span {\n background-color: #00d1b2;\n}\n\n.nav-toggle.is-active span:nth-child(1) {\n margin-left: -5px;\n transform: rotate(45deg);\n transform-origin: left top;\n}\n\n.nav-toggle.is-active span:nth-child(2) {\n opacity: 0;\n}\n\n.nav-toggle.is-active span:nth-child(3) {\n margin-left: -5px;\n transform: rotate(-45deg);\n transform-origin: left bottom;\n}\n\n@media screen and (min-width: 769px), print {\n .nav-toggle {\n display: none;\n }\n}\n\n.nav-item {\n align-items: center;\n display: flex;\n flex-grow: 0;\n flex-shrink: 0;\n font-size: 1rem;\n justify-content: center;\n line-height: 1.5;\n padding: 0.5rem 0.75rem;\n}\n\n.nav-item a {\n flex-grow: 1;\n flex-shrink: 0;\n}\n\n.nav-item img {\n max-height: 1.75rem;\n}\n\n.nav-item .tag:first-child:not(:last-child) {\n margin-right: 0.5rem;\n}\n\n.nav-item .tag:last-child:not(:first-child) {\n margin-left: 0.5rem;\n}\n\n@media screen and (max-width: 768px) {\n .nav-item {\n justify-content: flex-start;\n }\n}\n\n.nav-item a:not(.button),\na.nav-item:not(.button) {\n color: #7a7a7a;\n}\n\n.nav-item a:not(.button):hover,\na.nav-item:not(.button):hover {\n color: #363636;\n}\n\n.nav-item a:not(.button).is-active,\na.nav-item:not(.button).is-active {\n color: #363636;\n}\n\n.nav-item a:not(.button).is-tab,\na.nav-item:not(.button).is-tab {\n border-bottom: 1px solid transparent;\n border-top: 1px solid transparent;\n padding-bottom: calc(0.75rem - 1px);\n padding-left: 1rem;\n padding-right: 1rem;\n padding-top: calc(0.75rem - 1px);\n}\n\n.nav-item a:not(.button).is-tab:hover,\na.nav-item:not(.button).is-tab:hover {\n border-bottom-color: #00d1b2;\n border-top-color: transparent;\n}\n\n.nav-item a:not(.button).is-tab.is-active,\na.nav-item:not(.button).is-tab.is-active {\n border-bottom: 3px solid #00d1b2;\n color: #00d1b2;\n padding-bottom: calc(0.75rem - 3px);\n}\n\n@media screen and (min-width: 1008px) {\n .nav-item a:not(.button).is-brand,\n a.nav-item:not(.button).is-brand {\n padding-left: 0;\n }\n}\n\n.nav-left,\n.nav-right {\n -webkit-overflow-scrolling: touch;\n align-items: stretch;\n display: flex;\n flex-grow: 1;\n flex-shrink: 0;\n max-width: 100%;\n overflow: auto;\n}\n\n@media screen and (min-width: 1200px) {\n .nav-left,\n .nav-right {\n flex-basis: 0;\n }\n}\n\n.nav-left {\n justify-content: flex-start;\n white-space: nowrap;\n}\n\n.nav-right {\n justify-content: flex-end;\n}\n\n.nav-center {\n align-items: stretch;\n display: flex;\n flex-grow: 0;\n flex-shrink: 0;\n justify-content: center;\n margin-left: auto;\n margin-right: auto;\n}\n\n@media screen and (max-width: 768px) {\n .nav-menu.nav-right {\n background-color: white;\n box-shadow: 0 4px 7px rgba(10, 10, 10, 0.1);\n left: 0;\n display: none;\n right: 0;\n top: 100%;\n position: absolute;\n }\n .nav-menu.nav-right .nav-item {\n border-top: 1px solid rgba(219, 219, 219, 0.5);\n padding: 0.75rem;\n }\n .nav-menu.nav-right.is-active {\n display: block;\n }\n}\n\n.nav {\n align-items: stretch;\n background-color: white;\n display: flex;\n height: 3.25rem;\n position: relative;\n text-align: center;\n z-index: 10;\n}\n\n.nav > .container {\n align-items: stretch;\n display: flex;\n min-height: 3.25rem;\n width: 100%;\n}\n\n.nav.has-shadow {\n box-shadow: 0 2px 3px rgba(10, 10, 10, 0.1);\n}\n\n.navbar {\n background-color: white;\n min-height: 3.25rem;\n position: relative;\n}\n\n.navbar > .container {\n align-items: stretch;\n display: flex;\n min-height: 3.25rem;\n width: 100%;\n}\n\n.navbar.has-shadow {\n box-shadow: 0 2px 3px rgba(10, 10, 10, 0.1);\n}\n\n.navbar-brand {\n -webkit-overflow-scrolling: touch;\n align-items: stretch;\n display: flex;\n flex-shrink: 0;\n max-width: 100vw;\n min-height: 3.25rem;\n overflow-x: auto;\n overflow-y: hidden;\n}\n\n.navbar-burger {\n cursor: pointer;\n display: block;\n height: 3.25rem;\n position: relative;\n width: 3.25rem;\n margin-left: auto;\n}\n\n.navbar-burger span {\n background-color: #4a4a4a;\n display: block;\n height: 1px;\n left: 50%;\n margin-left: -7px;\n position: absolute;\n top: 50%;\n transition: none 86ms ease-out;\n transition-property: background, left, opacity, transform;\n width: 15px;\n}\n\n.navbar-burger span:nth-child(1) {\n margin-top: -6px;\n}\n\n.navbar-burger span:nth-child(2) {\n margin-top: -1px;\n}\n\n.navbar-burger span:nth-child(3) {\n margin-top: 4px;\n}\n\n.navbar-burger:hover {\n background-color: whitesmoke;\n}\n\n.navbar-burger.is-active span {\n background-color: #00d1b2;\n}\n\n.navbar-burger.is-active span:nth-child(1) {\n margin-left: -5px;\n transform: rotate(45deg);\n transform-origin: left top;\n}\n\n.navbar-burger.is-active span:nth-child(2) {\n opacity: 0;\n}\n\n.navbar-burger.is-active span:nth-child(3) {\n margin-left: -5px;\n transform: rotate(-45deg);\n transform-origin: left bottom;\n}\n\n.navbar-menu {\n display: none;\n}\n\n.navbar-item,\n.navbar-link {\n color: #4a4a4a;\n display: block;\n line-height: 1.5;\n padding: 0.5rem 1rem;\n position: relative;\n}\n\na.navbar-item:hover, a.navbar-item.is-active,\n.navbar-link:hover,\n.navbar-link.is-active {\n background-color: whitesmoke;\n color: #0a0a0a;\n}\n\n.navbar-item {\n flex-grow: 0;\n flex-shrink: 0;\n}\n\n.navbar-item img {\n max-height: 1.75rem;\n}\n\n.navbar-item.has-dropdown {\n padding: 0;\n}\n\n.navbar-item.is-tab {\n border-bottom: 1px solid transparent;\n min-height: 3.25rem;\n padding-bottom: calc(0.5rem - 1px);\n}\n\n.navbar-item.is-tab:hover {\n background-color: transparent;\n border-bottom-color: #00d1b2;\n}\n\n.navbar-item.is-tab.is-active {\n background-color: transparent;\n border-bottom-color: #00d1b2;\n border-bottom-style: solid;\n border-bottom-width: 3px;\n color: #00d1b2;\n padding-bottom: calc(0.5rem - 3px);\n}\n\n.navbar-content {\n flex-grow: 1;\n flex-shrink: 1;\n}\n\n.navbar-link {\n padding-right: 2.5em;\n}\n\n.navbar-dropdown {\n font-size: 0.875rem;\n padding-bottom: 0.5rem;\n padding-top: 0.5rem;\n}\n\n.navbar-dropdown .navbar-item {\n padding-left: 1.5rem;\n padding-right: 1.5rem;\n}\n\n.navbar-divider {\n background-color: #dbdbdb;\n border: none;\n display: none;\n height: 1px;\n margin: 0.5rem 0;\n}\n\n@media screen and (max-width: 1007px) {\n .navbar > .container {\n display: block;\n }\n .navbar-brand .navbar-item {\n align-items: center;\n display: flex;\n }\n .navbar-menu {\n box-shadow: 0 8px 16px rgba(10, 10, 10, 0.1);\n padding: 0.5rem 0;\n }\n .navbar-menu.is-active {\n display: block;\n }\n}\n\n@media screen and (min-width: 1008px) {\n .navbar,\n .navbar-menu,\n .navbar-start,\n .navbar-end {\n align-items: stretch;\n display: flex;\n }\n .navbar {\n min-height: 3.25rem;\n }\n .navbar.is-transparent a.navbar-item:hover, .navbar.is-transparent a.navbar-item.is-active,\n .navbar.is-transparent .navbar-link:hover,\n .navbar.is-transparent .navbar-link.is-active {\n background-color: transparent;\n }\n .navbar.is-transparent .navbar-item.has-dropdown.is-active .navbar-link, .navbar.is-transparent .navbar-item.has-dropdown.is-hoverable:hover .navbar-link {\n background-color: transparent;\n }\n .navbar.is-transparent .navbar-dropdown a.navbar-item:hover {\n background-color: whitesmoke;\n color: #0a0a0a;\n }\n .navbar.is-transparent .navbar-dropdown a.navbar-item.is-active {\n background-color: whitesmoke;\n color: #00d1b2;\n }\n .navbar-burger {\n display: none;\n }\n .navbar-item,\n .navbar-link {\n align-items: center;\n display: flex;\n }\n .navbar-item.has-dropdown {\n align-items: stretch;\n }\n .navbar-item.is-active .navbar-dropdown, .navbar-item.is-hoverable:hover .navbar-dropdown {\n display: block;\n }\n .navbar-item.is-active .navbar-dropdown.is-boxed, .navbar-item.is-hoverable:hover .navbar-dropdown.is-boxed {\n opacity: 1;\n pointer-events: auto;\n transform: translateY(0);\n }\n .navbar-link::after {\n border: 1px solid #00d1b2;\n border-right: 0;\n border-top: 0;\n content: \" \";\n display: block;\n height: 0.5em;\n pointer-events: none;\n position: absolute;\n transform: rotate(-45deg);\n width: 0.5em;\n margin-top: -0.375em;\n right: 1.125em;\n top: 50%;\n }\n .navbar-menu {\n flex-grow: 1;\n flex-shrink: 0;\n }\n .navbar-start {\n justify-content: flex-start;\n margin-right: auto;\n }\n .navbar-end {\n justify-content: flex-end;\n margin-left: auto;\n }\n .navbar-dropdown {\n background-color: white;\n border-bottom-left-radius: 5px;\n border-bottom-right-radius: 5px;\n border-top: 1px solid #dbdbdb;\n box-shadow: 0 8px 8px rgba(10, 10, 10, 0.1);\n display: none;\n font-size: 0.875rem;\n left: 0;\n min-width: 100%;\n position: absolute;\n top: 100%;\n z-index: 20;\n }\n .navbar-dropdown .navbar-item {\n padding: 0.375rem 1rem;\n white-space: nowrap;\n }\n .navbar-dropdown a.navbar-item {\n padding-right: 3rem;\n }\n .navbar-dropdown a.navbar-item:hover {\n background-color: whitesmoke;\n color: #0a0a0a;\n }\n .navbar-dropdown a.navbar-item.is-active {\n background-color: whitesmoke;\n color: #00d1b2;\n }\n .navbar-dropdown.is-boxed {\n border-radius: 5px;\n border-top: none;\n box-shadow: 0 8px 8px rgba(10, 10, 10, 0.1), 0 0 0 1px rgba(10, 10, 10, 0.1);\n display: block;\n opacity: 0;\n pointer-events: none;\n top: calc(100% + (-4px));\n transform: translateY(-5px);\n transition-duration: 86ms;\n transition-property: opacity, transform;\n }\n .navbar-dropdown.is-right {\n left: auto;\n right: 0;\n }\n .navbar-divider {\n display: block;\n }\n .container > .navbar {\n margin-left: -1rem;\n margin-right: -1rem;\n }\n a.navbar-item.is-active,\n .navbar-link.is-active {\n color: #0a0a0a;\n }\n a.navbar-item.is-active:not(:hover),\n .navbar-link.is-active:not(:hover) {\n background-color: transparent;\n }\n .navbar-item.has-dropdown:hover .navbar-link, .navbar-item.has-dropdown.is-active .navbar-link {\n background-color: whitesmoke;\n }\n}\n\n.pagination {\n font-size: 1rem;\n margin: -0.25rem;\n}\n\n.pagination.is-small {\n font-size: 0.75rem;\n}\n\n.pagination.is-medium {\n font-size: 1.25rem;\n}\n\n.pagination.is-large {\n font-size: 1.5rem;\n}\n\n.pagination,\n.pagination-list {\n align-items: center;\n display: flex;\n justify-content: center;\n text-align: center;\n}\n\n.pagination-previous,\n.pagination-next,\n.pagination-link,\n.pagination-ellipsis {\n -moz-appearance: none;\n -webkit-appearance: none;\n align-items: center;\n border: 1px solid transparent;\n border-radius: 3px;\n box-shadow: none;\n display: inline-flex;\n font-size: 1rem;\n height: 2.25em;\n justify-content: flex-start;\n line-height: 1.5;\n padding-bottom: calc(0.375em - 1px);\n padding-left: calc(0.625em - 1px);\n padding-right: calc(0.625em - 1px);\n padding-top: calc(0.375em - 1px);\n position: relative;\n vertical-align: top;\n -webkit-touch-callout: none;\n -webkit-user-select: none;\n -moz-user-select: none;\n -ms-user-select: none;\n user-select: none;\n font-size: 1em;\n padding-left: 0.5em;\n padding-right: 0.5em;\n justify-content: center;\n margin: 0.25rem;\n text-align: center;\n}\n\n.pagination-previous:focus, .pagination-previous.is-focused, .pagination-previous:active, .pagination-previous.is-active,\n.pagination-next:focus,\n.pagination-next.is-focused,\n.pagination-next:active,\n.pagination-next.is-active,\n.pagination-link:focus,\n.pagination-link.is-focused,\n.pagination-link:active,\n.pagination-link.is-active,\n.pagination-ellipsis:focus,\n.pagination-ellipsis.is-focused,\n.pagination-ellipsis:active,\n.pagination-ellipsis.is-active {\n outline: none;\n}\n\n.pagination-previous[disabled],\n.pagination-next[disabled],\n.pagination-link[disabled],\n.pagination-ellipsis[disabled] {\n cursor: not-allowed;\n}\n\n.pagination-previous,\n.pagination-next,\n.pagination-link {\n border-color: #dbdbdb;\n min-width: 2.25em;\n}\n\n.pagination-previous:hover,\n.pagination-next:hover,\n.pagination-link:hover {\n border-color: #b5b5b5;\n color: #363636;\n}\n\n.pagination-previous:focus,\n.pagination-next:focus,\n.pagination-link:focus {\n border-color: #00d1b2;\n}\n\n.pagination-previous:active,\n.pagination-next:active,\n.pagination-link:active {\n box-shadow: inset 0 1px 2px rgba(10, 10, 10, 0.2);\n}\n\n.pagination-previous[disabled],\n.pagination-next[disabled],\n.pagination-link[disabled] {\n background-color: #dbdbdb;\n border-color: #dbdbdb;\n box-shadow: none;\n color: #7a7a7a;\n opacity: 0.5;\n}\n\n.pagination-previous,\n.pagination-next {\n padding-left: 0.75em;\n padding-right: 0.75em;\n white-space: nowrap;\n}\n\n.pagination-link.is-current {\n background-color: #00d1b2;\n border-color: #00d1b2;\n color: #fff;\n}\n\n.pagination-ellipsis {\n color: #b5b5b5;\n pointer-events: none;\n}\n\n.pagination-list {\n flex-wrap: wrap;\n}\n\n@media screen and (max-width: 768px) {\n .pagination {\n flex-wrap: wrap;\n }\n .pagination-previous,\n .pagination-next {\n flex-grow: 1;\n flex-shrink: 1;\n }\n .pagination-list li {\n flex-grow: 1;\n flex-shrink: 1;\n }\n}\n\n@media screen and (min-width: 769px), print {\n .pagination-list {\n flex-grow: 1;\n flex-shrink: 1;\n justify-content: flex-start;\n order: 1;\n }\n .pagination-previous {\n order: 2;\n }\n .pagination-next {\n order: 3;\n }\n .pagination {\n justify-content: space-between;\n }\n .pagination.is-centered .pagination-previous {\n order: 1;\n }\n .pagination.is-centered .pagination-list {\n justify-content: center;\n order: 2;\n }\n .pagination.is-centered .pagination-next {\n order: 3;\n }\n .pagination.is-right .pagination-previous {\n order: 1;\n }\n .pagination.is-right .pagination-next {\n order: 2;\n }\n .pagination.is-right .pagination-list {\n justify-content: flex-end;\n order: 3;\n }\n}\n\n.panel {\n font-size: 1rem;\n}\n\n.panel:not(:last-child) {\n margin-bottom: 1.5rem;\n}\n\n.panel-heading,\n.panel-tabs,\n.panel-block {\n border-bottom: 1px solid #dbdbdb;\n border-left: 1px solid #dbdbdb;\n border-right: 1px solid #dbdbdb;\n}\n\n.panel-heading:first-child,\n.panel-tabs:first-child,\n.panel-block:first-child {\n border-top: 1px solid #dbdbdb;\n}\n\n.panel-heading {\n background-color: whitesmoke;\n border-radius: 3px 3px 0 0;\n color: #363636;\n font-size: 1.25em;\n font-weight: 300;\n line-height: 1.25;\n padding: 0.5em 0.75em;\n}\n\n.panel-tabs {\n align-items: flex-end;\n display: flex;\n font-size: 0.875em;\n justify-content: center;\n}\n\n.panel-tabs a {\n border-bottom: 1px solid #dbdbdb;\n margin-bottom: -1px;\n padding: 0.5em;\n}\n\n.panel-tabs a.is-active {\n border-bottom-color: #4a4a4a;\n color: #363636;\n}\n\n.panel-list a {\n color: #4a4a4a;\n}\n\n.panel-list a:hover {\n color: #00d1b2;\n}\n\n.panel-block {\n align-items: center;\n color: #363636;\n display: flex;\n justify-content: flex-start;\n padding: 0.5em 0.75em;\n}\n\n.panel-block input[type=\"checkbox\"] {\n margin-right: 0.75em;\n}\n\n.panel-block > .control {\n flex-grow: 1;\n flex-shrink: 1;\n width: 100%;\n}\n\n.panel-block.is-wrapped {\n flex-wrap: wrap;\n}\n\n.panel-block.is-active {\n border-left-color: #00d1b2;\n color: #363636;\n}\n\n.panel-block.is-active .panel-icon {\n color: #00d1b2;\n}\n\na.panel-block,\nlabel.panel-block {\n cursor: pointer;\n}\n\na.panel-block:hover,\nlabel.panel-block:hover {\n background-color: whitesmoke;\n}\n\n.panel-icon {\n display: inline-block;\n font-size: 14px;\n height: 1em;\n line-height: 1em;\n text-align: center;\n vertical-align: top;\n width: 1em;\n color: #7a7a7a;\n margin-right: 0.75em;\n}\n\n.panel-icon .fa {\n font-size: inherit;\n line-height: inherit;\n}\n\n.tabs {\n -webkit-overflow-scrolling: touch;\n -webkit-touch-callout: none;\n -webkit-user-select: none;\n -moz-user-select: none;\n -ms-user-select: none;\n user-select: none;\n align-items: stretch;\n display: flex;\n font-size: 1rem;\n justify-content: space-between;\n overflow: hidden;\n overflow-x: auto;\n white-space: nowrap;\n}\n\n.tabs:not(:last-child) {\n margin-bottom: 1.5rem;\n}\n\n.tabs a {\n align-items: center;\n border-bottom-color: #dbdbdb;\n border-bottom-style: solid;\n border-bottom-width: 1px;\n color: #4a4a4a;\n display: flex;\n justify-content: center;\n margin-bottom: -1px;\n padding: 0.5em 1em;\n vertical-align: top;\n}\n\n.tabs a:hover {\n border-bottom-color: #363636;\n color: #363636;\n}\n\n.tabs li {\n display: block;\n}\n\n.tabs li.is-active a {\n border-bottom-color: #00d1b2;\n color: #00d1b2;\n}\n\n.tabs ul {\n align-items: center;\n border-bottom-color: #dbdbdb;\n border-bottom-style: solid;\n border-bottom-width: 1px;\n display: flex;\n flex-grow: 1;\n flex-shrink: 0;\n justify-content: flex-start;\n}\n\n.tabs ul.is-left {\n padding-right: 0.75em;\n}\n\n.tabs ul.is-center {\n flex: none;\n justify-content: center;\n padding-left: 0.75em;\n padding-right: 0.75em;\n}\n\n.tabs ul.is-right {\n justify-content: flex-end;\n padding-left: 0.75em;\n}\n\n.tabs .icon:first-child {\n margin-right: 0.5em;\n}\n\n.tabs .icon:last-child {\n margin-left: 0.5em;\n}\n\n.tabs.is-centered ul {\n justify-content: center;\n}\n\n.tabs.is-right ul {\n justify-content: flex-end;\n}\n\n.tabs.is-boxed a {\n border: 1px solid transparent;\n border-radius: 3px 3px 0 0;\n}\n\n.tabs.is-boxed a:hover {\n background-color: whitesmoke;\n border-bottom-color: #dbdbdb;\n}\n\n.tabs.is-boxed li.is-active a {\n background-color: white;\n border-color: #dbdbdb;\n border-bottom-color: transparent !important;\n}\n\n.tabs.is-fullwidth li {\n flex-grow: 1;\n flex-shrink: 0;\n}\n\n.tabs.is-toggle a {\n border-color: #dbdbdb;\n border-style: solid;\n border-width: 1px;\n margin-bottom: 0;\n position: relative;\n}\n\n.tabs.is-toggle a:hover {\n background-color: whitesmoke;\n border-color: #b5b5b5;\n z-index: 2;\n}\n\n.tabs.is-toggle li + li {\n margin-left: -1px;\n}\n\n.tabs.is-toggle li:first-child a {\n border-radius: 3px 0 0 3px;\n}\n\n.tabs.is-toggle li:last-child a {\n border-radius: 0 3px 3px 0;\n}\n\n.tabs.is-toggle li.is-active a {\n background-color: #00d1b2;\n border-color: #00d1b2;\n color: #fff;\n z-index: 1;\n}\n\n.tabs.is-toggle ul {\n border-bottom: none;\n}\n\n.tabs.is-small {\n font-size: 0.75rem;\n}\n\n.tabs.is-medium {\n font-size: 1.25rem;\n}\n\n.tabs.is-large {\n font-size: 1.5rem;\n}\n\n.column {\n display: block;\n flex-basis: 0;\n flex-grow: 1;\n flex-shrink: 1;\n padding: 0.75rem;\n}\n\n.columns.is-mobile > .column.is-narrow {\n flex: none;\n}\n\n.columns.is-mobile > .column.is-full {\n flex: none;\n width: 100%;\n}\n\n.columns.is-mobile > .column.is-three-quarters {\n flex: none;\n width: 75%;\n}\n\n.columns.is-mobile > .column.is-two-thirds {\n flex: none;\n width: 66.6666%;\n}\n\n.columns.is-mobile > .column.is-half {\n flex: none;\n width: 50%;\n}\n\n.columns.is-mobile > .column.is-one-third {\n flex: none;\n width: 33.3333%;\n}\n\n.columns.is-mobile > .column.is-one-quarter {\n flex: none;\n width: 25%;\n}\n\n.columns.is-mobile > .column.is-offset-three-quarters {\n margin-left: 75%;\n}\n\n.columns.is-mobile > .column.is-offset-two-thirds {\n margin-left: 66.6666%;\n}\n\n.columns.is-mobile > .column.is-offset-half {\n margin-left: 50%;\n}\n\n.columns.is-mobile > .column.is-offset-one-third {\n margin-left: 33.3333%;\n}\n\n.columns.is-mobile > .column.is-offset-one-quarter {\n margin-left: 25%;\n}\n\n.columns.is-mobile > .column.is-1 {\n flex: none;\n width: 8.33333%;\n}\n\n.columns.is-mobile > .column.is-offset-1 {\n margin-left: 8.33333%;\n}\n\n.columns.is-mobile > .column.is-2 {\n flex: none;\n width: 16.66667%;\n}\n\n.columns.is-mobile > .column.is-offset-2 {\n margin-left: 16.66667%;\n}\n\n.columns.is-mobile > .column.is-3 {\n flex: none;\n width: 25%;\n}\n\n.columns.is-mobile > .column.is-offset-3 {\n margin-left: 25%;\n}\n\n.columns.is-mobile > .column.is-4 {\n flex: none;\n width: 33.33333%;\n}\n\n.columns.is-mobile > .column.is-offset-4 {\n margin-left: 33.33333%;\n}\n\n.columns.is-mobile > .column.is-5 {\n flex: none;\n width: 41.66667%;\n}\n\n.columns.is-mobile > .column.is-offset-5 {\n margin-left: 41.66667%;\n}\n\n.columns.is-mobile > .column.is-6 {\n flex: none;\n width: 50%;\n}\n\n.columns.is-mobile > .column.is-offset-6 {\n margin-left: 50%;\n}\n\n.columns.is-mobile > .column.is-7 {\n flex: none;\n width: 58.33333%;\n}\n\n.columns.is-mobile > .column.is-offset-7 {\n margin-left: 58.33333%;\n}\n\n.columns.is-mobile > .column.is-8 {\n flex: none;\n width: 66.66667%;\n}\n\n.columns.is-mobile > .column.is-offset-8 {\n margin-left: 66.66667%;\n}\n\n.columns.is-mobile > .column.is-9 {\n flex: none;\n width: 75%;\n}\n\n.columns.is-mobile > .column.is-offset-9 {\n margin-left: 75%;\n}\n\n.columns.is-mobile > .column.is-10 {\n flex: none;\n width: 83.33333%;\n}\n\n.columns.is-mobile > .column.is-offset-10 {\n margin-left: 83.33333%;\n}\n\n.columns.is-mobile > .column.is-11 {\n flex: none;\n width: 91.66667%;\n}\n\n.columns.is-mobile > .column.is-offset-11 {\n margin-left: 91.66667%;\n}\n\n.columns.is-mobile > .column.is-12 {\n flex: none;\n width: 100%;\n}\n\n.columns.is-mobile > .column.is-offset-12 {\n margin-left: 100%;\n}\n\n@media screen and (max-width: 768px) {\n .column.is-narrow-mobile {\n flex: none;\n }\n .column.is-full-mobile {\n flex: none;\n width: 100%;\n }\n .column.is-three-quarters-mobile {\n flex: none;\n width: 75%;\n }\n .column.is-two-thirds-mobile {\n flex: none;\n width: 66.6666%;\n }\n .column.is-half-mobile {\n flex: none;\n width: 50%;\n }\n .column.is-one-third-mobile {\n flex: none;\n width: 33.3333%;\n }\n .column.is-one-quarter-mobile {\n flex: none;\n width: 25%;\n }\n .column.is-offset-three-quarters-mobile {\n margin-left: 75%;\n }\n .column.is-offset-two-thirds-mobile {\n margin-left: 66.6666%;\n }\n .column.is-offset-half-mobile {\n margin-left: 50%;\n }\n .column.is-offset-one-third-mobile {\n margin-left: 33.3333%;\n }\n .column.is-offset-one-quarter-mobile {\n margin-left: 25%;\n }\n .column.is-1-mobile {\n flex: none;\n width: 8.33333%;\n }\n .column.is-offset-1-mobile {\n margin-left: 8.33333%;\n }\n .column.is-2-mobile {\n flex: none;\n width: 16.66667%;\n }\n .column.is-offset-2-mobile {\n margin-left: 16.66667%;\n }\n .column.is-3-mobile {\n flex: none;\n width: 25%;\n }\n .column.is-offset-3-mobile {\n margin-left: 25%;\n }\n .column.is-4-mobile {\n flex: none;\n width: 33.33333%;\n }\n .column.is-offset-4-mobile {\n margin-left: 33.33333%;\n }\n .column.is-5-mobile {\n flex: none;\n width: 41.66667%;\n }\n .column.is-offset-5-mobile {\n margin-left: 41.66667%;\n }\n .column.is-6-mobile {\n flex: none;\n width: 50%;\n }\n .column.is-offset-6-mobile {\n margin-left: 50%;\n }\n .column.is-7-mobile {\n flex: none;\n width: 58.33333%;\n }\n .column.is-offset-7-mobile {\n margin-left: 58.33333%;\n }\n .column.is-8-mobile {\n flex: none;\n width: 66.66667%;\n }\n .column.is-offset-8-mobile {\n margin-left: 66.66667%;\n }\n .column.is-9-mobile {\n flex: none;\n width: 75%;\n }\n .column.is-offset-9-mobile {\n margin-left: 75%;\n }\n .column.is-10-mobile {\n flex: none;\n width: 83.33333%;\n }\n .column.is-offset-10-mobile {\n margin-left: 83.33333%;\n }\n .column.is-11-mobile {\n flex: none;\n width: 91.66667%;\n }\n .column.is-offset-11-mobile {\n margin-left: 91.66667%;\n }\n .column.is-12-mobile {\n flex: none;\n width: 100%;\n }\n .column.is-offset-12-mobile {\n margin-left: 100%;\n }\n}\n\n@media screen and (min-width: 769px), print {\n .column.is-narrow, .column.is-narrow-tablet {\n flex: none;\n }\n .column.is-full, .column.is-full-tablet {\n flex: none;\n width: 100%;\n }\n .column.is-three-quarters, .column.is-three-quarters-tablet {\n flex: none;\n width: 75%;\n }\n .column.is-two-thirds, .column.is-two-thirds-tablet {\n flex: none;\n width: 66.6666%;\n }\n .column.is-half, .column.is-half-tablet {\n flex: none;\n width: 50%;\n }\n .column.is-one-third, .column.is-one-third-tablet {\n flex: none;\n width: 33.3333%;\n }\n .column.is-one-quarter, .column.is-one-quarter-tablet {\n flex: none;\n width: 25%;\n }\n .column.is-offset-three-quarters, .column.is-offset-three-quarters-tablet {\n margin-left: 75%;\n }\n .column.is-offset-two-thirds, .column.is-offset-two-thirds-tablet {\n margin-left: 66.6666%;\n }\n .column.is-offset-half, .column.is-offset-half-tablet {\n margin-left: 50%;\n }\n .column.is-offset-one-third, .column.is-offset-one-third-tablet {\n margin-left: 33.3333%;\n }\n .column.is-offset-one-quarter, .column.is-offset-one-quarter-tablet {\n margin-left: 25%;\n }\n .column.is-1, .column.is-1-tablet {\n flex: none;\n width: 8.33333%;\n }\n .column.is-offset-1, .column.is-offset-1-tablet {\n margin-left: 8.33333%;\n }\n .column.is-2, .column.is-2-tablet {\n flex: none;\n width: 16.66667%;\n }\n .column.is-offset-2, .column.is-offset-2-tablet {\n margin-left: 16.66667%;\n }\n .column.is-3, .column.is-3-tablet {\n flex: none;\n width: 25%;\n }\n .column.is-offset-3, .column.is-offset-3-tablet {\n margin-left: 25%;\n }\n .column.is-4, .column.is-4-tablet {\n flex: none;\n width: 33.33333%;\n }\n .column.is-offset-4, .column.is-offset-4-tablet {\n margin-left: 33.33333%;\n }\n .column.is-5, .column.is-5-tablet {\n flex: none;\n width: 41.66667%;\n }\n .column.is-offset-5, .column.is-offset-5-tablet {\n margin-left: 41.66667%;\n }\n .column.is-6, .column.is-6-tablet {\n flex: none;\n width: 50%;\n }\n .column.is-offset-6, .column.is-offset-6-tablet {\n margin-left: 50%;\n }\n .column.is-7, .column.is-7-tablet {\n flex: none;\n width: 58.33333%;\n }\n .column.is-offset-7, .column.is-offset-7-tablet {\n margin-left: 58.33333%;\n }\n .column.is-8, .column.is-8-tablet {\n flex: none;\n width: 66.66667%;\n }\n .column.is-offset-8, .column.is-offset-8-tablet {\n margin-left: 66.66667%;\n }\n .column.is-9, .column.is-9-tablet {\n flex: none;\n width: 75%;\n }\n .column.is-offset-9, .column.is-offset-9-tablet {\n margin-left: 75%;\n }\n .column.is-10, .column.is-10-tablet {\n flex: none;\n width: 83.33333%;\n }\n .column.is-offset-10, .column.is-offset-10-tablet {\n margin-left: 83.33333%;\n }\n .column.is-11, .column.is-11-tablet {\n flex: none;\n width: 91.66667%;\n }\n .column.is-offset-11, .column.is-offset-11-tablet {\n margin-left: 91.66667%;\n }\n .column.is-12, .column.is-12-tablet {\n flex: none;\n width: 100%;\n }\n .column.is-offset-12, .column.is-offset-12-tablet {\n margin-left: 100%;\n }\n}\n\n@media screen and (max-width: 1007px) {\n .column.is-narrow-touch {\n flex: none;\n }\n .column.is-full-touch {\n flex: none;\n width: 100%;\n }\n .column.is-three-quarters-touch {\n flex: none;\n width: 75%;\n }\n .column.is-two-thirds-touch {\n flex: none;\n width: 66.6666%;\n }\n .column.is-half-touch {\n flex: none;\n width: 50%;\n }\n .column.is-one-third-touch {\n flex: none;\n width: 33.3333%;\n }\n .column.is-one-quarter-touch {\n flex: none;\n width: 25%;\n }\n .column.is-offset-three-quarters-touch {\n margin-left: 75%;\n }\n .column.is-offset-two-thirds-touch {\n margin-left: 66.6666%;\n }\n .column.is-offset-half-touch {\n margin-left: 50%;\n }\n .column.is-offset-one-third-touch {\n margin-left: 33.3333%;\n }\n .column.is-offset-one-quarter-touch {\n margin-left: 25%;\n }\n .column.is-1-touch {\n flex: none;\n width: 8.33333%;\n }\n .column.is-offset-1-touch {\n margin-left: 8.33333%;\n }\n .column.is-2-touch {\n flex: none;\n width: 16.66667%;\n }\n .column.is-offset-2-touch {\n margin-left: 16.66667%;\n }\n .column.is-3-touch {\n flex: none;\n width: 25%;\n }\n .column.is-offset-3-touch {\n margin-left: 25%;\n }\n .column.is-4-touch {\n flex: none;\n width: 33.33333%;\n }\n .column.is-offset-4-touch {\n margin-left: 33.33333%;\n }\n .column.is-5-touch {\n flex: none;\n width: 41.66667%;\n }\n .column.is-offset-5-touch {\n margin-left: 41.66667%;\n }\n .column.is-6-touch {\n flex: none;\n width: 50%;\n }\n .column.is-offset-6-touch {\n margin-left: 50%;\n }\n .column.is-7-touch {\n flex: none;\n width: 58.33333%;\n }\n .column.is-offset-7-touch {\n margin-left: 58.33333%;\n }\n .column.is-8-touch {\n flex: none;\n width: 66.66667%;\n }\n .column.is-offset-8-touch {\n margin-left: 66.66667%;\n }\n .column.is-9-touch {\n flex: none;\n width: 75%;\n }\n .column.is-offset-9-touch {\n margin-left: 75%;\n }\n .column.is-10-touch {\n flex: none;\n width: 83.33333%;\n }\n .column.is-offset-10-touch {\n margin-left: 83.33333%;\n }\n .column.is-11-touch {\n flex: none;\n width: 91.66667%;\n }\n .column.is-offset-11-touch {\n margin-left: 91.66667%;\n }\n .column.is-12-touch {\n flex: none;\n width: 100%;\n }\n .column.is-offset-12-touch {\n margin-left: 100%;\n }\n}\n\n@media screen and (min-width: 1008px) {\n .column.is-narrow-desktop {\n flex: none;\n }\n .column.is-full-desktop {\n flex: none;\n width: 100%;\n }\n .column.is-three-quarters-desktop {\n flex: none;\n width: 75%;\n }\n .column.is-two-thirds-desktop {\n flex: none;\n width: 66.6666%;\n }\n .column.is-half-desktop {\n flex: none;\n width: 50%;\n }\n .column.is-one-third-desktop {\n flex: none;\n width: 33.3333%;\n }\n .column.is-one-quarter-desktop {\n flex: none;\n width: 25%;\n }\n .column.is-offset-three-quarters-desktop {\n margin-left: 75%;\n }\n .column.is-offset-two-thirds-desktop {\n margin-left: 66.6666%;\n }\n .column.is-offset-half-desktop {\n margin-left: 50%;\n }\n .column.is-offset-one-third-desktop {\n margin-left: 33.3333%;\n }\n .column.is-offset-one-quarter-desktop {\n margin-left: 25%;\n }\n .column.is-1-desktop {\n flex: none;\n width: 8.33333%;\n }\n .column.is-offset-1-desktop {\n margin-left: 8.33333%;\n }\n .column.is-2-desktop {\n flex: none;\n width: 16.66667%;\n }\n .column.is-offset-2-desktop {\n margin-left: 16.66667%;\n }\n .column.is-3-desktop {\n flex: none;\n width: 25%;\n }\n .column.is-offset-3-desktop {\n margin-left: 25%;\n }\n .column.is-4-desktop {\n flex: none;\n width: 33.33333%;\n }\n .column.is-offset-4-desktop {\n margin-left: 33.33333%;\n }\n .column.is-5-desktop {\n flex: none;\n width: 41.66667%;\n }\n .column.is-offset-5-desktop {\n margin-left: 41.66667%;\n }\n .column.is-6-desktop {\n flex: none;\n width: 50%;\n }\n .column.is-offset-6-desktop {\n margin-left: 50%;\n }\n .column.is-7-desktop {\n flex: none;\n width: 58.33333%;\n }\n .column.is-offset-7-desktop {\n margin-left: 58.33333%;\n }\n .column.is-8-desktop {\n flex: none;\n width: 66.66667%;\n }\n .column.is-offset-8-desktop {\n margin-left: 66.66667%;\n }\n .column.is-9-desktop {\n flex: none;\n width: 75%;\n }\n .column.is-offset-9-desktop {\n margin-left: 75%;\n }\n .column.is-10-desktop {\n flex: none;\n width: 83.33333%;\n }\n .column.is-offset-10-desktop {\n margin-left: 83.33333%;\n }\n .column.is-11-desktop {\n flex: none;\n width: 91.66667%;\n }\n .column.is-offset-11-desktop {\n margin-left: 91.66667%;\n }\n .column.is-12-desktop {\n flex: none;\n width: 100%;\n }\n .column.is-offset-12-desktop {\n margin-left: 100%;\n }\n}\n\n@media screen and (min-width: 1200px) {\n .column.is-narrow-widescreen {\n flex: none;\n }\n .column.is-full-widescreen {\n flex: none;\n width: 100%;\n }\n .column.is-three-quarters-widescreen {\n flex: none;\n width: 75%;\n }\n .column.is-two-thirds-widescreen {\n flex: none;\n width: 66.6666%;\n }\n .column.is-half-widescreen {\n flex: none;\n width: 50%;\n }\n .column.is-one-third-widescreen {\n flex: none;\n width: 33.3333%;\n }\n .column.is-one-quarter-widescreen {\n flex: none;\n width: 25%;\n }\n .column.is-offset-three-quarters-widescreen {\n margin-left: 75%;\n }\n .column.is-offset-two-thirds-widescreen {\n margin-left: 66.6666%;\n }\n .column.is-offset-half-widescreen {\n margin-left: 50%;\n }\n .column.is-offset-one-third-widescreen {\n margin-left: 33.3333%;\n }\n .column.is-offset-one-quarter-widescreen {\n margin-left: 25%;\n }\n .column.is-1-widescreen {\n flex: none;\n width: 8.33333%;\n }\n .column.is-offset-1-widescreen {\n margin-left: 8.33333%;\n }\n .column.is-2-widescreen {\n flex: none;\n width: 16.66667%;\n }\n .column.is-offset-2-widescreen {\n margin-left: 16.66667%;\n }\n .column.is-3-widescreen {\n flex: none;\n width: 25%;\n }\n .column.is-offset-3-widescreen {\n margin-left: 25%;\n }\n .column.is-4-widescreen {\n flex: none;\n width: 33.33333%;\n }\n .column.is-offset-4-widescreen {\n margin-left: 33.33333%;\n }\n .column.is-5-widescreen {\n flex: none;\n width: 41.66667%;\n }\n .column.is-offset-5-widescreen {\n margin-left: 41.66667%;\n }\n .column.is-6-widescreen {\n flex: none;\n width: 50%;\n }\n .column.is-offset-6-widescreen {\n margin-left: 50%;\n }\n .column.is-7-widescreen {\n flex: none;\n width: 58.33333%;\n }\n .column.is-offset-7-widescreen {\n margin-left: 58.33333%;\n }\n .column.is-8-widescreen {\n flex: none;\n width: 66.66667%;\n }\n .column.is-offset-8-widescreen {\n margin-left: 66.66667%;\n }\n .column.is-9-widescreen {\n flex: none;\n width: 75%;\n }\n .column.is-offset-9-widescreen {\n margin-left: 75%;\n }\n .column.is-10-widescreen {\n flex: none;\n width: 83.33333%;\n }\n .column.is-offset-10-widescreen {\n margin-left: 83.33333%;\n }\n .column.is-11-widescreen {\n flex: none;\n width: 91.66667%;\n }\n .column.is-offset-11-widescreen {\n margin-left: 91.66667%;\n }\n .column.is-12-widescreen {\n flex: none;\n width: 100%;\n }\n .column.is-offset-12-widescreen {\n margin-left: 100%;\n }\n}\n\n@media screen and (min-width: 1392px) {\n .column.is-narrow-fullhd {\n flex: none;\n }\n .column.is-full-fullhd {\n flex: none;\n width: 100%;\n }\n .column.is-three-quarters-fullhd {\n flex: none;\n width: 75%;\n }\n .column.is-two-thirds-fullhd {\n flex: none;\n width: 66.6666%;\n }\n .column.is-half-fullhd {\n flex: none;\n width: 50%;\n }\n .column.is-one-third-fullhd {\n flex: none;\n width: 33.3333%;\n }\n .column.is-one-quarter-fullhd {\n flex: none;\n width: 25%;\n }\n .column.is-offset-three-quarters-fullhd {\n margin-left: 75%;\n }\n .column.is-offset-two-thirds-fullhd {\n margin-left: 66.6666%;\n }\n .column.is-offset-half-fullhd {\n margin-left: 50%;\n }\n .column.is-offset-one-third-fullhd {\n margin-left: 33.3333%;\n }\n .column.is-offset-one-quarter-fullhd {\n margin-left: 25%;\n }\n .column.is-1-fullhd {\n flex: none;\n width: 8.33333%;\n }\n .column.is-offset-1-fullhd {\n margin-left: 8.33333%;\n }\n .column.is-2-fullhd {\n flex: none;\n width: 16.66667%;\n }\n .column.is-offset-2-fullhd {\n margin-left: 16.66667%;\n }\n .column.is-3-fullhd {\n flex: none;\n width: 25%;\n }\n .column.is-offset-3-fullhd {\n margin-left: 25%;\n }\n .column.is-4-fullhd {\n flex: none;\n width: 33.33333%;\n }\n .column.is-offset-4-fullhd {\n margin-left: 33.33333%;\n }\n .column.is-5-fullhd {\n flex: none;\n width: 41.66667%;\n }\n .column.is-offset-5-fullhd {\n margin-left: 41.66667%;\n }\n .column.is-6-fullhd {\n flex: none;\n width: 50%;\n }\n .column.is-offset-6-fullhd {\n margin-left: 50%;\n }\n .column.is-7-fullhd {\n flex: none;\n width: 58.33333%;\n }\n .column.is-offset-7-fullhd {\n margin-left: 58.33333%;\n }\n .column.is-8-fullhd {\n flex: none;\n width: 66.66667%;\n }\n .column.is-offset-8-fullhd {\n margin-left: 66.66667%;\n }\n .column.is-9-fullhd {\n flex: none;\n width: 75%;\n }\n .column.is-offset-9-fullhd {\n margin-left: 75%;\n }\n .column.is-10-fullhd {\n flex: none;\n width: 83.33333%;\n }\n .column.is-offset-10-fullhd {\n margin-left: 83.33333%;\n }\n .column.is-11-fullhd {\n flex: none;\n width: 91.66667%;\n }\n .column.is-offset-11-fullhd {\n margin-left: 91.66667%;\n }\n .column.is-12-fullhd {\n flex: none;\n width: 100%;\n }\n .column.is-offset-12-fullhd {\n margin-left: 100%;\n }\n}\n\n.columns {\n margin-left: -0.75rem;\n margin-right: -0.75rem;\n margin-top: -0.75rem;\n}\n\n.columns:last-child {\n margin-bottom: -0.75rem;\n}\n\n.columns:not(:last-child) {\n margin-bottom: 0.75rem;\n}\n\n.columns.is-centered {\n justify-content: center;\n}\n\n.columns.is-gapless {\n margin-left: 0;\n margin-right: 0;\n margin-top: 0;\n}\n\n.columns.is-gapless:last-child {\n margin-bottom: 0;\n}\n\n.columns.is-gapless:not(:last-child) {\n margin-bottom: 1.5rem;\n}\n\n.columns.is-gapless > .column {\n margin: 0;\n padding: 0;\n}\n\n@media screen and (min-width: 769px), print {\n .columns.is-grid {\n flex-wrap: wrap;\n }\n .columns.is-grid > .column {\n max-width: 33.3333%;\n padding: 0.75rem;\n width: 33.3333%;\n }\n .columns.is-grid > .column + .column {\n margin-left: 0;\n }\n}\n\n.columns.is-mobile {\n display: flex;\n}\n\n.columns.is-multiline {\n flex-wrap: wrap;\n}\n\n.columns.is-vcentered {\n align-items: center;\n}\n\n@media screen and (min-width: 769px), print {\n .columns:not(.is-desktop) {\n display: flex;\n }\n}\n\n@media screen and (min-width: 1008px) {\n .columns.is-desktop {\n display: flex;\n }\n}\n\n.tile {\n align-items: stretch;\n display: block;\n flex-basis: 0;\n flex-grow: 1;\n flex-shrink: 1;\n min-height: min-content;\n}\n\n.tile.is-ancestor {\n margin-left: -0.75rem;\n margin-right: -0.75rem;\n margin-top: -0.75rem;\n}\n\n.tile.is-ancestor:last-child {\n margin-bottom: -0.75rem;\n}\n\n.tile.is-ancestor:not(:last-child) {\n margin-bottom: 0.75rem;\n}\n\n.tile.is-child {\n margin: 0 !important;\n}\n\n.tile.is-parent {\n padding: 0.75rem;\n}\n\n.tile.is-vertical {\n flex-direction: column;\n}\n\n.tile.is-vertical > .tile.is-child:not(:last-child) {\n margin-bottom: 1.5rem !important;\n}\n\n@media screen and (min-width: 769px), print {\n .tile:not(.is-child) {\n display: flex;\n }\n .tile.is-1 {\n flex: none;\n width: 8.33333%;\n }\n .tile.is-2 {\n flex: none;\n width: 16.66667%;\n }\n .tile.is-3 {\n flex: none;\n width: 25%;\n }\n .tile.is-4 {\n flex: none;\n width: 33.33333%;\n }\n .tile.is-5 {\n flex: none;\n width: 41.66667%;\n }\n .tile.is-6 {\n flex: none;\n width: 50%;\n }\n .tile.is-7 {\n flex: none;\n width: 58.33333%;\n }\n .tile.is-8 {\n flex: none;\n width: 66.66667%;\n }\n .tile.is-9 {\n flex: none;\n width: 75%;\n }\n .tile.is-10 {\n flex: none;\n width: 83.33333%;\n }\n .tile.is-11 {\n flex: none;\n width: 91.66667%;\n }\n .tile.is-12 {\n flex: none;\n width: 100%;\n }\n}\n\n.hero {\n align-items: stretch;\n display: flex;\n flex-direction: column;\n justify-content: space-between;\n}\n\n.hero .nav {\n background: none;\n box-shadow: 0 1px 0 rgba(219, 219, 219, 0.3);\n}\n\n.hero .tabs ul {\n border-bottom: none;\n}\n\n.hero.is-white {\n background-color: white;\n color: #0a0a0a;\n}\n\n.hero.is-white a:not(.button),\n.hero.is-white strong {\n color: inherit;\n}\n\n.hero.is-white .title {\n color: #0a0a0a;\n}\n\n.hero.is-white .subtitle {\n color: rgba(10, 10, 10, 0.9);\n}\n\n.hero.is-white .subtitle a:not(.button),\n.hero.is-white .subtitle strong {\n color: #0a0a0a;\n}\n\n.hero.is-white .nav {\n box-shadow: 0 1px 0 rgba(10, 10, 10, 0.2);\n}\n\n@media screen and (max-width: 768px) {\n .hero.is-white .nav-menu {\n background-color: white;\n }\n}\n\n.hero.is-white a.nav-item,\n.hero.is-white .nav-item a:not(.button) {\n color: rgba(10, 10, 10, 0.7);\n}\n\n.hero.is-white a.nav-item:hover, .hero.is-white a.nav-item.is-active,\n.hero.is-white .nav-item a:not(.button):hover,\n.hero.is-white .nav-item a:not(.button).is-active {\n color: #0a0a0a;\n}\n\n.hero.is-white .tabs a {\n color: #0a0a0a;\n opacity: 0.9;\n}\n\n.hero.is-white .tabs a:hover {\n opacity: 1;\n}\n\n.hero.is-white .tabs li.is-active a {\n opacity: 1;\n}\n\n.hero.is-white .tabs.is-boxed a, .hero.is-white .tabs.is-toggle a {\n color: #0a0a0a;\n}\n\n.hero.is-white .tabs.is-boxed a:hover, .hero.is-white .tabs.is-toggle a:hover {\n background-color: rgba(10, 10, 10, 0.1);\n}\n\n.hero.is-white .tabs.is-boxed li.is-active a, .hero.is-white .tabs.is-boxed li.is-active a:hover, .hero.is-white .tabs.is-toggle li.is-active a, .hero.is-white .tabs.is-toggle li.is-active a:hover {\n background-color: #0a0a0a;\n border-color: #0a0a0a;\n color: white;\n}\n\n.hero.is-white.is-bold {\n background-image: linear-gradient(141deg, #e6e6e6 0%, white 71%, white 100%);\n}\n\n@media screen and (max-width: 768px) {\n .hero.is-white.is-bold .nav-menu {\n background-image: linear-gradient(141deg, #e6e6e6 0%, white 71%, white 100%);\n }\n}\n\n@media screen and (max-width: 768px) {\n .hero.is-white .nav-toggle span {\n background-color: #0a0a0a;\n }\n .hero.is-white .nav-toggle:hover {\n background-color: rgba(10, 10, 10, 0.1);\n }\n .hero.is-white .nav-toggle.is-active span {\n background-color: #0a0a0a;\n }\n .hero.is-white .nav-menu .nav-item {\n border-top-color: rgba(10, 10, 10, 0.2);\n }\n}\n\n.hero.is-black {\n background-color: #0a0a0a;\n color: white;\n}\n\n.hero.is-black a:not(.button),\n.hero.is-black strong {\n color: inherit;\n}\n\n.hero.is-black .title {\n color: white;\n}\n\n.hero.is-black .subtitle {\n color: rgba(255, 255, 255, 0.9);\n}\n\n.hero.is-black .subtitle a:not(.button),\n.hero.is-black .subtitle strong {\n color: white;\n}\n\n.hero.is-black .nav {\n box-shadow: 0 1px 0 rgba(255, 255, 255, 0.2);\n}\n\n@media screen and (max-width: 768px) {\n .hero.is-black .nav-menu {\n background-color: #0a0a0a;\n }\n}\n\n.hero.is-black a.nav-item,\n.hero.is-black .nav-item a:not(.button) {\n color: rgba(255, 255, 255, 0.7);\n}\n\n.hero.is-black a.nav-item:hover, .hero.is-black a.nav-item.is-active,\n.hero.is-black .nav-item a:not(.button):hover,\n.hero.is-black .nav-item a:not(.button).is-active {\n color: white;\n}\n\n.hero.is-black .tabs a {\n color: white;\n opacity: 0.9;\n}\n\n.hero.is-black .tabs a:hover {\n opacity: 1;\n}\n\n.hero.is-black .tabs li.is-active a {\n opacity: 1;\n}\n\n.hero.is-black .tabs.is-boxed a, .hero.is-black .tabs.is-toggle a {\n color: white;\n}\n\n.hero.is-black .tabs.is-boxed a:hover, .hero.is-black .tabs.is-toggle a:hover {\n background-color: rgba(10, 10, 10, 0.1);\n}\n\n.hero.is-black .tabs.is-boxed li.is-active a, .hero.is-black .tabs.is-boxed li.is-active a:hover, .hero.is-black .tabs.is-toggle li.is-active a, .hero.is-black .tabs.is-toggle li.is-active a:hover {\n background-color: white;\n border-color: white;\n color: #0a0a0a;\n}\n\n.hero.is-black.is-bold {\n background-image: linear-gradient(141deg, black 0%, #0a0a0a 71%, #181616 100%);\n}\n\n@media screen and (max-width: 768px) {\n .hero.is-black.is-bold .nav-menu {\n background-image: linear-gradient(141deg, black 0%, #0a0a0a 71%, #181616 100%);\n }\n}\n\n@media screen and (max-width: 768px) {\n .hero.is-black .nav-toggle span {\n background-color: white;\n }\n .hero.is-black .nav-toggle:hover {\n background-color: rgba(10, 10, 10, 0.1);\n }\n .hero.is-black .nav-toggle.is-active span {\n background-color: white;\n }\n .hero.is-black .nav-menu .nav-item {\n border-top-color: rgba(255, 255, 255, 0.2);\n }\n}\n\n.hero.is-light {\n background-color: whitesmoke;\n color: #363636;\n}\n\n.hero.is-light a:not(.button),\n.hero.is-light strong {\n color: inherit;\n}\n\n.hero.is-light .title {\n color: #363636;\n}\n\n.hero.is-light .subtitle {\n color: rgba(54, 54, 54, 0.9);\n}\n\n.hero.is-light .subtitle a:not(.button),\n.hero.is-light .subtitle strong {\n color: #363636;\n}\n\n.hero.is-light .nav {\n box-shadow: 0 1px 0 rgba(54, 54, 54, 0.2);\n}\n\n@media screen and (max-width: 768px) {\n .hero.is-light .nav-menu {\n background-color: whitesmoke;\n }\n}\n\n.hero.is-light a.nav-item,\n.hero.is-light .nav-item a:not(.button) {\n color: rgba(54, 54, 54, 0.7);\n}\n\n.hero.is-light a.nav-item:hover, .hero.is-light a.nav-item.is-active,\n.hero.is-light .nav-item a:not(.button):hover,\n.hero.is-light .nav-item a:not(.button).is-active {\n color: #363636;\n}\n\n.hero.is-light .tabs a {\n color: #363636;\n opacity: 0.9;\n}\n\n.hero.is-light .tabs a:hover {\n opacity: 1;\n}\n\n.hero.is-light .tabs li.is-active a {\n opacity: 1;\n}\n\n.hero.is-light .tabs.is-boxed a, .hero.is-light .tabs.is-toggle a {\n color: #363636;\n}\n\n.hero.is-light .tabs.is-boxed a:hover, .hero.is-light .tabs.is-toggle a:hover {\n background-color: rgba(10, 10, 10, 0.1);\n}\n\n.hero.is-light .tabs.is-boxed li.is-active a, .hero.is-light .tabs.is-boxed li.is-active a:hover, .hero.is-light .tabs.is-toggle li.is-active a, .hero.is-light .tabs.is-toggle li.is-active a:hover {\n background-color: #363636;\n border-color: #363636;\n color: whitesmoke;\n}\n\n.hero.is-light.is-bold {\n background-image: linear-gradient(141deg, #dfd8d9 0%, whitesmoke 71%, white 100%);\n}\n\n@media screen and (max-width: 768px) {\n .hero.is-light.is-bold .nav-menu {\n background-image: linear-gradient(141deg, #dfd8d9 0%, whitesmoke 71%, white 100%);\n }\n}\n\n@media screen and (max-width: 768px) {\n .hero.is-light .nav-toggle span {\n background-color: #363636;\n }\n .hero.is-light .nav-toggle:hover {\n background-color: rgba(10, 10, 10, 0.1);\n }\n .hero.is-light .nav-toggle.is-active span {\n background-color: #363636;\n }\n .hero.is-light .nav-menu .nav-item {\n border-top-color: rgba(54, 54, 54, 0.2);\n }\n}\n\n.hero.is-dark {\n background-color: #363636;\n color: whitesmoke;\n}\n\n.hero.is-dark a:not(.button),\n.hero.is-dark strong {\n color: inherit;\n}\n\n.hero.is-dark .title {\n color: whitesmoke;\n}\n\n.hero.is-dark .subtitle {\n color: rgba(245, 245, 245, 0.9);\n}\n\n.hero.is-dark .subtitle a:not(.button),\n.hero.is-dark .subtitle strong {\n color: whitesmoke;\n}\n\n.hero.is-dark .nav {\n box-shadow: 0 1px 0 rgba(245, 245, 245, 0.2);\n}\n\n@media screen and (max-width: 768px) {\n .hero.is-dark .nav-menu {\n background-color: #363636;\n }\n}\n\n.hero.is-dark a.nav-item,\n.hero.is-dark .nav-item a:not(.button) {\n color: rgba(245, 245, 245, 0.7);\n}\n\n.hero.is-dark a.nav-item:hover, .hero.is-dark a.nav-item.is-active,\n.hero.is-dark .nav-item a:not(.button):hover,\n.hero.is-dark .nav-item a:not(.button).is-active {\n color: whitesmoke;\n}\n\n.hero.is-dark .tabs a {\n color: whitesmoke;\n opacity: 0.9;\n}\n\n.hero.is-dark .tabs a:hover {\n opacity: 1;\n}\n\n.hero.is-dark .tabs li.is-active a {\n opacity: 1;\n}\n\n.hero.is-dark .tabs.is-boxed a, .hero.is-dark .tabs.is-toggle a {\n color: whitesmoke;\n}\n\n.hero.is-dark .tabs.is-boxed a:hover, .hero.is-dark .tabs.is-toggle a:hover {\n background-color: rgba(10, 10, 10, 0.1);\n}\n\n.hero.is-dark .tabs.is-boxed li.is-active a, .hero.is-dark .tabs.is-boxed li.is-active a:hover, .hero.is-dark .tabs.is-toggle li.is-active a, .hero.is-dark .tabs.is-toggle li.is-active a:hover {\n background-color: whitesmoke;\n border-color: whitesmoke;\n color: #363636;\n}\n\n.hero.is-dark.is-bold {\n background-image: linear-gradient(141deg, #1f191a 0%, #363636 71%, #46403f 100%);\n}\n\n@media screen and (max-width: 768px) {\n .hero.is-dark.is-bold .nav-menu {\n background-image: linear-gradient(141deg, #1f191a 0%, #363636 71%, #46403f 100%);\n }\n}\n\n@media screen and (max-width: 768px) {\n .hero.is-dark .nav-toggle span {\n background-color: whitesmoke;\n }\n .hero.is-dark .nav-toggle:hover {\n background-color: rgba(10, 10, 10, 0.1);\n }\n .hero.is-dark .nav-toggle.is-active span {\n background-color: whitesmoke;\n }\n .hero.is-dark .nav-menu .nav-item {\n border-top-color: rgba(245, 245, 245, 0.2);\n }\n}\n\n.hero.is-primary {\n background-color: #00d1b2;\n color: #fff;\n}\n\n.hero.is-primary a:not(.button),\n.hero.is-primary strong {\n color: inherit;\n}\n\n.hero.is-primary .title {\n color: #fff;\n}\n\n.hero.is-primary .subtitle {\n color: rgba(255, 255, 255, 0.9);\n}\n\n.hero.is-primary .subtitle a:not(.button),\n.hero.is-primary .subtitle strong {\n color: #fff;\n}\n\n.hero.is-primary .nav {\n box-shadow: 0 1px 0 rgba(255, 255, 255, 0.2);\n}\n\n@media screen and (max-width: 768px) {\n .hero.is-primary .nav-menu {\n background-color: #00d1b2;\n }\n}\n\n.hero.is-primary a.nav-item,\n.hero.is-primary .nav-item a:not(.button) {\n color: rgba(255, 255, 255, 0.7);\n}\n\n.hero.is-primary a.nav-item:hover, .hero.is-primary a.nav-item.is-active,\n.hero.is-primary .nav-item a:not(.button):hover,\n.hero.is-primary .nav-item a:not(.button).is-active {\n color: #fff;\n}\n\n.hero.is-primary .tabs a {\n color: #fff;\n opacity: 0.9;\n}\n\n.hero.is-primary .tabs a:hover {\n opacity: 1;\n}\n\n.hero.is-primary .tabs li.is-active a {\n opacity: 1;\n}\n\n.hero.is-primary .tabs.is-boxed a, .hero.is-primary .tabs.is-toggle a {\n color: #fff;\n}\n\n.hero.is-primary .tabs.is-boxed a:hover, .hero.is-primary .tabs.is-toggle a:hover {\n background-color: rgba(10, 10, 10, 0.1);\n}\n\n.hero.is-primary .tabs.is-boxed li.is-active a, .hero.is-primary .tabs.is-boxed li.is-active a:hover, .hero.is-primary .tabs.is-toggle li.is-active a, .hero.is-primary .tabs.is-toggle li.is-active a:hover {\n background-color: #fff;\n border-color: #fff;\n color: #00d1b2;\n}\n\n.hero.is-primary.is-bold {\n background-image: linear-gradient(141deg, #009e6c 0%, #00d1b2 71%, #00e7eb 100%);\n}\n\n@media screen and (max-width: 768px) {\n .hero.is-primary.is-bold .nav-menu {\n background-image: linear-gradient(141deg, #009e6c 0%, #00d1b2 71%, #00e7eb 100%);\n }\n}\n\n@media screen and (max-width: 768px) {\n .hero.is-primary .nav-toggle span {\n background-color: #fff;\n }\n .hero.is-primary .nav-toggle:hover {\n background-color: rgba(10, 10, 10, 0.1);\n }\n .hero.is-primary .nav-toggle.is-active span {\n background-color: #fff;\n }\n .hero.is-primary .nav-menu .nav-item {\n border-top-color: rgba(255, 255, 255, 0.2);\n }\n}\n\n.hero.is-info {\n background-color: #3273dc;\n color: #fff;\n}\n\n.hero.is-info a:not(.button),\n.hero.is-info strong {\n color: inherit;\n}\n\n.hero.is-info .title {\n color: #fff;\n}\n\n.hero.is-info .subtitle {\n color: rgba(255, 255, 255, 0.9);\n}\n\n.hero.is-info .subtitle a:not(.button),\n.hero.is-info .subtitle strong {\n color: #fff;\n}\n\n.hero.is-info .nav {\n box-shadow: 0 1px 0 rgba(255, 255, 255, 0.2);\n}\n\n@media screen and (max-width: 768px) {\n .hero.is-info .nav-menu {\n background-color: #3273dc;\n }\n}\n\n.hero.is-info a.nav-item,\n.hero.is-info .nav-item a:not(.button) {\n color: rgba(255, 255, 255, 0.7);\n}\n\n.hero.is-info a.nav-item:hover, .hero.is-info a.nav-item.is-active,\n.hero.is-info .nav-item a:not(.button):hover,\n.hero.is-info .nav-item a:not(.button).is-active {\n color: #fff;\n}\n\n.hero.is-info .tabs a {\n color: #fff;\n opacity: 0.9;\n}\n\n.hero.is-info .tabs a:hover {\n opacity: 1;\n}\n\n.hero.is-info .tabs li.is-active a {\n opacity: 1;\n}\n\n.hero.is-info .tabs.is-boxed a, .hero.is-info .tabs.is-toggle a {\n color: #fff;\n}\n\n.hero.is-info .tabs.is-boxed a:hover, .hero.is-info .tabs.is-toggle a:hover {\n background-color: rgba(10, 10, 10, 0.1);\n}\n\n.hero.is-info .tabs.is-boxed li.is-active a, .hero.is-info .tabs.is-boxed li.is-active a:hover, .hero.is-info .tabs.is-toggle li.is-active a, .hero.is-info .tabs.is-toggle li.is-active a:hover {\n background-color: #fff;\n border-color: #fff;\n color: #3273dc;\n}\n\n.hero.is-info.is-bold {\n background-image: linear-gradient(141deg, #1577c6 0%, #3273dc 71%, #4366e5 100%);\n}\n\n@media screen and (max-width: 768px) {\n .hero.is-info.is-bold .nav-menu {\n background-image: linear-gradient(141deg, #1577c6 0%, #3273dc 71%, #4366e5 100%);\n }\n}\n\n@media screen and (max-width: 768px) {\n .hero.is-info .nav-toggle span {\n background-color: #fff;\n }\n .hero.is-info .nav-toggle:hover {\n background-color: rgba(10, 10, 10, 0.1);\n }\n .hero.is-info .nav-toggle.is-active span {\n background-color: #fff;\n }\n .hero.is-info .nav-menu .nav-item {\n border-top-color: rgba(255, 255, 255, 0.2);\n }\n}\n\n.hero.is-success {\n background-color: #23d160;\n color: #fff;\n}\n\n.hero.is-success a:not(.button),\n.hero.is-success strong {\n color: inherit;\n}\n\n.hero.is-success .title {\n color: #fff;\n}\n\n.hero.is-success .subtitle {\n color: rgba(255, 255, 255, 0.9);\n}\n\n.hero.is-success .subtitle a:not(.button),\n.hero.is-success .subtitle strong {\n color: #fff;\n}\n\n.hero.is-success .nav {\n box-shadow: 0 1px 0 rgba(255, 255, 255, 0.2);\n}\n\n@media screen and (max-width: 768px) {\n .hero.is-success .nav-menu {\n background-color: #23d160;\n }\n}\n\n.hero.is-success a.nav-item,\n.hero.is-success .nav-item a:not(.button) {\n color: rgba(255, 255, 255, 0.7);\n}\n\n.hero.is-success a.nav-item:hover, .hero.is-success a.nav-item.is-active,\n.hero.is-success .nav-item a:not(.button):hover,\n.hero.is-success .nav-item a:not(.button).is-active {\n color: #fff;\n}\n\n.hero.is-success .tabs a {\n color: #fff;\n opacity: 0.9;\n}\n\n.hero.is-success .tabs a:hover {\n opacity: 1;\n}\n\n.hero.is-success .tabs li.is-active a {\n opacity: 1;\n}\n\n.hero.is-success .tabs.is-boxed a, .hero.is-success .tabs.is-toggle a {\n color: #fff;\n}\n\n.hero.is-success .tabs.is-boxed a:hover, .hero.is-success .tabs.is-toggle a:hover {\n background-color: rgba(10, 10, 10, 0.1);\n}\n\n.hero.is-success .tabs.is-boxed li.is-active a, .hero.is-success .tabs.is-boxed li.is-active a:hover, .hero.is-success .tabs.is-toggle li.is-active a, .hero.is-success .tabs.is-toggle li.is-active a:hover {\n background-color: #fff;\n border-color: #fff;\n color: #23d160;\n}\n\n.hero.is-success.is-bold {\n background-image: linear-gradient(141deg, #12af2f 0%, #23d160 71%, #2ce28a 100%);\n}\n\n@media screen and (max-width: 768px) {\n .hero.is-success.is-bold .nav-menu {\n background-image: linear-gradient(141deg, #12af2f 0%, #23d160 71%, #2ce28a 100%);\n }\n}\n\n@media screen and (max-width: 768px) {\n .hero.is-success .nav-toggle span {\n background-color: #fff;\n }\n .hero.is-success .nav-toggle:hover {\n background-color: rgba(10, 10, 10, 0.1);\n }\n .hero.is-success .nav-toggle.is-active span {\n background-color: #fff;\n }\n .hero.is-success .nav-menu .nav-item {\n border-top-color: rgba(255, 255, 255, 0.2);\n }\n}\n\n.hero.is-warning {\n background-color: #ffdd57;\n color: rgba(0, 0, 0, 0.7);\n}\n\n.hero.is-warning a:not(.button),\n.hero.is-warning strong {\n color: inherit;\n}\n\n.hero.is-warning .title {\n color: rgba(0, 0, 0, 0.7);\n}\n\n.hero.is-warning .subtitle {\n color: rgba(0, 0, 0, 0.9);\n}\n\n.hero.is-warning .subtitle a:not(.button),\n.hero.is-warning .subtitle strong {\n color: rgba(0, 0, 0, 0.7);\n}\n\n.hero.is-warning .nav {\n box-shadow: 0 1px 0 rgba(0, 0, 0, 0.2);\n}\n\n@media screen and (max-width: 768px) {\n .hero.is-warning .nav-menu {\n background-color: #ffdd57;\n }\n}\n\n.hero.is-warning a.nav-item,\n.hero.is-warning .nav-item a:not(.button) {\n color: rgba(0, 0, 0, 0.7);\n}\n\n.hero.is-warning a.nav-item:hover, .hero.is-warning a.nav-item.is-active,\n.hero.is-warning .nav-item a:not(.button):hover,\n.hero.is-warning .nav-item a:not(.button).is-active {\n color: rgba(0, 0, 0, 0.7);\n}\n\n.hero.is-warning .tabs a {\n color: rgba(0, 0, 0, 0.7);\n opacity: 0.9;\n}\n\n.hero.is-warning .tabs a:hover {\n opacity: 1;\n}\n\n.hero.is-warning .tabs li.is-active a {\n opacity: 1;\n}\n\n.hero.is-warning .tabs.is-boxed a, .hero.is-warning .tabs.is-toggle a {\n color: rgba(0, 0, 0, 0.7);\n}\n\n.hero.is-warning .tabs.is-boxed a:hover, .hero.is-warning .tabs.is-toggle a:hover {\n background-color: rgba(10, 10, 10, 0.1);\n}\n\n.hero.is-warning .tabs.is-boxed li.is-active a, .hero.is-warning .tabs.is-boxed li.is-active a:hover, .hero.is-warning .tabs.is-toggle li.is-active a, .hero.is-warning .tabs.is-toggle li.is-active a:hover {\n background-color: rgba(0, 0, 0, 0.7);\n border-color: rgba(0, 0, 0, 0.7);\n color: #ffdd57;\n}\n\n.hero.is-warning.is-bold {\n background-image: linear-gradient(141deg, #ffaf24 0%, #ffdd57 71%, #fffa70 100%);\n}\n\n@media screen and (max-width: 768px) {\n .hero.is-warning.is-bold .nav-menu {\n background-image: linear-gradient(141deg, #ffaf24 0%, #ffdd57 71%, #fffa70 100%);\n }\n}\n\n@media screen and (max-width: 768px) {\n .hero.is-warning .nav-toggle span {\n background-color: rgba(0, 0, 0, 0.7);\n }\n .hero.is-warning .nav-toggle:hover {\n background-color: rgba(10, 10, 10, 0.1);\n }\n .hero.is-warning .nav-toggle.is-active span {\n background-color: rgba(0, 0, 0, 0.7);\n }\n .hero.is-warning .nav-menu .nav-item {\n border-top-color: rgba(0, 0, 0, 0.2);\n }\n}\n\n.hero.is-danger {\n background-color: #ff3860;\n color: #fff;\n}\n\n.hero.is-danger a:not(.button),\n.hero.is-danger strong {\n color: inherit;\n}\n\n.hero.is-danger .title {\n color: #fff;\n}\n\n.hero.is-danger .subtitle {\n color: rgba(255, 255, 255, 0.9);\n}\n\n.hero.is-danger .subtitle a:not(.button),\n.hero.is-danger .subtitle strong {\n color: #fff;\n}\n\n.hero.is-danger .nav {\n box-shadow: 0 1px 0 rgba(255, 255, 255, 0.2);\n}\n\n@media screen and (max-width: 768px) {\n .hero.is-danger .nav-menu {\n background-color: #ff3860;\n }\n}\n\n.hero.is-danger a.nav-item,\n.hero.is-danger .nav-item a:not(.button) {\n color: rgba(255, 255, 255, 0.7);\n}\n\n.hero.is-danger a.nav-item:hover, .hero.is-danger a.nav-item.is-active,\n.hero.is-danger .nav-item a:not(.button):hover,\n.hero.is-danger .nav-item a:not(.button).is-active {\n color: #fff;\n}\n\n.hero.is-danger .tabs a {\n color: #fff;\n opacity: 0.9;\n}\n\n.hero.is-danger .tabs a:hover {\n opacity: 1;\n}\n\n.hero.is-danger .tabs li.is-active a {\n opacity: 1;\n}\n\n.hero.is-danger .tabs.is-boxed a, .hero.is-danger .tabs.is-toggle a {\n color: #fff;\n}\n\n.hero.is-danger .tabs.is-boxed a:hover, .hero.is-danger .tabs.is-toggle a:hover {\n background-color: rgba(10, 10, 10, 0.1);\n}\n\n.hero.is-danger .tabs.is-boxed li.is-active a, .hero.is-danger .tabs.is-boxed li.is-active a:hover, .hero.is-danger .tabs.is-toggle li.is-active a, .hero.is-danger .tabs.is-toggle li.is-active a:hover {\n background-color: #fff;\n border-color: #fff;\n color: #ff3860;\n}\n\n.hero.is-danger.is-bold {\n background-image: linear-gradient(141deg, #ff0561 0%, #ff3860 71%, #ff5257 100%);\n}\n\n@media screen and (max-width: 768px) {\n .hero.is-danger.is-bold .nav-menu {\n background-image: linear-gradient(141deg, #ff0561 0%, #ff3860 71%, #ff5257 100%);\n }\n}\n\n@media screen and (max-width: 768px) {\n .hero.is-danger .nav-toggle span {\n background-color: #fff;\n }\n .hero.is-danger .nav-toggle:hover {\n background-color: rgba(10, 10, 10, 0.1);\n }\n .hero.is-danger .nav-toggle.is-active span {\n background-color: #fff;\n }\n .hero.is-danger .nav-menu .nav-item {\n border-top-color: rgba(255, 255, 255, 0.2);\n }\n}\n\n@media screen and (min-width: 769px), print {\n .hero.is-medium .hero-body {\n padding-bottom: 9rem;\n padding-top: 9rem;\n }\n}\n\n@media screen and (min-width: 769px), print {\n .hero.is-large .hero-body {\n padding-bottom: 18rem;\n padding-top: 18rem;\n }\n}\n\n.hero.is-halfheight .hero-body, .hero.is-fullheight .hero-body {\n align-items: center;\n display: flex;\n}\n\n.hero.is-halfheight .hero-body > .container, .hero.is-fullheight .hero-body > .container {\n flex-grow: 1;\n flex-shrink: 1;\n}\n\n.hero.is-halfheight {\n min-height: 50vh;\n}\n\n.hero.is-fullheight {\n min-height: 100vh;\n}\n\n.hero-video {\n bottom: 0;\n left: 0;\n position: absolute;\n right: 0;\n top: 0;\n overflow: hidden;\n}\n\n.hero-video video {\n left: 50%;\n min-height: 100%;\n min-width: 100%;\n position: absolute;\n top: 50%;\n transform: translate3d(-50%, -50%, 0);\n}\n\n.hero-video.is-transparent {\n opacity: 0.3;\n}\n\n@media screen and (max-width: 768px) {\n .hero-video {\n display: none;\n }\n}\n\n.hero-buttons {\n margin-top: 1.5rem;\n}\n\n@media screen and (max-width: 768px) {\n .hero-buttons .button {\n display: flex;\n }\n .hero-buttons .button:not(:last-child) {\n margin-bottom: 0.75rem;\n }\n}\n\n@media screen and (min-width: 769px), print {\n .hero-buttons {\n display: flex;\n justify-content: center;\n }\n .hero-buttons .button:not(:last-child) {\n margin-right: 1.5rem;\n }\n}\n\n.hero-head,\n.hero-foot {\n flex-grow: 0;\n flex-shrink: 0;\n}\n\n.hero-body {\n flex-grow: 1;\n flex-shrink: 0;\n padding: 3rem 1.5rem;\n}\n\n.section {\n padding: 3rem 1.5rem;\n}\n\n@media screen and (min-width: 1008px) {\n .section.is-medium {\n padding: 9rem 1.5rem;\n }\n .section.is-large {\n padding: 18rem 1.5rem;\n }\n}\n\n.footer {\n background-color: whitesmoke;\n padding: 3rem 1.5rem 6rem;\n}\n\n.highlight {\n background-color: #f5f5f5;\n color: #586e75;\n}\n\n.highlight .c {\n color: #93a1a1;\n}\n\n.highlight .err,\n.highlight .g {\n color: #586e75;\n}\n\n.highlight .k {\n color: #859900;\n}\n\n.highlight .l,\n.highlight .n {\n color: #586e75;\n}\n\n.highlight .o {\n color: #859900;\n}\n\n.highlight .x {\n color: #cb4b16;\n}\n\n.highlight .p {\n color: #586e75;\n}\n\n.highlight .cm {\n color: #93a1a1;\n}\n\n.highlight .cp {\n color: #859900;\n}\n\n.highlight .c1 {\n color: #93a1a1;\n}\n\n.highlight .cs {\n color: #859900;\n}\n\n.highlight .gd {\n color: #2aa198;\n}\n\n.highlight .ge {\n color: #586e75;\n font-style: italic;\n}\n\n.highlight .gr {\n color: #dc322f;\n}\n\n.highlight .gh {\n color: #cb4b16;\n}\n\n.highlight .gi {\n color: #859900;\n}\n\n.highlight .go,\n.highlight .gp {\n color: #586e75;\n}\n\n.highlight .gs {\n color: #586e75;\n font-weight: bold;\n}\n\n.highlight .gu {\n color: #cb4b16;\n}\n\n.highlight .gt {\n color: #586e75;\n}\n\n.highlight .kc {\n color: #cb4b16;\n}\n\n.highlight .kd {\n color: #268bd2;\n}\n\n.highlight .kn,\n.highlight .kp {\n color: #859900;\n}\n\n.highlight .kr {\n color: #268bd2;\n}\n\n.highlight .kt {\n color: #dc322f;\n}\n\n.highlight .ld {\n color: #586e75;\n}\n\n.highlight .m,\n.highlight .s {\n color: #2aa198;\n}\n\n.highlight .na {\n color: #B58900;\n}\n\n.highlight .nb {\n color: #586e75;\n}\n\n.highlight .nc {\n color: #268bd2;\n}\n\n.highlight .no {\n color: #cb4b16;\n}\n\n.highlight .nd {\n color: #268bd2;\n}\n\n.highlight .ni,\n.highlight .ne {\n color: #cb4b16;\n}\n\n.highlight .nf {\n color: #268bd2;\n}\n\n.highlight .nl,\n.highlight .nn,\n.highlight .nx,\n.highlight .py {\n color: #586e75;\n}\n\n.highlight .nt,\n.highlight .nv {\n color: #268bd2;\n}\n\n.highlight .ow {\n color: #859900;\n}\n\n.highlight .w {\n color: #586e75;\n}\n\n.highlight .mf,\n.highlight .mh,\n.highlight .mi,\n.highlight .mo {\n color: #2aa198;\n}\n\n.highlight .sb {\n color: #93a1a1;\n}\n\n.highlight .sc {\n color: #2aa198;\n}\n\n.highlight .sd {\n color: #586e75;\n}\n\n.highlight .s2 {\n color: #2aa198;\n}\n\n.highlight .se {\n color: #cb4b16;\n}\n\n.highlight .sh {\n color: #586e75;\n}\n\n.highlight .si,\n.highlight .sx {\n color: #2aa198;\n}\n\n.highlight .sr {\n color: #dc322f;\n}\n\n.highlight .s1,\n.highlight .ss {\n color: #2aa198;\n}\n\n.highlight .bp,\n.highlight .vc,\n.highlight .vg,\n.highlight .vi {\n color: #268bd2;\n}\n\n.highlight .il {\n color: #2aa198;\n}\n\n.content .highlight {\n text-align: left;\n}\n\n@media screen and (min-width: 769px), print {\n .button small {\n color: #4a4a4a;\n left: 0;\n margin-top: 10px;\n position: absolute;\n top: 100%;\n width: 100%;\n }\n}\n\nbody.page-grid .column > .notification {\n padding-left: 0;\n padding-right: 0;\n text-align: center;\n}\n\n@media screen and (min-width: 769px), print {\n .header-item .button + .button {\n margin-left: 0.75rem;\n }\n}\n\nsvg {\n max-height: 100%;\n max-width: 100%;\n}\n\n#carbon {\n margin-left: auto;\n margin-right: auto;\n max-width: 340px;\n min-height: 150px;\n padding: 0;\n position: relative;\n}\n\n#carbon:hover {\n box-shadow: 0 2px 3px rgba(10, 10, 10, 0.1), 0 0 0 1px #00d1b2;\n}\n\n@media screen and (min-width: 769px), print {\n #carbon {\n width: 340px;\n }\n}\n\n#carbonads {\n font-size: 14px;\n text-align: left;\n}\n\n#carbonads a,\n#carbonads span {\n display: block;\n}\n\n#carbonads .carbon-wrap {\n position: relative;\n}\n\n#carbonads .carbon-img {\n background: whitesmoke;\n float: left;\n height: 100px;\n margin: 15px 0 15px 15px;\n width: 130px;\n}\n\n#carbonads .carbon-img img {\n display: block;\n height: 100px;\n width: 130px;\n}\n\n#carbonads .carbon-text {\n display: block;\n color: #363636;\n line-height: 20px;\n padding: 15px 15px 35px 160px;\n}\n\n#carbonads .carbon-poweredby {\n bottom: 0;\n color: #7a7a7a;\n font-size: 0.75rem;\n left: 160px;\n line-height: 20px;\n padding: 0 15px 10px 0;\n position: absolute;\n right: 0;\n}\n\n@keyframes floatUp {\n 0% {\n box-shadow: 0 0 0 rgba(10, 10, 10, 0), 0 0 0 rgba(10, 10, 10, 0), 0 0 0 rgba(10, 10, 10, 0);\n transform: scale(0.86);\n }\n 67% {\n box-shadow: 0 0 0 rgba(10, 10, 10, 0), 0 5px 10px rgba(10, 10, 10, 0.1), 0 1px 1px rgba(10, 10, 10, 0.2);\n transform: scale(1);\n }\n 100% {\n box-shadow: 0 20px 60px rgba(10, 10, 10, 0.05), 0 5px 10px rgba(10, 10, 10, 0.1), 0 1px 1px rgba(10, 10, 10, 0.2);\n transform: scale(1);\n }\n}\n\n@keyframes strokePath {\n from {\n stroke-dashoffset: 880;\n }\n to {\n stroke-dashoffset: 0;\n }\n}\n\n@keyframes fadeIn {\n from {\n opacity: 0;\n transform: scale(0.86);\n }\n to {\n opacity: 1;\n transform: scale(1);\n }\n}\n\n@keyframes fadeOut {\n 0% {\n opacity: 1;\n transform: scale(0.86);\n }\n 67% {\n opacity: 1;\n transform: scale(0.86);\n }\n 100% {\n opacity: 0;\n transform: scale(1);\n }\n}\n\n@keyframes slideDown {\n 0% {\n opacity: 0;\n transform: translateY(-10px);\n }\n 100% {\n opacity: 1;\n transform: translateY(0);\n }\n}\n\n@keyframes slideUp {\n 0% {\n opacity: 0;\n transform: translateY(10px);\n }\n 100% {\n opacity: 1;\n transform: translateY(0);\n }\n}\n\n#b {\n animation-duration: 1.5s;\n animation-fill-mode: both;\n animation-name: floatUp;\n animation-timing-function: cubic-bezier(0, 0.71, 0.29, 1);\n border-radius: 24px;\n display: inline-block;\n height: 240px;\n margin-bottom: 40px;\n position: relative;\n vertical-align: top;\n width: 240px;\n}\n\n#b svg {\n bottom: 0;\n left: 0;\n position: absolute;\n right: 0;\n top: 0;\n display: block;\n height: 240px;\n width: 240px;\n}\n\n#b svg:first-child {\n animation-duration: 1.5s;\n animation-fill-mode: both;\n animation-name: fadeOut;\n animation-timing-function: cubic-bezier(0, 0.71, 0.29, 1);\n}\n\n#b svg:first-child g {\n animation-duration: 1s;\n animation-fill-mode: both;\n animation-name: strokePath;\n animation-timing-function: cubic-bezier(0, 0.71, 0.29, 1);\n fill: none;\n stroke: #00d1b2;\n stroke-dasharray: 880;\n stroke-width: 2px;\n}\n\n#b svg:last-child {\n animation-delay: 1s;\n animation-duration: 1s;\n animation-fill-mode: both;\n animation-name: fadeIn;\n animation-timing-function: cubic-bezier(0, 0.71, 0.29, 1);\n}\n\n#b svg:last-child g {\n fill: #00d1b2;\n}\n\n@media screen and (max-width: 768px) {\n #b {\n border-radius: 16px;\n height: 160px;\n width: 160px;\n }\n}\n\n#bulma {\n animation: slideDown 500ms both;\n}\n\n#modern-framework {\n animation: slideUp 500ms both;\n animation-delay: 0.2s;\n}\n\n#npm {\n align-items: center;\n animation: fadeIn 500ms both;\n animation-delay: 0.4s;\n background: none;\n display: flex;\n justify-content: center;\n margin: -10px 0 20px;\n}\n\n#npm code {\n background: whitesmoke;\n border-radius: 3px;\n color: #00d1b2;\n display: inline-block;\n font-size: 16px;\n padding: 16px 32px;\n}\n\n#ghbtns {\n animation: slideDown 500ms both;\n animation-delay: 0.6s;\n}\n\nhtml.route-index #carbon {\n animation: slideUp 500ms both;\n animation-delay: 0.8s;\n}\n\n#download {\n animation: fadeIn 500ms both;\n animation-delay: 1s;\n}\n\n#grid .notification {\n padding-left: 0;\n padding-right: 0;\n}\n\n#message {\n display: none;\n}\n\n#tweet {\n background: white;\n border-radius: 5px;\n box-shadow: 0 2px 3px rgba(10, 10, 10, 0.1), 0 0 0 1px rgba(10, 10, 10, 0.1);\n padding: 1.5rem;\n}\n\n#github {\n color: #333333;\n border-color: #333333;\n}\n\n#github:hover {\n background: #333333;\n border-color: #333333;\n color: white;\n}\n\n.tw-button {\n background-color: #55acee;\n color: white;\n border-color: transparent !important;\n}\n\n.tw-button:hover {\n background-color: #49a6ed;\n color: white;\n}\n\n.tw-button:active, .tw-button:focus {\n background-color: #3ea1ec;\n color: white;\n}\n\n@media screen and (min-width: 1008px) {\n #blogDropdown {\n width: 16rem;\n }\n #blogDropdown .navbar-item {\n white-space: normal;\n }\n #moreDropdown {\n width: 16rem;\n }\n #moreDropdown .navbar-item {\n padding-right: 1rem;\n }\n #moreDropdown .navbar-item .level {\n flex-grow: 1;\n }\n}\n\n#about .twitter-container {\n display: block;\n height: 30px;\n line-height: 30px;\n margin-top: 5px;\n}\n\n#about small {\n display: block;\n margin-top: 5px;\n}\n\n#mc_embed_signup .field {\n margin-bottom: 0;\n}\n\n#mc_embed_signup .notification {\n margin-top: 0.75rem;\n}\n\n#share form {\n height: 30px;\n margin-top: 10px;\n}\n\n#social {\n align-items: center;\n display: flex;\n flex-wrap: wrap;\n justify-content: flex-start;\n}\n\n#social > iframe,\n#social > a,\n#social > form,\n#social > div {\n display: inline-block;\n font-size: 11px;\n height: 30px;\n line-height: 30px;\n margin-top: 5px;\n}\n\n#social .github-btn {\n width: 160px;\n}\n\n#social .twitter-share-button {\n margin-right: 10px;\n min-width: 76px;\n}\n\n#social .paypal-form {\n min-width: 148px;\n}\n\n#social .fb-like {\n align-items: center;\n display: flex;\n width: 130px;\n}\n\n#newsletter .input {\n border-color: white;\n box-shadow: none;\n}\n\n#sister ul {\n display: flex;\n flex-wrap: wrap;\n}\n\n#sister li {\n display: flex;\n height: 30px;\n margin: 5px 1rem 0 0;\n}\n\n#sister img {\n height: 30px;\n}\n\n#tsp small {\n display: block;\n}\n\n#alternative {\n font-size: 0.875rem;\n}\n\n#alternative a {\n color: #7a7a7a;\n}\n\n#alternative a:hover {\n text-decoration: underline;\n}\n\n#images tr td:nth-child(2) {\n width: 320px;\n}\n\n.color {\n border-radius: 2px;\n box-shadow: 0 2px 3px 0 rgba(0, 0, 0, 0.1), inset 0 0 0 1px rgba(0, 0, 0, 0.1);\n display: inline-block;\n float: left;\n height: 24px;\n margin-right: 8px;\n width: 24px;\n}\n\n.button.is-rss {\n background-color: #f26522;\n border-color: transparent;\n color: #fff;\n}\n\n.button.is-rss:hover {\n background-color: #ed560e;\n}\n\n.button.is-rss:active {\n background-color: #d54d0d;\n}\n\n.view-all-versions {\n color: #7a7a7a;\n}\n\n.view-all-versions:hover {\n text-decoration: underline;\n}\n\n.feature-title {\n color: #7a7a7a;\n}\n\n.feature-title a {\n border-bottom: 1px solid transparent;\n color: #363636;\n}\n\n.feature-title a:hover {\n border-bottom-color: #00d1b2;\n}\n\n.anchor-title {\n padding-top: 1.5rem;\n position: relative;\n}\n\n@media screen and (max-width: 1199px) {\n .anchor-title {\n padding-left: 2rem;\n }\n}\n\n.anchor-link {\n position: absolute;\n right: calc(100% + 1rem);\n}\n\n@media screen and (max-width: 1199px) {\n .anchor-link {\n left: 0;\n right: auto;\n }\n}\n\n.article-image {\n background-color: #00d1b2;\n display: block;\n height: 240px;\n margin-left: auto;\n margin-right: auto;\n position: relative;\n text-align: center;\n}\n\n.article-image.is-white {\n background-color: white;\n}\n\n.article-image.is-black {\n background-color: #0a0a0a;\n}\n\n.article-image.is-light {\n background-color: whitesmoke;\n}\n\n.article-image.is-dark {\n background-color: #363636;\n}\n\n.article-image.is-primary {\n background-color: #00d1b2;\n}\n\n.article-image.is-info {\n background-color: #3273dc;\n}\n\n.article-image.is-success {\n background-color: #23d160;\n}\n\n.article-image.is-warning {\n background-color: #ffdd57;\n}\n\n.article-image.is-danger {\n background-color: #ff3860;\n}\n\n.article-image.is-bootstrap {\n background-color: #6f5499;\n}\n\n.article-image.is-orange {\n background-color: #ff470f;\n}\n\n.article-image:hover .article-overlay {\n opacity: 0.25;\n}\n\n.article-image:hover .article-icon {\n transform: scale(1.4);\n}\n\n.article-image:hover .article-date {\n transform: scale(0.9);\n}\n\n.article-image:hover .article-title {\n transform: scale(1.1);\n}\n\n.article-image.is-single {\n margin-bottom: 2rem;\n width: 100%;\n}\n\n.article-overlay {\n bottom: 0;\n left: 0;\n position: absolute;\n right: 0;\n top: 0;\n background-color: #0a0a0a;\n opacity: 0;\n transition-duration: 86ms;\n transition-property: opacity;\n transition-timing-function: ease-out;\n}\n\n.article-icon,\n.article-info {\n bottom: 0;\n left: 0;\n position: absolute;\n right: 0;\n top: 0;\n align-items: center;\n display: flex;\n justify-content: center;\n}\n\n.article-icon,\n.article-date,\n.article-title {\n transition-duration: 86ms;\n transition-property: transform;\n transition-timing-function: ease-out;\n}\n\n.article-icon {\n color: #0a0a0a;\n opacity: 0.25;\n}\n\n.article-icon > span {\n display: block;\n}\n\n.article-icon .fa {\n font-size: 56px;\n}\n\n.article-info {\n padding: 20px;\n}\n\n.article-date {\n color: rgba(0, 0, 0, 0.5);\n display: block;\n}\n\n.article-title {\n color: white;\n display: block;\n font-size: 2.5rem;\n font-weight: 700;\n line-height: 1.25;\n padding: 0 20px;\n}\n\n.emoji {\n margin-right: 0.5em;\n margin-top: 2px;\n}\n\n.example,\n.structure {\n border: 1px solid #ffdd57;\n border-top-right-radius: 3px;\n color: rgba(0, 0, 0, 0.7);\n padding: 1.5rem;\n position: relative;\n}\n\n.example:not(:first-child),\n.structure:not(:first-child) {\n margin-top: 2rem;\n}\n\n.example:not(:last-child),\n.structure:not(:last-child) {\n margin-bottom: 1.5rem;\n}\n\n.example:before,\n.structure:before {\n background: #ffdd57;\n border-radius: 3px 3px 0 0;\n bottom: 100%;\n content: \"Example\";\n display: inline-block;\n font-size: 7px;\n font-weight: bold;\n left: -1px;\n letter-spacing: 1px;\n padding: 3px 5px;\n position: absolute;\n text-transform: uppercase;\n vertical-align: top;\n}\n\n@media screen and (min-width: 769px), print {\n .example.is-fullwidth,\n .structure.is-fullwidth {\n border-left: none;\n border-right: none;\n padding: 0;\n }\n}\n\n.example + .highlight {\n border: 1px solid #ffdd57;\n border-radius: 0 0 3px 3px;\n border-top: none;\n margin-top: -1.5rem;\n}\n\n.example + .highlight:not(:last-child) {\n margin-bottom: 1.5rem;\n}\n\n.highlight pre {\n max-height: 480px;\n margin-bottom: 0 !important;\n padding: 0;\n}\n\n.highlight pre code {\n padding: 1.25em 1.5em;\n}\n\n.highlight-full .highlight pre,\n#navbarJsExample .highlight pre {\n max-height: none;\n}\n\n.structure {\n border-color: #ff3860;\n border-radius: 3px;\n padding: 1.5rem;\n}\n\n.structure:before {\n background: #ff3860;\n color: #fff;\n content: \"Structure\";\n}\n\n.structure-item {\n position: relative;\n}\n\n.structure-item:before {\n bottom: 0;\n left: 0;\n position: absolute;\n right: 0;\n top: 0;\n background: rgba(10, 10, 10, 0.7);\n background: whitesmoke;\n border: 1px solid #dbdbdb;\n content: \"\";\n display: block;\n z-index: 1;\n}\n\n.structure-item:after {\n bottom: 0;\n left: 0;\n position: absolute;\n right: 0;\n top: 0;\n align-items: center;\n content: attr(title);\n display: flex;\n font-family: monospace;\n font-size: 11px;\n justify-content: center;\n padding: 3px 5px;\n z-index: 2;\n}\n\n.structure-item.is-structure-container {\n padding: 1.5rem 0.75rem 0.75rem;\n}\n\n.structure-item.is-structure-container:after {\n align-items: flex-start;\n justify-content: flex-start;\n padding: 0.5rem 0.75rem;\n}\n\n.highlight {\n position: relative;\n}\n\n.highlight .copy,\n.highlight .expand {\n -webkit-touch-callout: none;\n -webkit-user-select: none;\n -moz-user-select: none;\n -ms-user-select: none;\n user-select: none;\n background: white;\n border: solid #dbdbdb;\n border-width: 0 0 1px 1px;\n color: #7a7a7a;\n cursor: pointer;\n outline: none;\n position: absolute;\n right: 0;\n top: 0;\n}\n\n.highlight .copy:hover,\n.highlight .expand:hover {\n border-color: #ff3860;\n color: #ff3860;\n}\n\n.highlight .expand {\n border-right-width: 1px;\n right: 50px;\n}\n\n@media screen and (min-width: 769px), print {\n .highlight pre {\n white-space: pre-wrap;\n }\n}\n\n@media screen and (min-width: 769px), print {\n .section:not(.is-fullwidth) > .example:not(.is-fullwidth) {\n margin-left: 1.5rem;\n margin-right: 1.5rem;\n }\n .section:not(.is-fullwidth) > .example:not(.is-fullwidth) + .highlight {\n margin-left: 1.5rem;\n margin-right: 1.5rem;\n }\n}\n\n.section.is-fullwidth {\n padding: 0 !important;\n}\n\n.section.is-fullwidth .example {\n border-left: none;\n border-radius: 0;\n border-right: none;\n padding: 0;\n}\n\n.section.is-fullwidth .example + .highlight {\n border-left: none;\n border-radius: 0;\n border-right: none;\n}\n\n.callout {\n background-color: whitesmoke;\n border-radius: 3px;\n padding: 1.25rem 2.5rem 1.25rem 1.5rem;\n position: relative;\n}\n\n.callout:not(:last-child) {\n margin-bottom: 1.5rem;\n}\n\n.callout.is-white {\n background-color: white;\n color: #0a0a0a;\n}\n\n.callout.is-black {\n background-color: #0a0a0a;\n color: white;\n}\n\n.callout.is-light {\n background-color: whitesmoke;\n color: #363636;\n}\n\n.callout.is-dark {\n background-color: #363636;\n color: whitesmoke;\n}\n\n.callout.is-primary {\n background-color: #00d1b2;\n color: #fff;\n}\n\n.callout.is-info {\n background-color: #3273dc;\n color: #fff;\n}\n\n.callout.is-success {\n background-color: #23d160;\n color: #fff;\n}\n\n.callout.is-warning {\n background-color: #ffdd57;\n color: rgba(0, 0, 0, 0.7);\n}\n\n.callout.is-danger {\n background-color: #ff3860;\n color: #fff;\n}\n\n.bsa {\n padding: 2rem;\n}\n\n.bsa-cpc {\n min-height: 1px;\n}\n\n#_default_ .default-ad {\n background-color: rgba(0, 0, 0, 0.3);\n border-radius: 2px;\n color: white;\n display: inline-block;\n font-size: 10px;\n font-weight: bold;\n padding: 0 4px;\n text-transform: uppercase;\n vertical-align: top;\n}\n\n#_default_ > a {\n background-color: white;\n border-radius: 5px;\n box-shadow: 0 2px 3px rgba(10, 10, 10, 0.1), 0 0 0 1px rgba(10, 10, 10, 0.1);\n color: #4a4a4a;\n display: block;\n line-height: 1.375;\n margin-top: 15px;\n min-height: 70px;\n padding: 15px;\n padding-left: 70px;\n position: relative;\n}\n\n#_default_ > a:hover, #_default_ > a:focus {\n box-shadow: 0 2px 3px rgba(10, 10, 10, 0.1), 0 0 0 1px #00d1b2;\n}\n\n#_default_ > a:active {\n box-shadow: inset 0 1px 2px rgba(10, 10, 10, 0.2), 0 0 0 1px #00d1b2;\n}\n\n#_default_ > a span {\n display: block;\n}\n\n#_default_ > a .default-image {\n display: block;\n left: 15px;\n height: 40px;\n position: absolute;\n top: 15px;\n width: 40px;\n}\n\n#_default_ > a .default-image img {\n display: block;\n height: 40px;\n width: 40px;\n}\n\n#_default_ > a .default-title {\n color: #363636;\n display: inline;\n font-weight: 700;\n}\n\n#_default_ > a .default-title:after {\n content: \" — \";\n}\n\n#_default_ > a .default-description {\n display: inline;\n}\n\n@media screen and (min-width: 769px), print {\n .bsa .columns {\n min-height: 120px;\n }\n #_default_ {\n display: flex;\n justify-content: center;\n position: relative;\n }\n #_default_ .default-ad {\n left: 100%;\n margin-left: 2rem;\n position: absolute;\n top: 0;\n }\n #_default_ > a {\n margin: 0;\n width: calc(50% - 1rem);\n }\n #_default_ > a:not(:nth-child(2)) {\n margin-left: 2rem;\n }\n}\n\nhtml.route-index .title.is-2 {\n position: relative;\n}\n\nhtml.route-index .title.is-2 a {\n color: #242424;\n position: relative;\n}\n\nhtml.route-index .title.is-2 a:hover {\n color: #00d1b2;\n}\n\nhtml.route-index .title.is-2 .icon.is-medium {\n left: -80px;\n opacity: 0.1;\n position: absolute;\n top: 10px;\n}\n\nhtml.route-index .title.is-2 .icon.is-medium .fa {\n font-size: 56px;\n}\n\nhtml.route-index .hero .title.is-2 a {\n color: white;\n}\n\nhtml.route-index .hero .title.is-2 a:hover {\n color: white;\n}\n\nhtml.route-index .hero.is-primary a.column,\nhtml.route-index .hero.is-primary a.column:hover {\n color: white;\n}\n\nhtml.route-index .hero.is-primary a.column:hover .title strong {\n border-bottom: 1px solid;\n}\n\n@media screen and (max-width: 979px) {\n html.route-index .title.is-2 a {\n padding-left: 0;\n }\n html.route-index .title.is-2 .icon.is-medium {\n display: none;\n }\n}\n\n.tws {\n display: flex;\n flex-wrap: wrap;\n overflow: auto;\n padding: 20px;\n}\n\n.tw {\n color: #697882;\n flex-shrink: 0;\n font-family: Helvetica, Roboto, \"Segoe UI\", Calibri, sans-serif;\n font-size: 16px;\n line-height: 1.4;\n padding: 10px;\n width: 520px;\n}\n\n.tw a {\n color: currentColor;\n}\n\n.tw p {\n color: #1c2022;\n font-size: 16px;\n margin-bottom: 3.2px;\n}\n\n.tw p a {\n color: #2b7bb9;\n}\n\n.twitter-tweet:not(.twitter-tweet-rendered) {\n background-color: white;\n border: 1px solid #e1e8ed;\n border-radius: 5px;\n color: #697882;\n font-size: 14px;\n padding: 20px 20px 11.6px;\n}\n\n.twitter-tweet:not(.twitter-tweet-rendered) a {\n color: currentColor;\n}\n\n.twitter-tweet:not(.twitter-tweet-rendered) a:hover {\n text-decoration: underline;\n}\n\n.twitter-tweet:not(.twitter-tweet-rendered) p {\n color: #1c2022;\n font-size: 16px;\n margin-bottom: 3.2px;\n}\n\n.twitter-tweet:not(.twitter-tweet-rendered) p a {\n color: #2b7bb9;\n}\n\n.twitter-tweet-rendered {\n border: none;\n border-radius: 0;\n margin: 0 !important;\n padding: 0 !important;\n}\n\n.expo {\n background-color: whitesmoke;\n background-color: white;\n padding: 1.5rem;\n}\n\n.website {\n display: block;\n position: relative;\n text-align: center;\n}\n\n.website:last-child {\n margin-bottom: 0;\n}\n\n.website-image {\n align-items: center;\n display: flex;\n justify-content: center;\n margin-bottom: 1.5rem;\n position: relative;\n}\n\n.website-image:hover .website-overlay {\n opacity: 0.25;\n}\n\n.website-overlay {\n background-color: #0a0a0a;\n opacity: 0;\n transition: opacity 200ms ease-out;\n}\n\n@media screen and (max-width: 768px) {\n .website:not(:last-child) {\n margin-bottom: 1.5rem;\n }\n}\n\n@media screen and (min-width: 769px), print {\n .expo {\n padding-bottom: 3rem;\n padding-top: 3rem;\n }\n .websites {\n display: flex;\n flex-wrap: wrap;\n justify-content: space-between;\n }\n .website {\n margin-top: 3rem;\n width: calc(50% - 3rem);\n }\n .website:nth-child(1), .website:nth-child(2) {\n margin-top: 0;\n }\n .website.is-highlighted {\n width: 100%;\n }\n .website-image {\n margin-bottom: 3rem;\n }\n}\n\n.testimonials {\n background-color: whitesmoke;\n}\n\n.testimonial {\n align-items: flex-start;\n display: flex;\n justify-content: center;\n}\n\n.more-loves {\n align-items: center;\n display: flex;\n justify-content: center;\n margin-top: 1.5rem;\n text-align: center;\n}\n\n.more-loves .button {\n height: auto;\n padding: 0.75em 1.5em;\n}\n\n.more-loves .button span {\n transform-origin: center center;\n transition: transform 86ms ease-out;\n}\n\n.more-loves .button:hover span {\n transform: scale(1.04);\n}\n\n@media screen and (max-width: 768px) {\n .testimonials {\n padding: 1.5rem;\n }\n .testimonial {\n margin-bottom: 1.5rem;\n }\n}\n\n@media screen and (min-width: 769px), print {\n .testimonials {\n padding: 3rem;\n }\n .testimonial + .testimonial {\n margin-top: 1.5rem;\n }\n}\n\n@media screen and (min-width: 1008px) {\n .testimonials {\n min-height: 595px;\n }\n}\n\n@media screen and (min-width: 1200px) {\n .testimonials {\n min-height: 653px;\n }\n}\n\n@media screen and (min-width: 1392px) {\n .testimonials {\n min-height: 632px;\n }\n}\n\n.rainbow {\n animation: rainbow 8s ease infinite;\n background-image: linear-gradient(124deg, #ff470f, #ff3860, #b86bff, #3273dc);\n background-size: 800% 800%;\n}\n\n.hero.is-love .title,\n.hero.is-love .subtitle {\n color: white;\n}\n\n@keyframes rainbow {\n 0% {\n background-position: 0% 80%;\n }\n 50% {\n background-position: 100% 20%;\n }\n 100% {\n background-position: 0% 80%;\n }\n}\n\n.hug {\n align-items: flex-start;\n display: flex;\n justify-content: center;\n}\n\n.embrace {\n background-color: whitesmoke;\n border-radius: 3px;\n padding: 1.5rem;\n}\n\n@media screen and (max-width: 768px) {\n .love {\n padding: 1.5rem;\n }\n .hug {\n margin: 1.5rem;\n }\n .embrace {\n text-align: center;\n }\n .embrace:not(:first-child) {\n margin-top: 1.5rem;\n }\n .embrace:not(:last-child) {\n margin-bottom: 1.5rem;\n }\n .embrace-button {\n margin-top: 0.75rem;\n }\n}\n\n@media screen and (min-width: 769px), print {\n .love {\n padding-bottom: 3rem;\n padding-top: 3rem;\n }\n .embrace {\n align-items: center;\n display: flex;\n justify-content: center;\n }\n .embrace:not(:first-child) {\n margin-top: 3rem;\n }\n .embrace:not(:last-child) {\n margin-bottom: 3rem;\n }\n .embrace-button {\n margin-left: 1.5rem;\n }\n .hugs {\n display: flex;\n flex-wrap: wrap;\n padding-bottom: 3rem;\n }\n .hug {\n margin-top: 1.5rem;\n width: calc(33.3333% - 1rem);\n }\n .hug:nth-child(1), .hug:nth-child(2), .hug:nth-child(3) {\n margin-top: 0;\n }\n .hug:nth-child(3n-1), .hug:nth-child(3n) {\n margin-left: 1.5rem;\n }\n}\n\n.bootstrap .hero {\n background-color: #6f5499;\n color: #fff;\n}\n\n.bootstrap .hero .title,\n.bootstrap .hero .subtitle {\n color: currentColor;\n}\n\n.bootstrap .hero .subtitle {\n color: rgba(255, 255, 255, 0.5);\n}\n\n.bootstrap .hero .subtitle a {\n border-bottom: 1px solid currentColor;\n color: currentColor;\n}\n\n.bootstrap .hero .subtitle a:hover {\n color: #fff;\n}\n\n.pros-heading {\n padding: 0 2rem;\n text-align: center;\n}\n\n.pros-icon {\n margin-bottom: 3rem;\n text-align: center;\n}\n\n.pros-icon svg {\n height: 3rem;\n width: auto;\n}\n\n.pros-list {\n margin: 0 auto;\n max-width: 540px;\n}\n\n.pro .icon {\n position: relative;\n top: -1px;\n}\n\n.pro .title {\n margin-bottom: 0.5rem;\n}\n\n.pro + .pro {\n margin-top: 2rem;\n padding-top: 2rem;\n}\n\n.pro-content p:not(:last-child) {\n margin-bottom: 0.5rem;\n}\n\n.pro.is-bulma .icon {\n color: #00d1b2;\n}\n\n.pro.is-bootstrap .icon {\n color: #6f5499;\n}\n\n.separator {\n color: #dbdbdb;\n margin: 0 0.25em;\n}\n\n.comparison {\n margin: 0 auto;\n max-width: 42rem;\n}\n\n.comparison .table {\n color: #ff3860;\n}\n\n.comparison .table thead th,\n.comparison .table tfoot th {\n font-size: 1.5rem;\n text-align: center;\n}\n\n.comparison .table thead svg,\n.comparison .table tfoot svg {\n height: 1.5rem;\n margin-right: 1rem;\n position: relative;\n top: 0.25rem;\n width: auto;\n}\n\n.comparison .table tbody th {\n font-size: 1.25rem;\n text-align: center;\n}\n\n.comparison .table tbody td {\n font-family: monospace;\n width: 50%;\n}\n\n.comparison .table tbody a {\n color: currentColor;\n}\n\n.comparison .table tbody a:hover {\n text-decoration: underline;\n}\n\n.comparison .table .is-empty {\n background-color: whitesmoke;\n color: #7a7a7a;\n}\n\n.comparison .table .is-unique {\n background-color: rgba(35, 209, 96, 0.25);\n color: #363636;\n font-weight: 700;\n}\n\n.comparison-header {\n margin-bottom: 3rem;\n}\n\n:root {\n --primary: #00d1b2;\n --gap: 0.75rem;\n}\n\nhtml ::-moz-selection {\n background: #00d1b2;\n color: #fff;\n}\n\nhtml ::selection {\n background: #00d1b2;\n color: #fff;\n}\n"]}
\ No newline at end of file
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/docs/docker-compose.yml b/hshassets/assets/sass/lib/bulma-0.5.1/docs/docker-compose.yml
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/docs/docker-compose.yml
rename to hshassets/assets/sass/lib/bulma-0.5.1/docs/docker-compose.yml
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/docs/documentation/components/breadcrumb.html b/hshassets/assets/sass/lib/bulma-0.5.1/docs/documentation/components/breadcrumb.html
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/docs/documentation/components/breadcrumb.html
rename to hshassets/assets/sass/lib/bulma-0.5.1/docs/documentation/components/breadcrumb.html
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/docs/documentation/components/card.html b/hshassets/assets/sass/lib/bulma-0.5.1/docs/documentation/components/card.html
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/docs/documentation/components/card.html
rename to hshassets/assets/sass/lib/bulma-0.5.1/docs/documentation/components/card.html
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/docs/documentation/components/dropdown.html b/hshassets/assets/sass/lib/bulma-0.5.1/docs/documentation/components/dropdown.html
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/docs/documentation/components/dropdown.html
rename to hshassets/assets/sass/lib/bulma-0.5.1/docs/documentation/components/dropdown.html
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/docs/documentation/components/level.html b/hshassets/assets/sass/lib/bulma-0.5.1/docs/documentation/components/level.html
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/docs/documentation/components/level.html
rename to hshassets/assets/sass/lib/bulma-0.5.1/docs/documentation/components/level.html
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/docs/documentation/components/media-object.html b/hshassets/assets/sass/lib/bulma-0.5.1/docs/documentation/components/media-object.html
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/docs/documentation/components/media-object.html
rename to hshassets/assets/sass/lib/bulma-0.5.1/docs/documentation/components/media-object.html
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/docs/documentation/components/menu.html b/hshassets/assets/sass/lib/bulma-0.5.1/docs/documentation/components/menu.html
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/docs/documentation/components/menu.html
rename to hshassets/assets/sass/lib/bulma-0.5.1/docs/documentation/components/menu.html
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/docs/documentation/components/message.html b/hshassets/assets/sass/lib/bulma-0.5.1/docs/documentation/components/message.html
similarity index 95%
rename from hshassets/assets/sass/lib/bulma-0.5.0/docs/documentation/components/message.html
rename to hshassets/assets/sass/lib/bulma-0.5.1/docs/documentation/components/message.html
index aac9f5f908353560d92e6c26941d9b5661a8cdd6..304fd1211d829e8ddd10e66116dfcb64f799540e 100644
--- a/hshassets/assets/sass/lib/bulma-0.5.0/docs/documentation/components/message.html
+++ b/hshassets/assets/sass/lib/bulma-0.5.1/docs/documentation/components/message.html
@@ -33,7 +33,7 @@ variables:
<article class="message">
<div class="message-header">
<p>Hello World</p>
- <button class="delete"></button>
+ <button class="delete" aria-label="delete"></button>
</div>
<div class="message-body">
Lorem ipsum dolor sit amet, consectetur adipiscing elit. <strong>Pellentesque risus mi</strong>, tempus quis placerat ut, porta nec nulla. Vestibulum rhoncus ac ex sit amet fringilla. Nullam gravida purus diam, et dictum <a>felis venenatis</a> efficitur. Aenean ac <em>eleifend lacus</em>, in mollis lectus. Donec sodales, arcu et sollicitudin porttitor, tortor urna tempor ligula, id porttitor mi magna a neque. Donec dui urna, vehicula et sem eget, facilisis sodales sem.
@@ -45,7 +45,7 @@ variables:
<article class="message is-dark">
<div class="message-header">
<p>Dark</p>
- <button class="delete"></button>
+ <button class="delete" aria-label="delete"></button>
</div>
<div class="message-body">
Lorem ipsum dolor sit amet, consectetur adipiscing elit. <strong>Pellentesque risus mi</strong>, tempus quis placerat ut, porta nec nulla. Vestibulum rhoncus ac ex sit amet fringilla. Nullam gravida purus diam, et dictum <a>felis venenatis</a> efficitur. Aenean ac <em>eleifend lacus</em>, in mollis lectus. Donec sodales, arcu et sollicitudin porttitor, tortor urna tempor ligula, id porttitor mi magna a neque. Donec dui urna, vehicula et sem eget, facilisis sodales sem.
@@ -54,7 +54,7 @@ variables:
<article class="message is-primary">
<div class="message-header">
<p>Primary</p>
- <button class="delete"></button>
+ <button class="delete" aria-label="delete"></button>
</div>
<div class="message-body">
Lorem ipsum dolor sit amet, consectetur adipiscing elit. <strong>Pellentesque risus mi</strong>, tempus quis placerat ut, porta nec nulla. Vestibulum rhoncus ac ex sit amet fringilla. Nullam gravida purus diam, et dictum <a>felis venenatis</a> efficitur. Aenean ac <em>eleifend lacus</em>, in mollis lectus. Donec sodales, arcu et sollicitudin porttitor, tortor urna tempor ligula, id porttitor mi magna a neque. Donec dui urna, vehicula et sem eget, facilisis sodales sem.
@@ -63,7 +63,7 @@ variables:
<article class="message is-info">
<div class="message-header">
<p>Info</p>
- <button class="delete"></button>
+ <button class="delete" aria-label="delete"></button>
</div>
<div class="message-body">
Lorem ipsum dolor sit amet, consectetur adipiscing elit. <strong>Pellentesque risus mi</strong>, tempus quis placerat ut, porta nec nulla. Vestibulum rhoncus ac ex sit amet fringilla. Nullam gravida purus diam, et dictum <a>felis venenatis</a> efficitur. Aenean ac <em>eleifend lacus</em>, in mollis lectus. Donec sodales, arcu et sollicitudin porttitor, tortor urna tempor ligula, id porttitor mi magna a neque. Donec dui urna, vehicula et sem eget, facilisis sodales sem.
@@ -72,7 +72,7 @@ variables:
<article class="message is-success">
<div class="message-header">
<p>Success</p>
- <button class="delete"></button>
+ <button class="delete" aria-label="delete"></button>
</div>
<div class="message-body">
Lorem ipsum dolor sit amet, consectetur adipiscing elit. <strong>Pellentesque risus mi</strong>, tempus quis placerat ut, porta nec nulla. Vestibulum rhoncus ac ex sit amet fringilla. Nullam gravida purus diam, et dictum <a>felis venenatis</a> efficitur. Aenean ac <em>eleifend lacus</em>, in mollis lectus. Donec sodales, arcu et sollicitudin porttitor, tortor urna tempor ligula, id porttitor mi magna a neque. Donec dui urna, vehicula et sem eget, facilisis sodales sem.
@@ -81,7 +81,7 @@ variables:
<article class="message is-warning">
<div class="message-header">
<p>Warning</p>
- <button class="delete"></button>
+ <button class="delete" aria-label="delete"></button>
</div>
<div class="message-body">
Lorem ipsum dolor sit amet, consectetur adipiscing elit. <strong>Pellentesque risus mi</strong>, tempus quis placerat ut, porta nec nulla. Vestibulum rhoncus ac ex sit amet fringilla. Nullam gravida purus diam, et dictum <a>felis venenatis</a> efficitur. Aenean ac <em>eleifend lacus</em>, in mollis lectus. Donec sodales, arcu et sollicitudin porttitor, tortor urna tempor ligula, id porttitor mi magna a neque. Donec dui urna, vehicula et sem eget, facilisis sodales sem.
@@ -90,7 +90,7 @@ variables:
<article class="message is-danger">
<div class="message-header">
<p><strong>Danger</strong>! <a>Learn more</a></p>
- <button class="delete"></button>
+ <button class="delete" aria-label="delete"></button>
</div>
<div class="message-body">
Lorem ipsum dolor sit amet, consectetur adipiscing elit. <strong>Pellentesque risus mi</strong>, tempus quis placerat ut, porta nec nulla. Vestibulum rhoncus ac ex sit amet fringilla. Nullam gravida purus diam, et dictum <a>felis venenatis</a> efficitur. Aenean ac <em>eleifend lacus</em>, in mollis lectus. Donec sodales, arcu et sollicitudin porttitor, tortor urna tempor ligula, id porttitor mi magna a neque. Donec dui urna, vehicula et sem eget, facilisis sodales sem.
@@ -102,7 +102,7 @@ variables:
<article class="message is-small">
<div class="message-header">
<p>Small message</p>
- <button class="delete is-small"></button>
+ <button class="delete is-small" aria-label="delete"></button>
</div>
<div class="message-body">
Lorem ipsum dolor sit amet, consectetur adipiscing elit. <strong>Pellentesque risus mi</strong>, tempus quis placerat ut, porta nec nulla.Nullam gravida purus diam, et dictum <a>felis venenatis</a> efficitur. Aenean ac <em>eleifend lacus</em>, in mollis lectus.
@@ -114,7 +114,7 @@ variables:
<article class="message">
<div class="message-header">
<p>Normal message</p>
- <button class="delete"></button>
+ <button class="delete" aria-label="delete"></button>
</div>
<div class="message-body">
Lorem ipsum dolor sit amet, consectetur adipiscing elit. <strong>Pellentesque risus mi</strong>, tempus quis placerat ut, porta nec nulla.Nullam gravida purus diam, et dictum <a>felis venenatis</a> efficitur. Aenean ac <em>eleifend lacus</em>, in mollis lectus.
@@ -126,7 +126,7 @@ variables:
<article class="message is-medium">
<div class="message-header">
<p>Medium message</p>
- <button class="delete is-medium"></button>
+ <button class="delete is-medium" aria-label="delete"></button>
</div>
<div class="message-body">
Lorem ipsum dolor sit amet, consectetur adipiscing elit. <strong>Pellentesque risus mi</strong>, tempus quis placerat ut, porta nec nulla.Nullam gravida purus diam, et dictum <a>felis venenatis</a> efficitur. Aenean ac <em>eleifend lacus</em>, in mollis lectus.
@@ -138,7 +138,7 @@ variables:
<article class="message is-large">
<div class="message-header">
<p>Large message</p>
- <button class="delete is-large"></button>
+ <button class="delete is-large" aria-label="delete"></button>
</div>
<div class="message-body">
Lorem ipsum dolor sit amet, consectetur adipiscing elit. <strong>Pellentesque risus mi</strong>, tempus quis placerat ut, porta nec nulla.Nullam gravida purus diam, et dictum <a>felis venenatis</a> efficitur. Aenean ac <em>eleifend lacus</em>, in mollis lectus.
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/docs/documentation/components/modal.html b/hshassets/assets/sass/lib/bulma-0.5.1/docs/documentation/components/modal.html
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/docs/documentation/components/modal.html
rename to hshassets/assets/sass/lib/bulma-0.5.1/docs/documentation/components/modal.html
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/docs/documentation/components/nav.html b/hshassets/assets/sass/lib/bulma-0.5.1/docs/documentation/components/nav.html
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/docs/documentation/components/nav.html
rename to hshassets/assets/sass/lib/bulma-0.5.1/docs/documentation/components/nav.html
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/docs/documentation/components/navbar.html b/hshassets/assets/sass/lib/bulma-0.5.1/docs/documentation/components/navbar.html
similarity index 87%
rename from hshassets/assets/sass/lib/bulma-0.5.0/docs/documentation/components/navbar.html
rename to hshassets/assets/sass/lib/bulma-0.5.1/docs/documentation/components/navbar.html
index 9fc972c79c525a974501835b7e69ed90f2ceef30..374e716286f065c7da539045223a12d0911887f3 100644
--- a/hshassets/assets/sass/lib/bulma-0.5.0/docs/documentation/components/navbar.html
+++ b/hshassets/assets/sass/lib/bulma-0.5.1/docs/documentation/components/navbar.html
@@ -215,6 +215,12 @@ variables:
</nav>
{% endcapture %}
+{% capture navbar_dropdown_hover_snippet %}
+<div class="navbar-item has-dropdown is-hoverable">
+ <!-- navbar-link, navbar-dropdown etc. -->
+</div>
+{% endcapture %}
+
{% capture navbar_dropdown_hover_example %}
<nav class="navbar">
<div class="navbar-item has-dropdown is-hoverable">
@@ -241,6 +247,12 @@ variables:
</nav>
{% endcapture %}
+{% capture navbar_dropdown_active_snippet %}
+<div class="navbar-item has-dropdown is-active">
+ <!-- navbar-link, navbar-dropdown etc. -->
+</div>
+{% endcapture %}
+
{% capture navbar_dropdown_active_example %}
<nav class="navbar">
<div class="navbar-item has-dropdown is-active">
@@ -267,6 +279,77 @@ variables:
</nav>
{% endcapture %}
+{% capture navbar_dropdown_right_snippet %}
+<div class="navbar-dropdown is-right">
+ <!-- navbar-item, navbar-divider etc. -->
+</div>
+{% endcapture %}
+
+{% capture navbar_dropdown_right_example %}
+<nav class="navbar">
+ <div class="navbar-menu">
+ <div class="navbar-start">
+ <div class="navbar-item has-dropdown is-active">
+ <a class="navbar-link">
+ Left
+ </a>
+
+ <div class="navbar-dropdown">
+ <a class="navbar-item">
+ Overview
+ </a>
+ <a class="navbar-item">
+ Elements
+ </a>
+ <a class="navbar-item">
+ Components
+ </a>
+ <hr class="navbar-divider">
+ <div class="navbar-item">
+ Version {{ site.version }}
+ </div>
+ </div>
+ </div>
+ </div>
+
+ <div class="navbar-end">
+ <div class="navbar-item has-dropdown is-active">
+ <a class="navbar-link">
+ Right
+ </a>
+
+ <div class="navbar-dropdown is-right">
+ <a class="navbar-item">
+ Overview
+ </a>
+ <a class="navbar-item">
+ Elements
+ </a>
+ <a class="navbar-item">
+ Components
+ </a>
+ <hr class="navbar-divider">
+ <div class="navbar-item">
+ Version {{ site.version }}
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+</nav>
+
+<section class="hero is-primary">
+ <div class="hero-body">
+ <p class="title">
+ Documentation
+ </p>
+ <p class="subtitle">
+ Everything you need to <strong>create a website</strong> with Bulma
+ </p>
+ </div>
+</section>
+{% endcapture %}
+
{% capture navbar_dropdown_default_example %}
<nav class="navbar">
<a class="navbar-item">
@@ -417,7 +500,7 @@ document.addEventListener('DOMContentLoaded', function () {
// Add a click event on each of them
$navbarBurgers.forEach(function ($el) {
- $el.addEventListener('click', () => {
+ $el.addEventListener('click', function () {
// Get the target from the "data-target" attribute
var target = $el.dataset.target;
@@ -484,7 +567,7 @@ document.addEventListener('DOMContentLoaded', function () {
<code>navbar-end</code> the <strong>right part</strong> of the menu, which appears at the end of the navbar
<ul>
<li>
- <code>navbar-item</code> each <strong>single item</strong> of the navbar, which can either be a <code>a</code> or a <code>div</code>
+ <code>navbar-item</code> each <strong>single item</strong> of the navbar, which can either be an <code>a</code> or a <code>div</code>
<ul>
<li>
<code>navbar-link</code> a <strong>link</strong> as the sibling of a dropdown, with an arrow
@@ -514,9 +597,7 @@ document.addEventListener('DOMContentLoaded', function () {
{% highlight html %}{{navbar_example}}{% endhighlight %}
- <hr>
-
- <h3 class="title">Navbar brand</h3>
+ {% include heading.html name="Navbar brand" %}
<div class="content">
<p>
@@ -552,9 +633,7 @@ document.addEventListener('DOMContentLoaded', function () {
</p>
</div>
- <hr>
-
- <h3 class="title">Navbar burger</h3>
+ {% include heading.html name="Navbar burger" %}
<div class="content">
<p>
@@ -586,9 +665,7 @@ document.addEventListener('DOMContentLoaded', function () {
</div>
</div>
- <hr>
-
- <h3 class="title">Navbar menu</h3>
+ {% include heading.html name="Navbar menu" %}
<div class="content">
<p>
@@ -639,9 +716,7 @@ document.addEventListener('DOMContentLoaded', function () {
</div>
</div>
- <hr>
-
- <h3 class="title">Navbar start and navbar end</h3>
+ {% include heading.html name="Navbar start and navbar end" %}
<div class="content">
<p>
@@ -665,9 +740,7 @@ document.addEventListener('DOMContentLoaded', function () {
{% highlight html %}{{navbar_start_end_example}}{% endhighlight %}
- <hr>
-
- <h3 class="title">Navbar item</h3>
+ {% include heading.html name="Navbar item" %}
<div class="content">
<p>
@@ -717,9 +790,7 @@ document.addEventListener('DOMContentLoaded', function () {
</ul>
</div>
- <hr>
-
- <h3 id="transparent-navbar" class="title">Transparent navbar</h3>
+ {% include heading.html name="Transparent navbar" %}
<div class="content">
<p>
@@ -733,9 +804,7 @@ document.addEventListener('DOMContentLoaded', function () {
{% highlight html %}{{navbar_transparent_example}}{% endhighlight %}
- <hr>
-
- <h3 id="dropdown-menu" class="title">Dropdown menu</h3>
+ {% include heading.html name="Dropdown menu" %}
<div class="content">
<p>
@@ -793,6 +862,8 @@ document.addEventListener('DOMContentLoaded', function () {
</p>
</div>
+ {% highlight html %}{{ navbar_dropdown_hover_snippet }}{% endhighlight %}
+
<div class="columns">
<div class="column">
<div class="example is-paddingless">
@@ -805,6 +876,8 @@ document.addEventListener('DOMContentLoaded', function () {
</div>
</div>
+ {% highlight html %}{{ navbar_dropdown_active_snippet }}{% endhighlight %}
+
<div class="columns">
<div class="column">
<div class="example is-paddingless">
@@ -817,6 +890,31 @@ document.addEventListener('DOMContentLoaded', function () {
</div>
</div>
+ <h4 class="title is-4">
+ Right dropdown
+ <span class="tag is-info">0.5.1</span>
+ </h4>
+
+ <div class="content">
+ <p>
+ If your parent <code>navbar-item</code> is on the right side, you can position the dropdown to start from the <strong>right</strong> with the <code>is-right</code> modifier.
+ </p>
+ </div>
+
+ {% highlight html %}{{ navbar_dropdown_right_snippet }}{% endhighlight %}
+
+ <div class="columns">
+ <div class="column">
+ <div class="example is-paddingless">
+ {{ navbar_dropdown_right_example }}
+ </div>
+ </div>
+
+ <div class="column">
+ {% highlight html %}{{ navbar_dropdown_right_example }}{% endhighlight %}
+ </div>
+ </div>
+
<h4 class="title is-4">
Styles for the dropdown menu
</h4>
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/docs/documentation/components/pagination.html b/hshassets/assets/sass/lib/bulma-0.5.1/docs/documentation/components/pagination.html
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/docs/documentation/components/pagination.html
rename to hshassets/assets/sass/lib/bulma-0.5.1/docs/documentation/components/pagination.html
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/docs/documentation/components/panel.html b/hshassets/assets/sass/lib/bulma-0.5.1/docs/documentation/components/panel.html
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/docs/documentation/components/panel.html
rename to hshassets/assets/sass/lib/bulma-0.5.1/docs/documentation/components/panel.html
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/docs/documentation/components/tabs.html b/hshassets/assets/sass/lib/bulma-0.5.1/docs/documentation/components/tabs.html
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/docs/documentation/components/tabs.html
rename to hshassets/assets/sass/lib/bulma-0.5.1/docs/documentation/components/tabs.html
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/docs/documentation/elements/box.html b/hshassets/assets/sass/lib/bulma-0.5.1/docs/documentation/elements/box.html
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/docs/documentation/elements/box.html
rename to hshassets/assets/sass/lib/bulma-0.5.1/docs/documentation/elements/box.html
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/docs/documentation/elements/button.html b/hshassets/assets/sass/lib/bulma-0.5.1/docs/documentation/elements/button.html
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/docs/documentation/elements/button.html
rename to hshassets/assets/sass/lib/bulma-0.5.1/docs/documentation/elements/button.html
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/docs/documentation/elements/content.html b/hshassets/assets/sass/lib/bulma-0.5.1/docs/documentation/elements/content.html
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/docs/documentation/elements/content.html
rename to hshassets/assets/sass/lib/bulma-0.5.1/docs/documentation/elements/content.html
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/docs/documentation/elements/delete.html b/hshassets/assets/sass/lib/bulma-0.5.1/docs/documentation/elements/delete.html
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/docs/documentation/elements/delete.html
rename to hshassets/assets/sass/lib/bulma-0.5.1/docs/documentation/elements/delete.html
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/docs/documentation/elements/form.html b/hshassets/assets/sass/lib/bulma-0.5.1/docs/documentation/elements/form.html
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/docs/documentation/elements/form.html
rename to hshassets/assets/sass/lib/bulma-0.5.1/docs/documentation/elements/form.html
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/docs/documentation/elements/icon.html b/hshassets/assets/sass/lib/bulma-0.5.1/docs/documentation/elements/icon.html
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/docs/documentation/elements/icon.html
rename to hshassets/assets/sass/lib/bulma-0.5.1/docs/documentation/elements/icon.html
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/docs/documentation/elements/image.html b/hshassets/assets/sass/lib/bulma-0.5.1/docs/documentation/elements/image.html
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/docs/documentation/elements/image.html
rename to hshassets/assets/sass/lib/bulma-0.5.1/docs/documentation/elements/image.html
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/docs/documentation/elements/notification.html b/hshassets/assets/sass/lib/bulma-0.5.1/docs/documentation/elements/notification.html
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/docs/documentation/elements/notification.html
rename to hshassets/assets/sass/lib/bulma-0.5.1/docs/documentation/elements/notification.html
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/docs/documentation/elements/progress.html b/hshassets/assets/sass/lib/bulma-0.5.1/docs/documentation/elements/progress.html
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/docs/documentation/elements/progress.html
rename to hshassets/assets/sass/lib/bulma-0.5.1/docs/documentation/elements/progress.html
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/docs/documentation/elements/table.html b/hshassets/assets/sass/lib/bulma-0.5.1/docs/documentation/elements/table.html
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/docs/documentation/elements/table.html
rename to hshassets/assets/sass/lib/bulma-0.5.1/docs/documentation/elements/table.html
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/docs/documentation/elements/tag.html b/hshassets/assets/sass/lib/bulma-0.5.1/docs/documentation/elements/tag.html
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/docs/documentation/elements/tag.html
rename to hshassets/assets/sass/lib/bulma-0.5.1/docs/documentation/elements/tag.html
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/docs/documentation/elements/title.html b/hshassets/assets/sass/lib/bulma-0.5.1/docs/documentation/elements/title.html
similarity index 98%
rename from hshassets/assets/sass/lib/bulma-0.5.0/docs/documentation/elements/title.html
rename to hshassets/assets/sass/lib/bulma-0.5.1/docs/documentation/elements/title.html
index 61ffbb98ad444e4fdf7a817fd63c5c0b3eb42aef..936a4a164735a4f22a875a07205650110e303e06 100644
--- a/hshassets/assets/sass/lib/bulma-0.5.0/docs/documentation/elements/title.html
+++ b/hshassets/assets/sass/lib/bulma-0.5.1/docs/documentation/elements/title.html
@@ -9,17 +9,17 @@ variables:
- name: $title-size
value: $size-3
- name: $title-weight
- value: $weight-light
-- name: $title-weight-bold
value: $weight-semibold
- name: $subtitle-color
value: $grey-dark
- name: $subtitle-size
value: $size-5
-- name: $subtitle-strong
- value: $grey-darker
- name: $subtitle-weight
- value: $weight-light
+ value: $weight-normal
+- name: $subtitle-strong-color
+ value: $grey-darker
+- name: $subtitle-strong-weight
+ value: $weight-semibold
---
{% capture default %}
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/docs/documentation/form/checkbox.html b/hshassets/assets/sass/lib/bulma-0.5.1/docs/documentation/form/checkbox.html
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/docs/documentation/form/checkbox.html
rename to hshassets/assets/sass/lib/bulma-0.5.1/docs/documentation/form/checkbox.html
diff --git a/hshassets/assets/sass/lib/bulma-0.5.1/docs/documentation/form/file.html b/hshassets/assets/sass/lib/bulma-0.5.1/docs/documentation/form/file.html
new file mode 100644
index 0000000000000000000000000000000000000000..c46b7365334ade6e1844a56b9c56f61868b07b77
--- /dev/null
+++ b/hshassets/assets/sass/lib/bulma-0.5.1/docs/documentation/form/file.html
@@ -0,0 +1,826 @@
+---
+title: File upload
+layout: documentation
+doc-tab: form
+doc-subtab: file
+file_name: "Screen Shot 2017-07-29 at 15.54.25.png"
+variables:
+- name: $file-border-color
+ value: transparent
+- name: $file-radius
+ value: $radius
+- name: $file-cta-background-color
+ value: $white-ter
+- name: $file-cta-color
+ value: $grey-dark
+- name: $file-cta-hover-color
+ value: $grey-darker
+- name: $file-cta-active-color
+ value: $grey-darker
+- name: $file-name-border-color
+ value: $file-cta-background-color
+- name: $file-name-border-style
+ value: solid
+- name: $file-name-border-width
+ value: 1px 1px 1px 0
+- name: $file-name-max-width
+ value: 16em
+---
+
+{% capture file %}
+<div class="file">
+ <label class="file-label">
+ <input class="file-input" type="file" name="resume">
+ <span class="file-cta">
+ <span class="file-icon">
+ <i class="fa fa-upload"></i>
+ </span>
+ <span class="file-label">
+ Choose a file…
+ </span>
+ </span>
+ </label>
+</div>
+{% endcapture %}
+
+{% capture file_name %}
+<div class="file has-name">
+ <label class="file-label">
+ <input class="file-input" type="file" name="resume">
+ <span class="file-cta">
+ <span class="file-icon">
+ <i class="fa fa-upload"></i>
+ </span>
+ <span class="file-label">
+ Choose a file…
+ </span>
+ </span>
+ <span class="file-name">
+ {{ page.file_name }}
+ </span>
+ </label>
+</div>
+{% endcapture %}
+
+{% capture file_name_right %}
+<div class="file has-name is-right">
+ <label class="file-label">
+ <input class="file-input" type="file" name="resume">
+ <span class="file-cta">
+ <span class="file-icon">
+ <i class="fa fa-upload"></i>
+ </span>
+ <span class="file-label">
+ Choose a file…
+ </span>
+ </span>
+ <span class="file-name">
+ {{ page.file_name }}
+ </span>
+ </label>
+</div>
+{% endcapture %}
+
+{% capture file_name_fullwidth %}
+<div class="file has-name is-fullwidth">
+ <label class="file-label">
+ <input class="file-input" type="file" name="resume">
+ <span class="file-cta">
+ <span class="file-icon">
+ <i class="fa fa-upload"></i>
+ </span>
+ <span class="file-label">
+ Choose a file…
+ </span>
+ </span>
+ <span class="file-name">
+ {{ page.file_name }}
+ </span>
+ </label>
+</div>
+{% endcapture %}
+
+{% capture file_boxed %}
+<div class="file is-boxed">
+ <label class="file-label">
+ <input class="file-input" type="file" name="resume">
+ <span class="file-cta">
+ <span class="file-icon">
+ <i class="fa fa-upload"></i>
+ </span>
+ <span class="file-label">
+ Choose a file…
+ </span>
+ </span>
+ </label>
+</div>
+{% endcapture %}
+
+{% capture file_boxed_name %}
+<div class="file has-name is-boxed">
+ <label class="file-label">
+ <input class="file-input" type="file" name="resume">
+ <span class="file-cta">
+ <span class="file-icon">
+ <i class="fa fa-upload"></i>
+ </span>
+ <span class="file-label">
+ Choose a file…
+ </span>
+ </span>
+ <span class="file-name">
+ {{ page.file_name }}
+ </span>
+ </label>
+</div>
+{% endcapture %}
+
+{% capture file_colors %}
+<div class="field">
+ <div class="file is-primary">
+ <label class="file-label">
+ <input class="file-input" type="file" name="resume">
+ <span class="file-cta">
+ <span class="file-icon">
+ <i class="fa fa-upload"></i>
+ </span>
+ <span class="file-label">
+ Primary file…
+ </span>
+ </span>
+ </label>
+ </div>
+</div>
+
+<div class="field">
+ <div class="file is-info has-name">
+ <label class="file-label">
+ <input class="file-input" type="file" name="resume">
+ <span class="file-cta">
+ <span class="file-icon">
+ <i class="fa fa-upload"></i>
+ </span>
+ <span class="file-label">
+ Info file…
+ </span>
+ </span>
+ <span class="file-name">
+ {{ page.file_name }}
+ </span>
+ </label>
+ </div>
+</div>
+
+<div class="field">
+ <div class="file is-warning is-boxed">
+ <label class="file-label">
+ <input class="file-input" type="file" name="resume">
+ <span class="file-cta">
+ <span class="file-icon">
+ <i class="fa fa-cloud-upload"></i>
+ </span>
+ <span class="file-label">
+ Warning file…
+ </span>
+ </span>
+ </label>
+ </div>
+</div>
+
+<div class="field">
+ <div class="file is-danger has-name is-boxed">
+ <label class="file-label">
+ <input class="file-input" type="file" name="resume">
+ <span class="file-cta">
+ <span class="file-icon">
+ <i class="fa fa-cloud-upload"></i>
+ </span>
+ <span class="file-label">
+ Danger file…
+ </span>
+ </span>
+ <span class="file-name">
+ {{ page.file_name }}
+ </span>
+ </label>
+ </div>
+</div>
+{% endcapture %}
+
+{% capture file_sizes %}
+<div class="field">
+ <div class="file is-small">
+ <label class="file-label">
+ <input class="file-input" type="file" name="resume">
+ <span class="file-cta">
+ <span class="file-icon">
+ <i class="fa fa-upload"></i>
+ </span>
+ <span class="file-label">
+ Small file…
+ </span>
+ </span>
+ </label>
+ </div>
+</div>
+
+<div class="field">
+ <div class="file">
+ <label class="file-label">
+ <input class="file-input" type="file" name="resume">
+ <span class="file-cta">
+ <span class="file-icon">
+ <i class="fa fa-upload"></i>
+ </span>
+ <span class="file-label">
+ Normal file…
+ </span>
+ </span>
+ </label>
+ </div>
+</div>
+
+<div class="field">
+ <div class="file is-medium">
+ <label class="file-label">
+ <input class="file-input" type="file" name="resume">
+ <span class="file-cta">
+ <span class="file-icon">
+ <i class="fa fa-upload"></i>
+ </span>
+ <span class="file-label">
+ Medium file…
+ </span>
+ </span>
+ </label>
+ </div>
+</div>
+
+<div class="field">
+ <div class="file is-large">
+ <label class="file-label">
+ <input class="file-input" type="file" name="resume">
+ <span class="file-cta">
+ <span class="file-icon">
+ <i class="fa fa-upload"></i>
+ </span>
+ <span class="file-label">
+ Large file…
+ </span>
+ </span>
+ </label>
+ </div>
+</div>
+{% endcapture %}
+
+{% capture file_sizes_name %}
+<div class="field">
+ <div class="file is-small has-name">
+ <label class="file-label">
+ <input class="file-input" type="file" name="resume">
+ <span class="file-cta">
+ <span class="file-icon">
+ <i class="fa fa-upload"></i>
+ </span>
+ <span class="file-label">
+ Small file…
+ </span>
+ </span>
+ <span class="file-name">
+ {{ page.file_name }}
+ </span>
+ </label>
+ </div>
+</div>
+
+<div class="field">
+ <div class="file has-name">
+ <label class="file-label">
+ <input class="file-input" type="file" name="resume">
+ <span class="file-cta">
+ <span class="file-icon">
+ <i class="fa fa-upload"></i>
+ </span>
+ <span class="file-label">
+ Normal file…
+ </span>
+ </span>
+ <span class="file-name">
+ {{ page.file_name }}
+ </span>
+ </label>
+ </div>
+</div>
+
+<div class="field">
+ <div class="file is-medium has-name">
+ <label class="file-label">
+ <input class="file-input" type="file" name="resume">
+ <span class="file-cta">
+ <span class="file-icon">
+ <i class="fa fa-upload"></i>
+ </span>
+ <span class="file-label">
+ Medium file…
+ </span>
+ </span>
+ <span class="file-name">
+ {{ page.file_name }}
+ </span>
+ </label>
+ </div>
+</div>
+
+<div class="field">
+ <div class="file is-large has-name">
+ <label class="file-label">
+ <input class="file-input" type="file" name="resume">
+ <span class="file-cta">
+ <span class="file-icon">
+ <i class="fa fa-upload"></i>
+ </span>
+ <span class="file-label">
+ Large file…
+ </span>
+ </span>
+ <span class="file-name">
+ {{ page.file_name }}
+ </span>
+ </label>
+ </div>
+</div>
+{% endcapture %}
+
+{% capture file_sizes_boxed %}
+<div class="field">
+ <div class="file is-small is-boxed">
+ <label class="file-label">
+ <input class="file-input" type="file" name="resume">
+ <span class="file-cta">
+ <span class="file-icon">
+ <i class="fa fa-upload"></i>
+ </span>
+ <span class="file-label">
+ Small file…
+ </span>
+ </span>
+ </label>
+ </div>
+</div>
+
+<div class="field">
+ <div class="file is-boxed">
+ <label class="file-label">
+ <input class="file-input" type="file" name="resume">
+ <span class="file-cta">
+ <span class="file-icon">
+ <i class="fa fa-upload"></i>
+ </span>
+ <span class="file-label">
+ Normal file…
+ </span>
+ </span>
+ </label>
+ </div>
+</div>
+
+<div class="field">
+ <div class="file is-medium is-boxed">
+ <label class="file-label">
+ <input class="file-input" type="file" name="resume">
+ <span class="file-cta">
+ <span class="file-icon">
+ <i class="fa fa-upload"></i>
+ </span>
+ <span class="file-label">
+ Medium file…
+ </span>
+ </span>
+ </label>
+ </div>
+</div>
+
+<div class="field">
+ <div class="file is-large is-boxed">
+ <label class="file-label">
+ <input class="file-input" type="file" name="resume">
+ <span class="file-cta">
+ <span class="file-icon">
+ <i class="fa fa-upload"></i>
+ </span>
+ <span class="file-label">
+ Large file…
+ </span>
+ </span>
+ </label>
+ </div>
+</div>
+{% endcapture %}
+
+{% capture file_centered %}
+<div class="field">
+ <div class="file is-centered is-boxed is-success has-name">
+ <label class="file-label">
+ <input class="file-input" type="file" name="resume">
+ <span class="file-cta">
+ <span class="file-icon">
+ <i class="fa fa-upload"></i>
+ </span>
+ <span class="file-label">
+ Centered file…
+ </span>
+ </span>
+ <span class="file-name">
+ {{ page.file_name }}
+ </span>
+ </label>
+ </div>
+</div>
+{% endcapture %}
+
+{% capture file_right %}
+<div class="field">
+ <div class="file is-right is-info">
+ <label class="file-label">
+ <input class="file-input" type="file" name="resume">
+ <span class="file-cta">
+ <span class="file-icon">
+ <i class="fa fa-upload"></i>
+ </span>
+ <span class="file-label">
+ Right file…
+ </span>
+ </span>
+ <span class="file-name">
+ {{ page.file_name }}
+ </span>
+ </label>
+ </div>
+</div>
+{% endcapture %}
+
+{% capture file_sizes_boxed_name %}
+<div class="field">
+ <div class="file is-small is-boxed has-name">
+ <label class="file-label">
+ <input class="file-input" type="file" name="resume">
+ <span class="file-cta">
+ <span class="file-icon">
+ <i class="fa fa-upload"></i>
+ </span>
+ <span class="file-label">
+ Small file…
+ </span>
+ </span>
+ <span class="file-name">
+ {{ page.file_name }}
+ </span>
+ </label>
+ </div>
+</div>
+
+<div class="field">
+ <div class="file is-boxed has-name">
+ <label class="file-label">
+ <input class="file-input" type="file" name="resume">
+ <span class="file-cta">
+ <span class="file-icon">
+ <i class="fa fa-upload"></i>
+ </span>
+ <span class="file-label">
+ Normal file…
+ </span>
+ </span>
+ <span class="file-name">
+ {{ page.file_name }}
+ </span>
+ </label>
+ </div>
+</div>
+
+<div class="field">
+ <div class="file is-medium is-boxed has-name">
+ <label class="file-label">
+ <input class="file-input" type="file" name="resume">
+ <span class="file-cta">
+ <span class="file-icon">
+ <i class="fa fa-upload"></i>
+ </span>
+ <span class="file-label">
+ Medium file…
+ </span>
+ </span>
+ <span class="file-name">
+ {{ page.file_name }}
+ </span>
+ </label>
+ </div>
+</div>
+
+<div class="field">
+ <div class="file is-large is-boxed has-name">
+ <label class="file-label">
+ <input class="file-input" type="file" name="resume">
+ <span class="file-cta">
+ <span class="file-icon">
+ <i class="fa fa-upload"></i>
+ </span>
+ <span class="file-label">
+ Large file…
+ </span>
+ </span>
+ <span class="file-name">
+ {{ page.file_name }}
+ </span>
+ </label>
+ </div>
+</div>
+{% endcapture %}
+
+{% include subnav-form.html %}
+
+<section class="section">
+ <div class="container">
+ <h1 class="title">File upload</h1>
+ <h2 class="subtitle">
+ A custom <strong>file upload</strong> input, without JavaScript
+ </h2>
+ {%
+ include meta.html
+ experimental=true
+ since="0.5.1"
+ colors=true
+ sizes=true
+ variables=true
+ %}
+
+ <hr>
+
+ <div class="content">
+ <p>
+ The <code>.file</code> element is a simple <strong>interactive label</strong> that wraps an <code><input type="file"></code>. It comprises several sub-elements:
+ </p>
+ <ul>
+ <li>
+ <code>.file</code> the main <strong>container</strong>
+ <ul>
+ <li>
+ <code>.file-label</code> the actual <strong>interactive</strong> and clickable part of the element
+ <ul>
+ <li>
+ <code>.file-input</code> the <strong>native</strong> file input, hidden for styling purposes
+ </li>
+ <li>
+ <code>.file-cta</code> the upload <strong>call-to-action</strong>
+ <ul>
+ <li>
+ <code>.file-icon</code> an optional <strong>upload</strong> icon
+ </li>
+ <li>
+ <code>.file-label</code> the "Choose a file…" text
+ </li>
+ </ul>
+ </li>
+ <li>
+ <code>.file-name</code> a container for the <strong>chosen file</strong> name
+ </li>
+ </ul>
+ </li>
+ </ul>
+ </li>
+ </ul>
+ </div>
+
+ <div class="columns">
+ <div class="column">
+ <div class="example">
+ {{ file }}
+ </div>
+ </div>
+ <div class="column highlight-full">
+ {% highlight html %}{{ file }}{% endhighlight %}
+ </div>
+ </div>
+
+ {% include heading.html name="Modifiers" %}
+
+ <div class="columns">
+ <div class="column">
+ <div class="content">
+ <p>
+ With the <code>.has-name</code> modifier combined with the <code>.file-name</code> element, you can add a <strong>placeholder</strong> for the selected file name.
+ </p>
+ </div>
+ <div class="example">
+ {{ file_name }}
+ </div>
+ </div>
+ <div class="column highlight-full">
+ {% highlight html %}{{ file_name }}{% endhighlight %}
+ </div>
+ </div>
+
+ <div class="columns">
+ <div class="column">
+ <div class="content">
+ <p>
+ You can move the CTA to the <strong>right side</strong> with the <code>.is-right</code> modifier.
+ </p>
+ </div>
+ <div class="example">
+ {{ file_name_right }}
+ </div>
+ </div>
+ <div class="column highlight-full">
+ {% highlight html %}{{ file_name_right }}{% endhighlight %}
+ </div>
+ </div>
+
+ <div class="columns">
+ <div class="column">
+ <div class="content">
+ <p>
+ You can also <strong>expand</strong> the name to fill up the space with the <code>.is-fullwidth</code> modifier.
+ </p>
+ </div>
+ <div class="example">
+ {{ file_name_fullwidth }}
+ </div>
+ </div>
+ <div class="column highlight-full">
+ {% highlight html %}{{ file_name_fullwidth }}{% endhighlight %}
+ </div>
+ </div>
+
+ <div class="columns">
+ <div class="column">
+ <div class="content">
+ <p>
+ You can have a <strong>boxed block</strong> with the <code>.is-boxed</code> modifier.
+ </p>
+ </div>
+ <div class="example">
+ {{ file_boxed }}
+ </div>
+ </div>
+ <div class="column highlight-full">
+ {% highlight html %}{{ file_boxed }}{% endhighlight %}
+ </div>
+ </div>
+
+ <div class="columns">
+ <div class="column">
+ <div class="content">
+ <p>
+ You can <strong>combine</strong> <code>.has-name</code> and <code>.is-boxed</code>.
+ </p>
+ </div>
+ <div class="example">
+ {{ file_boxed_name }}
+ </div>
+ </div>
+ <div class="column highlight-full">
+ {% highlight html %}{{ file_boxed_name }}{% endhighlight %}
+ </div>
+ </div>
+
+ {% include heading.html name="Colors" %}
+
+ <div class="columns">
+ <div class="column">
+ <div class="content">
+ <p>
+ You can style the file element by appending one of the <strong>9 color modifiers</strong>:
+ </p>
+ <ul>
+ {% for color in site.colors %}
+ <li>
+ <code>is-{{ color }}</code>
+ </li>
+ {% endfor %}
+ </ul>
+ </div>
+ <div class="example">
+ {{ file_colors }}
+ </div>
+ </div>
+ <div class="column">
+ {% highlight html %}{{ file_colors }}{% endhighlight %}
+ </div>
+ </div>
+
+ {% include heading.html name="Sizes" %}
+
+ <div class="content">
+ <p>
+ You can append one of <strong>3 additional sizes</strong>:
+ </p>
+ <ul>
+ <li>
+ <code>.is-small</code>
+ </li>
+ <li>
+ <code>.is-medium</code>
+ </li>
+ <li>
+ <code>.is-large</code>
+ </li>
+ </ul>
+ </div>
+
+ <div class="columns">
+ <div class="column">
+ <div class="example">
+ {{ file_sizes }}
+ </div>
+ </div>
+ <div class="column">
+ {% highlight html %}{{ file_sizes }}{% endhighlight %}
+ </div>
+ </div>
+
+ <div class="columns">
+ <div class="column">
+ <div class="example">
+ {{ file_sizes_name }}
+ </div>
+ </div>
+ <div class="column">
+ {% highlight html %}{{ file_sizes_name }}{% endhighlight %}
+ </div>
+ </div>
+
+ <div class="columns">
+ <div class="column">
+ <div class="example">
+ {{ file_sizes_boxed }}
+ </div>
+ </div>
+ <div class="column">
+ {% highlight html %}{{ file_sizes_boxed }}{% endhighlight %}
+ </div>
+ </div>
+
+ <div class="columns">
+ <div class="column">
+ <div class="example">
+ {{ file_sizes_boxed_name }}
+ </div>
+ </div>
+ <div class="column">
+ {% highlight html %}{{ file_sizes_boxed_name }}{% endhighlight %}
+ </div>
+ </div>
+
+ {% include heading.html name="Alignment" %}
+
+ <div class="content">
+ <p>
+ You can <strong>align</strong> the file input:
+ </p>
+ <ul>
+ <li>
+ to the <strong>center</strong> with the <code>is-centered</code> modifier
+ </li>
+ <li>
+ to the <strong>right</strong> with the <code>is-right</code> modifier
+ </li>
+ </ul>
+ </div>
+
+ <div class="columns">
+ <div class="column">
+ <div class="example">
+ {{ file_centered }}
+ </div>
+ </div>
+ <div class="column">
+ {% highlight html %}{{ file_centered }}{% endhighlight %}
+ </div>
+ </div>
+
+ <div class="columns">
+ <div class="column">
+ <div class="example">
+ {{ file_right }}
+ </div>
+ </div>
+ <div class="column">
+ {% highlight html %}{{ file_right }}{% endhighlight %}
+ </div>
+ </div>
+
+ {% include heading.html name="JavaScript" %}
+
+ <div class="content">
+ <p>
+ A file upload input requires JavaScript to <strong>retrieve</strong> the <strong>selected file name</strong>.
+ <br>
+ User <a href="https://github.com/chintanbanugaria"><strong>@chintanbanugaria</strong></a> on GitHub <a href="https://github.com/jgthms/bulma/issues/280#issuecomment-294099510">has provided</a> a simple solution <a href="https://jsfiddle.net/chintanbanugaria/uzva5byy/">on JSFiddle</a>.
+ </p>
+ </div>
+
+ {% include variables.html element=true %}
+
+ </div>
+</section>
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/docs/documentation/form/general.html b/hshassets/assets/sass/lib/bulma-0.5.1/docs/documentation/form/general.html
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/docs/documentation/form/general.html
rename to hshassets/assets/sass/lib/bulma-0.5.1/docs/documentation/form/general.html
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/docs/documentation/form/input.html b/hshassets/assets/sass/lib/bulma-0.5.1/docs/documentation/form/input.html
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/docs/documentation/form/input.html
rename to hshassets/assets/sass/lib/bulma-0.5.1/docs/documentation/form/input.html
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/docs/documentation/form/radio.html b/hshassets/assets/sass/lib/bulma-0.5.1/docs/documentation/form/radio.html
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/docs/documentation/form/radio.html
rename to hshassets/assets/sass/lib/bulma-0.5.1/docs/documentation/form/radio.html
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/docs/documentation/form/select.html b/hshassets/assets/sass/lib/bulma-0.5.1/docs/documentation/form/select.html
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/docs/documentation/form/select.html
rename to hshassets/assets/sass/lib/bulma-0.5.1/docs/documentation/form/select.html
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/docs/documentation/form/textarea.html b/hshassets/assets/sass/lib/bulma-0.5.1/docs/documentation/form/textarea.html
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/docs/documentation/form/textarea.html
rename to hshassets/assets/sass/lib/bulma-0.5.1/docs/documentation/form/textarea.html
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/docs/documentation/grid/columns.html b/hshassets/assets/sass/lib/bulma-0.5.1/docs/documentation/grid/columns.html
similarity index 90%
rename from hshassets/assets/sass/lib/bulma-0.5.0/docs/documentation/grid/columns.html
rename to hshassets/assets/sass/lib/bulma-0.5.1/docs/documentation/grid/columns.html
index 8a5083618a5e62210ca60ebdbcb4a26a78df8d6f..460586e301aa122dbefb49d83c2f440d7cfb1252 100644
--- a/hshassets/assets/sass/lib/bulma-0.5.0/docs/documentation/grid/columns.html
+++ b/hshassets/assets/sass/lib/bulma-0.5.1/docs/documentation/grid/columns.html
@@ -494,6 +494,103 @@ doc-subtab: columns
</div>
{% endhighlight %}
+ <h3 class="title">Centering columns</h3>
+ <div class="content">
+ <p>While you can use <em>empty columns</em> (like <code><div class="column"></div></code>) to create horizontal space around <code>.column</code> elements, you can also use <code>.is-centered</code> on the parent <code>.columns</code> element:
+ </div>
+
+ <div class="columns is-mobile is-centered">
+ <div class="column is-half is-narrow">
+ <p class="notification is-info">
+ <code class="html">is-half</code><br>
+ <code class="html">is-narrow</code>
+ </p>
+ </div>
+ </div>
+
+{% highlight html %}
+ <div class="columns is-mobile is-centered">
+ <div class="column is-half is-narrow">
+ <p class="notification is-info">
+ <code class="html">is-half</code><br>
+ <code class="html">is-narrow</code>
+ </p>
+ </div>
+ </div>
+{% endhighlight %}
+
+ <div class="content">
+ <p>Use with <code>.is-multiline</code> to create a flexible, centered list (try resizing to see centering in different viewport sizes):
+ </div>
+
+ <div class="columns is-mobile is-multiline is-centered">
+ <div class="column is-narrow">
+ <p class="notification is-info">
+ <code class="html">is-narrow</code><br>
+ First Column
+ </p>
+ </div>
+ <div class="column is-narrow">
+ <p class="notification is-success">
+ <code class="html">is-narrow</code><br>
+ Our Second Column
+ </p>
+ </div>
+ <div class="column is-narrow">
+ <p class="notification is-danger">
+ <code class="html">is-narrow</code><br>
+ Third Column
+ </p>
+ </div>
+ <div class="column is-narrow">
+ <p class="notification is-info">
+ <code class="html">is-narrow</code><br>
+ The Fourth Column
+ </p>
+ </div>
+ <div class="column is-narrow">
+ <p class="notification is-success">
+ <code class="html">is-narrow</code><br>
+ Fifth Column
+ </p>
+ </div>
+ </div>
+
+
+{% highlight html %}
+ <div class="columns is-mobile is-multiline is-centered">
+ <div class="column is-narrow">
+ <p class="notification is-info">
+ <code class="html">is-narrow</code><br>
+ First Column
+ </p>
+ </div>
+ <div class="column is-narrow">
+ <p class="notification is-success">
+ <code class="html">is-narrow</code><br>
+ Our Second Column
+ </p>
+ </div>
+ <div class="column is-narrow">
+ <p class="notification is-danger">
+ <code class="html">is-narrow</code><br>
+ Third Column
+ </p>
+ </div>
+ <div class="column is-narrow">
+ <p class="notification is-info">
+ <code class="html">is-narrow</code><br>
+ The Fourth Column
+ </p>
+ </div>
+ <div class="column is-narrow">
+ <p class="notification is-success">
+ <code class="html">is-narrow</code><br>
+ Fifth Column
+ </p>
+ </div>
+ </div>
+{% endhighlight %}
<hr>
<h3 class="title">Responsiveness</h3>
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/docs/documentation/grid/tiles.html b/hshassets/assets/sass/lib/bulma-0.5.1/docs/documentation/grid/tiles.html
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/docs/documentation/grid/tiles.html
rename to hshassets/assets/sass/lib/bulma-0.5.1/docs/documentation/grid/tiles.html
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/docs/documentation/layout/container.html b/hshassets/assets/sass/lib/bulma-0.5.1/docs/documentation/layout/container.html
similarity index 81%
rename from hshassets/assets/sass/lib/bulma-0.5.0/docs/documentation/layout/container.html
rename to hshassets/assets/sass/lib/bulma-0.5.1/docs/documentation/layout/container.html
index a8e2848305b3340fa396a33237bf41d09f79d058..26c423c7b4f21b2e74151d64e2201a7ae20db157 100644
--- a/hshassets/assets/sass/lib/bulma-0.5.0/docs/documentation/layout/container.html
+++ b/hshassets/assets/sass/lib/bulma-0.5.1/docs/documentation/layout/container.html
@@ -51,17 +51,19 @@ doc-subtab: container
<div class="content">
<p>The <code>.container</code> class can be used in any context, but mostly as a <strong>direct child</strong> of either:</p>
<ul>
- <li><code>.nav</code></li>
+ <li><code>.navbar</code></li>
<li><code>.hero</code></li>
<li><code>.section</code></li>
<li><code>.footer</code></li>
</ul>
+ <p>
+ The container <strong>breakpoints</strong> have an <strong>offset</strong> defined by the <code>$container-offset</code> variable. It has a default value of <code>60px</code>.
+ </p>
<p>This is how the container will behave:</p>
<ul>
- <li>on <strong>mobile</strong> and <strong>tablet</strong> {% include bp/touch.html %}, it will have a margin of <strong>24px</strong> on each side.</li>
- <li>on <strong>desktop</strong> {% include bp/desktop.html %}, it will have a maximum width of <strong>960px</strong> and will be <strong>horizontally centered</strong>.</li>
- <li>on <strong>widescreen</strong> {% include bp/widescreen.html %}, it will have a maximum width of <strong>1152px</strong>.</li>
- <li>on <strong>fullhd</strong> {% include bp/fullhd.html %}, it will have a maximum width of <strong>1344px</strong>.</li>
+ <li>on <code>$desktop</code> + <code>$container-offset</code> = <code>>= 1068px</code> it will have a maximum width of <strong>960px</strong> and will be <strong>horizontally centered</strong>.</li>
+ <li>on <code>$widescreen</code> + <code>$container-offset</code> = <code>>= 1260px</code> it will have a maximum width of <strong>1152px</strong>.</li>
+ <li>on <code>$fullhd</code> + <code>$container-offset</code> = <code>>= 1452px</code> it will have a maximum width of <strong>1344px</strong>.</li>
</ul>
<p>
The <code>$gap</code> variable has a default value of <code>24px</code> but can be modified.
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/docs/documentation/layout/footer.html b/hshassets/assets/sass/lib/bulma-0.5.1/docs/documentation/layout/footer.html
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/docs/documentation/layout/footer.html
rename to hshassets/assets/sass/lib/bulma-0.5.1/docs/documentation/layout/footer.html
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/docs/documentation/layout/hero.html b/hshassets/assets/sass/lib/bulma-0.5.1/docs/documentation/layout/hero.html
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/docs/documentation/layout/hero.html
rename to hshassets/assets/sass/lib/bulma-0.5.1/docs/documentation/layout/hero.html
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/docs/documentation/layout/section.html b/hshassets/assets/sass/lib/bulma-0.5.1/docs/documentation/layout/section.html
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/docs/documentation/layout/section.html
rename to hshassets/assets/sass/lib/bulma-0.5.1/docs/documentation/layout/section.html
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/docs/documentation/modifiers/helpers.html b/hshassets/assets/sass/lib/bulma-0.5.1/docs/documentation/modifiers/helpers.html
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/docs/documentation/modifiers/helpers.html
rename to hshassets/assets/sass/lib/bulma-0.5.1/docs/documentation/modifiers/helpers.html
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/docs/documentation/modifiers/responsive-helpers.html b/hshassets/assets/sass/lib/bulma-0.5.1/docs/documentation/modifiers/responsive-helpers.html
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/docs/documentation/modifiers/responsive-helpers.html
rename to hshassets/assets/sass/lib/bulma-0.5.1/docs/documentation/modifiers/responsive-helpers.html
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/docs/documentation/modifiers/syntax.html b/hshassets/assets/sass/lib/bulma-0.5.1/docs/documentation/modifiers/syntax.html
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/docs/documentation/modifiers/syntax.html
rename to hshassets/assets/sass/lib/bulma-0.5.1/docs/documentation/modifiers/syntax.html
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/docs/documentation/modifiers/typography-helpers.html b/hshassets/assets/sass/lib/bulma-0.5.1/docs/documentation/modifiers/typography-helpers.html
similarity index 68%
rename from hshassets/assets/sass/lib/bulma-0.5.0/docs/documentation/modifiers/typography-helpers.html
rename to hshassets/assets/sass/lib/bulma-0.5.1/docs/documentation/modifiers/typography-helpers.html
index 2e1194e321f36e2ca59f8652f16faa0c2945a583..408df530112029b9f1e052155107a2ca90f4370e 100644
--- a/hshassets/assets/sass/lib/bulma-0.5.0/docs/documentation/modifiers/typography-helpers.html
+++ b/hshassets/assets/sass/lib/bulma-0.5.1/docs/documentation/modifiers/typography-helpers.html
@@ -47,6 +47,12 @@ doc-subtab: typography-helpers
</td>
{% endcapture %}
+{% capture left %}
+<td class="is-narrow">
+ <p class="notification is-success">left-aligned</p>
+</td>
+{% endcapture %}
+
{% include subnav-modifiers.html %}
<section class="section">
@@ -266,5 +272,135 @@ doc-subtab: typography-helpers
</tbody>
</table>
+ <hr>
+
+ <h3 class="title">Responsive Alignment</h3>
+
+ <div class="content">
+ <p>
+ You can now <strong>align text</strong> for <em>each</em> viewport width. You simply need to append the <strong>viewport width</strong> to the alignment modifier.
+ </p>
+
+ <p>
+ For example, here are the modifiers for <code>.has-text-left</code>:
+ </p>
+ </div>
+
+ <table class="table is-bordered">
+ {{ thead }}
+ <tbody>
+ <tr>
+ <td><code>has-text-left-mobile</code></td>
+ {{ left }}
+ {{ unchanged }}
+ {{ unchanged }}
+ {{ unchanged }}
+ {{ unchanged }}
+ </tr>
+ <tr>
+ <td><code>has-text-left-tablet</code></td>
+ {{ unchanged }}
+ {{ left }}
+ {{ left }}
+ {{ left }}
+ {{ left }}
+ </tr>
+ <tr>
+ <td><code>has-text-left-tablet-only</code></td>
+ {{ unchanged }}
+ {{ left }}
+ {{ unchanged }}
+ {{ unchanged }}
+ {{ unchanged }}
+ </tr>
+ <tr>
+ <td><code>has-text-left-touch</code></td>
+ {{ left }}
+ {{ left }}
+ {{ unchanged }}
+ {{ unchanged }}
+ {{ unchanged }}
+ </tr>
+ <tr>
+ <td><code>has-text-left-desktop</code></td>
+ {{ unchanged }}
+ {{ unchanged }}
+ {{ left }}
+ {{ left }}
+ {{ left }}
+ </tr>
+ <tr>
+ <td><code>has-text-left-desktop-only</code></td>
+ {{ unchanged }}
+ {{ unchanged }}
+ {{ left }}
+ {{ unchanged }}
+ {{ unchanged }}
+ </tr>
+ <tr>
+ <td><code>has-text-left-widescreen</code></td>
+ {{ unchanged }}
+ {{ unchanged }}
+ {{ unchanged }}
+ {{ left }}
+ {{ left }}
+ </tr>
+ <tr>
+ <td><code>has-text-left-widescreen-only</code></td>
+ {{ unchanged }}
+ {{ unchanged }}
+ {{ unchanged }}
+ {{ left }}
+ {{ unchanged }}
+ </tr>
+ <tr>
+ <td><code>has-text-left-fullhd</code></td>
+ {{ unchanged }}
+ {{ unchanged }}
+ {{ unchanged }}
+ {{ unchanged }}
+ {{ left }}
+ </tr>
+ </tbody>
+ </table>
+ </div>
+
+ <hr>
+
+ <h3 class="title">Text transformation</h3>
+
+ <div class="content">
+ <p>
+ You can transform the text with the use of one of <strong>3 text transformation helpers</strong>:
+ </p>
+ </div>
+
+ <table class="table is-bordered">
+ <thead>
+ <tr>
+ <th>
+ Class
+ </th>
+ <th>
+ Transformation
+ </th>
+ </tr>
+ </thead>
+ <tbody>
+ <tr>
+ <td><code>.is-capitalized</code></td>
+ <td>Transforms <strong>the first character</strong> of each word to <strong>uppercase</strong></td>
+ </tr>
+ <tr>
+ <td><code>.is-lowercase</code></td>
+ <td>Transforms all characters to <strong>lowercase</strong></td>
+ </tr>
+ <tr>
+ <td><code>.is-uppercase</code></td>
+ <td>Transforms all characters to <strong>uppercase</strong></td>
+ </tr>
+ </tbody>
+ </table>
+
</div>
</section>
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/docs/documentation/overview/classes.html b/hshassets/assets/sass/lib/bulma-0.5.1/docs/documentation/overview/classes.html
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/docs/documentation/overview/classes.html
rename to hshassets/assets/sass/lib/bulma-0.5.1/docs/documentation/overview/classes.html
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/docs/documentation/overview/colors.html b/hshassets/assets/sass/lib/bulma-0.5.1/docs/documentation/overview/colors.html
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/docs/documentation/overview/colors.html
rename to hshassets/assets/sass/lib/bulma-0.5.1/docs/documentation/overview/colors.html
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/docs/documentation/overview/customize.html b/hshassets/assets/sass/lib/bulma-0.5.1/docs/documentation/overview/customize.html
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/docs/documentation/overview/customize.html
rename to hshassets/assets/sass/lib/bulma-0.5.1/docs/documentation/overview/customize.html
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/docs/documentation/overview/functions.html b/hshassets/assets/sass/lib/bulma-0.5.1/docs/documentation/overview/functions.html
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/docs/documentation/overview/functions.html
rename to hshassets/assets/sass/lib/bulma-0.5.1/docs/documentation/overview/functions.html
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/docs/documentation/overview/mixins.html b/hshassets/assets/sass/lib/bulma-0.5.1/docs/documentation/overview/mixins.html
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/docs/documentation/overview/mixins.html
rename to hshassets/assets/sass/lib/bulma-0.5.1/docs/documentation/overview/mixins.html
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/docs/documentation/overview/modular.html b/hshassets/assets/sass/lib/bulma-0.5.1/docs/documentation/overview/modular.html
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/docs/documentation/overview/modular.html
rename to hshassets/assets/sass/lib/bulma-0.5.1/docs/documentation/overview/modular.html
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/docs/documentation/overview/responsiveness.html b/hshassets/assets/sass/lib/bulma-0.5.1/docs/documentation/overview/responsiveness.html
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/docs/documentation/overview/responsiveness.html
rename to hshassets/assets/sass/lib/bulma-0.5.1/docs/documentation/overview/responsiveness.html
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/docs/documentation/overview/start.html b/hshassets/assets/sass/lib/bulma-0.5.1/docs/documentation/overview/start.html
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/docs/documentation/overview/start.html
rename to hshassets/assets/sass/lib/bulma-0.5.1/docs/documentation/overview/start.html
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/docs/documentation/overview/variables.html b/hshassets/assets/sass/lib/bulma-0.5.1/docs/documentation/overview/variables.html
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/docs/documentation/overview/variables.html
rename to hshassets/assets/sass/lib/bulma-0.5.1/docs/documentation/overview/variables.html
diff --git a/hshassets/assets/sass/lib/bulma-0.5.1/docs/expo.html b/hshassets/assets/sass/lib/bulma-0.5.1/docs/expo.html
new file mode 100644
index 0000000000000000000000000000000000000000..2fc323f3727a0ab268bf52a9a896efb47a26b7df
--- /dev/null
+++ b/hshassets/assets/sass/lib/bulma-0.5.1/docs/expo.html
@@ -0,0 +1,151 @@
+---
+fulltitle: "Expo: beautiful websites designed Bulma"
+layout: default
+route: expo
+other:
+- name: Apache BookKeeper
+ url: https://lucperkins.github.io/bookkeeper/
+ date: "26 Jul 2017"
+websites:
+- name: Bashful Birdie
+ url: http://www.bashfulbirdie.com/
+ date: "24 Jul 2017"
+- name: Bugcraft Studio
+ url: https://noggaholic.github.io
+ date: "24 Jul 2017"
+- name: Booknshelf
+ url: https://booknshelf.com/
+ date: "20 Jul 2017"
+- name: MD5
+ url: https://desforets.github.io/md5/
+ date: "24 Jun 2017"
+- name: Driftrock
+ url: https://www.driftrock.com/
+ date: "13 Jul 2017"
+ highlighted: true
+- name: Jubiwee
+ url: https://www.jubiwee.com/fr/
+ date: "24 Jun 2017"
+- name: Pragonauts
+ url: http://pragonauts.com/
+ date: "23 Jun 2017"
+- name: Kappamon
+ url: https://kappamon.com/
+ date: "23 Jun 2017"
+- name: Elevo
+ url: http://www.elevo.fr/
+ date: "23 Jun 2017"
+- name: Oneday
+ url: https://www.oneday.design/
+ date: "8 Dec 2016"
+ highlighted: true
+- name: Buefy
+ url: https://buefy.github.io/
+ date: "10 Apr 2017"
+- name: Alt Three
+ url: https://alt-three.com/
+ date: "31 Mar 2016"
+---
+
+{% capture embrace_expo %}
+<div class="embrace is-expo">
+ <p class="embrace-text">
+ Did you design a gorgeous website with Bulma too? <strong>Tell us about it!</strong> <span style="font-size: 20px; margin-left: 2px; position: relative; top: 1px;">🤗</span>
+ </p>
+ <p class="embrace-button">
+ <a class="tw-button button"
+ data-social-network="Twitter"
+ data-social-action="tweet"
+ data-social-target="{{ site.url }}"
+ target="_blank"
+ href="https://twitter.com/intent/tweet?text={{ 'Here is my lovely website!' | urlencode }}&hashtags=madewithbulma&url={{ site.url }}">
+ <span class="icon">
+ <i class="fa fa-twitter"></i>
+ </span>
+ <span>
+ #madewithbulma
+ </span>
+ </a>
+ </p>
+</div>
+{% endcapture %}
+
+<div class="container">
+ {% include navbar.html id="ExpoHero" %}
+</div>
+
+<section class="hero is-success">
+ <div class="hero-body">
+ <div class="container">
+ <div class="columns is-vcentered">
+ <div class="column">
+ <h1 class="title">
+ Expo
+ </h1>
+ <p class="subtitle">
+ How people used Bulma to design beautiful websites <span style="font-size: 20px; margin-left: 2px; position: relative; top: 1px;">😍</span>
+ </p>
+ </div>
+ <div class="column is-narrow">
+ {% include carbon.html %}
+ </div>
+ </div>
+ </div>
+ </div>
+</section>
+
+<main class="expo">
+ <div class="container">
+ {{ embrace_expo }}
+
+ <div class="websites">
+ {% for website in page.websites %}
+ {% assign imageName = website.name | slugify %}
+ {% assign imagePath = "/images/expo/" | prepend: site.url | append: imageName %}
+ <article class="website {% if website.highlighted %}is-highlighted{% endif %}">
+ <a class="website-image" href="{{ website.url }}" target="_blank">
+ {% if website.highlighted %}
+ {% assign size1x = "1344x840" %}
+ {% assign size2x = "2688x1680" %}
+ <img
+ class="b-lazy"
+ src="{{ site.url }}/images/placeholders/empty.png"
+ data-src="{{ imagePath }}-{{ size1x }}.jpg"
+ data-srcset="{{ imagePath }}-{{ size2x }}.jpg 2x,
+ {{ imagePath }}-{{ size1x }}.jpg 1x"
+ width="1344"
+ height="840">
+ {% else %}
+ {% assign size1x = "672x420" %}
+ {% assign size2x = "1344x840" %}
+ <img
+ class="b-lazy"
+ src="{{ site.url }}/images/placeholders/empty.png"
+ data-src="{{ imagePath }}-{{ size1x }}.jpg"
+ data-srcset="{{ imagePath }}-{{ size2x }}.jpg 2x,
+ {{ imagePath }}-{{ size1x }}.jpg 1x"
+ width="672"
+ height="420">
+ {% endif %}
+ <span class="website-overlay is-overlay"></span>
+ </a>
+ <h2 class="title is-5 website-name is-marginless">
+ {{ website.name }}
+ </h2>
+ <p class="has-text-grey-light website-date">
+ {{ website.date }}
+ </p>
+ </article>
+ {% endfor %}
+ </div>
+
+ {{ embrace_expo }}
+ </div>
+</main>
+
+<script src="{{ site.url }}/vendor/blazy-1.8.2.min.js"></script>
+<script type="text/javascript">
+ ;(function() {
+ var bLazy = new Blazy();
+ })();
+</script>
\ No newline at end of file
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/docs/extensions.html b/hshassets/assets/sass/lib/bulma-0.5.1/docs/extensions.html
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/docs/extensions.html
rename to hshassets/assets/sass/lib/bulma-0.5.1/docs/extensions.html
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/docs/favicons/android-chrome-192x192.png b/hshassets/assets/sass/lib/bulma-0.5.1/docs/favicons/android-chrome-192x192.png
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/docs/favicons/android-chrome-192x192.png
rename to hshassets/assets/sass/lib/bulma-0.5.1/docs/favicons/android-chrome-192x192.png
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/docs/favicons/android-chrome-384x384.png b/hshassets/assets/sass/lib/bulma-0.5.1/docs/favicons/android-chrome-384x384.png
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/docs/favicons/android-chrome-384x384.png
rename to hshassets/assets/sass/lib/bulma-0.5.1/docs/favicons/android-chrome-384x384.png
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/docs/favicons/apple-touch-icon.png b/hshassets/assets/sass/lib/bulma-0.5.1/docs/favicons/apple-touch-icon.png
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/docs/favicons/apple-touch-icon.png
rename to hshassets/assets/sass/lib/bulma-0.5.1/docs/favicons/apple-touch-icon.png
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/docs/favicons/browserconfig.xml b/hshassets/assets/sass/lib/bulma-0.5.1/docs/favicons/browserconfig.xml
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/docs/favicons/browserconfig.xml
rename to hshassets/assets/sass/lib/bulma-0.5.1/docs/favicons/browserconfig.xml
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/docs/favicons/favicon-16x16.png b/hshassets/assets/sass/lib/bulma-0.5.1/docs/favicons/favicon-16x16.png
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/docs/favicons/favicon-16x16.png
rename to hshassets/assets/sass/lib/bulma-0.5.1/docs/favicons/favicon-16x16.png
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/docs/favicons/favicon-32x32.png b/hshassets/assets/sass/lib/bulma-0.5.1/docs/favicons/favicon-32x32.png
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/docs/favicons/favicon-32x32.png
rename to hshassets/assets/sass/lib/bulma-0.5.1/docs/favicons/favicon-32x32.png
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/docs/favicons/favicon.ico b/hshassets/assets/sass/lib/bulma-0.5.1/docs/favicons/favicon.ico
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/docs/favicons/favicon.ico
rename to hshassets/assets/sass/lib/bulma-0.5.1/docs/favicons/favicon.ico
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/docs/favicons/manifest.json b/hshassets/assets/sass/lib/bulma-0.5.1/docs/favicons/manifest.json
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/docs/favicons/manifest.json
rename to hshassets/assets/sass/lib/bulma-0.5.1/docs/favicons/manifest.json
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/docs/favicons/mstile-150x150.png b/hshassets/assets/sass/lib/bulma-0.5.1/docs/favicons/mstile-150x150.png
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/docs/favicons/mstile-150x150.png
rename to hshassets/assets/sass/lib/bulma-0.5.1/docs/favicons/mstile-150x150.png
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/docs/favicons/safari-pinned-tab.svg b/hshassets/assets/sass/lib/bulma-0.5.1/docs/favicons/safari-pinned-tab.svg
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/docs/favicons/safari-pinned-tab.svg
rename to hshassets/assets/sass/lib/bulma-0.5.1/docs/favicons/safari-pinned-tab.svg
diff --git a/hshassets/assets/sass/lib/bulma-0.5.1/docs/images/blog/list-of-tags.png b/hshassets/assets/sass/lib/bulma-0.5.1/docs/images/blog/list-of-tags.png
new file mode 100644
index 0000000000000000000000000000000000000000..16c2dcddec7cac050bc7897da82ea4c1b8d91e5f
Binary files /dev/null and b/hshassets/assets/sass/lib/bulma-0.5.1/docs/images/blog/list-of-tags.png differ
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/docs/images/blog/metro-ui-css-grid-tiles.png b/hshassets/assets/sass/lib/bulma-0.5.1/docs/images/blog/metro-ui-css-grid-tiles.png
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/docs/images/blog/metro-ui-css-grid-tiles.png
rename to hshassets/assets/sass/lib/bulma-0.5.1/docs/images/blog/metro-ui-css-grid-tiles.png
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/docs/images/bulma-banner.png b/hshassets/assets/sass/lib/bulma-0.5.1/docs/images/bulma-banner.png
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/docs/images/bulma-banner.png
rename to hshassets/assets/sass/lib/bulma-0.5.1/docs/images/bulma-banner.png
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/docs/images/bulma-icon.png b/hshassets/assets/sass/lib/bulma-0.5.1/docs/images/bulma-icon.png
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/docs/images/bulma-icon.png
rename to hshassets/assets/sass/lib/bulma-0.5.1/docs/images/bulma-icon.png
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/docs/images/bulma-logo.png b/hshassets/assets/sass/lib/bulma-0.5.1/docs/images/bulma-logo.png
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/docs/images/bulma-logo.png
rename to hshassets/assets/sass/lib/bulma-0.5.1/docs/images/bulma-logo.png
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/docs/images/bulma-type-white.png b/hshassets/assets/sass/lib/bulma-0.5.1/docs/images/bulma-type-white.png
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/docs/images/bulma-type-white.png
rename to hshassets/assets/sass/lib/bulma-0.5.1/docs/images/bulma-type-white.png
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/docs/images/bulma-type.png b/hshassets/assets/sass/lib/bulma-0.5.1/docs/images/bulma-type.png
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/docs/images/bulma-type.png
rename to hshassets/assets/sass/lib/bulma-0.5.1/docs/images/bulma-type.png
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/docs/images/css-reference-logo.png b/hshassets/assets/sass/lib/bulma-0.5.1/docs/images/css-reference-logo.png
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/docs/images/css-reference-logo.png
rename to hshassets/assets/sass/lib/bulma-0.5.1/docs/images/css-reference-logo.png
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/docs/images/customize-after.png b/hshassets/assets/sass/lib/bulma-0.5.1/docs/images/customize-after.png
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/docs/images/customize-after.png
rename to hshassets/assets/sass/lib/bulma-0.5.1/docs/images/customize-after.png
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/docs/images/customize-before.png b/hshassets/assets/sass/lib/bulma-0.5.1/docs/images/customize-before.png
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/docs/images/customize-before.png
rename to hshassets/assets/sass/lib/bulma-0.5.1/docs/images/customize-before.png
diff --git a/hshassets/assets/sass/lib/bulma-0.5.1/docs/images/expo/alt-three-1344x840.jpg b/hshassets/assets/sass/lib/bulma-0.5.1/docs/images/expo/alt-three-1344x840.jpg
new file mode 100644
index 0000000000000000000000000000000000000000..052203921b65169fe4d025fd17df0e7d19007d6d
Binary files /dev/null and b/hshassets/assets/sass/lib/bulma-0.5.1/docs/images/expo/alt-three-1344x840.jpg differ
diff --git a/hshassets/assets/sass/lib/bulma-0.5.1/docs/images/expo/alt-three-672x420.jpg b/hshassets/assets/sass/lib/bulma-0.5.1/docs/images/expo/alt-three-672x420.jpg
new file mode 100644
index 0000000000000000000000000000000000000000..3a6fd410ca7193cd3ce8ff0899f3447e50012af7
Binary files /dev/null and b/hshassets/assets/sass/lib/bulma-0.5.1/docs/images/expo/alt-three-672x420.jpg differ
diff --git a/hshassets/assets/sass/lib/bulma-0.5.1/docs/images/expo/apache-bookkeeper-1344x840.jpg b/hshassets/assets/sass/lib/bulma-0.5.1/docs/images/expo/apache-bookkeeper-1344x840.jpg
new file mode 100644
index 0000000000000000000000000000000000000000..25a7626418ec677dad51a28a6f462f13de7deb5a
Binary files /dev/null and b/hshassets/assets/sass/lib/bulma-0.5.1/docs/images/expo/apache-bookkeeper-1344x840.jpg differ
diff --git a/hshassets/assets/sass/lib/bulma-0.5.1/docs/images/expo/apache-bookkeeper-672x420.jpg b/hshassets/assets/sass/lib/bulma-0.5.1/docs/images/expo/apache-bookkeeper-672x420.jpg
new file mode 100644
index 0000000000000000000000000000000000000000..29b749c5bda17c2d24e72d3044df9147626b90d8
Binary files /dev/null and b/hshassets/assets/sass/lib/bulma-0.5.1/docs/images/expo/apache-bookkeeper-672x420.jpg differ
diff --git a/hshassets/assets/sass/lib/bulma-0.5.1/docs/images/expo/bashful-birdie-1344x840.jpg b/hshassets/assets/sass/lib/bulma-0.5.1/docs/images/expo/bashful-birdie-1344x840.jpg
new file mode 100644
index 0000000000000000000000000000000000000000..7116e6b8fc9fa063b578c07d706b26818519f60e
Binary files /dev/null and b/hshassets/assets/sass/lib/bulma-0.5.1/docs/images/expo/bashful-birdie-1344x840.jpg differ
diff --git a/hshassets/assets/sass/lib/bulma-0.5.1/docs/images/expo/bashful-birdie-672x420.jpg b/hshassets/assets/sass/lib/bulma-0.5.1/docs/images/expo/bashful-birdie-672x420.jpg
new file mode 100644
index 0000000000000000000000000000000000000000..0316b6252e2b4d4e906c28d7002ee9e52d539da4
Binary files /dev/null and b/hshassets/assets/sass/lib/bulma-0.5.1/docs/images/expo/bashful-birdie-672x420.jpg differ
diff --git a/hshassets/assets/sass/lib/bulma-0.5.1/docs/images/expo/booknshelf-1344x840.jpg b/hshassets/assets/sass/lib/bulma-0.5.1/docs/images/expo/booknshelf-1344x840.jpg
new file mode 100644
index 0000000000000000000000000000000000000000..76c512f26ee7c0289256380f88d0365f85f649f5
Binary files /dev/null and b/hshassets/assets/sass/lib/bulma-0.5.1/docs/images/expo/booknshelf-1344x840.jpg differ
diff --git a/hshassets/assets/sass/lib/bulma-0.5.1/docs/images/expo/booknshelf-672x420.jpg b/hshassets/assets/sass/lib/bulma-0.5.1/docs/images/expo/booknshelf-672x420.jpg
new file mode 100644
index 0000000000000000000000000000000000000000..d63cc9ddd9436126b8625800dedbd271d50c5695
Binary files /dev/null and b/hshassets/assets/sass/lib/bulma-0.5.1/docs/images/expo/booknshelf-672x420.jpg differ
diff --git a/hshassets/assets/sass/lib/bulma-0.5.1/docs/images/expo/buefy-1344x840.jpg b/hshassets/assets/sass/lib/bulma-0.5.1/docs/images/expo/buefy-1344x840.jpg
new file mode 100644
index 0000000000000000000000000000000000000000..f9203be32e4f434253401f8617aef489134fc15e
Binary files /dev/null and b/hshassets/assets/sass/lib/bulma-0.5.1/docs/images/expo/buefy-1344x840.jpg differ
diff --git a/hshassets/assets/sass/lib/bulma-0.5.1/docs/images/expo/buefy-672x420.jpg b/hshassets/assets/sass/lib/bulma-0.5.1/docs/images/expo/buefy-672x420.jpg
new file mode 100644
index 0000000000000000000000000000000000000000..3ace4aa6f8c9d4fd426d2067fb6fc0c862b566b6
Binary files /dev/null and b/hshassets/assets/sass/lib/bulma-0.5.1/docs/images/expo/buefy-672x420.jpg differ
diff --git a/hshassets/assets/sass/lib/bulma-0.5.1/docs/images/expo/bugcraft-studio-1344x840.jpg b/hshassets/assets/sass/lib/bulma-0.5.1/docs/images/expo/bugcraft-studio-1344x840.jpg
new file mode 100644
index 0000000000000000000000000000000000000000..f37c3e26e9f7154e784b81886b268cc477ac3f1a
Binary files /dev/null and b/hshassets/assets/sass/lib/bulma-0.5.1/docs/images/expo/bugcraft-studio-1344x840.jpg differ
diff --git a/hshassets/assets/sass/lib/bulma-0.5.1/docs/images/expo/bugcraft-studio-672x420.jpg b/hshassets/assets/sass/lib/bulma-0.5.1/docs/images/expo/bugcraft-studio-672x420.jpg
new file mode 100644
index 0000000000000000000000000000000000000000..e5e5fa60528301294e5771f0de57d75bda3d93c5
Binary files /dev/null and b/hshassets/assets/sass/lib/bulma-0.5.1/docs/images/expo/bugcraft-studio-672x420.jpg differ
diff --git a/hshassets/assets/sass/lib/bulma-0.5.1/docs/images/expo/driftrock-1344x840.jpg b/hshassets/assets/sass/lib/bulma-0.5.1/docs/images/expo/driftrock-1344x840.jpg
new file mode 100644
index 0000000000000000000000000000000000000000..68b123788a09ccea68fb901318e49e23fc440249
Binary files /dev/null and b/hshassets/assets/sass/lib/bulma-0.5.1/docs/images/expo/driftrock-1344x840.jpg differ
diff --git a/hshassets/assets/sass/lib/bulma-0.5.1/docs/images/expo/driftrock-2688x1680.jpg b/hshassets/assets/sass/lib/bulma-0.5.1/docs/images/expo/driftrock-2688x1680.jpg
new file mode 100644
index 0000000000000000000000000000000000000000..3ad148569ba19845b8af5b3a60bdd3d2cd87c546
Binary files /dev/null and b/hshassets/assets/sass/lib/bulma-0.5.1/docs/images/expo/driftrock-2688x1680.jpg differ
diff --git a/hshassets/assets/sass/lib/bulma-0.5.1/docs/images/expo/driftrock-672x420.jpg b/hshassets/assets/sass/lib/bulma-0.5.1/docs/images/expo/driftrock-672x420.jpg
new file mode 100644
index 0000000000000000000000000000000000000000..0d8b99f076c9cc5ab9ba646c86faa437b26e893e
Binary files /dev/null and b/hshassets/assets/sass/lib/bulma-0.5.1/docs/images/expo/driftrock-672x420.jpg differ
diff --git a/hshassets/assets/sass/lib/bulma-0.5.1/docs/images/expo/elevo-1344x840.jpg b/hshassets/assets/sass/lib/bulma-0.5.1/docs/images/expo/elevo-1344x840.jpg
new file mode 100644
index 0000000000000000000000000000000000000000..b00dcad8ea6e089a9e2704c90950ba0019533d7b
Binary files /dev/null and b/hshassets/assets/sass/lib/bulma-0.5.1/docs/images/expo/elevo-1344x840.jpg differ
diff --git a/hshassets/assets/sass/lib/bulma-0.5.1/docs/images/expo/elevo-672x420.jpg b/hshassets/assets/sass/lib/bulma-0.5.1/docs/images/expo/elevo-672x420.jpg
new file mode 100644
index 0000000000000000000000000000000000000000..9b56b152f0efdf4e90af548a3daf77ec996bd7e2
Binary files /dev/null and b/hshassets/assets/sass/lib/bulma-0.5.1/docs/images/expo/elevo-672x420.jpg differ
diff --git a/hshassets/assets/sass/lib/bulma-0.5.1/docs/images/expo/jubiwee-1344x840.jpg b/hshassets/assets/sass/lib/bulma-0.5.1/docs/images/expo/jubiwee-1344x840.jpg
new file mode 100644
index 0000000000000000000000000000000000000000..51e14b2aedd8fe698a956dec5fd05536b7e34504
Binary files /dev/null and b/hshassets/assets/sass/lib/bulma-0.5.1/docs/images/expo/jubiwee-1344x840.jpg differ
diff --git a/hshassets/assets/sass/lib/bulma-0.5.1/docs/images/expo/jubiwee-672x420.jpg b/hshassets/assets/sass/lib/bulma-0.5.1/docs/images/expo/jubiwee-672x420.jpg
new file mode 100644
index 0000000000000000000000000000000000000000..92fca1009b9862196a6f276c497d4b01b8a632ae
Binary files /dev/null and b/hshassets/assets/sass/lib/bulma-0.5.1/docs/images/expo/jubiwee-672x420.jpg differ
diff --git a/hshassets/assets/sass/lib/bulma-0.5.1/docs/images/expo/kappamon-1344x840.jpg b/hshassets/assets/sass/lib/bulma-0.5.1/docs/images/expo/kappamon-1344x840.jpg
new file mode 100644
index 0000000000000000000000000000000000000000..4228a40c2986dd37be9c6601789851686f63cb66
Binary files /dev/null and b/hshassets/assets/sass/lib/bulma-0.5.1/docs/images/expo/kappamon-1344x840.jpg differ
diff --git a/hshassets/assets/sass/lib/bulma-0.5.1/docs/images/expo/kappamon-672x420.jpg b/hshassets/assets/sass/lib/bulma-0.5.1/docs/images/expo/kappamon-672x420.jpg
new file mode 100644
index 0000000000000000000000000000000000000000..3d7326513dcb5b780ef8053999343cc615ee1d7b
Binary files /dev/null and b/hshassets/assets/sass/lib/bulma-0.5.1/docs/images/expo/kappamon-672x420.jpg differ
diff --git a/hshassets/assets/sass/lib/bulma-0.5.1/docs/images/expo/md5-1344x840.jpg b/hshassets/assets/sass/lib/bulma-0.5.1/docs/images/expo/md5-1344x840.jpg
new file mode 100644
index 0000000000000000000000000000000000000000..1e133764ca0aa52d97d76817a616cb9fa883ed8e
Binary files /dev/null and b/hshassets/assets/sass/lib/bulma-0.5.1/docs/images/expo/md5-1344x840.jpg differ
diff --git a/hshassets/assets/sass/lib/bulma-0.5.1/docs/images/expo/md5-672x420.jpg b/hshassets/assets/sass/lib/bulma-0.5.1/docs/images/expo/md5-672x420.jpg
new file mode 100644
index 0000000000000000000000000000000000000000..504be2702515c5d359255a7250e4f45350e789d1
Binary files /dev/null and b/hshassets/assets/sass/lib/bulma-0.5.1/docs/images/expo/md5-672x420.jpg differ
diff --git a/hshassets/assets/sass/lib/bulma-0.5.1/docs/images/expo/oneday-1344x840.jpg b/hshassets/assets/sass/lib/bulma-0.5.1/docs/images/expo/oneday-1344x840.jpg
new file mode 100644
index 0000000000000000000000000000000000000000..cadb782638359cb6bc4f19263ac7b2dddc95f15b
Binary files /dev/null and b/hshassets/assets/sass/lib/bulma-0.5.1/docs/images/expo/oneday-1344x840.jpg differ
diff --git a/hshassets/assets/sass/lib/bulma-0.5.1/docs/images/expo/oneday-2688x1680.jpg b/hshassets/assets/sass/lib/bulma-0.5.1/docs/images/expo/oneday-2688x1680.jpg
new file mode 100644
index 0000000000000000000000000000000000000000..a62584e4bd24e9d24290f12a7e8f1787af1ae3c4
Binary files /dev/null and b/hshassets/assets/sass/lib/bulma-0.5.1/docs/images/expo/oneday-2688x1680.jpg differ
diff --git a/hshassets/assets/sass/lib/bulma-0.5.1/docs/images/expo/oneday-672x420.jpg b/hshassets/assets/sass/lib/bulma-0.5.1/docs/images/expo/oneday-672x420.jpg
new file mode 100644
index 0000000000000000000000000000000000000000..e2e48f5912411d43d9700f218a0eb0519223275b
Binary files /dev/null and b/hshassets/assets/sass/lib/bulma-0.5.1/docs/images/expo/oneday-672x420.jpg differ
diff --git a/hshassets/assets/sass/lib/bulma-0.5.1/docs/images/expo/pragonauts-1344x840.jpg b/hshassets/assets/sass/lib/bulma-0.5.1/docs/images/expo/pragonauts-1344x840.jpg
new file mode 100644
index 0000000000000000000000000000000000000000..4f74f0fde649a450d8df76516b79a8164eb8f6f0
Binary files /dev/null and b/hshassets/assets/sass/lib/bulma-0.5.1/docs/images/expo/pragonauts-1344x840.jpg differ
diff --git a/hshassets/assets/sass/lib/bulma-0.5.1/docs/images/expo/pragonauts-672x420.jpg b/hshassets/assets/sass/lib/bulma-0.5.1/docs/images/expo/pragonauts-672x420.jpg
new file mode 100644
index 0000000000000000000000000000000000000000..3e6fe6eac7f92676014589e9455eae8a6e5ee7e3
Binary files /dev/null and b/hshassets/assets/sass/lib/bulma-0.5.1/docs/images/expo/pragonauts-672x420.jpg differ
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/docs/images/extensions/bulma-badge.png b/hshassets/assets/sass/lib/bulma-0.5.1/docs/images/extensions/bulma-badge.png
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/docs/images/extensions/bulma-badge.png
rename to hshassets/assets/sass/lib/bulma-0.5.1/docs/images/extensions/bulma-badge.png
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/docs/images/extensions/bulma-pageloader.png b/hshassets/assets/sass/lib/bulma-0.5.1/docs/images/extensions/bulma-pageloader.png
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/docs/images/extensions/bulma-pageloader.png
rename to hshassets/assets/sass/lib/bulma-0.5.1/docs/images/extensions/bulma-pageloader.png
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/docs/images/extensions/bulma-ribbon.png b/hshassets/assets/sass/lib/bulma-0.5.1/docs/images/extensions/bulma-ribbon.png
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/docs/images/extensions/bulma-ribbon.png
rename to hshassets/assets/sass/lib/bulma-0.5.1/docs/images/extensions/bulma-ribbon.png
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/docs/images/extensions/bulma-steps.png b/hshassets/assets/sass/lib/bulma-0.5.1/docs/images/extensions/bulma-steps.png
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/docs/images/extensions/bulma-steps.png
rename to hshassets/assets/sass/lib/bulma-0.5.1/docs/images/extensions/bulma-steps.png
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/docs/images/extensions/bulma-timeline.png b/hshassets/assets/sass/lib/bulma-0.5.1/docs/images/extensions/bulma-timeline.png
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/docs/images/extensions/bulma-timeline.png
rename to hshassets/assets/sass/lib/bulma-0.5.1/docs/images/extensions/bulma-timeline.png
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/docs/images/extensions/bulma-tooltip.png b/hshassets/assets/sass/lib/bulma-0.5.1/docs/images/extensions/bulma-tooltip.png
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/docs/images/extensions/bulma-tooltip.png
rename to hshassets/assets/sass/lib/bulma-0.5.1/docs/images/extensions/bulma-tooltip.png
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/docs/images/html-reference-logo.png b/hshassets/assets/sass/lib/bulma-0.5.1/docs/images/html-reference-logo.png
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/docs/images/html-reference-logo.png
rename to hshassets/assets/sass/lib/bulma-0.5.1/docs/images/html-reference-logo.png
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/docs/images/jgthms.png b/hshassets/assets/sass/lib/bulma-0.5.1/docs/images/jgthms.png
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/docs/images/jgthms.png
rename to hshassets/assets/sass/lib/bulma-0.5.1/docs/images/jgthms.png
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/docs/images/paypal-donate.png b/hshassets/assets/sass/lib/bulma-0.5.1/docs/images/paypal-donate.png
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/docs/images/paypal-donate.png
rename to hshassets/assets/sass/lib/bulma-0.5.1/docs/images/paypal-donate.png
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/docs/images/placeholders/1280x960.png b/hshassets/assets/sass/lib/bulma-0.5.1/docs/images/placeholders/1280x960.png
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/docs/images/placeholders/1280x960.png
rename to hshassets/assets/sass/lib/bulma-0.5.1/docs/images/placeholders/1280x960.png
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/docs/images/placeholders/128x128.png b/hshassets/assets/sass/lib/bulma-0.5.1/docs/images/placeholders/128x128.png
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/docs/images/placeholders/128x128.png
rename to hshassets/assets/sass/lib/bulma-0.5.1/docs/images/placeholders/128x128.png
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/docs/images/placeholders/16x16.png b/hshassets/assets/sass/lib/bulma-0.5.1/docs/images/placeholders/16x16.png
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/docs/images/placeholders/16x16.png
rename to hshassets/assets/sass/lib/bulma-0.5.1/docs/images/placeholders/16x16.png
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/docs/images/placeholders/24x24.png b/hshassets/assets/sass/lib/bulma-0.5.1/docs/images/placeholders/24x24.png
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/docs/images/placeholders/24x24.png
rename to hshassets/assets/sass/lib/bulma-0.5.1/docs/images/placeholders/24x24.png
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/docs/images/placeholders/256x256.png b/hshassets/assets/sass/lib/bulma-0.5.1/docs/images/placeholders/256x256.png
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/docs/images/placeholders/256x256.png
rename to hshassets/assets/sass/lib/bulma-0.5.1/docs/images/placeholders/256x256.png
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/docs/images/placeholders/300x225.png b/hshassets/assets/sass/lib/bulma-0.5.1/docs/images/placeholders/300x225.png
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/docs/images/placeholders/300x225.png
rename to hshassets/assets/sass/lib/bulma-0.5.1/docs/images/placeholders/300x225.png
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/docs/images/placeholders/32x32.png b/hshassets/assets/sass/lib/bulma-0.5.1/docs/images/placeholders/32x32.png
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/docs/images/placeholders/32x32.png
rename to hshassets/assets/sass/lib/bulma-0.5.1/docs/images/placeholders/32x32.png
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/docs/images/placeholders/480x320.png b/hshassets/assets/sass/lib/bulma-0.5.1/docs/images/placeholders/480x320.png
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/docs/images/placeholders/480x320.png
rename to hshassets/assets/sass/lib/bulma-0.5.1/docs/images/placeholders/480x320.png
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/docs/images/placeholders/480x480.png b/hshassets/assets/sass/lib/bulma-0.5.1/docs/images/placeholders/480x480.png
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/docs/images/placeholders/480x480.png
rename to hshassets/assets/sass/lib/bulma-0.5.1/docs/images/placeholders/480x480.png
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/docs/images/placeholders/48x48.png b/hshassets/assets/sass/lib/bulma-0.5.1/docs/images/placeholders/48x48.png
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/docs/images/placeholders/48x48.png
rename to hshassets/assets/sass/lib/bulma-0.5.1/docs/images/placeholders/48x48.png
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/docs/images/placeholders/640x320.png b/hshassets/assets/sass/lib/bulma-0.5.1/docs/images/placeholders/640x320.png
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/docs/images/placeholders/640x320.png
rename to hshassets/assets/sass/lib/bulma-0.5.1/docs/images/placeholders/640x320.png
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/docs/images/placeholders/640x360.png b/hshassets/assets/sass/lib/bulma-0.5.1/docs/images/placeholders/640x360.png
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/docs/images/placeholders/640x360.png
rename to hshassets/assets/sass/lib/bulma-0.5.1/docs/images/placeholders/640x360.png
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/docs/images/placeholders/640x480.png b/hshassets/assets/sass/lib/bulma-0.5.1/docs/images/placeholders/640x480.png
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/docs/images/placeholders/640x480.png
rename to hshassets/assets/sass/lib/bulma-0.5.1/docs/images/placeholders/640x480.png
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/docs/images/placeholders/64x64.png b/hshassets/assets/sass/lib/bulma-0.5.1/docs/images/placeholders/64x64.png
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/docs/images/placeholders/64x64.png
rename to hshassets/assets/sass/lib/bulma-0.5.1/docs/images/placeholders/64x64.png
diff --git a/hshassets/assets/sass/lib/bulma-0.5.1/docs/images/placeholders/672x420.jpg b/hshassets/assets/sass/lib/bulma-0.5.1/docs/images/placeholders/672x420.jpg
new file mode 100644
index 0000000000000000000000000000000000000000..556c6d7bfc4c3374776002e816c0b96846bc2545
Binary files /dev/null and b/hshassets/assets/sass/lib/bulma-0.5.1/docs/images/placeholders/672x420.jpg differ
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/docs/images/placeholders/96x96.png b/hshassets/assets/sass/lib/bulma-0.5.1/docs/images/placeholders/96x96.png
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/docs/images/placeholders/96x96.png
rename to hshassets/assets/sass/lib/bulma-0.5.1/docs/images/placeholders/96x96.png
diff --git a/hshassets/assets/sass/lib/bulma-0.5.1/docs/images/placeholders/empty.png b/hshassets/assets/sass/lib/bulma-0.5.1/docs/images/placeholders/empty.png
new file mode 100644
index 0000000000000000000000000000000000000000..68b570555a8485b49dcafe4fdf29df3899e51315
Binary files /dev/null and b/hshassets/assets/sass/lib/bulma-0.5.1/docs/images/placeholders/empty.png differ
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/docs/index.html b/hshassets/assets/sass/lib/bulma-0.5.1/docs/index.html
similarity index 99%
rename from hshassets/assets/sass/lib/bulma-0.5.0/docs/index.html
rename to hshassets/assets/sass/lib/bulma-0.5.1/docs/index.html
index d68e738b2716a67be3a11b354d8fcf43cc1e8f41..0027962827f8b1488a709cc3bdd677003c5bce85 100644
--- a/hshassets/assets/sass/lib/bulma-0.5.0/docs/index.html
+++ b/hshassets/assets/sass/lib/bulma-0.5.1/docs/index.html
@@ -85,6 +85,10 @@ route: index
</div>
</section>
+<section class="testimonials">
+{% include testimonials.html %}
+</section>
+
<section class="section is-medium">
<div class="container">
<h3 class="title is-2">
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/docs/lib/bulma.js b/hshassets/assets/sass/lib/bulma-0.5.1/docs/lib/bulma.js
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/docs/lib/bulma.js
rename to hshassets/assets/sass/lib/bulma-0.5.1/docs/lib/bulma.js
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/docs/lib/clipboard.min.js b/hshassets/assets/sass/lib/bulma-0.5.1/docs/lib/clipboard.min.js
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/docs/lib/clipboard.min.js
rename to hshassets/assets/sass/lib/bulma-0.5.1/docs/lib/clipboard.min.js
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/docs/lib/index.js b/hshassets/assets/sass/lib/bulma-0.5.1/docs/lib/index.js
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/docs/lib/index.js
rename to hshassets/assets/sass/lib/bulma-0.5.1/docs/lib/index.js
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/docs/lib/main.js b/hshassets/assets/sass/lib/bulma-0.5.1/docs/lib/main.js
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/docs/lib/main.js
rename to hshassets/assets/sass/lib/bulma-0.5.1/docs/lib/main.js
diff --git a/hshassets/assets/sass/lib/bulma-0.5.1/docs/love.html b/hshassets/assets/sass/lib/bulma-0.5.1/docs/love.html
new file mode 100644
index 0000000000000000000000000000000000000000..d6f3c1f4cc570bb17549f11664a14692d71190cc
--- /dev/null
+++ b/hshassets/assets/sass/lib/bulma-0.5.1/docs/love.html
@@ -0,0 +1,139 @@
+---
+fulltitle: Love for Bulma 😍
+layout: default
+route: love
+---
+
+<div class="container">
+ {% include navbar.html id="LoveHero" %}
+</div>
+
+<section class="hero is-love rainbow">
+ <div class="hero-body">
+ <div class="container">
+ <div class="columns is-vcentered">
+ <div class="column">
+ <h1 class="title">
+ Love
+ </h1>
+ <p class="subtitle">
+ Happy thoughts from Twitter <span style="font-size: 20px; margin-left: 2px; position: relative; top: 1px;">😃</span>
+ </p>
+ </div>
+ <div class="column is-narrow">
+ {% include carbon.html %}
+ </div>
+ </div>
+ </div>
+ </div>
+</section>
+
+<main class="love">
+<div class="container">
+
+<div class="embrace">
+ <p class="embrace-text">
+ Are you a Bulma fan too? <strong>Show your support!</strong> <span style="font-size: 20px; margin-left: 2px; position: relative; top: 1px;">🤗</span>
+ </p>
+ <p class="embrace-button">
+ {% include elements/tw-button.html label="Tweet #bulmaio" %}
+ </p>
+</div>
+
+<div class="hugs">
+
+<article class="hug"><blockquote class="twitter-tweet" data-lang="en"><p lang="en" dir="ltr">Relaunched my personal site with <a href="https://twitter.com/hashtag/bulmaio?src=hash">#bulmaio</a>. The best css framework I've used yet. Thanks <a href="https://twitter.com/jgthms">@jgthms</a> 🤜</p>— L A N C E (@lancepadgett) <a href="https://twitter.com/lancepadgett/status/893193878685220864">August 3, 2017</a></blockquote></article>
+
+<article class="hug"><blockquote class="twitter-tweet" data-lang="en"><p lang="en" dir="ltr">Decided to use Bulma on this project I’m working on. I am happy to use it and happy to see the docs in tact too. Great work <a href="https://twitter.com/jgthms">@jgthms</a> !</p>— Jay Wilburn (@jay_wilburn) <a href="https://twitter.com/jay_wilburn/status/893176202210553857">August 3, 2017</a></blockquote></article>
+
+<article class="hug"><blockquote class="twitter-tweet" data-cards="hidden" data-lang="en"><p lang="en" dir="ltr">Actually making my own website easily & entirely with <a href="https://twitter.com/hashtag/bulmaio?src=hash">#bulmaio</a> Thanks <a href="https://twitter.com/jgthms">@jgthms</a> for a great framework <a href="https://t.co/27dMWIozmi">https://t.co/27dMWIozmi</a></p>— Chinux Paribus (@ch1nux) <a href="https://twitter.com/ch1nux/status/893112719519481856">August 3, 2017</a></blockquote></article>
+
+<article class="hug"><blockquote class="twitter-tweet" data-lang="en"><p lang="en" dir="ltr">The new file input styles with <a href="https://twitter.com/hashtag/bulmaio?src=hash">#bulmaio</a> were introduced just before i thought i have to do it on my own. Perfect timing <a href="https://twitter.com/jgthms">@jgthms</a></p>— Stefan Schwaighofer (@StefSchwai) <a href="https://twitter.com/StefSchwai/status/892798375753592836">August 2, 2017</a></blockquote></article>
+
+<article class="hug"><blockquote class="twitter-tweet" data-lang="en"><p lang="en" dir="ltr">Well, because of <a href="https://twitter.com/jgthms">@jgthms</a>, now all my websites are using <a href="https://twitter.com/hashtag/bulmacss?src=hash">#bulmacss</a> Thank you <3</p>— Cadox8🔸 (@cadox8) <a href="https://twitter.com/cadox8/status/892691375715745792">August 2, 2017</a></blockquote></article>
+
+<article class="hug"><blockquote class="twitter-tweet" data-lang="en"><p lang="en" dir="ltr">Finally had some free time to start, but I've really been enjoying converting my personal site to <a href="https://twitter.com/hashtag/bulmaio?src=hash">#bulmaio</a> by <a href="https://twitter.com/jgthms">@jgthms</a>. Can't wait to finish.</p>— Andrew Fomera (@AndrewFomera) <a href="https://twitter.com/AndrewFomera/status/892588073950773248">August 2, 2017</a></blockquote></article>
+
+<article class="hug"><blockquote class="twitter-tweet" data-lang="en"><p lang="en" dir="ltr"><a href="https://twitter.com/hashtag/Bulma?src=hash">#Bulma</a> helps make front-end dev fun again :) Great job <a href="https://twitter.com/jgthms">@jgthms</a>!</p>— Marco Petersen (@ocrampete16) <a href="https://twitter.com/ocrampete16/status/892362154610917378">August 1, 2017</a></blockquote></article>
+
+<article class="hug"><blockquote class="twitter-tweet" data-lang="en"><p lang="en" dir="ltr"><a href="https://twitter.com/hashtag/bulmaio?src=hash">#bulmaio</a> makes me so happy. Thank you <a href="https://twitter.com/jgthms">@jgthms</a>!</p>— Yokim Pillay (@YokimPillay) <a href="https://twitter.com/YokimPillay/status/892273691563896832">August 1, 2017</a></blockquote></article>
+
+<article class="hug"><blockquote class="twitter-tweet" data-lang="en"><p lang="en" dir="ltr">in all honesty, i heart bulma simple and getting better <a href="https://t.co/YRrzTt9wew">https://t.co/YRrzTt9wew</a> <a href="https://twitter.com/hashtag/bulmaio?src=hash">#bulmaio</a> via <a href="https://twitter.com/jgthms">@jgthms</a></p>— Scalla (@itsscalla) <a href="https://twitter.com/itsscalla/status/892184654501076994">August 1, 2017</a></blockquote></article>
+
+<article class="hug"><blockquote class="twitter-tweet" data-lang="en"><p lang="en" dir="ltr">Thanks <a href="https://twitter.com/jgthms">@jgthms</a> for <a href="https://twitter.com/hashtag/bulmacss?src=hash">#bulmacss</a>, redesigning my website with it 😃</p>— Daniel Harrin (@danjharrin) <a href="https://twitter.com/danjharrin/status/892083375196037124">July 31, 2017</a></blockquote></article>
+
+<article class="hug"><blockquote class="twitter-tweet" data-conversation="none" data-lang="en"><p lang="en" dir="ltr">Love using Bulma for my last <a href="https://twitter.com/rails">@rails</a> project. What I like the most is that it shipped without js so it works easily with Turbolinks.</p>— Thomas Galibert (@thomasgalibert) <a href="https://twitter.com/thomasgalibert/status/889499262136045569">July 24, 2017</a></blockquote></article>
+
+<article class="hug"><blockquote class="twitter-tweet" data-lang="en"><p lang="en" dir="ltr"><a href="https://twitter.com/jgthms">@jgthms</a> I got to know about Bulma today and love it already. Thank you for your work! Exactly I was looking for to build a landing page.</p>— Raathigeshan (@Raathigesh) <a href="https://twitter.com/Raathigesh/status/888602569148211203">July 22, 2017</a></blockquote></article>
+
+<article class="hug"><blockquote class="twitter-tweet" data-lang="en"><p lang="en" dir="ltr"><a href="https://twitter.com/jgthms">@jgthms</a> Thanks for the dropdowns man, I love 'em</p>— Oliver Dvorski (@oliverdvorski) <a href="https://twitter.com/oliverdvorski/status/884449239291580416">July 10, 2017</a></blockquote></article>
+
+<article class="hug"><blockquote class="twitter-tweet" data-lang="en"><p lang="en" dir="ltr">Updated my Bulma css framework to the latest and used the new Navbar! Good stuff! <a href="https://twitter.com/jgthms">@jgthms</a></p>— Josh Weaver (@3cordguy) <a href="https://twitter.com/3cordguy/status/884443272948658176">July 10, 2017</a></blockquote></article>
+
+<article class="hug"><blockquote class="twitter-tweet" data-cards="hidden" data-lang="en"><p lang="en" dir="ltr">New bulma release solves like 7 things I was building from scratch. Thank you! <a href="https://t.co/xwMKTXd68G">https://t.co/xwMKTXd68G</a> via <a href="https://twitter.com/jgthms">@jgthms</a></p>— Sarah C (@sarahsellaphix) <a href="https://twitter.com/sarahsellaphix/status/882772930194747392">July 6, 2017</a></blockquote></article>
+
+<article class="hug"><blockquote class="twitter-tweet" data-lang="en"><p lang="en" dir="ltr">today I've created a reasonable static website via bulma.io by <a href="https://twitter.com/jgthms">@jgthms</a><br>I've used 3 little JS scripts to handle classes and it was smooth AF!</p>— Andrea Giammarchi (@WebReflection) <a href="https://twitter.com/WebReflection/status/880554577187266560">June 29, 2017</a></blockquote></article>
+
+<article class="hug"><blockquote class="twitter-tweet" data-cards="hidden" data-lang="en"><p lang="en" dir="ltr">I'm really liking <a href="https://twitter.com/hashtag/bulma?src=hash">#bulma</a> CSS from <a href="https://twitter.com/jgthms">@jgthms</a> - way less fragile to theme yourself than a lot of CSS frameworks. <a href="https://t.co/VX9s6VuUKX">https://t.co/VX9s6VuUKX</a></p>— Joe B (@JoeBlubaugh) <a href="https://twitter.com/JoeBlubaugh/status/879918120143540224">June 28, 2017</a></blockquote></article>
+
+<article class="hug"><blockquote class="twitter-tweet" data-cards="hidden" data-lang="en"><p lang="en" dir="ltr">This looks awesome. Espec. horiz. & vert. alignments Bulma: a modern CSS framework based on Flexbox : <a href="https://t.co/iF8LQye3TD">https://t.co/iF8LQye3TD</a> via <a href="https://twitter.com/jgthms">@jgthms</a></p>— Brentley Broughton (@babroughton) <a href="https://twitter.com/babroughton/status/879725003306147840">June 27, 2017</a></blockquote></article>
+
+<article class="hug"><blockquote class="twitter-tweet" data-cards="hidden" data-lang="en"><p lang="en" dir="ltr">Been spending an inordinate amount of time playing w/ various css frameworks for my <a href="https://twitter.com/hashtag/reactjs?src=hash">#reactjs</a> site. Settled on <a href="https://t.co/KoRlyeoaI1">https://t.co/KoRlyeoaI1</a></p>— Julian Currie (@julian_currie) <a href="https://twitter.com/julian_currie/status/879294487301718016">June 26, 2017</a></blockquote></article>
+
+<article class="hug"><blockquote class="twitter-tweet" data-cards="hidden" data-lang="en"><p lang="en" dir="ltr">I just discovered <a href="https://t.co/5xcp1Bwfpz">https://t.co/5xcp1Bwfpz</a> by <a href="https://twitter.com/jgthms">@jgthms</a> - looks great. I'm gonna take it out for a test drive <a href="https://t.co/E5bbXjCD5H">pic.twitter.com/E5bbXjCD5H</a></p>— Jeff Kelley (@JeffKelleyBV) <a href="https://twitter.com/JeffKelleyBV/status/878220062007504897">June 23, 2017</a></blockquote></article>
+
+<article class="hug"><blockquote class="twitter-tweet" data-conversation="none" data-lang="en"><p lang="en" dir="ltr">Best framework on the web right now. Well done, please keep it up. World needs it!</p>— Anders (@anders0x) <a href="https://twitter.com/anders0x/status/877764422466322432">June 22, 2017</a></blockquote></article>
+
+<article class="hug"><blockquote class="twitter-tweet" data-cards="hidden" data-lang="en"><p lang="en" dir="ltr">Best Flexbox CSS Framework:<br>Bulma <a href="https://t.co/3BtGymZWMB">https://t.co/3BtGymZWMB</a><br><br>Thank you <a href="https://twitter.com/jgthms">@jgthms</a>, thank you.</p>— Seth Davis (@Setholito) <a href="https://twitter.com/Setholito/status/877691760226562048">June 22, 2017</a></blockquote></article>
+
+<article class="hug"><blockquote class="twitter-tweet" data-lang="en"><p lang="en" dir="ltr">Really Appreciate <a href="https://twitter.com/jgthms">@jgthms</a>. <br>As I beginner, because of bulma.io, I could write the code and I get self‐confidence! <a href="https://twitter.com/hashtag/bulma?src=hash">#bulma</a> <a href="https://twitter.com/hashtag/css?src=hash">#css</a> <a href="https://twitter.com/hashtag/framework?src=hash">#framework</a></p>— b_y (@by_snm) <a href="https://twitter.com/by_snm/status/877010184463294465">June 20, 2017</a></blockquote></article>
+
+<article class="hug"><blockquote class="twitter-tweet" data-conversation="none" data-lang="en"><p lang="en" dir="ltr">Bulma might be Bootstrap killer. I'm really liking it.</p>— Umar Farooq Khawaja (@UmarFKhawaja) <a href="https://twitter.com/UmarFKhawaja/status/875511410008219649">June 16, 2017</a></blockquote></article>
+
+<article class="hug"><blockquote class="twitter-tweet" data-cards="hidden" data-lang="en"><p lang="en" dir="ltr">I usually hate having to write CSS, but I really like working with the lightweight Bulma (<a href="https://t.co/OAMLjKWzak">https://t.co/OAMLjKWzak</a>) by <a href="https://twitter.com/jgthms">@jgthms</a> so far 👍</p>— mario zupan (@mzupzup) <a href="https://twitter.com/mzupzup/status/874925154475929602">June 14, 2017</a></blockquote></article>
+
+<article class="hug"><blockquote class="twitter-tweet" data-lang="en"><p lang="en" dir="ltr">Bulma framework just made my weekend better :) <a href="https://twitter.com/jgthms">@jgthms</a></p>— Victor Heid K.Miko (@victorheid) <a href="https://twitter.com/victorheid/status/874200312378269696">June 12, 2017</a></blockquote></article>
+
+<article class="hug"><blockquote class="twitter-tweet" data-cards="hidden" data-lang="en"><p lang="en" dir="ltr">Redesigning a website with 500K+ visitors/yr, going to give a Bulma a try <a href="https://twitter.com/jgthms">@jgthms</a> <a href="https://t.co/IcuGfvTQrI">https://t.co/IcuGfvTQrI</a></p>— Anand Chowdhary (@AnandChowdhary) <a href="https://twitter.com/AnandChowdhary/status/871410394622865408">June 4, 2017</a></blockquote></article>
+
+<article class="hug"><blockquote class="twitter-tweet" data-lang="en"><p lang="en" dir="ltr">Having a lot of fun building a website with <a href="https://twitter.com/GoHugoIO">@GoHugoIO</a> and <a href="https://twitter.com/jgthms">@jgthms</a> 's bulma!</p>— Martin Angers (@___mna___) <a href="https://twitter.com/___mna___/status/871163877622460417">June 4, 2017</a></blockquote></article>
+
+<article class="hug"><blockquote class="twitter-tweet" data-cards="hidden" data-lang="en"><p lang="en" dir="ltr">Bulma, I think I'm in love. <a href="https://t.co/APYefmC1Bs">https://t.co/APYefmC1Bs</a> via <a href="https://twitter.com/jgthms">@jgthms</a></p>— Jesse Schoff (@jesseschoff) <a href="https://twitter.com/jesseschoff/status/869284735440363520">May 29, 2017</a></blockquote></article>
+
+<article class="hug"><blockquote class="twitter-tweet" data-cards="hidden" data-lang="en"><p lang="en" dir="ltr">Just found <a href="https://twitter.com/jgthms">@jgthms</a>'s <a href="https://t.co/sa8Hy25rDH">https://t.co/sa8Hy25rDH</a>, an amazing css framework. Officially switching all new front-end work to this, this is amazing</p>— Alexander H. Black (@alexanderhblack) <a href="https://twitter.com/alexanderhblack/status/868730725926711296">May 28, 2017</a></blockquote></article>
+
+<article class="hug"><blockquote class="twitter-tweet" data-lang="en"><p lang="en" dir="ltr">So, I was making an exam and in a matter of 30 minutes I had my structure complete with responsive, Bulma is crazy. Thanks <a href="https://twitter.com/jgthms">@jgthms</a></p>— Francisco Cruz (@atFranCruz) <a href="https://twitter.com/atFranCruz/status/868829487072464897">May 28, 2017</a></blockquote></article>
+
+<article class="hug"><blockquote class="twitter-tweet" data-lang="en"><p lang="en" dir="ltr">The more I use <a href="https://twitter.com/hashtag/bulmacss?src=hash">#bulmacss</a> from the <a href="https://twitter.com/jgthms">@jgthms</a> combined with <a href="https://twitter.com/vuejs">@vuejs</a> it's truly a joy to code <a href="https://twitter.com/hashtag/webdev?src=hash">#webdev</a></p>— Kieran Glover (@kierglover) <a href="https://twitter.com/kierglover/status/864788587493154816">May 17, 2017</a></blockquote></article>
+
+<article class="hug"><blockquote class="twitter-tweet" data-cards="hidden" data-lang="en"><p lang="en" dir="ltr">Simple, beautiful and most importantly, very light. Bulma: a modern CSS framework based on Flexbox <a href="https://t.co/uv6JF2dDGJ">https://t.co/uv6JF2dDGJ</a> via <a href="https://twitter.com/jgthms">@jgthms</a></p>— Anas Red (@AnasAhmar) <a href="https://twitter.com/AnasAhmar/status/862586112770023425">May 11, 2017</a></blockquote></article>
+
+<article class="hug"><blockquote class="twitter-tweet" data-cards="hidden" data-lang="en"><p lang="en" dir="ltr"><a href="https://t.co/vY1ZsRScYM">https://t.co/vY1ZsRScYM</a> -- a CSS framework by <a href="https://twitter.com/jgthms">@jgthms</a> -- is lovely! No JS included, which means no JS opinions included!</p>— Robert Stuttaford (@RobStuttaford) <a href="https://twitter.com/RobStuttaford/status/860885116909998080">May 6, 2017</a></blockquote></article>
+
+<article class="hug"><blockquote class="twitter-tweet" data-lang="en"><p lang="en" dir="ltr"><a href="https://twitter.com/jgthms">@jgthms</a> Loving Bulma! This is making my day right now. Imported it into the starter theme I'm using.</p>— Scott Stewart (@CarlisleStewart) <a href="https://twitter.com/CarlisleStewart/status/857590406724243456">April 27, 2017</a></blockquote></article>
+
+<article class="hug"><blockquote class="twitter-tweet" data-lang="en"><p lang="en" dir="ltr">.<a href="https://twitter.com/jgthms">@jgthms</a> I've just discovered your suite of tools for web development: bulma.io & cssreference.io among others. Fabulous work - thanks!</p>— Victor Verhaegen (@vicver82) <a href="https://twitter.com/vicver82/status/839423865205977088">March 8, 2017</a></blockquote></article>
+
+<article class="hug"><blockquote class="twitter-tweet" data-cards="hidden" data-lang="en"><p lang="en" dir="ltr"><a href="https://t.co/ClYmBd8tGR">https://t.co/ClYmBd8tGR</a> is an impressive CSS framework. Flexbox grid, no JS, modular components (use what you need), Sass.<br><br>💯 <a href="https://twitter.com/jgthms">@jgthms</a>.</p>— scottgallant (@scottgallant) <a href="https://twitter.com/scottgallant/status/835834634655174658">February 26, 2017</a></blockquote></article>
+
+<article class="hug"><blockquote class="twitter-tweet" data-lang="en"><p lang="en" dir="ltr"><a href="https://twitter.com/jgthms">@jgthms</a> Hey Jeremy! Been putting Bulma into a project during the last days - absolutely love it! Well done! 😍</p>— Simon Jaeger (@simonjaegr) <a href="https://twitter.com/simonjaegr/status/834140257054502913">February 21, 2017</a></blockquote></article>
+
+<article class="hug"><blockquote class="twitter-tweet" data-conversation="none" data-lang="en"><p lang="en" dir="ltr">Reply to <a href="https://twitter.com/jgthms">@jgthms</a> Your framework is very good and lightweight compared to Twitter Bootstrap. I really like it.</p>— Ranie Santos (@raniesantos32) <a href="https://twitter.com/raniesantos32/status/834030605847326726">February 21, 2017</a></blockquote></article>
+
+<article class="hug"><blockquote class="twitter-tweet" data-lang="en"><p lang="en" dir="ltr">Jeremys reference sites are just so friendly. Love them. <a href="https://t.co/FhNs944XH6">https://t.co/FhNs944XH6</a></p>— Ville V. Vanninen (@sakamies) <a href="https://twitter.com/sakamies/status/831866770755579904">February 15, 2017</a></blockquote></article>
+
+<article class="hug"><blockquote class="twitter-tweet" data-lang="en"><p lang="en" dir="ltr"><a href="https://twitter.com/jgthms">@jgthms</a> Are you the one behind Bulma? I am using it in one project and I am completely delightful. Thank you so much!!</p>— Francisco Cruz (@atFranCruz) <a href="https://twitter.com/atFranCruz/status/824053457527209984">January 25, 2017</a></blockquote></article>
+
+<article class="hug"><blockquote class="twitter-tweet" data-lang="en"><p lang="en" dir="ltr"><a href="https://twitter.com/jgthms">@jgthms</a> Hey.I just stopped by here to say thank you so much for Bulma. It made my website looks 100 times better 😍</p>— juliooooo (@juliooooo000) <a href="https://twitter.com/juliooooo000/status/819710615337857024">January 13, 2017</a></blockquote></article>
+
+<!-- 2016 -->
+
+<article class="hug"><blockquote class="twitter-tweet" data-lang="en"><p lang="en" dir="ltr"><a href="https://twitter.com/jgthms">@jgthms</a> Bulma is badass. Nice work all around!</p>— Shaimoom Newaz (@shaimoomn) <a href="https://twitter.com/shaimoomn/status/808825432233558016">December 14, 2016</a></blockquote></article>
+
+<article class="hug"><blockquote class="twitter-tweet" data-lang="en"><p lang="en" dir="ltr"><a href="https://twitter.com/jgthms">@jgthms</a> love your work on bulma, you rock</p>— Andrew Cantos (@andrewcantos) <a href="https://twitter.com/andrewcantos/status/783630950718504960">October 5, 2016</a></blockquote></article>
+
+<article class="hug"><blockquote class="twitter-tweet" data-lang="en"><p lang="en" dir="ltr">Thanks <a href="https://twitter.com/jgthms">@jgthms</a> for updating my favourite css framework <a href="https://twitter.com/hashtag/bulmaio?src=hash">#bulmaio</a></p>— Juampe Ruiz (@juampe84) <a href="https://twitter.com/juampe84/status/779966186121560064">September 25, 2016</a></blockquote></article>
+
+</div>
+</div>
+</main>
\ No newline at end of file
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/docs/package.json b/hshassets/assets/sass/lib/bulma-0.5.1/docs/package.json
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/docs/package.json
rename to hshassets/assets/sass/lib/bulma-0.5.1/docs/package.json
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/docs/templates.html b/hshassets/assets/sass/lib/bulma-0.5.1/docs/templates.html
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/docs/templates.html
rename to hshassets/assets/sass/lib/bulma-0.5.1/docs/templates.html
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/docs/thank-you.html b/hshassets/assets/sass/lib/bulma-0.5.1/docs/thank-you.html
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/docs/thank-you.html
rename to hshassets/assets/sass/lib/bulma-0.5.1/docs/thank-you.html
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/docs/tiles.html b/hshassets/assets/sass/lib/bulma-0.5.1/docs/tiles.html
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/docs/tiles.html
rename to hshassets/assets/sass/lib/bulma-0.5.1/docs/tiles.html
diff --git a/hshassets/assets/sass/lib/bulma-0.5.1/docs/vendor/blazy-1.8.2.min.js b/hshassets/assets/sass/lib/bulma-0.5.1/docs/vendor/blazy-1.8.2.min.js
new file mode 100644
index 0000000000000000000000000000000000000000..649abfd84424590cff2ede8ce4c71903dc7f7c69
--- /dev/null
+++ b/hshassets/assets/sass/lib/bulma-0.5.1/docs/vendor/blazy-1.8.2.min.js
@@ -0,0 +1,6 @@
+/*!
+ hey, [be]Lazy.js - v1.8.2 - 2016.10.25
+ A fast, small and dependency free lazy load script (https://github.com/dinbror/blazy)
+ (c) Bjoern Klinggaard - @bklinggaard - http://dinbror.dk/blazy
+*/
+ (function(q,m){"function"===typeof define&&define.amd?define(m):"object"===typeof exports?module.exports=m():q.Blazy=m()})(this,function(){function q(b){var c=b._util;c.elements=E(b.options);c.count=c.elements.length;c.destroyed&&(c.destroyed=!1,b.options.container&&l(b.options.container,function(a){n(a,"scroll",c.validateT)}),n(window,"resize",c.saveViewportOffsetT),n(window,"resize",c.validateT),n(window,"scroll",c.validateT));m(b)}function m(b){for(var c=b._util,a=0;a<c.count;a++){var d=c.elements[a],e;a:{var g=d;e=b.options;var p=g.getBoundingClientRect();if(e.container&&y&&(g=g.closest(e.containerClass))){g=g.getBoundingClientRect();e=r(g,f)?r(p,{top:g.top-e.offset,right:g.right+e.offset,bottom:g.bottom+e.offset,left:g.left-e.offset}):!1;break a}e=r(p,f)}if(e||t(d,b.options.successClass))b.load(d),c.elements.splice(a,1),c.count--,a--}0===c.count&&b.destroy()}function r(b,c){return b.right>=c.left&&b.bottom>=c.top&&b.left<=c.right&&b.top<=c.bottom}function z(b,c,a){if(!t(b,a.successClass)&&(c||a.loadInvisible||0<b.offsetWidth&&0<b.offsetHeight))if(c=b.getAttribute(u)||b.getAttribute(a.src)){c=c.split(a.separator);var d=c[A&&1<c.length?1:0],e=b.getAttribute(a.srcset),g="img"===b.nodeName.toLowerCase(),p=(c=b.parentNode)&&"picture"===c.nodeName.toLowerCase();if(g||void 0===b.src){var h=new Image,w=function(){a.error&&a.error(b,"invalid");v(b,a.errorClass);k(h,"error",w);k(h,"load",f)},f=function(){g?p||B(b,d,e):b.style.backgroundImage='url("'+d+'")';x(b,a);k(h,"load",f);k(h,"error",w)};p&&(h=b,l(c.getElementsByTagName("source"),function(b){var c=a.srcset,e=b.getAttribute(c);e&&(b.setAttribute("srcset",e),b.removeAttribute(c))}));n(h,"error",w);n(h,"load",f);B(h,d,e)}else b.src=d,x(b,a)}else"video"===b.nodeName.toLowerCase()?(l(b.getElementsByTagName("source"),function(b){var c=a.src,e=b.getAttribute(c);e&&(b.setAttribute("src",e),b.removeAttribute(c))}),b.load(),x(b,a)):(a.error&&a.error(b,"missing"),v(b,a.errorClass))}function x(b,c){v(b,c.successClass);c.success&&c.success(b);b.removeAttribute(c.src);b.removeAttribute(c.srcset);l(c.breakpoints,function(a){b.removeAttribute(a.src)})}function B(b,c,a){a&&b.setAttribute("srcset",a);b.src=c}function t(b,c){return-1!==(" "+b.className+" ").indexOf(" "+c+" ")}function v(b,c){t(b,c)||(b.className+=" "+c)}function E(b){var c=[];b=b.root.querySelectorAll(b.selector);for(var a=b.length;a--;c.unshift(b[a]));return c}function C(b){f.bottom=(window.innerHeight||document.documentElement.clientHeight)+b;f.right=(window.innerWidth||document.documentElement.clientWidth)+b}function n(b,c,a){b.attachEvent?b.attachEvent&&b.attachEvent("on"+c,a):b.addEventListener(c,a,{capture:!1,passive:!0})}function k(b,c,a){b.detachEvent?b.detachEvent&&b.detachEvent("on"+c,a):b.removeEventListener(c,a,{capture:!1,passive:!0})}function l(b,c){if(b&&c)for(var a=b.length,d=0;d<a&&!1!==c(b[d],d);d++);}function D(b,c,a){var d=0;return function(){var e=+new Date;e-d<c||(d=e,b.apply(a,arguments))}}var u,f,A,y;return function(b){if(!document.querySelectorAll){var c=document.createStyleSheet();document.querySelectorAll=function(a,b,d,h,f){f=document.all;b=[];a=a.replace(/\[for\b/gi,"[htmlFor").split(",");for(d=a.length;d--;){c.addRule(a[d],"k:v");for(h=f.length;h--;)f[h].currentStyle.k&&b.push(f[h]);c.removeRule(0)}return b}}var a=this,d=a._util={};d.elements=[];d.destroyed=!0;a.options=b||{};a.options.error=a.options.error||!1;a.options.offset=a.options.offset||100;a.options.root=a.options.root||document;a.options.success=a.options.success||!1;a.options.selector=a.options.selector||".b-lazy";a.options.separator=a.options.separator||"|";a.options.containerClass=a.options.container;a.options.container=a.options.containerClass?document.querySelectorAll(a.options.containerClass):!1;a.options.errorClass=a.options.errorClass||"b-error";a.options.breakpoints=a.options.breakpoints||!1;a.options.loadInvisible=a.options.loadInvisible||!1;a.options.successClass=a.options.successClass||"b-loaded";a.options.validateDelay=a.options.validateDelay||25;a.options.saveViewportOffsetDelay=a.options.saveViewportOffsetDelay||50;a.options.srcset=a.options.srcset||"data-srcset";a.options.src=u=a.options.src||"data-src";y=Element.prototype.closest;A=1<window.devicePixelRatio;f={};f.top=0-a.options.offset;f.left=0-a.options.offset;a.revalidate=function(){q(a)};a.load=function(a,b){var c=this.options;void 0===a.length?z(a,b,c):l(a,function(a){z(a,b,c)})};a.destroy=function(){var a=this._util;this.options.container&&l(this.options.container,function(b){k(b,"scroll",a.validateT)});k(window,"scroll",a.validateT);k(window,"resize",a.validateT);k(window,"resize",a.saveViewportOffsetT);a.count=0;a.elements.length=0;a.destroyed=!0};d.validateT=D(function(){m(a)},a.options.validateDelay,a);d.saveViewportOffsetT=D(function(){C(a.options.offset)},a.options.saveViewportOffsetDelay,a);C(a.options.offset);l(a.options.breakpoints,function(a){if(a.width>=window.screen.width)return u=a.src,!1});setTimeout(function(){q(a)})}});
\ No newline at end of file
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/docs/vendor/clipboard-1.7.1.min.js b/hshassets/assets/sass/lib/bulma-0.5.1/docs/vendor/clipboard-1.7.1.min.js
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/docs/vendor/clipboard-1.7.1.min.js
rename to hshassets/assets/sass/lib/bulma-0.5.1/docs/vendor/clipboard-1.7.1.min.js
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/docs/versions.html b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions.html
similarity index 71%
rename from hshassets/assets/sass/lib/bulma-0.5.0/docs/versions.html
rename to hshassets/assets/sass/lib/bulma-0.5.1/docs/versions.html
index 5fdc0ff5c91e3c086145e2d7567571f38e9997ac..36b16ad5e24fcd24054afaa758fab94986e1886f 100644
--- a/hshassets/assets/sass/lib/bulma-0.5.0/docs/versions.html
+++ b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions.html
@@ -2,6 +2,9 @@
title: Versions
layout: default
route: versions
+versions:
+- 0.4.4
+- 0.5.0
---
<div class="container">
@@ -20,11 +23,13 @@ route: versions
Access previous versions of Bulma
</p>
<div class="field is-grouped is-grouped-multiline">
- <div class="control">
- <a class="button" href="{{site.url}}/versions/0.4.4">
- 0.4.4
- </a>
- </div>
+ {% for version in page.versions %}
+ <div class="control">
+ <a class="button" href="{{site.url}}/versions/{{ version }}">
+ {{ version }}
+ </a>
+ </div>
+ {% endfor %}
</div>
</div>
<div class="column is-narrow">
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/docs/versions/0.4.4/2016/02/09/blog-launched-new-responsive-columns-new-helpers/index.html b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.4.4/2016/02/09/blog-launched-new-responsive-columns-new-helpers/index.html
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/docs/versions/0.4.4/2016/02/09/blog-launched-new-responsive-columns-new-helpers/index.html
rename to hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.4.4/2016/02/09/blog-launched-new-responsive-columns-new-helpers/index.html
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/docs/versions/0.4.4/2016/04/11/metro-ui-css-grid-with-bulma-tiles/index.html b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.4.4/2016/04/11/metro-ui-css-grid-with-bulma-tiles/index.html
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/docs/versions/0.4.4/2016/04/11/metro-ui-css-grid-with-bulma-tiles/index.html
rename to hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.4.4/2016/04/11/metro-ui-css-grid-with-bulma-tiles/index.html
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/docs/versions/0.4.4/2017/03/10/new-field-element/index.html b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.4.4/2017/03/10/new-field-element/index.html
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/docs/versions/0.4.4/2017/03/10/new-field-element/index.html
rename to hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.4.4/2017/03/10/new-field-element/index.html
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/docs/versions/0.4.4/LICENSE b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.4.4/LICENSE
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/docs/versions/0.4.4/LICENSE
rename to hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.4.4/LICENSE
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/docs/versions/0.4.4/README.md b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.4.4/README.md
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/docs/versions/0.4.4/README.md
rename to hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.4.4/README.md
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/docs/versions/0.4.4/blog/index.html b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.4.4/blog/index.html
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/docs/versions/0.4.4/blog/index.html
rename to hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.4.4/blog/index.html
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/docs/versions/0.4.4/css/bulma-docs.css b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.4.4/css/bulma-docs.css
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/docs/versions/0.4.4/css/bulma-docs.css
rename to hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.4.4/css/bulma-docs.css
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/docs/versions/0.4.4/documentation/components/breadcrumb/index.html b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.4.4/documentation/components/breadcrumb/index.html
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/docs/versions/0.4.4/documentation/components/breadcrumb/index.html
rename to hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.4.4/documentation/components/breadcrumb/index.html
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/docs/versions/0.4.4/documentation/components/card/index.html b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.4.4/documentation/components/card/index.html
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/docs/versions/0.4.4/documentation/components/card/index.html
rename to hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.4.4/documentation/components/card/index.html
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/docs/versions/0.4.4/documentation/components/dropdown/index.html b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.4.4/documentation/components/dropdown/index.html
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/docs/versions/0.4.4/documentation/components/dropdown/index.html
rename to hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.4.4/documentation/components/dropdown/index.html
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/docs/versions/0.4.4/documentation/components/level/index.html b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.4.4/documentation/components/level/index.html
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/docs/versions/0.4.4/documentation/components/level/index.html
rename to hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.4.4/documentation/components/level/index.html
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/docs/versions/0.4.4/documentation/components/media-object/index.html b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.4.4/documentation/components/media-object/index.html
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/docs/versions/0.4.4/documentation/components/media-object/index.html
rename to hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.4.4/documentation/components/media-object/index.html
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/docs/versions/0.4.4/documentation/components/menu/index.html b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.4.4/documentation/components/menu/index.html
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/docs/versions/0.4.4/documentation/components/menu/index.html
rename to hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.4.4/documentation/components/menu/index.html
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/docs/versions/0.4.4/documentation/components/message/index.html b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.4.4/documentation/components/message/index.html
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/docs/versions/0.4.4/documentation/components/message/index.html
rename to hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.4.4/documentation/components/message/index.html
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/docs/versions/0.4.4/documentation/components/modal/index.html b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.4.4/documentation/components/modal/index.html
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/docs/versions/0.4.4/documentation/components/modal/index.html
rename to hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.4.4/documentation/components/modal/index.html
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/docs/versions/0.4.4/documentation/components/nav/index.html b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.4.4/documentation/components/nav/index.html
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/docs/versions/0.4.4/documentation/components/nav/index.html
rename to hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.4.4/documentation/components/nav/index.html
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/docs/versions/0.4.4/documentation/components/navbar/index.html b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.4.4/documentation/components/navbar/index.html
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/docs/versions/0.4.4/documentation/components/navbar/index.html
rename to hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.4.4/documentation/components/navbar/index.html
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/docs/versions/0.4.4/documentation/components/pagination/index.html b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.4.4/documentation/components/pagination/index.html
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/docs/versions/0.4.4/documentation/components/pagination/index.html
rename to hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.4.4/documentation/components/pagination/index.html
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/docs/versions/0.4.4/documentation/components/panel/index.html b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.4.4/documentation/components/panel/index.html
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/docs/versions/0.4.4/documentation/components/panel/index.html
rename to hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.4.4/documentation/components/panel/index.html
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/docs/versions/0.4.4/documentation/components/tabs/index.html b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.4.4/documentation/components/tabs/index.html
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/docs/versions/0.4.4/documentation/components/tabs/index.html
rename to hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.4.4/documentation/components/tabs/index.html
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/docs/versions/0.4.4/documentation/elements/box/index.html b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.4.4/documentation/elements/box/index.html
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/docs/versions/0.4.4/documentation/elements/box/index.html
rename to hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.4.4/documentation/elements/box/index.html
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/docs/versions/0.4.4/documentation/elements/button/index.html b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.4.4/documentation/elements/button/index.html
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/docs/versions/0.4.4/documentation/elements/button/index.html
rename to hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.4.4/documentation/elements/button/index.html
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/docs/versions/0.4.4/documentation/elements/content/index.html b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.4.4/documentation/elements/content/index.html
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/docs/versions/0.4.4/documentation/elements/content/index.html
rename to hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.4.4/documentation/elements/content/index.html
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/docs/versions/0.4.4/documentation/elements/delete/index.html b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.4.4/documentation/elements/delete/index.html
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/docs/versions/0.4.4/documentation/elements/delete/index.html
rename to hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.4.4/documentation/elements/delete/index.html
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/docs/versions/0.4.4/documentation/elements/form/index.html b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.4.4/documentation/elements/form/index.html
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/docs/versions/0.4.4/documentation/elements/form/index.html
rename to hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.4.4/documentation/elements/form/index.html
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/docs/versions/0.4.4/documentation/elements/icon/index.html b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.4.4/documentation/elements/icon/index.html
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/docs/versions/0.4.4/documentation/elements/icon/index.html
rename to hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.4.4/documentation/elements/icon/index.html
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/docs/versions/0.4.4/documentation/elements/image/index.html b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.4.4/documentation/elements/image/index.html
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/docs/versions/0.4.4/documentation/elements/image/index.html
rename to hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.4.4/documentation/elements/image/index.html
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/docs/versions/0.4.4/documentation/elements/notification/index.html b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.4.4/documentation/elements/notification/index.html
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/docs/versions/0.4.4/documentation/elements/notification/index.html
rename to hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.4.4/documentation/elements/notification/index.html
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/docs/versions/0.4.4/documentation/elements/progress/index.html b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.4.4/documentation/elements/progress/index.html
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/docs/versions/0.4.4/documentation/elements/progress/index.html
rename to hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.4.4/documentation/elements/progress/index.html
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/docs/versions/0.4.4/documentation/elements/table/index.html b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.4.4/documentation/elements/table/index.html
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/docs/versions/0.4.4/documentation/elements/table/index.html
rename to hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.4.4/documentation/elements/table/index.html
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/docs/versions/0.4.4/documentation/elements/tag/index.html b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.4.4/documentation/elements/tag/index.html
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/docs/versions/0.4.4/documentation/elements/tag/index.html
rename to hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.4.4/documentation/elements/tag/index.html
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/docs/versions/0.4.4/documentation/elements/title/index.html b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.4.4/documentation/elements/title/index.html
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/docs/versions/0.4.4/documentation/elements/title/index.html
rename to hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.4.4/documentation/elements/title/index.html
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/docs/versions/0.4.4/documentation/form/checkbox/index.html b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.4.4/documentation/form/checkbox/index.html
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/docs/versions/0.4.4/documentation/form/checkbox/index.html
rename to hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.4.4/documentation/form/checkbox/index.html
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/docs/versions/0.4.4/documentation/form/general/index.html b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.4.4/documentation/form/general/index.html
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/docs/versions/0.4.4/documentation/form/general/index.html
rename to hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.4.4/documentation/form/general/index.html
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/docs/versions/0.4.4/documentation/form/input/index.html b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.4.4/documentation/form/input/index.html
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/docs/versions/0.4.4/documentation/form/input/index.html
rename to hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.4.4/documentation/form/input/index.html
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/docs/versions/0.4.4/documentation/form/radio/index.html b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.4.4/documentation/form/radio/index.html
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/docs/versions/0.4.4/documentation/form/radio/index.html
rename to hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.4.4/documentation/form/radio/index.html
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/docs/versions/0.4.4/documentation/form/select/index.html b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.4.4/documentation/form/select/index.html
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/docs/versions/0.4.4/documentation/form/select/index.html
rename to hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.4.4/documentation/form/select/index.html
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/docs/versions/0.4.4/documentation/form/textarea/index.html b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.4.4/documentation/form/textarea/index.html
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/docs/versions/0.4.4/documentation/form/textarea/index.html
rename to hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.4.4/documentation/form/textarea/index.html
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/docs/versions/0.4.4/documentation/grid/columns/index.html b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.4.4/documentation/grid/columns/index.html
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/docs/versions/0.4.4/documentation/grid/columns/index.html
rename to hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.4.4/documentation/grid/columns/index.html
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/docs/versions/0.4.4/documentation/grid/tiles/index.html b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.4.4/documentation/grid/tiles/index.html
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/docs/versions/0.4.4/documentation/grid/tiles/index.html
rename to hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.4.4/documentation/grid/tiles/index.html
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/docs/versions/0.4.4/documentation/layout/container/index.html b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.4.4/documentation/layout/container/index.html
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/docs/versions/0.4.4/documentation/layout/container/index.html
rename to hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.4.4/documentation/layout/container/index.html
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/docs/versions/0.4.4/documentation/layout/footer/index.html b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.4.4/documentation/layout/footer/index.html
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/docs/versions/0.4.4/documentation/layout/footer/index.html
rename to hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.4.4/documentation/layout/footer/index.html
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/docs/versions/0.4.4/documentation/layout/hero/index.html b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.4.4/documentation/layout/hero/index.html
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/docs/versions/0.4.4/documentation/layout/hero/index.html
rename to hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.4.4/documentation/layout/hero/index.html
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/docs/versions/0.4.4/documentation/layout/section/index.html b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.4.4/documentation/layout/section/index.html
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/docs/versions/0.4.4/documentation/layout/section/index.html
rename to hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.4.4/documentation/layout/section/index.html
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/docs/versions/0.4.4/documentation/modifiers/helpers/index.html b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.4.4/documentation/modifiers/helpers/index.html
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/docs/versions/0.4.4/documentation/modifiers/helpers/index.html
rename to hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.4.4/documentation/modifiers/helpers/index.html
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/docs/versions/0.4.4/documentation/modifiers/responsive-helpers/index.html b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.4.4/documentation/modifiers/responsive-helpers/index.html
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/docs/versions/0.4.4/documentation/modifiers/responsive-helpers/index.html
rename to hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.4.4/documentation/modifiers/responsive-helpers/index.html
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/docs/versions/0.4.4/documentation/modifiers/syntax/index.html b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.4.4/documentation/modifiers/syntax/index.html
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/docs/versions/0.4.4/documentation/modifiers/syntax/index.html
rename to hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.4.4/documentation/modifiers/syntax/index.html
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/docs/versions/0.4.4/documentation/overview/classes/index.html b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.4.4/documentation/overview/classes/index.html
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/docs/versions/0.4.4/documentation/overview/classes/index.html
rename to hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.4.4/documentation/overview/classes/index.html
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/docs/versions/0.4.4/documentation/overview/customize/index.html b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.4.4/documentation/overview/customize/index.html
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/docs/versions/0.4.4/documentation/overview/customize/index.html
rename to hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.4.4/documentation/overview/customize/index.html
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/docs/versions/0.4.4/documentation/overview/functions/index.html b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.4.4/documentation/overview/functions/index.html
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/docs/versions/0.4.4/documentation/overview/functions/index.html
rename to hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.4.4/documentation/overview/functions/index.html
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/docs/versions/0.4.4/documentation/overview/mixins/index.html b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.4.4/documentation/overview/mixins/index.html
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/docs/versions/0.4.4/documentation/overview/mixins/index.html
rename to hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.4.4/documentation/overview/mixins/index.html
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/docs/versions/0.4.4/documentation/overview/modular/index.html b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.4.4/documentation/overview/modular/index.html
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/docs/versions/0.4.4/documentation/overview/modular/index.html
rename to hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.4.4/documentation/overview/modular/index.html
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/docs/versions/0.4.4/documentation/overview/responsiveness/index.html b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.4.4/documentation/overview/responsiveness/index.html
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/docs/versions/0.4.4/documentation/overview/responsiveness/index.html
rename to hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.4.4/documentation/overview/responsiveness/index.html
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/docs/versions/0.4.4/documentation/overview/start/index.html b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.4.4/documentation/overview/start/index.html
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/docs/versions/0.4.4/documentation/overview/start/index.html
rename to hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.4.4/documentation/overview/start/index.html
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/docs/versions/0.4.4/documentation/overview/variables/index.html b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.4.4/documentation/overview/variables/index.html
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/docs/versions/0.4.4/documentation/overview/variables/index.html
rename to hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.4.4/documentation/overview/variables/index.html
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/docs/versions/0.4.4/extensions/index.html b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.4.4/extensions/index.html
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/docs/versions/0.4.4/extensions/index.html
rename to hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.4.4/extensions/index.html
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/docs/versions/0.4.4/favicons/android-chrome-192x192.png b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.4.4/favicons/android-chrome-192x192.png
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/docs/versions/0.4.4/favicons/android-chrome-192x192.png
rename to hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.4.4/favicons/android-chrome-192x192.png
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/docs/versions/0.4.4/favicons/android-chrome-384x384.png b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.4.4/favicons/android-chrome-384x384.png
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/docs/versions/0.4.4/favicons/android-chrome-384x384.png
rename to hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.4.4/favicons/android-chrome-384x384.png
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/docs/versions/0.4.4/favicons/apple-touch-icon.png b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.4.4/favicons/apple-touch-icon.png
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/docs/versions/0.4.4/favicons/apple-touch-icon.png
rename to hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.4.4/favicons/apple-touch-icon.png
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/docs/versions/0.4.4/favicons/browserconfig.xml b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.4.4/favicons/browserconfig.xml
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/docs/versions/0.4.4/favicons/browserconfig.xml
rename to hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.4.4/favicons/browserconfig.xml
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/docs/versions/0.4.4/favicons/favicon-16x16.png b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.4.4/favicons/favicon-16x16.png
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/docs/versions/0.4.4/favicons/favicon-16x16.png
rename to hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.4.4/favicons/favicon-16x16.png
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/docs/versions/0.4.4/favicons/favicon-32x32.png b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.4.4/favicons/favicon-32x32.png
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/docs/versions/0.4.4/favicons/favicon-32x32.png
rename to hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.4.4/favicons/favicon-32x32.png
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/docs/versions/0.4.4/favicons/favicon.ico b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.4.4/favicons/favicon.ico
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/docs/versions/0.4.4/favicons/favicon.ico
rename to hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.4.4/favicons/favicon.ico
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/docs/versions/0.4.4/favicons/manifest.json b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.4.4/favicons/manifest.json
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/docs/versions/0.4.4/favicons/manifest.json
rename to hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.4.4/favicons/manifest.json
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/docs/versions/0.4.4/favicons/mstile-150x150.png b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.4.4/favicons/mstile-150x150.png
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/docs/versions/0.4.4/favicons/mstile-150x150.png
rename to hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.4.4/favicons/mstile-150x150.png
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/docs/versions/0.4.4/favicons/safari-pinned-tab.svg b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.4.4/favicons/safari-pinned-tab.svg
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/docs/versions/0.4.4/favicons/safari-pinned-tab.svg
rename to hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.4.4/favicons/safari-pinned-tab.svg
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/docs/versions/0.4.4/images/blog/metro-ui-css-grid-tiles.png b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.4.4/images/blog/metro-ui-css-grid-tiles.png
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/docs/versions/0.4.4/images/blog/metro-ui-css-grid-tiles.png
rename to hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.4.4/images/blog/metro-ui-css-grid-tiles.png
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/docs/versions/0.4.4/images/bulma-banner.png b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.4.4/images/bulma-banner.png
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/docs/versions/0.4.4/images/bulma-banner.png
rename to hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.4.4/images/bulma-banner.png
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/docs/versions/0.4.4/images/bulma-icon.png b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.4.4/images/bulma-icon.png
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/docs/versions/0.4.4/images/bulma-icon.png
rename to hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.4.4/images/bulma-icon.png
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/docs/versions/0.4.4/images/bulma-logo.png b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.4.4/images/bulma-logo.png
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/docs/versions/0.4.4/images/bulma-logo.png
rename to hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.4.4/images/bulma-logo.png
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/docs/versions/0.4.4/images/bulma-type-white.png b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.4.4/images/bulma-type-white.png
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/docs/versions/0.4.4/images/bulma-type-white.png
rename to hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.4.4/images/bulma-type-white.png
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/docs/versions/0.4.4/images/bulma-type.png b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.4.4/images/bulma-type.png
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/docs/versions/0.4.4/images/bulma-type.png
rename to hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.4.4/images/bulma-type.png
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/docs/versions/0.4.4/images/css-reference-logo.png b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.4.4/images/css-reference-logo.png
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/docs/versions/0.4.4/images/css-reference-logo.png
rename to hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.4.4/images/css-reference-logo.png
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/docs/versions/0.4.4/images/customize-after.png b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.4.4/images/customize-after.png
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/docs/versions/0.4.4/images/customize-after.png
rename to hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.4.4/images/customize-after.png
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/docs/versions/0.4.4/images/customize-before.png b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.4.4/images/customize-before.png
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/docs/versions/0.4.4/images/customize-before.png
rename to hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.4.4/images/customize-before.png
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/docs/versions/0.4.4/images/extensions/bulma-badge.png b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.4.4/images/extensions/bulma-badge.png
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/docs/versions/0.4.4/images/extensions/bulma-badge.png
rename to hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.4.4/images/extensions/bulma-badge.png
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/docs/versions/0.4.4/images/extensions/bulma-steps.png b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.4.4/images/extensions/bulma-steps.png
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/docs/versions/0.4.4/images/extensions/bulma-steps.png
rename to hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.4.4/images/extensions/bulma-steps.png
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/docs/versions/0.4.4/images/extensions/bulma-timeline.png b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.4.4/images/extensions/bulma-timeline.png
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/docs/versions/0.4.4/images/extensions/bulma-timeline.png
rename to hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.4.4/images/extensions/bulma-timeline.png
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/docs/versions/0.4.4/images/extensions/bulma-tooltip.png b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.4.4/images/extensions/bulma-tooltip.png
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/docs/versions/0.4.4/images/extensions/bulma-tooltip.png
rename to hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.4.4/images/extensions/bulma-tooltip.png
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/docs/versions/0.4.4/images/html-reference-logo.png b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.4.4/images/html-reference-logo.png
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/docs/versions/0.4.4/images/html-reference-logo.png
rename to hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.4.4/images/html-reference-logo.png
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/docs/versions/0.4.4/images/jgthms.png b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.4.4/images/jgthms.png
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/docs/versions/0.4.4/images/jgthms.png
rename to hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.4.4/images/jgthms.png
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/docs/versions/0.4.4/images/paypal-donate.png b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.4.4/images/paypal-donate.png
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/docs/versions/0.4.4/images/paypal-donate.png
rename to hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.4.4/images/paypal-donate.png
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/docs/versions/0.4.4/images/placeholders/1280x960.png b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.4.4/images/placeholders/1280x960.png
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/docs/versions/0.4.4/images/placeholders/1280x960.png
rename to hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.4.4/images/placeholders/1280x960.png
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/docs/versions/0.4.4/images/placeholders/128x128.png b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.4.4/images/placeholders/128x128.png
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/docs/versions/0.4.4/images/placeholders/128x128.png
rename to hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.4.4/images/placeholders/128x128.png
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/docs/versions/0.4.4/images/placeholders/16x16.png b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.4.4/images/placeholders/16x16.png
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/docs/versions/0.4.4/images/placeholders/16x16.png
rename to hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.4.4/images/placeholders/16x16.png
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/docs/versions/0.4.4/images/placeholders/24x24.png b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.4.4/images/placeholders/24x24.png
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/docs/versions/0.4.4/images/placeholders/24x24.png
rename to hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.4.4/images/placeholders/24x24.png
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/docs/versions/0.4.4/images/placeholders/256x256.png b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.4.4/images/placeholders/256x256.png
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/docs/versions/0.4.4/images/placeholders/256x256.png
rename to hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.4.4/images/placeholders/256x256.png
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/docs/versions/0.4.4/images/placeholders/300x225.png b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.4.4/images/placeholders/300x225.png
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/docs/versions/0.4.4/images/placeholders/300x225.png
rename to hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.4.4/images/placeholders/300x225.png
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/docs/versions/0.4.4/images/placeholders/32x32.png b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.4.4/images/placeholders/32x32.png
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/docs/versions/0.4.4/images/placeholders/32x32.png
rename to hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.4.4/images/placeholders/32x32.png
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/docs/versions/0.4.4/images/placeholders/480x320.png b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.4.4/images/placeholders/480x320.png
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/docs/versions/0.4.4/images/placeholders/480x320.png
rename to hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.4.4/images/placeholders/480x320.png
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/docs/versions/0.4.4/images/placeholders/480x480.png b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.4.4/images/placeholders/480x480.png
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/docs/versions/0.4.4/images/placeholders/480x480.png
rename to hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.4.4/images/placeholders/480x480.png
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/docs/versions/0.4.4/images/placeholders/48x48.png b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.4.4/images/placeholders/48x48.png
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/docs/versions/0.4.4/images/placeholders/48x48.png
rename to hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.4.4/images/placeholders/48x48.png
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/docs/versions/0.4.4/images/placeholders/640x320.png b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.4.4/images/placeholders/640x320.png
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/docs/versions/0.4.4/images/placeholders/640x320.png
rename to hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.4.4/images/placeholders/640x320.png
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/docs/versions/0.4.4/images/placeholders/640x360.png b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.4.4/images/placeholders/640x360.png
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/docs/versions/0.4.4/images/placeholders/640x360.png
rename to hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.4.4/images/placeholders/640x360.png
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/docs/versions/0.4.4/images/placeholders/640x480.png b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.4.4/images/placeholders/640x480.png
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/docs/versions/0.4.4/images/placeholders/640x480.png
rename to hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.4.4/images/placeholders/640x480.png
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/docs/versions/0.4.4/images/placeholders/64x64.png b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.4.4/images/placeholders/64x64.png
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/docs/versions/0.4.4/images/placeholders/64x64.png
rename to hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.4.4/images/placeholders/64x64.png
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/docs/versions/0.4.4/images/placeholders/96x96.png b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.4.4/images/placeholders/96x96.png
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/docs/versions/0.4.4/images/placeholders/96x96.png
rename to hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.4.4/images/placeholders/96x96.png
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/docs/versions/0.4.4/index.html b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.4.4/index.html
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/docs/versions/0.4.4/index.html
rename to hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.4.4/index.html
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/docs/versions/0.4.4/lib/bulma.js b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.4.4/lib/bulma.js
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/docs/versions/0.4.4/lib/bulma.js
rename to hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.4.4/lib/bulma.js
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/docs/versions/0.4.4/lib/clipboard.min.js b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.4.4/lib/clipboard.min.js
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/docs/versions/0.4.4/lib/clipboard.min.js
rename to hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.4.4/lib/clipboard.min.js
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/docs/versions/0.4.4/lib/index.js b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.4.4/lib/index.js
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/docs/versions/0.4.4/lib/index.js
rename to hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.4.4/lib/index.js
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/docs/versions/0.4.4/lib/main.js b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.4.4/lib/main.js
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/docs/versions/0.4.4/lib/main.js
rename to hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.4.4/lib/main.js
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/docs/versions/0.4.4/thank-you/index.html b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.4.4/thank-you/index.html
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/docs/versions/0.4.4/thank-you/index.html
rename to hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.4.4/thank-you/index.html
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/docs/versions/0.4.4/tiles/index.html b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.4.4/tiles/index.html
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/docs/versions/0.4.4/tiles/index.html
rename to hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.4.4/tiles/index.html
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/docs/versions/0.4.4/vendor/clipboard-1.7.1.min.js b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.4.4/vendor/clipboard-1.7.1.min.js
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/docs/versions/0.4.4/vendor/clipboard-1.7.1.min.js
rename to hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.4.4/vendor/clipboard-1.7.1.min.js
diff --git a/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/2016/02/09/blog-launched-new-responsive-columns-new-helpers/index.html b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/2016/02/09/blog-launched-new-responsive-columns-new-helpers/index.html
new file mode 100644
index 0000000000000000000000000000000000000000..55502c5b577d535b213ab61e176f74aa02502ca8
--- /dev/null
+++ b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/2016/02/09/blog-launched-new-responsive-columns-new-helpers/index.html
@@ -0,0 +1,655 @@
+<!DOCTYPE html>
+<html lang="en" class="route-post">
+ <head>
+ <meta charset="utf-8">
+ <meta http-equiv="X-UA-Compatible" content="IE=edge">
+ <meta name="viewport" content="width=device-width, initial-scale=1">
+ <meta name="description" content="First blog post on the newly launched blog! It even has its own RSS feed for those who still use that. This blog will be more frequently updated than the new...">
+
+ <title>Blog launched, new responsive columns, new helpers | Bulma v0.5.0: a modern CSS framework based on Flexbox</title>
+
+ <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.6.3/css/font-awesome.min.css">
+ <link rel="stylesheet" href="http://bulma.io/versions/0.5.0/css/bulma-docs.css">
+
+ <link rel="canonical" href="http://bulma.io/versions/0.5.0/2016/02/09/blog-launched-new-responsive-columns-new-helpers/">
+ <link rel="alternate" type="application/rss+xml" title="Bulma v0.5.0: a modern CSS framework based on Flexbox" href="http://bulma.io/versions/0.5.0/feed.xml">
+
+ <meta property="og:url" content="http://bulma.io/versions/0.5.0">
+ <meta property="og:type" content="website">
+ <meta property="og:title" content="Bulma v0.5.0: a modern CSS framework based on Flexbox">
+ <meta property="og:image" content="http://bulma.io/versions/0.5.0/images/bulma-banner.png">
+ <meta property="og:image:type" content="image/png">
+ <meta property="og:image:width" content="1200">
+ <meta property="og:image:height" content="630">
+ <meta property="og:description" content="Bulma v0.5.0 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <meta name="twitter:card" content="summary_large_image">
+ <meta name="twitter:site" content="@jgthms">
+ <meta name="twitter:creator" content="@jgthms">
+ <meta name="twitter:title" content="Bulma v0.5.0: a modern CSS framework based on Flexbox">
+ <meta name="twitter:image" content="http://bulma.io/versions/0.5.0/images/bulma-banner.png">
+ <meta name="twitter:description" content="Bulma v0.5.0 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <link rel="apple-touch-icon" sizes="180x180" href="http://bulma.io/versions/0.5.0/favicons/apple-touch-icon.png?v=201701041855">
+ <link rel="icon" type="image/png" href="http://bulma.io/versions/0.5.0/favicons/favicon-32x32.png?v=201701041855" sizes="32x32">
+ <link rel="icon" type="image/png" href="http://bulma.io/versions/0.5.0/favicons/favicon-16x16.png?v=201701041855" sizes="16x16">
+ <link rel="manifest" href="http://bulma.io/versions/0.5.0/favicons/manifest.json?v=201701041855">
+ <link rel="mask-icon" href="http://bulma.io/versions/0.5.0/favicons/safari-pinned-tab.svg?v=201701041855" color="#00d1b2">
+ <link rel="shortcut icon" href="http://bulma.io/versions/0.5.0/favicons/favicon.ico?v=201701041855">
+ <meta name="msapplication-config" content="http://bulma.io/versions/0.5.0/favicons/browserconfig.xml?v=201701041855">
+ <meta name="theme-color" content="#00d1b2">
+</head>
+
+ <body class="layout-post">
+
+ <div class="notification is-info" style="border-radius: 0; margin-bottom: 0;">
+ <p>
+ You are viewing the deprecated <strong>0.5.0</strong> version of the website.
+ <a href="/">Click here to view the latest version</a>
+ </p>
+ </div>
+
+
+ <div class="container">
+ <nav class="navbar ">
+ <div class="navbar-brand">
+ <a class="navbar-item" href="http://bulma.io/versions/0.5.0">
+ <img src="http://bulma.io/versions/0.5.0/images/bulma-logo.png" alt="Bulma v0.5.0: a modern CSS framework based on Flexbox" width="112" height="28">
+ </a>
+
+ <a class="navbar-item is-hidden-desktop" href="https://github.com/jgthms/bulma" target="_blank">
+ <span class="icon" style="color: #333;">
+ <i class="fa fa-github"></i>
+ </span>
+ </a>
+
+ <a class="navbar-item is-hidden-desktop" href="https://twitter.com/jgthms" target="_blank">
+ <span class="icon" style="color: #55acee;">
+ <i class="fa fa-twitter"></i>
+ </span>
+ </a>
+
+ <div class="navbar-burger burger" data-target="navMenuBlogHero">
+ <span></span>
+ <span></span>
+ <span></span>
+ </div>
+ </div>
+
+ <div id="navMenuBlogHero" class="navbar-menu">
+ <div class="navbar-start">
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/">
+ Home
+ </a>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <a class="navbar-link " href="/versions/0.5.0/documentation/overview/start/">
+ Docs
+ </a>
+ <div class="navbar-dropdown ">
+ <a class="navbar-item " href="/versions/0.5.0/documentation/overview/start/">
+ Overview
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/modifiers/syntax/">
+ Modifiers
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/grid/columns/">
+ Grid
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/form/general/">
+ Form
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/elements/box/">
+ Elements
+ </a>
+
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/components/breadcrumb/">
+ Components
+ </a>
+
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/layout/container/">
+ Layout
+ </a>
+ <hr class="navbar-divider">
+ <div class="navbar-item">
+ <div>
+ <p class="is-size-6-desktop">
+ <strong class="has-text-info">0.5.0</strong>
+ </p>
+
+ <small>
+ <a class="view-all-versions" href="/versions">View all versions</a>
+ </small>
+
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <a class="navbar-link " href="http://bulma.io/versions/0.5.0/blog/">
+ Blog
+ </a>
+ <div id="blogDropdown" class="navbar-dropdown " data-style="width: 18rem;">
+
+ <a class="navbar-item" href="/2017/07/24/access-previous-bulma-versions/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">24 Jul 2017</small>
+ </p>
+ <p>Access previous Bulma versions</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="/2017/03/10/new-field-element/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">10 Mar 2017</small>
+ </p>
+ <p>New field element (for better controls)</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="/2016/04/11/metro-ui-css-grid-with-bulma-tiles/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">11 Apr 2016</small>
+ </p>
+ <p>Metro UI CSS grid with Bulma tiles</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="http://bulma.io/versions/0.5.0/blog/">
+ More posts
+ </a>
+ <hr class="navbar-divider">
+ <div class="navbar-item">
+ <div class="navbar-content">
+ <div class="level is-mobile">
+ <div class="level-left">
+ <div class="level-item">
+ <strong>Stay up to date!</strong>
+ </div>
+ </div>
+ <div class="level-right">
+ <div class="level-item">
+ <a class="button is-rss is-small" href="http://bulma.io/versions/0.5.0/atom.xml">
+ <span class="icon is-small">
+ <i class="fa fa-rss"></i>
+ </span>
+ <span>Subscribe</span>
+ </a>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <div class="navbar-link">
+ More
+ </div>
+ <div id="moreDropdown" class="navbar-dropdown ">
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/extensions/">
+ <div class="level is-mobile">
+ <div class="level-left">
+ <div class="level-item">
+ <p>
+ <strong>Extensions</strong>
+ <br>
+ <small>Side projects to enhance Bulma</small>
+ </p>
+ </div>
+ </div>
+ <div class="level-right">
+ <div class="level-item">
+ <span class="icon has-text-info">
+ <i class="fa fa-plug"></i>
+ </span>
+ </div>
+ </div>
+ </div>
+ </a>
+ </div>
+ </div>
+ </div>
+
+ <div class="navbar-end">
+ <a class="navbar-item" href="https://github.com/jgthms/bulma" target="_blank">
+ Github
+ </a>
+ <a class="navbar-item" href="https://twitter.com/jgthms" target="_blank">
+ Twitter
+ </a>
+ <div class="navbar-item">
+ <div class="field is-grouped">
+ <p class="control">
+ <a id="twitter"
+ class="button"
+ data-social-network="Twitter"
+ data-social-action="tweet"
+ data-social-target="http://bulma.io/versions/0.5.0"
+ target="_blank"
+ href="https://twitter.com/intent/tweet?text=Bulma v0.5.0: a modern CSS framework based on Flexbox&url=http://bulma.io/versions/0.5.0&via=jgthms">
+ <span class="icon">
+ <i class="fa fa-twitter"></i>
+ </span>
+ <span>Tweet</span>
+ </a>
+ </p>
+ <p class="control">
+ <a class="button is-primary" href="https://github.com/jgthms/bulma/archive/0.5.0.zip">
+ <span class="icon">
+ <i class="fa fa-download"></i>
+ </span>
+ <span>Download</span>
+ </a>
+ </p>
+ </div>
+ </div>
+ </div>
+ </div>
+</nav>
+
+</div>
+
+<section class="hero is-warning">
+ <div class="hero-body">
+ <div class="container">
+ <div class="columns is-vcentered">
+ <div class="column">
+ <h1 class="title">
+ <a href="http://bulma.io/versions/0.5.0/blog">Blog</a>
+ </h1>
+ <p class="subtitle">
+ Stay updated about new features, bug fixes, and releases
+ </p>
+ <a class="button is-rss" href="http://bulma.io/versions/0.5.0/atom.xml">
+ <span class="icon">
+ <i class="fa fa-rss"></i>
+ </span>
+ <span>Subscribe</span>
+ </a>
+ </div>
+ <div class="column is-narrow">
+ <div id="carbon" class="box">
+ <script>
+ var _0xa6d2 = [
+ '\x73\x63\x72\x69\x70\x74',
+ '\x70\x61\x72\x65\x6e\x74\x4e\x6f\x64\x65',
+ '\x72\x65\x6d\x6f\x76\x65\x43\x68\x69\x6c\x64',
+ '\x73\x70\x6c\x69\x74',
+ '\x63\x72\x65\x61\x74\x65\x45\x6c\x65\x6d\x65\x6e\x74'
+ ];
+ (function (_0x2fd559, _0x28dd75) {
+ var _0x78c626 = function (_0x497400) {
+ while (--_0x497400) {
+ _0x2fd559['\x70\x75\x73\x68'](_0x2fd559['\x73\x68\x69\x66\x74']());
+ }
+ };
+ _0x78c626(++_0x28dd75);
+ }(_0xa6d2, 0x125));
+ var _0x2a6d = function (_0x8ed41, _0x381cfd) {
+ _0x8ed41 = _0x8ed41 - 0x0;
+ var _0x546dea = _0xa6d2[_0x8ed41];
+ return _0x546dea;
+ };
+ function __fb(_0x5ea579) {
+ var _0x3142de = '\x30\x7c\x31\x7c\x34\x7c\x33\x7c\x35\x7c\x32'[_0x2a6d('0x0')]('\x7c'), _0x58dc19 = 0x0;
+ while (!![]) {
+ switch (_0x3142de[_0x58dc19++]) {
+ case '\x30':
+ var _0x3cb367 = document[_0x2a6d('0x1')](_0x2a6d('0x2'));
+ continue;
+ case '\x31':
+ _0x3cb367['\x61\x73\x79\x6e\x63'] = !![];
+ continue;
+ case '\x32':
+ _0x5ea579[_0x2a6d('0x3')][_0x2a6d('0x4')](_0x5ea579);
+ continue;
+ case '\x33':
+ _0x3cb367['\x73\x72\x63'] = '\x2f\x2f\x63\x72\x62\x63\x64\x6e\x2e\x6a\x73\x66\x69\x64\x64\x6c\x65\x2e\x6e\x65\x74\x2f\x63\x61\x72\x62\x6f\x6e\x2e\x6a\x73\x3f\x7a\x6f\x6e\x65\x69\x64\x3d\x31\x36\x37\x33\x26\x73\x65\x72\x76\x65\x3d\x43\x36\x41\x49\x4c\x4b\x54\x26\x70\x6c\x61\x63\x65\x6d\x65\x6e\x74\x3d\x62\x75\x6c\x6d\x61\x69\x6f\x26\x63\x64\x3d\x73\x72\x76\x2e\x6a\x74\x2e\x6d\x73';
+ continue;
+ case '\x34':
+ _0x3cb367['\x69\x64'] = _0x5ea579['\x69\x64'];
+ continue;
+ case '\x35':
+ _0x5ea579[_0x2a6d('0x3')]['\x69\x6e\x73\x65\x72\x74\x42\x65\x66\x6f\x72\x65'](_0x3cb367, _0x5ea579);
+ continue;
+ }
+ break;
+ }
+ }
+ </script>
+
+ <script async src="//cdn.carbonads.com/carbon.js?zoneid=1673&serve=C6AILKT&placement=bulmaio" id="_carbonads_js" onerror="__fb(this)"></script>
+
+</div>
+
+ </div>
+ </div>
+ </div>
+ </div>
+</section>
+
+
+<section class="section">
+ <div class="container">
+ <div class="columns">
+ <div class="column is-offset-2 is-8">
+ <div class="article-image is-single is-danger">
+ <span class="article-overlay"></span>
+ <span class="article-icon">
+ <span class="icon">
+ <i class="fa fa-rocket"></i>
+ </span>
+ </span>
+ <strong class="article-title">
+ Launch!
+ </strong>
+ </div>
+ <p class="subtitle is-6">
+ <a class="article-back href="http://bulma.io/versions/0.5.0/blog">Back</a>
+ </p>
+ <p class="subtitle is-4">
+ 09 Feb 2016
+ </p>
+ <h1 class="title is-2">
+ Blog launched, new responsive columns, new helpers
+ </h1>
+ </article>
+ <hr>
+ <div class="content is-medium">
+ <p>First blog post on the newly launched blog! It even has its own <a href="/atom.xml">RSS feed</a> for those who still use that. This blog will be more frequently updated than the <a href="#newsletter">newsletter</a>, so you can subscribe to either or both, as they will be used for different purposes.</p>
+
+<h3 id="columns-on-mobile-too">Columns on mobile too</h3>
+
+<p>By default, columns are only activated on <strong>tablet</strong> and <strong>desktop</strong>. If you want to use columns on mobile <em>too</em>, add the <code class="highlighter-rouge">is-mobile</code> modifier on the <code class="highlighter-rouge">columns</code> container.</p>
+
+<figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"columns is-mobile"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"column"</span><span class="nt">></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"column"</span><span class="nt">></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"column"</span><span class="nt">></div></span>
+ <span class="c"><!-- etc. --></span>
+<span class="nt"></div></span></code></pre></figure>
+
+<h3 id="responsive-columns">Responsive columns</h3>
+
+<p>You can now apply different <strong>column size</strong> for each <strong>breakpoint</strong>.</p>
+
+<p>For example, let’s say you want a column to take half the width on mobile, a third on tablet, and a quarter on desktop:</p>
+
+<div class="columns is-mobile">
+ <div class="column is-half-mobile is-one-third-tablet is-one-quarter-desktop">
+ <p class="notification is-info">
+ <code>is-half-mobile</code><br />
+ <code>is-one-third-tablet</code><br />
+ <code>is-one-quarter-desktop</code>
+ </p>
+ </div>
+ <div class="column">
+ <p class="notification is-success">1</p>
+ </div>
+ <div class="column">
+ <p class="notification is-warning">1</p>
+ </div>
+ <div class="column">
+ <p class="notification is-success">1</p>
+ </div>
+ <div class="column">
+ <p class="notification is-warning">1</p>
+ </div>
+</div>
+
+<figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"columns is-mobile"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"column is-half-mobile is-one-third-tablet is-one-quarter-desktop"</span><span class="nt">></div></span>
+ <span class="c"><!-- Other columns --></span>
+<span class="nt"></div></span></code></pre></figure>
+
+<div class="message is-info">
+ <div class="message-header">
+ Info
+ </div>
+ <div class="message-body">
+ If you use <strong>mobile</strong> modifiers on single <code>column</code> elements, make sure to use the <code>is-mobile</code> modifier on the <code>columns</code> container.
+ </div>
+</div>
+
+<h3 id="multiline-columns">Multiline columns</h3>
+
+<p>By default, if you want to start a new <strong>row</strong>, you just need to close a <code class="highlighter-rouge">columns</code> container and open a new one.</p>
+
+<p>But you can also add the <code class="highlighter-rouge">is-multiline</code> <strong>modifier</strong> on the <code class="highlighter-rouge">columns</code> container, and use <strong>column size</strong> modifiers (like <code class="highlighter-rouge">is-half</code> or <code class="highlighter-rouge">is-3</code>) to define size on multiple rows within the <em>same</em> container.</p>
+
+<div class="columns is-multiline is-mobile">
+ <div class="column is-one-quarter">
+ <p class="notification is-info"><code>is-one-quarter</code></p>
+ </div>
+ <div class="column is-one-quarter">
+ <p class="notification is-success"><code>is-one-quarter</code></p>
+ </div>
+ <div class="column is-one-quarter">
+ <p class="notification is-warning"><code>is-one-quarter</code></p>
+ </div>
+ <div class="column is-one-quarter">
+ <p class="notification is-danger"><code>is-one-quarter</code></p>
+ </div>
+ <div class="column is-half">
+ <p class="notification is-info"><code>is-half</code></p>
+ </div>
+ <div class="column is-one-quarter">
+ <p class="notification is-success"><code>is-one-quarter</code></p>
+ </div>
+ <div class="column is-one-quarter">
+ <p class="notification is-warning"><code>is-one-quarter</code></p>
+ </div>
+ <div class="column is-one-quarter">
+ <p class="notification is-danger"><code>is-one-quarter</code></p>
+ </div>
+ <div class="column">
+ <p class="notification is-info">Auto</p>
+ </div>
+</div>
+
+<figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"columns is-multiline is-mobile"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"column is-one-quarter"</span><span class="nt">></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"column is-one-quarter"</span><span class="nt">></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"column is-one-quarter"</span><span class="nt">></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"column is-one-quarter"</span><span class="nt">></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"column is-half"</span><span class="nt">></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"column is-one-quarter"</span><span class="nt">></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"column is-one-quarter"</span><span class="nt">></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"column is-one-quarter"</span><span class="nt">></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"column"</span><span class="nt">></div></span>
+<span class="nt"></div></span></code></pre></figure>
+
+<h3 id="helpers-section">Helpers section</h3>
+
+<p>While modifiers are specific to each Bulma element, <strong>helpers</strong> are general utility classes that can be applied on almost <em>any</em> element. Check out the new <a href="/documentation/modifiers/helpers/">helpers documentation</a>!</p>
+
+ </div>
+ </div>
+ </div>
+ </div>
+</section>
+
+
+<script src="//m.servedby-buysellads.com/monetization.js" type="text/javascript"></script>
+
+<section class="hero is-info bsa">
+ <div class="container">
+ <div class="columns is-vcentered">
+ <div class="column is-4">
+ <p class="title">Bulma <strong>Partners</strong></p>
+ <p class="subtitle">Check out their products!</p>
+ </div>
+
+ <div class="column is-8">
+ <div class="bsa-cpc"></div>
+ </div>
+ </div>
+ </div>
+</section>
+
+<script>
+ (function(){
+ if(typeof _bsa !== 'undefined' && _bsa) {
+ _bsa.init('default', 'CVAIKK3E', 'placement:bulmaio', {
+ target: '.bsa-cpc',
+ align: 'horizontal',
+ disable_css: 'true'
+ });
+ }
+ })();
+</script>
+
+
+<section id="newsletter" class="hero is-primary">
+ <div class="hero-body">
+ <div class="container">
+ <!-- Begin MailChimp Signup Form -->
+ <div id="mc_embed_signup" class="columns is-vcentered">
+ <div class="column is-one-third is-left">
+ <p class="title">Bulma <strong>Newsletter</strong></p>
+ <p class="subtitle">Get notified when v1 is ready!</p>
+ </div>
+
+ <div class="column">
+ <form action="https://bbxdesign.us3.list-manage.com/subscribe/post?u=b43b93fe633f0560b2a72a69c&id=52585e8803" method="post" id="mc-embedded-subscribe-form" name="mc-embedded-subscribe-form" class="validate" target="_blank" novalidate>
+ <div id="mc_embed_signup_scroll">
+ <div class="field is-grouped">
+ <div class="control has-icons-left is-expanded">
+ <input type="email" value="" name="EMAIL" class="input is-flat required email" id="mce-EMAIL" placeholder="email address" required>
+ <span class="icon is-small is-left">
+ <i class="fa fa-envelope"></i>
+ </span>
+ </div>
+ <div class="control">
+ <input type="submit" value="Subscribe" name="subscribe" id="mc-embedded-subscribe" class="button is-white is-outlined">
+ </div>
+ </div>
+ <div id="mce-responses">
+ <div class="notification is-danger response" id="mce-error-response" style="display:none"></div>
+ <div class="notification is-success response" id="mce-success-response" style="display:none"></div>
+ </div>
+ <!-- real people should not fill this in and expect good things - do not remove this or risk form bot signups-->
+ <div style="position: absolute; left: -5000px;" aria-hidden="true">
+ <input type="text" name="b_b43b93fe633f0560b2a72a69c_52585e8803" tabindex="-1" value="">
+ </div>
+ </div>
+ </form>
+ </div>
+ </div>
+ <!--End mc_embed_signup-->
+ </div>
+ </div>
+</section>
+
+<footer class="footer">
+ <div class="container">
+ <div class="columns">
+ <div class="column is-3">
+ <div id="about" class="content">
+ <strong xmlns:dct="http://purl.org/dc/terms/" href="http://purl.org/dc/dcmitype/Text" property="dct:title" rel="dct:type">Bulma</strong> by <a xmlns:cc="http://creativecommons.org/ns#" href="http://jgthms.com" property="cc:attributionName" rel="cc:attributionURL">Jeremy Thomas</a>.
+
+ <div class="twitter-container">
+ <a href="https://twitter.com/jgthms" class="twitter-follow-button" data-show-count="true" data-lang="en" data-size="large">@jgthms</a>
+ </div>
+
+ </div>
+ </div>
+ <div class="column is-5">
+ <div id="share" class="content">
+ <div>
+ <strong>Support</strong> and share the love!
+ </div>
+
+ <div id="social">
+ <iframe class="github-btn" src="https://ghbtns.com/github-btn.html?user=jgthms&repo=bulma&type=star&count=true&size=large" allowtransparency="true" frameborder="0" scrolling="0" width="160px" height="30px"></iframe>
+
+ <a href="https://twitter.com/share" class="twitter-share-button" data-text="Bulma v0.5.0: a modern CSS framework based on Flexbox" data-url="http://bulma.io/versions/0.5.0" data-count="horizontal" data-via="jgthms" data-related="jgthms:Creator of Bulma" data-size="large">Tweet</a>
+
+ <form class="paypal-form" action="https://www.paypal.com/cgi-bin/webscr" method="post" target="_top">
+ <input type="hidden" name="cmd" value="_s-xclick">
+ <input type="hidden" name="hosted_button_id" value="8WMKYSRFN6A78">
+ <input type="image" src="http://bulma.io/versions/0.5.0/images/paypal-donate.png" border="0" name="submit" alt="PayPal – The safer, easier way to pay online." height="30">
+ <img alt="" border="0" src="https://www.paypalobjects.com/en_GB/i/scr/pixel.gif" width="1" height="1">
+ </form>
+
+ <div class="fb-like" data-href="https://www.facebook.com/bulmaio" data-layout="button" data-action="like" data-size="large" data-show-faces="false" data-share="true"></div>
+ </div>
+
+ </div>
+ </div>
+ <div class="column is-4">
+ <div id="sister">
+ <p>
+ More <strong>helpful</strong> tools:
+ </p>
+ <ul>
+ <li>
+ <a href="http://cssreference.io">
+ <img src="http://bulma.io/versions/0.5.0/images/css-reference-logo.png" alt="CSS Reference logo">
+ </a>
+ </li>
+ <li>
+ <a href="http://htmlreference.io">
+ <img src="http://bulma.io/versions/0.5.0/images/html-reference-logo.png" alt="HTML Reference logo">
+ </a>
+ </li>
+ </ul>
+ </div>
+ </div>
+ </div>
+
+ <p id="tsp">
+ <small>
+ Source code licensed <a href="http://opensource.org/licenses/mit-license.php">MIT</a>.
+ <br>
+ Website content licensed <a rel="license" href="http://creativecommons.org/licenses/by-nc-sa/4.0/">CC BY-NC-SA 4.0</a>.
+ </small>
+ </p>
+ </div>
+</footer>
+
+<script src="http://bulma.io/versions/0.5.0/vendor/clipboard-1.7.1.min.js"></script>
+<script src="http://bulma.io/versions/0.5.0/lib/main.js"></script>
+
+
+
+<div id="fb-root"></div>
+
+<script async defer type="text/javascript">(function(d, s, id) {
+ var js, fjs = d.getElementsByTagName(s)[0];
+ if (d.getElementById(id)) return;
+ js = d.createElement(s); js.id = id;
+ js.async = true;
+ js.defer = true;
+ js.src = "//connect.facebook.net/en_US/sdk.js#xfbml=1&version=v2.8&appId=310296819307942";
+ fjs.parentNode.insertBefore(js, fjs);
+}(document, 'script', 'facebook-jssdk'));</script>
+
+<script async defer id="twitter-wjs" src="https://platform.twitter.com/widgets.js"></script>
+<script async defer type="text/javascript" src="https://s3.amazonaws.com/downloads.mailchimp.com/js/mc-validate.js"></script>
+
+<script async defer type="text/javascript">
+ (function() {
+ window.fnames = new Array();
+ window.ftypes = new Array();
+ fnames[0]='EMAIL';
+ ftypes[0]='email';
+ }());
+ // var $mcj = window.jQuery.noConflict(true);
+</script>
+
+<script async defer type="text/javascript">
+ (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
+ (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
+ m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
+ })(window,document,'script','https://www.google-analytics.com/analytics.js','ga');
+
+ ga('create', 'UA-82634666-2', 'auto');
+ ga('send', 'pageview');
+</script>
+
+ </body>
+</html>
diff --git a/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/2016/04/11/metro-ui-css-grid-with-bulma-tiles/index.html b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/2016/04/11/metro-ui-css-grid-with-bulma-tiles/index.html
new file mode 100644
index 0000000000000000000000000000000000000000..ec6b529478475755e10eb0385e85c9e29fa301ca
--- /dev/null
+++ b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/2016/04/11/metro-ui-css-grid-with-bulma-tiles/index.html
@@ -0,0 +1,555 @@
+<!DOCTYPE html>
+<html lang="en" class="route-post">
+ <head>
+ <meta charset="utf-8">
+ <meta http-equiv="X-UA-Compatible" content="IE=edge">
+ <meta name="viewport" content="width=device-width, initial-scale=1">
+ <meta name="description" content="Have you ever wanted to build a Metro-UI-like grid in CSS?Thanks to Flexbox and the new Bulma tiles, you now can! And it only requires 1 HTML element: the ti...">
+
+ <title>Metro UI CSS grid with Bulma tiles | Bulma v0.5.0: a modern CSS framework based on Flexbox</title>
+
+ <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.6.3/css/font-awesome.min.css">
+ <link rel="stylesheet" href="http://bulma.io/versions/0.5.0/css/bulma-docs.css">
+
+ <link rel="canonical" href="http://bulma.io/versions/0.5.0/2016/04/11/metro-ui-css-grid-with-bulma-tiles/">
+ <link rel="alternate" type="application/rss+xml" title="Bulma v0.5.0: a modern CSS framework based on Flexbox" href="http://bulma.io/versions/0.5.0/feed.xml">
+
+ <meta property="og:url" content="http://bulma.io/versions/0.5.0">
+ <meta property="og:type" content="website">
+ <meta property="og:title" content="Bulma v0.5.0: a modern CSS framework based on Flexbox">
+ <meta property="og:image" content="http://bulma.io/versions/0.5.0/images/bulma-banner.png">
+ <meta property="og:image:type" content="image/png">
+ <meta property="og:image:width" content="1200">
+ <meta property="og:image:height" content="630">
+ <meta property="og:description" content="Bulma v0.5.0 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <meta name="twitter:card" content="summary_large_image">
+ <meta name="twitter:site" content="@jgthms">
+ <meta name="twitter:creator" content="@jgthms">
+ <meta name="twitter:title" content="Bulma v0.5.0: a modern CSS framework based on Flexbox">
+ <meta name="twitter:image" content="http://bulma.io/versions/0.5.0/images/bulma-banner.png">
+ <meta name="twitter:description" content="Bulma v0.5.0 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <link rel="apple-touch-icon" sizes="180x180" href="http://bulma.io/versions/0.5.0/favicons/apple-touch-icon.png?v=201701041855">
+ <link rel="icon" type="image/png" href="http://bulma.io/versions/0.5.0/favicons/favicon-32x32.png?v=201701041855" sizes="32x32">
+ <link rel="icon" type="image/png" href="http://bulma.io/versions/0.5.0/favicons/favicon-16x16.png?v=201701041855" sizes="16x16">
+ <link rel="manifest" href="http://bulma.io/versions/0.5.0/favicons/manifest.json?v=201701041855">
+ <link rel="mask-icon" href="http://bulma.io/versions/0.5.0/favicons/safari-pinned-tab.svg?v=201701041855" color="#00d1b2">
+ <link rel="shortcut icon" href="http://bulma.io/versions/0.5.0/favicons/favicon.ico?v=201701041855">
+ <meta name="msapplication-config" content="http://bulma.io/versions/0.5.0/favicons/browserconfig.xml?v=201701041855">
+ <meta name="theme-color" content="#00d1b2">
+</head>
+
+ <body class="layout-post">
+
+ <div class="notification is-info" style="border-radius: 0; margin-bottom: 0;">
+ <p>
+ You are viewing the deprecated <strong>0.5.0</strong> version of the website.
+ <a href="/">Click here to view the latest version</a>
+ </p>
+ </div>
+
+
+ <div class="container">
+ <nav class="navbar ">
+ <div class="navbar-brand">
+ <a class="navbar-item" href="http://bulma.io/versions/0.5.0">
+ <img src="http://bulma.io/versions/0.5.0/images/bulma-logo.png" alt="Bulma v0.5.0: a modern CSS framework based on Flexbox" width="112" height="28">
+ </a>
+
+ <a class="navbar-item is-hidden-desktop" href="https://github.com/jgthms/bulma" target="_blank">
+ <span class="icon" style="color: #333;">
+ <i class="fa fa-github"></i>
+ </span>
+ </a>
+
+ <a class="navbar-item is-hidden-desktop" href="https://twitter.com/jgthms" target="_blank">
+ <span class="icon" style="color: #55acee;">
+ <i class="fa fa-twitter"></i>
+ </span>
+ </a>
+
+ <div class="navbar-burger burger" data-target="navMenuBlogHero">
+ <span></span>
+ <span></span>
+ <span></span>
+ </div>
+ </div>
+
+ <div id="navMenuBlogHero" class="navbar-menu">
+ <div class="navbar-start">
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/">
+ Home
+ </a>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <a class="navbar-link " href="/versions/0.5.0/documentation/overview/start/">
+ Docs
+ </a>
+ <div class="navbar-dropdown ">
+ <a class="navbar-item " href="/versions/0.5.0/documentation/overview/start/">
+ Overview
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/modifiers/syntax/">
+ Modifiers
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/grid/columns/">
+ Grid
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/form/general/">
+ Form
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/elements/box/">
+ Elements
+ </a>
+
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/components/breadcrumb/">
+ Components
+ </a>
+
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/layout/container/">
+ Layout
+ </a>
+ <hr class="navbar-divider">
+ <div class="navbar-item">
+ <div>
+ <p class="is-size-6-desktop">
+ <strong class="has-text-info">0.5.0</strong>
+ </p>
+
+ <small>
+ <a class="view-all-versions" href="/versions">View all versions</a>
+ </small>
+
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <a class="navbar-link " href="http://bulma.io/versions/0.5.0/blog/">
+ Blog
+ </a>
+ <div id="blogDropdown" class="navbar-dropdown " data-style="width: 18rem;">
+
+ <a class="navbar-item" href="/2017/07/24/access-previous-bulma-versions/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">24 Jul 2017</small>
+ </p>
+ <p>Access previous Bulma versions</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="/2017/03/10/new-field-element/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">10 Mar 2017</small>
+ </p>
+ <p>New field element (for better controls)</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="/2016/04/11/metro-ui-css-grid-with-bulma-tiles/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">11 Apr 2016</small>
+ </p>
+ <p>Metro UI CSS grid with Bulma tiles</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="http://bulma.io/versions/0.5.0/blog/">
+ More posts
+ </a>
+ <hr class="navbar-divider">
+ <div class="navbar-item">
+ <div class="navbar-content">
+ <div class="level is-mobile">
+ <div class="level-left">
+ <div class="level-item">
+ <strong>Stay up to date!</strong>
+ </div>
+ </div>
+ <div class="level-right">
+ <div class="level-item">
+ <a class="button is-rss is-small" href="http://bulma.io/versions/0.5.0/atom.xml">
+ <span class="icon is-small">
+ <i class="fa fa-rss"></i>
+ </span>
+ <span>Subscribe</span>
+ </a>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <div class="navbar-link">
+ More
+ </div>
+ <div id="moreDropdown" class="navbar-dropdown ">
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/extensions/">
+ <div class="level is-mobile">
+ <div class="level-left">
+ <div class="level-item">
+ <p>
+ <strong>Extensions</strong>
+ <br>
+ <small>Side projects to enhance Bulma</small>
+ </p>
+ </div>
+ </div>
+ <div class="level-right">
+ <div class="level-item">
+ <span class="icon has-text-info">
+ <i class="fa fa-plug"></i>
+ </span>
+ </div>
+ </div>
+ </div>
+ </a>
+ </div>
+ </div>
+ </div>
+
+ <div class="navbar-end">
+ <a class="navbar-item" href="https://github.com/jgthms/bulma" target="_blank">
+ Github
+ </a>
+ <a class="navbar-item" href="https://twitter.com/jgthms" target="_blank">
+ Twitter
+ </a>
+ <div class="navbar-item">
+ <div class="field is-grouped">
+ <p class="control">
+ <a id="twitter"
+ class="button"
+ data-social-network="Twitter"
+ data-social-action="tweet"
+ data-social-target="http://bulma.io/versions/0.5.0"
+ target="_blank"
+ href="https://twitter.com/intent/tweet?text=Bulma v0.5.0: a modern CSS framework based on Flexbox&url=http://bulma.io/versions/0.5.0&via=jgthms">
+ <span class="icon">
+ <i class="fa fa-twitter"></i>
+ </span>
+ <span>Tweet</span>
+ </a>
+ </p>
+ <p class="control">
+ <a class="button is-primary" href="https://github.com/jgthms/bulma/archive/0.5.0.zip">
+ <span class="icon">
+ <i class="fa fa-download"></i>
+ </span>
+ <span>Download</span>
+ </a>
+ </p>
+ </div>
+ </div>
+ </div>
+ </div>
+</nav>
+
+</div>
+
+<section class="hero is-warning">
+ <div class="hero-body">
+ <div class="container">
+ <div class="columns is-vcentered">
+ <div class="column">
+ <h1 class="title">
+ <a href="http://bulma.io/versions/0.5.0/blog">Blog</a>
+ </h1>
+ <p class="subtitle">
+ Stay updated about new features, bug fixes, and releases
+ </p>
+ <a class="button is-rss" href="http://bulma.io/versions/0.5.0/atom.xml">
+ <span class="icon">
+ <i class="fa fa-rss"></i>
+ </span>
+ <span>Subscribe</span>
+ </a>
+ </div>
+ <div class="column is-narrow">
+ <div id="carbon" class="box">
+ <script>
+ var _0xa6d2 = [
+ '\x73\x63\x72\x69\x70\x74',
+ '\x70\x61\x72\x65\x6e\x74\x4e\x6f\x64\x65',
+ '\x72\x65\x6d\x6f\x76\x65\x43\x68\x69\x6c\x64',
+ '\x73\x70\x6c\x69\x74',
+ '\x63\x72\x65\x61\x74\x65\x45\x6c\x65\x6d\x65\x6e\x74'
+ ];
+ (function (_0x2fd559, _0x28dd75) {
+ var _0x78c626 = function (_0x497400) {
+ while (--_0x497400) {
+ _0x2fd559['\x70\x75\x73\x68'](_0x2fd559['\x73\x68\x69\x66\x74']());
+ }
+ };
+ _0x78c626(++_0x28dd75);
+ }(_0xa6d2, 0x125));
+ var _0x2a6d = function (_0x8ed41, _0x381cfd) {
+ _0x8ed41 = _0x8ed41 - 0x0;
+ var _0x546dea = _0xa6d2[_0x8ed41];
+ return _0x546dea;
+ };
+ function __fb(_0x5ea579) {
+ var _0x3142de = '\x30\x7c\x31\x7c\x34\x7c\x33\x7c\x35\x7c\x32'[_0x2a6d('0x0')]('\x7c'), _0x58dc19 = 0x0;
+ while (!![]) {
+ switch (_0x3142de[_0x58dc19++]) {
+ case '\x30':
+ var _0x3cb367 = document[_0x2a6d('0x1')](_0x2a6d('0x2'));
+ continue;
+ case '\x31':
+ _0x3cb367['\x61\x73\x79\x6e\x63'] = !![];
+ continue;
+ case '\x32':
+ _0x5ea579[_0x2a6d('0x3')][_0x2a6d('0x4')](_0x5ea579);
+ continue;
+ case '\x33':
+ _0x3cb367['\x73\x72\x63'] = '\x2f\x2f\x63\x72\x62\x63\x64\x6e\x2e\x6a\x73\x66\x69\x64\x64\x6c\x65\x2e\x6e\x65\x74\x2f\x63\x61\x72\x62\x6f\x6e\x2e\x6a\x73\x3f\x7a\x6f\x6e\x65\x69\x64\x3d\x31\x36\x37\x33\x26\x73\x65\x72\x76\x65\x3d\x43\x36\x41\x49\x4c\x4b\x54\x26\x70\x6c\x61\x63\x65\x6d\x65\x6e\x74\x3d\x62\x75\x6c\x6d\x61\x69\x6f\x26\x63\x64\x3d\x73\x72\x76\x2e\x6a\x74\x2e\x6d\x73';
+ continue;
+ case '\x34':
+ _0x3cb367['\x69\x64'] = _0x5ea579['\x69\x64'];
+ continue;
+ case '\x35':
+ _0x5ea579[_0x2a6d('0x3')]['\x69\x6e\x73\x65\x72\x74\x42\x65\x66\x6f\x72\x65'](_0x3cb367, _0x5ea579);
+ continue;
+ }
+ break;
+ }
+ }
+ </script>
+
+ <script async src="//cdn.carbonads.com/carbon.js?zoneid=1673&serve=C6AILKT&placement=bulmaio" id="_carbonads_js" onerror="__fb(this)"></script>
+
+</div>
+
+ </div>
+ </div>
+ </div>
+ </div>
+</section>
+
+
+<section class="section">
+ <div class="container">
+ <div class="columns">
+ <div class="column is-offset-2 is-8">
+ <div class="article-image is-single is-info">
+ <span class="article-overlay"></span>
+ <span class="article-icon">
+ <span class="icon">
+ <i class="fa fa-th-large"></i>
+ </span>
+ </span>
+ <strong class="article-title">
+ Metro UI
+ </strong>
+ </div>
+ <p class="subtitle is-6">
+ <a class="article-back href="http://bulma.io/versions/0.5.0/blog">Back</a>
+ </p>
+ <p class="subtitle is-4">
+ 11 Apr 2016
+ </p>
+ <h1 class="title is-2">
+ Metro UI CSS grid with Bulma tiles
+ </h1>
+ </article>
+ <hr>
+ <div class="content is-medium">
+ <p>Have you ever wanted to build a <strong>Metro-UI-like grid in CSS</strong>?
+Thanks to Flexbox and the new <a href="http://bulma.io/documentation/grid/tiles/">Bulma tiles</a>, you now can! And it only requires 1 HTML element: the <code class="highlighter-rouge">tile</code> element.</p>
+
+<p><a href="http://bulma.io/documentation/grid/tiles/"><img src="/images/blog/metro-ui-css-grid-tiles.png" alt="Metro UI grid tiles in CSS" /></a></p>
+
+<p>Check out the <a href="http://bulma.io/documentation/grid/tiles/">documentation</a>!</p>
+
+ </div>
+ </div>
+ </div>
+ </div>
+</section>
+
+
+<script src="//m.servedby-buysellads.com/monetization.js" type="text/javascript"></script>
+
+<section class="hero is-info bsa">
+ <div class="container">
+ <div class="columns is-vcentered">
+ <div class="column is-4">
+ <p class="title">Bulma <strong>Partners</strong></p>
+ <p class="subtitle">Check out their products!</p>
+ </div>
+
+ <div class="column is-8">
+ <div class="bsa-cpc"></div>
+ </div>
+ </div>
+ </div>
+</section>
+
+<script>
+ (function(){
+ if(typeof _bsa !== 'undefined' && _bsa) {
+ _bsa.init('default', 'CVAIKK3E', 'placement:bulmaio', {
+ target: '.bsa-cpc',
+ align: 'horizontal',
+ disable_css: 'true'
+ });
+ }
+ })();
+</script>
+
+
+<section id="newsletter" class="hero is-primary">
+ <div class="hero-body">
+ <div class="container">
+ <!-- Begin MailChimp Signup Form -->
+ <div id="mc_embed_signup" class="columns is-vcentered">
+ <div class="column is-one-third is-left">
+ <p class="title">Bulma <strong>Newsletter</strong></p>
+ <p class="subtitle">Get notified when v1 is ready!</p>
+ </div>
+
+ <div class="column">
+ <form action="https://bbxdesign.us3.list-manage.com/subscribe/post?u=b43b93fe633f0560b2a72a69c&id=52585e8803" method="post" id="mc-embedded-subscribe-form" name="mc-embedded-subscribe-form" class="validate" target="_blank" novalidate>
+ <div id="mc_embed_signup_scroll">
+ <div class="field is-grouped">
+ <div class="control has-icons-left is-expanded">
+ <input type="email" value="" name="EMAIL" class="input is-flat required email" id="mce-EMAIL" placeholder="email address" required>
+ <span class="icon is-small is-left">
+ <i class="fa fa-envelope"></i>
+ </span>
+ </div>
+ <div class="control">
+ <input type="submit" value="Subscribe" name="subscribe" id="mc-embedded-subscribe" class="button is-white is-outlined">
+ </div>
+ </div>
+ <div id="mce-responses">
+ <div class="notification is-danger response" id="mce-error-response" style="display:none"></div>
+ <div class="notification is-success response" id="mce-success-response" style="display:none"></div>
+ </div>
+ <!-- real people should not fill this in and expect good things - do not remove this or risk form bot signups-->
+ <div style="position: absolute; left: -5000px;" aria-hidden="true">
+ <input type="text" name="b_b43b93fe633f0560b2a72a69c_52585e8803" tabindex="-1" value="">
+ </div>
+ </div>
+ </form>
+ </div>
+ </div>
+ <!--End mc_embed_signup-->
+ </div>
+ </div>
+</section>
+
+<footer class="footer">
+ <div class="container">
+ <div class="columns">
+ <div class="column is-3">
+ <div id="about" class="content">
+ <strong xmlns:dct="http://purl.org/dc/terms/" href="http://purl.org/dc/dcmitype/Text" property="dct:title" rel="dct:type">Bulma</strong> by <a xmlns:cc="http://creativecommons.org/ns#" href="http://jgthms.com" property="cc:attributionName" rel="cc:attributionURL">Jeremy Thomas</a>.
+
+ <div class="twitter-container">
+ <a href="https://twitter.com/jgthms" class="twitter-follow-button" data-show-count="true" data-lang="en" data-size="large">@jgthms</a>
+ </div>
+
+ </div>
+ </div>
+ <div class="column is-5">
+ <div id="share" class="content">
+ <div>
+ <strong>Support</strong> and share the love!
+ </div>
+
+ <div id="social">
+ <iframe class="github-btn" src="https://ghbtns.com/github-btn.html?user=jgthms&repo=bulma&type=star&count=true&size=large" allowtransparency="true" frameborder="0" scrolling="0" width="160px" height="30px"></iframe>
+
+ <a href="https://twitter.com/share" class="twitter-share-button" data-text="Bulma v0.5.0: a modern CSS framework based on Flexbox" data-url="http://bulma.io/versions/0.5.0" data-count="horizontal" data-via="jgthms" data-related="jgthms:Creator of Bulma" data-size="large">Tweet</a>
+
+ <form class="paypal-form" action="https://www.paypal.com/cgi-bin/webscr" method="post" target="_top">
+ <input type="hidden" name="cmd" value="_s-xclick">
+ <input type="hidden" name="hosted_button_id" value="8WMKYSRFN6A78">
+ <input type="image" src="http://bulma.io/versions/0.5.0/images/paypal-donate.png" border="0" name="submit" alt="PayPal – The safer, easier way to pay online." height="30">
+ <img alt="" border="0" src="https://www.paypalobjects.com/en_GB/i/scr/pixel.gif" width="1" height="1">
+ </form>
+
+ <div class="fb-like" data-href="https://www.facebook.com/bulmaio" data-layout="button" data-action="like" data-size="large" data-show-faces="false" data-share="true"></div>
+ </div>
+
+ </div>
+ </div>
+ <div class="column is-4">
+ <div id="sister">
+ <p>
+ More <strong>helpful</strong> tools:
+ </p>
+ <ul>
+ <li>
+ <a href="http://cssreference.io">
+ <img src="http://bulma.io/versions/0.5.0/images/css-reference-logo.png" alt="CSS Reference logo">
+ </a>
+ </li>
+ <li>
+ <a href="http://htmlreference.io">
+ <img src="http://bulma.io/versions/0.5.0/images/html-reference-logo.png" alt="HTML Reference logo">
+ </a>
+ </li>
+ </ul>
+ </div>
+ </div>
+ </div>
+
+ <p id="tsp">
+ <small>
+ Source code licensed <a href="http://opensource.org/licenses/mit-license.php">MIT</a>.
+ <br>
+ Website content licensed <a rel="license" href="http://creativecommons.org/licenses/by-nc-sa/4.0/">CC BY-NC-SA 4.0</a>.
+ </small>
+ </p>
+ </div>
+</footer>
+
+<script src="http://bulma.io/versions/0.5.0/vendor/clipboard-1.7.1.min.js"></script>
+<script src="http://bulma.io/versions/0.5.0/lib/main.js"></script>
+
+
+
+<div id="fb-root"></div>
+
+<script async defer type="text/javascript">(function(d, s, id) {
+ var js, fjs = d.getElementsByTagName(s)[0];
+ if (d.getElementById(id)) return;
+ js = d.createElement(s); js.id = id;
+ js.async = true;
+ js.defer = true;
+ js.src = "//connect.facebook.net/en_US/sdk.js#xfbml=1&version=v2.8&appId=310296819307942";
+ fjs.parentNode.insertBefore(js, fjs);
+}(document, 'script', 'facebook-jssdk'));</script>
+
+<script async defer id="twitter-wjs" src="https://platform.twitter.com/widgets.js"></script>
+<script async defer type="text/javascript" src="https://s3.amazonaws.com/downloads.mailchimp.com/js/mc-validate.js"></script>
+
+<script async defer type="text/javascript">
+ (function() {
+ window.fnames = new Array();
+ window.ftypes = new Array();
+ fnames[0]='EMAIL';
+ ftypes[0]='email';
+ }());
+ // var $mcj = window.jQuery.noConflict(true);
+</script>
+
+<script async defer type="text/javascript">
+ (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
+ (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
+ m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
+ })(window,document,'script','https://www.google-analytics.com/analytics.js','ga');
+
+ ga('create', 'UA-82634666-2', 'auto');
+ ga('send', 'pageview');
+</script>
+
+ </body>
+</html>
diff --git a/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/2017/03/10/new-field-element/index.html b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/2017/03/10/new-field-element/index.html
new file mode 100644
index 0000000000000000000000000000000000000000..815da78dcb9abb66e0bcc4236543ac16e22cb97a
--- /dev/null
+++ b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/2017/03/10/new-field-element/index.html
@@ -0,0 +1,667 @@
+<!DOCTYPE html>
+<html lang="en" class="route-post">
+ <head>
+ <meta charset="utf-8">
+ <meta http-equiv="X-UA-Compatible" content="IE=edge">
+ <meta name="viewport" content="width=device-width, initial-scale=1">
+ <meta name="description" content="TL;DR: there’s a new .field container, and .control has been re-purposed.">
+
+ <title>New field element (for better controls) | Bulma v0.5.0: a modern CSS framework based on Flexbox</title>
+
+ <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.6.3/css/font-awesome.min.css">
+ <link rel="stylesheet" href="http://bulma.io/versions/0.5.0/css/bulma-docs.css">
+
+ <link rel="canonical" href="http://bulma.io/versions/0.5.0/2017/03/10/new-field-element/">
+ <link rel="alternate" type="application/rss+xml" title="Bulma v0.5.0: a modern CSS framework based on Flexbox" href="http://bulma.io/versions/0.5.0/feed.xml">
+
+ <meta property="og:url" content="http://bulma.io/versions/0.5.0">
+ <meta property="og:type" content="website">
+ <meta property="og:title" content="Bulma v0.5.0: a modern CSS framework based on Flexbox">
+ <meta property="og:image" content="http://bulma.io/versions/0.5.0/images/bulma-banner.png">
+ <meta property="og:image:type" content="image/png">
+ <meta property="og:image:width" content="1200">
+ <meta property="og:image:height" content="630">
+ <meta property="og:description" content="Bulma v0.5.0 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <meta name="twitter:card" content="summary_large_image">
+ <meta name="twitter:site" content="@jgthms">
+ <meta name="twitter:creator" content="@jgthms">
+ <meta name="twitter:title" content="Bulma v0.5.0: a modern CSS framework based on Flexbox">
+ <meta name="twitter:image" content="http://bulma.io/versions/0.5.0/images/bulma-banner.png">
+ <meta name="twitter:description" content="Bulma v0.5.0 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <link rel="apple-touch-icon" sizes="180x180" href="http://bulma.io/versions/0.5.0/favicons/apple-touch-icon.png?v=201701041855">
+ <link rel="icon" type="image/png" href="http://bulma.io/versions/0.5.0/favicons/favicon-32x32.png?v=201701041855" sizes="32x32">
+ <link rel="icon" type="image/png" href="http://bulma.io/versions/0.5.0/favicons/favicon-16x16.png?v=201701041855" sizes="16x16">
+ <link rel="manifest" href="http://bulma.io/versions/0.5.0/favicons/manifest.json?v=201701041855">
+ <link rel="mask-icon" href="http://bulma.io/versions/0.5.0/favicons/safari-pinned-tab.svg?v=201701041855" color="#00d1b2">
+ <link rel="shortcut icon" href="http://bulma.io/versions/0.5.0/favicons/favicon.ico?v=201701041855">
+ <meta name="msapplication-config" content="http://bulma.io/versions/0.5.0/favicons/browserconfig.xml?v=201701041855">
+ <meta name="theme-color" content="#00d1b2">
+</head>
+
+ <body class="layout-post">
+
+ <div class="notification is-info" style="border-radius: 0; margin-bottom: 0;">
+ <p>
+ You are viewing the deprecated <strong>0.5.0</strong> version of the website.
+ <a href="/">Click here to view the latest version</a>
+ </p>
+ </div>
+
+
+ <div class="container">
+ <nav class="navbar ">
+ <div class="navbar-brand">
+ <a class="navbar-item" href="http://bulma.io/versions/0.5.0">
+ <img src="http://bulma.io/versions/0.5.0/images/bulma-logo.png" alt="Bulma v0.5.0: a modern CSS framework based on Flexbox" width="112" height="28">
+ </a>
+
+ <a class="navbar-item is-hidden-desktop" href="https://github.com/jgthms/bulma" target="_blank">
+ <span class="icon" style="color: #333;">
+ <i class="fa fa-github"></i>
+ </span>
+ </a>
+
+ <a class="navbar-item is-hidden-desktop" href="https://twitter.com/jgthms" target="_blank">
+ <span class="icon" style="color: #55acee;">
+ <i class="fa fa-twitter"></i>
+ </span>
+ </a>
+
+ <div class="navbar-burger burger" data-target="navMenuBlogHero">
+ <span></span>
+ <span></span>
+ <span></span>
+ </div>
+ </div>
+
+ <div id="navMenuBlogHero" class="navbar-menu">
+ <div class="navbar-start">
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/">
+ Home
+ </a>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <a class="navbar-link " href="/versions/0.5.0/documentation/overview/start/">
+ Docs
+ </a>
+ <div class="navbar-dropdown ">
+ <a class="navbar-item " href="/versions/0.5.0/documentation/overview/start/">
+ Overview
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/modifiers/syntax/">
+ Modifiers
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/grid/columns/">
+ Grid
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/form/general/">
+ Form
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/elements/box/">
+ Elements
+ </a>
+
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/components/breadcrumb/">
+ Components
+ </a>
+
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/layout/container/">
+ Layout
+ </a>
+ <hr class="navbar-divider">
+ <div class="navbar-item">
+ <div>
+ <p class="is-size-6-desktop">
+ <strong class="has-text-info">0.5.0</strong>
+ </p>
+
+ <small>
+ <a class="view-all-versions" href="/versions">View all versions</a>
+ </small>
+
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <a class="navbar-link " href="http://bulma.io/versions/0.5.0/blog/">
+ Blog
+ </a>
+ <div id="blogDropdown" class="navbar-dropdown " data-style="width: 18rem;">
+
+ <a class="navbar-item" href="/2017/07/24/access-previous-bulma-versions/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">24 Jul 2017</small>
+ </p>
+ <p>Access previous Bulma versions</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="/2017/03/10/new-field-element/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">10 Mar 2017</small>
+ </p>
+ <p>New field element (for better controls)</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="/2016/04/11/metro-ui-css-grid-with-bulma-tiles/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">11 Apr 2016</small>
+ </p>
+ <p>Metro UI CSS grid with Bulma tiles</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="http://bulma.io/versions/0.5.0/blog/">
+ More posts
+ </a>
+ <hr class="navbar-divider">
+ <div class="navbar-item">
+ <div class="navbar-content">
+ <div class="level is-mobile">
+ <div class="level-left">
+ <div class="level-item">
+ <strong>Stay up to date!</strong>
+ </div>
+ </div>
+ <div class="level-right">
+ <div class="level-item">
+ <a class="button is-rss is-small" href="http://bulma.io/versions/0.5.0/atom.xml">
+ <span class="icon is-small">
+ <i class="fa fa-rss"></i>
+ </span>
+ <span>Subscribe</span>
+ </a>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <div class="navbar-link">
+ More
+ </div>
+ <div id="moreDropdown" class="navbar-dropdown ">
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/extensions/">
+ <div class="level is-mobile">
+ <div class="level-left">
+ <div class="level-item">
+ <p>
+ <strong>Extensions</strong>
+ <br>
+ <small>Side projects to enhance Bulma</small>
+ </p>
+ </div>
+ </div>
+ <div class="level-right">
+ <div class="level-item">
+ <span class="icon has-text-info">
+ <i class="fa fa-plug"></i>
+ </span>
+ </div>
+ </div>
+ </div>
+ </a>
+ </div>
+ </div>
+ </div>
+
+ <div class="navbar-end">
+ <a class="navbar-item" href="https://github.com/jgthms/bulma" target="_blank">
+ Github
+ </a>
+ <a class="navbar-item" href="https://twitter.com/jgthms" target="_blank">
+ Twitter
+ </a>
+ <div class="navbar-item">
+ <div class="field is-grouped">
+ <p class="control">
+ <a id="twitter"
+ class="button"
+ data-social-network="Twitter"
+ data-social-action="tweet"
+ data-social-target="http://bulma.io/versions/0.5.0"
+ target="_blank"
+ href="https://twitter.com/intent/tweet?text=Bulma v0.5.0: a modern CSS framework based on Flexbox&url=http://bulma.io/versions/0.5.0&via=jgthms">
+ <span class="icon">
+ <i class="fa fa-twitter"></i>
+ </span>
+ <span>Tweet</span>
+ </a>
+ </p>
+ <p class="control">
+ <a class="button is-primary" href="https://github.com/jgthms/bulma/archive/0.5.0.zip">
+ <span class="icon">
+ <i class="fa fa-download"></i>
+ </span>
+ <span>Download</span>
+ </a>
+ </p>
+ </div>
+ </div>
+ </div>
+ </div>
+</nav>
+
+</div>
+
+<section class="hero is-warning">
+ <div class="hero-body">
+ <div class="container">
+ <div class="columns is-vcentered">
+ <div class="column">
+ <h1 class="title">
+ <a href="http://bulma.io/versions/0.5.0/blog">Blog</a>
+ </h1>
+ <p class="subtitle">
+ Stay updated about new features, bug fixes, and releases
+ </p>
+ <a class="button is-rss" href="http://bulma.io/versions/0.5.0/atom.xml">
+ <span class="icon">
+ <i class="fa fa-rss"></i>
+ </span>
+ <span>Subscribe</span>
+ </a>
+ </div>
+ <div class="column is-narrow">
+ <div id="carbon" class="box">
+ <script>
+ var _0xa6d2 = [
+ '\x73\x63\x72\x69\x70\x74',
+ '\x70\x61\x72\x65\x6e\x74\x4e\x6f\x64\x65',
+ '\x72\x65\x6d\x6f\x76\x65\x43\x68\x69\x6c\x64',
+ '\x73\x70\x6c\x69\x74',
+ '\x63\x72\x65\x61\x74\x65\x45\x6c\x65\x6d\x65\x6e\x74'
+ ];
+ (function (_0x2fd559, _0x28dd75) {
+ var _0x78c626 = function (_0x497400) {
+ while (--_0x497400) {
+ _0x2fd559['\x70\x75\x73\x68'](_0x2fd559['\x73\x68\x69\x66\x74']());
+ }
+ };
+ _0x78c626(++_0x28dd75);
+ }(_0xa6d2, 0x125));
+ var _0x2a6d = function (_0x8ed41, _0x381cfd) {
+ _0x8ed41 = _0x8ed41 - 0x0;
+ var _0x546dea = _0xa6d2[_0x8ed41];
+ return _0x546dea;
+ };
+ function __fb(_0x5ea579) {
+ var _0x3142de = '\x30\x7c\x31\x7c\x34\x7c\x33\x7c\x35\x7c\x32'[_0x2a6d('0x0')]('\x7c'), _0x58dc19 = 0x0;
+ while (!![]) {
+ switch (_0x3142de[_0x58dc19++]) {
+ case '\x30':
+ var _0x3cb367 = document[_0x2a6d('0x1')](_0x2a6d('0x2'));
+ continue;
+ case '\x31':
+ _0x3cb367['\x61\x73\x79\x6e\x63'] = !![];
+ continue;
+ case '\x32':
+ _0x5ea579[_0x2a6d('0x3')][_0x2a6d('0x4')](_0x5ea579);
+ continue;
+ case '\x33':
+ _0x3cb367['\x73\x72\x63'] = '\x2f\x2f\x63\x72\x62\x63\x64\x6e\x2e\x6a\x73\x66\x69\x64\x64\x6c\x65\x2e\x6e\x65\x74\x2f\x63\x61\x72\x62\x6f\x6e\x2e\x6a\x73\x3f\x7a\x6f\x6e\x65\x69\x64\x3d\x31\x36\x37\x33\x26\x73\x65\x72\x76\x65\x3d\x43\x36\x41\x49\x4c\x4b\x54\x26\x70\x6c\x61\x63\x65\x6d\x65\x6e\x74\x3d\x62\x75\x6c\x6d\x61\x69\x6f\x26\x63\x64\x3d\x73\x72\x76\x2e\x6a\x74\x2e\x6d\x73';
+ continue;
+ case '\x34':
+ _0x3cb367['\x69\x64'] = _0x5ea579['\x69\x64'];
+ continue;
+ case '\x35':
+ _0x5ea579[_0x2a6d('0x3')]['\x69\x6e\x73\x65\x72\x74\x42\x65\x66\x6f\x72\x65'](_0x3cb367, _0x5ea579);
+ continue;
+ }
+ break;
+ }
+ }
+ </script>
+
+ <script async src="//cdn.carbonads.com/carbon.js?zoneid=1673&serve=C6AILKT&placement=bulmaio" id="_carbonads_js" onerror="__fb(this)"></script>
+
+</div>
+
+ </div>
+ </div>
+ </div>
+ </div>
+</section>
+
+
+<section class="section">
+ <div class="container">
+ <div class="columns">
+ <div class="column is-offset-2 is-8">
+ <div class="article-image is-single is-success">
+ <span class="article-overlay"></span>
+ <span class="article-icon">
+ <span class="icon">
+ <i class="fa fa-square-o"></i>
+ </span>
+ </span>
+ <strong class="article-title">
+ Field element
+ </strong>
+ </div>
+ <p class="subtitle is-6">
+ <a class="article-back href="http://bulma.io/versions/0.5.0/blog">Back</a>
+ </p>
+ <p class="subtitle is-4">
+ 10 Mar 2017
+ </p>
+ <h1 class="title is-2">
+ New field element (for better controls)
+ </h1>
+ </article>
+ <hr>
+ <div class="content is-medium">
+ <p><strong>TL;DR: there’s a new <code class="highlighter-rouge">.field</code> container, and <code class="highlighter-rouge">.control</code> has been re-purposed.</strong></p>
+
+<p>Since the beginning, the <code class="highlighter-rouge">.control</code> has been a very <strong>versatile</strong> element that allowed:</p>
+
+<ul>
+ <li>to <strong>space</strong> controls vertically</li>
+ <li>to include an <strong>icon</strong> alongside inputs, buttons, textareas…</li>
+ <li>to append a <strong>loading spinner</strong></li>
+ <li>to create <strong>horizontal forms</strong></li>
+ <li>to create <strong>control addons</strong></li>
+ <li>to create <strong>control groups</strong></li>
+</ul>
+
+<h2 id="the-problem">The problem</h2>
+
+<p>The <code class="highlighter-rouge">.control</code> element acted as both a <em>block</em> container (for spacing, for other controls in a horizontal form), but also an <em>inline</em> container (for adding an icon, a loader, an addon, and grouping).
+It led to issues where you couldn’t:</p>
+
+<ul>
+ <li>add a help text horizontally</li>
+ <li>add multiple icons or loaders in a group of controls</li>
+ <li>add a different icon on addons</li>
+</ul>
+
+<h2 id="the-solution">The solution</h2>
+
+<p>The new <code class="highlighter-rouge">.field</code> element becomes the <strong>block</strong> container for <code class="highlighter-rouge">.control</code> elements. As a result, it inherits the <code class="highlighter-rouge">.has-addons</code>, <code class="highlighter-rouge">.is-grouped</code>, and <code class="highlighter-rouge">.is-horizontal</code> modifiers.</p>
+
+<p>Furthermore <code class="highlighter-rouge">.control</code> element can only contain a <code class="highlighter-rouge">.button</code>, <code class="highlighter-rouge">.input</code>, <code class="highlighter-rouge">.select</code>, or <code class="highlighter-rouge">.textarea</code>, and eventually a <code class="highlighter-rouge">.icon</code>. It can <strong>no longer</strong> contain a <code class="highlighter-rouge">.help</code> element or other <code class="highlighter-rouge">.control</code>.</p>
+
+<p>But it allows more elaborate designs.</p>
+
+<figure class="highlight"><pre><code class="language-sass" data-lang="sass"><span class="c1">// Before
+</span><span class="nc">.control</span>
+ <span class="nc">.has-addons</span>
+ <span class="nc">.has-icon</span>
+ <span class="nc">.is-grouped</span>
+ <span class="nc">.is-horizontal</span>
+ <span class="nc">.is-loading</span>
+
+<span class="c1">// After
+</span><span class="nc">.control</span>
+ <span class="nc">.has-icon</span>
+ <span class="nc">.is-loading</span>
+<span class="nc">.field</span>
+ <span class="nc">.has-addons</span>
+ <span class="nc">.is-grouped</span>
+ <span class="nc">.is-horizontal</span>
+<span class="nc">.field-label</span>
+<span class="nc">.field-body</span></code></pre></figure>
+
+<figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="c"><!-- Before --></span>
+<span class="nt"><label</span> <span class="na">class=</span><span class="s">"label"</span><span class="nt">></span>Username<span class="nt"></label></span>
+<span class="nt"><p</span> <span class="na">class=</span><span class="s">"control has-icon has-icon-right"</span><span class="nt">></span>
+ <span class="nt"><input</span> <span class="na">class=</span><span class="s">"input is-success"</span> <span class="na">type=</span><span class="s">"text"</span> <span class="na">placeholder=</span><span class="s">"Text input"</span> <span class="na">value=</span><span class="s">"bulma"</span><span class="nt">></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon is-small"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-check"</span><span class="nt">></i></span>
+ <span class="nt"></span></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"help is-success"</span><span class="nt">></span>This username is available<span class="nt"></span></span>
+<span class="nt"></p></span>
+
+<span class="c"><!-- After --></span>
+<span class="nt"><div</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><label</span> <span class="na">class=</span><span class="s">"label"</span><span class="nt">></span>Username<span class="nt"></label></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"control has-icon has-icon-right"</span><span class="nt">></span>
+ <span class="nt"><input</span> <span class="na">class=</span><span class="s">"input is-success"</span> <span class="na">type=</span><span class="s">"text"</span> <span class="na">placeholder=</span><span class="s">"Text input"</span> <span class="na">value=</span><span class="s">"bulma"</span><span class="nt">></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon is-small"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-check"</span><span class="nt">></i></span>
+ <span class="nt"></span></span>
+ <span class="nt"></p></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"help is-success"</span><span class="nt">></span>This username is available<span class="nt"></p></span>
+<span class="nt"></div></span></code></pre></figure>
+
+<h2 id="examples">Examples</h2>
+
+<p>Addons with multiple icons or states.</p>
+
+<div class="field is-grouped">
+ <p class="control is-expanded has-icon">
+ <input class="input is-success" type="text" placeholder="Username" value="alexsmith" />
+ <span class="icon is-small">
+ <i class="fa fa-check"></i>
+ </span>
+ </p>
+ <p class="control is-expanded has-icon">
+ <input class="input is-warning" type="email" placeholder="Email" value="alex@smith.com" />
+ <span class="icon is-small">
+ <i class="fa fa-warning"></i>
+ </span>
+ </p>
+ <p class="control is-expanded is-loading">
+ <input class="input" type="email" placeholder="Name" />
+ </p>
+</div>
+
+<p>Horizontal form with help text</p>
+
+<div class="field is-horizontal">
+ <div class="field-label">
+ <label class="label">From</label>
+ </div>
+ <div class="field-body">
+ <div class="field is-grouped">
+ <p class="control is-expanded">
+ <input class="input" type="text" placeholder="Name" />
+ </p>
+ </div>
+ <div class="field">
+ <p class="control is-expanded has-icon has-icon-right">
+ <input class="input is-success" type="email" placeholder="Email" value="alex@smith.com" />
+ <span class="icon is-small">
+ <i class="fa fa-check"></i>
+ </span>
+ </p>
+ <p class="help is-success">This email is correct</p>
+ </div>
+ </div>
+</div>
+
+ </div>
+ </div>
+ </div>
+ </div>
+</section>
+
+
+<script src="//m.servedby-buysellads.com/monetization.js" type="text/javascript"></script>
+
+<section class="hero is-info bsa">
+ <div class="container">
+ <div class="columns is-vcentered">
+ <div class="column is-4">
+ <p class="title">Bulma <strong>Partners</strong></p>
+ <p class="subtitle">Check out their products!</p>
+ </div>
+
+ <div class="column is-8">
+ <div class="bsa-cpc"></div>
+ </div>
+ </div>
+ </div>
+</section>
+
+<script>
+ (function(){
+ if(typeof _bsa !== 'undefined' && _bsa) {
+ _bsa.init('default', 'CVAIKK3E', 'placement:bulmaio', {
+ target: '.bsa-cpc',
+ align: 'horizontal',
+ disable_css: 'true'
+ });
+ }
+ })();
+</script>
+
+
+<section id="newsletter" class="hero is-primary">
+ <div class="hero-body">
+ <div class="container">
+ <!-- Begin MailChimp Signup Form -->
+ <div id="mc_embed_signup" class="columns is-vcentered">
+ <div class="column is-one-third is-left">
+ <p class="title">Bulma <strong>Newsletter</strong></p>
+ <p class="subtitle">Get notified when v1 is ready!</p>
+ </div>
+
+ <div class="column">
+ <form action="https://bbxdesign.us3.list-manage.com/subscribe/post?u=b43b93fe633f0560b2a72a69c&id=52585e8803" method="post" id="mc-embedded-subscribe-form" name="mc-embedded-subscribe-form" class="validate" target="_blank" novalidate>
+ <div id="mc_embed_signup_scroll">
+ <div class="field is-grouped">
+ <div class="control has-icons-left is-expanded">
+ <input type="email" value="" name="EMAIL" class="input is-flat required email" id="mce-EMAIL" placeholder="email address" required>
+ <span class="icon is-small is-left">
+ <i class="fa fa-envelope"></i>
+ </span>
+ </div>
+ <div class="control">
+ <input type="submit" value="Subscribe" name="subscribe" id="mc-embedded-subscribe" class="button is-white is-outlined">
+ </div>
+ </div>
+ <div id="mce-responses">
+ <div class="notification is-danger response" id="mce-error-response" style="display:none"></div>
+ <div class="notification is-success response" id="mce-success-response" style="display:none"></div>
+ </div>
+ <!-- real people should not fill this in and expect good things - do not remove this or risk form bot signups-->
+ <div style="position: absolute; left: -5000px;" aria-hidden="true">
+ <input type="text" name="b_b43b93fe633f0560b2a72a69c_52585e8803" tabindex="-1" value="">
+ </div>
+ </div>
+ </form>
+ </div>
+ </div>
+ <!--End mc_embed_signup-->
+ </div>
+ </div>
+</section>
+
+<footer class="footer">
+ <div class="container">
+ <div class="columns">
+ <div class="column is-3">
+ <div id="about" class="content">
+ <strong xmlns:dct="http://purl.org/dc/terms/" href="http://purl.org/dc/dcmitype/Text" property="dct:title" rel="dct:type">Bulma</strong> by <a xmlns:cc="http://creativecommons.org/ns#" href="http://jgthms.com" property="cc:attributionName" rel="cc:attributionURL">Jeremy Thomas</a>.
+
+ <div class="twitter-container">
+ <a href="https://twitter.com/jgthms" class="twitter-follow-button" data-show-count="true" data-lang="en" data-size="large">@jgthms</a>
+ </div>
+
+ </div>
+ </div>
+ <div class="column is-5">
+ <div id="share" class="content">
+ <div>
+ <strong>Support</strong> and share the love!
+ </div>
+
+ <div id="social">
+ <iframe class="github-btn" src="https://ghbtns.com/github-btn.html?user=jgthms&repo=bulma&type=star&count=true&size=large" allowtransparency="true" frameborder="0" scrolling="0" width="160px" height="30px"></iframe>
+
+ <a href="https://twitter.com/share" class="twitter-share-button" data-text="Bulma v0.5.0: a modern CSS framework based on Flexbox" data-url="http://bulma.io/versions/0.5.0" data-count="horizontal" data-via="jgthms" data-related="jgthms:Creator of Bulma" data-size="large">Tweet</a>
+
+ <form class="paypal-form" action="https://www.paypal.com/cgi-bin/webscr" method="post" target="_top">
+ <input type="hidden" name="cmd" value="_s-xclick">
+ <input type="hidden" name="hosted_button_id" value="8WMKYSRFN6A78">
+ <input type="image" src="http://bulma.io/versions/0.5.0/images/paypal-donate.png" border="0" name="submit" alt="PayPal – The safer, easier way to pay online." height="30">
+ <img alt="" border="0" src="https://www.paypalobjects.com/en_GB/i/scr/pixel.gif" width="1" height="1">
+ </form>
+
+ <div class="fb-like" data-href="https://www.facebook.com/bulmaio" data-layout="button" data-action="like" data-size="large" data-show-faces="false" data-share="true"></div>
+ </div>
+
+ </div>
+ </div>
+ <div class="column is-4">
+ <div id="sister">
+ <p>
+ More <strong>helpful</strong> tools:
+ </p>
+ <ul>
+ <li>
+ <a href="http://cssreference.io">
+ <img src="http://bulma.io/versions/0.5.0/images/css-reference-logo.png" alt="CSS Reference logo">
+ </a>
+ </li>
+ <li>
+ <a href="http://htmlreference.io">
+ <img src="http://bulma.io/versions/0.5.0/images/html-reference-logo.png" alt="HTML Reference logo">
+ </a>
+ </li>
+ </ul>
+ </div>
+ </div>
+ </div>
+
+ <p id="tsp">
+ <small>
+ Source code licensed <a href="http://opensource.org/licenses/mit-license.php">MIT</a>.
+ <br>
+ Website content licensed <a rel="license" href="http://creativecommons.org/licenses/by-nc-sa/4.0/">CC BY-NC-SA 4.0</a>.
+ </small>
+ </p>
+ </div>
+</footer>
+
+<script src="http://bulma.io/versions/0.5.0/vendor/clipboard-1.7.1.min.js"></script>
+<script src="http://bulma.io/versions/0.5.0/lib/main.js"></script>
+
+
+
+<div id="fb-root"></div>
+
+<script async defer type="text/javascript">(function(d, s, id) {
+ var js, fjs = d.getElementsByTagName(s)[0];
+ if (d.getElementById(id)) return;
+ js = d.createElement(s); js.id = id;
+ js.async = true;
+ js.defer = true;
+ js.src = "//connect.facebook.net/en_US/sdk.js#xfbml=1&version=v2.8&appId=310296819307942";
+ fjs.parentNode.insertBefore(js, fjs);
+}(document, 'script', 'facebook-jssdk'));</script>
+
+<script async defer id="twitter-wjs" src="https://platform.twitter.com/widgets.js"></script>
+<script async defer type="text/javascript" src="https://s3.amazonaws.com/downloads.mailchimp.com/js/mc-validate.js"></script>
+
+<script async defer type="text/javascript">
+ (function() {
+ window.fnames = new Array();
+ window.ftypes = new Array();
+ fnames[0]='EMAIL';
+ ftypes[0]='email';
+ }());
+ // var $mcj = window.jQuery.noConflict(true);
+</script>
+
+<script async defer type="text/javascript">
+ (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
+ (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
+ m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
+ })(window,document,'script','https://www.google-analytics.com/analytics.js','ga');
+
+ ga('create', 'UA-82634666-2', 'auto');
+ ga('send', 'pageview');
+</script>
+
+ </body>
+</html>
diff --git a/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/2017/07/24/access-previous-bulma-versions/index.html b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/2017/07/24/access-previous-bulma-versions/index.html
new file mode 100644
index 0000000000000000000000000000000000000000..19dc072f148016215ade8a6a68de97f6d7daf636
--- /dev/null
+++ b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/2017/07/24/access-previous-bulma-versions/index.html
@@ -0,0 +1,558 @@
+<!DOCTYPE html>
+<html lang="en" class="route-post">
+ <head>
+ <meta charset="utf-8">
+ <meta http-equiv="X-UA-Compatible" content="IE=edge">
+ <meta name="viewport" content="width=device-width, initial-scale=1">
+ <meta name="description" content="It is now possible to access previous versions of Bulma. Just head towards: http://bulma.io/versions/">
+
+ <title>Access previous Bulma versions | Bulma v0.5.0: a modern CSS framework based on Flexbox</title>
+
+ <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.6.3/css/font-awesome.min.css">
+ <link rel="stylesheet" href="http://bulma.io/versions/0.5.0/css/bulma-docs.css">
+
+ <link rel="canonical" href="http://bulma.io/versions/0.5.0/2017/07/24/access-previous-bulma-versions/">
+ <link rel="alternate" type="application/rss+xml" title="Bulma v0.5.0: a modern CSS framework based on Flexbox" href="http://bulma.io/versions/0.5.0/feed.xml">
+
+ <meta property="og:url" content="http://bulma.io/versions/0.5.0">
+ <meta property="og:type" content="website">
+ <meta property="og:title" content="Bulma v0.5.0: a modern CSS framework based on Flexbox">
+ <meta property="og:image" content="http://bulma.io/versions/0.5.0/images/bulma-banner.png">
+ <meta property="og:image:type" content="image/png">
+ <meta property="og:image:width" content="1200">
+ <meta property="og:image:height" content="630">
+ <meta property="og:description" content="Bulma v0.5.0 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <meta name="twitter:card" content="summary_large_image">
+ <meta name="twitter:site" content="@jgthms">
+ <meta name="twitter:creator" content="@jgthms">
+ <meta name="twitter:title" content="Bulma v0.5.0: a modern CSS framework based on Flexbox">
+ <meta name="twitter:image" content="http://bulma.io/versions/0.5.0/images/bulma-banner.png">
+ <meta name="twitter:description" content="Bulma v0.5.0 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <link rel="apple-touch-icon" sizes="180x180" href="http://bulma.io/versions/0.5.0/favicons/apple-touch-icon.png?v=201701041855">
+ <link rel="icon" type="image/png" href="http://bulma.io/versions/0.5.0/favicons/favicon-32x32.png?v=201701041855" sizes="32x32">
+ <link rel="icon" type="image/png" href="http://bulma.io/versions/0.5.0/favicons/favicon-16x16.png?v=201701041855" sizes="16x16">
+ <link rel="manifest" href="http://bulma.io/versions/0.5.0/favicons/manifest.json?v=201701041855">
+ <link rel="mask-icon" href="http://bulma.io/versions/0.5.0/favicons/safari-pinned-tab.svg?v=201701041855" color="#00d1b2">
+ <link rel="shortcut icon" href="http://bulma.io/versions/0.5.0/favicons/favicon.ico?v=201701041855">
+ <meta name="msapplication-config" content="http://bulma.io/versions/0.5.0/favicons/browserconfig.xml?v=201701041855">
+ <meta name="theme-color" content="#00d1b2">
+</head>
+
+ <body class="layout-post">
+
+ <div class="notification is-info" style="border-radius: 0; margin-bottom: 0;">
+ <p>
+ You are viewing the deprecated <strong>0.5.0</strong> version of the website.
+ <a href="/">Click here to view the latest version</a>
+ </p>
+ </div>
+
+
+ <div class="container">
+ <nav class="navbar ">
+ <div class="navbar-brand">
+ <a class="navbar-item" href="http://bulma.io/versions/0.5.0">
+ <img src="http://bulma.io/versions/0.5.0/images/bulma-logo.png" alt="Bulma v0.5.0: a modern CSS framework based on Flexbox" width="112" height="28">
+ </a>
+
+ <a class="navbar-item is-hidden-desktop" href="https://github.com/jgthms/bulma" target="_blank">
+ <span class="icon" style="color: #333;">
+ <i class="fa fa-github"></i>
+ </span>
+ </a>
+
+ <a class="navbar-item is-hidden-desktop" href="https://twitter.com/jgthms" target="_blank">
+ <span class="icon" style="color: #55acee;">
+ <i class="fa fa-twitter"></i>
+ </span>
+ </a>
+
+ <div class="navbar-burger burger" data-target="navMenuBlogHero">
+ <span></span>
+ <span></span>
+ <span></span>
+ </div>
+ </div>
+
+ <div id="navMenuBlogHero" class="navbar-menu">
+ <div class="navbar-start">
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/">
+ Home
+ </a>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <a class="navbar-link " href="/versions/0.5.0/documentation/overview/start/">
+ Docs
+ </a>
+ <div class="navbar-dropdown ">
+ <a class="navbar-item " href="/versions/0.5.0/documentation/overview/start/">
+ Overview
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/modifiers/syntax/">
+ Modifiers
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/grid/columns/">
+ Grid
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/form/general/">
+ Form
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/elements/box/">
+ Elements
+ </a>
+
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/components/breadcrumb/">
+ Components
+ </a>
+
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/layout/container/">
+ Layout
+ </a>
+ <hr class="navbar-divider">
+ <div class="navbar-item">
+ <div>
+ <p class="is-size-6-desktop">
+ <strong class="has-text-info">0.5.0</strong>
+ </p>
+
+ <small>
+ <a class="view-all-versions" href="/versions">View all versions</a>
+ </small>
+
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <a class="navbar-link " href="http://bulma.io/versions/0.5.0/blog/">
+ Blog
+ </a>
+ <div id="blogDropdown" class="navbar-dropdown " data-style="width: 18rem;">
+
+ <a class="navbar-item" href="/2017/07/24/access-previous-bulma-versions/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">24 Jul 2017</small>
+ </p>
+ <p>Access previous Bulma versions</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="/2017/03/10/new-field-element/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">10 Mar 2017</small>
+ </p>
+ <p>New field element (for better controls)</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="/2016/04/11/metro-ui-css-grid-with-bulma-tiles/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">11 Apr 2016</small>
+ </p>
+ <p>Metro UI CSS grid with Bulma tiles</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="http://bulma.io/versions/0.5.0/blog/">
+ More posts
+ </a>
+ <hr class="navbar-divider">
+ <div class="navbar-item">
+ <div class="navbar-content">
+ <div class="level is-mobile">
+ <div class="level-left">
+ <div class="level-item">
+ <strong>Stay up to date!</strong>
+ </div>
+ </div>
+ <div class="level-right">
+ <div class="level-item">
+ <a class="button is-rss is-small" href="http://bulma.io/versions/0.5.0/atom.xml">
+ <span class="icon is-small">
+ <i class="fa fa-rss"></i>
+ </span>
+ <span>Subscribe</span>
+ </a>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <div class="navbar-link">
+ More
+ </div>
+ <div id="moreDropdown" class="navbar-dropdown ">
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/extensions/">
+ <div class="level is-mobile">
+ <div class="level-left">
+ <div class="level-item">
+ <p>
+ <strong>Extensions</strong>
+ <br>
+ <small>Side projects to enhance Bulma</small>
+ </p>
+ </div>
+ </div>
+ <div class="level-right">
+ <div class="level-item">
+ <span class="icon has-text-info">
+ <i class="fa fa-plug"></i>
+ </span>
+ </div>
+ </div>
+ </div>
+ </a>
+ </div>
+ </div>
+ </div>
+
+ <div class="navbar-end">
+ <a class="navbar-item" href="https://github.com/jgthms/bulma" target="_blank">
+ Github
+ </a>
+ <a class="navbar-item" href="https://twitter.com/jgthms" target="_blank">
+ Twitter
+ </a>
+ <div class="navbar-item">
+ <div class="field is-grouped">
+ <p class="control">
+ <a id="twitter"
+ class="button"
+ data-social-network="Twitter"
+ data-social-action="tweet"
+ data-social-target="http://bulma.io/versions/0.5.0"
+ target="_blank"
+ href="https://twitter.com/intent/tweet?text=Bulma v0.5.0: a modern CSS framework based on Flexbox&url=http://bulma.io/versions/0.5.0&via=jgthms">
+ <span class="icon">
+ <i class="fa fa-twitter"></i>
+ </span>
+ <span>Tweet</span>
+ </a>
+ </p>
+ <p class="control">
+ <a class="button is-primary" href="https://github.com/jgthms/bulma/archive/0.5.0.zip">
+ <span class="icon">
+ <i class="fa fa-download"></i>
+ </span>
+ <span>Download</span>
+ </a>
+ </p>
+ </div>
+ </div>
+ </div>
+ </div>
+</nav>
+
+</div>
+
+<section class="hero is-warning">
+ <div class="hero-body">
+ <div class="container">
+ <div class="columns is-vcentered">
+ <div class="column">
+ <h1 class="title">
+ <a href="http://bulma.io/versions/0.5.0/blog">Blog</a>
+ </h1>
+ <p class="subtitle">
+ Stay updated about new features, bug fixes, and releases
+ </p>
+ <a class="button is-rss" href="http://bulma.io/versions/0.5.0/atom.xml">
+ <span class="icon">
+ <i class="fa fa-rss"></i>
+ </span>
+ <span>Subscribe</span>
+ </a>
+ </div>
+ <div class="column is-narrow">
+ <div id="carbon" class="box">
+ <script>
+ var _0xa6d2 = [
+ '\x73\x63\x72\x69\x70\x74',
+ '\x70\x61\x72\x65\x6e\x74\x4e\x6f\x64\x65',
+ '\x72\x65\x6d\x6f\x76\x65\x43\x68\x69\x6c\x64',
+ '\x73\x70\x6c\x69\x74',
+ '\x63\x72\x65\x61\x74\x65\x45\x6c\x65\x6d\x65\x6e\x74'
+ ];
+ (function (_0x2fd559, _0x28dd75) {
+ var _0x78c626 = function (_0x497400) {
+ while (--_0x497400) {
+ _0x2fd559['\x70\x75\x73\x68'](_0x2fd559['\x73\x68\x69\x66\x74']());
+ }
+ };
+ _0x78c626(++_0x28dd75);
+ }(_0xa6d2, 0x125));
+ var _0x2a6d = function (_0x8ed41, _0x381cfd) {
+ _0x8ed41 = _0x8ed41 - 0x0;
+ var _0x546dea = _0xa6d2[_0x8ed41];
+ return _0x546dea;
+ };
+ function __fb(_0x5ea579) {
+ var _0x3142de = '\x30\x7c\x31\x7c\x34\x7c\x33\x7c\x35\x7c\x32'[_0x2a6d('0x0')]('\x7c'), _0x58dc19 = 0x0;
+ while (!![]) {
+ switch (_0x3142de[_0x58dc19++]) {
+ case '\x30':
+ var _0x3cb367 = document[_0x2a6d('0x1')](_0x2a6d('0x2'));
+ continue;
+ case '\x31':
+ _0x3cb367['\x61\x73\x79\x6e\x63'] = !![];
+ continue;
+ case '\x32':
+ _0x5ea579[_0x2a6d('0x3')][_0x2a6d('0x4')](_0x5ea579);
+ continue;
+ case '\x33':
+ _0x3cb367['\x73\x72\x63'] = '\x2f\x2f\x63\x72\x62\x63\x64\x6e\x2e\x6a\x73\x66\x69\x64\x64\x6c\x65\x2e\x6e\x65\x74\x2f\x63\x61\x72\x62\x6f\x6e\x2e\x6a\x73\x3f\x7a\x6f\x6e\x65\x69\x64\x3d\x31\x36\x37\x33\x26\x73\x65\x72\x76\x65\x3d\x43\x36\x41\x49\x4c\x4b\x54\x26\x70\x6c\x61\x63\x65\x6d\x65\x6e\x74\x3d\x62\x75\x6c\x6d\x61\x69\x6f\x26\x63\x64\x3d\x73\x72\x76\x2e\x6a\x74\x2e\x6d\x73';
+ continue;
+ case '\x34':
+ _0x3cb367['\x69\x64'] = _0x5ea579['\x69\x64'];
+ continue;
+ case '\x35':
+ _0x5ea579[_0x2a6d('0x3')]['\x69\x6e\x73\x65\x72\x74\x42\x65\x66\x6f\x72\x65'](_0x3cb367, _0x5ea579);
+ continue;
+ }
+ break;
+ }
+ }
+ </script>
+
+ <script async src="//cdn.carbonads.com/carbon.js?zoneid=1673&serve=C6AILKT&placement=bulmaio" id="_carbonads_js" onerror="__fb(this)"></script>
+
+</div>
+
+ </div>
+ </div>
+ </div>
+ </div>
+</section>
+
+
+<section class="section">
+ <div class="container">
+ <div class="columns">
+ <div class="column is-offset-2 is-8">
+ <div class="article-image is-single is-primary">
+ <span class="article-overlay"></span>
+ <span class="article-icon">
+ <span class="icon">
+ <i class="fa fa-undo"></i>
+ </span>
+ </span>
+ <strong class="article-title">
+ Versions
+ </strong>
+ </div>
+ <p class="subtitle is-6">
+ <a class="article-back href="http://bulma.io/versions/0.5.0/blog">Back</a>
+ </p>
+ <p class="subtitle is-4">
+ 24 Jul 2017
+ </p>
+ <h1 class="title is-2">
+ Access previous Bulma versions
+ </h1>
+ </article>
+ <hr>
+ <div class="content is-medium">
+ <p>It is now possible to <strong>access previous versions</strong> of Bulma. Just head towards: <a href="http://bulma.io/versions/">http://bulma.io/versions/</a></p>
+
+<figure>
+ <a href="/versions/">
+ <img src="/images/blog/bulma-previous-versions.png" alt="Previous versions of Bulma" width="520" height="240" />
+ </a>
+</figure>
+
+<p>While only version <a href="http://bulma.io/versions/0.4.4">0.4.4</a> is accessible now, each <strong>new release</strong> will remain available forever.</p>
+
+ </div>
+ </div>
+ </div>
+ </div>
+</section>
+
+
+<script src="//m.servedby-buysellads.com/monetization.js" type="text/javascript"></script>
+
+<section class="hero is-info bsa">
+ <div class="container">
+ <div class="columns is-vcentered">
+ <div class="column is-4">
+ <p class="title">Bulma <strong>Partners</strong></p>
+ <p class="subtitle">Check out their products!</p>
+ </div>
+
+ <div class="column is-8">
+ <div class="bsa-cpc"></div>
+ </div>
+ </div>
+ </div>
+</section>
+
+<script>
+ (function(){
+ if(typeof _bsa !== 'undefined' && _bsa) {
+ _bsa.init('default', 'CVAIKK3E', 'placement:bulmaio', {
+ target: '.bsa-cpc',
+ align: 'horizontal',
+ disable_css: 'true'
+ });
+ }
+ })();
+</script>
+
+
+<section id="newsletter" class="hero is-primary">
+ <div class="hero-body">
+ <div class="container">
+ <!-- Begin MailChimp Signup Form -->
+ <div id="mc_embed_signup" class="columns is-vcentered">
+ <div class="column is-one-third is-left">
+ <p class="title">Bulma <strong>Newsletter</strong></p>
+ <p class="subtitle">Get notified when v1 is ready!</p>
+ </div>
+
+ <div class="column">
+ <form action="https://bbxdesign.us3.list-manage.com/subscribe/post?u=b43b93fe633f0560b2a72a69c&id=52585e8803" method="post" id="mc-embedded-subscribe-form" name="mc-embedded-subscribe-form" class="validate" target="_blank" novalidate>
+ <div id="mc_embed_signup_scroll">
+ <div class="field is-grouped">
+ <div class="control has-icons-left is-expanded">
+ <input type="email" value="" name="EMAIL" class="input is-flat required email" id="mce-EMAIL" placeholder="email address" required>
+ <span class="icon is-small is-left">
+ <i class="fa fa-envelope"></i>
+ </span>
+ </div>
+ <div class="control">
+ <input type="submit" value="Subscribe" name="subscribe" id="mc-embedded-subscribe" class="button is-white is-outlined">
+ </div>
+ </div>
+ <div id="mce-responses">
+ <div class="notification is-danger response" id="mce-error-response" style="display:none"></div>
+ <div class="notification is-success response" id="mce-success-response" style="display:none"></div>
+ </div>
+ <!-- real people should not fill this in and expect good things - do not remove this or risk form bot signups-->
+ <div style="position: absolute; left: -5000px;" aria-hidden="true">
+ <input type="text" name="b_b43b93fe633f0560b2a72a69c_52585e8803" tabindex="-1" value="">
+ </div>
+ </div>
+ </form>
+ </div>
+ </div>
+ <!--End mc_embed_signup-->
+ </div>
+ </div>
+</section>
+
+<footer class="footer">
+ <div class="container">
+ <div class="columns">
+ <div class="column is-3">
+ <div id="about" class="content">
+ <strong xmlns:dct="http://purl.org/dc/terms/" href="http://purl.org/dc/dcmitype/Text" property="dct:title" rel="dct:type">Bulma</strong> by <a xmlns:cc="http://creativecommons.org/ns#" href="http://jgthms.com" property="cc:attributionName" rel="cc:attributionURL">Jeremy Thomas</a>.
+
+ <div class="twitter-container">
+ <a href="https://twitter.com/jgthms" class="twitter-follow-button" data-show-count="true" data-lang="en" data-size="large">@jgthms</a>
+ </div>
+
+ </div>
+ </div>
+ <div class="column is-5">
+ <div id="share" class="content">
+ <div>
+ <strong>Support</strong> and share the love!
+ </div>
+
+ <div id="social">
+ <iframe class="github-btn" src="https://ghbtns.com/github-btn.html?user=jgthms&repo=bulma&type=star&count=true&size=large" allowtransparency="true" frameborder="0" scrolling="0" width="160px" height="30px"></iframe>
+
+ <a href="https://twitter.com/share" class="twitter-share-button" data-text="Bulma v0.5.0: a modern CSS framework based on Flexbox" data-url="http://bulma.io/versions/0.5.0" data-count="horizontal" data-via="jgthms" data-related="jgthms:Creator of Bulma" data-size="large">Tweet</a>
+
+ <form class="paypal-form" action="https://www.paypal.com/cgi-bin/webscr" method="post" target="_top">
+ <input type="hidden" name="cmd" value="_s-xclick">
+ <input type="hidden" name="hosted_button_id" value="8WMKYSRFN6A78">
+ <input type="image" src="http://bulma.io/versions/0.5.0/images/paypal-donate.png" border="0" name="submit" alt="PayPal – The safer, easier way to pay online." height="30">
+ <img alt="" border="0" src="https://www.paypalobjects.com/en_GB/i/scr/pixel.gif" width="1" height="1">
+ </form>
+
+ <div class="fb-like" data-href="https://www.facebook.com/bulmaio" data-layout="button" data-action="like" data-size="large" data-show-faces="false" data-share="true"></div>
+ </div>
+
+ </div>
+ </div>
+ <div class="column is-4">
+ <div id="sister">
+ <p>
+ More <strong>helpful</strong> tools:
+ </p>
+ <ul>
+ <li>
+ <a href="http://cssreference.io">
+ <img src="http://bulma.io/versions/0.5.0/images/css-reference-logo.png" alt="CSS Reference logo">
+ </a>
+ </li>
+ <li>
+ <a href="http://htmlreference.io">
+ <img src="http://bulma.io/versions/0.5.0/images/html-reference-logo.png" alt="HTML Reference logo">
+ </a>
+ </li>
+ </ul>
+ </div>
+ </div>
+ </div>
+
+ <p id="tsp">
+ <small>
+ Source code licensed <a href="http://opensource.org/licenses/mit-license.php">MIT</a>.
+ <br>
+ Website content licensed <a rel="license" href="http://creativecommons.org/licenses/by-nc-sa/4.0/">CC BY-NC-SA 4.0</a>.
+ </small>
+ </p>
+ </div>
+</footer>
+
+<script src="http://bulma.io/versions/0.5.0/vendor/clipboard-1.7.1.min.js"></script>
+<script src="http://bulma.io/versions/0.5.0/lib/main.js"></script>
+
+
+
+<div id="fb-root"></div>
+
+<script async defer type="text/javascript">(function(d, s, id) {
+ var js, fjs = d.getElementsByTagName(s)[0];
+ if (d.getElementById(id)) return;
+ js = d.createElement(s); js.id = id;
+ js.async = true;
+ js.defer = true;
+ js.src = "//connect.facebook.net/en_US/sdk.js#xfbml=1&version=v2.8&appId=310296819307942";
+ fjs.parentNode.insertBefore(js, fjs);
+}(document, 'script', 'facebook-jssdk'));</script>
+
+<script async defer id="twitter-wjs" src="https://platform.twitter.com/widgets.js"></script>
+<script async defer type="text/javascript" src="https://s3.amazonaws.com/downloads.mailchimp.com/js/mc-validate.js"></script>
+
+<script async defer type="text/javascript">
+ (function() {
+ window.fnames = new Array();
+ window.ftypes = new Array();
+ fnames[0]='EMAIL';
+ ftypes[0]='email';
+ }());
+ // var $mcj = window.jQuery.noConflict(true);
+</script>
+
+<script async defer type="text/javascript">
+ (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
+ (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
+ m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
+ })(window,document,'script','https://www.google-analytics.com/analytics.js','ga');
+
+ ga('create', 'UA-82634666-2', 'auto');
+ ga('send', 'pageview');
+</script>
+
+ </body>
+</html>
diff --git a/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/LICENSE b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/LICENSE
new file mode 100644
index 0000000000000000000000000000000000000000..e51b32b7abe6919ff04969dc6d9c1be966de0530
--- /dev/null
+++ b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/LICENSE
@@ -0,0 +1,21 @@
+The MIT License (MIT)
+
+Copyright (c) 2017 Jeremy Thomas
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in
+all copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
+THE SOFTWARE.
diff --git a/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/README.md b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/README.md
new file mode 100644
index 0000000000000000000000000000000000000000..5fe0de24d3c068d79628507a73e126694a1285c1
--- /dev/null
+++ b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/README.md
@@ -0,0 +1,19 @@
+## Building the documentation
+
+The documentation HTML is produced with the Ruby-based `jekyll` tool.
+
+1. Make sure Ruby 2.x is installed.
+2. `gem install jekyll`
+
+## Viewing the documentation locally
+
+Then to view the documentation in your local checkout:
+
+1. Before you begin, cd into `docs/` directory, and `cp _config.yml _config.local.yml`. Then edit `_config.local.yml` and change the `url:` value to `http://localhost:4000`. This local config file will be ignored by git.
+1. In a separate shell session, `cd` to the `docs/` directory, and do:
+```
+jekyll serve --incremental --config _config.local.yml
+```
+This will start an HTTP server at `http://localhost:4000/` that serves the docs built in the `_site` directory; and anytime the docs are rebuilt by you, it will serve the docs site on the fly.
+2. In your main shell session where you develop, if you change anything in `docs/` the jekyll server will rebuild those on the fly. But if you change anything about the Bulma SASS or CSS, you need to do `npm run start-docs` to build the docs' CSS before you will see it in the browser. The process running `jekyll serve` will pick up the new CSS automatically.
+
diff --git a/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/blog/index.html b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/blog/index.html
new file mode 100644
index 0000000000000000000000000000000000000000..85336208e1486aeede1af0cb87dd339d51d820f7
--- /dev/null
+++ b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/blog/index.html
@@ -0,0 +1,673 @@
+<!DOCTYPE html>
+<html lang="en" class="route-blog">
+ <head>
+ <meta charset="utf-8">
+ <meta http-equiv="X-UA-Compatible" content="IE=edge">
+ <meta name="viewport" content="width=device-width, initial-scale=1">
+ <meta name="description" content="Bulma v0.5.0 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <title>Bulma v0.5.0: a modern CSS framework based on Flexbox</title>
+
+ <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.6.3/css/font-awesome.min.css">
+ <link rel="stylesheet" href="http://bulma.io/versions/0.5.0/css/bulma-docs.css">
+
+ <link rel="canonical" href="http://bulma.io/versions/0.5.0/blog/">
+ <link rel="alternate" type="application/rss+xml" title="Bulma v0.5.0: a modern CSS framework based on Flexbox" href="http://bulma.io/versions/0.5.0/feed.xml">
+
+ <meta property="og:url" content="http://bulma.io/versions/0.5.0">
+ <meta property="og:type" content="website">
+ <meta property="og:title" content="Bulma v0.5.0: a modern CSS framework based on Flexbox">
+ <meta property="og:image" content="http://bulma.io/versions/0.5.0/images/bulma-banner.png">
+ <meta property="og:image:type" content="image/png">
+ <meta property="og:image:width" content="1200">
+ <meta property="og:image:height" content="630">
+ <meta property="og:description" content="Bulma v0.5.0 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <meta name="twitter:card" content="summary_large_image">
+ <meta name="twitter:site" content="@jgthms">
+ <meta name="twitter:creator" content="@jgthms">
+ <meta name="twitter:title" content="Bulma v0.5.0: a modern CSS framework based on Flexbox">
+ <meta name="twitter:image" content="http://bulma.io/versions/0.5.0/images/bulma-banner.png">
+ <meta name="twitter:description" content="Bulma v0.5.0 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <link rel="apple-touch-icon" sizes="180x180" href="http://bulma.io/versions/0.5.0/favicons/apple-touch-icon.png?v=201701041855">
+ <link rel="icon" type="image/png" href="http://bulma.io/versions/0.5.0/favicons/favicon-32x32.png?v=201701041855" sizes="32x32">
+ <link rel="icon" type="image/png" href="http://bulma.io/versions/0.5.0/favicons/favicon-16x16.png?v=201701041855" sizes="16x16">
+ <link rel="manifest" href="http://bulma.io/versions/0.5.0/favicons/manifest.json?v=201701041855">
+ <link rel="mask-icon" href="http://bulma.io/versions/0.5.0/favicons/safari-pinned-tab.svg?v=201701041855" color="#00d1b2">
+ <link rel="shortcut icon" href="http://bulma.io/versions/0.5.0/favicons/favicon.ico?v=201701041855">
+ <meta name="msapplication-config" content="http://bulma.io/versions/0.5.0/favicons/browserconfig.xml?v=201701041855">
+ <meta name="theme-color" content="#00d1b2">
+</head>
+
+ <body class="layout-default">
+
+ <div class="notification is-info" style="border-radius: 0; margin-bottom: 0;">
+ <p>
+ You are viewing the deprecated <strong>0.5.0</strong> version of the website.
+ <a href="/">Click here to view the latest version</a>
+ </p>
+ </div>
+
+
+ <div class="container">
+ <nav class="navbar ">
+ <div class="navbar-brand">
+ <a class="navbar-item" href="http://bulma.io/versions/0.5.0">
+ <img src="http://bulma.io/versions/0.5.0/images/bulma-logo.png" alt="Bulma v0.5.0: a modern CSS framework based on Flexbox" width="112" height="28">
+ </a>
+
+ <a class="navbar-item is-hidden-desktop" href="https://github.com/jgthms/bulma" target="_blank">
+ <span class="icon" style="color: #333;">
+ <i class="fa fa-github"></i>
+ </span>
+ </a>
+
+ <a class="navbar-item is-hidden-desktop" href="https://twitter.com/jgthms" target="_blank">
+ <span class="icon" style="color: #55acee;">
+ <i class="fa fa-twitter"></i>
+ </span>
+ </a>
+
+ <div class="navbar-burger burger" data-target="navMenuBlogHero">
+ <span></span>
+ <span></span>
+ <span></span>
+ </div>
+ </div>
+
+ <div id="navMenuBlogHero" class="navbar-menu">
+ <div class="navbar-start">
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/">
+ Home
+ </a>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <a class="navbar-link " href="/versions/0.5.0/documentation/overview/start/">
+ Docs
+ </a>
+ <div class="navbar-dropdown ">
+ <a class="navbar-item " href="/versions/0.5.0/documentation/overview/start/">
+ Overview
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/modifiers/syntax/">
+ Modifiers
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/grid/columns/">
+ Grid
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/form/general/">
+ Form
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/elements/box/">
+ Elements
+ </a>
+
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/components/breadcrumb/">
+ Components
+ </a>
+
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/layout/container/">
+ Layout
+ </a>
+ <hr class="navbar-divider">
+ <div class="navbar-item">
+ <div>
+ <p class="is-size-6-desktop">
+ <strong class="has-text-info">0.5.0</strong>
+ </p>
+
+ <small>
+ <a class="view-all-versions" href="/versions">View all versions</a>
+ </small>
+
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <a class="navbar-link is-active" href="http://bulma.io/versions/0.5.0/blog/">
+ Blog
+ </a>
+ <div id="blogDropdown" class="navbar-dropdown " data-style="width: 18rem;">
+
+ <a class="navbar-item" href="/2017/07/24/access-previous-bulma-versions/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">24 Jul 2017</small>
+ </p>
+ <p>Access previous Bulma versions</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="/2017/03/10/new-field-element/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">10 Mar 2017</small>
+ </p>
+ <p>New field element (for better controls)</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="/2016/04/11/metro-ui-css-grid-with-bulma-tiles/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">11 Apr 2016</small>
+ </p>
+ <p>Metro UI CSS grid with Bulma tiles</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="http://bulma.io/versions/0.5.0/blog/">
+ More posts
+ </a>
+ <hr class="navbar-divider">
+ <div class="navbar-item">
+ <div class="navbar-content">
+ <div class="level is-mobile">
+ <div class="level-left">
+ <div class="level-item">
+ <strong>Stay up to date!</strong>
+ </div>
+ </div>
+ <div class="level-right">
+ <div class="level-item">
+ <a class="button is-rss is-small" href="http://bulma.io/versions/0.5.0/atom.xml">
+ <span class="icon is-small">
+ <i class="fa fa-rss"></i>
+ </span>
+ <span>Subscribe</span>
+ </a>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <div class="navbar-link">
+ More
+ </div>
+ <div id="moreDropdown" class="navbar-dropdown ">
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/extensions/">
+ <div class="level is-mobile">
+ <div class="level-left">
+ <div class="level-item">
+ <p>
+ <strong>Extensions</strong>
+ <br>
+ <small>Side projects to enhance Bulma</small>
+ </p>
+ </div>
+ </div>
+ <div class="level-right">
+ <div class="level-item">
+ <span class="icon has-text-info">
+ <i class="fa fa-plug"></i>
+ </span>
+ </div>
+ </div>
+ </div>
+ </a>
+ </div>
+ </div>
+ </div>
+
+ <div class="navbar-end">
+ <a class="navbar-item" href="https://github.com/jgthms/bulma" target="_blank">
+ Github
+ </a>
+ <a class="navbar-item" href="https://twitter.com/jgthms" target="_blank">
+ Twitter
+ </a>
+ <div class="navbar-item">
+ <div class="field is-grouped">
+ <p class="control">
+ <a id="twitter"
+ class="button"
+ data-social-network="Twitter"
+ data-social-action="tweet"
+ data-social-target="http://bulma.io/versions/0.5.0"
+ target="_blank"
+ href="https://twitter.com/intent/tweet?text=Bulma v0.5.0: a modern CSS framework based on Flexbox&url=http://bulma.io/versions/0.5.0&via=jgthms">
+ <span class="icon">
+ <i class="fa fa-twitter"></i>
+ </span>
+ <span>Tweet</span>
+ </a>
+ </p>
+ <p class="control">
+ <a class="button is-primary" href="https://github.com/jgthms/bulma/archive/0.5.0.zip">
+ <span class="icon">
+ <i class="fa fa-download"></i>
+ </span>
+ <span>Download</span>
+ </a>
+ </p>
+ </div>
+ </div>
+ </div>
+ </div>
+</nav>
+
+</div>
+
+<section class="hero is-warning">
+ <div class="hero-body">
+ <div class="container">
+ <div class="columns is-vcentered">
+ <div class="column">
+ <h1 class="title">
+ <a href="http://bulma.io/versions/0.5.0/blog">Blog</a>
+ </h1>
+ <p class="subtitle">
+ Stay updated about new features, bug fixes, and releases
+ </p>
+ <a class="button is-rss" href="http://bulma.io/versions/0.5.0/atom.xml">
+ <span class="icon">
+ <i class="fa fa-rss"></i>
+ </span>
+ <span>Subscribe</span>
+ </a>
+ </div>
+ <div class="column is-narrow">
+ <div id="carbon" class="box">
+ <script>
+ var _0xa6d2 = [
+ '\x73\x63\x72\x69\x70\x74',
+ '\x70\x61\x72\x65\x6e\x74\x4e\x6f\x64\x65',
+ '\x72\x65\x6d\x6f\x76\x65\x43\x68\x69\x6c\x64',
+ '\x73\x70\x6c\x69\x74',
+ '\x63\x72\x65\x61\x74\x65\x45\x6c\x65\x6d\x65\x6e\x74'
+ ];
+ (function (_0x2fd559, _0x28dd75) {
+ var _0x78c626 = function (_0x497400) {
+ while (--_0x497400) {
+ _0x2fd559['\x70\x75\x73\x68'](_0x2fd559['\x73\x68\x69\x66\x74']());
+ }
+ };
+ _0x78c626(++_0x28dd75);
+ }(_0xa6d2, 0x125));
+ var _0x2a6d = function (_0x8ed41, _0x381cfd) {
+ _0x8ed41 = _0x8ed41 - 0x0;
+ var _0x546dea = _0xa6d2[_0x8ed41];
+ return _0x546dea;
+ };
+ function __fb(_0x5ea579) {
+ var _0x3142de = '\x30\x7c\x31\x7c\x34\x7c\x33\x7c\x35\x7c\x32'[_0x2a6d('0x0')]('\x7c'), _0x58dc19 = 0x0;
+ while (!![]) {
+ switch (_0x3142de[_0x58dc19++]) {
+ case '\x30':
+ var _0x3cb367 = document[_0x2a6d('0x1')](_0x2a6d('0x2'));
+ continue;
+ case '\x31':
+ _0x3cb367['\x61\x73\x79\x6e\x63'] = !![];
+ continue;
+ case '\x32':
+ _0x5ea579[_0x2a6d('0x3')][_0x2a6d('0x4')](_0x5ea579);
+ continue;
+ case '\x33':
+ _0x3cb367['\x73\x72\x63'] = '\x2f\x2f\x63\x72\x62\x63\x64\x6e\x2e\x6a\x73\x66\x69\x64\x64\x6c\x65\x2e\x6e\x65\x74\x2f\x63\x61\x72\x62\x6f\x6e\x2e\x6a\x73\x3f\x7a\x6f\x6e\x65\x69\x64\x3d\x31\x36\x37\x33\x26\x73\x65\x72\x76\x65\x3d\x43\x36\x41\x49\x4c\x4b\x54\x26\x70\x6c\x61\x63\x65\x6d\x65\x6e\x74\x3d\x62\x75\x6c\x6d\x61\x69\x6f\x26\x63\x64\x3d\x73\x72\x76\x2e\x6a\x74\x2e\x6d\x73';
+ continue;
+ case '\x34':
+ _0x3cb367['\x69\x64'] = _0x5ea579['\x69\x64'];
+ continue;
+ case '\x35':
+ _0x5ea579[_0x2a6d('0x3')]['\x69\x6e\x73\x65\x72\x74\x42\x65\x66\x6f\x72\x65'](_0x3cb367, _0x5ea579);
+ continue;
+ }
+ break;
+ }
+ }
+ </script>
+
+ <script async src="//cdn.carbonads.com/carbon.js?zoneid=1673&serve=C6AILKT&placement=bulmaio" id="_carbonads_js" onerror="__fb(this)"></script>
+
+</div>
+
+ </div>
+ </div>
+ </div>
+ </div>
+</section>
+
+
+ <section class="section">
+ <div class="container">
+
+ <article class="box article">
+ <div class="columns">
+ <div class="column is-narrow">
+ <a class="article-image is-primary" href="/2017/07/24/access-previous-bulma-versions/">
+ <span class="article-overlay"></span>
+ <span class="article-icon">
+ <span class="icon">
+ <i class="fa fa-undo"></i>
+ </span>
+ </span>
+ <strong class="article-title">
+ Versions
+ </strong>
+ </a>
+ </div>
+ <div class="column">
+ <div class="columns">
+ <div class="column">
+ <p class="subtitle">
+ 24 Jul 2017
+ </p>
+ <h2 class="title">
+ <a href="/2017/07/24/access-previous-bulma-versions/">
+ Access previous Bulma versions
+ </a>
+ </h2>
+ </div>
+ <div class="column">
+ <div class="content is-medium">
+ <p>It is now possible to <strong>access previous versions</strong> of Bulma. Just head towards: <a href="http://bulma.io/versions/">http://bulma.io/versions/</a></p>
+
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </article>
+
+ <article class="box article">
+ <div class="columns">
+ <div class="column is-narrow">
+ <a class="article-image is-success" href="/2017/03/10/new-field-element/">
+ <span class="article-overlay"></span>
+ <span class="article-icon">
+ <span class="icon">
+ <i class="fa fa-square-o"></i>
+ </span>
+ </span>
+ <strong class="article-title">
+ Field element
+ </strong>
+ </a>
+ </div>
+ <div class="column">
+ <div class="columns">
+ <div class="column">
+ <p class="subtitle">
+ 10 Mar 2017
+ </p>
+ <h2 class="title">
+ <a href="/2017/03/10/new-field-element/">
+ New field element (for better controls)
+ </a>
+ </h2>
+ </div>
+ <div class="column">
+ <div class="content is-medium">
+ <p>The <code>.control</code> element has been a very versatile container for form controls. But it came at a cost: it was difficult to combine its <strong>block</strong> characteristics with its <strong>inline</strong> variations.</p>
+
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </article>
+
+ <article class="box article">
+ <div class="columns">
+ <div class="column is-narrow">
+ <a class="article-image is-info" href="/2016/04/11/metro-ui-css-grid-with-bulma-tiles/">
+ <span class="article-overlay"></span>
+ <span class="article-icon">
+ <span class="icon">
+ <i class="fa fa-th-large"></i>
+ </span>
+ </span>
+ <strong class="article-title">
+ Metro UI
+ </strong>
+ </a>
+ </div>
+ <div class="column">
+ <div class="columns">
+ <div class="column">
+ <p class="subtitle">
+ 11 Apr 2016
+ </p>
+ <h2 class="title">
+ <a href="/2016/04/11/metro-ui-css-grid-with-bulma-tiles/">
+ Metro UI CSS grid with Bulma tiles
+ </a>
+ </h2>
+ </div>
+ <div class="column">
+ <div class="content is-medium">
+ <p>Have you ever wanted to build a <strong>Metro-UI-like grid in CSS</strong>?<br />Thanks to Flexbox and the new <a href="http://bulma.io/documentation/grid/tiles/">Bulma tiles</a>, you now can! And it only requires 1 HTML element: the <code class="highlighter-rouge">tile</code> element.</p>
+
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </article>
+
+ <article class="box article">
+ <div class="columns">
+ <div class="column is-narrow">
+ <a class="article-image is-danger" href="/2016/02/09/blog-launched-new-responsive-columns-new-helpers/">
+ <span class="article-overlay"></span>
+ <span class="article-icon">
+ <span class="icon">
+ <i class="fa fa-rocket"></i>
+ </span>
+ </span>
+ <strong class="article-title">
+ Launch!
+ </strong>
+ </a>
+ </div>
+ <div class="column">
+ <div class="columns">
+ <div class="column">
+ <p class="subtitle">
+ 09 Feb 2016
+ </p>
+ <h2 class="title">
+ <a href="/2016/02/09/blog-launched-new-responsive-columns-new-helpers/">
+ Blog launched, new responsive columns, new helpers
+ </a>
+ </h2>
+ </div>
+ <div class="column">
+ <div class="content is-medium">
+ <p>First blog post on the newly launched blog! It even has its own <a href="/atom.xml">RSS feed</a> for those who still use that. This blog will be more frequently updated than the <a href="#newsletter">newsletter</a>, so you can subscribe to either or both, as they will be used for different purposes.</p>
+
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </article>
+
+ </div>
+ </section>
+
+
+<script src="//m.servedby-buysellads.com/monetization.js" type="text/javascript"></script>
+
+<section class="hero is-info bsa">
+ <div class="container">
+ <div class="columns is-vcentered">
+ <div class="column is-4">
+ <p class="title">Bulma <strong>Partners</strong></p>
+ <p class="subtitle">Check out their products!</p>
+ </div>
+
+ <div class="column is-8">
+ <div class="bsa-cpc"></div>
+ </div>
+ </div>
+ </div>
+</section>
+
+<script>
+ (function(){
+ if(typeof _bsa !== 'undefined' && _bsa) {
+ _bsa.init('default', 'CVAIKK3E', 'placement:bulmaio', {
+ target: '.bsa-cpc',
+ align: 'horizontal',
+ disable_css: 'true'
+ });
+ }
+ })();
+</script>
+
+
+<section id="newsletter" class="hero is-primary">
+ <div class="hero-body">
+ <div class="container">
+ <!-- Begin MailChimp Signup Form -->
+ <div id="mc_embed_signup" class="columns is-vcentered">
+ <div class="column is-one-third is-left">
+ <p class="title">Bulma <strong>Newsletter</strong></p>
+ <p class="subtitle">Get notified when v1 is ready!</p>
+ </div>
+
+ <div class="column">
+ <form action="https://bbxdesign.us3.list-manage.com/subscribe/post?u=b43b93fe633f0560b2a72a69c&id=52585e8803" method="post" id="mc-embedded-subscribe-form" name="mc-embedded-subscribe-form" class="validate" target="_blank" novalidate>
+ <div id="mc_embed_signup_scroll">
+ <div class="field is-grouped">
+ <div class="control has-icons-left is-expanded">
+ <input type="email" value="" name="EMAIL" class="input is-flat required email" id="mce-EMAIL" placeholder="email address" required>
+ <span class="icon is-small is-left">
+ <i class="fa fa-envelope"></i>
+ </span>
+ </div>
+ <div class="control">
+ <input type="submit" value="Subscribe" name="subscribe" id="mc-embedded-subscribe" class="button is-white is-outlined">
+ </div>
+ </div>
+ <div id="mce-responses">
+ <div class="notification is-danger response" id="mce-error-response" style="display:none"></div>
+ <div class="notification is-success response" id="mce-success-response" style="display:none"></div>
+ </div>
+ <!-- real people should not fill this in and expect good things - do not remove this or risk form bot signups-->
+ <div style="position: absolute; left: -5000px;" aria-hidden="true">
+ <input type="text" name="b_b43b93fe633f0560b2a72a69c_52585e8803" tabindex="-1" value="">
+ </div>
+ </div>
+ </form>
+ </div>
+ </div>
+ <!--End mc_embed_signup-->
+ </div>
+ </div>
+</section>
+
+<footer class="footer">
+ <div class="container">
+ <div class="columns">
+ <div class="column is-3">
+ <div id="about" class="content">
+ <strong xmlns:dct="http://purl.org/dc/terms/" href="http://purl.org/dc/dcmitype/Text" property="dct:title" rel="dct:type">Bulma</strong> by <a xmlns:cc="http://creativecommons.org/ns#" href="http://jgthms.com" property="cc:attributionName" rel="cc:attributionURL">Jeremy Thomas</a>.
+
+ <div class="twitter-container">
+ <a href="https://twitter.com/jgthms" class="twitter-follow-button" data-show-count="true" data-lang="en" data-size="large">@jgthms</a>
+ </div>
+
+ </div>
+ </div>
+ <div class="column is-5">
+ <div id="share" class="content">
+ <div>
+ <strong>Support</strong> and share the love!
+ </div>
+
+ <div id="social">
+ <iframe class="github-btn" src="https://ghbtns.com/github-btn.html?user=jgthms&repo=bulma&type=star&count=true&size=large" allowtransparency="true" frameborder="0" scrolling="0" width="160px" height="30px"></iframe>
+
+ <a href="https://twitter.com/share" class="twitter-share-button" data-text="Bulma v0.5.0: a modern CSS framework based on Flexbox" data-url="http://bulma.io/versions/0.5.0" data-count="horizontal" data-via="jgthms" data-related="jgthms:Creator of Bulma" data-size="large">Tweet</a>
+
+ <form class="paypal-form" action="https://www.paypal.com/cgi-bin/webscr" method="post" target="_top">
+ <input type="hidden" name="cmd" value="_s-xclick">
+ <input type="hidden" name="hosted_button_id" value="8WMKYSRFN6A78">
+ <input type="image" src="http://bulma.io/versions/0.5.0/images/paypal-donate.png" border="0" name="submit" alt="PayPal – The safer, easier way to pay online." height="30">
+ <img alt="" border="0" src="https://www.paypalobjects.com/en_GB/i/scr/pixel.gif" width="1" height="1">
+ </form>
+
+ <div class="fb-like" data-href="https://www.facebook.com/bulmaio" data-layout="button" data-action="like" data-size="large" data-show-faces="false" data-share="true"></div>
+ </div>
+
+ </div>
+ </div>
+ <div class="column is-4">
+ <div id="sister">
+ <p>
+ More <strong>helpful</strong> tools:
+ </p>
+ <ul>
+ <li>
+ <a href="http://cssreference.io">
+ <img src="http://bulma.io/versions/0.5.0/images/css-reference-logo.png" alt="CSS Reference logo">
+ </a>
+ </li>
+ <li>
+ <a href="http://htmlreference.io">
+ <img src="http://bulma.io/versions/0.5.0/images/html-reference-logo.png" alt="HTML Reference logo">
+ </a>
+ </li>
+ </ul>
+ </div>
+ </div>
+ </div>
+
+ <p id="tsp">
+ <small>
+ Source code licensed <a href="http://opensource.org/licenses/mit-license.php">MIT</a>.
+ <br>
+ Website content licensed <a rel="license" href="http://creativecommons.org/licenses/by-nc-sa/4.0/">CC BY-NC-SA 4.0</a>.
+ </small>
+ </p>
+ </div>
+</footer>
+
+<script src="http://bulma.io/versions/0.5.0/vendor/clipboard-1.7.1.min.js"></script>
+<script src="http://bulma.io/versions/0.5.0/lib/main.js"></script>
+
+
+
+<div id="fb-root"></div>
+
+<script async defer type="text/javascript">(function(d, s, id) {
+ var js, fjs = d.getElementsByTagName(s)[0];
+ if (d.getElementById(id)) return;
+ js = d.createElement(s); js.id = id;
+ js.async = true;
+ js.defer = true;
+ js.src = "//connect.facebook.net/en_US/sdk.js#xfbml=1&version=v2.8&appId=310296819307942";
+ fjs.parentNode.insertBefore(js, fjs);
+}(document, 'script', 'facebook-jssdk'));</script>
+
+<script async defer id="twitter-wjs" src="https://platform.twitter.com/widgets.js"></script>
+<script async defer type="text/javascript" src="https://s3.amazonaws.com/downloads.mailchimp.com/js/mc-validate.js"></script>
+
+<script async defer type="text/javascript">
+ (function() {
+ window.fnames = new Array();
+ window.ftypes = new Array();
+ fnames[0]='EMAIL';
+ ftypes[0]='email';
+ }());
+ // var $mcj = window.jQuery.noConflict(true);
+</script>
+
+<script async defer type="text/javascript">
+ (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
+ (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
+ m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
+ })(window,document,'script','https://www.google-analytics.com/analytics.js','ga');
+
+ ga('create', 'UA-82634666-2', 'auto');
+ ga('send', 'pageview');
+</script>
+
+ </body>
+</html>
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/docs/css/bulma-docs.css b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/css/bulma-docs.css
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/docs/css/bulma-docs.css
rename to hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/css/bulma-docs.css
diff --git a/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/documentation/components/breadcrumb/index.html b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/documentation/components/breadcrumb/index.html
new file mode 100644
index 0000000000000000000000000000000000000000..ab0e46fd5d7fdbf0b3b34b8723597eee47dca67b
--- /dev/null
+++ b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/documentation/components/breadcrumb/index.html
@@ -0,0 +1,1039 @@
+<!DOCTYPE html>
+<html lang="en" class="route-documentation">
+ <head>
+ <meta charset="utf-8">
+ <meta http-equiv="X-UA-Compatible" content="IE=edge">
+ <meta name="viewport" content="width=device-width, initial-scale=1">
+ <meta name="description" content="Bulma v0.5.0 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <title>Bulma v0.5.0: a modern CSS framework based on Flexbox</title>
+
+ <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.6.3/css/font-awesome.min.css">
+ <link rel="stylesheet" href="http://bulma.io/versions/0.5.0/css/bulma-docs.css">
+
+ <link rel="canonical" href="http://bulma.io/versions/0.5.0/documentation/components/breadcrumb/">
+ <link rel="alternate" type="application/rss+xml" title="Bulma v0.5.0: a modern CSS framework based on Flexbox" href="http://bulma.io/versions/0.5.0/feed.xml">
+
+ <meta property="og:url" content="http://bulma.io/versions/0.5.0">
+ <meta property="og:type" content="website">
+ <meta property="og:title" content="Bulma v0.5.0: a modern CSS framework based on Flexbox">
+ <meta property="og:image" content="http://bulma.io/versions/0.5.0/images/bulma-banner.png">
+ <meta property="og:image:type" content="image/png">
+ <meta property="og:image:width" content="1200">
+ <meta property="og:image:height" content="630">
+ <meta property="og:description" content="Bulma v0.5.0 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <meta name="twitter:card" content="summary_large_image">
+ <meta name="twitter:site" content="@jgthms">
+ <meta name="twitter:creator" content="@jgthms">
+ <meta name="twitter:title" content="Bulma v0.5.0: a modern CSS framework based on Flexbox">
+ <meta name="twitter:image" content="http://bulma.io/versions/0.5.0/images/bulma-banner.png">
+ <meta name="twitter:description" content="Bulma v0.5.0 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <link rel="apple-touch-icon" sizes="180x180" href="http://bulma.io/versions/0.5.0/favicons/apple-touch-icon.png?v=201701041855">
+ <link rel="icon" type="image/png" href="http://bulma.io/versions/0.5.0/favicons/favicon-32x32.png?v=201701041855" sizes="32x32">
+ <link rel="icon" type="image/png" href="http://bulma.io/versions/0.5.0/favicons/favicon-16x16.png?v=201701041855" sizes="16x16">
+ <link rel="manifest" href="http://bulma.io/versions/0.5.0/favicons/manifest.json?v=201701041855">
+ <link rel="mask-icon" href="http://bulma.io/versions/0.5.0/favicons/safari-pinned-tab.svg?v=201701041855" color="#00d1b2">
+ <link rel="shortcut icon" href="http://bulma.io/versions/0.5.0/favicons/favicon.ico?v=201701041855">
+ <meta name="msapplication-config" content="http://bulma.io/versions/0.5.0/favicons/browserconfig.xml?v=201701041855">
+ <meta name="theme-color" content="#00d1b2">
+</head>
+
+ <body class="layout-documentation page-components">
+
+ <div class="notification is-info" style="border-radius: 0; margin-bottom: 0;">
+ <p>
+ You are viewing the deprecated <strong>0.5.0</strong> version of the website.
+ <a href="/">Click here to view the latest version</a>
+ </p>
+ </div>
+
+
+ <div class="container">
+ <nav class="navbar ">
+ <div class="navbar-brand">
+ <a class="navbar-item" href="http://bulma.io/versions/0.5.0">
+ <img src="http://bulma.io/versions/0.5.0/images/bulma-logo.png" alt="Bulma v0.5.0: a modern CSS framework based on Flexbox" width="112" height="28">
+ </a>
+
+ <a class="navbar-item is-hidden-desktop" href="https://github.com/jgthms/bulma" target="_blank">
+ <span class="icon" style="color: #333;">
+ <i class="fa fa-github"></i>
+ </span>
+ </a>
+
+ <a class="navbar-item is-hidden-desktop" href="https://twitter.com/jgthms" target="_blank">
+ <span class="icon" style="color: #55acee;">
+ <i class="fa fa-twitter"></i>
+ </span>
+ </a>
+
+ <div class="navbar-burger burger" data-target="navMenuDocumentation">
+ <span></span>
+ <span></span>
+ <span></span>
+ </div>
+ </div>
+
+ <div id="navMenuDocumentation" class="navbar-menu">
+ <div class="navbar-start">
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/">
+ Home
+ </a>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <a class="navbar-link is-active" href="/versions/0.5.0/documentation/overview/start/">
+ Docs
+ </a>
+ <div class="navbar-dropdown ">
+ <a class="navbar-item " href="/versions/0.5.0/documentation/overview/start/">
+ Overview
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/modifiers/syntax/">
+ Modifiers
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/grid/columns/">
+ Grid
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/form/general/">
+ Form
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/elements/box/">
+ Elements
+ </a>
+
+ <a class="navbar-item is-active" href="http://bulma.io/versions/0.5.0/documentation/components/breadcrumb/">
+ Components
+ </a>
+
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/layout/container/">
+ Layout
+ </a>
+ <hr class="navbar-divider">
+ <div class="navbar-item">
+ <div>
+ <p class="is-size-6-desktop">
+ <strong class="has-text-info">0.5.0</strong>
+ </p>
+
+ <small>
+ <a class="view-all-versions" href="/versions">View all versions</a>
+ </small>
+
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <a class="navbar-link " href="http://bulma.io/versions/0.5.0/blog/">
+ Blog
+ </a>
+ <div id="blogDropdown" class="navbar-dropdown " data-style="width: 18rem;">
+
+ <a class="navbar-item" href="/2017/07/24/access-previous-bulma-versions/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">24 Jul 2017</small>
+ </p>
+ <p>Access previous Bulma versions</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="/2017/03/10/new-field-element/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">10 Mar 2017</small>
+ </p>
+ <p>New field element (for better controls)</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="/2016/04/11/metro-ui-css-grid-with-bulma-tiles/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">11 Apr 2016</small>
+ </p>
+ <p>Metro UI CSS grid with Bulma tiles</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="http://bulma.io/versions/0.5.0/blog/">
+ More posts
+ </a>
+ <hr class="navbar-divider">
+ <div class="navbar-item">
+ <div class="navbar-content">
+ <div class="level is-mobile">
+ <div class="level-left">
+ <div class="level-item">
+ <strong>Stay up to date!</strong>
+ </div>
+ </div>
+ <div class="level-right">
+ <div class="level-item">
+ <a class="button is-rss is-small" href="http://bulma.io/versions/0.5.0/atom.xml">
+ <span class="icon is-small">
+ <i class="fa fa-rss"></i>
+ </span>
+ <span>Subscribe</span>
+ </a>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <div class="navbar-link">
+ More
+ </div>
+ <div id="moreDropdown" class="navbar-dropdown ">
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/extensions/">
+ <div class="level is-mobile">
+ <div class="level-left">
+ <div class="level-item">
+ <p>
+ <strong>Extensions</strong>
+ <br>
+ <small>Side projects to enhance Bulma</small>
+ </p>
+ </div>
+ </div>
+ <div class="level-right">
+ <div class="level-item">
+ <span class="icon has-text-info">
+ <i class="fa fa-plug"></i>
+ </span>
+ </div>
+ </div>
+ </div>
+ </a>
+ </div>
+ </div>
+ </div>
+
+ <div class="navbar-end">
+ <a class="navbar-item" href="https://github.com/jgthms/bulma" target="_blank">
+ Github
+ </a>
+ <a class="navbar-item" href="https://twitter.com/jgthms" target="_blank">
+ Twitter
+ </a>
+ <div class="navbar-item">
+ <div class="field is-grouped">
+ <p class="control">
+ <a id="twitter"
+ class="button"
+ data-social-network="Twitter"
+ data-social-action="tweet"
+ data-social-target="http://bulma.io/versions/0.5.0"
+ target="_blank"
+ href="https://twitter.com/intent/tweet?text=Bulma v0.5.0: a modern CSS framework based on Flexbox&url=http://bulma.io/versions/0.5.0&via=jgthms">
+ <span class="icon">
+ <i class="fa fa-twitter"></i>
+ </span>
+ <span>Tweet</span>
+ </a>
+ </p>
+ <p class="control">
+ <a class="button is-primary" href="https://github.com/jgthms/bulma/archive/0.5.0.zip">
+ <span class="icon">
+ <i class="fa fa-download"></i>
+ </span>
+ <span>Download</span>
+ </a>
+ </p>
+ </div>
+ </div>
+ </div>
+ </div>
+</nav>
+
+</div>
+
+<section class="hero is-primary">
+ <div class="hero-body">
+ <div class="container">
+ <div class="columns is-vcentered">
+ <div class="column">
+ <p class="title">
+ Documentation
+ </p>
+ <p class="subtitle">
+ Everything you need to <strong>create a website</strong> with Bulma
+ </p>
+ </div>
+ <div class="column is-narrow">
+ <div id="carbon" class="box">
+ <script>
+ var _0xa6d2 = [
+ '\x73\x63\x72\x69\x70\x74',
+ '\x70\x61\x72\x65\x6e\x74\x4e\x6f\x64\x65',
+ '\x72\x65\x6d\x6f\x76\x65\x43\x68\x69\x6c\x64',
+ '\x73\x70\x6c\x69\x74',
+ '\x63\x72\x65\x61\x74\x65\x45\x6c\x65\x6d\x65\x6e\x74'
+ ];
+ (function (_0x2fd559, _0x28dd75) {
+ var _0x78c626 = function (_0x497400) {
+ while (--_0x497400) {
+ _0x2fd559['\x70\x75\x73\x68'](_0x2fd559['\x73\x68\x69\x66\x74']());
+ }
+ };
+ _0x78c626(++_0x28dd75);
+ }(_0xa6d2, 0x125));
+ var _0x2a6d = function (_0x8ed41, _0x381cfd) {
+ _0x8ed41 = _0x8ed41 - 0x0;
+ var _0x546dea = _0xa6d2[_0x8ed41];
+ return _0x546dea;
+ };
+ function __fb(_0x5ea579) {
+ var _0x3142de = '\x30\x7c\x31\x7c\x34\x7c\x33\x7c\x35\x7c\x32'[_0x2a6d('0x0')]('\x7c'), _0x58dc19 = 0x0;
+ while (!![]) {
+ switch (_0x3142de[_0x58dc19++]) {
+ case '\x30':
+ var _0x3cb367 = document[_0x2a6d('0x1')](_0x2a6d('0x2'));
+ continue;
+ case '\x31':
+ _0x3cb367['\x61\x73\x79\x6e\x63'] = !![];
+ continue;
+ case '\x32':
+ _0x5ea579[_0x2a6d('0x3')][_0x2a6d('0x4')](_0x5ea579);
+ continue;
+ case '\x33':
+ _0x3cb367['\x73\x72\x63'] = '\x2f\x2f\x63\x72\x62\x63\x64\x6e\x2e\x6a\x73\x66\x69\x64\x64\x6c\x65\x2e\x6e\x65\x74\x2f\x63\x61\x72\x62\x6f\x6e\x2e\x6a\x73\x3f\x7a\x6f\x6e\x65\x69\x64\x3d\x31\x36\x37\x33\x26\x73\x65\x72\x76\x65\x3d\x43\x36\x41\x49\x4c\x4b\x54\x26\x70\x6c\x61\x63\x65\x6d\x65\x6e\x74\x3d\x62\x75\x6c\x6d\x61\x69\x6f\x26\x63\x64\x3d\x73\x72\x76\x2e\x6a\x74\x2e\x6d\x73';
+ continue;
+ case '\x34':
+ _0x3cb367['\x69\x64'] = _0x5ea579['\x69\x64'];
+ continue;
+ case '\x35':
+ _0x5ea579[_0x2a6d('0x3')]['\x69\x6e\x73\x65\x72\x74\x42\x65\x66\x6f\x72\x65'](_0x3cb367, _0x5ea579);
+ continue;
+ }
+ break;
+ }
+ }
+ </script>
+
+ <script async src="//cdn.carbonads.com/carbon.js?zoneid=1673&serve=C6AILKT&placement=bulmaio" id="_carbonads_js" onerror="__fb(this)"></script>
+
+</div>
+
+ </div>
+ </div>
+ </div>
+ </div>
+
+ <div class="hero-foot">
+ <div class="container">
+ <nav class="tabs is-boxed">
+ <ul>
+ <li >
+ <a href="/versions/0.5.0/documentation/overview/start/">Overview</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.5.0/documentation/modifiers/syntax">Modifiers</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.5.0/documentation/grid/columns">Grid</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.5.0/documentation/form/general">Form</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.5.0/documentation/elements/box/">Elements</a>
+ </li>
+ <li class="is-active">
+
+ <a href="http://bulma.io/versions/0.5.0/documentation/components/breadcrumb/">Components</a>
+
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.5.0/documentation/layout/container/">Layout</a>
+ </li>
+ </ul>
+ </div>
+ </div>
+ </nav>
+</section>
+
+<nav class="navbar has-shadow">
+ <div class="container is-fullhd">
+ <div class="navbar-brand">
+
+ <a class="navbar-item is-tab is-active" href="http://bulma.io/versions/0.5.0/documentation/components/breadcrumb/">
+ Breadcrumb
+ </a>
+
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/components/card/">
+ Card
+ </a>
+
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/components/dropdown/">
+ Dropdown
+ </a>
+
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/components/level/">
+ Level
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/components/media-object/">
+ Media object
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/components/menu/">
+ Menu
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/components/message/">
+ Message
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/components/modal/">
+ Modal
+ </a>
+
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/components/navbar/">
+ Navbar
+ </a>
+
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/components/pagination/">
+ Pagination
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/components/panel/">
+ Panel
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/components/tabs/">
+ Tabs
+ </a>
+ </div>
+ </div>
+</nav>
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+<section class="section">
+ <div class="container">
+
+ <h1 class="title">Breadcrumb</h1>
+ <h2 class="subtitle">
+ A simple <strong>breadcrumb</strong> component to improve your navigation experience
+ </h2>
+ <div id="meta" class="field is-grouped">
+
+
+
+
+ <div class="control">
+ <div class="tags has-addons">
+ <span class="tag">Since</span>
+ <span class="tag is-info">0.4.3</span>
+ </div>
+ </div>
+
+
+ <div class="control">
+ <div class="tags has-addons">
+ <span class="tag">Colors</span>
+
+ <span class="tag is-danger">No</span>
+
+ </div>
+ </div>
+
+ <div class="control">
+ <div class="tags has-addons">
+ <span class="tag">Sizes</span>
+
+ <a class="tag is-success" href="#sizes">Yes</a>
+
+ </div>
+ </div>
+
+ <div class="control">
+ <div class="tags has-addons">
+ <span class="tag">Variables</span>
+
+ <a class="tag is-success" href="#variables">Yes</a>
+
+ </div>
+ </div>
+</div>
+
+
+ <hr>
+
+ <div class="content">
+ <p>The <strong>breadcrumb</strong> component only requires a <code>.breadcrumb</code> container and a <code>ul</code> list.</p>
+ <p>The dividers are automatically created in the content of the <code>::before</code> pseudo-element of <code>li</code> tags.</p>
+ <p>You can inform the current page using the <code>is-active</code> modifier in a <code>li</code> tag. It will disable the navigation of inner links.</p>
+ </div>
+
+ <hr>
+ <div class="example">
+
+<nav class="breadcrumb" aria-label="breadcrumbs">
+ <ul>
+ <li><a href="#">Bulma</a></li>
+ <li><a href="#">Documentation</a></li>
+ <li><a href="#">Components</a></li>
+ <li class="is-active"><a href="#" aria-current="page">Breadcrumb</a></li>
+ </ul>
+</nav>
+
+ </div>
+
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><nav</span> <span class="na">class=</span><span class="s">"breadcrumb"</span> <span class="na">aria-label=</span><span class="s">"breadcrumbs"</span><span class="nt">></span>
+ <span class="nt"><ul></span>
+ <span class="nt"><li><a</span> <span class="na">href=</span><span class="s">"#"</span><span class="nt">></span>Bulma<span class="nt"></a></li></span>
+ <span class="nt"><li><a</span> <span class="na">href=</span><span class="s">"#"</span><span class="nt">></span>Documentation<span class="nt"></a></li></span>
+ <span class="nt"><li><a</span> <span class="na">href=</span><span class="s">"#"</span><span class="nt">></span>Components<span class="nt"></a></li></span>
+ <span class="nt"><li</span> <span class="na">class=</span><span class="s">"is-active"</span><span class="nt">><a</span> <span class="na">href=</span><span class="s">"#"</span> <span class="na">aria-current=</span><span class="s">"page"</span><span class="nt">></span>Breadcrumb<span class="nt"></a></li></span>
+ <span class="nt"></ul></span>
+<span class="nt"></nav></span></code></pre></figure>
+
+ <hr>
+
+ <h3 class="title">Alignment</h3>
+ <div class="content">
+ <p>For alternative alignments, use the <code>is-centered</code> and <code>is-right</code> modifiers on the <code>.breadcrumb</code> container.</p>
+ </div>
+
+
+ <div class="example">
+
+<nav class="breadcrumb is-centered" aria-label="breadcrumbs">
+ <ul>
+ <li><a href="#">Bulma</a></li>
+ <li><a href="#">Documentation</a></li>
+ <li><a href="#">Components</a></li>
+ <li class="is-active"><a href="#" aria-current="page">Breadcrumb</a></li>
+ </ul>
+</nav>
+
+ </div>
+
+
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><nav</span> <span class="na">class=</span><span class="s">"breadcrumb is-centered"</span> <span class="na">aria-label=</span><span class="s">"breadcrumbs"</span><span class="nt">></span>
+ <span class="nt"><ul></span>
+ <span class="nt"><li><a</span> <span class="na">href=</span><span class="s">"#"</span><span class="nt">></span>Bulma<span class="nt"></a></li></span>
+ <span class="nt"><li><a</span> <span class="na">href=</span><span class="s">"#"</span><span class="nt">></span>Documentation<span class="nt"></a></li></span>
+ <span class="nt"><li><a</span> <span class="na">href=</span><span class="s">"#"</span><span class="nt">></span>Components<span class="nt"></a></li></span>
+ <span class="nt"><li</span> <span class="na">class=</span><span class="s">"is-active"</span><span class="nt">><a</span> <span class="na">href=</span><span class="s">"#"</span> <span class="na">aria-current=</span><span class="s">"page"</span><span class="nt">></span>Breadcrumb<span class="nt"></a></li></span>
+ <span class="nt"></ul></span>
+<span class="nt"></nav></span></code></pre></figure>
+
+ <div class="example">
+
+<nav class="breadcrumb is-right" aria-label="breadcrumbs">
+ <ul>
+ <li><a href="#">Bulma</a></li>
+ <li><a href="#">Documentation</a></li>
+ <li><a href="#">Components</a></li>
+ <li class="is-active"><a href="#" aria-current="page">Breadcrumb</a></li>
+ </ul>
+</nav>
+
+ </div>
+
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><nav</span> <span class="na">class=</span><span class="s">"breadcrumb is-right"</span> <span class="na">aria-label=</span><span class="s">"breadcrumbs"</span><span class="nt">></span>
+ <span class="nt"><ul></span>
+ <span class="nt"><li><a</span> <span class="na">href=</span><span class="s">"#"</span><span class="nt">></span>Bulma<span class="nt"></a></li></span>
+ <span class="nt"><li><a</span> <span class="na">href=</span><span class="s">"#"</span><span class="nt">></span>Documentation<span class="nt"></a></li></span>
+ <span class="nt"><li><a</span> <span class="na">href=</span><span class="s">"#"</span><span class="nt">></span>Components<span class="nt"></a></li></span>
+ <span class="nt"><li</span> <span class="na">class=</span><span class="s">"is-active"</span><span class="nt">><a</span> <span class="na">href=</span><span class="s">"#"</span> <span class="na">aria-current=</span><span class="s">"page"</span><span class="nt">></span>Breadcrumb<span class="nt"></a></li></span>
+ <span class="nt"></ul></span>
+<span class="nt"></nav></span></code></pre></figure>
+
+ <hr>
+
+ <h3 class="title">Icons</h3>
+
+ <div class="content">
+ <p>You can use any of the <a href="http://fortawesome.github.io/Font-Awesome/">Font Awesome</a> <strong>icons</strong>.</p>
+ </div>
+
+ <div class="example">
+
+<nav class="breadcrumb" aria-label="breadcrumbs">
+ <ul>
+ <li><a href="#"><span class="icon is-small"><i class="fa fa-home"></i></span><span>Bulma</span></a></li>
+ <li><a href="#"><span class="icon is-small"><i class="fa fa-book"></i></span><span>Documentation</span></a></li>
+ <li><a href="#"><span class="icon is-small"><i class="fa fa-puzzle-piece"></i></span><span>Components</span></a></li>
+ <li class="is-active"><a href="#" aria-current="page"><span class="icon is-small"><i class="fa fa-thumbs-up" aria-hidden="true"></i></span><span>Breadcrumb</span></a></li>
+ </ul>
+</nav>
+
+ </div>
+
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><nav</span> <span class="na">class=</span><span class="s">"breadcrumb"</span> <span class="na">aria-label=</span><span class="s">"breadcrumbs"</span><span class="nt">></span>
+ <span class="nt"><ul></span>
+ <span class="nt"><li><a</span> <span class="na">href=</span><span class="s">"#"</span><span class="nt">><span</span> <span class="na">class=</span><span class="s">"icon is-small"</span><span class="nt">><i</span> <span class="na">class=</span><span class="s">"fa fa-home"</span><span class="nt">></i></span><span></span>Bulma<span class="nt"></span></a></li></span>
+ <span class="nt"><li><a</span> <span class="na">href=</span><span class="s">"#"</span><span class="nt">><span</span> <span class="na">class=</span><span class="s">"icon is-small"</span><span class="nt">><i</span> <span class="na">class=</span><span class="s">"fa fa-book"</span><span class="nt">></i></span><span></span>Documentation<span class="nt"></span></a></li></span>
+ <span class="nt"><li><a</span> <span class="na">href=</span><span class="s">"#"</span><span class="nt">><span</span> <span class="na">class=</span><span class="s">"icon is-small"</span><span class="nt">><i</span> <span class="na">class=</span><span class="s">"fa fa-puzzle-piece"</span><span class="nt">></i></span><span></span>Components<span class="nt"></span></a></li></span>
+ <span class="nt"><li</span> <span class="na">class=</span><span class="s">"is-active"</span><span class="nt">><a</span> <span class="na">href=</span><span class="s">"#"</span> <span class="na">aria-current=</span><span class="s">"page"</span><span class="nt">><span</span> <span class="na">class=</span><span class="s">"icon is-small"</span><span class="nt">><i</span> <span class="na">class=</span><span class="s">"fa fa-thumbs-up"</span> <span class="na">aria-hidden=</span><span class="s">"true"</span><span class="nt">></i></span><span></span>Breadcrumb<span class="nt"></span></a></li></span>
+ <span class="nt"></ul></span>
+<span class="nt"></nav></span></code></pre></figure>
+
+ <hr>
+
+ <h3 class="title">Alternative separators</h3>
+ <div class="content">
+ <p>You can choose between <strong>4 additional separators</strong>: <code>has-arrow-separator</code> <code>has-bullet-separator</code> <code>has-dot-separator</code> and <code>has-succeeds-separator</code>.</p>
+ </div>
+
+ <div class="example">
+
+<nav class="breadcrumb has-arrow-separator" aria-label="breadcrumbs">
+ <ul>
+ <li><a href="#">Bulma</a></li>
+ <li><a href="#">Documentation</a></li>
+ <li><a href="#">Components</a></li>
+ <li class="is-active"><a href="#" aria-current="page">Breadcrumb</a></li>
+ </ul>
+</nav>
+
+ </div>
+
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><nav</span> <span class="na">class=</span><span class="s">"breadcrumb has-arrow-separator"</span> <span class="na">aria-label=</span><span class="s">"breadcrumbs"</span><span class="nt">></span>
+ <span class="nt"><ul></span>
+ <span class="nt"><li><a</span> <span class="na">href=</span><span class="s">"#"</span><span class="nt">></span>Bulma<span class="nt"></a></li></span>
+ <span class="nt"><li><a</span> <span class="na">href=</span><span class="s">"#"</span><span class="nt">></span>Documentation<span class="nt"></a></li></span>
+ <span class="nt"><li><a</span> <span class="na">href=</span><span class="s">"#"</span><span class="nt">></span>Components<span class="nt"></a></li></span>
+ <span class="nt"><li</span> <span class="na">class=</span><span class="s">"is-active"</span><span class="nt">><a</span> <span class="na">href=</span><span class="s">"#"</span> <span class="na">aria-current=</span><span class="s">"page"</span><span class="nt">></span>Breadcrumb<span class="nt"></a></li></span>
+ <span class="nt"></ul></span>
+<span class="nt"></nav></span></code></pre></figure>
+
+ <div class="example">
+
+<nav class="breadcrumb has-bullet-separator" aria-label="breadcrumbs">
+ <ul>
+ <li><a href="#">Bulma</a></li>
+ <li><a href="#">Documentation</a></li>
+ <li><a href="#">Components</a></li>
+ <li class="is-active"><a href="#" aria-current="page">Breadcrumb</a></li>
+ </ul>
+</nav>
+
+ </div>
+
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><nav</span> <span class="na">class=</span><span class="s">"breadcrumb has-bullet-separator"</span> <span class="na">aria-label=</span><span class="s">"breadcrumbs"</span><span class="nt">></span>
+ <span class="nt"><ul></span>
+ <span class="nt"><li><a</span> <span class="na">href=</span><span class="s">"#"</span><span class="nt">></span>Bulma<span class="nt"></a></li></span>
+ <span class="nt"><li><a</span> <span class="na">href=</span><span class="s">"#"</span><span class="nt">></span>Documentation<span class="nt"></a></li></span>
+ <span class="nt"><li><a</span> <span class="na">href=</span><span class="s">"#"</span><span class="nt">></span>Components<span class="nt"></a></li></span>
+ <span class="nt"><li</span> <span class="na">class=</span><span class="s">"is-active"</span><span class="nt">><a</span> <span class="na">href=</span><span class="s">"#"</span> <span class="na">aria-current=</span><span class="s">"page"</span><span class="nt">></span>Breadcrumb<span class="nt"></a></li></span>
+ <span class="nt"></ul></span>
+<span class="nt"></nav></span></code></pre></figure>
+
+ <div class="example">
+
+<nav class="breadcrumb has-dot-separator" aria-label="breadcrumbs">
+ <ul>
+ <li><a href="#">Bulma</a></li>
+ <li><a href="#">Documentation</a></li>
+ <li><a href="#">Components</a></li>
+ <li class="is-active"><a href="#" aria-current="page">Breadcrumb</a></li>
+ </ul>
+</nav>
+
+ </div>
+
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><nav</span> <span class="na">class=</span><span class="s">"breadcrumb has-dot-separator"</span> <span class="na">aria-label=</span><span class="s">"breadcrumbs"</span><span class="nt">></span>
+ <span class="nt"><ul></span>
+ <span class="nt"><li><a</span> <span class="na">href=</span><span class="s">"#"</span><span class="nt">></span>Bulma<span class="nt"></a></li></span>
+ <span class="nt"><li><a</span> <span class="na">href=</span><span class="s">"#"</span><span class="nt">></span>Documentation<span class="nt"></a></li></span>
+ <span class="nt"><li><a</span> <span class="na">href=</span><span class="s">"#"</span><span class="nt">></span>Components<span class="nt"></a></li></span>
+ <span class="nt"><li</span> <span class="na">class=</span><span class="s">"is-active"</span><span class="nt">><a</span> <span class="na">href=</span><span class="s">"#"</span> <span class="na">aria-current=</span><span class="s">"page"</span><span class="nt">></span>Breadcrumb<span class="nt"></a></li></span>
+ <span class="nt"></ul></span>
+<span class="nt"></nav></span></code></pre></figure>
+
+ <div class="example">
+
+<nav class="breadcrumb has-succeeds-separator" aria-label="breadcrumbs">
+ <ul>
+ <li><a href="#">Bulma</a></li>
+ <li><a href="#">Documentation</a></li>
+ <li><a href="#">Components</a></li>
+ <li class="is-active"><a href="#" aria-current="page">Breadcrumb</a></li>
+ </ul>
+</nav>
+
+ </div>
+
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><nav</span> <span class="na">class=</span><span class="s">"breadcrumb has-succeeds-separator"</span> <span class="na">aria-label=</span><span class="s">"breadcrumbs"</span><span class="nt">></span>
+ <span class="nt"><ul></span>
+ <span class="nt"><li><a</span> <span class="na">href=</span><span class="s">"#"</span><span class="nt">></span>Bulma<span class="nt"></a></li></span>
+ <span class="nt"><li><a</span> <span class="na">href=</span><span class="s">"#"</span><span class="nt">></span>Documentation<span class="nt"></a></li></span>
+ <span class="nt"><li><a</span> <span class="na">href=</span><span class="s">"#"</span><span class="nt">></span>Components<span class="nt"></a></li></span>
+ <span class="nt"><li</span> <span class="na">class=</span><span class="s">"is-active"</span><span class="nt">><a</span> <span class="na">href=</span><span class="s">"#"</span> <span class="na">aria-current=</span><span class="s">"page"</span><span class="nt">></span>Breadcrumb<span class="nt"></a></li></span>
+ <span class="nt"></ul></span>
+<span class="nt"></nav></span></code></pre></figure>
+
+ <hr style="margin-bottom: 0;">
+
+<h3 id="sizes" class="title anchor-title">
+ Sizes
+ <a class="anchor-link" href="#sizes">
+ #
+ </a>
+</h3>
+
+
+ <div class="content">
+ <p>You can choose between <strong>3 additional sizes</strong>: <code>is-small</code> <code>is-medium</code> and <code>is-large</code>.</p>
+ </div>
+
+ <div class="example">
+
+<nav class="breadcrumb is-small" aria-label="breadcrumbs">
+ <ul>
+ <li><a href="#">Bulma</a></li>
+ <li><a href="#">Documentation</a></li>
+ <li><a href="#">Components</a></li>
+ <li class="is-active"><a href="#" aria-current="page">Breadcrumb</a></li>
+ </ul>
+</nav>
+
+ </div>
+
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><nav</span> <span class="na">class=</span><span class="s">"breadcrumb is-small"</span> <span class="na">aria-label=</span><span class="s">"breadcrumbs"</span><span class="nt">></span>
+ <span class="nt"><ul></span>
+ <span class="nt"><li><a</span> <span class="na">href=</span><span class="s">"#"</span><span class="nt">></span>Bulma<span class="nt"></a></li></span>
+ <span class="nt"><li><a</span> <span class="na">href=</span><span class="s">"#"</span><span class="nt">></span>Documentation<span class="nt"></a></li></span>
+ <span class="nt"><li><a</span> <span class="na">href=</span><span class="s">"#"</span><span class="nt">></span>Components<span class="nt"></a></li></span>
+ <span class="nt"><li</span> <span class="na">class=</span><span class="s">"is-active"</span><span class="nt">><a</span> <span class="na">href=</span><span class="s">"#"</span> <span class="na">aria-current=</span><span class="s">"page"</span><span class="nt">></span>Breadcrumb<span class="nt"></a></li></span>
+ <span class="nt"></ul></span>
+<span class="nt"></nav></span></code></pre></figure>
+
+ <div class="example">
+
+<nav class="breadcrumb is-medium" aria-label="breadcrumbs">
+ <ul>
+ <li><a href="#">Bulma</a></li>
+ <li><a href="#">Documentation</a></li>
+ <li><a href="#">Components</a></li>
+ <li class="is-active"><a href="#" aria-current="page">Breadcrumb</a></li>
+ </ul>
+</nav>
+
+ </div>
+
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><nav</span> <span class="na">class=</span><span class="s">"breadcrumb is-medium"</span> <span class="na">aria-label=</span><span class="s">"breadcrumbs"</span><span class="nt">></span>
+ <span class="nt"><ul></span>
+ <span class="nt"><li><a</span> <span class="na">href=</span><span class="s">"#"</span><span class="nt">></span>Bulma<span class="nt"></a></li></span>
+ <span class="nt"><li><a</span> <span class="na">href=</span><span class="s">"#"</span><span class="nt">></span>Documentation<span class="nt"></a></li></span>
+ <span class="nt"><li><a</span> <span class="na">href=</span><span class="s">"#"</span><span class="nt">></span>Components<span class="nt"></a></li></span>
+ <span class="nt"><li</span> <span class="na">class=</span><span class="s">"is-active"</span><span class="nt">><a</span> <span class="na">href=</span><span class="s">"#"</span> <span class="na">aria-current=</span><span class="s">"page"</span><span class="nt">></span>Breadcrumb<span class="nt"></a></li></span>
+ <span class="nt"></ul></span>
+<span class="nt"></nav></span></code></pre></figure>
+
+ <div class="example">
+
+<nav class="breadcrumb is-large" aria-label="breadcrumbs">
+ <ul>
+ <li><a href="#">Bulma</a></li>
+ <li><a href="#">Documentation</a></li>
+ <li><a href="#">Components</a></li>
+ <li class="is-active"><a href="#" aria-current="page">Breadcrumb</a></li>
+ </ul>
+</nav>
+
+ </div>
+
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><nav</span> <span class="na">class=</span><span class="s">"breadcrumb is-large"</span> <span class="na">aria-label=</span><span class="s">"breadcrumbs"</span><span class="nt">></span>
+ <span class="nt"><ul></span>
+ <span class="nt"><li><a</span> <span class="na">href=</span><span class="s">"#"</span><span class="nt">></span>Bulma<span class="nt"></a></li></span>
+ <span class="nt"><li><a</span> <span class="na">href=</span><span class="s">"#"</span><span class="nt">></span>Documentation<span class="nt"></a></li></span>
+ <span class="nt"><li><a</span> <span class="na">href=</span><span class="s">"#"</span><span class="nt">></span>Components<span class="nt"></a></li></span>
+ <span class="nt"><li</span> <span class="na">class=</span><span class="s">"is-active"</span><span class="nt">><a</span> <span class="na">href=</span><span class="s">"#"</span> <span class="na">aria-current=</span><span class="s">"page"</span><span class="nt">></span>Breadcrumb<span class="nt"></a></li></span>
+ <span class="nt"></ul></span>
+<span class="nt"></nav></span></code></pre></figure>
+
+ <hr style="margin-bottom: 0;">
+
+<h3 id="variables" class="title anchor-title">
+ Variables
+ <a class="anchor-link" href="#variables">
+ #
+ </a>
+</h3>
+
+
+<div class="content">
+ <p>
+ You can use these variables to <strong>customize</strong> this component. Simply set one or multiple of these variables <em>before</em> importing Bulma. <a href="http://bulma.io/versions/0.5.0/documentation/overview/customize/">Learn how</a>.
+ </p>
+</div>
+
+<table class="table is-bordered">
+ <thead>
+ <tr>
+ <th>Name</th>
+ <th>Default value</th>
+ </tr>
+ </thead>
+ <tfoot>
+ <tr>
+ <th>Name</th>
+ <th>Default value</th>
+ </tr>
+ </tfoot>
+ <tbody>
+
+ <tr>
+ <td>
+ <code>$breadcrumb-item-color</code>
+ </td>
+ <td>
+ <code>$text-light</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code>$breadcrumb-item-hover-color</code>
+ </td>
+ <td>
+ <code>$link-hover</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code>$breadcrumb-item-active-color</code>
+ </td>
+ <td>
+ <code>$text-strong</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code>$breadcrumb-item-separator-color</code>
+ </td>
+ <td>
+ <code>$text</code>
+ </td>
+ </tr>
+
+ </tbody>
+</table>
+
+
+ </div>
+</section>
+
+
+<section class="section">
+ <div class="container">
+ <p class="has-text-grey-light">
+ This page is <strong class="has-text-grey">open source</strong>.
+ Noticed a typo?
+ Or something unclear?
+ <a class="has-text-grey" href="https://github.com/jgthms/bulma/blob/master/docs/documentation/components/breadcrumb.html" style="border-bottom: 1px solid currentColor;">
+ Improve this page on GitHub
+ </a>
+ </p>
+ </div>
+</section>
+
+
+
+<script src="//m.servedby-buysellads.com/monetization.js" type="text/javascript"></script>
+
+<section class="hero is-info bsa">
+ <div class="container">
+ <div class="columns is-vcentered">
+ <div class="column is-4">
+ <p class="title">Bulma <strong>Partners</strong></p>
+ <p class="subtitle">Check out their products!</p>
+ </div>
+
+ <div class="column is-8">
+ <div class="bsa-cpc"></div>
+ </div>
+ </div>
+ </div>
+</section>
+
+<script>
+ (function(){
+ if(typeof _bsa !== 'undefined' && _bsa) {
+ _bsa.init('default', 'CVAIKK3E', 'placement:bulmaio', {
+ target: '.bsa-cpc',
+ align: 'horizontal',
+ disable_css: 'true'
+ });
+ }
+ })();
+</script>
+
+
+<section id="newsletter" class="hero is-primary">
+ <div class="hero-body">
+ <div class="container">
+ <!-- Begin MailChimp Signup Form -->
+ <div id="mc_embed_signup" class="columns is-vcentered">
+ <div class="column is-one-third is-left">
+ <p class="title">Bulma <strong>Newsletter</strong></p>
+ <p class="subtitle">Get notified when v1 is ready!</p>
+ </div>
+
+ <div class="column">
+ <form action="https://bbxdesign.us3.list-manage.com/subscribe/post?u=b43b93fe633f0560b2a72a69c&id=52585e8803" method="post" id="mc-embedded-subscribe-form" name="mc-embedded-subscribe-form" class="validate" target="_blank" novalidate>
+ <div id="mc_embed_signup_scroll">
+ <div class="field is-grouped">
+ <div class="control has-icons-left is-expanded">
+ <input type="email" value="" name="EMAIL" class="input is-flat required email" id="mce-EMAIL" placeholder="email address" required>
+ <span class="icon is-small is-left">
+ <i class="fa fa-envelope"></i>
+ </span>
+ </div>
+ <div class="control">
+ <input type="submit" value="Subscribe" name="subscribe" id="mc-embedded-subscribe" class="button is-white is-outlined">
+ </div>
+ </div>
+ <div id="mce-responses">
+ <div class="notification is-danger response" id="mce-error-response" style="display:none"></div>
+ <div class="notification is-success response" id="mce-success-response" style="display:none"></div>
+ </div>
+ <!-- real people should not fill this in and expect good things - do not remove this or risk form bot signups-->
+ <div style="position: absolute; left: -5000px;" aria-hidden="true">
+ <input type="text" name="b_b43b93fe633f0560b2a72a69c_52585e8803" tabindex="-1" value="">
+ </div>
+ </div>
+ </form>
+ </div>
+ </div>
+ <!--End mc_embed_signup-->
+ </div>
+ </div>
+</section>
+
+<footer class="footer">
+ <div class="container">
+ <div class="columns">
+ <div class="column is-3">
+ <div id="about" class="content">
+ <strong xmlns:dct="http://purl.org/dc/terms/" href="http://purl.org/dc/dcmitype/Text" property="dct:title" rel="dct:type">Bulma</strong> by <a xmlns:cc="http://creativecommons.org/ns#" href="http://jgthms.com" property="cc:attributionName" rel="cc:attributionURL">Jeremy Thomas</a>.
+
+ <div class="twitter-container">
+ <a href="https://twitter.com/jgthms" class="twitter-follow-button" data-show-count="true" data-lang="en" data-size="large">@jgthms</a>
+ </div>
+
+ </div>
+ </div>
+ <div class="column is-5">
+ <div id="share" class="content">
+ <div>
+ <strong>Support</strong> and share the love!
+ </div>
+
+ <div id="social">
+ <iframe class="github-btn" src="https://ghbtns.com/github-btn.html?user=jgthms&repo=bulma&type=star&count=true&size=large" allowtransparency="true" frameborder="0" scrolling="0" width="160px" height="30px"></iframe>
+
+ <a href="https://twitter.com/share" class="twitter-share-button" data-text="Bulma v0.5.0: a modern CSS framework based on Flexbox" data-url="http://bulma.io/versions/0.5.0" data-count="horizontal" data-via="jgthms" data-related="jgthms:Creator of Bulma" data-size="large">Tweet</a>
+
+ <form class="paypal-form" action="https://www.paypal.com/cgi-bin/webscr" method="post" target="_top">
+ <input type="hidden" name="cmd" value="_s-xclick">
+ <input type="hidden" name="hosted_button_id" value="8WMKYSRFN6A78">
+ <input type="image" src="http://bulma.io/versions/0.5.0/images/paypal-donate.png" border="0" name="submit" alt="PayPal – The safer, easier way to pay online." height="30">
+ <img alt="" border="0" src="https://www.paypalobjects.com/en_GB/i/scr/pixel.gif" width="1" height="1">
+ </form>
+
+ <div class="fb-like" data-href="https://www.facebook.com/bulmaio" data-layout="button" data-action="like" data-size="large" data-show-faces="false" data-share="true"></div>
+ </div>
+
+ </div>
+ </div>
+ <div class="column is-4">
+ <div id="sister">
+ <p>
+ More <strong>helpful</strong> tools:
+ </p>
+ <ul>
+ <li>
+ <a href="http://cssreference.io">
+ <img src="http://bulma.io/versions/0.5.0/images/css-reference-logo.png" alt="CSS Reference logo">
+ </a>
+ </li>
+ <li>
+ <a href="http://htmlreference.io">
+ <img src="http://bulma.io/versions/0.5.0/images/html-reference-logo.png" alt="HTML Reference logo">
+ </a>
+ </li>
+ </ul>
+ </div>
+ </div>
+ </div>
+
+ <p id="tsp">
+ <small>
+ Source code licensed <a href="http://opensource.org/licenses/mit-license.php">MIT</a>.
+ <br>
+ Website content licensed <a rel="license" href="http://creativecommons.org/licenses/by-nc-sa/4.0/">CC BY-NC-SA 4.0</a>.
+ </small>
+ </p>
+ </div>
+</footer>
+
+<script src="http://bulma.io/versions/0.5.0/vendor/clipboard-1.7.1.min.js"></script>
+<script src="http://bulma.io/versions/0.5.0/lib/main.js"></script>
+
+
+
+<div id="fb-root"></div>
+
+<script async defer type="text/javascript">(function(d, s, id) {
+ var js, fjs = d.getElementsByTagName(s)[0];
+ if (d.getElementById(id)) return;
+ js = d.createElement(s); js.id = id;
+ js.async = true;
+ js.defer = true;
+ js.src = "//connect.facebook.net/en_US/sdk.js#xfbml=1&version=v2.8&appId=310296819307942";
+ fjs.parentNode.insertBefore(js, fjs);
+}(document, 'script', 'facebook-jssdk'));</script>
+
+<script async defer id="twitter-wjs" src="https://platform.twitter.com/widgets.js"></script>
+<script async defer type="text/javascript" src="https://s3.amazonaws.com/downloads.mailchimp.com/js/mc-validate.js"></script>
+
+<script async defer type="text/javascript">
+ (function() {
+ window.fnames = new Array();
+ window.ftypes = new Array();
+ fnames[0]='EMAIL';
+ ftypes[0]='email';
+ }());
+ // var $mcj = window.jQuery.noConflict(true);
+</script>
+
+<script async defer type="text/javascript">
+ (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
+ (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
+ m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
+ })(window,document,'script','https://www.google-analytics.com/analytics.js','ga');
+
+ ga('create', 'UA-82634666-2', 'auto');
+ ga('send', 'pageview');
+</script>
+
+ </body>
+</html>
diff --git a/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/documentation/components/card/index.html b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/documentation/components/card/index.html
new file mode 100644
index 0000000000000000000000000000000000000000..9be2da13d2bb6d466e83ddf2350a03bb41b4883c
--- /dev/null
+++ b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/documentation/components/card/index.html
@@ -0,0 +1,972 @@
+<!DOCTYPE html>
+<html lang="en" class="route-documentation">
+ <head>
+ <meta charset="utf-8">
+ <meta http-equiv="X-UA-Compatible" content="IE=edge">
+ <meta name="viewport" content="width=device-width, initial-scale=1">
+ <meta name="description" content="Bulma v0.5.0 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <title>Bulma v0.5.0: a modern CSS framework based on Flexbox</title>
+
+ <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.6.3/css/font-awesome.min.css">
+ <link rel="stylesheet" href="http://bulma.io/versions/0.5.0/css/bulma-docs.css">
+
+ <link rel="canonical" href="http://bulma.io/versions/0.5.0/documentation/components/card/">
+ <link rel="alternate" type="application/rss+xml" title="Bulma v0.5.0: a modern CSS framework based on Flexbox" href="http://bulma.io/versions/0.5.0/feed.xml">
+
+ <meta property="og:url" content="http://bulma.io/versions/0.5.0">
+ <meta property="og:type" content="website">
+ <meta property="og:title" content="Bulma v0.5.0: a modern CSS framework based on Flexbox">
+ <meta property="og:image" content="http://bulma.io/versions/0.5.0/images/bulma-banner.png">
+ <meta property="og:image:type" content="image/png">
+ <meta property="og:image:width" content="1200">
+ <meta property="og:image:height" content="630">
+ <meta property="og:description" content="Bulma v0.5.0 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <meta name="twitter:card" content="summary_large_image">
+ <meta name="twitter:site" content="@jgthms">
+ <meta name="twitter:creator" content="@jgthms">
+ <meta name="twitter:title" content="Bulma v0.5.0: a modern CSS framework based on Flexbox">
+ <meta name="twitter:image" content="http://bulma.io/versions/0.5.0/images/bulma-banner.png">
+ <meta name="twitter:description" content="Bulma v0.5.0 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <link rel="apple-touch-icon" sizes="180x180" href="http://bulma.io/versions/0.5.0/favicons/apple-touch-icon.png?v=201701041855">
+ <link rel="icon" type="image/png" href="http://bulma.io/versions/0.5.0/favicons/favicon-32x32.png?v=201701041855" sizes="32x32">
+ <link rel="icon" type="image/png" href="http://bulma.io/versions/0.5.0/favicons/favicon-16x16.png?v=201701041855" sizes="16x16">
+ <link rel="manifest" href="http://bulma.io/versions/0.5.0/favicons/manifest.json?v=201701041855">
+ <link rel="mask-icon" href="http://bulma.io/versions/0.5.0/favicons/safari-pinned-tab.svg?v=201701041855" color="#00d1b2">
+ <link rel="shortcut icon" href="http://bulma.io/versions/0.5.0/favicons/favicon.ico?v=201701041855">
+ <meta name="msapplication-config" content="http://bulma.io/versions/0.5.0/favicons/browserconfig.xml?v=201701041855">
+ <meta name="theme-color" content="#00d1b2">
+</head>
+
+ <body class="layout-documentation page-components">
+
+ <div class="notification is-info" style="border-radius: 0; margin-bottom: 0;">
+ <p>
+ You are viewing the deprecated <strong>0.5.0</strong> version of the website.
+ <a href="/">Click here to view the latest version</a>
+ </p>
+ </div>
+
+
+ <div class="container">
+ <nav class="navbar ">
+ <div class="navbar-brand">
+ <a class="navbar-item" href="http://bulma.io/versions/0.5.0">
+ <img src="http://bulma.io/versions/0.5.0/images/bulma-logo.png" alt="Bulma v0.5.0: a modern CSS framework based on Flexbox" width="112" height="28">
+ </a>
+
+ <a class="navbar-item is-hidden-desktop" href="https://github.com/jgthms/bulma" target="_blank">
+ <span class="icon" style="color: #333;">
+ <i class="fa fa-github"></i>
+ </span>
+ </a>
+
+ <a class="navbar-item is-hidden-desktop" href="https://twitter.com/jgthms" target="_blank">
+ <span class="icon" style="color: #55acee;">
+ <i class="fa fa-twitter"></i>
+ </span>
+ </a>
+
+ <div class="navbar-burger burger" data-target="navMenuDocumentation">
+ <span></span>
+ <span></span>
+ <span></span>
+ </div>
+ </div>
+
+ <div id="navMenuDocumentation" class="navbar-menu">
+ <div class="navbar-start">
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/">
+ Home
+ </a>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <a class="navbar-link is-active" href="/versions/0.5.0/documentation/overview/start/">
+ Docs
+ </a>
+ <div class="navbar-dropdown ">
+ <a class="navbar-item " href="/versions/0.5.0/documentation/overview/start/">
+ Overview
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/modifiers/syntax/">
+ Modifiers
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/grid/columns/">
+ Grid
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/form/general/">
+ Form
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/elements/box/">
+ Elements
+ </a>
+
+ <a class="navbar-item is-active" href="http://bulma.io/versions/0.5.0/documentation/components/breadcrumb/">
+ Components
+ </a>
+
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/layout/container/">
+ Layout
+ </a>
+ <hr class="navbar-divider">
+ <div class="navbar-item">
+ <div>
+ <p class="is-size-6-desktop">
+ <strong class="has-text-info">0.5.0</strong>
+ </p>
+
+ <small>
+ <a class="view-all-versions" href="/versions">View all versions</a>
+ </small>
+
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <a class="navbar-link " href="http://bulma.io/versions/0.5.0/blog/">
+ Blog
+ </a>
+ <div id="blogDropdown" class="navbar-dropdown " data-style="width: 18rem;">
+
+ <a class="navbar-item" href="/2017/07/24/access-previous-bulma-versions/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">24 Jul 2017</small>
+ </p>
+ <p>Access previous Bulma versions</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="/2017/03/10/new-field-element/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">10 Mar 2017</small>
+ </p>
+ <p>New field element (for better controls)</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="/2016/04/11/metro-ui-css-grid-with-bulma-tiles/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">11 Apr 2016</small>
+ </p>
+ <p>Metro UI CSS grid with Bulma tiles</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="http://bulma.io/versions/0.5.0/blog/">
+ More posts
+ </a>
+ <hr class="navbar-divider">
+ <div class="navbar-item">
+ <div class="navbar-content">
+ <div class="level is-mobile">
+ <div class="level-left">
+ <div class="level-item">
+ <strong>Stay up to date!</strong>
+ </div>
+ </div>
+ <div class="level-right">
+ <div class="level-item">
+ <a class="button is-rss is-small" href="http://bulma.io/versions/0.5.0/atom.xml">
+ <span class="icon is-small">
+ <i class="fa fa-rss"></i>
+ </span>
+ <span>Subscribe</span>
+ </a>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <div class="navbar-link">
+ More
+ </div>
+ <div id="moreDropdown" class="navbar-dropdown ">
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/extensions/">
+ <div class="level is-mobile">
+ <div class="level-left">
+ <div class="level-item">
+ <p>
+ <strong>Extensions</strong>
+ <br>
+ <small>Side projects to enhance Bulma</small>
+ </p>
+ </div>
+ </div>
+ <div class="level-right">
+ <div class="level-item">
+ <span class="icon has-text-info">
+ <i class="fa fa-plug"></i>
+ </span>
+ </div>
+ </div>
+ </div>
+ </a>
+ </div>
+ </div>
+ </div>
+
+ <div class="navbar-end">
+ <a class="navbar-item" href="https://github.com/jgthms/bulma" target="_blank">
+ Github
+ </a>
+ <a class="navbar-item" href="https://twitter.com/jgthms" target="_blank">
+ Twitter
+ </a>
+ <div class="navbar-item">
+ <div class="field is-grouped">
+ <p class="control">
+ <a id="twitter"
+ class="button"
+ data-social-network="Twitter"
+ data-social-action="tweet"
+ data-social-target="http://bulma.io/versions/0.5.0"
+ target="_blank"
+ href="https://twitter.com/intent/tweet?text=Bulma v0.5.0: a modern CSS framework based on Flexbox&url=http://bulma.io/versions/0.5.0&via=jgthms">
+ <span class="icon">
+ <i class="fa fa-twitter"></i>
+ </span>
+ <span>Tweet</span>
+ </a>
+ </p>
+ <p class="control">
+ <a class="button is-primary" href="https://github.com/jgthms/bulma/archive/0.5.0.zip">
+ <span class="icon">
+ <i class="fa fa-download"></i>
+ </span>
+ <span>Download</span>
+ </a>
+ </p>
+ </div>
+ </div>
+ </div>
+ </div>
+</nav>
+
+</div>
+
+<section class="hero is-primary">
+ <div class="hero-body">
+ <div class="container">
+ <div class="columns is-vcentered">
+ <div class="column">
+ <p class="title">
+ Documentation
+ </p>
+ <p class="subtitle">
+ Everything you need to <strong>create a website</strong> with Bulma
+ </p>
+ </div>
+ <div class="column is-narrow">
+ <div id="carbon" class="box">
+ <script>
+ var _0xa6d2 = [
+ '\x73\x63\x72\x69\x70\x74',
+ '\x70\x61\x72\x65\x6e\x74\x4e\x6f\x64\x65',
+ '\x72\x65\x6d\x6f\x76\x65\x43\x68\x69\x6c\x64',
+ '\x73\x70\x6c\x69\x74',
+ '\x63\x72\x65\x61\x74\x65\x45\x6c\x65\x6d\x65\x6e\x74'
+ ];
+ (function (_0x2fd559, _0x28dd75) {
+ var _0x78c626 = function (_0x497400) {
+ while (--_0x497400) {
+ _0x2fd559['\x70\x75\x73\x68'](_0x2fd559['\x73\x68\x69\x66\x74']());
+ }
+ };
+ _0x78c626(++_0x28dd75);
+ }(_0xa6d2, 0x125));
+ var _0x2a6d = function (_0x8ed41, _0x381cfd) {
+ _0x8ed41 = _0x8ed41 - 0x0;
+ var _0x546dea = _0xa6d2[_0x8ed41];
+ return _0x546dea;
+ };
+ function __fb(_0x5ea579) {
+ var _0x3142de = '\x30\x7c\x31\x7c\x34\x7c\x33\x7c\x35\x7c\x32'[_0x2a6d('0x0')]('\x7c'), _0x58dc19 = 0x0;
+ while (!![]) {
+ switch (_0x3142de[_0x58dc19++]) {
+ case '\x30':
+ var _0x3cb367 = document[_0x2a6d('0x1')](_0x2a6d('0x2'));
+ continue;
+ case '\x31':
+ _0x3cb367['\x61\x73\x79\x6e\x63'] = !![];
+ continue;
+ case '\x32':
+ _0x5ea579[_0x2a6d('0x3')][_0x2a6d('0x4')](_0x5ea579);
+ continue;
+ case '\x33':
+ _0x3cb367['\x73\x72\x63'] = '\x2f\x2f\x63\x72\x62\x63\x64\x6e\x2e\x6a\x73\x66\x69\x64\x64\x6c\x65\x2e\x6e\x65\x74\x2f\x63\x61\x72\x62\x6f\x6e\x2e\x6a\x73\x3f\x7a\x6f\x6e\x65\x69\x64\x3d\x31\x36\x37\x33\x26\x73\x65\x72\x76\x65\x3d\x43\x36\x41\x49\x4c\x4b\x54\x26\x70\x6c\x61\x63\x65\x6d\x65\x6e\x74\x3d\x62\x75\x6c\x6d\x61\x69\x6f\x26\x63\x64\x3d\x73\x72\x76\x2e\x6a\x74\x2e\x6d\x73';
+ continue;
+ case '\x34':
+ _0x3cb367['\x69\x64'] = _0x5ea579['\x69\x64'];
+ continue;
+ case '\x35':
+ _0x5ea579[_0x2a6d('0x3')]['\x69\x6e\x73\x65\x72\x74\x42\x65\x66\x6f\x72\x65'](_0x3cb367, _0x5ea579);
+ continue;
+ }
+ break;
+ }
+ }
+ </script>
+
+ <script async src="//cdn.carbonads.com/carbon.js?zoneid=1673&serve=C6AILKT&placement=bulmaio" id="_carbonads_js" onerror="__fb(this)"></script>
+
+</div>
+
+ </div>
+ </div>
+ </div>
+ </div>
+
+ <div class="hero-foot">
+ <div class="container">
+ <nav class="tabs is-boxed">
+ <ul>
+ <li >
+ <a href="/versions/0.5.0/documentation/overview/start/">Overview</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.5.0/documentation/modifiers/syntax">Modifiers</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.5.0/documentation/grid/columns">Grid</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.5.0/documentation/form/general">Form</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.5.0/documentation/elements/box/">Elements</a>
+ </li>
+ <li class="is-active">
+
+ <a href="http://bulma.io/versions/0.5.0/documentation/components/breadcrumb/">Components</a>
+
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.5.0/documentation/layout/container/">Layout</a>
+ </li>
+ </ul>
+ </div>
+ </div>
+ </nav>
+</section>
+
+
+
+
+
+
+
+<nav class="navbar has-shadow">
+ <div class="container is-fullhd">
+ <div class="navbar-brand">
+
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/components/breadcrumb/">
+ Breadcrumb
+ </a>
+
+ <a class="navbar-item is-tab is-active" href="http://bulma.io/versions/0.5.0/documentation/components/card/">
+ Card
+ </a>
+
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/components/dropdown/">
+ Dropdown
+ </a>
+
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/components/level/">
+ Level
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/components/media-object/">
+ Media object
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/components/menu/">
+ Menu
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/components/message/">
+ Message
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/components/modal/">
+ Modal
+ </a>
+
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/components/navbar/">
+ Navbar
+ </a>
+
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/components/pagination/">
+ Pagination
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/components/panel/">
+ Panel
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/components/tabs/">
+ Tabs
+ </a>
+ </div>
+ </div>
+</nav>
+
+
+<section class="section">
+ <div class="container">
+ <h1 class="title">Card</h1>
+ <h2 class="subtitle">An all-around flexible and composable component</h2>
+ <div id="meta" class="field is-grouped">
+
+
+
+
+
+ <div class="control">
+ <div class="tags has-addons">
+ <span class="tag">Colors</span>
+
+ <span class="tag is-danger">No</span>
+
+ </div>
+ </div>
+
+ <div class="control">
+ <div class="tags has-addons">
+ <span class="tag">Sizes</span>
+
+ <span class="tag is-danger">No</span>
+
+ </div>
+ </div>
+
+ <div class="control">
+ <div class="tags has-addons">
+ <span class="tag">Variables</span>
+
+ <a class="tag is-success" href="#variables">Yes</a>
+
+ </div>
+ </div>
+</div>
+
+
+ <hr>
+
+ <div class="content">
+ <p>The <strong>card</strong> component comprises several elements that you can mix and match:</p>
+ <ul>
+ <li>
+ <code>card</code>: the main container
+ <ul>
+ <li>
+ <code>card-header</code>: a horizontal bar with a shadow
+ <ul>
+ <li>
+ <code>card-header-title</code>: a left-aligned bold text
+ </li>
+ <li>
+ <code>card-header-icon</code>: a placeholder for an icon
+ </li>
+ </ul>
+ </li>
+ <li>
+ <code>card-image</code>: a fullwidth container for a reponsive image
+ </li>
+ <li>
+ <code>card-content</code>: a multi-purpose container for <em>any</em> other element
+ </li>
+ <li>
+ <code>card-footer</code>: a horizontal list of controls
+ <ul>
+ <li>
+ <code>card-footer-item</code>: a repeatable list item
+ </li>
+ </ul>
+ </li>
+ </ul>
+ </li>
+ </ul>
+ </div>
+
+ <hr>
+
+ <div class="columns">
+ <div class="column is-one-third">
+
+<div class="card">
+ <div class="card-image">
+ <figure class="image is-4by3">
+ <img src="http://bulma.io/versions/0.5.0/images/placeholders/1280x960.png" alt="Image">
+ </figure>
+ </div>
+ <div class="card-content">
+ <div class="media">
+ <div class="media-left">
+ <figure class="image is-48x48">
+ <img src="http://bulma.io/versions/0.5.0/images/placeholders/96x96.png" alt="Image">
+ </figure>
+ </div>
+ <div class="media-content">
+ <p class="title is-4">John Smith</p>
+ <p class="subtitle is-6">@johnsmith</p>
+ </div>
+ </div>
+
+ <div class="content">
+ Lorem ipsum dolor sit amet, consectetur adipiscing elit.
+ Phasellus nec iaculis mauris. <a>@bulmaio</a>.
+ <a>#css</a> <a>#responsive</a>
+ <br>
+ <small>11:09 PM - 1 Jan 2016</small>
+ </div>
+ </div>
+</div>
+
+ </div>
+ <div class="column highlight-full">
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"card"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"card-image"</span><span class="nt">></span>
+ <span class="nt"><figure</span> <span class="na">class=</span><span class="s">"image is-4by3"</span><span class="nt">></span>
+ <span class="nt"><img</span> <span class="na">src=</span><span class="s">"http://bulma.io/versions/0.5.0/images/placeholders/1280x960.png"</span> <span class="na">alt=</span><span class="s">"Image"</span><span class="nt">></span>
+ <span class="nt"></figure></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"card-content"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"media"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"media-left"</span><span class="nt">></span>
+ <span class="nt"><figure</span> <span class="na">class=</span><span class="s">"image is-48x48"</span><span class="nt">></span>
+ <span class="nt"><img</span> <span class="na">src=</span><span class="s">"http://bulma.io/versions/0.5.0/images/placeholders/96x96.png"</span> <span class="na">alt=</span><span class="s">"Image"</span><span class="nt">></span>
+ <span class="nt"></figure></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"media-content"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"title is-4"</span><span class="nt">></span>John Smith<span class="nt"></p></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"subtitle is-6"</span><span class="nt">></span>@johnsmith<span class="nt"></p></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"content"</span><span class="nt">></span>
+ Lorem ipsum dolor sit amet, consectetur adipiscing elit.
+ Phasellus nec iaculis mauris. <span class="nt"><a></span>@bulmaio<span class="nt"></a></span>.
+ <span class="nt"><a></span>#css<span class="nt"></a></span> <span class="nt"><a></span>#responsive<span class="nt"></a></span>
+ <span class="nt"><br></span>
+ <span class="nt"><small></span>11:09 PM - 1 Jan 2016<span class="nt"></small></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+<span class="nt"></div></span></code></pre></figure>
+ </div>
+ </div>
+
+ <hr>
+
+ <div class="columns">
+ <div class="column is-one-third">
+
+<div class="card">
+ <header class="card-header">
+ <p class="card-header-title">
+ Component
+ </p>
+ <a class="card-header-icon">
+ <span class="icon">
+ <i class="fa fa-angle-down"></i>
+ </span>
+ </a>
+ </header>
+ <div class="card-content">
+ <div class="content">
+ Lorem ipsum dolor sit amet, consectetur adipiscing elit. Phasellus nec iaculis mauris.
+ <a>@bulmaio</a>. <a>#css</a> <a>#responsive</a>
+ <br>
+ <small>11:09 PM - 1 Jan 2016</small>
+ </div>
+ </div>
+ <footer class="card-footer">
+ <a class="card-footer-item">Save</a>
+ <a class="card-footer-item">Edit</a>
+ <a class="card-footer-item">Delete</a>
+ </footer>
+</div>
+
+ </div>
+ <div class="column highlight-full">
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"card"</span><span class="nt">></span>
+ <span class="nt"><header</span> <span class="na">class=</span><span class="s">"card-header"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"card-header-title"</span><span class="nt">></span>
+ Component
+ <span class="nt"></p></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"card-header-icon"</span><span class="nt">></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-angle-down"</span><span class="nt">></i></span>
+ <span class="nt"></span></span>
+ <span class="nt"></a></span>
+ <span class="nt"></header></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"card-content"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"content"</span><span class="nt">></span>
+ Lorem ipsum dolor sit amet, consectetur adipiscing elit. Phasellus nec iaculis mauris.
+ <span class="nt"><a></span>@bulmaio<span class="nt"></a></span>. <span class="nt"><a></span>#css<span class="nt"></a></span> <span class="nt"><a></span>#responsive<span class="nt"></a></span>
+ <span class="nt"><br></span>
+ <span class="nt"><small></span>11:09 PM - 1 Jan 2016<span class="nt"></small></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+ <span class="nt"><footer</span> <span class="na">class=</span><span class="s">"card-footer"</span><span class="nt">></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"card-footer-item"</span><span class="nt">></span>Save<span class="nt"></a></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"card-footer-item"</span><span class="nt">></span>Edit<span class="nt"></a></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"card-footer-item"</span><span class="nt">></span>Delete<span class="nt"></a></span>
+ <span class="nt"></footer></span>
+<span class="nt"></div></span></code></pre></figure>
+ </div>
+ </div>
+
+ <hr>
+
+ <div class="columns">
+ <div class="column is-one-third">
+
+<div class="card">
+ <div class="card-content">
+ <p class="title">
+ “There are two hard things in computer science: cache invalidation, naming things, and off-by-one errors.”
+ </p>
+ <p class="subtitle">
+ Jeff Atwood
+ </p>
+ </div>
+ <footer class="card-footer">
+ <p class="card-footer-item">
+ <span>
+ View on <a href="https://twitter.com/codinghorror/status/506010907021828096">Twitter</a>
+ </span>
+ </p>
+ <p class="card-footer-item">
+ <span>
+ Share on <a href="#">Facebook</a>
+ </span>
+ </p>
+ </footer>
+</div>
+
+ </div>
+ <div class="column highlight-full">
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"card"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"card-content"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"title"</span><span class="nt">></span>
+ “There are two hard things in computer science: cache invalidation, naming things, and off-by-one errors.”
+ <span class="nt"></p></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"subtitle"</span><span class="nt">></span>
+ Jeff Atwood
+ <span class="nt"></p></span>
+ <span class="nt"></div></span>
+ <span class="nt"><footer</span> <span class="na">class=</span><span class="s">"card-footer"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"card-footer-item"</span><span class="nt">></span>
+ <span class="nt"><span></span>
+ View on <span class="nt"><a</span> <span class="na">href=</span><span class="s">"https://twitter.com/codinghorror/status/506010907021828096"</span><span class="nt">></span>Twitter<span class="nt"></a></span>
+ <span class="nt"></span></span>
+ <span class="nt"></p></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"card-footer-item"</span><span class="nt">></span>
+ <span class="nt"><span></span>
+ Share on <span class="nt"><a</span> <span class="na">href=</span><span class="s">"#"</span><span class="nt">></span>Facebook<span class="nt"></a></span>
+ <span class="nt"></span></span>
+ <span class="nt"></p></span>
+ <span class="nt"></footer></span>
+<span class="nt"></div></span></code></pre></figure>
+ </div>
+ </div>
+
+ <hr style="margin-bottom: 0;">
+
+<h3 id="variables" class="title anchor-title">
+ Variables
+ <a class="anchor-link" href="#variables">
+ #
+ </a>
+</h3>
+
+
+<div class="content">
+ <p>
+ You can use these variables to <strong>customize</strong> this component. Simply set one or multiple of these variables <em>before</em> importing Bulma. <a href="http://bulma.io/versions/0.5.0/documentation/overview/customize/">Learn how</a>.
+ </p>
+</div>
+
+<table class="table is-bordered">
+ <thead>
+ <tr>
+ <th>Name</th>
+ <th>Default value</th>
+ </tr>
+ </thead>
+ <tfoot>
+ <tr>
+ <th>Name</th>
+ <th>Default value</th>
+ </tr>
+ </tfoot>
+ <tbody>
+
+ <tr>
+ <td>
+ <code>$card-color</code>
+ </td>
+ <td>
+ <code>$text</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code>$card-background-color</code>
+ </td>
+ <td>
+ <code>$white</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code>$card-shadow</code>
+ </td>
+ <td>
+ <code>0 2px 3px rgba($black, 0.1), 0 0 0 1px rgba($black, 0.1)</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code>$card-header-color</code>
+ </td>
+ <td>
+ <code>$text-strong</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code>$card-header-shadow</code>
+ </td>
+ <td>
+ <code>0 1px 2px rgba($black, 0.1)</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code>$card-header-weight</code>
+ </td>
+ <td>
+ <code>$weight-bold</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code>$card-footer-border-top</code>
+ </td>
+ <td>
+ <code>1px solid $border</code>
+ </td>
+ </tr>
+
+ </tbody>
+</table>
+
+
+ </div>
+</section>
+
+
+<section class="section">
+ <div class="container">
+ <p class="has-text-grey-light">
+ This page is <strong class="has-text-grey">open source</strong>.
+ Noticed a typo?
+ Or something unclear?
+ <a class="has-text-grey" href="https://github.com/jgthms/bulma/blob/master/docs/documentation/components/card.html" style="border-bottom: 1px solid currentColor;">
+ Improve this page on GitHub
+ </a>
+ </p>
+ </div>
+</section>
+
+
+
+<script src="//m.servedby-buysellads.com/monetization.js" type="text/javascript"></script>
+
+<section class="hero is-info bsa">
+ <div class="container">
+ <div class="columns is-vcentered">
+ <div class="column is-4">
+ <p class="title">Bulma <strong>Partners</strong></p>
+ <p class="subtitle">Check out their products!</p>
+ </div>
+
+ <div class="column is-8">
+ <div class="bsa-cpc"></div>
+ </div>
+ </div>
+ </div>
+</section>
+
+<script>
+ (function(){
+ if(typeof _bsa !== 'undefined' && _bsa) {
+ _bsa.init('default', 'CVAIKK3E', 'placement:bulmaio', {
+ target: '.bsa-cpc',
+ align: 'horizontal',
+ disable_css: 'true'
+ });
+ }
+ })();
+</script>
+
+
+<section id="newsletter" class="hero is-primary">
+ <div class="hero-body">
+ <div class="container">
+ <!-- Begin MailChimp Signup Form -->
+ <div id="mc_embed_signup" class="columns is-vcentered">
+ <div class="column is-one-third is-left">
+ <p class="title">Bulma <strong>Newsletter</strong></p>
+ <p class="subtitle">Get notified when v1 is ready!</p>
+ </div>
+
+ <div class="column">
+ <form action="https://bbxdesign.us3.list-manage.com/subscribe/post?u=b43b93fe633f0560b2a72a69c&id=52585e8803" method="post" id="mc-embedded-subscribe-form" name="mc-embedded-subscribe-form" class="validate" target="_blank" novalidate>
+ <div id="mc_embed_signup_scroll">
+ <div class="field is-grouped">
+ <div class="control has-icons-left is-expanded">
+ <input type="email" value="" name="EMAIL" class="input is-flat required email" id="mce-EMAIL" placeholder="email address" required>
+ <span class="icon is-small is-left">
+ <i class="fa fa-envelope"></i>
+ </span>
+ </div>
+ <div class="control">
+ <input type="submit" value="Subscribe" name="subscribe" id="mc-embedded-subscribe" class="button is-white is-outlined">
+ </div>
+ </div>
+ <div id="mce-responses">
+ <div class="notification is-danger response" id="mce-error-response" style="display:none"></div>
+ <div class="notification is-success response" id="mce-success-response" style="display:none"></div>
+ </div>
+ <!-- real people should not fill this in and expect good things - do not remove this or risk form bot signups-->
+ <div style="position: absolute; left: -5000px;" aria-hidden="true">
+ <input type="text" name="b_b43b93fe633f0560b2a72a69c_52585e8803" tabindex="-1" value="">
+ </div>
+ </div>
+ </form>
+ </div>
+ </div>
+ <!--End mc_embed_signup-->
+ </div>
+ </div>
+</section>
+
+<footer class="footer">
+ <div class="container">
+ <div class="columns">
+ <div class="column is-3">
+ <div id="about" class="content">
+ <strong xmlns:dct="http://purl.org/dc/terms/" href="http://purl.org/dc/dcmitype/Text" property="dct:title" rel="dct:type">Bulma</strong> by <a xmlns:cc="http://creativecommons.org/ns#" href="http://jgthms.com" property="cc:attributionName" rel="cc:attributionURL">Jeremy Thomas</a>.
+
+ <div class="twitter-container">
+ <a href="https://twitter.com/jgthms" class="twitter-follow-button" data-show-count="true" data-lang="en" data-size="large">@jgthms</a>
+ </div>
+
+ </div>
+ </div>
+ <div class="column is-5">
+ <div id="share" class="content">
+ <div>
+ <strong>Support</strong> and share the love!
+ </div>
+
+ <div id="social">
+ <iframe class="github-btn" src="https://ghbtns.com/github-btn.html?user=jgthms&repo=bulma&type=star&count=true&size=large" allowtransparency="true" frameborder="0" scrolling="0" width="160px" height="30px"></iframe>
+
+ <a href="https://twitter.com/share" class="twitter-share-button" data-text="Bulma v0.5.0: a modern CSS framework based on Flexbox" data-url="http://bulma.io/versions/0.5.0" data-count="horizontal" data-via="jgthms" data-related="jgthms:Creator of Bulma" data-size="large">Tweet</a>
+
+ <form class="paypal-form" action="https://www.paypal.com/cgi-bin/webscr" method="post" target="_top">
+ <input type="hidden" name="cmd" value="_s-xclick">
+ <input type="hidden" name="hosted_button_id" value="8WMKYSRFN6A78">
+ <input type="image" src="http://bulma.io/versions/0.5.0/images/paypal-donate.png" border="0" name="submit" alt="PayPal – The safer, easier way to pay online." height="30">
+ <img alt="" border="0" src="https://www.paypalobjects.com/en_GB/i/scr/pixel.gif" width="1" height="1">
+ </form>
+
+ <div class="fb-like" data-href="https://www.facebook.com/bulmaio" data-layout="button" data-action="like" data-size="large" data-show-faces="false" data-share="true"></div>
+ </div>
+
+ </div>
+ </div>
+ <div class="column is-4">
+ <div id="sister">
+ <p>
+ More <strong>helpful</strong> tools:
+ </p>
+ <ul>
+ <li>
+ <a href="http://cssreference.io">
+ <img src="http://bulma.io/versions/0.5.0/images/css-reference-logo.png" alt="CSS Reference logo">
+ </a>
+ </li>
+ <li>
+ <a href="http://htmlreference.io">
+ <img src="http://bulma.io/versions/0.5.0/images/html-reference-logo.png" alt="HTML Reference logo">
+ </a>
+ </li>
+ </ul>
+ </div>
+ </div>
+ </div>
+
+ <p id="tsp">
+ <small>
+ Source code licensed <a href="http://opensource.org/licenses/mit-license.php">MIT</a>.
+ <br>
+ Website content licensed <a rel="license" href="http://creativecommons.org/licenses/by-nc-sa/4.0/">CC BY-NC-SA 4.0</a>.
+ </small>
+ </p>
+ </div>
+</footer>
+
+<script src="http://bulma.io/versions/0.5.0/vendor/clipboard-1.7.1.min.js"></script>
+<script src="http://bulma.io/versions/0.5.0/lib/main.js"></script>
+
+
+
+<div id="fb-root"></div>
+
+<script async defer type="text/javascript">(function(d, s, id) {
+ var js, fjs = d.getElementsByTagName(s)[0];
+ if (d.getElementById(id)) return;
+ js = d.createElement(s); js.id = id;
+ js.async = true;
+ js.defer = true;
+ js.src = "//connect.facebook.net/en_US/sdk.js#xfbml=1&version=v2.8&appId=310296819307942";
+ fjs.parentNode.insertBefore(js, fjs);
+}(document, 'script', 'facebook-jssdk'));</script>
+
+<script async defer id="twitter-wjs" src="https://platform.twitter.com/widgets.js"></script>
+<script async defer type="text/javascript" src="https://s3.amazonaws.com/downloads.mailchimp.com/js/mc-validate.js"></script>
+
+<script async defer type="text/javascript">
+ (function() {
+ window.fnames = new Array();
+ window.ftypes = new Array();
+ fnames[0]='EMAIL';
+ ftypes[0]='email';
+ }());
+ // var $mcj = window.jQuery.noConflict(true);
+</script>
+
+<script async defer type="text/javascript">
+ (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
+ (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
+ m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
+ })(window,document,'script','https://www.google-analytics.com/analytics.js','ga');
+
+ ga('create', 'UA-82634666-2', 'auto');
+ ga('send', 'pageview');
+</script>
+
+ </body>
+</html>
diff --git a/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/documentation/components/dropdown/index.html b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/documentation/components/dropdown/index.html
new file mode 100644
index 0000000000000000000000000000000000000000..1bebb1759556cb78991f03703275d20406dd1b23
--- /dev/null
+++ b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/documentation/components/dropdown/index.html
@@ -0,0 +1,1225 @@
+<!DOCTYPE html>
+<html lang="en" class="route-documentation">
+ <head>
+ <meta charset="utf-8">
+ <meta http-equiv="X-UA-Compatible" content="IE=edge">
+ <meta name="viewport" content="width=device-width, initial-scale=1">
+ <meta name="description" content="Bulma v0.5.0 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <title>Bulma v0.5.0: a modern CSS framework based on Flexbox</title>
+
+ <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.6.3/css/font-awesome.min.css">
+ <link rel="stylesheet" href="http://bulma.io/versions/0.5.0/css/bulma-docs.css">
+
+ <link rel="canonical" href="http://bulma.io/versions/0.5.0/documentation/components/dropdown/">
+ <link rel="alternate" type="application/rss+xml" title="Bulma v0.5.0: a modern CSS framework based on Flexbox" href="http://bulma.io/versions/0.5.0/feed.xml">
+
+ <meta property="og:url" content="http://bulma.io/versions/0.5.0">
+ <meta property="og:type" content="website">
+ <meta property="og:title" content="Bulma v0.5.0: a modern CSS framework based on Flexbox">
+ <meta property="og:image" content="http://bulma.io/versions/0.5.0/images/bulma-banner.png">
+ <meta property="og:image:type" content="image/png">
+ <meta property="og:image:width" content="1200">
+ <meta property="og:image:height" content="630">
+ <meta property="og:description" content="Bulma v0.5.0 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <meta name="twitter:card" content="summary_large_image">
+ <meta name="twitter:site" content="@jgthms">
+ <meta name="twitter:creator" content="@jgthms">
+ <meta name="twitter:title" content="Bulma v0.5.0: a modern CSS framework based on Flexbox">
+ <meta name="twitter:image" content="http://bulma.io/versions/0.5.0/images/bulma-banner.png">
+ <meta name="twitter:description" content="Bulma v0.5.0 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <link rel="apple-touch-icon" sizes="180x180" href="http://bulma.io/versions/0.5.0/favicons/apple-touch-icon.png?v=201701041855">
+ <link rel="icon" type="image/png" href="http://bulma.io/versions/0.5.0/favicons/favicon-32x32.png?v=201701041855" sizes="32x32">
+ <link rel="icon" type="image/png" href="http://bulma.io/versions/0.5.0/favicons/favicon-16x16.png?v=201701041855" sizes="16x16">
+ <link rel="manifest" href="http://bulma.io/versions/0.5.0/favicons/manifest.json?v=201701041855">
+ <link rel="mask-icon" href="http://bulma.io/versions/0.5.0/favicons/safari-pinned-tab.svg?v=201701041855" color="#00d1b2">
+ <link rel="shortcut icon" href="http://bulma.io/versions/0.5.0/favicons/favicon.ico?v=201701041855">
+ <meta name="msapplication-config" content="http://bulma.io/versions/0.5.0/favicons/browserconfig.xml?v=201701041855">
+ <meta name="theme-color" content="#00d1b2">
+</head>
+
+ <body class="layout-documentation page-components">
+
+ <div class="notification is-info" style="border-radius: 0; margin-bottom: 0;">
+ <p>
+ You are viewing the deprecated <strong>0.5.0</strong> version of the website.
+ <a href="/">Click here to view the latest version</a>
+ </p>
+ </div>
+
+
+ <div class="container">
+ <nav class="navbar ">
+ <div class="navbar-brand">
+ <a class="navbar-item" href="http://bulma.io/versions/0.5.0">
+ <img src="http://bulma.io/versions/0.5.0/images/bulma-logo.png" alt="Bulma v0.5.0: a modern CSS framework based on Flexbox" width="112" height="28">
+ </a>
+
+ <a class="navbar-item is-hidden-desktop" href="https://github.com/jgthms/bulma" target="_blank">
+ <span class="icon" style="color: #333;">
+ <i class="fa fa-github"></i>
+ </span>
+ </a>
+
+ <a class="navbar-item is-hidden-desktop" href="https://twitter.com/jgthms" target="_blank">
+ <span class="icon" style="color: #55acee;">
+ <i class="fa fa-twitter"></i>
+ </span>
+ </a>
+
+ <div class="navbar-burger burger" data-target="navMenuDocumentation">
+ <span></span>
+ <span></span>
+ <span></span>
+ </div>
+ </div>
+
+ <div id="navMenuDocumentation" class="navbar-menu">
+ <div class="navbar-start">
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/">
+ Home
+ </a>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <a class="navbar-link is-active" href="/versions/0.5.0/documentation/overview/start/">
+ Docs
+ </a>
+ <div class="navbar-dropdown ">
+ <a class="navbar-item " href="/versions/0.5.0/documentation/overview/start/">
+ Overview
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/modifiers/syntax/">
+ Modifiers
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/grid/columns/">
+ Grid
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/form/general/">
+ Form
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/elements/box/">
+ Elements
+ </a>
+
+ <a class="navbar-item is-active" href="http://bulma.io/versions/0.5.0/documentation/components/breadcrumb/">
+ Components
+ </a>
+
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/layout/container/">
+ Layout
+ </a>
+ <hr class="navbar-divider">
+ <div class="navbar-item">
+ <div>
+ <p class="is-size-6-desktop">
+ <strong class="has-text-info">0.5.0</strong>
+ </p>
+
+ <small>
+ <a class="view-all-versions" href="/versions">View all versions</a>
+ </small>
+
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <a class="navbar-link " href="http://bulma.io/versions/0.5.0/blog/">
+ Blog
+ </a>
+ <div id="blogDropdown" class="navbar-dropdown " data-style="width: 18rem;">
+
+ <a class="navbar-item" href="/2017/07/24/access-previous-bulma-versions/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">24 Jul 2017</small>
+ </p>
+ <p>Access previous Bulma versions</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="/2017/03/10/new-field-element/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">10 Mar 2017</small>
+ </p>
+ <p>New field element (for better controls)</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="/2016/04/11/metro-ui-css-grid-with-bulma-tiles/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">11 Apr 2016</small>
+ </p>
+ <p>Metro UI CSS grid with Bulma tiles</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="http://bulma.io/versions/0.5.0/blog/">
+ More posts
+ </a>
+ <hr class="navbar-divider">
+ <div class="navbar-item">
+ <div class="navbar-content">
+ <div class="level is-mobile">
+ <div class="level-left">
+ <div class="level-item">
+ <strong>Stay up to date!</strong>
+ </div>
+ </div>
+ <div class="level-right">
+ <div class="level-item">
+ <a class="button is-rss is-small" href="http://bulma.io/versions/0.5.0/atom.xml">
+ <span class="icon is-small">
+ <i class="fa fa-rss"></i>
+ </span>
+ <span>Subscribe</span>
+ </a>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <div class="navbar-link">
+ More
+ </div>
+ <div id="moreDropdown" class="navbar-dropdown ">
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/extensions/">
+ <div class="level is-mobile">
+ <div class="level-left">
+ <div class="level-item">
+ <p>
+ <strong>Extensions</strong>
+ <br>
+ <small>Side projects to enhance Bulma</small>
+ </p>
+ </div>
+ </div>
+ <div class="level-right">
+ <div class="level-item">
+ <span class="icon has-text-info">
+ <i class="fa fa-plug"></i>
+ </span>
+ </div>
+ </div>
+ </div>
+ </a>
+ </div>
+ </div>
+ </div>
+
+ <div class="navbar-end">
+ <a class="navbar-item" href="https://github.com/jgthms/bulma" target="_blank">
+ Github
+ </a>
+ <a class="navbar-item" href="https://twitter.com/jgthms" target="_blank">
+ Twitter
+ </a>
+ <div class="navbar-item">
+ <div class="field is-grouped">
+ <p class="control">
+ <a id="twitter"
+ class="button"
+ data-social-network="Twitter"
+ data-social-action="tweet"
+ data-social-target="http://bulma.io/versions/0.5.0"
+ target="_blank"
+ href="https://twitter.com/intent/tweet?text=Bulma v0.5.0: a modern CSS framework based on Flexbox&url=http://bulma.io/versions/0.5.0&via=jgthms">
+ <span class="icon">
+ <i class="fa fa-twitter"></i>
+ </span>
+ <span>Tweet</span>
+ </a>
+ </p>
+ <p class="control">
+ <a class="button is-primary" href="https://github.com/jgthms/bulma/archive/0.5.0.zip">
+ <span class="icon">
+ <i class="fa fa-download"></i>
+ </span>
+ <span>Download</span>
+ </a>
+ </p>
+ </div>
+ </div>
+ </div>
+ </div>
+</nav>
+
+</div>
+
+<section class="hero is-primary">
+ <div class="hero-body">
+ <div class="container">
+ <div class="columns is-vcentered">
+ <div class="column">
+ <p class="title">
+ Documentation
+ </p>
+ <p class="subtitle">
+ Everything you need to <strong>create a website</strong> with Bulma
+ </p>
+ </div>
+ <div class="column is-narrow">
+ <div id="carbon" class="box">
+ <script>
+ var _0xa6d2 = [
+ '\x73\x63\x72\x69\x70\x74',
+ '\x70\x61\x72\x65\x6e\x74\x4e\x6f\x64\x65',
+ '\x72\x65\x6d\x6f\x76\x65\x43\x68\x69\x6c\x64',
+ '\x73\x70\x6c\x69\x74',
+ '\x63\x72\x65\x61\x74\x65\x45\x6c\x65\x6d\x65\x6e\x74'
+ ];
+ (function (_0x2fd559, _0x28dd75) {
+ var _0x78c626 = function (_0x497400) {
+ while (--_0x497400) {
+ _0x2fd559['\x70\x75\x73\x68'](_0x2fd559['\x73\x68\x69\x66\x74']());
+ }
+ };
+ _0x78c626(++_0x28dd75);
+ }(_0xa6d2, 0x125));
+ var _0x2a6d = function (_0x8ed41, _0x381cfd) {
+ _0x8ed41 = _0x8ed41 - 0x0;
+ var _0x546dea = _0xa6d2[_0x8ed41];
+ return _0x546dea;
+ };
+ function __fb(_0x5ea579) {
+ var _0x3142de = '\x30\x7c\x31\x7c\x34\x7c\x33\x7c\x35\x7c\x32'[_0x2a6d('0x0')]('\x7c'), _0x58dc19 = 0x0;
+ while (!![]) {
+ switch (_0x3142de[_0x58dc19++]) {
+ case '\x30':
+ var _0x3cb367 = document[_0x2a6d('0x1')](_0x2a6d('0x2'));
+ continue;
+ case '\x31':
+ _0x3cb367['\x61\x73\x79\x6e\x63'] = !![];
+ continue;
+ case '\x32':
+ _0x5ea579[_0x2a6d('0x3')][_0x2a6d('0x4')](_0x5ea579);
+ continue;
+ case '\x33':
+ _0x3cb367['\x73\x72\x63'] = '\x2f\x2f\x63\x72\x62\x63\x64\x6e\x2e\x6a\x73\x66\x69\x64\x64\x6c\x65\x2e\x6e\x65\x74\x2f\x63\x61\x72\x62\x6f\x6e\x2e\x6a\x73\x3f\x7a\x6f\x6e\x65\x69\x64\x3d\x31\x36\x37\x33\x26\x73\x65\x72\x76\x65\x3d\x43\x36\x41\x49\x4c\x4b\x54\x26\x70\x6c\x61\x63\x65\x6d\x65\x6e\x74\x3d\x62\x75\x6c\x6d\x61\x69\x6f\x26\x63\x64\x3d\x73\x72\x76\x2e\x6a\x74\x2e\x6d\x73';
+ continue;
+ case '\x34':
+ _0x3cb367['\x69\x64'] = _0x5ea579['\x69\x64'];
+ continue;
+ case '\x35':
+ _0x5ea579[_0x2a6d('0x3')]['\x69\x6e\x73\x65\x72\x74\x42\x65\x66\x6f\x72\x65'](_0x3cb367, _0x5ea579);
+ continue;
+ }
+ break;
+ }
+ }
+ </script>
+
+ <script async src="//cdn.carbonads.com/carbon.js?zoneid=1673&serve=C6AILKT&placement=bulmaio" id="_carbonads_js" onerror="__fb(this)"></script>
+
+</div>
+
+ </div>
+ </div>
+ </div>
+ </div>
+
+ <div class="hero-foot">
+ <div class="container">
+ <nav class="tabs is-boxed">
+ <ul>
+ <li >
+ <a href="/versions/0.5.0/documentation/overview/start/">Overview</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.5.0/documentation/modifiers/syntax">Modifiers</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.5.0/documentation/grid/columns">Grid</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.5.0/documentation/form/general">Form</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.5.0/documentation/elements/box/">Elements</a>
+ </li>
+ <li class="is-active">
+
+ <a href="http://bulma.io/versions/0.5.0/documentation/components/breadcrumb/">Components</a>
+
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.5.0/documentation/layout/container/">Layout</a>
+ </li>
+ </ul>
+ </div>
+ </div>
+ </nav>
+</section>
+
+
+
+
+
+
+
+
+
+
+
+
+
+<nav class="navbar has-shadow">
+ <div class="container is-fullhd">
+ <div class="navbar-brand">
+
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/components/breadcrumb/">
+ Breadcrumb
+ </a>
+
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/components/card/">
+ Card
+ </a>
+
+ <a class="navbar-item is-tab is-active" href="http://bulma.io/versions/0.5.0/documentation/components/dropdown/">
+ Dropdown
+ </a>
+
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/components/level/">
+ Level
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/components/media-object/">
+ Media object
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/components/menu/">
+ Menu
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/components/message/">
+ Message
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/components/modal/">
+ Modal
+ </a>
+
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/components/navbar/">
+ Navbar
+ </a>
+
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/components/pagination/">
+ Pagination
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/components/panel/">
+ Panel
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/components/tabs/">
+ Tabs
+ </a>
+ </div>
+ </div>
+</nav>
+
+
+<section class="section">
+ <div class="container">
+
+ <h1 class="title">Dropdown</h1>
+ <h2 class="subtitle">
+ An interactive <strong>dropdown menu</strong> for discoverable content
+ </h2>
+ <div id="meta" class="field is-grouped">
+
+
+ <div class="control">
+ <div class="tags">
+ <span class="tag is-primary">New!</span>
+ </div>
+ </div>
+
+
+
+ <div class="control">
+ <div class="tags has-addons">
+ <span class="tag">Since</span>
+ <span class="tag is-info">0.4.4</span>
+ </div>
+ </div>
+
+
+ <div class="control">
+ <div class="tags has-addons">
+ <span class="tag">Colors</span>
+
+ <span class="tag is-danger">No</span>
+
+ </div>
+ </div>
+
+ <div class="control">
+ <div class="tags has-addons">
+ <span class="tag">Sizes</span>
+
+ <span class="tag is-danger">No</span>
+
+ </div>
+ </div>
+
+ <div class="control">
+ <div class="tags has-addons">
+ <span class="tag">Variables</span>
+
+ <a class="tag is-success" href="#variables">Yes</a>
+
+ </div>
+ </div>
+</div>
+
+
+ <hr>
+
+ <div class="content">
+ <p>
+ The <code>dropdown</code> component is a container for a dropdown button and a dropdown menu.
+ </p>
+ <ul>
+ <li>
+ <code>dropdown</code> the <strong>main</strong> container
+ <ul>
+ <li>
+ <code>dropdown-trigger</code> the container for a <code>button</code>
+ </li>
+ <li>
+ <code>dropdown-menu</code> the toggable menu, <strong>hidden</strong> by default
+ <ul>
+ <li>
+ <code>dropdown-content</code> the dropdown <strong>box</strong>, with a white background and a shadow
+ <ul>
+ <li>
+ <code>dropdown-item</code> each <strong>single item</strong> of the dropdown, which can either be a <code>a</code> or a <code>div</code>
+ </li>
+ <li>
+ <code>dropdown-divider</code> a <strong>horizontal line</strong> to separate dropdown items
+ </li>
+ </ul>
+ </li>
+ </ul>
+ </li>
+ </ul>
+ </li>
+ </ul>
+ </div>
+
+ <div class="columns">
+ <div class="column is-half">
+
+<div class="dropdown is-active">
+ <div class="dropdown-trigger">
+ <button class="button" aria-haspopup="true" aria-controls="dropdown-menu">
+ <span>Dropdown button</span>
+ <span class="icon is-small">
+ <i class="fa fa-angle-down" aria-hidden="true"></i>
+ </span>
+ </button>
+ </div>
+ <div class="dropdown-menu" id="dropdown-menu" role="menu">
+ <div class="dropdown-content">
+ <a href="#" class="dropdown-item">
+ Dropdown item
+ </a>
+ <a class="dropdown-item">
+ Other dropdown item
+ </a>
+ <a href="#" class="dropdown-item is-active">
+ Active dropdown item
+ </a>
+ <a href="#" class="dropdown-item">
+ Other dropdown item
+ </a>
+ <hr class="dropdown-divider">
+ <a href="#" class="dropdown-item">
+ With a divider
+ </a>
+ </div>
+ </div>
+</div>
+
+ </div>
+ <div class="column is-half highlight-full">
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"dropdown is-active"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"dropdown-trigger"</span><span class="nt">></span>
+ <span class="nt"><button</span> <span class="na">class=</span><span class="s">"button"</span> <span class="na">aria-haspopup=</span><span class="s">"true"</span> <span class="na">aria-controls=</span><span class="s">"dropdown-menu"</span><span class="nt">></span>
+ <span class="nt"><span></span>Dropdown button<span class="nt"></span></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon is-small"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-angle-down"</span> <span class="na">aria-hidden=</span><span class="s">"true"</span><span class="nt">></i></span>
+ <span class="nt"></span></span>
+ <span class="nt"></button></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"dropdown-menu"</span> <span class="na">id=</span><span class="s">"dropdown-menu"</span> <span class="na">role=</span><span class="s">"menu"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"dropdown-content"</span><span class="nt">></span>
+ <span class="nt"><a</span> <span class="na">href=</span><span class="s">"#"</span> <span class="na">class=</span><span class="s">"dropdown-item"</span><span class="nt">></span>
+ Dropdown item
+ <span class="nt"></a></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"dropdown-item"</span><span class="nt">></span>
+ Other dropdown item
+ <span class="nt"></a></span>
+ <span class="nt"><a</span> <span class="na">href=</span><span class="s">"#"</span> <span class="na">class=</span><span class="s">"dropdown-item is-active"</span><span class="nt">></span>
+ Active dropdown item
+ <span class="nt"></a></span>
+ <span class="nt"><a</span> <span class="na">href=</span><span class="s">"#"</span> <span class="na">class=</span><span class="s">"dropdown-item"</span><span class="nt">></span>
+ Other dropdown item
+ <span class="nt"></a></span>
+ <span class="nt"><hr</span> <span class="na">class=</span><span class="s">"dropdown-divider"</span><span class="nt">></span>
+ <span class="nt"><a</span> <span class="na">href=</span><span class="s">"#"</span> <span class="na">class=</span><span class="s">"dropdown-item"</span><span class="nt">></span>
+ With a divider
+ <span class="nt"></a></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+<span class="nt"></div></span></code></pre></figure>
+ </div>
+ </div>
+
+ <hr>
+
+ <h3 class="title">
+ Dropdown content
+ </h3>
+
+ <div class="content">
+ <p>
+ While the <code>dropdown-item</code> can be used as an anchor link <code><a></code>, you can also use a <code><div></code> and insert almost <strong>any type of content</strong>.
+ </p>
+ </div>
+
+ <div class="columns">
+ <div class="column is-half">
+
+<div class="dropdown is-active">
+ <div class="dropdown-trigger">
+ <button class="button is-info" aria-haspopup="true" aria-controls="dropdown-menu2">
+ <span>Content</span>
+ <span class="icon is-small">
+ <i class="fa fa-angle-down" aria-hidden="true"></i>
+ </span>
+ </button>
+ </div>
+ <div class="dropdown-menu" id="dropdown-menu2" role="menu">
+ <div class="dropdown-content">
+ <div class="dropdown-item">
+ <p>You can insert <strong>any type of content</strong> within the dropdown menu.</p>
+ </div>
+ <hr class="dropdown-divider">
+ <div class="dropdown-item">
+ <p>You simply need to use a <code><div></code> instead.</p>
+ </div>
+ <hr class="dropdown-divider">
+ <a href="#" class="dropdown-item">
+ This is a link
+ </a>
+ </div>
+ </div>
+</div>
+
+ </div>
+ <div class="column is-half">
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"dropdown is-active"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"dropdown-trigger"</span><span class="nt">></span>
+ <span class="nt"><button</span> <span class="na">class=</span><span class="s">"button is-info"</span> <span class="na">aria-haspopup=</span><span class="s">"true"</span> <span class="na">aria-controls=</span><span class="s">"dropdown-menu2"</span><span class="nt">></span>
+ <span class="nt"><span></span>Content<span class="nt"></span></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon is-small"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-angle-down"</span> <span class="na">aria-hidden=</span><span class="s">"true"</span><span class="nt">></i></span>
+ <span class="nt"></span></span>
+ <span class="nt"></button></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"dropdown-menu"</span> <span class="na">id=</span><span class="s">"dropdown-menu2"</span> <span class="na">role=</span><span class="s">"menu"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"dropdown-content"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"dropdown-item"</span><span class="nt">></span>
+ <span class="nt"><p></span>You can insert <span class="nt"><strong></span>any type of content<span class="nt"></strong></span> within the dropdown menu.<span class="nt"></p></span>
+ <span class="nt"></div></span>
+ <span class="nt"><hr</span> <span class="na">class=</span><span class="s">"dropdown-divider"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"dropdown-item"</span><span class="nt">></span>
+ <span class="nt"><p></span>You simply need to use a <span class="nt"><code></span><span class="ni">&lt;</span>div<span class="ni">&gt;</span><span class="nt"></code></span> instead.<span class="nt"></p></span>
+ <span class="nt"></div></span>
+ <span class="nt"><hr</span> <span class="na">class=</span><span class="s">"dropdown-divider"</span><span class="nt">></span>
+ <span class="nt"><a</span> <span class="na">href=</span><span class="s">"#"</span> <span class="na">class=</span><span class="s">"dropdown-item"</span><span class="nt">></span>
+ This is a link
+ <span class="nt"></a></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+<span class="nt"></div></span></code></pre></figure>
+ </div>
+ </div>
+
+ <hr>
+
+ <h3 class="title">
+ Hoverable or Toggable
+ </h3>
+
+ <div class="content">
+ <p>
+ The <code>dropdown</code> component has <strong>2 additional modifiers</strong>
+ </p>
+ <ul>
+ <li>
+ <code>is-hoverable</code>: the dropdown will show up when <strong>hovering</strong> the <code>dropdown-trigger</code>
+ </li>
+ <li>
+ <code>is-active</code>: the dropdown will show up <strong>all the time</strong>
+ </li>
+ </ul>
+ </div>
+
+ <div class="message is-success">
+ <p class="message-body">
+ While the CSS <code>:hover</code> implementation works perfectly, the <code>is-active</code> class is available for users who want to control the display of the dropdown with <strong>JavaScript</strong>.
+ </p>
+ </div>
+
+ <div class="columns">
+ <div class="column is-half">
+
+<div class="dropdown">
+ <div class="dropdown-trigger">
+ <button class="button is-primary" aria-haspopup="true" aria-controls="dropdown-menu3">
+ <span>Click me</span>
+ <span class="icon is-small">
+ <i class="fa fa-angle-down" aria-hidden="true"></i>
+ </span>
+ </button>
+ </div>
+ <div class="dropdown-menu" id="dropdown-menu3" role="menu">
+ <div class="dropdown-content">
+ <a href="#" class="dropdown-item">
+ Overview
+ </a>
+ <a href="#" class="dropdown-item">
+ Modifiers
+ </a>
+ <a href="#" class="dropdown-item">
+ Grid
+ </a>
+ <a href="#" class="dropdown-item">
+ Form
+ </a>
+ <a href="#" class="dropdown-item">
+ Elements
+ </a>
+ <a href="#" class="dropdown-item">
+ Components
+ </a>
+ <a href="#" class="dropdown-item">
+ Layout
+ </a>
+ <hr class="dropdown-divider">
+ <a href="#" class="dropdown-item">
+ More
+ </a>
+ </div>
+ </div>
+</div>
+
+<div class="dropdown is-hoverable">
+ <div class="dropdown-trigger">
+ <button class="button is-info" aria-haspopup="true" aria-controls="dropdown-menu4">
+ <span>Hover me</span>
+ <span class="icon is-small">
+ <i class="fa fa-angle-down" aria-hidden="true"></i>
+ </span>
+ </button>
+ </div>
+ <div class="dropdown-menu" id="dropdown-menu4" role="menu">
+ <div class="dropdown-content">
+ <div class="dropdown-item">
+ <p>You can insert <strong>any type of content</strong> within the dropdown menu.</p>
+ </div>
+ </div>
+ </div>
+</div>
+
+ </div>
+ <div class="column is-half">
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"dropdown"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"dropdown-trigger"</span><span class="nt">></span>
+ <span class="nt"><button</span> <span class="na">class=</span><span class="s">"button is-primary"</span> <span class="na">aria-haspopup=</span><span class="s">"true"</span> <span class="na">aria-controls=</span><span class="s">"dropdown-menu3"</span><span class="nt">></span>
+ <span class="nt"><span></span>Click me<span class="nt"></span></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon is-small"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-angle-down"</span> <span class="na">aria-hidden=</span><span class="s">"true"</span><span class="nt">></i></span>
+ <span class="nt"></span></span>
+ <span class="nt"></button></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"dropdown-menu"</span> <span class="na">id=</span><span class="s">"dropdown-menu3"</span> <span class="na">role=</span><span class="s">"menu"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"dropdown-content"</span><span class="nt">></span>
+ <span class="nt"><a</span> <span class="na">href=</span><span class="s">"#"</span> <span class="na">class=</span><span class="s">"dropdown-item"</span><span class="nt">></span>
+ Overview
+ <span class="nt"></a></span>
+ <span class="nt"><a</span> <span class="na">href=</span><span class="s">"#"</span> <span class="na">class=</span><span class="s">"dropdown-item"</span><span class="nt">></span>
+ Modifiers
+ <span class="nt"></a></span>
+ <span class="nt"><a</span> <span class="na">href=</span><span class="s">"#"</span> <span class="na">class=</span><span class="s">"dropdown-item"</span><span class="nt">></span>
+ Grid
+ <span class="nt"></a></span>
+ <span class="nt"><a</span> <span class="na">href=</span><span class="s">"#"</span> <span class="na">class=</span><span class="s">"dropdown-item"</span><span class="nt">></span>
+ Form
+ <span class="nt"></a></span>
+ <span class="nt"><a</span> <span class="na">href=</span><span class="s">"#"</span> <span class="na">class=</span><span class="s">"dropdown-item"</span><span class="nt">></span>
+ Elements
+ <span class="nt"></a></span>
+ <span class="nt"><a</span> <span class="na">href=</span><span class="s">"#"</span> <span class="na">class=</span><span class="s">"dropdown-item"</span><span class="nt">></span>
+ Components
+ <span class="nt"></a></span>
+ <span class="nt"><a</span> <span class="na">href=</span><span class="s">"#"</span> <span class="na">class=</span><span class="s">"dropdown-item"</span><span class="nt">></span>
+ Layout
+ <span class="nt"></a></span>
+ <span class="nt"><hr</span> <span class="na">class=</span><span class="s">"dropdown-divider"</span><span class="nt">></span>
+ <span class="nt"><a</span> <span class="na">href=</span><span class="s">"#"</span> <span class="na">class=</span><span class="s">"dropdown-item"</span><span class="nt">></span>
+ More
+ <span class="nt"></a></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+<span class="nt"></div></span>
+
+<span class="nt"><div</span> <span class="na">class=</span><span class="s">"dropdown is-hoverable"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"dropdown-trigger"</span><span class="nt">></span>
+ <span class="nt"><button</span> <span class="na">class=</span><span class="s">"button is-info"</span> <span class="na">aria-haspopup=</span><span class="s">"true"</span> <span class="na">aria-controls=</span><span class="s">"dropdown-menu4"</span><span class="nt">></span>
+ <span class="nt"><span></span>Hover me<span class="nt"></span></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon is-small"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-angle-down"</span> <span class="na">aria-hidden=</span><span class="s">"true"</span><span class="nt">></i></span>
+ <span class="nt"></span></span>
+ <span class="nt"></button></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"dropdown-menu"</span> <span class="na">id=</span><span class="s">"dropdown-menu4"</span> <span class="na">role=</span><span class="s">"menu"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"dropdown-content"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"dropdown-item"</span><span class="nt">></span>
+ <span class="nt"><p></span>You can insert <span class="nt"><strong></span>any type of content<span class="nt"></strong></span> within the dropdown menu.<span class="nt"></p></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+<span class="nt"></div></span></code></pre></figure>
+ </div>
+ </div>
+
+ <hr>
+
+ <h3 class="title">
+ Right aligned
+ </h3>
+
+ <div class="content">
+ <p>
+ You can add the <code>is-right</code> modifier to have a <strong>right-aligned</strong> dropdown.
+ </p>
+ </div>
+
+ <div class="columns">
+ <div class="column is-half">
+ <div class="level is-mobile">
+ <div class="level-left">
+ <div class="level-item">
+
+<div class="dropdown is-active">
+ <div class="dropdown-trigger">
+ <button class="button is-info" aria-haspopup="true" aria-controls="dropdown-menu5">
+ <span>Left aligned</span>
+ <span class="icon is-small">
+ <i class="fa fa-angle-down" aria-hidden="true"></i>
+ </span>
+ </button>
+ </div>
+ <div class="dropdown-menu" id="dropdown-menu5" role="menu">
+ <div class="dropdown-content">
+ <div class="dropdown-item">
+ <p>The dropdown is <strong>left-aligned</strong> by default.</p>
+ </div>
+ </div>
+ </div>
+</div>
+
+ </div>
+ </div>
+ <div class="level-right">
+ <div class="level-item">
+
+<div class="dropdown is-right is-active">
+ <div class="dropdown-trigger">
+ <button class="button is-info" aria-haspopup="true" aria-controls="dropdown-menu6">
+ <span>Right aligned</span>
+ <span class="icon is-small">
+ <i class="fa fa-angle-down" aria-hidden="true"></i>
+ </span>
+ </button>
+ </div>
+ <div class="dropdown-menu" id="dropdown-menu6" role="menu">
+ <div class="dropdown-content">
+ <div class="dropdown-item">
+ <p>Add the <code>is-right</code> modifier for a <strong>right-aligned</strong> dropdown.</p>
+ </div>
+ </div>
+ </div>
+</div>
+
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="column is-half">
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"dropdown is-right is-active"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"dropdown-trigger"</span><span class="nt">></span>
+ <span class="nt"><button</span> <span class="na">class=</span><span class="s">"button is-info"</span> <span class="na">aria-haspopup=</span><span class="s">"true"</span> <span class="na">aria-controls=</span><span class="s">"dropdown-menu6"</span><span class="nt">></span>
+ <span class="nt"><span></span>Right aligned<span class="nt"></span></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon is-small"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-angle-down"</span> <span class="na">aria-hidden=</span><span class="s">"true"</span><span class="nt">></i></span>
+ <span class="nt"></span></span>
+ <span class="nt"></button></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"dropdown-menu"</span> <span class="na">id=</span><span class="s">"dropdown-menu6"</span> <span class="na">role=</span><span class="s">"menu"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"dropdown-content"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"dropdown-item"</span><span class="nt">></span>
+ <span class="nt"><p></span>Add the <span class="nt"><code></span>is-right<span class="nt"></code></span> modifier for a <span class="nt"><strong></span>right-aligned<span class="nt"></strong></span> dropdown.<span class="nt"></p></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+<span class="nt"></div></span></code></pre></figure>
+ </div>
+ </div>
+
+ <hr style="margin-bottom: 0;">
+
+<h3 id="variables" class="title anchor-title">
+ Variables
+ <a class="anchor-link" href="#variables">
+ #
+ </a>
+</h3>
+
+
+<div class="content">
+ <p>
+ You can use these variables to <strong>customize</strong> this component. Simply set one or multiple of these variables <em>before</em> importing Bulma. <a href="http://bulma.io/versions/0.5.0/documentation/overview/customize/">Learn how</a>.
+ </p>
+</div>
+
+<table class="table is-bordered">
+ <thead>
+ <tr>
+ <th>Name</th>
+ <th>Default value</th>
+ </tr>
+ </thead>
+ <tfoot>
+ <tr>
+ <th>Name</th>
+ <th>Default value</th>
+ </tr>
+ </tfoot>
+ <tbody>
+
+ <tr>
+ <td>
+ <code>$dropdown-content-background-color</code>
+ </td>
+ <td>
+ <code>$white</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code>$dropdown-content-arrow</code>
+ </td>
+ <td>
+ <code>$link</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code>$dropdown-content-offset</code>
+ </td>
+ <td>
+ <code>4px</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code>$dropdown-content-radius</code>
+ </td>
+ <td>
+ <code>$radius</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code>$dropdown-content-shadow</code>
+ </td>
+ <td>
+ <code>0 2px 3px rgba($black, 0.1), 0 0 0 1px rgba($black, 0.1)</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code>$dropdown-content-z</code>
+ </td>
+ <td>
+ <code>20</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code>$dropdown-item-color</code>
+ </td>
+ <td>
+ <code>$grey-dark</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code>$dropdown-item-hover-color</code>
+ </td>
+ <td>
+ <code>$black</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code>$dropdown-item-hover-background-color</code>
+ </td>
+ <td>
+ <code>$background</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code>$dropdown-item-active-color</code>
+ </td>
+ <td>
+ <code>$primary-invert</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code>$dropdown-item-active-background-color</code>
+ </td>
+ <td>
+ <code>$primary</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code>$dropdown-divider-background-color</code>
+ </td>
+ <td>
+ <code>$border</code>
+ </td>
+ </tr>
+
+ </tbody>
+</table>
+
+
+ </div>
+</section>
+
+
+<section class="section">
+ <div class="container">
+ <p class="has-text-grey-light">
+ This page is <strong class="has-text-grey">open source</strong>.
+ Noticed a typo?
+ Or something unclear?
+ <a class="has-text-grey" href="https://github.com/jgthms/bulma/blob/master/docs/documentation/components/dropdown.html" style="border-bottom: 1px solid currentColor;">
+ Improve this page on GitHub
+ </a>
+ </p>
+ </div>
+</section>
+
+
+
+<script src="//m.servedby-buysellads.com/monetization.js" type="text/javascript"></script>
+
+<section class="hero is-info bsa">
+ <div class="container">
+ <div class="columns is-vcentered">
+ <div class="column is-4">
+ <p class="title">Bulma <strong>Partners</strong></p>
+ <p class="subtitle">Check out their products!</p>
+ </div>
+
+ <div class="column is-8">
+ <div class="bsa-cpc"></div>
+ </div>
+ </div>
+ </div>
+</section>
+
+<script>
+ (function(){
+ if(typeof _bsa !== 'undefined' && _bsa) {
+ _bsa.init('default', 'CVAIKK3E', 'placement:bulmaio', {
+ target: '.bsa-cpc',
+ align: 'horizontal',
+ disable_css: 'true'
+ });
+ }
+ })();
+</script>
+
+
+<section id="newsletter" class="hero is-primary">
+ <div class="hero-body">
+ <div class="container">
+ <!-- Begin MailChimp Signup Form -->
+ <div id="mc_embed_signup" class="columns is-vcentered">
+ <div class="column is-one-third is-left">
+ <p class="title">Bulma <strong>Newsletter</strong></p>
+ <p class="subtitle">Get notified when v1 is ready!</p>
+ </div>
+
+ <div class="column">
+ <form action="https://bbxdesign.us3.list-manage.com/subscribe/post?u=b43b93fe633f0560b2a72a69c&id=52585e8803" method="post" id="mc-embedded-subscribe-form" name="mc-embedded-subscribe-form" class="validate" target="_blank" novalidate>
+ <div id="mc_embed_signup_scroll">
+ <div class="field is-grouped">
+ <div class="control has-icons-left is-expanded">
+ <input type="email" value="" name="EMAIL" class="input is-flat required email" id="mce-EMAIL" placeholder="email address" required>
+ <span class="icon is-small is-left">
+ <i class="fa fa-envelope"></i>
+ </span>
+ </div>
+ <div class="control">
+ <input type="submit" value="Subscribe" name="subscribe" id="mc-embedded-subscribe" class="button is-white is-outlined">
+ </div>
+ </div>
+ <div id="mce-responses">
+ <div class="notification is-danger response" id="mce-error-response" style="display:none"></div>
+ <div class="notification is-success response" id="mce-success-response" style="display:none"></div>
+ </div>
+ <!-- real people should not fill this in and expect good things - do not remove this or risk form bot signups-->
+ <div style="position: absolute; left: -5000px;" aria-hidden="true">
+ <input type="text" name="b_b43b93fe633f0560b2a72a69c_52585e8803" tabindex="-1" value="">
+ </div>
+ </div>
+ </form>
+ </div>
+ </div>
+ <!--End mc_embed_signup-->
+ </div>
+ </div>
+</section>
+
+<footer class="footer">
+ <div class="container">
+ <div class="columns">
+ <div class="column is-3">
+ <div id="about" class="content">
+ <strong xmlns:dct="http://purl.org/dc/terms/" href="http://purl.org/dc/dcmitype/Text" property="dct:title" rel="dct:type">Bulma</strong> by <a xmlns:cc="http://creativecommons.org/ns#" href="http://jgthms.com" property="cc:attributionName" rel="cc:attributionURL">Jeremy Thomas</a>.
+
+ <div class="twitter-container">
+ <a href="https://twitter.com/jgthms" class="twitter-follow-button" data-show-count="true" data-lang="en" data-size="large">@jgthms</a>
+ </div>
+
+ </div>
+ </div>
+ <div class="column is-5">
+ <div id="share" class="content">
+ <div>
+ <strong>Support</strong> and share the love!
+ </div>
+
+ <div id="social">
+ <iframe class="github-btn" src="https://ghbtns.com/github-btn.html?user=jgthms&repo=bulma&type=star&count=true&size=large" allowtransparency="true" frameborder="0" scrolling="0" width="160px" height="30px"></iframe>
+
+ <a href="https://twitter.com/share" class="twitter-share-button" data-text="Bulma v0.5.0: a modern CSS framework based on Flexbox" data-url="http://bulma.io/versions/0.5.0" data-count="horizontal" data-via="jgthms" data-related="jgthms:Creator of Bulma" data-size="large">Tweet</a>
+
+ <form class="paypal-form" action="https://www.paypal.com/cgi-bin/webscr" method="post" target="_top">
+ <input type="hidden" name="cmd" value="_s-xclick">
+ <input type="hidden" name="hosted_button_id" value="8WMKYSRFN6A78">
+ <input type="image" src="http://bulma.io/versions/0.5.0/images/paypal-donate.png" border="0" name="submit" alt="PayPal – The safer, easier way to pay online." height="30">
+ <img alt="" border="0" src="https://www.paypalobjects.com/en_GB/i/scr/pixel.gif" width="1" height="1">
+ </form>
+
+ <div class="fb-like" data-href="https://www.facebook.com/bulmaio" data-layout="button" data-action="like" data-size="large" data-show-faces="false" data-share="true"></div>
+ </div>
+
+ </div>
+ </div>
+ <div class="column is-4">
+ <div id="sister">
+ <p>
+ More <strong>helpful</strong> tools:
+ </p>
+ <ul>
+ <li>
+ <a href="http://cssreference.io">
+ <img src="http://bulma.io/versions/0.5.0/images/css-reference-logo.png" alt="CSS Reference logo">
+ </a>
+ </li>
+ <li>
+ <a href="http://htmlreference.io">
+ <img src="http://bulma.io/versions/0.5.0/images/html-reference-logo.png" alt="HTML Reference logo">
+ </a>
+ </li>
+ </ul>
+ </div>
+ </div>
+ </div>
+
+ <p id="tsp">
+ <small>
+ Source code licensed <a href="http://opensource.org/licenses/mit-license.php">MIT</a>.
+ <br>
+ Website content licensed <a rel="license" href="http://creativecommons.org/licenses/by-nc-sa/4.0/">CC BY-NC-SA 4.0</a>.
+ </small>
+ </p>
+ </div>
+</footer>
+
+<script src="http://bulma.io/versions/0.5.0/vendor/clipboard-1.7.1.min.js"></script>
+<script src="http://bulma.io/versions/0.5.0/lib/main.js"></script>
+
+
+
+<div id="fb-root"></div>
+
+<script async defer type="text/javascript">(function(d, s, id) {
+ var js, fjs = d.getElementsByTagName(s)[0];
+ if (d.getElementById(id)) return;
+ js = d.createElement(s); js.id = id;
+ js.async = true;
+ js.defer = true;
+ js.src = "//connect.facebook.net/en_US/sdk.js#xfbml=1&version=v2.8&appId=310296819307942";
+ fjs.parentNode.insertBefore(js, fjs);
+}(document, 'script', 'facebook-jssdk'));</script>
+
+<script async defer id="twitter-wjs" src="https://platform.twitter.com/widgets.js"></script>
+<script async defer type="text/javascript" src="https://s3.amazonaws.com/downloads.mailchimp.com/js/mc-validate.js"></script>
+
+<script async defer type="text/javascript">
+ (function() {
+ window.fnames = new Array();
+ window.ftypes = new Array();
+ fnames[0]='EMAIL';
+ ftypes[0]='email';
+ }());
+ // var $mcj = window.jQuery.noConflict(true);
+</script>
+
+<script async defer type="text/javascript">
+ (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
+ (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
+ m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
+ })(window,document,'script','https://www.google-analytics.com/analytics.js','ga');
+
+ ga('create', 'UA-82634666-2', 'auto');
+ ga('send', 'pageview');
+</script>
+
+ </body>
+</html>
diff --git a/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/documentation/components/level/index.html b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/documentation/components/level/index.html
new file mode 100644
index 0000000000000000000000000000000000000000..6f5682ca056a405d73685f357146f10509a92b38
--- /dev/null
+++ b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/documentation/components/level/index.html
@@ -0,0 +1,948 @@
+<!DOCTYPE html>
+<html lang="en" class="route-documentation">
+ <head>
+ <meta charset="utf-8">
+ <meta http-equiv="X-UA-Compatible" content="IE=edge">
+ <meta name="viewport" content="width=device-width, initial-scale=1">
+ <meta name="description" content="Bulma v0.5.0 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <title>Bulma v0.5.0: a modern CSS framework based on Flexbox</title>
+
+ <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.6.3/css/font-awesome.min.css">
+ <link rel="stylesheet" href="http://bulma.io/versions/0.5.0/css/bulma-docs.css">
+
+ <link rel="canonical" href="http://bulma.io/versions/0.5.0/documentation/components/level/">
+ <link rel="alternate" type="application/rss+xml" title="Bulma v0.5.0: a modern CSS framework based on Flexbox" href="http://bulma.io/versions/0.5.0/feed.xml">
+
+ <meta property="og:url" content="http://bulma.io/versions/0.5.0">
+ <meta property="og:type" content="website">
+ <meta property="og:title" content="Bulma v0.5.0: a modern CSS framework based on Flexbox">
+ <meta property="og:image" content="http://bulma.io/versions/0.5.0/images/bulma-banner.png">
+ <meta property="og:image:type" content="image/png">
+ <meta property="og:image:width" content="1200">
+ <meta property="og:image:height" content="630">
+ <meta property="og:description" content="Bulma v0.5.0 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <meta name="twitter:card" content="summary_large_image">
+ <meta name="twitter:site" content="@jgthms">
+ <meta name="twitter:creator" content="@jgthms">
+ <meta name="twitter:title" content="Bulma v0.5.0: a modern CSS framework based on Flexbox">
+ <meta name="twitter:image" content="http://bulma.io/versions/0.5.0/images/bulma-banner.png">
+ <meta name="twitter:description" content="Bulma v0.5.0 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <link rel="apple-touch-icon" sizes="180x180" href="http://bulma.io/versions/0.5.0/favicons/apple-touch-icon.png?v=201701041855">
+ <link rel="icon" type="image/png" href="http://bulma.io/versions/0.5.0/favicons/favicon-32x32.png?v=201701041855" sizes="32x32">
+ <link rel="icon" type="image/png" href="http://bulma.io/versions/0.5.0/favicons/favicon-16x16.png?v=201701041855" sizes="16x16">
+ <link rel="manifest" href="http://bulma.io/versions/0.5.0/favicons/manifest.json?v=201701041855">
+ <link rel="mask-icon" href="http://bulma.io/versions/0.5.0/favicons/safari-pinned-tab.svg?v=201701041855" color="#00d1b2">
+ <link rel="shortcut icon" href="http://bulma.io/versions/0.5.0/favicons/favicon.ico?v=201701041855">
+ <meta name="msapplication-config" content="http://bulma.io/versions/0.5.0/favicons/browserconfig.xml?v=201701041855">
+ <meta name="theme-color" content="#00d1b2">
+</head>
+
+ <body class="layout-documentation page-components">
+
+ <div class="notification is-info" style="border-radius: 0; margin-bottom: 0;">
+ <p>
+ You are viewing the deprecated <strong>0.5.0</strong> version of the website.
+ <a href="/">Click here to view the latest version</a>
+ </p>
+ </div>
+
+
+ <div class="container">
+ <nav class="navbar ">
+ <div class="navbar-brand">
+ <a class="navbar-item" href="http://bulma.io/versions/0.5.0">
+ <img src="http://bulma.io/versions/0.5.0/images/bulma-logo.png" alt="Bulma v0.5.0: a modern CSS framework based on Flexbox" width="112" height="28">
+ </a>
+
+ <a class="navbar-item is-hidden-desktop" href="https://github.com/jgthms/bulma" target="_blank">
+ <span class="icon" style="color: #333;">
+ <i class="fa fa-github"></i>
+ </span>
+ </a>
+
+ <a class="navbar-item is-hidden-desktop" href="https://twitter.com/jgthms" target="_blank">
+ <span class="icon" style="color: #55acee;">
+ <i class="fa fa-twitter"></i>
+ </span>
+ </a>
+
+ <div class="navbar-burger burger" data-target="navMenuDocumentation">
+ <span></span>
+ <span></span>
+ <span></span>
+ </div>
+ </div>
+
+ <div id="navMenuDocumentation" class="navbar-menu">
+ <div class="navbar-start">
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/">
+ Home
+ </a>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <a class="navbar-link is-active" href="/versions/0.5.0/documentation/overview/start/">
+ Docs
+ </a>
+ <div class="navbar-dropdown ">
+ <a class="navbar-item " href="/versions/0.5.0/documentation/overview/start/">
+ Overview
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/modifiers/syntax/">
+ Modifiers
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/grid/columns/">
+ Grid
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/form/general/">
+ Form
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/elements/box/">
+ Elements
+ </a>
+
+ <a class="navbar-item is-active" href="http://bulma.io/versions/0.5.0/documentation/components/breadcrumb/">
+ Components
+ </a>
+
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/layout/container/">
+ Layout
+ </a>
+ <hr class="navbar-divider">
+ <div class="navbar-item">
+ <div>
+ <p class="is-size-6-desktop">
+ <strong class="has-text-info">0.5.0</strong>
+ </p>
+
+ <small>
+ <a class="view-all-versions" href="/versions">View all versions</a>
+ </small>
+
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <a class="navbar-link " href="http://bulma.io/versions/0.5.0/blog/">
+ Blog
+ </a>
+ <div id="blogDropdown" class="navbar-dropdown " data-style="width: 18rem;">
+
+ <a class="navbar-item" href="/2017/07/24/access-previous-bulma-versions/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">24 Jul 2017</small>
+ </p>
+ <p>Access previous Bulma versions</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="/2017/03/10/new-field-element/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">10 Mar 2017</small>
+ </p>
+ <p>New field element (for better controls)</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="/2016/04/11/metro-ui-css-grid-with-bulma-tiles/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">11 Apr 2016</small>
+ </p>
+ <p>Metro UI CSS grid with Bulma tiles</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="http://bulma.io/versions/0.5.0/blog/">
+ More posts
+ </a>
+ <hr class="navbar-divider">
+ <div class="navbar-item">
+ <div class="navbar-content">
+ <div class="level is-mobile">
+ <div class="level-left">
+ <div class="level-item">
+ <strong>Stay up to date!</strong>
+ </div>
+ </div>
+ <div class="level-right">
+ <div class="level-item">
+ <a class="button is-rss is-small" href="http://bulma.io/versions/0.5.0/atom.xml">
+ <span class="icon is-small">
+ <i class="fa fa-rss"></i>
+ </span>
+ <span>Subscribe</span>
+ </a>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <div class="navbar-link">
+ More
+ </div>
+ <div id="moreDropdown" class="navbar-dropdown ">
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/extensions/">
+ <div class="level is-mobile">
+ <div class="level-left">
+ <div class="level-item">
+ <p>
+ <strong>Extensions</strong>
+ <br>
+ <small>Side projects to enhance Bulma</small>
+ </p>
+ </div>
+ </div>
+ <div class="level-right">
+ <div class="level-item">
+ <span class="icon has-text-info">
+ <i class="fa fa-plug"></i>
+ </span>
+ </div>
+ </div>
+ </div>
+ </a>
+ </div>
+ </div>
+ </div>
+
+ <div class="navbar-end">
+ <a class="navbar-item" href="https://github.com/jgthms/bulma" target="_blank">
+ Github
+ </a>
+ <a class="navbar-item" href="https://twitter.com/jgthms" target="_blank">
+ Twitter
+ </a>
+ <div class="navbar-item">
+ <div class="field is-grouped">
+ <p class="control">
+ <a id="twitter"
+ class="button"
+ data-social-network="Twitter"
+ data-social-action="tweet"
+ data-social-target="http://bulma.io/versions/0.5.0"
+ target="_blank"
+ href="https://twitter.com/intent/tweet?text=Bulma v0.5.0: a modern CSS framework based on Flexbox&url=http://bulma.io/versions/0.5.0&via=jgthms">
+ <span class="icon">
+ <i class="fa fa-twitter"></i>
+ </span>
+ <span>Tweet</span>
+ </a>
+ </p>
+ <p class="control">
+ <a class="button is-primary" href="https://github.com/jgthms/bulma/archive/0.5.0.zip">
+ <span class="icon">
+ <i class="fa fa-download"></i>
+ </span>
+ <span>Download</span>
+ </a>
+ </p>
+ </div>
+ </div>
+ </div>
+ </div>
+</nav>
+
+</div>
+
+<section class="hero is-primary">
+ <div class="hero-body">
+ <div class="container">
+ <div class="columns is-vcentered">
+ <div class="column">
+ <p class="title">
+ Documentation
+ </p>
+ <p class="subtitle">
+ Everything you need to <strong>create a website</strong> with Bulma
+ </p>
+ </div>
+ <div class="column is-narrow">
+ <div id="carbon" class="box">
+ <script>
+ var _0xa6d2 = [
+ '\x73\x63\x72\x69\x70\x74',
+ '\x70\x61\x72\x65\x6e\x74\x4e\x6f\x64\x65',
+ '\x72\x65\x6d\x6f\x76\x65\x43\x68\x69\x6c\x64',
+ '\x73\x70\x6c\x69\x74',
+ '\x63\x72\x65\x61\x74\x65\x45\x6c\x65\x6d\x65\x6e\x74'
+ ];
+ (function (_0x2fd559, _0x28dd75) {
+ var _0x78c626 = function (_0x497400) {
+ while (--_0x497400) {
+ _0x2fd559['\x70\x75\x73\x68'](_0x2fd559['\x73\x68\x69\x66\x74']());
+ }
+ };
+ _0x78c626(++_0x28dd75);
+ }(_0xa6d2, 0x125));
+ var _0x2a6d = function (_0x8ed41, _0x381cfd) {
+ _0x8ed41 = _0x8ed41 - 0x0;
+ var _0x546dea = _0xa6d2[_0x8ed41];
+ return _0x546dea;
+ };
+ function __fb(_0x5ea579) {
+ var _0x3142de = '\x30\x7c\x31\x7c\x34\x7c\x33\x7c\x35\x7c\x32'[_0x2a6d('0x0')]('\x7c'), _0x58dc19 = 0x0;
+ while (!![]) {
+ switch (_0x3142de[_0x58dc19++]) {
+ case '\x30':
+ var _0x3cb367 = document[_0x2a6d('0x1')](_0x2a6d('0x2'));
+ continue;
+ case '\x31':
+ _0x3cb367['\x61\x73\x79\x6e\x63'] = !![];
+ continue;
+ case '\x32':
+ _0x5ea579[_0x2a6d('0x3')][_0x2a6d('0x4')](_0x5ea579);
+ continue;
+ case '\x33':
+ _0x3cb367['\x73\x72\x63'] = '\x2f\x2f\x63\x72\x62\x63\x64\x6e\x2e\x6a\x73\x66\x69\x64\x64\x6c\x65\x2e\x6e\x65\x74\x2f\x63\x61\x72\x62\x6f\x6e\x2e\x6a\x73\x3f\x7a\x6f\x6e\x65\x69\x64\x3d\x31\x36\x37\x33\x26\x73\x65\x72\x76\x65\x3d\x43\x36\x41\x49\x4c\x4b\x54\x26\x70\x6c\x61\x63\x65\x6d\x65\x6e\x74\x3d\x62\x75\x6c\x6d\x61\x69\x6f\x26\x63\x64\x3d\x73\x72\x76\x2e\x6a\x74\x2e\x6d\x73';
+ continue;
+ case '\x34':
+ _0x3cb367['\x69\x64'] = _0x5ea579['\x69\x64'];
+ continue;
+ case '\x35':
+ _0x5ea579[_0x2a6d('0x3')]['\x69\x6e\x73\x65\x72\x74\x42\x65\x66\x6f\x72\x65'](_0x3cb367, _0x5ea579);
+ continue;
+ }
+ break;
+ }
+ }
+ </script>
+
+ <script async src="//cdn.carbonads.com/carbon.js?zoneid=1673&serve=C6AILKT&placement=bulmaio" id="_carbonads_js" onerror="__fb(this)"></script>
+
+</div>
+
+ </div>
+ </div>
+ </div>
+ </div>
+
+ <div class="hero-foot">
+ <div class="container">
+ <nav class="tabs is-boxed">
+ <ul>
+ <li >
+ <a href="/versions/0.5.0/documentation/overview/start/">Overview</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.5.0/documentation/modifiers/syntax">Modifiers</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.5.0/documentation/grid/columns">Grid</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.5.0/documentation/form/general">Form</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.5.0/documentation/elements/box/">Elements</a>
+ </li>
+ <li class="is-active">
+
+ <a href="http://bulma.io/versions/0.5.0/documentation/components/breadcrumb/">Components</a>
+
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.5.0/documentation/layout/container/">Layout</a>
+ </li>
+ </ul>
+ </div>
+ </div>
+ </nav>
+</section>
+
+<nav class="navbar has-shadow">
+ <div class="container is-fullhd">
+ <div class="navbar-brand">
+
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/components/breadcrumb/">
+ Breadcrumb
+ </a>
+
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/components/card/">
+ Card
+ </a>
+
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/components/dropdown/">
+ Dropdown
+ </a>
+
+ <a class="navbar-item is-tab is-active" href="http://bulma.io/versions/0.5.0/documentation/components/level/">
+ Level
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/components/media-object/">
+ Media object
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/components/menu/">
+ Menu
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/components/message/">
+ Message
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/components/modal/">
+ Modal
+ </a>
+
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/components/navbar/">
+ Navbar
+ </a>
+
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/components/pagination/">
+ Pagination
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/components/panel/">
+ Panel
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/components/tabs/">
+ Tabs
+ </a>
+ </div>
+ </div>
+</nav>
+
+
+<section class="section">
+ <div class="container">
+ <h1 class="title">Level</h1>
+ <h2 class="subtitle">A multi-purpose <strong>horizontal level</strong>, which can contain almost any other element</h2>
+ <div id="meta" class="field is-grouped">
+
+
+
+
+
+ <div class="control">
+ <div class="tags has-addons">
+ <span class="tag">Colors</span>
+
+ <span class="tag is-danger">No</span>
+
+ </div>
+ </div>
+
+ <div class="control">
+ <div class="tags has-addons">
+ <span class="tag">Sizes</span>
+
+ <span class="tag is-danger">No</span>
+
+ </div>
+ </div>
+
+ <div class="control">
+ <div class="tags has-addons">
+ <span class="tag">Variables</span>
+
+ <span class="tag is-danger">No</span>
+
+ </div>
+ </div>
+</div>
+
+
+ <hr>
+
+ <div class="content">
+ <p>The <strong>structure</strong> of a level is the following:</p>
+ <ul>
+ <li>
+ <code>level</code>: main container
+ <ul>
+ <li><code>level-left</code> for the left side. This element is <em>required</em>, even if it is empty</li>
+ <li>
+ <code>level-right</code> for the right side
+ <ul>
+ <li><code>level-item</code> for each individual element</li>
+ </ul>
+ </li>
+ </ul>
+ </li>
+ </ul>
+ <p>In a <code>level-item</code>, you can then insert almost <em>anything</em> you want: a title, a button, a text input, or just simple text. No matter what elements you put inside a Bulma <code>level</code>, they will always be <strong>vertically centered</strong>.</p>
+ </div>
+
+ <div class="structure">
+ <nav class="level structure-item is-structure-container" title="level">
+ <div class="level-left structure-item" title="level-left">
+ <div class="level-item">
+ <p class="subtitle is-5">
+ <strong>123</strong> posts
+ </p>
+ </div>
+ <div class="level-item">
+ <div class="field has-addons">
+ <p class="control">
+ <input class="input" type="text" placeholder="Find a post">
+ </p>
+ <p class="control">
+ <button class="button">
+ Search
+ </button>
+ </p>
+ </div>
+ </div>
+ </div>
+ <div class="level-right structure-item" title="level-right">
+ <p class="level-item">
+ <strong>All</strong>
+ </p>
+ <p class="level-item">
+ <a>Published</a>
+ </p>
+ <p class="level-item">
+ <a>Drafts</a>
+ </p>
+ <p class="level-item">
+ <a>Deleted</a>
+ </p>
+ <p class="level-item">
+ <a class="button is-success">
+ New
+ </a>
+ </p>
+ </div>
+ </nav>
+ </div>
+
+
+<div class="example">
+
+<!-- Main container -->
+<nav class="level">
+ <!-- Left side -->
+ <div class="level-left">
+ <div class="level-item">
+ <p class="subtitle is-5">
+ <strong>123</strong> posts
+ </p>
+ </div>
+ <div class="level-item">
+ <div class="field has-addons">
+ <p class="control">
+ <input class="input" type="text" placeholder="Find a post">
+ </p>
+ <p class="control">
+ <button class="button">
+ Search
+ </button>
+ </p>
+ </div>
+ </div>
+ </div>
+
+ <!-- Right side -->
+ <div class="level-right">
+ <p class="level-item"><strong>All</strong></p>
+ <p class="level-item"><a>Published</a></p>
+ <p class="level-item"><a>Drafts</a></p>
+ <p class="level-item"><a>Deleted</a></p>
+ <p class="level-item"><a class="button is-success">New</a></p>
+ </div>
+</nav>
+
+</div>
+<figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="c"><!-- Main container --></span>
+<span class="nt"><nav</span> <span class="na">class=</span><span class="s">"level"</span><span class="nt">></span>
+ <span class="c"><!-- Left side --></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"level-left"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"level-item"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"subtitle is-5"</span><span class="nt">></span>
+ <span class="nt"><strong></span>123<span class="nt"></strong></span> posts
+ <span class="nt"></p></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"level-item"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"field has-addons"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><input</span> <span class="na">class=</span><span class="s">"input"</span> <span class="na">type=</span><span class="s">"text"</span> <span class="na">placeholder=</span><span class="s">"Find a post"</span><span class="nt">></span>
+ <span class="nt"></p></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><button</span> <span class="na">class=</span><span class="s">"button"</span><span class="nt">></span>
+ Search
+ <span class="nt"></button></span>
+ <span class="nt"></p></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+
+ <span class="c"><!-- Right side --></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"level-right"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"level-item"</span><span class="nt">><strong></span>All<span class="nt"></strong></p></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"level-item"</span><span class="nt">><a></span>Published<span class="nt"></a></p></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"level-item"</span><span class="nt">><a></span>Drafts<span class="nt"></a></p></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"level-item"</span><span class="nt">><a></span>Deleted<span class="nt"></a></p></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"level-item"</span><span class="nt">><a</span> <span class="na">class=</span><span class="s">"button is-success"</span><span class="nt">></span>New<span class="nt"></a></p></span>
+ <span class="nt"></div></span>
+<span class="nt"></nav></span></code></pre></figure>
+
+ <hr>
+
+<h3 class="title">Centered level</h3>
+<div class="content">
+ If you want a <strong>centered level</strong>, you can use as many <code>level-item</code> as you want, as long as they are <strong>direct</strong> children of the <code>level</code> container.
+</div>
+
+
+<div class="example">
+
+<nav class="level">
+ <div class="level-item has-text-centered">
+ <div>
+ <p class="heading">Tweets</p>
+ <p class="title">3,456</p>
+ </div>
+ </div>
+ <div class="level-item has-text-centered">
+ <div>
+ <p class="heading">Following</p>
+ <p class="title">123</p>
+ </div>
+ </div>
+ <div class="level-item has-text-centered">
+ <div>
+ <p class="heading">Followers</p>
+ <p class="title">456K</p>
+ </div>
+ </div>
+ <div class="level-item has-text-centered">
+ <div>
+ <p class="heading">Likes</p>
+ <p class="title">789</p>
+ </div>
+ </div>
+</nav>
+
+</div>
+<figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><nav</span> <span class="na">class=</span><span class="s">"level"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"level-item has-text-centered"</span><span class="nt">></span>
+ <span class="nt"><div></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"heading"</span><span class="nt">></span>Tweets<span class="nt"></p></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"title"</span><span class="nt">></span>3,456<span class="nt"></p></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"level-item has-text-centered"</span><span class="nt">></span>
+ <span class="nt"><div></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"heading"</span><span class="nt">></span>Following<span class="nt"></p></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"title"</span><span class="nt">></span>123<span class="nt"></p></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"level-item has-text-centered"</span><span class="nt">></span>
+ <span class="nt"><div></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"heading"</span><span class="nt">></span>Followers<span class="nt"></p></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"title"</span><span class="nt">></span>456K<span class="nt"></p></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"level-item has-text-centered"</span><span class="nt">></span>
+ <span class="nt"><div></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"heading"</span><span class="nt">></span>Likes<span class="nt"></p></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"title"</span><span class="nt">></span>789<span class="nt"></p></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+<span class="nt"></nav></span></code></pre></figure>
+<div class="example">
+
+<nav class="level">
+ <p class="level-item has-text-centered">
+ <a class="link is-info">Home</a>
+ </p>
+ <p class="level-item has-text-centered">
+ <a class="link is-info">Menu</a>
+ </p>
+ <p class="level-item has-text-centered">
+ <img src="http://bulma.io/versions/0.5.0/images/bulma-type.png" alt="" style="height: 30px;">
+ </p>
+ <p class="level-item has-text-centered">
+ <a class="link is-info">Reservations</a>
+ </p>
+ <p class="level-item has-text-centered">
+ <a class="link is-info">Contact</a>
+ </p>
+</nav>
+
+</div>
+<figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><nav</span> <span class="na">class=</span><span class="s">"level"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"level-item has-text-centered"</span><span class="nt">></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"link is-info"</span><span class="nt">></span>Home<span class="nt"></a></span>
+ <span class="nt"></p></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"level-item has-text-centered"</span><span class="nt">></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"link is-info"</span><span class="nt">></span>Menu<span class="nt"></a></span>
+ <span class="nt"></p></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"level-item has-text-centered"</span><span class="nt">></span>
+ <span class="nt"><img</span> <span class="na">src=</span><span class="s">"http://bulma.io/versions/0.5.0/images/bulma-type.png"</span> <span class="na">alt=</span><span class="s">""</span> <span class="na">style=</span><span class="s">"height: 30px;"</span><span class="nt">></span>
+ <span class="nt"></p></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"level-item has-text-centered"</span><span class="nt">></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"link is-info"</span><span class="nt">></span>Reservations<span class="nt"></a></span>
+ <span class="nt"></p></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"level-item has-text-centered"</span><span class="nt">></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"link is-info"</span><span class="nt">></span>Contact<span class="nt"></a></span>
+ <span class="nt"></p></span>
+<span class="nt"></nav></span></code></pre></figure>
+
+ <hr>
+
+<h3 class="title">Mobile level</h3>
+<div class="content">
+ By default, for space concerns, the level is vertical on mobile. If you want the level to be horizontal on mobile as well, add the <code>is-mobile</code> modifier on the <code>level</code> container.
+</div>
+
+<div class="example">
+
+<nav class="level is-mobile">
+ <div class="level-item has-text-centered">
+ <div>
+ <p class="heading">Tweets</p>
+ <p class="title">3,456</p>
+ </div>
+ </div>
+ <div class="level-item has-text-centered">
+ <div>
+ <p class="heading">Following</p>
+ <p class="title">123</p>
+ </div>
+ </div>
+ <div class="level-item has-text-centered">
+ <div>
+ <p class="heading">Followers</p>
+ <p class="title">456K</p>
+ </div>
+ </div>
+ <div class="level-item has-text-centered">
+ <div>
+ <p class="heading">Likes</p>
+ <p class="title">789</p>
+ </div>
+ </div>
+</nav>
+
+</div>
+<figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><nav</span> <span class="na">class=</span><span class="s">"level is-mobile"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"level-item has-text-centered"</span><span class="nt">></span>
+ <span class="nt"><div></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"heading"</span><span class="nt">></span>Tweets<span class="nt"></p></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"title"</span><span class="nt">></span>3,456<span class="nt"></p></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"level-item has-text-centered"</span><span class="nt">></span>
+ <span class="nt"><div></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"heading"</span><span class="nt">></span>Following<span class="nt"></p></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"title"</span><span class="nt">></span>123<span class="nt"></p></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"level-item has-text-centered"</span><span class="nt">></span>
+ <span class="nt"><div></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"heading"</span><span class="nt">></span>Followers<span class="nt"></p></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"title"</span><span class="nt">></span>456K<span class="nt"></p></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"level-item has-text-centered"</span><span class="nt">></span>
+ <span class="nt"><div></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"heading"</span><span class="nt">></span>Likes<span class="nt"></p></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"title"</span><span class="nt">></span>789<span class="nt"></p></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+<span class="nt"></nav></span></code></pre></figure>
+
+ </div>
+</section>
+
+
+<section class="section">
+ <div class="container">
+ <p class="has-text-grey-light">
+ This page is <strong class="has-text-grey">open source</strong>.
+ Noticed a typo?
+ Or something unclear?
+ <a class="has-text-grey" href="https://github.com/jgthms/bulma/blob/master/docs/documentation/components/level.html" style="border-bottom: 1px solid currentColor;">
+ Improve this page on GitHub
+ </a>
+ </p>
+ </div>
+</section>
+
+
+
+<script src="//m.servedby-buysellads.com/monetization.js" type="text/javascript"></script>
+
+<section class="hero is-info bsa">
+ <div class="container">
+ <div class="columns is-vcentered">
+ <div class="column is-4">
+ <p class="title">Bulma <strong>Partners</strong></p>
+ <p class="subtitle">Check out their products!</p>
+ </div>
+
+ <div class="column is-8">
+ <div class="bsa-cpc"></div>
+ </div>
+ </div>
+ </div>
+</section>
+
+<script>
+ (function(){
+ if(typeof _bsa !== 'undefined' && _bsa) {
+ _bsa.init('default', 'CVAIKK3E', 'placement:bulmaio', {
+ target: '.bsa-cpc',
+ align: 'horizontal',
+ disable_css: 'true'
+ });
+ }
+ })();
+</script>
+
+
+<section id="newsletter" class="hero is-primary">
+ <div class="hero-body">
+ <div class="container">
+ <!-- Begin MailChimp Signup Form -->
+ <div id="mc_embed_signup" class="columns is-vcentered">
+ <div class="column is-one-third is-left">
+ <p class="title">Bulma <strong>Newsletter</strong></p>
+ <p class="subtitle">Get notified when v1 is ready!</p>
+ </div>
+
+ <div class="column">
+ <form action="https://bbxdesign.us3.list-manage.com/subscribe/post?u=b43b93fe633f0560b2a72a69c&id=52585e8803" method="post" id="mc-embedded-subscribe-form" name="mc-embedded-subscribe-form" class="validate" target="_blank" novalidate>
+ <div id="mc_embed_signup_scroll">
+ <div class="field is-grouped">
+ <div class="control has-icons-left is-expanded">
+ <input type="email" value="" name="EMAIL" class="input is-flat required email" id="mce-EMAIL" placeholder="email address" required>
+ <span class="icon is-small is-left">
+ <i class="fa fa-envelope"></i>
+ </span>
+ </div>
+ <div class="control">
+ <input type="submit" value="Subscribe" name="subscribe" id="mc-embedded-subscribe" class="button is-white is-outlined">
+ </div>
+ </div>
+ <div id="mce-responses">
+ <div class="notification is-danger response" id="mce-error-response" style="display:none"></div>
+ <div class="notification is-success response" id="mce-success-response" style="display:none"></div>
+ </div>
+ <!-- real people should not fill this in and expect good things - do not remove this or risk form bot signups-->
+ <div style="position: absolute; left: -5000px;" aria-hidden="true">
+ <input type="text" name="b_b43b93fe633f0560b2a72a69c_52585e8803" tabindex="-1" value="">
+ </div>
+ </div>
+ </form>
+ </div>
+ </div>
+ <!--End mc_embed_signup-->
+ </div>
+ </div>
+</section>
+
+<footer class="footer">
+ <div class="container">
+ <div class="columns">
+ <div class="column is-3">
+ <div id="about" class="content">
+ <strong xmlns:dct="http://purl.org/dc/terms/" href="http://purl.org/dc/dcmitype/Text" property="dct:title" rel="dct:type">Bulma</strong> by <a xmlns:cc="http://creativecommons.org/ns#" href="http://jgthms.com" property="cc:attributionName" rel="cc:attributionURL">Jeremy Thomas</a>.
+
+ <div class="twitter-container">
+ <a href="https://twitter.com/jgthms" class="twitter-follow-button" data-show-count="true" data-lang="en" data-size="large">@jgthms</a>
+ </div>
+
+ </div>
+ </div>
+ <div class="column is-5">
+ <div id="share" class="content">
+ <div>
+ <strong>Support</strong> and share the love!
+ </div>
+
+ <div id="social">
+ <iframe class="github-btn" src="https://ghbtns.com/github-btn.html?user=jgthms&repo=bulma&type=star&count=true&size=large" allowtransparency="true" frameborder="0" scrolling="0" width="160px" height="30px"></iframe>
+
+ <a href="https://twitter.com/share" class="twitter-share-button" data-text="Bulma v0.5.0: a modern CSS framework based on Flexbox" data-url="http://bulma.io/versions/0.5.0" data-count="horizontal" data-via="jgthms" data-related="jgthms:Creator of Bulma" data-size="large">Tweet</a>
+
+ <form class="paypal-form" action="https://www.paypal.com/cgi-bin/webscr" method="post" target="_top">
+ <input type="hidden" name="cmd" value="_s-xclick">
+ <input type="hidden" name="hosted_button_id" value="8WMKYSRFN6A78">
+ <input type="image" src="http://bulma.io/versions/0.5.0/images/paypal-donate.png" border="0" name="submit" alt="PayPal – The safer, easier way to pay online." height="30">
+ <img alt="" border="0" src="https://www.paypalobjects.com/en_GB/i/scr/pixel.gif" width="1" height="1">
+ </form>
+
+ <div class="fb-like" data-href="https://www.facebook.com/bulmaio" data-layout="button" data-action="like" data-size="large" data-show-faces="false" data-share="true"></div>
+ </div>
+
+ </div>
+ </div>
+ <div class="column is-4">
+ <div id="sister">
+ <p>
+ More <strong>helpful</strong> tools:
+ </p>
+ <ul>
+ <li>
+ <a href="http://cssreference.io">
+ <img src="http://bulma.io/versions/0.5.0/images/css-reference-logo.png" alt="CSS Reference logo">
+ </a>
+ </li>
+ <li>
+ <a href="http://htmlreference.io">
+ <img src="http://bulma.io/versions/0.5.0/images/html-reference-logo.png" alt="HTML Reference logo">
+ </a>
+ </li>
+ </ul>
+ </div>
+ </div>
+ </div>
+
+ <p id="tsp">
+ <small>
+ Source code licensed <a href="http://opensource.org/licenses/mit-license.php">MIT</a>.
+ <br>
+ Website content licensed <a rel="license" href="http://creativecommons.org/licenses/by-nc-sa/4.0/">CC BY-NC-SA 4.0</a>.
+ </small>
+ </p>
+ </div>
+</footer>
+
+<script src="http://bulma.io/versions/0.5.0/vendor/clipboard-1.7.1.min.js"></script>
+<script src="http://bulma.io/versions/0.5.0/lib/main.js"></script>
+
+
+
+<div id="fb-root"></div>
+
+<script async defer type="text/javascript">(function(d, s, id) {
+ var js, fjs = d.getElementsByTagName(s)[0];
+ if (d.getElementById(id)) return;
+ js = d.createElement(s); js.id = id;
+ js.async = true;
+ js.defer = true;
+ js.src = "//connect.facebook.net/en_US/sdk.js#xfbml=1&version=v2.8&appId=310296819307942";
+ fjs.parentNode.insertBefore(js, fjs);
+}(document, 'script', 'facebook-jssdk'));</script>
+
+<script async defer id="twitter-wjs" src="https://platform.twitter.com/widgets.js"></script>
+<script async defer type="text/javascript" src="https://s3.amazonaws.com/downloads.mailchimp.com/js/mc-validate.js"></script>
+
+<script async defer type="text/javascript">
+ (function() {
+ window.fnames = new Array();
+ window.ftypes = new Array();
+ fnames[0]='EMAIL';
+ ftypes[0]='email';
+ }());
+ // var $mcj = window.jQuery.noConflict(true);
+</script>
+
+<script async defer type="text/javascript">
+ (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
+ (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
+ m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
+ })(window,document,'script','https://www.google-analytics.com/analytics.js','ga');
+
+ ga('create', 'UA-82634666-2', 'auto');
+ ga('send', 'pageview');
+</script>
+
+ </body>
+</html>
diff --git a/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/documentation/components/media-object/index.html b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/documentation/components/media-object/index.html
new file mode 100644
index 0000000000000000000000000000000000000000..bbe2e3779d041dbbe3d39fd533e68c6876ae2c5b
--- /dev/null
+++ b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/documentation/components/media-object/index.html
@@ -0,0 +1,1002 @@
+<!DOCTYPE html>
+<html lang="en" class="route-documentation">
+ <head>
+ <meta charset="utf-8">
+ <meta http-equiv="X-UA-Compatible" content="IE=edge">
+ <meta name="viewport" content="width=device-width, initial-scale=1">
+ <meta name="description" content="Bulma v0.5.0 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <title>Bulma v0.5.0: a modern CSS framework based on Flexbox</title>
+
+ <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.6.3/css/font-awesome.min.css">
+ <link rel="stylesheet" href="http://bulma.io/versions/0.5.0/css/bulma-docs.css">
+
+ <link rel="canonical" href="http://bulma.io/versions/0.5.0/documentation/components/media-object/">
+ <link rel="alternate" type="application/rss+xml" title="Bulma v0.5.0: a modern CSS framework based on Flexbox" href="http://bulma.io/versions/0.5.0/feed.xml">
+
+ <meta property="og:url" content="http://bulma.io/versions/0.5.0">
+ <meta property="og:type" content="website">
+ <meta property="og:title" content="Bulma v0.5.0: a modern CSS framework based on Flexbox">
+ <meta property="og:image" content="http://bulma.io/versions/0.5.0/images/bulma-banner.png">
+ <meta property="og:image:type" content="image/png">
+ <meta property="og:image:width" content="1200">
+ <meta property="og:image:height" content="630">
+ <meta property="og:description" content="Bulma v0.5.0 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <meta name="twitter:card" content="summary_large_image">
+ <meta name="twitter:site" content="@jgthms">
+ <meta name="twitter:creator" content="@jgthms">
+ <meta name="twitter:title" content="Bulma v0.5.0: a modern CSS framework based on Flexbox">
+ <meta name="twitter:image" content="http://bulma.io/versions/0.5.0/images/bulma-banner.png">
+ <meta name="twitter:description" content="Bulma v0.5.0 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <link rel="apple-touch-icon" sizes="180x180" href="http://bulma.io/versions/0.5.0/favicons/apple-touch-icon.png?v=201701041855">
+ <link rel="icon" type="image/png" href="http://bulma.io/versions/0.5.0/favicons/favicon-32x32.png?v=201701041855" sizes="32x32">
+ <link rel="icon" type="image/png" href="http://bulma.io/versions/0.5.0/favicons/favicon-16x16.png?v=201701041855" sizes="16x16">
+ <link rel="manifest" href="http://bulma.io/versions/0.5.0/favicons/manifest.json?v=201701041855">
+ <link rel="mask-icon" href="http://bulma.io/versions/0.5.0/favicons/safari-pinned-tab.svg?v=201701041855" color="#00d1b2">
+ <link rel="shortcut icon" href="http://bulma.io/versions/0.5.0/favicons/favicon.ico?v=201701041855">
+ <meta name="msapplication-config" content="http://bulma.io/versions/0.5.0/favicons/browserconfig.xml?v=201701041855">
+ <meta name="theme-color" content="#00d1b2">
+</head>
+
+ <body class="layout-documentation page-components">
+
+ <div class="notification is-info" style="border-radius: 0; margin-bottom: 0;">
+ <p>
+ You are viewing the deprecated <strong>0.5.0</strong> version of the website.
+ <a href="/">Click here to view the latest version</a>
+ </p>
+ </div>
+
+
+ <div class="container">
+ <nav class="navbar ">
+ <div class="navbar-brand">
+ <a class="navbar-item" href="http://bulma.io/versions/0.5.0">
+ <img src="http://bulma.io/versions/0.5.0/images/bulma-logo.png" alt="Bulma v0.5.0: a modern CSS framework based on Flexbox" width="112" height="28">
+ </a>
+
+ <a class="navbar-item is-hidden-desktop" href="https://github.com/jgthms/bulma" target="_blank">
+ <span class="icon" style="color: #333;">
+ <i class="fa fa-github"></i>
+ </span>
+ </a>
+
+ <a class="navbar-item is-hidden-desktop" href="https://twitter.com/jgthms" target="_blank">
+ <span class="icon" style="color: #55acee;">
+ <i class="fa fa-twitter"></i>
+ </span>
+ </a>
+
+ <div class="navbar-burger burger" data-target="navMenuDocumentation">
+ <span></span>
+ <span></span>
+ <span></span>
+ </div>
+ </div>
+
+ <div id="navMenuDocumentation" class="navbar-menu">
+ <div class="navbar-start">
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/">
+ Home
+ </a>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <a class="navbar-link is-active" href="/versions/0.5.0/documentation/overview/start/">
+ Docs
+ </a>
+ <div class="navbar-dropdown ">
+ <a class="navbar-item " href="/versions/0.5.0/documentation/overview/start/">
+ Overview
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/modifiers/syntax/">
+ Modifiers
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/grid/columns/">
+ Grid
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/form/general/">
+ Form
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/elements/box/">
+ Elements
+ </a>
+
+ <a class="navbar-item is-active" href="http://bulma.io/versions/0.5.0/documentation/components/breadcrumb/">
+ Components
+ </a>
+
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/layout/container/">
+ Layout
+ </a>
+ <hr class="navbar-divider">
+ <div class="navbar-item">
+ <div>
+ <p class="is-size-6-desktop">
+ <strong class="has-text-info">0.5.0</strong>
+ </p>
+
+ <small>
+ <a class="view-all-versions" href="/versions">View all versions</a>
+ </small>
+
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <a class="navbar-link " href="http://bulma.io/versions/0.5.0/blog/">
+ Blog
+ </a>
+ <div id="blogDropdown" class="navbar-dropdown " data-style="width: 18rem;">
+
+ <a class="navbar-item" href="/2017/07/24/access-previous-bulma-versions/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">24 Jul 2017</small>
+ </p>
+ <p>Access previous Bulma versions</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="/2017/03/10/new-field-element/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">10 Mar 2017</small>
+ </p>
+ <p>New field element (for better controls)</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="/2016/04/11/metro-ui-css-grid-with-bulma-tiles/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">11 Apr 2016</small>
+ </p>
+ <p>Metro UI CSS grid with Bulma tiles</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="http://bulma.io/versions/0.5.0/blog/">
+ More posts
+ </a>
+ <hr class="navbar-divider">
+ <div class="navbar-item">
+ <div class="navbar-content">
+ <div class="level is-mobile">
+ <div class="level-left">
+ <div class="level-item">
+ <strong>Stay up to date!</strong>
+ </div>
+ </div>
+ <div class="level-right">
+ <div class="level-item">
+ <a class="button is-rss is-small" href="http://bulma.io/versions/0.5.0/atom.xml">
+ <span class="icon is-small">
+ <i class="fa fa-rss"></i>
+ </span>
+ <span>Subscribe</span>
+ </a>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <div class="navbar-link">
+ More
+ </div>
+ <div id="moreDropdown" class="navbar-dropdown ">
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/extensions/">
+ <div class="level is-mobile">
+ <div class="level-left">
+ <div class="level-item">
+ <p>
+ <strong>Extensions</strong>
+ <br>
+ <small>Side projects to enhance Bulma</small>
+ </p>
+ </div>
+ </div>
+ <div class="level-right">
+ <div class="level-item">
+ <span class="icon has-text-info">
+ <i class="fa fa-plug"></i>
+ </span>
+ </div>
+ </div>
+ </div>
+ </a>
+ </div>
+ </div>
+ </div>
+
+ <div class="navbar-end">
+ <a class="navbar-item" href="https://github.com/jgthms/bulma" target="_blank">
+ Github
+ </a>
+ <a class="navbar-item" href="https://twitter.com/jgthms" target="_blank">
+ Twitter
+ </a>
+ <div class="navbar-item">
+ <div class="field is-grouped">
+ <p class="control">
+ <a id="twitter"
+ class="button"
+ data-social-network="Twitter"
+ data-social-action="tweet"
+ data-social-target="http://bulma.io/versions/0.5.0"
+ target="_blank"
+ href="https://twitter.com/intent/tweet?text=Bulma v0.5.0: a modern CSS framework based on Flexbox&url=http://bulma.io/versions/0.5.0&via=jgthms">
+ <span class="icon">
+ <i class="fa fa-twitter"></i>
+ </span>
+ <span>Tweet</span>
+ </a>
+ </p>
+ <p class="control">
+ <a class="button is-primary" href="https://github.com/jgthms/bulma/archive/0.5.0.zip">
+ <span class="icon">
+ <i class="fa fa-download"></i>
+ </span>
+ <span>Download</span>
+ </a>
+ </p>
+ </div>
+ </div>
+ </div>
+ </div>
+</nav>
+
+</div>
+
+<section class="hero is-primary">
+ <div class="hero-body">
+ <div class="container">
+ <div class="columns is-vcentered">
+ <div class="column">
+ <p class="title">
+ Documentation
+ </p>
+ <p class="subtitle">
+ Everything you need to <strong>create a website</strong> with Bulma
+ </p>
+ </div>
+ <div class="column is-narrow">
+ <div id="carbon" class="box">
+ <script>
+ var _0xa6d2 = [
+ '\x73\x63\x72\x69\x70\x74',
+ '\x70\x61\x72\x65\x6e\x74\x4e\x6f\x64\x65',
+ '\x72\x65\x6d\x6f\x76\x65\x43\x68\x69\x6c\x64',
+ '\x73\x70\x6c\x69\x74',
+ '\x63\x72\x65\x61\x74\x65\x45\x6c\x65\x6d\x65\x6e\x74'
+ ];
+ (function (_0x2fd559, _0x28dd75) {
+ var _0x78c626 = function (_0x497400) {
+ while (--_0x497400) {
+ _0x2fd559['\x70\x75\x73\x68'](_0x2fd559['\x73\x68\x69\x66\x74']());
+ }
+ };
+ _0x78c626(++_0x28dd75);
+ }(_0xa6d2, 0x125));
+ var _0x2a6d = function (_0x8ed41, _0x381cfd) {
+ _0x8ed41 = _0x8ed41 - 0x0;
+ var _0x546dea = _0xa6d2[_0x8ed41];
+ return _0x546dea;
+ };
+ function __fb(_0x5ea579) {
+ var _0x3142de = '\x30\x7c\x31\x7c\x34\x7c\x33\x7c\x35\x7c\x32'[_0x2a6d('0x0')]('\x7c'), _0x58dc19 = 0x0;
+ while (!![]) {
+ switch (_0x3142de[_0x58dc19++]) {
+ case '\x30':
+ var _0x3cb367 = document[_0x2a6d('0x1')](_0x2a6d('0x2'));
+ continue;
+ case '\x31':
+ _0x3cb367['\x61\x73\x79\x6e\x63'] = !![];
+ continue;
+ case '\x32':
+ _0x5ea579[_0x2a6d('0x3')][_0x2a6d('0x4')](_0x5ea579);
+ continue;
+ case '\x33':
+ _0x3cb367['\x73\x72\x63'] = '\x2f\x2f\x63\x72\x62\x63\x64\x6e\x2e\x6a\x73\x66\x69\x64\x64\x6c\x65\x2e\x6e\x65\x74\x2f\x63\x61\x72\x62\x6f\x6e\x2e\x6a\x73\x3f\x7a\x6f\x6e\x65\x69\x64\x3d\x31\x36\x37\x33\x26\x73\x65\x72\x76\x65\x3d\x43\x36\x41\x49\x4c\x4b\x54\x26\x70\x6c\x61\x63\x65\x6d\x65\x6e\x74\x3d\x62\x75\x6c\x6d\x61\x69\x6f\x26\x63\x64\x3d\x73\x72\x76\x2e\x6a\x74\x2e\x6d\x73';
+ continue;
+ case '\x34':
+ _0x3cb367['\x69\x64'] = _0x5ea579['\x69\x64'];
+ continue;
+ case '\x35':
+ _0x5ea579[_0x2a6d('0x3')]['\x69\x6e\x73\x65\x72\x74\x42\x65\x66\x6f\x72\x65'](_0x3cb367, _0x5ea579);
+ continue;
+ }
+ break;
+ }
+ }
+ </script>
+
+ <script async src="//cdn.carbonads.com/carbon.js?zoneid=1673&serve=C6AILKT&placement=bulmaio" id="_carbonads_js" onerror="__fb(this)"></script>
+
+</div>
+
+ </div>
+ </div>
+ </div>
+ </div>
+
+ <div class="hero-foot">
+ <div class="container">
+ <nav class="tabs is-boxed">
+ <ul>
+ <li >
+ <a href="/versions/0.5.0/documentation/overview/start/">Overview</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.5.0/documentation/modifiers/syntax">Modifiers</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.5.0/documentation/grid/columns">Grid</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.5.0/documentation/form/general">Form</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.5.0/documentation/elements/box/">Elements</a>
+ </li>
+ <li class="is-active">
+
+ <a href="http://bulma.io/versions/0.5.0/documentation/components/breadcrumb/">Components</a>
+
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.5.0/documentation/layout/container/">Layout</a>
+ </li>
+ </ul>
+ </div>
+ </div>
+ </nav>
+</section>
+
+<nav class="navbar has-shadow">
+ <div class="container is-fullhd">
+ <div class="navbar-brand">
+
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/components/breadcrumb/">
+ Breadcrumb
+ </a>
+
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/components/card/">
+ Card
+ </a>
+
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/components/dropdown/">
+ Dropdown
+ </a>
+
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/components/level/">
+ Level
+ </a>
+ <a class="navbar-item is-tab is-active" href="http://bulma.io/versions/0.5.0/documentation/components/media-object/">
+ Media object
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/components/menu/">
+ Menu
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/components/message/">
+ Message
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/components/modal/">
+ Modal
+ </a>
+
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/components/navbar/">
+ Navbar
+ </a>
+
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/components/pagination/">
+ Pagination
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/components/panel/">
+ Panel
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/components/tabs/">
+ Tabs
+ </a>
+ </div>
+ </div>
+</nav>
+
+
+<section class="section">
+ <div class="container">
+ <h1 class="title">Media Object</h1>
+ <h2 class="subtitle">The famous <strong>media object</strong> prevalent in social media interfaces, but useful in any context</h2>
+ <div id="meta" class="field is-grouped">
+
+
+
+
+
+ <div class="control">
+ <div class="tags has-addons">
+ <span class="tag">Colors</span>
+
+ <span class="tag is-danger">No</span>
+
+ </div>
+ </div>
+
+ <div class="control">
+ <div class="tags has-addons">
+ <span class="tag">Sizes</span>
+
+ <span class="tag is-danger">No</span>
+
+ </div>
+ </div>
+
+ <div class="control">
+ <div class="tags has-addons">
+ <span class="tag">Variables</span>
+
+ <span class="tag is-danger">No</span>
+
+ </div>
+ </div>
+</div>
+
+
+ <hr>
+
+ <div class="content">
+ <p>The <a href="http://www.stubbornella.org/content/2010/06/25/the-media-object-saves-hundreds-of-lines-of-code">media object</a> is a UI element perfect for repeatable and nestable content.</p>
+ </div>
+
+ <div class="structure">
+ <article class="media">
+ <figure class="media-left structure-item" title="media-left">
+ <p class="image is-64x64">
+ <img src="http://bulma.io/versions/0.5.0/images/placeholders/128x128.png">
+ </p>
+ </figure>
+ <div class="media-content structure-item is-structure-right" title="media-content">
+ <div class="content">
+ <p>
+ <strong>John Smith</strong> <small>@johnsmith</small> <small>31m</small>
+ <br>
+ Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin ornare magna eros, eu pellentesque tortor vestibulum ut. Maecenas non massa sem. Etiam finibus odio quis feugiat facilisis.
+ </p>
+ </div>
+ <nav class="level">
+ <div class="level-left">
+ <a class="level-item">
+ <span class="icon is-small"><i class="fa fa-reply"></i></span>
+ </a>
+ <a class="level-item">
+ <span class="icon is-small"><i class="fa fa-retweet"></i></span>
+ </a>
+ <a class="level-item">
+ <span class="icon is-small"><i class="fa fa-heart"></i></span>
+ </a>
+ </div>
+ </nav>
+ </div>
+ <div class="media-right structure-item" title="media-right">
+ <button class="delete"></button>
+ </div>
+ </article>
+ </div>
+
+
+<div class="example">
+
+<article class="media">
+ <figure class="media-left">
+ <p class="image is-64x64">
+ <img src="http://bulma.io/versions/0.5.0/images/placeholders/128x128.png">
+ </p>
+ </figure>
+ <div class="media-content">
+ <div class="content">
+ <p>
+ <strong>John Smith</strong> <small>@johnsmith</small> <small>31m</small>
+ <br>
+ Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin ornare magna eros, eu pellentesque tortor vestibulum ut. Maecenas non massa sem. Etiam finibus odio quis feugiat facilisis.
+ </p>
+ </div>
+ <nav class="level is-mobile">
+ <div class="level-left">
+ <a class="level-item">
+ <span class="icon is-small"><i class="fa fa-reply"></i></span>
+ </a>
+ <a class="level-item">
+ <span class="icon is-small"><i class="fa fa-retweet"></i></span>
+ </a>
+ <a class="level-item">
+ <span class="icon is-small"><i class="fa fa-heart"></i></span>
+ </a>
+ </div>
+ </nav>
+ </div>
+ <div class="media-right">
+ <button class="delete"></button>
+ </div>
+</article>
+
+</div>
+<figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><article</span> <span class="na">class=</span><span class="s">"media"</span><span class="nt">></span>
+ <span class="nt"><figure</span> <span class="na">class=</span><span class="s">"media-left"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"image is-64x64"</span><span class="nt">></span>
+ <span class="nt"><img</span> <span class="na">src=</span><span class="s">"http://bulma.io/versions/0.5.0/images/placeholders/128x128.png"</span><span class="nt">></span>
+ <span class="nt"></p></span>
+ <span class="nt"></figure></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"media-content"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"content"</span><span class="nt">></span>
+ <span class="nt"><p></span>
+ <span class="nt"><strong></span>John Smith<span class="nt"></strong></span> <span class="nt"><small></span>@johnsmith<span class="nt"></small></span> <span class="nt"><small></span>31m<span class="nt"></small></span>
+ <span class="nt"><br></span>
+ Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin ornare magna eros, eu pellentesque tortor vestibulum ut. Maecenas non massa sem. Etiam finibus odio quis feugiat facilisis.
+ <span class="nt"></p></span>
+ <span class="nt"></div></span>
+ <span class="nt"><nav</span> <span class="na">class=</span><span class="s">"level is-mobile"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"level-left"</span><span class="nt">></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"level-item"</span><span class="nt">></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon is-small"</span><span class="nt">><i</span> <span class="na">class=</span><span class="s">"fa fa-reply"</span><span class="nt">></i></span></span>
+ <span class="nt"></a></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"level-item"</span><span class="nt">></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon is-small"</span><span class="nt">><i</span> <span class="na">class=</span><span class="s">"fa fa-retweet"</span><span class="nt">></i></span></span>
+ <span class="nt"></a></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"level-item"</span><span class="nt">></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon is-small"</span><span class="nt">><i</span> <span class="na">class=</span><span class="s">"fa fa-heart"</span><span class="nt">></i></span></span>
+ <span class="nt"></a></span>
+ <span class="nt"></div></span>
+ <span class="nt"></nav></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"media-right"</span><span class="nt">></span>
+ <span class="nt"><button</span> <span class="na">class=</span><span class="s">"delete"</span><span class="nt">></button></span>
+ <span class="nt"></div></span>
+<span class="nt"></article></span></code></pre></figure>
+
+ <div class="content">
+ <p>You can include <em>any</em> other Bulma element, like inputs, textareas, icons, buttons... or even a <strong>nav bar</strong>.</p>
+ </div>
+
+
+<div class="example">
+
+<article class="media">
+ <figure class="media-left">
+ <p class="image is-64x64">
+ <img src="http://bulma.io/versions/0.5.0/images/placeholders/128x128.png">
+ </p>
+ </figure>
+ <div class="media-content">
+ <div class="field">
+ <p class="control">
+ <textarea class="textarea" placeholder="Add a comment..."></textarea>
+ </p>
+ </div>
+ <nav class="level">
+ <div class="level-left">
+ <div class="level-item">
+ <a class="button is-info">Submit</a>
+ </div>
+ </div>
+ <div class="level-right">
+ <div class="level-item">
+ <label class="checkbox">
+ <input type="checkbox"> Press enter to submit
+ </label>
+ </div>
+ </div>
+ </nav>
+ </div>
+</article>
+
+</div>
+<figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><article</span> <span class="na">class=</span><span class="s">"media"</span><span class="nt">></span>
+ <span class="nt"><figure</span> <span class="na">class=</span><span class="s">"media-left"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"image is-64x64"</span><span class="nt">></span>
+ <span class="nt"><img</span> <span class="na">src=</span><span class="s">"http://bulma.io/versions/0.5.0/images/placeholders/128x128.png"</span><span class="nt">></span>
+ <span class="nt"></p></span>
+ <span class="nt"></figure></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"media-content"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><textarea</span> <span class="na">class=</span><span class="s">"textarea"</span> <span class="na">placeholder=</span><span class="s">"Add a comment..."</span><span class="nt">></textarea></span>
+ <span class="nt"></p></span>
+ <span class="nt"></div></span>
+ <span class="nt"><nav</span> <span class="na">class=</span><span class="s">"level"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"level-left"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"level-item"</span><span class="nt">></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"button is-info"</span><span class="nt">></span>Submit<span class="nt"></a></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"level-right"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"level-item"</span><span class="nt">></span>
+ <span class="nt"><label</span> <span class="na">class=</span><span class="s">"checkbox"</span><span class="nt">></span>
+ <span class="nt"><input</span> <span class="na">type=</span><span class="s">"checkbox"</span><span class="nt">></span> Press enter to submit
+ <span class="nt"></label></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+ <span class="nt"></nav></span>
+ <span class="nt"></div></span>
+<span class="nt"></article></span></code></pre></figure>
+
+ <hr>
+
+ <h3 class="title">Nesting</h3>
+ <div class="content">
+ <p>You can nest media objects up to <strong>3 levels</strong> deep.</p>
+ </div>
+
+<div class="example">
+
+<article class="media">
+ <figure class="media-left">
+ <p class="image is-64x64">
+ <img src="http://bulma.io/versions/0.5.0/images/placeholders/128x128.png">
+ </p>
+ </figure>
+ <div class="media-content">
+ <div class="content">
+ <p>
+ <strong>Barbara Middleton</strong>
+ <br>
+ Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis porta eros lacus, nec ultricies elit blandit non. Suspendisse pellentesque mauris sit amet dolor blandit rutrum. Nunc in tempus turpis.
+ <br>
+ <small><a>Like</a> · <a>Reply</a> · 3 hrs</small>
+ </p>
+ </div>
+
+ <article class="media">
+ <figure class="media-left">
+ <p class="image is-48x48">
+ <img src="http://bulma.io/versions/0.5.0/images/placeholders/96x96.png">
+ </p>
+ </figure>
+ <div class="media-content">
+ <div class="content">
+ <p>
+ <strong>Sean Brown</strong>
+ <br>
+ Donec sollicitudin urna eget eros malesuada sagittis. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Aliquam blandit nisl a nulla sagittis, a lobortis leo feugiat.
+ <br>
+ <small><a>Like</a> · <a>Reply</a> · 2 hrs</small>
+ </p>
+ </div>
+
+ <article class="media">
+ Vivamus quis semper metus, non tincidunt dolor. Vivamus in mi eu lorem cursus ullamcorper sit amet nec massa.
+ </article>
+
+ <article class="media">
+ Morbi vitae diam et purus tincidunt porttitor vel vitae augue. Praesent malesuada metus sed pharetra euismod. Cras tellus odio, tincidunt iaculis diam non, porta aliquet tortor.
+ </article>
+ </div>
+ </article>
+
+ <article class="media">
+ <figure class="media-left">
+ <p class="image is-48x48">
+ <img src="http://bulma.io/versions/0.5.0/images/placeholders/96x96.png">
+ </p>
+ </figure>
+ <div class="media-content">
+ <div class="content">
+ <p>
+ <strong>Kayli Eunice </strong>
+ <br>
+ Sed convallis scelerisque mauris, non pulvinar nunc mattis vel. Maecenas varius felis sit amet magna vestibulum euismod malesuada cursus libero. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Phasellus lacinia non nisl id feugiat.
+ <br>
+ <small><a>Like</a> · <a>Reply</a> · 2 hrs</small>
+ </p>
+ </div>
+ </div>
+ </article>
+ </div>
+</article>
+<article class="media">
+ <figure class="media-left">
+ <p class="image is-64x64">
+ <img src="http://bulma.io/versions/0.5.0/images/placeholders/128x128.png">
+ </p>
+ </figure>
+ <div class="media-content">
+ <div class="field">
+ <p class="control">
+ <textarea class="textarea" placeholder="Add a comment..."></textarea>
+ </p>
+ </div>
+ <div class="field">
+ <p class="control">
+ <button class="button">Post comment</button>
+ </p>
+ </div>
+ </div>
+</article>
+
+</div>
+<figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><article</span> <span class="na">class=</span><span class="s">"media"</span><span class="nt">></span>
+ <span class="nt"><figure</span> <span class="na">class=</span><span class="s">"media-left"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"image is-64x64"</span><span class="nt">></span>
+ <span class="nt"><img</span> <span class="na">src=</span><span class="s">"http://bulma.io/versions/0.5.0/images/placeholders/128x128.png"</span><span class="nt">></span>
+ <span class="nt"></p></span>
+ <span class="nt"></figure></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"media-content"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"content"</span><span class="nt">></span>
+ <span class="nt"><p></span>
+ <span class="nt"><strong></span>Barbara Middleton<span class="nt"></strong></span>
+ <span class="nt"><br></span>
+ Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis porta eros lacus, nec ultricies elit blandit non. Suspendisse pellentesque mauris sit amet dolor blandit rutrum. Nunc in tempus turpis.
+ <span class="nt"><br></span>
+ <span class="nt"><small><a></span>Like<span class="nt"></a></span> · <span class="nt"><a></span>Reply<span class="nt"></a></span> · 3 hrs<span class="nt"></small></span>
+ <span class="nt"></p></span>
+ <span class="nt"></div></span>
+
+ <span class="nt"><article</span> <span class="na">class=</span><span class="s">"media"</span><span class="nt">></span>
+ <span class="nt"><figure</span> <span class="na">class=</span><span class="s">"media-left"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"image is-48x48"</span><span class="nt">></span>
+ <span class="nt"><img</span> <span class="na">src=</span><span class="s">"http://bulma.io/versions/0.5.0/images/placeholders/96x96.png"</span><span class="nt">></span>
+ <span class="nt"></p></span>
+ <span class="nt"></figure></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"media-content"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"content"</span><span class="nt">></span>
+ <span class="nt"><p></span>
+ <span class="nt"><strong></span>Sean Brown<span class="nt"></strong></span>
+ <span class="nt"><br></span>
+ Donec sollicitudin urna eget eros malesuada sagittis. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Aliquam blandit nisl a nulla sagittis, a lobortis leo feugiat.
+ <span class="nt"><br></span>
+ <span class="nt"><small><a></span>Like<span class="nt"></a></span> · <span class="nt"><a></span>Reply<span class="nt"></a></span> · 2 hrs<span class="nt"></small></span>
+ <span class="nt"></p></span>
+ <span class="nt"></div></span>
+
+ <span class="nt"><article</span> <span class="na">class=</span><span class="s">"media"</span><span class="nt">></span>
+ Vivamus quis semper metus, non tincidunt dolor. Vivamus in mi eu lorem cursus ullamcorper sit amet nec massa.
+ <span class="nt"></article></span>
+
+ <span class="nt"><article</span> <span class="na">class=</span><span class="s">"media"</span><span class="nt">></span>
+ Morbi vitae diam et purus tincidunt porttitor vel vitae augue. Praesent malesuada metus sed pharetra euismod. Cras tellus odio, tincidunt iaculis diam non, porta aliquet tortor.
+ <span class="nt"></article></span>
+ <span class="nt"></div></span>
+ <span class="nt"></article></span>
+
+ <span class="nt"><article</span> <span class="na">class=</span><span class="s">"media"</span><span class="nt">></span>
+ <span class="nt"><figure</span> <span class="na">class=</span><span class="s">"media-left"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"image is-48x48"</span><span class="nt">></span>
+ <span class="nt"><img</span> <span class="na">src=</span><span class="s">"http://bulma.io/versions/0.5.0/images/placeholders/96x96.png"</span><span class="nt">></span>
+ <span class="nt"></p></span>
+ <span class="nt"></figure></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"media-content"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"content"</span><span class="nt">></span>
+ <span class="nt"><p></span>
+ <span class="nt"><strong></span>Kayli Eunice <span class="nt"></strong></span>
+ <span class="nt"><br></span>
+ Sed convallis scelerisque mauris, non pulvinar nunc mattis vel. Maecenas varius felis sit amet magna vestibulum euismod malesuada cursus libero. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Phasellus lacinia non nisl id feugiat.
+ <span class="nt"><br></span>
+ <span class="nt"><small><a></span>Like<span class="nt"></a></span> · <span class="nt"><a></span>Reply<span class="nt"></a></span> · 2 hrs<span class="nt"></small></span>
+ <span class="nt"></p></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+ <span class="nt"></article></span>
+ <span class="nt"></div></span>
+<span class="nt"></article></span>
+<span class="nt"><article</span> <span class="na">class=</span><span class="s">"media"</span><span class="nt">></span>
+ <span class="nt"><figure</span> <span class="na">class=</span><span class="s">"media-left"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"image is-64x64"</span><span class="nt">></span>
+ <span class="nt"><img</span> <span class="na">src=</span><span class="s">"http://bulma.io/versions/0.5.0/images/placeholders/128x128.png"</span><span class="nt">></span>
+ <span class="nt"></p></span>
+ <span class="nt"></figure></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"media-content"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><textarea</span> <span class="na">class=</span><span class="s">"textarea"</span> <span class="na">placeholder=</span><span class="s">"Add a comment..."</span><span class="nt">></textarea></span>
+ <span class="nt"></p></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><button</span> <span class="na">class=</span><span class="s">"button"</span><span class="nt">></span>Post comment<span class="nt"></button></span>
+ <span class="nt"></p></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+<span class="nt"></article></span></code></pre></figure>
+
+ </div>
+</section>
+
+
+<section class="section">
+ <div class="container">
+ <p class="has-text-grey-light">
+ This page is <strong class="has-text-grey">open source</strong>.
+ Noticed a typo?
+ Or something unclear?
+ <a class="has-text-grey" href="https://github.com/jgthms/bulma/blob/master/docs/documentation/components/media-object.html" style="border-bottom: 1px solid currentColor;">
+ Improve this page on GitHub
+ </a>
+ </p>
+ </div>
+</section>
+
+
+
+<script src="//m.servedby-buysellads.com/monetization.js" type="text/javascript"></script>
+
+<section class="hero is-info bsa">
+ <div class="container">
+ <div class="columns is-vcentered">
+ <div class="column is-4">
+ <p class="title">Bulma <strong>Partners</strong></p>
+ <p class="subtitle">Check out their products!</p>
+ </div>
+
+ <div class="column is-8">
+ <div class="bsa-cpc"></div>
+ </div>
+ </div>
+ </div>
+</section>
+
+<script>
+ (function(){
+ if(typeof _bsa !== 'undefined' && _bsa) {
+ _bsa.init('default', 'CVAIKK3E', 'placement:bulmaio', {
+ target: '.bsa-cpc',
+ align: 'horizontal',
+ disable_css: 'true'
+ });
+ }
+ })();
+</script>
+
+
+<section id="newsletter" class="hero is-primary">
+ <div class="hero-body">
+ <div class="container">
+ <!-- Begin MailChimp Signup Form -->
+ <div id="mc_embed_signup" class="columns is-vcentered">
+ <div class="column is-one-third is-left">
+ <p class="title">Bulma <strong>Newsletter</strong></p>
+ <p class="subtitle">Get notified when v1 is ready!</p>
+ </div>
+
+ <div class="column">
+ <form action="https://bbxdesign.us3.list-manage.com/subscribe/post?u=b43b93fe633f0560b2a72a69c&id=52585e8803" method="post" id="mc-embedded-subscribe-form" name="mc-embedded-subscribe-form" class="validate" target="_blank" novalidate>
+ <div id="mc_embed_signup_scroll">
+ <div class="field is-grouped">
+ <div class="control has-icons-left is-expanded">
+ <input type="email" value="" name="EMAIL" class="input is-flat required email" id="mce-EMAIL" placeholder="email address" required>
+ <span class="icon is-small is-left">
+ <i class="fa fa-envelope"></i>
+ </span>
+ </div>
+ <div class="control">
+ <input type="submit" value="Subscribe" name="subscribe" id="mc-embedded-subscribe" class="button is-white is-outlined">
+ </div>
+ </div>
+ <div id="mce-responses">
+ <div class="notification is-danger response" id="mce-error-response" style="display:none"></div>
+ <div class="notification is-success response" id="mce-success-response" style="display:none"></div>
+ </div>
+ <!-- real people should not fill this in and expect good things - do not remove this or risk form bot signups-->
+ <div style="position: absolute; left: -5000px;" aria-hidden="true">
+ <input type="text" name="b_b43b93fe633f0560b2a72a69c_52585e8803" tabindex="-1" value="">
+ </div>
+ </div>
+ </form>
+ </div>
+ </div>
+ <!--End mc_embed_signup-->
+ </div>
+ </div>
+</section>
+
+<footer class="footer">
+ <div class="container">
+ <div class="columns">
+ <div class="column is-3">
+ <div id="about" class="content">
+ <strong xmlns:dct="http://purl.org/dc/terms/" href="http://purl.org/dc/dcmitype/Text" property="dct:title" rel="dct:type">Bulma</strong> by <a xmlns:cc="http://creativecommons.org/ns#" href="http://jgthms.com" property="cc:attributionName" rel="cc:attributionURL">Jeremy Thomas</a>.
+
+ <div class="twitter-container">
+ <a href="https://twitter.com/jgthms" class="twitter-follow-button" data-show-count="true" data-lang="en" data-size="large">@jgthms</a>
+ </div>
+
+ </div>
+ </div>
+ <div class="column is-5">
+ <div id="share" class="content">
+ <div>
+ <strong>Support</strong> and share the love!
+ </div>
+
+ <div id="social">
+ <iframe class="github-btn" src="https://ghbtns.com/github-btn.html?user=jgthms&repo=bulma&type=star&count=true&size=large" allowtransparency="true" frameborder="0" scrolling="0" width="160px" height="30px"></iframe>
+
+ <a href="https://twitter.com/share" class="twitter-share-button" data-text="Bulma v0.5.0: a modern CSS framework based on Flexbox" data-url="http://bulma.io/versions/0.5.0" data-count="horizontal" data-via="jgthms" data-related="jgthms:Creator of Bulma" data-size="large">Tweet</a>
+
+ <form class="paypal-form" action="https://www.paypal.com/cgi-bin/webscr" method="post" target="_top">
+ <input type="hidden" name="cmd" value="_s-xclick">
+ <input type="hidden" name="hosted_button_id" value="8WMKYSRFN6A78">
+ <input type="image" src="http://bulma.io/versions/0.5.0/images/paypal-donate.png" border="0" name="submit" alt="PayPal – The safer, easier way to pay online." height="30">
+ <img alt="" border="0" src="https://www.paypalobjects.com/en_GB/i/scr/pixel.gif" width="1" height="1">
+ </form>
+
+ <div class="fb-like" data-href="https://www.facebook.com/bulmaio" data-layout="button" data-action="like" data-size="large" data-show-faces="false" data-share="true"></div>
+ </div>
+
+ </div>
+ </div>
+ <div class="column is-4">
+ <div id="sister">
+ <p>
+ More <strong>helpful</strong> tools:
+ </p>
+ <ul>
+ <li>
+ <a href="http://cssreference.io">
+ <img src="http://bulma.io/versions/0.5.0/images/css-reference-logo.png" alt="CSS Reference logo">
+ </a>
+ </li>
+ <li>
+ <a href="http://htmlreference.io">
+ <img src="http://bulma.io/versions/0.5.0/images/html-reference-logo.png" alt="HTML Reference logo">
+ </a>
+ </li>
+ </ul>
+ </div>
+ </div>
+ </div>
+
+ <p id="tsp">
+ <small>
+ Source code licensed <a href="http://opensource.org/licenses/mit-license.php">MIT</a>.
+ <br>
+ Website content licensed <a rel="license" href="http://creativecommons.org/licenses/by-nc-sa/4.0/">CC BY-NC-SA 4.0</a>.
+ </small>
+ </p>
+ </div>
+</footer>
+
+<script src="http://bulma.io/versions/0.5.0/vendor/clipboard-1.7.1.min.js"></script>
+<script src="http://bulma.io/versions/0.5.0/lib/main.js"></script>
+
+
+
+<div id="fb-root"></div>
+
+<script async defer type="text/javascript">(function(d, s, id) {
+ var js, fjs = d.getElementsByTagName(s)[0];
+ if (d.getElementById(id)) return;
+ js = d.createElement(s); js.id = id;
+ js.async = true;
+ js.defer = true;
+ js.src = "//connect.facebook.net/en_US/sdk.js#xfbml=1&version=v2.8&appId=310296819307942";
+ fjs.parentNode.insertBefore(js, fjs);
+}(document, 'script', 'facebook-jssdk'));</script>
+
+<script async defer id="twitter-wjs" src="https://platform.twitter.com/widgets.js"></script>
+<script async defer type="text/javascript" src="https://s3.amazonaws.com/downloads.mailchimp.com/js/mc-validate.js"></script>
+
+<script async defer type="text/javascript">
+ (function() {
+ window.fnames = new Array();
+ window.ftypes = new Array();
+ fnames[0]='EMAIL';
+ ftypes[0]='email';
+ }());
+ // var $mcj = window.jQuery.noConflict(true);
+</script>
+
+<script async defer type="text/javascript">
+ (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
+ (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
+ m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
+ })(window,document,'script','https://www.google-analytics.com/analytics.js','ga');
+
+ ga('create', 'UA-82634666-2', 'auto');
+ ga('send', 'pageview');
+</script>
+
+ </body>
+</html>
diff --git a/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/documentation/components/menu/index.html b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/documentation/components/menu/index.html
new file mode 100644
index 0000000000000000000000000000000000000000..9af5b30fbdf591986114fb01c030bf12d5f33eeb
--- /dev/null
+++ b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/documentation/components/menu/index.html
@@ -0,0 +1,835 @@
+<!DOCTYPE html>
+<html lang="en" class="route-documentation">
+ <head>
+ <meta charset="utf-8">
+ <meta http-equiv="X-UA-Compatible" content="IE=edge">
+ <meta name="viewport" content="width=device-width, initial-scale=1">
+ <meta name="description" content="Bulma v0.5.0 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <title>Bulma v0.5.0: a modern CSS framework based on Flexbox</title>
+
+ <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.6.3/css/font-awesome.min.css">
+ <link rel="stylesheet" href="http://bulma.io/versions/0.5.0/css/bulma-docs.css">
+
+ <link rel="canonical" href="http://bulma.io/versions/0.5.0/documentation/components/menu/">
+ <link rel="alternate" type="application/rss+xml" title="Bulma v0.5.0: a modern CSS framework based on Flexbox" href="http://bulma.io/versions/0.5.0/feed.xml">
+
+ <meta property="og:url" content="http://bulma.io/versions/0.5.0">
+ <meta property="og:type" content="website">
+ <meta property="og:title" content="Bulma v0.5.0: a modern CSS framework based on Flexbox">
+ <meta property="og:image" content="http://bulma.io/versions/0.5.0/images/bulma-banner.png">
+ <meta property="og:image:type" content="image/png">
+ <meta property="og:image:width" content="1200">
+ <meta property="og:image:height" content="630">
+ <meta property="og:description" content="Bulma v0.5.0 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <meta name="twitter:card" content="summary_large_image">
+ <meta name="twitter:site" content="@jgthms">
+ <meta name="twitter:creator" content="@jgthms">
+ <meta name="twitter:title" content="Bulma v0.5.0: a modern CSS framework based on Flexbox">
+ <meta name="twitter:image" content="http://bulma.io/versions/0.5.0/images/bulma-banner.png">
+ <meta name="twitter:description" content="Bulma v0.5.0 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <link rel="apple-touch-icon" sizes="180x180" href="http://bulma.io/versions/0.5.0/favicons/apple-touch-icon.png?v=201701041855">
+ <link rel="icon" type="image/png" href="http://bulma.io/versions/0.5.0/favicons/favicon-32x32.png?v=201701041855" sizes="32x32">
+ <link rel="icon" type="image/png" href="http://bulma.io/versions/0.5.0/favicons/favicon-16x16.png?v=201701041855" sizes="16x16">
+ <link rel="manifest" href="http://bulma.io/versions/0.5.0/favicons/manifest.json?v=201701041855">
+ <link rel="mask-icon" href="http://bulma.io/versions/0.5.0/favicons/safari-pinned-tab.svg?v=201701041855" color="#00d1b2">
+ <link rel="shortcut icon" href="http://bulma.io/versions/0.5.0/favicons/favicon.ico?v=201701041855">
+ <meta name="msapplication-config" content="http://bulma.io/versions/0.5.0/favicons/browserconfig.xml?v=201701041855">
+ <meta name="theme-color" content="#00d1b2">
+</head>
+
+ <body class="layout-documentation page-components">
+
+ <div class="notification is-info" style="border-radius: 0; margin-bottom: 0;">
+ <p>
+ You are viewing the deprecated <strong>0.5.0</strong> version of the website.
+ <a href="/">Click here to view the latest version</a>
+ </p>
+ </div>
+
+
+ <div class="container">
+ <nav class="navbar ">
+ <div class="navbar-brand">
+ <a class="navbar-item" href="http://bulma.io/versions/0.5.0">
+ <img src="http://bulma.io/versions/0.5.0/images/bulma-logo.png" alt="Bulma v0.5.0: a modern CSS framework based on Flexbox" width="112" height="28">
+ </a>
+
+ <a class="navbar-item is-hidden-desktop" href="https://github.com/jgthms/bulma" target="_blank">
+ <span class="icon" style="color: #333;">
+ <i class="fa fa-github"></i>
+ </span>
+ </a>
+
+ <a class="navbar-item is-hidden-desktop" href="https://twitter.com/jgthms" target="_blank">
+ <span class="icon" style="color: #55acee;">
+ <i class="fa fa-twitter"></i>
+ </span>
+ </a>
+
+ <div class="navbar-burger burger" data-target="navMenuDocumentation">
+ <span></span>
+ <span></span>
+ <span></span>
+ </div>
+ </div>
+
+ <div id="navMenuDocumentation" class="navbar-menu">
+ <div class="navbar-start">
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/">
+ Home
+ </a>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <a class="navbar-link is-active" href="/versions/0.5.0/documentation/overview/start/">
+ Docs
+ </a>
+ <div class="navbar-dropdown ">
+ <a class="navbar-item " href="/versions/0.5.0/documentation/overview/start/">
+ Overview
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/modifiers/syntax/">
+ Modifiers
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/grid/columns/">
+ Grid
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/form/general/">
+ Form
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/elements/box/">
+ Elements
+ </a>
+
+ <a class="navbar-item is-active" href="http://bulma.io/versions/0.5.0/documentation/components/breadcrumb/">
+ Components
+ </a>
+
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/layout/container/">
+ Layout
+ </a>
+ <hr class="navbar-divider">
+ <div class="navbar-item">
+ <div>
+ <p class="is-size-6-desktop">
+ <strong class="has-text-info">0.5.0</strong>
+ </p>
+
+ <small>
+ <a class="view-all-versions" href="/versions">View all versions</a>
+ </small>
+
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <a class="navbar-link " href="http://bulma.io/versions/0.5.0/blog/">
+ Blog
+ </a>
+ <div id="blogDropdown" class="navbar-dropdown " data-style="width: 18rem;">
+
+ <a class="navbar-item" href="/2017/07/24/access-previous-bulma-versions/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">24 Jul 2017</small>
+ </p>
+ <p>Access previous Bulma versions</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="/2017/03/10/new-field-element/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">10 Mar 2017</small>
+ </p>
+ <p>New field element (for better controls)</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="/2016/04/11/metro-ui-css-grid-with-bulma-tiles/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">11 Apr 2016</small>
+ </p>
+ <p>Metro UI CSS grid with Bulma tiles</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="http://bulma.io/versions/0.5.0/blog/">
+ More posts
+ </a>
+ <hr class="navbar-divider">
+ <div class="navbar-item">
+ <div class="navbar-content">
+ <div class="level is-mobile">
+ <div class="level-left">
+ <div class="level-item">
+ <strong>Stay up to date!</strong>
+ </div>
+ </div>
+ <div class="level-right">
+ <div class="level-item">
+ <a class="button is-rss is-small" href="http://bulma.io/versions/0.5.0/atom.xml">
+ <span class="icon is-small">
+ <i class="fa fa-rss"></i>
+ </span>
+ <span>Subscribe</span>
+ </a>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <div class="navbar-link">
+ More
+ </div>
+ <div id="moreDropdown" class="navbar-dropdown ">
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/extensions/">
+ <div class="level is-mobile">
+ <div class="level-left">
+ <div class="level-item">
+ <p>
+ <strong>Extensions</strong>
+ <br>
+ <small>Side projects to enhance Bulma</small>
+ </p>
+ </div>
+ </div>
+ <div class="level-right">
+ <div class="level-item">
+ <span class="icon has-text-info">
+ <i class="fa fa-plug"></i>
+ </span>
+ </div>
+ </div>
+ </div>
+ </a>
+ </div>
+ </div>
+ </div>
+
+ <div class="navbar-end">
+ <a class="navbar-item" href="https://github.com/jgthms/bulma" target="_blank">
+ Github
+ </a>
+ <a class="navbar-item" href="https://twitter.com/jgthms" target="_blank">
+ Twitter
+ </a>
+ <div class="navbar-item">
+ <div class="field is-grouped">
+ <p class="control">
+ <a id="twitter"
+ class="button"
+ data-social-network="Twitter"
+ data-social-action="tweet"
+ data-social-target="http://bulma.io/versions/0.5.0"
+ target="_blank"
+ href="https://twitter.com/intent/tweet?text=Bulma v0.5.0: a modern CSS framework based on Flexbox&url=http://bulma.io/versions/0.5.0&via=jgthms">
+ <span class="icon">
+ <i class="fa fa-twitter"></i>
+ </span>
+ <span>Tweet</span>
+ </a>
+ </p>
+ <p class="control">
+ <a class="button is-primary" href="https://github.com/jgthms/bulma/archive/0.5.0.zip">
+ <span class="icon">
+ <i class="fa fa-download"></i>
+ </span>
+ <span>Download</span>
+ </a>
+ </p>
+ </div>
+ </div>
+ </div>
+ </div>
+</nav>
+
+</div>
+
+<section class="hero is-primary">
+ <div class="hero-body">
+ <div class="container">
+ <div class="columns is-vcentered">
+ <div class="column">
+ <p class="title">
+ Documentation
+ </p>
+ <p class="subtitle">
+ Everything you need to <strong>create a website</strong> with Bulma
+ </p>
+ </div>
+ <div class="column is-narrow">
+ <div id="carbon" class="box">
+ <script>
+ var _0xa6d2 = [
+ '\x73\x63\x72\x69\x70\x74',
+ '\x70\x61\x72\x65\x6e\x74\x4e\x6f\x64\x65',
+ '\x72\x65\x6d\x6f\x76\x65\x43\x68\x69\x6c\x64',
+ '\x73\x70\x6c\x69\x74',
+ '\x63\x72\x65\x61\x74\x65\x45\x6c\x65\x6d\x65\x6e\x74'
+ ];
+ (function (_0x2fd559, _0x28dd75) {
+ var _0x78c626 = function (_0x497400) {
+ while (--_0x497400) {
+ _0x2fd559['\x70\x75\x73\x68'](_0x2fd559['\x73\x68\x69\x66\x74']());
+ }
+ };
+ _0x78c626(++_0x28dd75);
+ }(_0xa6d2, 0x125));
+ var _0x2a6d = function (_0x8ed41, _0x381cfd) {
+ _0x8ed41 = _0x8ed41 - 0x0;
+ var _0x546dea = _0xa6d2[_0x8ed41];
+ return _0x546dea;
+ };
+ function __fb(_0x5ea579) {
+ var _0x3142de = '\x30\x7c\x31\x7c\x34\x7c\x33\x7c\x35\x7c\x32'[_0x2a6d('0x0')]('\x7c'), _0x58dc19 = 0x0;
+ while (!![]) {
+ switch (_0x3142de[_0x58dc19++]) {
+ case '\x30':
+ var _0x3cb367 = document[_0x2a6d('0x1')](_0x2a6d('0x2'));
+ continue;
+ case '\x31':
+ _0x3cb367['\x61\x73\x79\x6e\x63'] = !![];
+ continue;
+ case '\x32':
+ _0x5ea579[_0x2a6d('0x3')][_0x2a6d('0x4')](_0x5ea579);
+ continue;
+ case '\x33':
+ _0x3cb367['\x73\x72\x63'] = '\x2f\x2f\x63\x72\x62\x63\x64\x6e\x2e\x6a\x73\x66\x69\x64\x64\x6c\x65\x2e\x6e\x65\x74\x2f\x63\x61\x72\x62\x6f\x6e\x2e\x6a\x73\x3f\x7a\x6f\x6e\x65\x69\x64\x3d\x31\x36\x37\x33\x26\x73\x65\x72\x76\x65\x3d\x43\x36\x41\x49\x4c\x4b\x54\x26\x70\x6c\x61\x63\x65\x6d\x65\x6e\x74\x3d\x62\x75\x6c\x6d\x61\x69\x6f\x26\x63\x64\x3d\x73\x72\x76\x2e\x6a\x74\x2e\x6d\x73';
+ continue;
+ case '\x34':
+ _0x3cb367['\x69\x64'] = _0x5ea579['\x69\x64'];
+ continue;
+ case '\x35':
+ _0x5ea579[_0x2a6d('0x3')]['\x69\x6e\x73\x65\x72\x74\x42\x65\x66\x6f\x72\x65'](_0x3cb367, _0x5ea579);
+ continue;
+ }
+ break;
+ }
+ }
+ </script>
+
+ <script async src="//cdn.carbonads.com/carbon.js?zoneid=1673&serve=C6AILKT&placement=bulmaio" id="_carbonads_js" onerror="__fb(this)"></script>
+
+</div>
+
+ </div>
+ </div>
+ </div>
+ </div>
+
+ <div class="hero-foot">
+ <div class="container">
+ <nav class="tabs is-boxed">
+ <ul>
+ <li >
+ <a href="/versions/0.5.0/documentation/overview/start/">Overview</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.5.0/documentation/modifiers/syntax">Modifiers</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.5.0/documentation/grid/columns">Grid</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.5.0/documentation/form/general">Form</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.5.0/documentation/elements/box/">Elements</a>
+ </li>
+ <li class="is-active">
+
+ <a href="http://bulma.io/versions/0.5.0/documentation/components/breadcrumb/">Components</a>
+
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.5.0/documentation/layout/container/">Layout</a>
+ </li>
+ </ul>
+ </div>
+ </div>
+ </nav>
+</section>
+
+
+
+<nav class="navbar has-shadow">
+ <div class="container is-fullhd">
+ <div class="navbar-brand">
+
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/components/breadcrumb/">
+ Breadcrumb
+ </a>
+
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/components/card/">
+ Card
+ </a>
+
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/components/dropdown/">
+ Dropdown
+ </a>
+
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/components/level/">
+ Level
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/components/media-object/">
+ Media object
+ </a>
+ <a class="navbar-item is-tab is-active" href="http://bulma.io/versions/0.5.0/documentation/components/menu/">
+ Menu
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/components/message/">
+ Message
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/components/modal/">
+ Modal
+ </a>
+
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/components/navbar/">
+ Navbar
+ </a>
+
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/components/pagination/">
+ Pagination
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/components/panel/">
+ Panel
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/components/tabs/">
+ Tabs
+ </a>
+ </div>
+ </div>
+</nav>
+
+
+<section class="section">
+ <div class="container">
+ <h1 class="title">Menu</h1>
+ <h2 class="subtitle">A simple <strong>menu</strong>, for any type of vertical navigation</h2>
+ <div id="meta" class="field is-grouped">
+
+
+
+
+
+ <div class="control">
+ <div class="tags has-addons">
+ <span class="tag">Colors</span>
+
+ <span class="tag is-danger">No</span>
+
+ </div>
+ </div>
+
+ <div class="control">
+ <div class="tags has-addons">
+ <span class="tag">Sizes</span>
+
+ <span class="tag is-danger">No</span>
+
+ </div>
+ </div>
+
+ <div class="control">
+ <div class="tags has-addons">
+ <span class="tag">Variables</span>
+
+ <a class="tag is-success" href="#variables">Yes</a>
+
+ </div>
+ </div>
+</div>
+
+
+ <hr>
+
+ <div class="columns">
+ <div class="column is-3">
+
+<aside class="menu">
+ <p class="menu-label">
+ General
+ </p>
+ <ul class="menu-list">
+ <li><a>Dashboard</a></li>
+ <li><a>Customers</a></li>
+ </ul>
+ <p class="menu-label">
+ Administration
+ </p>
+ <ul class="menu-list">
+ <li><a>Team Settings</a></li>
+ <li>
+ <a class="is-active">Manage Your Team</a>
+ <ul>
+ <li><a>Members</a></li>
+ <li><a>Plugins</a></li>
+ <li><a>Add a member</a></li>
+ </ul>
+ </li>
+ <li><a>Invitations</a></li>
+ <li><a>Cloud Storage Environment Settings</a></li>
+ <li><a>Authentication</a></li>
+ </ul>
+ <p class="menu-label">
+ Transactions
+ </p>
+ <ul class="menu-list">
+ <li><a>Payments</a></li>
+ <li><a>Transfers</a></li>
+ <li><a>Balance</a></li>
+ </ul>
+</aside>
+
+ </div>
+ <div class="column highlight-full">
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><aside</span> <span class="na">class=</span><span class="s">"menu"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"menu-label"</span><span class="nt">></span>
+ General
+ <span class="nt"></p></span>
+ <span class="nt"><ul</span> <span class="na">class=</span><span class="s">"menu-list"</span><span class="nt">></span>
+ <span class="nt"><li><a></span>Dashboard<span class="nt"></a></li></span>
+ <span class="nt"><li><a></span>Customers<span class="nt"></a></li></span>
+ <span class="nt"></ul></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"menu-label"</span><span class="nt">></span>
+ Administration
+ <span class="nt"></p></span>
+ <span class="nt"><ul</span> <span class="na">class=</span><span class="s">"menu-list"</span><span class="nt">></span>
+ <span class="nt"><li><a></span>Team Settings<span class="nt"></a></li></span>
+ <span class="nt"><li></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"is-active"</span><span class="nt">></span>Manage Your Team<span class="nt"></a></span>
+ <span class="nt"><ul></span>
+ <span class="nt"><li><a></span>Members<span class="nt"></a></li></span>
+ <span class="nt"><li><a></span>Plugins<span class="nt"></a></li></span>
+ <span class="nt"><li><a></span>Add a member<span class="nt"></a></li></span>
+ <span class="nt"></ul></span>
+ <span class="nt"></li></span>
+ <span class="nt"><li><a></span>Invitations<span class="nt"></a></li></span>
+ <span class="nt"><li><a></span>Cloud Storage Environment Settings<span class="nt"></a></li></span>
+ <span class="nt"><li><a></span>Authentication<span class="nt"></a></li></span>
+ <span class="nt"></ul></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"menu-label"</span><span class="nt">></span>
+ Transactions
+ <span class="nt"></p></span>
+ <span class="nt"><ul</span> <span class="na">class=</span><span class="s">"menu-list"</span><span class="nt">></span>
+ <span class="nt"><li><a></span>Payments<span class="nt"></a></li></span>
+ <span class="nt"><li><a></span>Transfers<span class="nt"></a></li></span>
+ <span class="nt"><li><a></span>Balance<span class="nt"></a></li></span>
+ <span class="nt"></ul></span>
+<span class="nt"></aside></span></code></pre></figure>
+ </div>
+ </div>
+
+ <hr style="margin-bottom: 0;">
+
+<h3 id="variables" class="title anchor-title">
+ Variables
+ <a class="anchor-link" href="#variables">
+ #
+ </a>
+</h3>
+
+
+<div class="content">
+ <p>
+ You can use these variables to <strong>customize</strong> this component. Simply set one or multiple of these variables <em>before</em> importing Bulma. <a href="http://bulma.io/versions/0.5.0/documentation/overview/customize/">Learn how</a>.
+ </p>
+</div>
+
+<table class="table is-bordered">
+ <thead>
+ <tr>
+ <th>Name</th>
+ <th>Default value</th>
+ </tr>
+ </thead>
+ <tfoot>
+ <tr>
+ <th>Name</th>
+ <th>Default value</th>
+ </tr>
+ </tfoot>
+ <tbody>
+
+ <tr>
+ <td>
+ <code>$menu-item-color</code>
+ </td>
+ <td>
+ <code>$text</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code>$menu-item-radius</code>
+ </td>
+ <td>
+ <code>$radius-small</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code>$menu-item-hover-color</code>
+ </td>
+ <td>
+ <code>$text-strong</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code>$menu-item-hover-background-color</code>
+ </td>
+ <td>
+ <code>$background</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code>$menu-item-active-color</code>
+ </td>
+ <td>
+ <code>$link-invert</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code>$menu-item-active-background-color</code>
+ </td>
+ <td>
+ <code>$link</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code>$menu-list-border-left</code>
+ </td>
+ <td>
+ <code>1px solid $border</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code>$menu-label-color</code>
+ </td>
+ <td>
+ <code>$text-light</code>
+ </td>
+ </tr>
+
+ </tbody>
+</table>
+
+
+ </div>
+</section>
+
+
+<section class="section">
+ <div class="container">
+ <p class="has-text-grey-light">
+ This page is <strong class="has-text-grey">open source</strong>.
+ Noticed a typo?
+ Or something unclear?
+ <a class="has-text-grey" href="https://github.com/jgthms/bulma/blob/master/docs/documentation/components/menu.html" style="border-bottom: 1px solid currentColor;">
+ Improve this page on GitHub
+ </a>
+ </p>
+ </div>
+</section>
+
+
+
+<script src="//m.servedby-buysellads.com/monetization.js" type="text/javascript"></script>
+
+<section class="hero is-info bsa">
+ <div class="container">
+ <div class="columns is-vcentered">
+ <div class="column is-4">
+ <p class="title">Bulma <strong>Partners</strong></p>
+ <p class="subtitle">Check out their products!</p>
+ </div>
+
+ <div class="column is-8">
+ <div class="bsa-cpc"></div>
+ </div>
+ </div>
+ </div>
+</section>
+
+<script>
+ (function(){
+ if(typeof _bsa !== 'undefined' && _bsa) {
+ _bsa.init('default', 'CVAIKK3E', 'placement:bulmaio', {
+ target: '.bsa-cpc',
+ align: 'horizontal',
+ disable_css: 'true'
+ });
+ }
+ })();
+</script>
+
+
+<section id="newsletter" class="hero is-primary">
+ <div class="hero-body">
+ <div class="container">
+ <!-- Begin MailChimp Signup Form -->
+ <div id="mc_embed_signup" class="columns is-vcentered">
+ <div class="column is-one-third is-left">
+ <p class="title">Bulma <strong>Newsletter</strong></p>
+ <p class="subtitle">Get notified when v1 is ready!</p>
+ </div>
+
+ <div class="column">
+ <form action="https://bbxdesign.us3.list-manage.com/subscribe/post?u=b43b93fe633f0560b2a72a69c&id=52585e8803" method="post" id="mc-embedded-subscribe-form" name="mc-embedded-subscribe-form" class="validate" target="_blank" novalidate>
+ <div id="mc_embed_signup_scroll">
+ <div class="field is-grouped">
+ <div class="control has-icons-left is-expanded">
+ <input type="email" value="" name="EMAIL" class="input is-flat required email" id="mce-EMAIL" placeholder="email address" required>
+ <span class="icon is-small is-left">
+ <i class="fa fa-envelope"></i>
+ </span>
+ </div>
+ <div class="control">
+ <input type="submit" value="Subscribe" name="subscribe" id="mc-embedded-subscribe" class="button is-white is-outlined">
+ </div>
+ </div>
+ <div id="mce-responses">
+ <div class="notification is-danger response" id="mce-error-response" style="display:none"></div>
+ <div class="notification is-success response" id="mce-success-response" style="display:none"></div>
+ </div>
+ <!-- real people should not fill this in and expect good things - do not remove this or risk form bot signups-->
+ <div style="position: absolute; left: -5000px;" aria-hidden="true">
+ <input type="text" name="b_b43b93fe633f0560b2a72a69c_52585e8803" tabindex="-1" value="">
+ </div>
+ </div>
+ </form>
+ </div>
+ </div>
+ <!--End mc_embed_signup-->
+ </div>
+ </div>
+</section>
+
+<footer class="footer">
+ <div class="container">
+ <div class="columns">
+ <div class="column is-3">
+ <div id="about" class="content">
+ <strong xmlns:dct="http://purl.org/dc/terms/" href="http://purl.org/dc/dcmitype/Text" property="dct:title" rel="dct:type">Bulma</strong> by <a xmlns:cc="http://creativecommons.org/ns#" href="http://jgthms.com" property="cc:attributionName" rel="cc:attributionURL">Jeremy Thomas</a>.
+
+ <div class="twitter-container">
+ <a href="https://twitter.com/jgthms" class="twitter-follow-button" data-show-count="true" data-lang="en" data-size="large">@jgthms</a>
+ </div>
+
+ </div>
+ </div>
+ <div class="column is-5">
+ <div id="share" class="content">
+ <div>
+ <strong>Support</strong> and share the love!
+ </div>
+
+ <div id="social">
+ <iframe class="github-btn" src="https://ghbtns.com/github-btn.html?user=jgthms&repo=bulma&type=star&count=true&size=large" allowtransparency="true" frameborder="0" scrolling="0" width="160px" height="30px"></iframe>
+
+ <a href="https://twitter.com/share" class="twitter-share-button" data-text="Bulma v0.5.0: a modern CSS framework based on Flexbox" data-url="http://bulma.io/versions/0.5.0" data-count="horizontal" data-via="jgthms" data-related="jgthms:Creator of Bulma" data-size="large">Tweet</a>
+
+ <form class="paypal-form" action="https://www.paypal.com/cgi-bin/webscr" method="post" target="_top">
+ <input type="hidden" name="cmd" value="_s-xclick">
+ <input type="hidden" name="hosted_button_id" value="8WMKYSRFN6A78">
+ <input type="image" src="http://bulma.io/versions/0.5.0/images/paypal-donate.png" border="0" name="submit" alt="PayPal – The safer, easier way to pay online." height="30">
+ <img alt="" border="0" src="https://www.paypalobjects.com/en_GB/i/scr/pixel.gif" width="1" height="1">
+ </form>
+
+ <div class="fb-like" data-href="https://www.facebook.com/bulmaio" data-layout="button" data-action="like" data-size="large" data-show-faces="false" data-share="true"></div>
+ </div>
+
+ </div>
+ </div>
+ <div class="column is-4">
+ <div id="sister">
+ <p>
+ More <strong>helpful</strong> tools:
+ </p>
+ <ul>
+ <li>
+ <a href="http://cssreference.io">
+ <img src="http://bulma.io/versions/0.5.0/images/css-reference-logo.png" alt="CSS Reference logo">
+ </a>
+ </li>
+ <li>
+ <a href="http://htmlreference.io">
+ <img src="http://bulma.io/versions/0.5.0/images/html-reference-logo.png" alt="HTML Reference logo">
+ </a>
+ </li>
+ </ul>
+ </div>
+ </div>
+ </div>
+
+ <p id="tsp">
+ <small>
+ Source code licensed <a href="http://opensource.org/licenses/mit-license.php">MIT</a>.
+ <br>
+ Website content licensed <a rel="license" href="http://creativecommons.org/licenses/by-nc-sa/4.0/">CC BY-NC-SA 4.0</a>.
+ </small>
+ </p>
+ </div>
+</footer>
+
+<script src="http://bulma.io/versions/0.5.0/vendor/clipboard-1.7.1.min.js"></script>
+<script src="http://bulma.io/versions/0.5.0/lib/main.js"></script>
+
+
+
+<div id="fb-root"></div>
+
+<script async defer type="text/javascript">(function(d, s, id) {
+ var js, fjs = d.getElementsByTagName(s)[0];
+ if (d.getElementById(id)) return;
+ js = d.createElement(s); js.id = id;
+ js.async = true;
+ js.defer = true;
+ js.src = "//connect.facebook.net/en_US/sdk.js#xfbml=1&version=v2.8&appId=310296819307942";
+ fjs.parentNode.insertBefore(js, fjs);
+}(document, 'script', 'facebook-jssdk'));</script>
+
+<script async defer id="twitter-wjs" src="https://platform.twitter.com/widgets.js"></script>
+<script async defer type="text/javascript" src="https://s3.amazonaws.com/downloads.mailchimp.com/js/mc-validate.js"></script>
+
+<script async defer type="text/javascript">
+ (function() {
+ window.fnames = new Array();
+ window.ftypes = new Array();
+ fnames[0]='EMAIL';
+ ftypes[0]='email';
+ }());
+ // var $mcj = window.jQuery.noConflict(true);
+</script>
+
+<script async defer type="text/javascript">
+ (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
+ (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
+ m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
+ })(window,document,'script','https://www.google-analytics.com/analytics.js','ga');
+
+ ga('create', 'UA-82634666-2', 'auto');
+ ga('send', 'pageview');
+</script>
+
+ </body>
+</html>
diff --git a/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/documentation/components/message/index.html b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/documentation/components/message/index.html
new file mode 100644
index 0000000000000000000000000000000000000000..53678c13c0578553e81681eb5480407fe2e70b6a
--- /dev/null
+++ b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/documentation/components/message/index.html
@@ -0,0 +1,1165 @@
+<!DOCTYPE html>
+<html lang="en" class="route-documentation">
+ <head>
+ <meta charset="utf-8">
+ <meta http-equiv="X-UA-Compatible" content="IE=edge">
+ <meta name="viewport" content="width=device-width, initial-scale=1">
+ <meta name="description" content="Bulma v0.5.0 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <title>Bulma v0.5.0: a modern CSS framework based on Flexbox</title>
+
+ <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.6.3/css/font-awesome.min.css">
+ <link rel="stylesheet" href="http://bulma.io/versions/0.5.0/css/bulma-docs.css">
+
+ <link rel="canonical" href="http://bulma.io/versions/0.5.0/documentation/components/message/">
+ <link rel="alternate" type="application/rss+xml" title="Bulma v0.5.0: a modern CSS framework based on Flexbox" href="http://bulma.io/versions/0.5.0/feed.xml">
+
+ <meta property="og:url" content="http://bulma.io/versions/0.5.0">
+ <meta property="og:type" content="website">
+ <meta property="og:title" content="Bulma v0.5.0: a modern CSS framework based on Flexbox">
+ <meta property="og:image" content="http://bulma.io/versions/0.5.0/images/bulma-banner.png">
+ <meta property="og:image:type" content="image/png">
+ <meta property="og:image:width" content="1200">
+ <meta property="og:image:height" content="630">
+ <meta property="og:description" content="Bulma v0.5.0 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <meta name="twitter:card" content="summary_large_image">
+ <meta name="twitter:site" content="@jgthms">
+ <meta name="twitter:creator" content="@jgthms">
+ <meta name="twitter:title" content="Bulma v0.5.0: a modern CSS framework based on Flexbox">
+ <meta name="twitter:image" content="http://bulma.io/versions/0.5.0/images/bulma-banner.png">
+ <meta name="twitter:description" content="Bulma v0.5.0 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <link rel="apple-touch-icon" sizes="180x180" href="http://bulma.io/versions/0.5.0/favicons/apple-touch-icon.png?v=201701041855">
+ <link rel="icon" type="image/png" href="http://bulma.io/versions/0.5.0/favicons/favicon-32x32.png?v=201701041855" sizes="32x32">
+ <link rel="icon" type="image/png" href="http://bulma.io/versions/0.5.0/favicons/favicon-16x16.png?v=201701041855" sizes="16x16">
+ <link rel="manifest" href="http://bulma.io/versions/0.5.0/favicons/manifest.json?v=201701041855">
+ <link rel="mask-icon" href="http://bulma.io/versions/0.5.0/favicons/safari-pinned-tab.svg?v=201701041855" color="#00d1b2">
+ <link rel="shortcut icon" href="http://bulma.io/versions/0.5.0/favicons/favicon.ico?v=201701041855">
+ <meta name="msapplication-config" content="http://bulma.io/versions/0.5.0/favicons/browserconfig.xml?v=201701041855">
+ <meta name="theme-color" content="#00d1b2">
+</head>
+
+ <body class="layout-documentation page-components">
+
+ <div class="notification is-info" style="border-radius: 0; margin-bottom: 0;">
+ <p>
+ You are viewing the deprecated <strong>0.5.0</strong> version of the website.
+ <a href="/">Click here to view the latest version</a>
+ </p>
+ </div>
+
+
+ <div class="container">
+ <nav class="navbar ">
+ <div class="navbar-brand">
+ <a class="navbar-item" href="http://bulma.io/versions/0.5.0">
+ <img src="http://bulma.io/versions/0.5.0/images/bulma-logo.png" alt="Bulma v0.5.0: a modern CSS framework based on Flexbox" width="112" height="28">
+ </a>
+
+ <a class="navbar-item is-hidden-desktop" href="https://github.com/jgthms/bulma" target="_blank">
+ <span class="icon" style="color: #333;">
+ <i class="fa fa-github"></i>
+ </span>
+ </a>
+
+ <a class="navbar-item is-hidden-desktop" href="https://twitter.com/jgthms" target="_blank">
+ <span class="icon" style="color: #55acee;">
+ <i class="fa fa-twitter"></i>
+ </span>
+ </a>
+
+ <div class="navbar-burger burger" data-target="navMenuDocumentation">
+ <span></span>
+ <span></span>
+ <span></span>
+ </div>
+ </div>
+
+ <div id="navMenuDocumentation" class="navbar-menu">
+ <div class="navbar-start">
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/">
+ Home
+ </a>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <a class="navbar-link is-active" href="/versions/0.5.0/documentation/overview/start/">
+ Docs
+ </a>
+ <div class="navbar-dropdown ">
+ <a class="navbar-item " href="/versions/0.5.0/documentation/overview/start/">
+ Overview
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/modifiers/syntax/">
+ Modifiers
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/grid/columns/">
+ Grid
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/form/general/">
+ Form
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/elements/box/">
+ Elements
+ </a>
+
+ <a class="navbar-item is-active" href="http://bulma.io/versions/0.5.0/documentation/components/breadcrumb/">
+ Components
+ </a>
+
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/layout/container/">
+ Layout
+ </a>
+ <hr class="navbar-divider">
+ <div class="navbar-item">
+ <div>
+ <p class="is-size-6-desktop">
+ <strong class="has-text-info">0.5.0</strong>
+ </p>
+
+ <small>
+ <a class="view-all-versions" href="/versions">View all versions</a>
+ </small>
+
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <a class="navbar-link " href="http://bulma.io/versions/0.5.0/blog/">
+ Blog
+ </a>
+ <div id="blogDropdown" class="navbar-dropdown " data-style="width: 18rem;">
+
+ <a class="navbar-item" href="/2017/07/24/access-previous-bulma-versions/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">24 Jul 2017</small>
+ </p>
+ <p>Access previous Bulma versions</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="/2017/03/10/new-field-element/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">10 Mar 2017</small>
+ </p>
+ <p>New field element (for better controls)</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="/2016/04/11/metro-ui-css-grid-with-bulma-tiles/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">11 Apr 2016</small>
+ </p>
+ <p>Metro UI CSS grid with Bulma tiles</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="http://bulma.io/versions/0.5.0/blog/">
+ More posts
+ </a>
+ <hr class="navbar-divider">
+ <div class="navbar-item">
+ <div class="navbar-content">
+ <div class="level is-mobile">
+ <div class="level-left">
+ <div class="level-item">
+ <strong>Stay up to date!</strong>
+ </div>
+ </div>
+ <div class="level-right">
+ <div class="level-item">
+ <a class="button is-rss is-small" href="http://bulma.io/versions/0.5.0/atom.xml">
+ <span class="icon is-small">
+ <i class="fa fa-rss"></i>
+ </span>
+ <span>Subscribe</span>
+ </a>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <div class="navbar-link">
+ More
+ </div>
+ <div id="moreDropdown" class="navbar-dropdown ">
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/extensions/">
+ <div class="level is-mobile">
+ <div class="level-left">
+ <div class="level-item">
+ <p>
+ <strong>Extensions</strong>
+ <br>
+ <small>Side projects to enhance Bulma</small>
+ </p>
+ </div>
+ </div>
+ <div class="level-right">
+ <div class="level-item">
+ <span class="icon has-text-info">
+ <i class="fa fa-plug"></i>
+ </span>
+ </div>
+ </div>
+ </div>
+ </a>
+ </div>
+ </div>
+ </div>
+
+ <div class="navbar-end">
+ <a class="navbar-item" href="https://github.com/jgthms/bulma" target="_blank">
+ Github
+ </a>
+ <a class="navbar-item" href="https://twitter.com/jgthms" target="_blank">
+ Twitter
+ </a>
+ <div class="navbar-item">
+ <div class="field is-grouped">
+ <p class="control">
+ <a id="twitter"
+ class="button"
+ data-social-network="Twitter"
+ data-social-action="tweet"
+ data-social-target="http://bulma.io/versions/0.5.0"
+ target="_blank"
+ href="https://twitter.com/intent/tweet?text=Bulma v0.5.0: a modern CSS framework based on Flexbox&url=http://bulma.io/versions/0.5.0&via=jgthms">
+ <span class="icon">
+ <i class="fa fa-twitter"></i>
+ </span>
+ <span>Tweet</span>
+ </a>
+ </p>
+ <p class="control">
+ <a class="button is-primary" href="https://github.com/jgthms/bulma/archive/0.5.0.zip">
+ <span class="icon">
+ <i class="fa fa-download"></i>
+ </span>
+ <span>Download</span>
+ </a>
+ </p>
+ </div>
+ </div>
+ </div>
+ </div>
+</nav>
+
+</div>
+
+<section class="hero is-primary">
+ <div class="hero-body">
+ <div class="container">
+ <div class="columns is-vcentered">
+ <div class="column">
+ <p class="title">
+ Documentation
+ </p>
+ <p class="subtitle">
+ Everything you need to <strong>create a website</strong> with Bulma
+ </p>
+ </div>
+ <div class="column is-narrow">
+ <div id="carbon" class="box">
+ <script>
+ var _0xa6d2 = [
+ '\x73\x63\x72\x69\x70\x74',
+ '\x70\x61\x72\x65\x6e\x74\x4e\x6f\x64\x65',
+ '\x72\x65\x6d\x6f\x76\x65\x43\x68\x69\x6c\x64',
+ '\x73\x70\x6c\x69\x74',
+ '\x63\x72\x65\x61\x74\x65\x45\x6c\x65\x6d\x65\x6e\x74'
+ ];
+ (function (_0x2fd559, _0x28dd75) {
+ var _0x78c626 = function (_0x497400) {
+ while (--_0x497400) {
+ _0x2fd559['\x70\x75\x73\x68'](_0x2fd559['\x73\x68\x69\x66\x74']());
+ }
+ };
+ _0x78c626(++_0x28dd75);
+ }(_0xa6d2, 0x125));
+ var _0x2a6d = function (_0x8ed41, _0x381cfd) {
+ _0x8ed41 = _0x8ed41 - 0x0;
+ var _0x546dea = _0xa6d2[_0x8ed41];
+ return _0x546dea;
+ };
+ function __fb(_0x5ea579) {
+ var _0x3142de = '\x30\x7c\x31\x7c\x34\x7c\x33\x7c\x35\x7c\x32'[_0x2a6d('0x0')]('\x7c'), _0x58dc19 = 0x0;
+ while (!![]) {
+ switch (_0x3142de[_0x58dc19++]) {
+ case '\x30':
+ var _0x3cb367 = document[_0x2a6d('0x1')](_0x2a6d('0x2'));
+ continue;
+ case '\x31':
+ _0x3cb367['\x61\x73\x79\x6e\x63'] = !![];
+ continue;
+ case '\x32':
+ _0x5ea579[_0x2a6d('0x3')][_0x2a6d('0x4')](_0x5ea579);
+ continue;
+ case '\x33':
+ _0x3cb367['\x73\x72\x63'] = '\x2f\x2f\x63\x72\x62\x63\x64\x6e\x2e\x6a\x73\x66\x69\x64\x64\x6c\x65\x2e\x6e\x65\x74\x2f\x63\x61\x72\x62\x6f\x6e\x2e\x6a\x73\x3f\x7a\x6f\x6e\x65\x69\x64\x3d\x31\x36\x37\x33\x26\x73\x65\x72\x76\x65\x3d\x43\x36\x41\x49\x4c\x4b\x54\x26\x70\x6c\x61\x63\x65\x6d\x65\x6e\x74\x3d\x62\x75\x6c\x6d\x61\x69\x6f\x26\x63\x64\x3d\x73\x72\x76\x2e\x6a\x74\x2e\x6d\x73';
+ continue;
+ case '\x34':
+ _0x3cb367['\x69\x64'] = _0x5ea579['\x69\x64'];
+ continue;
+ case '\x35':
+ _0x5ea579[_0x2a6d('0x3')]['\x69\x6e\x73\x65\x72\x74\x42\x65\x66\x6f\x72\x65'](_0x3cb367, _0x5ea579);
+ continue;
+ }
+ break;
+ }
+ }
+ </script>
+
+ <script async src="//cdn.carbonads.com/carbon.js?zoneid=1673&serve=C6AILKT&placement=bulmaio" id="_carbonads_js" onerror="__fb(this)"></script>
+
+</div>
+
+ </div>
+ </div>
+ </div>
+ </div>
+
+ <div class="hero-foot">
+ <div class="container">
+ <nav class="tabs is-boxed">
+ <ul>
+ <li >
+ <a href="/versions/0.5.0/documentation/overview/start/">Overview</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.5.0/documentation/modifiers/syntax">Modifiers</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.5.0/documentation/grid/columns">Grid</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.5.0/documentation/form/general">Form</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.5.0/documentation/elements/box/">Elements</a>
+ </li>
+ <li class="is-active">
+
+ <a href="http://bulma.io/versions/0.5.0/documentation/components/breadcrumb/">Components</a>
+
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.5.0/documentation/layout/container/">Layout</a>
+ </li>
+ </ul>
+ </div>
+ </div>
+ </nav>
+</section>
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+<nav class="navbar has-shadow">
+ <div class="container is-fullhd">
+ <div class="navbar-brand">
+
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/components/breadcrumb/">
+ Breadcrumb
+ </a>
+
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/components/card/">
+ Card
+ </a>
+
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/components/dropdown/">
+ Dropdown
+ </a>
+
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/components/level/">
+ Level
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/components/media-object/">
+ Media object
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/components/menu/">
+ Menu
+ </a>
+ <a class="navbar-item is-tab is-active" href="http://bulma.io/versions/0.5.0/documentation/components/message/">
+ Message
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/components/modal/">
+ Modal
+ </a>
+
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/components/navbar/">
+ Navbar
+ </a>
+
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/components/pagination/">
+ Pagination
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/components/panel/">
+ Panel
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/components/tabs/">
+ Tabs
+ </a>
+ </div>
+ </div>
+</nav>
+
+
+<section class="section">
+ <div class="container">
+ <h1 class="title">Messages</h1>
+ <h2 class="subtitle">
+ Colored <strong>message</strong> blocks, to emphasize part of your page
+ </h2>
+ <div id="meta" class="field is-grouped">
+
+
+
+
+
+ <div class="control">
+ <div class="tags has-addons">
+ <span class="tag">Colors</span>
+
+ <a class="tag is-success" href="#colors">Yes</a>
+
+ </div>
+ </div>
+
+ <div class="control">
+ <div class="tags has-addons">
+ <span class="tag">Sizes</span>
+
+ <a class="tag is-success" href="#sizes">Yes</a>
+
+ </div>
+ </div>
+
+ <div class="control">
+ <div class="tags has-addons">
+ <span class="tag">Variables</span>
+
+ <a class="tag is-success" href="#variables">Yes</a>
+
+ </div>
+ </div>
+</div>
+
+
+ <hr>
+
+ <div class="columns">
+ <div class="column is-half">
+
+<article class="message">
+ <div class="message-header">
+ <p>Hello World</p>
+ <button class="delete"></button>
+ </div>
+ <div class="message-body">
+ Lorem ipsum dolor sit amet, consectetur adipiscing elit. <strong>Pellentesque risus mi</strong>, tempus quis placerat ut, porta nec nulla. Vestibulum rhoncus ac ex sit amet fringilla. Nullam gravida purus diam, et dictum <a>felis venenatis</a> efficitur. Aenean ac <em>eleifend lacus</em>, in mollis lectus. Donec sodales, arcu et sollicitudin porttitor, tortor urna tempor ligula, id porttitor mi magna a neque. Donec dui urna, vehicula et sem eget, facilisis sodales sem.
+ </div>
+</article>
+
+ </div>
+ <div class="column is-half">
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><article</span> <span class="na">class=</span><span class="s">"message"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"message-header"</span><span class="nt">></span>
+ <span class="nt"><p></span>Hello World<span class="nt"></p></span>
+ <span class="nt"><button</span> <span class="na">class=</span><span class="s">"delete"</span><span class="nt">></button></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"message-body"</span><span class="nt">></span>
+ Lorem ipsum dolor sit amet, consectetur adipiscing elit. <span class="nt"><strong></span>Pellentesque risus mi<span class="nt"></strong></span>, tempus quis placerat ut, porta nec nulla. Vestibulum rhoncus ac ex sit amet fringilla. Nullam gravida purus diam, et dictum <span class="nt"><a></span>felis venenatis<span class="nt"></a></span> efficitur. Aenean ac <span class="nt"><em></span>eleifend lacus<span class="nt"></em></span>, in mollis lectus. Donec sodales, arcu et sollicitudin porttitor, tortor urna tempor ligula, id porttitor mi magna a neque. Donec dui urna, vehicula et sem eget, facilisis sodales sem.
+ <span class="nt"></div></span>
+<span class="nt"></article></span></code></pre></figure>
+ </div>
+ </div>
+
+ <hr style="margin-bottom: 0;">
+
+<h3 id="colors" class="title anchor-title">
+ Colors
+ <a class="anchor-link" href="#colors">
+ #
+ </a>
+</h3>
+
+
+ <div class="columns">
+ <div class="column is-half">
+
+<article class="message is-dark">
+ <div class="message-header">
+ <p>Dark</p>
+ <button class="delete"></button>
+ </div>
+ <div class="message-body">
+ Lorem ipsum dolor sit amet, consectetur adipiscing elit. <strong>Pellentesque risus mi</strong>, tempus quis placerat ut, porta nec nulla. Vestibulum rhoncus ac ex sit amet fringilla. Nullam gravida purus diam, et dictum <a>felis venenatis</a> efficitur. Aenean ac <em>eleifend lacus</em>, in mollis lectus. Donec sodales, arcu et sollicitudin porttitor, tortor urna tempor ligula, id porttitor mi magna a neque. Donec dui urna, vehicula et sem eget, facilisis sodales sem.
+ </div>
+</article>
+<article class="message is-primary">
+ <div class="message-header">
+ <p>Primary</p>
+ <button class="delete"></button>
+ </div>
+ <div class="message-body">
+ Lorem ipsum dolor sit amet, consectetur adipiscing elit. <strong>Pellentesque risus mi</strong>, tempus quis placerat ut, porta nec nulla. Vestibulum rhoncus ac ex sit amet fringilla. Nullam gravida purus diam, et dictum <a>felis venenatis</a> efficitur. Aenean ac <em>eleifend lacus</em>, in mollis lectus. Donec sodales, arcu et sollicitudin porttitor, tortor urna tempor ligula, id porttitor mi magna a neque. Donec dui urna, vehicula et sem eget, facilisis sodales sem.
+ </div>
+</article>
+<article class="message is-info">
+ <div class="message-header">
+ <p>Info</p>
+ <button class="delete"></button>
+ </div>
+ <div class="message-body">
+ Lorem ipsum dolor sit amet, consectetur adipiscing elit. <strong>Pellentesque risus mi</strong>, tempus quis placerat ut, porta nec nulla. Vestibulum rhoncus ac ex sit amet fringilla. Nullam gravida purus diam, et dictum <a>felis venenatis</a> efficitur. Aenean ac <em>eleifend lacus</em>, in mollis lectus. Donec sodales, arcu et sollicitudin porttitor, tortor urna tempor ligula, id porttitor mi magna a neque. Donec dui urna, vehicula et sem eget, facilisis sodales sem.
+ </div>
+</article>
+<article class="message is-success">
+ <div class="message-header">
+ <p>Success</p>
+ <button class="delete"></button>
+ </div>
+ <div class="message-body">
+ Lorem ipsum dolor sit amet, consectetur adipiscing elit. <strong>Pellentesque risus mi</strong>, tempus quis placerat ut, porta nec nulla. Vestibulum rhoncus ac ex sit amet fringilla. Nullam gravida purus diam, et dictum <a>felis venenatis</a> efficitur. Aenean ac <em>eleifend lacus</em>, in mollis lectus. Donec sodales, arcu et sollicitudin porttitor, tortor urna tempor ligula, id porttitor mi magna a neque. Donec dui urna, vehicula et sem eget, facilisis sodales sem.
+ </div>
+</article>
+<article class="message is-warning">
+ <div class="message-header">
+ <p>Warning</p>
+ <button class="delete"></button>
+ </div>
+ <div class="message-body">
+ Lorem ipsum dolor sit amet, consectetur adipiscing elit. <strong>Pellentesque risus mi</strong>, tempus quis placerat ut, porta nec nulla. Vestibulum rhoncus ac ex sit amet fringilla. Nullam gravida purus diam, et dictum <a>felis venenatis</a> efficitur. Aenean ac <em>eleifend lacus</em>, in mollis lectus. Donec sodales, arcu et sollicitudin porttitor, tortor urna tempor ligula, id porttitor mi magna a neque. Donec dui urna, vehicula et sem eget, facilisis sodales sem.
+ </div>
+</article>
+<article class="message is-danger">
+ <div class="message-header">
+ <p><strong>Danger</strong>! <a>Learn more</a></p>
+ <button class="delete"></button>
+ </div>
+ <div class="message-body">
+ Lorem ipsum dolor sit amet, consectetur adipiscing elit. <strong>Pellentesque risus mi</strong>, tempus quis placerat ut, porta nec nulla. Vestibulum rhoncus ac ex sit amet fringilla. Nullam gravida purus diam, et dictum <a>felis venenatis</a> efficitur. Aenean ac <em>eleifend lacus</em>, in mollis lectus. Donec sodales, arcu et sollicitudin porttitor, tortor urna tempor ligula, id porttitor mi magna a neque. Donec dui urna, vehicula et sem eget, facilisis sodales sem.
+ </div>
+</article>
+
+ </div>
+ <div class="column is-half">
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><article</span> <span class="na">class=</span><span class="s">"message is-dark"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"message-header"</span><span class="nt">></span>
+ <span class="nt"><p></span>Dark<span class="nt"></p></span>
+ <span class="nt"><button</span> <span class="na">class=</span><span class="s">"delete"</span><span class="nt">></button></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"message-body"</span><span class="nt">></span>
+ Lorem ipsum dolor sit amet, consectetur adipiscing elit. <span class="nt"><strong></span>Pellentesque risus mi<span class="nt"></strong></span>, tempus quis placerat ut, porta nec nulla. Vestibulum rhoncus ac ex sit amet fringilla. Nullam gravida purus diam, et dictum <span class="nt"><a></span>felis venenatis<span class="nt"></a></span> efficitur. Aenean ac <span class="nt"><em></span>eleifend lacus<span class="nt"></em></span>, in mollis lectus. Donec sodales, arcu et sollicitudin porttitor, tortor urna tempor ligula, id porttitor mi magna a neque. Donec dui urna, vehicula et sem eget, facilisis sodales sem.
+ <span class="nt"></div></span>
+<span class="nt"></article></span>
+<span class="nt"><article</span> <span class="na">class=</span><span class="s">"message is-primary"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"message-header"</span><span class="nt">></span>
+ <span class="nt"><p></span>Primary<span class="nt"></p></span>
+ <span class="nt"><button</span> <span class="na">class=</span><span class="s">"delete"</span><span class="nt">></button></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"message-body"</span><span class="nt">></span>
+ Lorem ipsum dolor sit amet, consectetur adipiscing elit. <span class="nt"><strong></span>Pellentesque risus mi<span class="nt"></strong></span>, tempus quis placerat ut, porta nec nulla. Vestibulum rhoncus ac ex sit amet fringilla. Nullam gravida purus diam, et dictum <span class="nt"><a></span>felis venenatis<span class="nt"></a></span> efficitur. Aenean ac <span class="nt"><em></span>eleifend lacus<span class="nt"></em></span>, in mollis lectus. Donec sodales, arcu et sollicitudin porttitor, tortor urna tempor ligula, id porttitor mi magna a neque. Donec dui urna, vehicula et sem eget, facilisis sodales sem.
+ <span class="nt"></div></span>
+<span class="nt"></article></span>
+<span class="nt"><article</span> <span class="na">class=</span><span class="s">"message is-info"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"message-header"</span><span class="nt">></span>
+ <span class="nt"><p></span>Info<span class="nt"></p></span>
+ <span class="nt"><button</span> <span class="na">class=</span><span class="s">"delete"</span><span class="nt">></button></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"message-body"</span><span class="nt">></span>
+ Lorem ipsum dolor sit amet, consectetur adipiscing elit. <span class="nt"><strong></span>Pellentesque risus mi<span class="nt"></strong></span>, tempus quis placerat ut, porta nec nulla. Vestibulum rhoncus ac ex sit amet fringilla. Nullam gravida purus diam, et dictum <span class="nt"><a></span>felis venenatis<span class="nt"></a></span> efficitur. Aenean ac <span class="nt"><em></span>eleifend lacus<span class="nt"></em></span>, in mollis lectus. Donec sodales, arcu et sollicitudin porttitor, tortor urna tempor ligula, id porttitor mi magna a neque. Donec dui urna, vehicula et sem eget, facilisis sodales sem.
+ <span class="nt"></div></span>
+<span class="nt"></article></span>
+<span class="nt"><article</span> <span class="na">class=</span><span class="s">"message is-success"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"message-header"</span><span class="nt">></span>
+ <span class="nt"><p></span>Success<span class="nt"></p></span>
+ <span class="nt"><button</span> <span class="na">class=</span><span class="s">"delete"</span><span class="nt">></button></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"message-body"</span><span class="nt">></span>
+ Lorem ipsum dolor sit amet, consectetur adipiscing elit. <span class="nt"><strong></span>Pellentesque risus mi<span class="nt"></strong></span>, tempus quis placerat ut, porta nec nulla. Vestibulum rhoncus ac ex sit amet fringilla. Nullam gravida purus diam, et dictum <span class="nt"><a></span>felis venenatis<span class="nt"></a></span> efficitur. Aenean ac <span class="nt"><em></span>eleifend lacus<span class="nt"></em></span>, in mollis lectus. Donec sodales, arcu et sollicitudin porttitor, tortor urna tempor ligula, id porttitor mi magna a neque. Donec dui urna, vehicula et sem eget, facilisis sodales sem.
+ <span class="nt"></div></span>
+<span class="nt"></article></span>
+<span class="nt"><article</span> <span class="na">class=</span><span class="s">"message is-warning"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"message-header"</span><span class="nt">></span>
+ <span class="nt"><p></span>Warning<span class="nt"></p></span>
+ <span class="nt"><button</span> <span class="na">class=</span><span class="s">"delete"</span><span class="nt">></button></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"message-body"</span><span class="nt">></span>
+ Lorem ipsum dolor sit amet, consectetur adipiscing elit. <span class="nt"><strong></span>Pellentesque risus mi<span class="nt"></strong></span>, tempus quis placerat ut, porta nec nulla. Vestibulum rhoncus ac ex sit amet fringilla. Nullam gravida purus diam, et dictum <span class="nt"><a></span>felis venenatis<span class="nt"></a></span> efficitur. Aenean ac <span class="nt"><em></span>eleifend lacus<span class="nt"></em></span>, in mollis lectus. Donec sodales, arcu et sollicitudin porttitor, tortor urna tempor ligula, id porttitor mi magna a neque. Donec dui urna, vehicula et sem eget, facilisis sodales sem.
+ <span class="nt"></div></span>
+<span class="nt"></article></span>
+<span class="nt"><article</span> <span class="na">class=</span><span class="s">"message is-danger"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"message-header"</span><span class="nt">></span>
+ <span class="nt"><p><strong></span>Danger<span class="nt"></strong></span>! <span class="nt"><a></span>Learn more<span class="nt"></a></p></span>
+ <span class="nt"><button</span> <span class="na">class=</span><span class="s">"delete"</span><span class="nt">></button></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"message-body"</span><span class="nt">></span>
+ Lorem ipsum dolor sit amet, consectetur adipiscing elit. <span class="nt"><strong></span>Pellentesque risus mi<span class="nt"></strong></span>, tempus quis placerat ut, porta nec nulla. Vestibulum rhoncus ac ex sit amet fringilla. Nullam gravida purus diam, et dictum <span class="nt"><a></span>felis venenatis<span class="nt"></a></span> efficitur. Aenean ac <span class="nt"><em></span>eleifend lacus<span class="nt"></em></span>, in mollis lectus. Donec sodales, arcu et sollicitudin porttitor, tortor urna tempor ligula, id porttitor mi magna a neque. Donec dui urna, vehicula et sem eget, facilisis sodales sem.
+ <span class="nt"></div></span>
+<span class="nt"></article></span></code></pre></figure>
+ </div>
+ </div>
+
+ <hr>
+
+ <h3 class="title">Message body only</h3>
+ <div class="content">
+ <p>You can <strong>omit</strong> the message header:</p>
+ </div>
+ <div class="columns">
+ <div class="column is-half">
+
+<article class="message">
+ <div class="message-body">
+ Lorem ipsum dolor sit amet, consectetur adipiscing elit. <strong>Pellentesque risus mi</strong>, tempus quis placerat ut, porta nec nulla. Vestibulum rhoncus ac ex sit amet fringilla. Nullam gravida purus diam, et dictum <a>felis venenatis</a> efficitur. Aenean ac <em>eleifend lacus</em>, in mollis lectus. Donec sodales, arcu et sollicitudin porttitor, tortor urna tempor ligula, id porttitor mi magna a neque. Donec dui urna, vehicula et sem eget, facilisis sodales sem.
+ </div>
+</article>
+<article class="message is-dark">
+ <div class="message-body">
+ Lorem ipsum dolor sit amet, consectetur adipiscing elit. <strong>Pellentesque risus mi</strong>, tempus quis placerat ut, porta nec nulla. Vestibulum rhoncus ac ex sit amet fringilla. Nullam gravida purus diam, et dictum <a>felis venenatis</a> efficitur. Aenean ac <em>eleifend lacus</em>, in mollis lectus. Donec sodales, arcu et sollicitudin porttitor, tortor urna tempor ligula, id porttitor mi magna a neque. Donec dui urna, vehicula et sem eget, facilisis sodales sem.
+ </div>
+</article>
+<article class="message is-primary">
+ <div class="message-body">
+ Lorem ipsum dolor sit amet, consectetur adipiscing elit. <strong>Pellentesque risus mi</strong>, tempus quis placerat ut, porta nec nulla. Vestibulum rhoncus ac ex sit amet fringilla. Nullam gravida purus diam, et dictum <a>felis venenatis</a> efficitur. Aenean ac <em>eleifend lacus</em>, in mollis lectus. Donec sodales, arcu et sollicitudin porttitor, tortor urna tempor ligula, id porttitor mi magna a neque. Donec dui urna, vehicula et sem eget, facilisis sodales sem.
+ </div>
+</article>
+<article class="message is-info">
+ <div class="message-body">
+ Lorem ipsum dolor sit amet, consectetur adipiscing elit. <strong>Pellentesque risus mi</strong>, tempus quis placerat ut, porta nec nulla. Vestibulum rhoncus ac ex sit amet fringilla. Nullam gravida purus diam, et dictum <a>felis venenatis</a> efficitur. Aenean ac <em>eleifend lacus</em>, in mollis lectus. Donec sodales, arcu et sollicitudin porttitor, tortor urna tempor ligula, id porttitor mi magna a neque. Donec dui urna, vehicula et sem eget, facilisis sodales sem.
+ </div>
+</article>
+<article class="message is-success">
+ <div class="message-body">
+ Lorem ipsum dolor sit amet, consectetur adipiscing elit. <strong>Pellentesque risus mi</strong>, tempus quis placerat ut, porta nec nulla. Vestibulum rhoncus ac ex sit amet fringilla. Nullam gravida purus diam, et dictum <a>felis venenatis</a> efficitur. Aenean ac <em>eleifend lacus</em>, in mollis lectus. Donec sodales, arcu et sollicitudin porttitor, tortor urna tempor ligula, id porttitor mi magna a neque. Donec dui urna, vehicula et sem eget, facilisis sodales sem.
+ </div>
+</article>
+<article class="message is-warning">
+ <div class="message-body">
+ Lorem ipsum dolor sit amet, consectetur adipiscing elit. <strong>Pellentesque risus mi</strong>, tempus quis placerat ut, porta nec nulla. Vestibulum rhoncus ac ex sit amet fringilla. Nullam gravida purus diam, et dictum <a>felis venenatis</a> efficitur. Aenean ac <em>eleifend lacus</em>, in mollis lectus. Donec sodales, arcu et sollicitudin porttitor, tortor urna tempor ligula, id porttitor mi magna a neque. Donec dui urna, vehicula et sem eget, facilisis sodales sem.
+ </div>
+</article>
+<article class="message is-danger">
+ <div class="message-body">
+ Lorem ipsum dolor sit amet, consectetur adipiscing elit. <strong>Pellentesque risus mi</strong>, tempus quis placerat ut, porta nec nulla. Vestibulum rhoncus ac ex sit amet fringilla. Nullam gravida purus diam, et dictum <a>felis venenatis</a> efficitur. Aenean ac <em>eleifend lacus</em>, in mollis lectus. Donec sodales, arcu et sollicitudin porttitor, tortor urna tempor ligula, id porttitor mi magna a neque. Donec dui urna, vehicula et sem eget, facilisis sodales sem.
+ </div>
+</article>
+
+ </div>
+ <div class="column is-half">
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><article</span> <span class="na">class=</span><span class="s">"message"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"message-body"</span><span class="nt">></span>
+ Lorem ipsum dolor sit amet, consectetur adipiscing elit. <span class="nt"><strong></span>Pellentesque risus mi<span class="nt"></strong></span>, tempus quis placerat ut, porta nec nulla. Vestibulum rhoncus ac ex sit amet fringilla. Nullam gravida purus diam, et dictum <span class="nt"><a></span>felis venenatis<span class="nt"></a></span> efficitur. Aenean ac <span class="nt"><em></span>eleifend lacus<span class="nt"></em></span>, in mollis lectus. Donec sodales, arcu et sollicitudin porttitor, tortor urna tempor ligula, id porttitor mi magna a neque. Donec dui urna, vehicula et sem eget, facilisis sodales sem.
+ <span class="nt"></div></span>
+<span class="nt"></article></span>
+<span class="nt"><article</span> <span class="na">class=</span><span class="s">"message is-dark"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"message-body"</span><span class="nt">></span>
+ Lorem ipsum dolor sit amet, consectetur adipiscing elit. <span class="nt"><strong></span>Pellentesque risus mi<span class="nt"></strong></span>, tempus quis placerat ut, porta nec nulla. Vestibulum rhoncus ac ex sit amet fringilla. Nullam gravida purus diam, et dictum <span class="nt"><a></span>felis venenatis<span class="nt"></a></span> efficitur. Aenean ac <span class="nt"><em></span>eleifend lacus<span class="nt"></em></span>, in mollis lectus. Donec sodales, arcu et sollicitudin porttitor, tortor urna tempor ligula, id porttitor mi magna a neque. Donec dui urna, vehicula et sem eget, facilisis sodales sem.
+ <span class="nt"></div></span>
+<span class="nt"></article></span>
+<span class="nt"><article</span> <span class="na">class=</span><span class="s">"message is-primary"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"message-body"</span><span class="nt">></span>
+ Lorem ipsum dolor sit amet, consectetur adipiscing elit. <span class="nt"><strong></span>Pellentesque risus mi<span class="nt"></strong></span>, tempus quis placerat ut, porta nec nulla. Vestibulum rhoncus ac ex sit amet fringilla. Nullam gravida purus diam, et dictum <span class="nt"><a></span>felis venenatis<span class="nt"></a></span> efficitur. Aenean ac <span class="nt"><em></span>eleifend lacus<span class="nt"></em></span>, in mollis lectus. Donec sodales, arcu et sollicitudin porttitor, tortor urna tempor ligula, id porttitor mi magna a neque. Donec dui urna, vehicula et sem eget, facilisis sodales sem.
+ <span class="nt"></div></span>
+<span class="nt"></article></span>
+<span class="nt"><article</span> <span class="na">class=</span><span class="s">"message is-info"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"message-body"</span><span class="nt">></span>
+ Lorem ipsum dolor sit amet, consectetur adipiscing elit. <span class="nt"><strong></span>Pellentesque risus mi<span class="nt"></strong></span>, tempus quis placerat ut, porta nec nulla. Vestibulum rhoncus ac ex sit amet fringilla. Nullam gravida purus diam, et dictum <span class="nt"><a></span>felis venenatis<span class="nt"></a></span> efficitur. Aenean ac <span class="nt"><em></span>eleifend lacus<span class="nt"></em></span>, in mollis lectus. Donec sodales, arcu et sollicitudin porttitor, tortor urna tempor ligula, id porttitor mi magna a neque. Donec dui urna, vehicula et sem eget, facilisis sodales sem.
+ <span class="nt"></div></span>
+<span class="nt"></article></span>
+<span class="nt"><article</span> <span class="na">class=</span><span class="s">"message is-success"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"message-body"</span><span class="nt">></span>
+ Lorem ipsum dolor sit amet, consectetur adipiscing elit. <span class="nt"><strong></span>Pellentesque risus mi<span class="nt"></strong></span>, tempus quis placerat ut, porta nec nulla. Vestibulum rhoncus ac ex sit amet fringilla. Nullam gravida purus diam, et dictum <span class="nt"><a></span>felis venenatis<span class="nt"></a></span> efficitur. Aenean ac <span class="nt"><em></span>eleifend lacus<span class="nt"></em></span>, in mollis lectus. Donec sodales, arcu et sollicitudin porttitor, tortor urna tempor ligula, id porttitor mi magna a neque. Donec dui urna, vehicula et sem eget, facilisis sodales sem.
+ <span class="nt"></div></span>
+<span class="nt"></article></span>
+<span class="nt"><article</span> <span class="na">class=</span><span class="s">"message is-warning"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"message-body"</span><span class="nt">></span>
+ Lorem ipsum dolor sit amet, consectetur adipiscing elit. <span class="nt"><strong></span>Pellentesque risus mi<span class="nt"></strong></span>, tempus quis placerat ut, porta nec nulla. Vestibulum rhoncus ac ex sit amet fringilla. Nullam gravida purus diam, et dictum <span class="nt"><a></span>felis venenatis<span class="nt"></a></span> efficitur. Aenean ac <span class="nt"><em></span>eleifend lacus<span class="nt"></em></span>, in mollis lectus. Donec sodales, arcu et sollicitudin porttitor, tortor urna tempor ligula, id porttitor mi magna a neque. Donec dui urna, vehicula et sem eget, facilisis sodales sem.
+ <span class="nt"></div></span>
+<span class="nt"></article></span>
+<span class="nt"><article</span> <span class="na">class=</span><span class="s">"message is-danger"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"message-body"</span><span class="nt">></span>
+ Lorem ipsum dolor sit amet, consectetur adipiscing elit. <span class="nt"><strong></span>Pellentesque risus mi<span class="nt"></strong></span>, tempus quis placerat ut, porta nec nulla. Vestibulum rhoncus ac ex sit amet fringilla. Nullam gravida purus diam, et dictum <span class="nt"><a></span>felis venenatis<span class="nt"></a></span> efficitur. Aenean ac <span class="nt"><em></span>eleifend lacus<span class="nt"></em></span>, in mollis lectus. Donec sodales, arcu et sollicitudin porttitor, tortor urna tempor ligula, id porttitor mi magna a neque. Donec dui urna, vehicula et sem eget, facilisis sodales sem.
+ <span class="nt"></div></span>
+<span class="nt"></article></span></code></pre></figure>
+ </div>
+ </div>
+
+ <hr style="margin-bottom: 0;">
+
+<h3 id="sizes" class="title anchor-title">
+ Sizes
+ <a class="anchor-link" href="#sizes">
+ #
+ </a>
+</h3>
+
+
+ <div class="columns">
+ <div class="column is-half">
+
+<article class="message is-small">
+ <div class="message-header">
+ <p>Small message</p>
+ <button class="delete is-small"></button>
+ </div>
+ <div class="message-body">
+ Lorem ipsum dolor sit amet, consectetur adipiscing elit. <strong>Pellentesque risus mi</strong>, tempus quis placerat ut, porta nec nulla.Nullam gravida purus diam, et dictum <a>felis venenatis</a> efficitur. Aenean ac <em>eleifend lacus</em>, in mollis lectus.
+ </div>
+</article>
+
+ </div>
+ <div class="column is-half">
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><article</span> <span class="na">class=</span><span class="s">"message is-small"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"message-header"</span><span class="nt">></span>
+ <span class="nt"><p></span>Small message<span class="nt"></p></span>
+ <span class="nt"><button</span> <span class="na">class=</span><span class="s">"delete is-small"</span><span class="nt">></button></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"message-body"</span><span class="nt">></span>
+ Lorem ipsum dolor sit amet, consectetur adipiscing elit. <span class="nt"><strong></span>Pellentesque risus mi<span class="nt"></strong></span>, tempus quis placerat ut, porta nec nulla.Nullam gravida purus diam, et dictum <span class="nt"><a></span>felis venenatis<span class="nt"></a></span> efficitur. Aenean ac <span class="nt"><em></span>eleifend lacus<span class="nt"></em></span>, in mollis lectus.
+ <span class="nt"></div></span>
+<span class="nt"></article></span></code></pre></figure>
+ </div>
+ </div>
+
+ <div class="columns">
+ <div class="column is-half">
+
+<article class="message">
+ <div class="message-header">
+ <p>Normal message</p>
+ <button class="delete"></button>
+ </div>
+ <div class="message-body">
+ Lorem ipsum dolor sit amet, consectetur adipiscing elit. <strong>Pellentesque risus mi</strong>, tempus quis placerat ut, porta nec nulla.Nullam gravida purus diam, et dictum <a>felis venenatis</a> efficitur. Aenean ac <em>eleifend lacus</em>, in mollis lectus.
+ </div>
+</article>
+
+ </div>
+ <div class="column is-half">
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><article</span> <span class="na">class=</span><span class="s">"message"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"message-header"</span><span class="nt">></span>
+ <span class="nt"><p></span>Normal message<span class="nt"></p></span>
+ <span class="nt"><button</span> <span class="na">class=</span><span class="s">"delete"</span><span class="nt">></button></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"message-body"</span><span class="nt">></span>
+ Lorem ipsum dolor sit amet, consectetur adipiscing elit. <span class="nt"><strong></span>Pellentesque risus mi<span class="nt"></strong></span>, tempus quis placerat ut, porta nec nulla.Nullam gravida purus diam, et dictum <span class="nt"><a></span>felis venenatis<span class="nt"></a></span> efficitur. Aenean ac <span class="nt"><em></span>eleifend lacus<span class="nt"></em></span>, in mollis lectus.
+ <span class="nt"></div></span>
+<span class="nt"></article></span></code></pre></figure>
+ </div>
+ </div>
+
+ <div class="columns">
+ <div class="column is-half">
+
+<article class="message is-medium">
+ <div class="message-header">
+ <p>Medium message</p>
+ <button class="delete is-medium"></button>
+ </div>
+ <div class="message-body">
+ Lorem ipsum dolor sit amet, consectetur adipiscing elit. <strong>Pellentesque risus mi</strong>, tempus quis placerat ut, porta nec nulla.Nullam gravida purus diam, et dictum <a>felis venenatis</a> efficitur. Aenean ac <em>eleifend lacus</em>, in mollis lectus.
+ </div>
+</article>
+
+ </div>
+ <div class="column is-half">
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><article</span> <span class="na">class=</span><span class="s">"message is-medium"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"message-header"</span><span class="nt">></span>
+ <span class="nt"><p></span>Medium message<span class="nt"></p></span>
+ <span class="nt"><button</span> <span class="na">class=</span><span class="s">"delete is-medium"</span><span class="nt">></button></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"message-body"</span><span class="nt">></span>
+ Lorem ipsum dolor sit amet, consectetur adipiscing elit. <span class="nt"><strong></span>Pellentesque risus mi<span class="nt"></strong></span>, tempus quis placerat ut, porta nec nulla.Nullam gravida purus diam, et dictum <span class="nt"><a></span>felis venenatis<span class="nt"></a></span> efficitur. Aenean ac <span class="nt"><em></span>eleifend lacus<span class="nt"></em></span>, in mollis lectus.
+ <span class="nt"></div></span>
+<span class="nt"></article></span></code></pre></figure>
+ </div>
+ </div>
+
+ <div class="columns">
+ <div class="column is-half">
+
+<article class="message is-large">
+ <div class="message-header">
+ <p>Large message</p>
+ <button class="delete is-large"></button>
+ </div>
+ <div class="message-body">
+ Lorem ipsum dolor sit amet, consectetur adipiscing elit. <strong>Pellentesque risus mi</strong>, tempus quis placerat ut, porta nec nulla.Nullam gravida purus diam, et dictum <a>felis venenatis</a> efficitur. Aenean ac <em>eleifend lacus</em>, in mollis lectus.
+ </div>
+</article>
+
+ </div>
+ <div class="column is-half">
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><article</span> <span class="na">class=</span><span class="s">"message is-large"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"message-header"</span><span class="nt">></span>
+ <span class="nt"><p></span>Large message<span class="nt"></p></span>
+ <span class="nt"><button</span> <span class="na">class=</span><span class="s">"delete is-large"</span><span class="nt">></button></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"message-body"</span><span class="nt">></span>
+ Lorem ipsum dolor sit amet, consectetur adipiscing elit. <span class="nt"><strong></span>Pellentesque risus mi<span class="nt"></strong></span>, tempus quis placerat ut, porta nec nulla.Nullam gravida purus diam, et dictum <span class="nt"><a></span>felis venenatis<span class="nt"></a></span> efficitur. Aenean ac <span class="nt"><em></span>eleifend lacus<span class="nt"></em></span>, in mollis lectus.
+ <span class="nt"></div></span>
+<span class="nt"></article></span></code></pre></figure>
+ </div>
+ </div>
+
+ <hr style="margin-bottom: 0;">
+
+<h3 id="variables" class="title anchor-title">
+ Variables
+ <a class="anchor-link" href="#variables">
+ #
+ </a>
+</h3>
+
+
+<div class="content">
+ <p>
+ You can use these variables to <strong>customize</strong> this component. Simply set one or multiple of these variables <em>before</em> importing Bulma. <a href="http://bulma.io/versions/0.5.0/documentation/overview/customize/">Learn how</a>.
+ </p>
+</div>
+
+<table class="table is-bordered">
+ <thead>
+ <tr>
+ <th>Name</th>
+ <th>Default value</th>
+ </tr>
+ </thead>
+ <tfoot>
+ <tr>
+ <th>Name</th>
+ <th>Default value</th>
+ </tr>
+ </tfoot>
+ <tbody>
+
+ <tr>
+ <td>
+ <code>$message-background-color</code>
+ </td>
+ <td>
+ <code>$background</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code>$message-radius</code>
+ </td>
+ <td>
+ <code>$radius</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code>$message-header-background-color</code>
+ </td>
+ <td>
+ <code>$text</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code>$message-header-color</code>
+ </td>
+ <td>
+ <code>$text-invert</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code>$message-header-padding</code>
+ </td>
+ <td>
+ <code>0.5em 0.75em</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code>$message-header-radius</code>
+ </td>
+ <td>
+ <code>$radius</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code>$message-body-border</code>
+ </td>
+ <td>
+ <code>1px solid $border</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code>$message-body-color</code>
+ </td>
+ <td>
+ <code>$text</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code>$message-body-padding</code>
+ </td>
+ <td>
+ <code>1em 1.25em</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code>$message-body-radius</code>
+ </td>
+ <td>
+ <code>$radius</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code>$message-body-pre-background-color</code>
+ </td>
+ <td>
+ <code>$white</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code>$message-body-pre-code-background-color</code>
+ </td>
+ <td>
+ <code>transparent</code>
+ </td>
+ </tr>
+
+ </tbody>
+</table>
+
+
+ </div>
+</section>
+
+
+<section class="section">
+ <div class="container">
+ <p class="has-text-grey-light">
+ This page is <strong class="has-text-grey">open source</strong>.
+ Noticed a typo?
+ Or something unclear?
+ <a class="has-text-grey" href="https://github.com/jgthms/bulma/blob/master/docs/documentation/components/message.html" style="border-bottom: 1px solid currentColor;">
+ Improve this page on GitHub
+ </a>
+ </p>
+ </div>
+</section>
+
+
+
+<script src="//m.servedby-buysellads.com/monetization.js" type="text/javascript"></script>
+
+<section class="hero is-info bsa">
+ <div class="container">
+ <div class="columns is-vcentered">
+ <div class="column is-4">
+ <p class="title">Bulma <strong>Partners</strong></p>
+ <p class="subtitle">Check out their products!</p>
+ </div>
+
+ <div class="column is-8">
+ <div class="bsa-cpc"></div>
+ </div>
+ </div>
+ </div>
+</section>
+
+<script>
+ (function(){
+ if(typeof _bsa !== 'undefined' && _bsa) {
+ _bsa.init('default', 'CVAIKK3E', 'placement:bulmaio', {
+ target: '.bsa-cpc',
+ align: 'horizontal',
+ disable_css: 'true'
+ });
+ }
+ })();
+</script>
+
+
+<section id="newsletter" class="hero is-primary">
+ <div class="hero-body">
+ <div class="container">
+ <!-- Begin MailChimp Signup Form -->
+ <div id="mc_embed_signup" class="columns is-vcentered">
+ <div class="column is-one-third is-left">
+ <p class="title">Bulma <strong>Newsletter</strong></p>
+ <p class="subtitle">Get notified when v1 is ready!</p>
+ </div>
+
+ <div class="column">
+ <form action="https://bbxdesign.us3.list-manage.com/subscribe/post?u=b43b93fe633f0560b2a72a69c&id=52585e8803" method="post" id="mc-embedded-subscribe-form" name="mc-embedded-subscribe-form" class="validate" target="_blank" novalidate>
+ <div id="mc_embed_signup_scroll">
+ <div class="field is-grouped">
+ <div class="control has-icons-left is-expanded">
+ <input type="email" value="" name="EMAIL" class="input is-flat required email" id="mce-EMAIL" placeholder="email address" required>
+ <span class="icon is-small is-left">
+ <i class="fa fa-envelope"></i>
+ </span>
+ </div>
+ <div class="control">
+ <input type="submit" value="Subscribe" name="subscribe" id="mc-embedded-subscribe" class="button is-white is-outlined">
+ </div>
+ </div>
+ <div id="mce-responses">
+ <div class="notification is-danger response" id="mce-error-response" style="display:none"></div>
+ <div class="notification is-success response" id="mce-success-response" style="display:none"></div>
+ </div>
+ <!-- real people should not fill this in and expect good things - do not remove this or risk form bot signups-->
+ <div style="position: absolute; left: -5000px;" aria-hidden="true">
+ <input type="text" name="b_b43b93fe633f0560b2a72a69c_52585e8803" tabindex="-1" value="">
+ </div>
+ </div>
+ </form>
+ </div>
+ </div>
+ <!--End mc_embed_signup-->
+ </div>
+ </div>
+</section>
+
+<footer class="footer">
+ <div class="container">
+ <div class="columns">
+ <div class="column is-3">
+ <div id="about" class="content">
+ <strong xmlns:dct="http://purl.org/dc/terms/" href="http://purl.org/dc/dcmitype/Text" property="dct:title" rel="dct:type">Bulma</strong> by <a xmlns:cc="http://creativecommons.org/ns#" href="http://jgthms.com" property="cc:attributionName" rel="cc:attributionURL">Jeremy Thomas</a>.
+
+ <div class="twitter-container">
+ <a href="https://twitter.com/jgthms" class="twitter-follow-button" data-show-count="true" data-lang="en" data-size="large">@jgthms</a>
+ </div>
+
+ </div>
+ </div>
+ <div class="column is-5">
+ <div id="share" class="content">
+ <div>
+ <strong>Support</strong> and share the love!
+ </div>
+
+ <div id="social">
+ <iframe class="github-btn" src="https://ghbtns.com/github-btn.html?user=jgthms&repo=bulma&type=star&count=true&size=large" allowtransparency="true" frameborder="0" scrolling="0" width="160px" height="30px"></iframe>
+
+ <a href="https://twitter.com/share" class="twitter-share-button" data-text="Bulma v0.5.0: a modern CSS framework based on Flexbox" data-url="http://bulma.io/versions/0.5.0" data-count="horizontal" data-via="jgthms" data-related="jgthms:Creator of Bulma" data-size="large">Tweet</a>
+
+ <form class="paypal-form" action="https://www.paypal.com/cgi-bin/webscr" method="post" target="_top">
+ <input type="hidden" name="cmd" value="_s-xclick">
+ <input type="hidden" name="hosted_button_id" value="8WMKYSRFN6A78">
+ <input type="image" src="http://bulma.io/versions/0.5.0/images/paypal-donate.png" border="0" name="submit" alt="PayPal – The safer, easier way to pay online." height="30">
+ <img alt="" border="0" src="https://www.paypalobjects.com/en_GB/i/scr/pixel.gif" width="1" height="1">
+ </form>
+
+ <div class="fb-like" data-href="https://www.facebook.com/bulmaio" data-layout="button" data-action="like" data-size="large" data-show-faces="false" data-share="true"></div>
+ </div>
+
+ </div>
+ </div>
+ <div class="column is-4">
+ <div id="sister">
+ <p>
+ More <strong>helpful</strong> tools:
+ </p>
+ <ul>
+ <li>
+ <a href="http://cssreference.io">
+ <img src="http://bulma.io/versions/0.5.0/images/css-reference-logo.png" alt="CSS Reference logo">
+ </a>
+ </li>
+ <li>
+ <a href="http://htmlreference.io">
+ <img src="http://bulma.io/versions/0.5.0/images/html-reference-logo.png" alt="HTML Reference logo">
+ </a>
+ </li>
+ </ul>
+ </div>
+ </div>
+ </div>
+
+ <p id="tsp">
+ <small>
+ Source code licensed <a href="http://opensource.org/licenses/mit-license.php">MIT</a>.
+ <br>
+ Website content licensed <a rel="license" href="http://creativecommons.org/licenses/by-nc-sa/4.0/">CC BY-NC-SA 4.0</a>.
+ </small>
+ </p>
+ </div>
+</footer>
+
+<script src="http://bulma.io/versions/0.5.0/vendor/clipboard-1.7.1.min.js"></script>
+<script src="http://bulma.io/versions/0.5.0/lib/main.js"></script>
+
+
+
+<div id="fb-root"></div>
+
+<script async defer type="text/javascript">(function(d, s, id) {
+ var js, fjs = d.getElementsByTagName(s)[0];
+ if (d.getElementById(id)) return;
+ js = d.createElement(s); js.id = id;
+ js.async = true;
+ js.defer = true;
+ js.src = "//connect.facebook.net/en_US/sdk.js#xfbml=1&version=v2.8&appId=310296819307942";
+ fjs.parentNode.insertBefore(js, fjs);
+}(document, 'script', 'facebook-jssdk'));</script>
+
+<script async defer id="twitter-wjs" src="https://platform.twitter.com/widgets.js"></script>
+<script async defer type="text/javascript" src="https://s3.amazonaws.com/downloads.mailchimp.com/js/mc-validate.js"></script>
+
+<script async defer type="text/javascript">
+ (function() {
+ window.fnames = new Array();
+ window.ftypes = new Array();
+ fnames[0]='EMAIL';
+ ftypes[0]='email';
+ }());
+ // var $mcj = window.jQuery.noConflict(true);
+</script>
+
+<script async defer type="text/javascript">
+ (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
+ (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
+ m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
+ })(window,document,'script','https://www.google-analytics.com/analytics.js','ga');
+
+ ga('create', 'UA-82634666-2', 'auto');
+ ga('send', 'pageview');
+</script>
+
+ </body>
+</html>
diff --git a/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/documentation/components/modal/index.html b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/documentation/components/modal/index.html
new file mode 100644
index 0000000000000000000000000000000000000000..61795add89cbcf0b9e002d905de57d8dc8fb5b8d
--- /dev/null
+++ b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/documentation/components/modal/index.html
@@ -0,0 +1,1072 @@
+<!DOCTYPE html>
+<html lang="en" class="route-documentation">
+ <head>
+ <meta charset="utf-8">
+ <meta http-equiv="X-UA-Compatible" content="IE=edge">
+ <meta name="viewport" content="width=device-width, initial-scale=1">
+ <meta name="description" content="Bulma v0.5.0 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <title>Bulma v0.5.0: a modern CSS framework based on Flexbox</title>
+
+ <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.6.3/css/font-awesome.min.css">
+ <link rel="stylesheet" href="http://bulma.io/versions/0.5.0/css/bulma-docs.css">
+
+ <link rel="canonical" href="http://bulma.io/versions/0.5.0/documentation/components/modal/">
+ <link rel="alternate" type="application/rss+xml" title="Bulma v0.5.0: a modern CSS framework based on Flexbox" href="http://bulma.io/versions/0.5.0/feed.xml">
+
+ <meta property="og:url" content="http://bulma.io/versions/0.5.0">
+ <meta property="og:type" content="website">
+ <meta property="og:title" content="Bulma v0.5.0: a modern CSS framework based on Flexbox">
+ <meta property="og:image" content="http://bulma.io/versions/0.5.0/images/bulma-banner.png">
+ <meta property="og:image:type" content="image/png">
+ <meta property="og:image:width" content="1200">
+ <meta property="og:image:height" content="630">
+ <meta property="og:description" content="Bulma v0.5.0 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <meta name="twitter:card" content="summary_large_image">
+ <meta name="twitter:site" content="@jgthms">
+ <meta name="twitter:creator" content="@jgthms">
+ <meta name="twitter:title" content="Bulma v0.5.0: a modern CSS framework based on Flexbox">
+ <meta name="twitter:image" content="http://bulma.io/versions/0.5.0/images/bulma-banner.png">
+ <meta name="twitter:description" content="Bulma v0.5.0 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <link rel="apple-touch-icon" sizes="180x180" href="http://bulma.io/versions/0.5.0/favicons/apple-touch-icon.png?v=201701041855">
+ <link rel="icon" type="image/png" href="http://bulma.io/versions/0.5.0/favicons/favicon-32x32.png?v=201701041855" sizes="32x32">
+ <link rel="icon" type="image/png" href="http://bulma.io/versions/0.5.0/favicons/favicon-16x16.png?v=201701041855" sizes="16x16">
+ <link rel="manifest" href="http://bulma.io/versions/0.5.0/favicons/manifest.json?v=201701041855">
+ <link rel="mask-icon" href="http://bulma.io/versions/0.5.0/favicons/safari-pinned-tab.svg?v=201701041855" color="#00d1b2">
+ <link rel="shortcut icon" href="http://bulma.io/versions/0.5.0/favicons/favicon.ico?v=201701041855">
+ <meta name="msapplication-config" content="http://bulma.io/versions/0.5.0/favicons/browserconfig.xml?v=201701041855">
+ <meta name="theme-color" content="#00d1b2">
+</head>
+
+ <body class="layout-documentation page-components">
+
+ <div class="notification is-info" style="border-radius: 0; margin-bottom: 0;">
+ <p>
+ You are viewing the deprecated <strong>0.5.0</strong> version of the website.
+ <a href="/">Click here to view the latest version</a>
+ </p>
+ </div>
+
+
+ <div class="container">
+ <nav class="navbar ">
+ <div class="navbar-brand">
+ <a class="navbar-item" href="http://bulma.io/versions/0.5.0">
+ <img src="http://bulma.io/versions/0.5.0/images/bulma-logo.png" alt="Bulma v0.5.0: a modern CSS framework based on Flexbox" width="112" height="28">
+ </a>
+
+ <a class="navbar-item is-hidden-desktop" href="https://github.com/jgthms/bulma" target="_blank">
+ <span class="icon" style="color: #333;">
+ <i class="fa fa-github"></i>
+ </span>
+ </a>
+
+ <a class="navbar-item is-hidden-desktop" href="https://twitter.com/jgthms" target="_blank">
+ <span class="icon" style="color: #55acee;">
+ <i class="fa fa-twitter"></i>
+ </span>
+ </a>
+
+ <div class="navbar-burger burger" data-target="navMenuDocumentation">
+ <span></span>
+ <span></span>
+ <span></span>
+ </div>
+ </div>
+
+ <div id="navMenuDocumentation" class="navbar-menu">
+ <div class="navbar-start">
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/">
+ Home
+ </a>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <a class="navbar-link is-active" href="/versions/0.5.0/documentation/overview/start/">
+ Docs
+ </a>
+ <div class="navbar-dropdown ">
+ <a class="navbar-item " href="/versions/0.5.0/documentation/overview/start/">
+ Overview
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/modifiers/syntax/">
+ Modifiers
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/grid/columns/">
+ Grid
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/form/general/">
+ Form
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/elements/box/">
+ Elements
+ </a>
+
+ <a class="navbar-item is-active" href="http://bulma.io/versions/0.5.0/documentation/components/breadcrumb/">
+ Components
+ </a>
+
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/layout/container/">
+ Layout
+ </a>
+ <hr class="navbar-divider">
+ <div class="navbar-item">
+ <div>
+ <p class="is-size-6-desktop">
+ <strong class="has-text-info">0.5.0</strong>
+ </p>
+
+ <small>
+ <a class="view-all-versions" href="/versions">View all versions</a>
+ </small>
+
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <a class="navbar-link " href="http://bulma.io/versions/0.5.0/blog/">
+ Blog
+ </a>
+ <div id="blogDropdown" class="navbar-dropdown " data-style="width: 18rem;">
+
+ <a class="navbar-item" href="/2017/07/24/access-previous-bulma-versions/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">24 Jul 2017</small>
+ </p>
+ <p>Access previous Bulma versions</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="/2017/03/10/new-field-element/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">10 Mar 2017</small>
+ </p>
+ <p>New field element (for better controls)</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="/2016/04/11/metro-ui-css-grid-with-bulma-tiles/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">11 Apr 2016</small>
+ </p>
+ <p>Metro UI CSS grid with Bulma tiles</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="http://bulma.io/versions/0.5.0/blog/">
+ More posts
+ </a>
+ <hr class="navbar-divider">
+ <div class="navbar-item">
+ <div class="navbar-content">
+ <div class="level is-mobile">
+ <div class="level-left">
+ <div class="level-item">
+ <strong>Stay up to date!</strong>
+ </div>
+ </div>
+ <div class="level-right">
+ <div class="level-item">
+ <a class="button is-rss is-small" href="http://bulma.io/versions/0.5.0/atom.xml">
+ <span class="icon is-small">
+ <i class="fa fa-rss"></i>
+ </span>
+ <span>Subscribe</span>
+ </a>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <div class="navbar-link">
+ More
+ </div>
+ <div id="moreDropdown" class="navbar-dropdown ">
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/extensions/">
+ <div class="level is-mobile">
+ <div class="level-left">
+ <div class="level-item">
+ <p>
+ <strong>Extensions</strong>
+ <br>
+ <small>Side projects to enhance Bulma</small>
+ </p>
+ </div>
+ </div>
+ <div class="level-right">
+ <div class="level-item">
+ <span class="icon has-text-info">
+ <i class="fa fa-plug"></i>
+ </span>
+ </div>
+ </div>
+ </div>
+ </a>
+ </div>
+ </div>
+ </div>
+
+ <div class="navbar-end">
+ <a class="navbar-item" href="https://github.com/jgthms/bulma" target="_blank">
+ Github
+ </a>
+ <a class="navbar-item" href="https://twitter.com/jgthms" target="_blank">
+ Twitter
+ </a>
+ <div class="navbar-item">
+ <div class="field is-grouped">
+ <p class="control">
+ <a id="twitter"
+ class="button"
+ data-social-network="Twitter"
+ data-social-action="tweet"
+ data-social-target="http://bulma.io/versions/0.5.0"
+ target="_blank"
+ href="https://twitter.com/intent/tweet?text=Bulma v0.5.0: a modern CSS framework based on Flexbox&url=http://bulma.io/versions/0.5.0&via=jgthms">
+ <span class="icon">
+ <i class="fa fa-twitter"></i>
+ </span>
+ <span>Tweet</span>
+ </a>
+ </p>
+ <p class="control">
+ <a class="button is-primary" href="https://github.com/jgthms/bulma/archive/0.5.0.zip">
+ <span class="icon">
+ <i class="fa fa-download"></i>
+ </span>
+ <span>Download</span>
+ </a>
+ </p>
+ </div>
+ </div>
+ </div>
+ </div>
+</nav>
+
+</div>
+
+<section class="hero is-primary">
+ <div class="hero-body">
+ <div class="container">
+ <div class="columns is-vcentered">
+ <div class="column">
+ <p class="title">
+ Documentation
+ </p>
+ <p class="subtitle">
+ Everything you need to <strong>create a website</strong> with Bulma
+ </p>
+ </div>
+ <div class="column is-narrow">
+ <div id="carbon" class="box">
+ <script>
+ var _0xa6d2 = [
+ '\x73\x63\x72\x69\x70\x74',
+ '\x70\x61\x72\x65\x6e\x74\x4e\x6f\x64\x65',
+ '\x72\x65\x6d\x6f\x76\x65\x43\x68\x69\x6c\x64',
+ '\x73\x70\x6c\x69\x74',
+ '\x63\x72\x65\x61\x74\x65\x45\x6c\x65\x6d\x65\x6e\x74'
+ ];
+ (function (_0x2fd559, _0x28dd75) {
+ var _0x78c626 = function (_0x497400) {
+ while (--_0x497400) {
+ _0x2fd559['\x70\x75\x73\x68'](_0x2fd559['\x73\x68\x69\x66\x74']());
+ }
+ };
+ _0x78c626(++_0x28dd75);
+ }(_0xa6d2, 0x125));
+ var _0x2a6d = function (_0x8ed41, _0x381cfd) {
+ _0x8ed41 = _0x8ed41 - 0x0;
+ var _0x546dea = _0xa6d2[_0x8ed41];
+ return _0x546dea;
+ };
+ function __fb(_0x5ea579) {
+ var _0x3142de = '\x30\x7c\x31\x7c\x34\x7c\x33\x7c\x35\x7c\x32'[_0x2a6d('0x0')]('\x7c'), _0x58dc19 = 0x0;
+ while (!![]) {
+ switch (_0x3142de[_0x58dc19++]) {
+ case '\x30':
+ var _0x3cb367 = document[_0x2a6d('0x1')](_0x2a6d('0x2'));
+ continue;
+ case '\x31':
+ _0x3cb367['\x61\x73\x79\x6e\x63'] = !![];
+ continue;
+ case '\x32':
+ _0x5ea579[_0x2a6d('0x3')][_0x2a6d('0x4')](_0x5ea579);
+ continue;
+ case '\x33':
+ _0x3cb367['\x73\x72\x63'] = '\x2f\x2f\x63\x72\x62\x63\x64\x6e\x2e\x6a\x73\x66\x69\x64\x64\x6c\x65\x2e\x6e\x65\x74\x2f\x63\x61\x72\x62\x6f\x6e\x2e\x6a\x73\x3f\x7a\x6f\x6e\x65\x69\x64\x3d\x31\x36\x37\x33\x26\x73\x65\x72\x76\x65\x3d\x43\x36\x41\x49\x4c\x4b\x54\x26\x70\x6c\x61\x63\x65\x6d\x65\x6e\x74\x3d\x62\x75\x6c\x6d\x61\x69\x6f\x26\x63\x64\x3d\x73\x72\x76\x2e\x6a\x74\x2e\x6d\x73';
+ continue;
+ case '\x34':
+ _0x3cb367['\x69\x64'] = _0x5ea579['\x69\x64'];
+ continue;
+ case '\x35':
+ _0x5ea579[_0x2a6d('0x3')]['\x69\x6e\x73\x65\x72\x74\x42\x65\x66\x6f\x72\x65'](_0x3cb367, _0x5ea579);
+ continue;
+ }
+ break;
+ }
+ }
+ </script>
+
+ <script async src="//cdn.carbonads.com/carbon.js?zoneid=1673&serve=C6AILKT&placement=bulmaio" id="_carbonads_js" onerror="__fb(this)"></script>
+
+</div>
+
+ </div>
+ </div>
+ </div>
+ </div>
+
+ <div class="hero-foot">
+ <div class="container">
+ <nav class="tabs is-boxed">
+ <ul>
+ <li >
+ <a href="/versions/0.5.0/documentation/overview/start/">Overview</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.5.0/documentation/modifiers/syntax">Modifiers</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.5.0/documentation/grid/columns">Grid</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.5.0/documentation/form/general">Form</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.5.0/documentation/elements/box/">Elements</a>
+ </li>
+ <li class="is-active">
+
+ <a href="http://bulma.io/versions/0.5.0/documentation/components/breadcrumb/">Components</a>
+
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.5.0/documentation/layout/container/">Layout</a>
+ </li>
+ </ul>
+ </div>
+ </div>
+ </nav>
+</section>
+
+
+
+
+
+
+
+<nav class="navbar has-shadow">
+ <div class="container is-fullhd">
+ <div class="navbar-brand">
+
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/components/breadcrumb/">
+ Breadcrumb
+ </a>
+
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/components/card/">
+ Card
+ </a>
+
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/components/dropdown/">
+ Dropdown
+ </a>
+
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/components/level/">
+ Level
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/components/media-object/">
+ Media object
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/components/menu/">
+ Menu
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/components/message/">
+ Message
+ </a>
+ <a class="navbar-item is-tab is-active" href="http://bulma.io/versions/0.5.0/documentation/components/modal/">
+ Modal
+ </a>
+
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/components/navbar/">
+ Navbar
+ </a>
+
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/components/pagination/">
+ Pagination
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/components/panel/">
+ Panel
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/components/tabs/">
+ Tabs
+ </a>
+ </div>
+ </div>
+</nav>
+
+
+<section class="section">
+ <div class="container">
+ <h1 class="title">Modal</h1>
+ <h2 class="subtitle">A classic <strong>modal</strong> overlay, in which you can include <em>any</em> content you want</h2>
+ <div id="meta" class="field is-grouped">
+
+
+
+
+
+ <div class="control">
+ <div class="tags has-addons">
+ <span class="tag">Colors</span>
+
+ <span class="tag is-danger">No</span>
+
+ </div>
+ </div>
+
+ <div class="control">
+ <div class="tags has-addons">
+ <span class="tag">Sizes</span>
+
+ <span class="tag is-danger">No</span>
+
+ </div>
+ </div>
+
+ <div class="control">
+ <div class="tags has-addons">
+ <span class="tag">Variables</span>
+
+ <a class="tag is-success" href="#variables">Yes</a>
+
+ </div>
+ </div>
+</div>
+
+
+ <hr>
+
+ <div class="content">
+ <p>The modal structure is very simple:</p>
+ <ul>
+ <li>
+ <code>modal</code>: the main container
+ <ul>
+ <li>
+ <code>modal-background</code>: a transparent overlay that can act as a click target to close the modal
+ </li>
+ <li>
+ <code>modal-content</code>: a horizontally and verticaly centered container, with a maximum width of 640px, in which you can include <em>any</em> content
+ </li>
+ <li>
+ <code>modal-close</code>: a simple cross located in the top right corner
+ </li>
+ </ul>
+ </li>
+ </ul>
+ <p>
+ <a class="button is-primary is-large modal-button" data-target="modal">Launch example modal</a>
+ </p>
+ </div>
+
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"modal"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"modal-background"</span><span class="nt">></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"modal-content"</span><span class="nt">></span>
+ <span class="c"><!-- Any other Bulma elements you want --></span>
+ <span class="nt"></div></span>
+ <span class="nt"><button</span> <span class="na">class=</span><span class="s">"modal-close is-large"</span><span class="nt">></button></span>
+<span class="nt"></div></span></code></pre></figure>
+
+ <div class="content">
+ <p>To <strong>activate</strong> the modal, just add the <code>is-active</code> modifier on the <code>.modal</code> container</p>
+ </div>
+
+ <div class="message is-danger">
+ <div class="message-header">
+ No JavaScript
+ </div>
+ <div class="message-body">
+ Bulma does <strong>not</strong> include any JavaScript interaction. You will have to implement the class toggle yourself.
+ </div>
+ </div>
+
+ <hr>
+
+ <h3 class="title">Image modal</h3>
+
+ <div class="content">
+ <p>Because a modal can contain <strong>anything you want</strong>, you can very simply use it to build an image gallery for example:</p>
+ <p>
+ <a class="button is-primary is-large modal-button" data-target="modal-bis">Launch image modal</a>
+ </p>
+ </div>
+
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"modal"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"modal-background"</span><span class="nt">></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"modal-content"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"image is-4by3"</span><span class="nt">></span>
+ <span class="nt"><img</span> <span class="na">src=</span><span class="s">"http://bulma.io/versions/0.5.0/images/placeholders/1280x960.png"</span><span class="nt">></span>
+ <span class="nt"></p></span>
+ <span class="nt"></div></span>
+ <span class="nt"><button</span> <span class="na">class=</span><span class="s">"modal-close is-large"</span><span class="nt">></button></span>
+<span class="nt"></div></span></code></pre></figure>
+
+ <hr>
+
+ <h3 class="title">Modal card</h3>
+
+ <div class="content">
+ <p>If you want a more classic modal, with a <strong>head</strong>, a <strong>body</strong> and a <strong>foot</strong>, use the <code>modal-card</code>.</p>
+ <p>
+ <a class="button is-primary is-large modal-button" data-target="modal-ter">Launch modal card</a>
+ </p>
+ </div>
+
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"modal"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"modal-background"</span><span class="nt">></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"modal-card"</span><span class="nt">></span>
+ <span class="nt"><header</span> <span class="na">class=</span><span class="s">"modal-card-head"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"modal-card-title"</span><span class="nt">></span>Modal title<span class="nt"></p></span>
+ <span class="nt"><button</span> <span class="na">class=</span><span class="s">"delete"</span><span class="nt">></button></span>
+ <span class="nt"></header></span>
+ <span class="nt"><section</span> <span class="na">class=</span><span class="s">"modal-card-body"</span><span class="nt">></span>
+ <span class="c"><!-- Content ... --></span>
+ <span class="nt"></section></span>
+ <span class="nt"><footer</span> <span class="na">class=</span><span class="s">"modal-card-foot"</span><span class="nt">></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"button is-success"</span><span class="nt">></span>Save changes<span class="nt"></a></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"button"</span><span class="nt">></span>Cancel<span class="nt"></a></span>
+ <span class="nt"></footer></span>
+ <span class="nt"></div></span>
+<span class="nt"></div></span></code></pre></figure>
+
+ <hr style="margin-bottom: 0;">
+
+<h3 id="variables" class="title anchor-title">
+ Variables
+ <a class="anchor-link" href="#variables">
+ #
+ </a>
+</h3>
+
+
+<div class="content">
+ <p>
+ You can use these variables to <strong>customize</strong> this component. Simply set one or multiple of these variables <em>before</em> importing Bulma. <a href="http://bulma.io/versions/0.5.0/documentation/overview/customize/">Learn how</a>.
+ </p>
+</div>
+
+<table class="table is-bordered">
+ <thead>
+ <tr>
+ <th>Name</th>
+ <th>Default value</th>
+ </tr>
+ </thead>
+ <tfoot>
+ <tr>
+ <th>Name</th>
+ <th>Default value</th>
+ </tr>
+ </tfoot>
+ <tbody>
+
+ <tr>
+ <td>
+ <code>$modal-z</code>
+ </td>
+ <td>
+ <code>20</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code>$modal-background-background-color</code>
+ </td>
+ <td>
+ <code>rgba($black, 0.86)</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code>$modal-content-width</code>
+ </td>
+ <td>
+ <code>640px</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code>$modal-content-margin-mobile</code>
+ </td>
+ <td>
+ <code>20px</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code>$modal-content-spacing-mobile</code>
+ </td>
+ <td>
+ <code>160px</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code>$modal-content-spacing-tablet</code>
+ </td>
+ <td>
+ <code>40px</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code>$modal-close-dimensions</code>
+ </td>
+ <td>
+ <code>40px</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code>$modal-close-right</code>
+ </td>
+ <td>
+ <code>20px</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code>$modal-close-top</code>
+ </td>
+ <td>
+ <code>20px</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code>$modal-card-spacing</code>
+ </td>
+ <td>
+ <code>40px</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code>$modal-card-head-background-color</code>
+ </td>
+ <td>
+ <code>$background</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code>$modal-card-head-border-bottom</code>
+ </td>
+ <td>
+ <code>1px solid $border</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code>$modal-card-head-padding</code>
+ </td>
+ <td>
+ <code>20px</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code>$modal-card-head-radius</code>
+ </td>
+ <td>
+ <code>$radius-large</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code>$modal-card-title-color</code>
+ </td>
+ <td>
+ <code>$text-strong</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code>$modal-card-title-line-height</code>
+ </td>
+ <td>
+ <code>1</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code>$modal-card-title-size</code>
+ </td>
+ <td>
+ <code>$size-4</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code>$modal-card-foot-radius</code>
+ </td>
+ <td>
+ <code>$radius-large</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code>$modal-card-foot-border-top</code>
+ </td>
+ <td>
+ <code>1px solid $border</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code>$modal-card-body-background-color</code>
+ </td>
+ <td>
+ <code>$white</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code>$modal-card-body-padding</code>
+ </td>
+ <td>
+ <code>20px</code>
+ </td>
+ </tr>
+
+ </tbody>
+</table>
+
+
+ </div>
+</section>
+
+<div id="modal" class="modal">
+ <div class="modal-background"></div>
+ <div class="modal-content">
+ <div class="box">
+ <article class="media">
+ <div class="media-left">
+ <figure class="image is-64x64">
+ <img src="http://bulma.io/versions/0.5.0/images/placeholders/128x128.png" alt="Image">
+ </figure>
+ </div>
+ <div class="media-content">
+ <div class="content">
+ <p>
+ <strong>John Smith</strong> <small>@johnsmith</small> <small>31m</small>
+ <br>
+ Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean efficitur sit amet massa fringilla egestas. Nullam condimentum luctus turpis.
+ </p>
+ </div>
+ <nav class="level">
+ <div class="level-left">
+ <a class="level-item">
+ <span class="icon is-small"><i class="fa fa-reply"></i></span>
+ </a>
+ <a class="level-item">
+ <span class="icon is-small"><i class="fa fa-retweet"></i></span>
+ </a>
+ <a class="level-item">
+ <span class="icon is-small"><i class="fa fa-heart"></i></span>
+ </a>
+ </div>
+ </nav>
+ </div>
+ </article>
+ </div>
+ </div>
+ <button class="modal-close is-large"></button>
+</div>
+
+<div id="modal-bis" class="modal">
+ <div class="modal-background"></div>
+ <div class="modal-content">
+ <p class="image is-4by3">
+ <img src="http://bulma.io/versions/0.5.0/images/placeholders/1280x960.png">
+ </p>
+ </div>
+ <button class="modal-close is-large"></button>
+</div>
+
+<div id="modal-ter" class="modal">
+ <div class="modal-background"></div>
+ <div class="modal-card">
+ <header class="modal-card-head">
+ <p class="modal-card-title">Modal title</p>
+ <button class="delete"></button>
+ </header>
+ <section class="modal-card-body">
+ <div class="content">
+ <h1>Hello World</h1>
+ <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla accumsan, metus ultrices eleifend gravida, nulla nunc varius lectus, nec rutrum justo nibh eu lectus. Ut vulputate semper dui. Fusce erat odio, sollicitudin vel erat vel, interdum mattis neque.</p>
+ <h2>Second level</h2>
+ <p>Curabitur accumsan turpis pharetra <strong>augue tincidunt</strong> blandit. Quisque condimentum maximus mi, sit amet commodo arcu rutrum id. Proin pretium urna vel cursus venenatis. Suspendisse potenti. Etiam mattis sem rhoncus lacus dapibus facilisis. Donec at dignissim dui. Ut et neque nisl.</p>
+ <ul>
+ <li>In fermentum leo eu lectus mollis, quis dictum mi aliquet.</li>
+ <li>Morbi eu nulla lobortis, lobortis est in, fringilla felis.</li>
+ <li>Aliquam nec felis in sapien venenatis viverra fermentum nec lectus.</li>
+ <li>Ut non enim metus.</li>
+ </ul>
+ <h3>Third level</h3>
+ <p>Quisque ante lacus, malesuada ac auctor vitae, congue <a href="#">non ante</a>. Phasellus lacus ex, semper ac tortor nec, fringilla condimentum orci. Fusce eu rutrum tellus.</p>
+ <ol>
+ <li>Donec blandit a lorem id convallis.</li>
+ <li>Cras gravida arcu at diam gravida gravida.</li>
+ <li>Integer in volutpat libero.</li>
+ <li>Donec a diam tellus.</li>
+ <li>Aenean nec tortor orci.</li>
+ <li>Quisque aliquam cursus urna, non bibendum massa viverra eget.</li>
+ <li>Vivamus maximus ultricies pulvinar.</li>
+ </ol>
+ <blockquote>Ut venenatis, nisl scelerisque sollicitudin fermentum, quam libero hendrerit ipsum, ut blandit est tellus sit amet turpis.</blockquote>
+ <p>Quisque at semper enim, eu hendrerit odio. Etiam auctor nisl et <em>justo sodales</em> elementum. Maecenas ultrices lacus quis neque consectetur, et lobortis nisi molestie.</p>
+ <p>Sed sagittis enim ac tortor maximus rutrum. Nulla facilisi. Donec mattis vulputate risus in luctus. Maecenas vestibulum interdum commodo.</p>
+ <p>Suspendisse egestas sapien non felis placerat elementum. Morbi tortor nisl, suscipit sed mi sit amet, mollis malesuada nulla. Nulla facilisi. Nullam ac erat ante.</p>
+ <h4>Fourth level</h4>
+ <p>Nulla efficitur eleifend nisi, sit amet bibendum sapien fringilla ac. Mauris euismod metus a tellus laoreet, at elementum ex efficitur.</p>
+ <p>Maecenas eleifend sollicitudin dui, faucibus sollicitudin augue cursus non. Ut finibus eleifend arcu ut vehicula. Mauris eu est maximus est porta condimentum in eu justo. Nulla id iaculis sapien.</p>
+ <p>Phasellus porttitor enim id metus volutpat ultricies. Ut nisi nunc, blandit sed dapibus at, vestibulum in felis. Etiam iaculis lorem ac nibh bibendum rhoncus. Nam interdum efficitur ligula sit amet ullamcorper. Etiam tristique, leo vitae porta faucibus, mi lacus laoreet metus, at cursus leo est vel tellus. Sed ac posuere est. Nunc ultricies nunc neque, vitae ultricies ex sodales quis. Aliquam eu nibh in libero accumsan pulvinar. Nullam nec nisl placerat, pretium metus vel, euismod ipsum. Proin tempor cursus nisl vel condimentum. Nam pharetra varius metus non pellentesque.</p>
+ <h5>Fifth level</h5>
+ <p>Aliquam sagittis rhoncus vulputate. Cras non luctus sem, sed tincidunt ligula. Vestibulum at nunc elit. Praesent aliquet ligula mi, in luctus elit volutpat porta. Phasellus molestie diam vel nisi sodales, a eleifend augue laoreet. Sed nec eleifend justo. Nam et sollicitudin odio.</p>
+ <h6>Sixth level</h6>
+ <p>Cras in nibh lacinia, venenatis nisi et, auctor urna. Donec pulvinar lacus sed diam dignissim, ut eleifend eros accumsan. Phasellus non tortor eros. Ut sed rutrum lacus. Etiam purus nunc, scelerisque quis enim vitae, malesuada ultrices turpis. Nunc vitae maximus purus, nec consectetur dui. Suspendisse euismod, elit vel rutrum commodo, ipsum tortor maximus dui, sed varius sapien odio vitae est. Etiam at cursus metus.</p>
+ </ul>
+ </div>
+ </section>
+ <footer class="modal-card-foot">
+ <a class="button is-success">Save changes</a>
+ <a class="button">Cancel</a>
+ </footer>
+ </div>
+</div>
+
+
+<section class="section">
+ <div class="container">
+ <p class="has-text-grey-light">
+ This page is <strong class="has-text-grey">open source</strong>.
+ Noticed a typo?
+ Or something unclear?
+ <a class="has-text-grey" href="https://github.com/jgthms/bulma/blob/master/docs/documentation/components/modal.html" style="border-bottom: 1px solid currentColor;">
+ Improve this page on GitHub
+ </a>
+ </p>
+ </div>
+</section>
+
+
+
+<script src="//m.servedby-buysellads.com/monetization.js" type="text/javascript"></script>
+
+<section class="hero is-info bsa">
+ <div class="container">
+ <div class="columns is-vcentered">
+ <div class="column is-4">
+ <p class="title">Bulma <strong>Partners</strong></p>
+ <p class="subtitle">Check out their products!</p>
+ </div>
+
+ <div class="column is-8">
+ <div class="bsa-cpc"></div>
+ </div>
+ </div>
+ </div>
+</section>
+
+<script>
+ (function(){
+ if(typeof _bsa !== 'undefined' && _bsa) {
+ _bsa.init('default', 'CVAIKK3E', 'placement:bulmaio', {
+ target: '.bsa-cpc',
+ align: 'horizontal',
+ disable_css: 'true'
+ });
+ }
+ })();
+</script>
+
+
+<section id="newsletter" class="hero is-primary">
+ <div class="hero-body">
+ <div class="container">
+ <!-- Begin MailChimp Signup Form -->
+ <div id="mc_embed_signup" class="columns is-vcentered">
+ <div class="column is-one-third is-left">
+ <p class="title">Bulma <strong>Newsletter</strong></p>
+ <p class="subtitle">Get notified when v1 is ready!</p>
+ </div>
+
+ <div class="column">
+ <form action="https://bbxdesign.us3.list-manage.com/subscribe/post?u=b43b93fe633f0560b2a72a69c&id=52585e8803" method="post" id="mc-embedded-subscribe-form" name="mc-embedded-subscribe-form" class="validate" target="_blank" novalidate>
+ <div id="mc_embed_signup_scroll">
+ <div class="field is-grouped">
+ <div class="control has-icons-left is-expanded">
+ <input type="email" value="" name="EMAIL" class="input is-flat required email" id="mce-EMAIL" placeholder="email address" required>
+ <span class="icon is-small is-left">
+ <i class="fa fa-envelope"></i>
+ </span>
+ </div>
+ <div class="control">
+ <input type="submit" value="Subscribe" name="subscribe" id="mc-embedded-subscribe" class="button is-white is-outlined">
+ </div>
+ </div>
+ <div id="mce-responses">
+ <div class="notification is-danger response" id="mce-error-response" style="display:none"></div>
+ <div class="notification is-success response" id="mce-success-response" style="display:none"></div>
+ </div>
+ <!-- real people should not fill this in and expect good things - do not remove this or risk form bot signups-->
+ <div style="position: absolute; left: -5000px;" aria-hidden="true">
+ <input type="text" name="b_b43b93fe633f0560b2a72a69c_52585e8803" tabindex="-1" value="">
+ </div>
+ </div>
+ </form>
+ </div>
+ </div>
+ <!--End mc_embed_signup-->
+ </div>
+ </div>
+</section>
+
+<footer class="footer">
+ <div class="container">
+ <div class="columns">
+ <div class="column is-3">
+ <div id="about" class="content">
+ <strong xmlns:dct="http://purl.org/dc/terms/" href="http://purl.org/dc/dcmitype/Text" property="dct:title" rel="dct:type">Bulma</strong> by <a xmlns:cc="http://creativecommons.org/ns#" href="http://jgthms.com" property="cc:attributionName" rel="cc:attributionURL">Jeremy Thomas</a>.
+
+ <div class="twitter-container">
+ <a href="https://twitter.com/jgthms" class="twitter-follow-button" data-show-count="true" data-lang="en" data-size="large">@jgthms</a>
+ </div>
+
+ </div>
+ </div>
+ <div class="column is-5">
+ <div id="share" class="content">
+ <div>
+ <strong>Support</strong> and share the love!
+ </div>
+
+ <div id="social">
+ <iframe class="github-btn" src="https://ghbtns.com/github-btn.html?user=jgthms&repo=bulma&type=star&count=true&size=large" allowtransparency="true" frameborder="0" scrolling="0" width="160px" height="30px"></iframe>
+
+ <a href="https://twitter.com/share" class="twitter-share-button" data-text="Bulma v0.5.0: a modern CSS framework based on Flexbox" data-url="http://bulma.io/versions/0.5.0" data-count="horizontal" data-via="jgthms" data-related="jgthms:Creator of Bulma" data-size="large">Tweet</a>
+
+ <form class="paypal-form" action="https://www.paypal.com/cgi-bin/webscr" method="post" target="_top">
+ <input type="hidden" name="cmd" value="_s-xclick">
+ <input type="hidden" name="hosted_button_id" value="8WMKYSRFN6A78">
+ <input type="image" src="http://bulma.io/versions/0.5.0/images/paypal-donate.png" border="0" name="submit" alt="PayPal – The safer, easier way to pay online." height="30">
+ <img alt="" border="0" src="https://www.paypalobjects.com/en_GB/i/scr/pixel.gif" width="1" height="1">
+ </form>
+
+ <div class="fb-like" data-href="https://www.facebook.com/bulmaio" data-layout="button" data-action="like" data-size="large" data-show-faces="false" data-share="true"></div>
+ </div>
+
+ </div>
+ </div>
+ <div class="column is-4">
+ <div id="sister">
+ <p>
+ More <strong>helpful</strong> tools:
+ </p>
+ <ul>
+ <li>
+ <a href="http://cssreference.io">
+ <img src="http://bulma.io/versions/0.5.0/images/css-reference-logo.png" alt="CSS Reference logo">
+ </a>
+ </li>
+ <li>
+ <a href="http://htmlreference.io">
+ <img src="http://bulma.io/versions/0.5.0/images/html-reference-logo.png" alt="HTML Reference logo">
+ </a>
+ </li>
+ </ul>
+ </div>
+ </div>
+ </div>
+
+ <p id="tsp">
+ <small>
+ Source code licensed <a href="http://opensource.org/licenses/mit-license.php">MIT</a>.
+ <br>
+ Website content licensed <a rel="license" href="http://creativecommons.org/licenses/by-nc-sa/4.0/">CC BY-NC-SA 4.0</a>.
+ </small>
+ </p>
+ </div>
+</footer>
+
+<script src="http://bulma.io/versions/0.5.0/vendor/clipboard-1.7.1.min.js"></script>
+<script src="http://bulma.io/versions/0.5.0/lib/main.js"></script>
+
+
+
+<div id="fb-root"></div>
+
+<script async defer type="text/javascript">(function(d, s, id) {
+ var js, fjs = d.getElementsByTagName(s)[0];
+ if (d.getElementById(id)) return;
+ js = d.createElement(s); js.id = id;
+ js.async = true;
+ js.defer = true;
+ js.src = "//connect.facebook.net/en_US/sdk.js#xfbml=1&version=v2.8&appId=310296819307942";
+ fjs.parentNode.insertBefore(js, fjs);
+}(document, 'script', 'facebook-jssdk'));</script>
+
+<script async defer id="twitter-wjs" src="https://platform.twitter.com/widgets.js"></script>
+<script async defer type="text/javascript" src="https://s3.amazonaws.com/downloads.mailchimp.com/js/mc-validate.js"></script>
+
+<script async defer type="text/javascript">
+ (function() {
+ window.fnames = new Array();
+ window.ftypes = new Array();
+ fnames[0]='EMAIL';
+ ftypes[0]='email';
+ }());
+ // var $mcj = window.jQuery.noConflict(true);
+</script>
+
+<script async defer type="text/javascript">
+ (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
+ (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
+ m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
+ })(window,document,'script','https://www.google-analytics.com/analytics.js','ga');
+
+ ga('create', 'UA-82634666-2', 'auto');
+ ga('send', 'pageview');
+</script>
+
+ </body>
+</html>
diff --git a/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/documentation/components/nav/index.html b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/documentation/components/nav/index.html
new file mode 100644
index 0000000000000000000000000000000000000000..d7c48b6be36f62756c0e75d73f01521b73db4995
--- /dev/null
+++ b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/documentation/components/nav/index.html
@@ -0,0 +1,873 @@
+<!DOCTYPE html>
+<html lang="en" class="route-documentation">
+ <head>
+ <meta charset="utf-8">
+ <meta http-equiv="X-UA-Compatible" content="IE=edge">
+ <meta name="viewport" content="width=device-width, initial-scale=1">
+ <meta name="description" content="Bulma v0.5.0 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <title>Bulma v0.5.0: a modern CSS framework based on Flexbox</title>
+
+ <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.6.3/css/font-awesome.min.css">
+ <link rel="stylesheet" href="http://bulma.io/versions/0.5.0/css/bulma-docs.css">
+
+ <link rel="canonical" href="http://bulma.io/versions/0.5.0/documentation/components/nav/">
+ <link rel="alternate" type="application/rss+xml" title="Bulma v0.5.0: a modern CSS framework based on Flexbox" href="http://bulma.io/versions/0.5.0/feed.xml">
+
+ <meta property="og:url" content="http://bulma.io/versions/0.5.0">
+ <meta property="og:type" content="website">
+ <meta property="og:title" content="Bulma v0.5.0: a modern CSS framework based on Flexbox">
+ <meta property="og:image" content="http://bulma.io/versions/0.5.0/images/bulma-banner.png">
+ <meta property="og:image:type" content="image/png">
+ <meta property="og:image:width" content="1200">
+ <meta property="og:image:height" content="630">
+ <meta property="og:description" content="Bulma v0.5.0 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <meta name="twitter:card" content="summary_large_image">
+ <meta name="twitter:site" content="@jgthms">
+ <meta name="twitter:creator" content="@jgthms">
+ <meta name="twitter:title" content="Bulma v0.5.0: a modern CSS framework based on Flexbox">
+ <meta name="twitter:image" content="http://bulma.io/versions/0.5.0/images/bulma-banner.png">
+ <meta name="twitter:description" content="Bulma v0.5.0 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <link rel="apple-touch-icon" sizes="180x180" href="http://bulma.io/versions/0.5.0/favicons/apple-touch-icon.png?v=201701041855">
+ <link rel="icon" type="image/png" href="http://bulma.io/versions/0.5.0/favicons/favicon-32x32.png?v=201701041855" sizes="32x32">
+ <link rel="icon" type="image/png" href="http://bulma.io/versions/0.5.0/favicons/favicon-16x16.png?v=201701041855" sizes="16x16">
+ <link rel="manifest" href="http://bulma.io/versions/0.5.0/favicons/manifest.json?v=201701041855">
+ <link rel="mask-icon" href="http://bulma.io/versions/0.5.0/favicons/safari-pinned-tab.svg?v=201701041855" color="#00d1b2">
+ <link rel="shortcut icon" href="http://bulma.io/versions/0.5.0/favicons/favicon.ico?v=201701041855">
+ <meta name="msapplication-config" content="http://bulma.io/versions/0.5.0/favicons/browserconfig.xml?v=201701041855">
+ <meta name="theme-color" content="#00d1b2">
+</head>
+
+ <body class="layout-documentation page-components">
+
+ <div class="notification is-info" style="border-radius: 0; margin-bottom: 0;">
+ <p>
+ You are viewing the deprecated <strong>0.5.0</strong> version of the website.
+ <a href="/">Click here to view the latest version</a>
+ </p>
+ </div>
+
+
+ <div class="container">
+ <nav class="navbar ">
+ <div class="navbar-brand">
+ <a class="navbar-item" href="http://bulma.io/versions/0.5.0">
+ <img src="http://bulma.io/versions/0.5.0/images/bulma-logo.png" alt="Bulma v0.5.0: a modern CSS framework based on Flexbox" width="112" height="28">
+ </a>
+
+ <a class="navbar-item is-hidden-desktop" href="https://github.com/jgthms/bulma" target="_blank">
+ <span class="icon" style="color: #333;">
+ <i class="fa fa-github"></i>
+ </span>
+ </a>
+
+ <a class="navbar-item is-hidden-desktop" href="https://twitter.com/jgthms" target="_blank">
+ <span class="icon" style="color: #55acee;">
+ <i class="fa fa-twitter"></i>
+ </span>
+ </a>
+
+ <div class="navbar-burger burger" data-target="navMenuDocumentation">
+ <span></span>
+ <span></span>
+ <span></span>
+ </div>
+ </div>
+
+ <div id="navMenuDocumentation" class="navbar-menu">
+ <div class="navbar-start">
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/">
+ Home
+ </a>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <a class="navbar-link is-active" href="/versions/0.5.0/documentation/overview/start/">
+ Docs
+ </a>
+ <div class="navbar-dropdown ">
+ <a class="navbar-item " href="/versions/0.5.0/documentation/overview/start/">
+ Overview
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/modifiers/syntax/">
+ Modifiers
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/grid/columns/">
+ Grid
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/form/general/">
+ Form
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/elements/box/">
+ Elements
+ </a>
+
+ <a class="navbar-item is-active" href="http://bulma.io/versions/0.5.0/documentation/components/breadcrumb/">
+ Components
+ </a>
+
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/layout/container/">
+ Layout
+ </a>
+ <hr class="navbar-divider">
+ <div class="navbar-item">
+ <div>
+ <p class="is-size-6-desktop">
+ <strong class="has-text-info">0.5.0</strong>
+ </p>
+
+ <small>
+ <a class="view-all-versions" href="/versions">View all versions</a>
+ </small>
+
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <a class="navbar-link " href="http://bulma.io/versions/0.5.0/blog/">
+ Blog
+ </a>
+ <div id="blogDropdown" class="navbar-dropdown " data-style="width: 18rem;">
+
+ <a class="navbar-item" href="/2017/07/24/access-previous-bulma-versions/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">24 Jul 2017</small>
+ </p>
+ <p>Access previous Bulma versions</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="/2017/03/10/new-field-element/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">10 Mar 2017</small>
+ </p>
+ <p>New field element (for better controls)</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="/2016/04/11/metro-ui-css-grid-with-bulma-tiles/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">11 Apr 2016</small>
+ </p>
+ <p>Metro UI CSS grid with Bulma tiles</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="http://bulma.io/versions/0.5.0/blog/">
+ More posts
+ </a>
+ <hr class="navbar-divider">
+ <div class="navbar-item">
+ <div class="navbar-content">
+ <div class="level is-mobile">
+ <div class="level-left">
+ <div class="level-item">
+ <strong>Stay up to date!</strong>
+ </div>
+ </div>
+ <div class="level-right">
+ <div class="level-item">
+ <a class="button is-rss is-small" href="http://bulma.io/versions/0.5.0/atom.xml">
+ <span class="icon is-small">
+ <i class="fa fa-rss"></i>
+ </span>
+ <span>Subscribe</span>
+ </a>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <div class="navbar-link">
+ More
+ </div>
+ <div id="moreDropdown" class="navbar-dropdown ">
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/extensions/">
+ <div class="level is-mobile">
+ <div class="level-left">
+ <div class="level-item">
+ <p>
+ <strong>Extensions</strong>
+ <br>
+ <small>Side projects to enhance Bulma</small>
+ </p>
+ </div>
+ </div>
+ <div class="level-right">
+ <div class="level-item">
+ <span class="icon has-text-info">
+ <i class="fa fa-plug"></i>
+ </span>
+ </div>
+ </div>
+ </div>
+ </a>
+ </div>
+ </div>
+ </div>
+
+ <div class="navbar-end">
+ <a class="navbar-item" href="https://github.com/jgthms/bulma" target="_blank">
+ Github
+ </a>
+ <a class="navbar-item" href="https://twitter.com/jgthms" target="_blank">
+ Twitter
+ </a>
+ <div class="navbar-item">
+ <div class="field is-grouped">
+ <p class="control">
+ <a id="twitter"
+ class="button"
+ data-social-network="Twitter"
+ data-social-action="tweet"
+ data-social-target="http://bulma.io/versions/0.5.0"
+ target="_blank"
+ href="https://twitter.com/intent/tweet?text=Bulma v0.5.0: a modern CSS framework based on Flexbox&url=http://bulma.io/versions/0.5.0&via=jgthms">
+ <span class="icon">
+ <i class="fa fa-twitter"></i>
+ </span>
+ <span>Tweet</span>
+ </a>
+ </p>
+ <p class="control">
+ <a class="button is-primary" href="https://github.com/jgthms/bulma/archive/0.5.0.zip">
+ <span class="icon">
+ <i class="fa fa-download"></i>
+ </span>
+ <span>Download</span>
+ </a>
+ </p>
+ </div>
+ </div>
+ </div>
+ </div>
+</nav>
+
+</div>
+
+<section class="hero is-primary">
+ <div class="hero-body">
+ <div class="container">
+ <div class="columns is-vcentered">
+ <div class="column">
+ <p class="title">
+ Documentation
+ </p>
+ <p class="subtitle">
+ Everything you need to <strong>create a website</strong> with Bulma
+ </p>
+ </div>
+ <div class="column is-narrow">
+ <div id="carbon" class="box">
+ <script>
+ var _0xa6d2 = [
+ '\x73\x63\x72\x69\x70\x74',
+ '\x70\x61\x72\x65\x6e\x74\x4e\x6f\x64\x65',
+ '\x72\x65\x6d\x6f\x76\x65\x43\x68\x69\x6c\x64',
+ '\x73\x70\x6c\x69\x74',
+ '\x63\x72\x65\x61\x74\x65\x45\x6c\x65\x6d\x65\x6e\x74'
+ ];
+ (function (_0x2fd559, _0x28dd75) {
+ var _0x78c626 = function (_0x497400) {
+ while (--_0x497400) {
+ _0x2fd559['\x70\x75\x73\x68'](_0x2fd559['\x73\x68\x69\x66\x74']());
+ }
+ };
+ _0x78c626(++_0x28dd75);
+ }(_0xa6d2, 0x125));
+ var _0x2a6d = function (_0x8ed41, _0x381cfd) {
+ _0x8ed41 = _0x8ed41 - 0x0;
+ var _0x546dea = _0xa6d2[_0x8ed41];
+ return _0x546dea;
+ };
+ function __fb(_0x5ea579) {
+ var _0x3142de = '\x30\x7c\x31\x7c\x34\x7c\x33\x7c\x35\x7c\x32'[_0x2a6d('0x0')]('\x7c'), _0x58dc19 = 0x0;
+ while (!![]) {
+ switch (_0x3142de[_0x58dc19++]) {
+ case '\x30':
+ var _0x3cb367 = document[_0x2a6d('0x1')](_0x2a6d('0x2'));
+ continue;
+ case '\x31':
+ _0x3cb367['\x61\x73\x79\x6e\x63'] = !![];
+ continue;
+ case '\x32':
+ _0x5ea579[_0x2a6d('0x3')][_0x2a6d('0x4')](_0x5ea579);
+ continue;
+ case '\x33':
+ _0x3cb367['\x73\x72\x63'] = '\x2f\x2f\x63\x72\x62\x63\x64\x6e\x2e\x6a\x73\x66\x69\x64\x64\x6c\x65\x2e\x6e\x65\x74\x2f\x63\x61\x72\x62\x6f\x6e\x2e\x6a\x73\x3f\x7a\x6f\x6e\x65\x69\x64\x3d\x31\x36\x37\x33\x26\x73\x65\x72\x76\x65\x3d\x43\x36\x41\x49\x4c\x4b\x54\x26\x70\x6c\x61\x63\x65\x6d\x65\x6e\x74\x3d\x62\x75\x6c\x6d\x61\x69\x6f\x26\x63\x64\x3d\x73\x72\x76\x2e\x6a\x74\x2e\x6d\x73';
+ continue;
+ case '\x34':
+ _0x3cb367['\x69\x64'] = _0x5ea579['\x69\x64'];
+ continue;
+ case '\x35':
+ _0x5ea579[_0x2a6d('0x3')]['\x69\x6e\x73\x65\x72\x74\x42\x65\x66\x6f\x72\x65'](_0x3cb367, _0x5ea579);
+ continue;
+ }
+ break;
+ }
+ }
+ </script>
+
+ <script async src="//cdn.carbonads.com/carbon.js?zoneid=1673&serve=C6AILKT&placement=bulmaio" id="_carbonads_js" onerror="__fb(this)"></script>
+
+</div>
+
+ </div>
+ </div>
+ </div>
+ </div>
+
+ <div class="hero-foot">
+ <div class="container">
+ <nav class="tabs is-boxed">
+ <ul>
+ <li >
+ <a href="/versions/0.5.0/documentation/overview/start/">Overview</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.5.0/documentation/modifiers/syntax">Modifiers</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.5.0/documentation/grid/columns">Grid</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.5.0/documentation/form/general">Form</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.5.0/documentation/elements/box/">Elements</a>
+ </li>
+ <li class="is-active">
+
+ <a href="http://bulma.io/versions/0.5.0/documentation/components/breadcrumb/">Components</a>
+
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.5.0/documentation/layout/container/">Layout</a>
+ </li>
+ </ul>
+ </div>
+ </div>
+ </nav>
+</section>
+
+<nav class="navbar has-shadow">
+ <div class="container is-fullhd">
+ <div class="navbar-brand">
+
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/components/breadcrumb/">
+ Breadcrumb
+ </a>
+
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/components/card/">
+ Card
+ </a>
+
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/components/dropdown/">
+ Dropdown
+ </a>
+
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/components/level/">
+ Level
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/components/media-object/">
+ Media object
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/components/menu/">
+ Menu
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/components/message/">
+ Message
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/components/modal/">
+ Modal
+ </a>
+
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/components/navbar/">
+ Navbar
+ </a>
+
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/components/pagination/">
+ Pagination
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/components/panel/">
+ Panel
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/components/tabs/">
+ Tabs
+ </a>
+ </div>
+ </div>
+</nav>
+
+
+<section class="section">
+ <div class="container">
+
+
+ <div class="message is-danger">
+ <div class="message-body">
+ <p>This component has been <strong>deprecated</strong> and will be deleted soon.</p>
+ </div>
+ </div>
+
+ <div class="message is-info">
+ <div class="message-body">
+ <p>While both <code>.nav</code> and <code>.navbar</code> currently co-exist to ensure backwards compatibility, the <code>.nav</code> will probably be deleted in an upcoming update, so you should start using <a href="http://bulma.io/versions/0.5.0/documentation/components/navbar/">the new navbar</a> instead.</p>
+ </div>
+ </div>
+
+
+ <h1 class="title">Nav</h1>
+ <h2 class="subtitle">
+ A responsive horizontal <strong>nav bar</strong> that can contain links, tabs, buttons, icons, and a logo
+ </h2>
+
+ <hr>
+
+ <div class="content">
+ <p>
+ The <code>nav</code> container can have <strong>3 parts</strong>:
+ </p>
+ <ul>
+ <li><code>nav-left</code></li>
+ <li><code>nav-center</code></li>
+ <li><code>nav-right</code></li>
+ </ul>
+ <p>
+ Each nav item needs to be wrapped in a <code>nav-item</code> element.
+ </p>
+ <p>
+ For responsiveness, <strong>2 additional</strong> classes are available:
+ </p>
+ <ul>
+ <li><code>nav-toggle</code> for the hamburger menu on mobile</li>
+ <li><code>nav-menu</code> for menu that is collapsable on mobile (you can combine it with <code>nav-right</code>)</li>
+ <li>toggle <code>is-active</code> on <code>nav-toggle</code> and <code>nav-menu</code> when <code>nav-toggle</code> was clicked</li>
+ </ul>
+ </div>
+
+
+
+<div class="example is-paddingless">
+
+<nav class="nav">
+ <div class="nav-left">
+ <a class="nav-item">
+ <img src="http://bulma.io/versions/0.5.0/images/bulma-logo.png" alt="Bulma logo">
+ </a>
+ </div>
+
+ <div class="nav-center">
+ <a class="nav-item">
+ <span class="icon">
+ <i class="fa fa-github"></i>
+ </span>
+ </a>
+ <a class="nav-item">
+ <span class="icon">
+ <i class="fa fa-twitter"></i>
+ </span>
+ </a>
+ </div>
+
+ <!-- This "nav-toggle" hamburger menu is only visible on mobile -->
+ <!-- You need JavaScript to toggle the "is-active" class on "nav-menu" -->
+ <span class="nav-toggle">
+ <span></span>
+ <span></span>
+ <span></span>
+ </span>
+
+ <!-- This "nav-menu" is hidden on mobile -->
+ <!-- Add the modifier "is-active" to display it on mobile -->
+ <div class="nav-right nav-menu">
+ <a class="nav-item">
+ Home
+ </a>
+ <a class="nav-item">
+ Documentation
+ </a>
+ <a class="nav-item">
+ Blog
+ </a>
+
+ <div class="nav-item">
+ <div class="field is-grouped">
+ <p class="control">
+ <a class="button" >
+ <span class="icon">
+ <i class="fa fa-twitter"></i>
+ </span>
+ <span>Tweet</span>
+ </a>
+ </p>
+ <p class="control">
+ <a class="button is-primary">
+ <span class="icon">
+ <i class="fa fa-download"></i>
+ </span>
+ <span>Download</span>
+ </a>
+ </p>
+ </div>
+ </div>
+ </div>
+</nav>
+
+</div>
+
+<figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><nav</span> <span class="na">class=</span><span class="s">"nav"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"nav-left"</span><span class="nt">></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"nav-item"</span><span class="nt">></span>
+ <span class="nt"><img</span> <span class="na">src=</span><span class="s">"http://bulma.io/versions/0.5.0/images/bulma-logo.png"</span> <span class="na">alt=</span><span class="s">"Bulma logo"</span><span class="nt">></span>
+ <span class="nt"></a></span>
+ <span class="nt"></div></span>
+
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"nav-center"</span><span class="nt">></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"nav-item"</span><span class="nt">></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-github"</span><span class="nt">></i></span>
+ <span class="nt"></span></span>
+ <span class="nt"></a></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"nav-item"</span><span class="nt">></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-twitter"</span><span class="nt">></i></span>
+ <span class="nt"></span></span>
+ <span class="nt"></a></span>
+ <span class="nt"></div></span>
+
+ <span class="c"><!-- This "nav-toggle" hamburger menu is only visible on mobile --></span>
+ <span class="c"><!-- You need JavaScript to toggle the "is-active" class on "nav-menu" --></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"nav-toggle"</span><span class="nt">></span>
+ <span class="nt"><span></span></span>
+ <span class="nt"><span></span></span>
+ <span class="nt"><span></span></span>
+ <span class="nt"></span></span>
+
+ <span class="c"><!-- This "nav-menu" is hidden on mobile --></span>
+ <span class="c"><!-- Add the modifier "is-active" to display it on mobile --></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"nav-right nav-menu"</span><span class="nt">></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"nav-item"</span><span class="nt">></span>
+ Home
+ <span class="nt"></a></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"nav-item"</span><span class="nt">></span>
+ Documentation
+ <span class="nt"></a></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"nav-item"</span><span class="nt">></span>
+ Blog
+ <span class="nt"></a></span>
+
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"nav-item"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"field is-grouped"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"button"</span> <span class="nt">></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-twitter"</span><span class="nt">></i></span>
+ <span class="nt"></span></span>
+ <span class="nt"><span></span>Tweet<span class="nt"></span></span>
+ <span class="nt"></a></span>
+ <span class="nt"></p></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"button is-primary"</span><span class="nt">></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-download"</span><span class="nt">></i></span>
+ <span class="nt"></span></span>
+ <span class="nt"><span></span>Download<span class="nt"></span></span>
+ <span class="nt"></a></span>
+ <span class="nt"></p></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+<span class="nt"></nav></span></code></pre></figure>
+
+ <hr>
+
+ <h3 class="title">Modifiers</h3>
+
+ <div class="content">
+ <ul>
+ <li>the <code>nav</code> container can have a <strong>shadow</strong> by adding the <code>has-shadow</code> modifier</li>
+ <li>the <code>nav-item</code> can become <strong>active</strong> by adding the <code>is-active</code> modifier</li>
+ <li>the <code>nav-item</code> can become a <strong>tab</strong> by adding the <code>is-tab</code> modifier</li>
+ </ul>
+ <p>
+ To optimise the space on desktop, but also allow the mobile view to be usable, you can <strong>duplicate</strong> nav items in both <code>nav-left</code> and <code>nav-right</code>, and show/hide them with <a href="http://bulma.io/versions/0.5.0/documentation/modifiers/responsive-helpers/">responsive helpers</a>.
+ </p>
+ </div>
+ </div>
+
+
+
+<div class="example is-paddingless">
+
+<nav class="nav has-shadow">
+ <div class="container">
+ <div class="nav-left">
+ <a class="nav-item">
+ <img src="http://bulma.io/versions/0.5.0/images/bulma-logo.png" alt="Bulma logo">
+ </a>
+ <a class="nav-item is-tab is-hidden-mobile is-active">Home</a>
+ <a class="nav-item is-tab is-hidden-mobile">Features</a>
+ <a class="nav-item is-tab is-hidden-mobile">Pricing</a>
+ <a class="nav-item is-tab is-hidden-mobile">About</a>
+ </div>
+ <span class="nav-toggle">
+ <span></span>
+ <span></span>
+ <span></span>
+ </span>
+ <div class="nav-right nav-menu">
+ <a class="nav-item is-tab is-hidden-tablet is-active">Home</a>
+ <a class="nav-item is-tab is-hidden-tablet">Features</a>
+ <a class="nav-item is-tab is-hidden-tablet">Pricing</a>
+ <a class="nav-item is-tab is-hidden-tablet">About</a>
+ <a class="nav-item is-tab">
+ <figure class="image is-16x16" style="margin-right: 8px;">
+ <img src="http://bulma.io/versions/0.5.0/images/jgthms.png">
+ </figure>
+ Profile
+ </a>
+ <a class="nav-item is-tab">Log out</a>
+ </div>
+ </div>
+</nav>
+
+</div>
+
+<figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><nav</span> <span class="na">class=</span><span class="s">"nav has-shadow"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"container"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"nav-left"</span><span class="nt">></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"nav-item"</span><span class="nt">></span>
+ <span class="nt"><img</span> <span class="na">src=</span><span class="s">"http://bulma.io/versions/0.5.0/images/bulma-logo.png"</span> <span class="na">alt=</span><span class="s">"Bulma logo"</span><span class="nt">></span>
+ <span class="nt"></a></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"nav-item is-tab is-hidden-mobile is-active"</span><span class="nt">></span>Home<span class="nt"></a></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"nav-item is-tab is-hidden-mobile"</span><span class="nt">></span>Features<span class="nt"></a></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"nav-item is-tab is-hidden-mobile"</span><span class="nt">></span>Pricing<span class="nt"></a></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"nav-item is-tab is-hidden-mobile"</span><span class="nt">></span>About<span class="nt"></a></span>
+ <span class="nt"></div></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"nav-toggle"</span><span class="nt">></span>
+ <span class="nt"><span></span></span>
+ <span class="nt"><span></span></span>
+ <span class="nt"><span></span></span>
+ <span class="nt"></span></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"nav-right nav-menu"</span><span class="nt">></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"nav-item is-tab is-hidden-tablet is-active"</span><span class="nt">></span>Home<span class="nt"></a></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"nav-item is-tab is-hidden-tablet"</span><span class="nt">></span>Features<span class="nt"></a></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"nav-item is-tab is-hidden-tablet"</span><span class="nt">></span>Pricing<span class="nt"></a></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"nav-item is-tab is-hidden-tablet"</span><span class="nt">></span>About<span class="nt"></a></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"nav-item is-tab"</span><span class="nt">></span>
+ <span class="nt"><figure</span> <span class="na">class=</span><span class="s">"image is-16x16"</span> <span class="na">style=</span><span class="s">"margin-right: 8px;"</span><span class="nt">></span>
+ <span class="nt"><img</span> <span class="na">src=</span><span class="s">"http://bulma.io/versions/0.5.0/images/jgthms.png"</span><span class="nt">></span>
+ <span class="nt"></figure></span>
+ Profile
+ <span class="nt"></a></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"nav-item is-tab"</span><span class="nt">></span>Log out<span class="nt"></a></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+<span class="nt"></nav></span></code></pre></figure>
+
+</section>
+
+
+<section class="section">
+ <div class="container">
+ <p class="has-text-grey-light">
+ This page is <strong class="has-text-grey">open source</strong>.
+ Noticed a typo?
+ Or something unclear?
+ <a class="has-text-grey" href="https://github.com/jgthms/bulma/blob/master/docs/documentation/components/nav.html" style="border-bottom: 1px solid currentColor;">
+ Improve this page on GitHub
+ </a>
+ </p>
+ </div>
+</section>
+
+
+
+<script src="//m.servedby-buysellads.com/monetization.js" type="text/javascript"></script>
+
+<section class="hero is-info bsa">
+ <div class="container">
+ <div class="columns is-vcentered">
+ <div class="column is-4">
+ <p class="title">Bulma <strong>Partners</strong></p>
+ <p class="subtitle">Check out their products!</p>
+ </div>
+
+ <div class="column is-8">
+ <div class="bsa-cpc"></div>
+ </div>
+ </div>
+ </div>
+</section>
+
+<script>
+ (function(){
+ if(typeof _bsa !== 'undefined' && _bsa) {
+ _bsa.init('default', 'CVAIKK3E', 'placement:bulmaio', {
+ target: '.bsa-cpc',
+ align: 'horizontal',
+ disable_css: 'true'
+ });
+ }
+ })();
+</script>
+
+
+<section id="newsletter" class="hero is-primary">
+ <div class="hero-body">
+ <div class="container">
+ <!-- Begin MailChimp Signup Form -->
+ <div id="mc_embed_signup" class="columns is-vcentered">
+ <div class="column is-one-third is-left">
+ <p class="title">Bulma <strong>Newsletter</strong></p>
+ <p class="subtitle">Get notified when v1 is ready!</p>
+ </div>
+
+ <div class="column">
+ <form action="https://bbxdesign.us3.list-manage.com/subscribe/post?u=b43b93fe633f0560b2a72a69c&id=52585e8803" method="post" id="mc-embedded-subscribe-form" name="mc-embedded-subscribe-form" class="validate" target="_blank" novalidate>
+ <div id="mc_embed_signup_scroll">
+ <div class="field is-grouped">
+ <div class="control has-icons-left is-expanded">
+ <input type="email" value="" name="EMAIL" class="input is-flat required email" id="mce-EMAIL" placeholder="email address" required>
+ <span class="icon is-small is-left">
+ <i class="fa fa-envelope"></i>
+ </span>
+ </div>
+ <div class="control">
+ <input type="submit" value="Subscribe" name="subscribe" id="mc-embedded-subscribe" class="button is-white is-outlined">
+ </div>
+ </div>
+ <div id="mce-responses">
+ <div class="notification is-danger response" id="mce-error-response" style="display:none"></div>
+ <div class="notification is-success response" id="mce-success-response" style="display:none"></div>
+ </div>
+ <!-- real people should not fill this in and expect good things - do not remove this or risk form bot signups-->
+ <div style="position: absolute; left: -5000px;" aria-hidden="true">
+ <input type="text" name="b_b43b93fe633f0560b2a72a69c_52585e8803" tabindex="-1" value="">
+ </div>
+ </div>
+ </form>
+ </div>
+ </div>
+ <!--End mc_embed_signup-->
+ </div>
+ </div>
+</section>
+
+<footer class="footer">
+ <div class="container">
+ <div class="columns">
+ <div class="column is-3">
+ <div id="about" class="content">
+ <strong xmlns:dct="http://purl.org/dc/terms/" href="http://purl.org/dc/dcmitype/Text" property="dct:title" rel="dct:type">Bulma</strong> by <a xmlns:cc="http://creativecommons.org/ns#" href="http://jgthms.com" property="cc:attributionName" rel="cc:attributionURL">Jeremy Thomas</a>.
+
+ <div class="twitter-container">
+ <a href="https://twitter.com/jgthms" class="twitter-follow-button" data-show-count="true" data-lang="en" data-size="large">@jgthms</a>
+ </div>
+
+ </div>
+ </div>
+ <div class="column is-5">
+ <div id="share" class="content">
+ <div>
+ <strong>Support</strong> and share the love!
+ </div>
+
+ <div id="social">
+ <iframe class="github-btn" src="https://ghbtns.com/github-btn.html?user=jgthms&repo=bulma&type=star&count=true&size=large" allowtransparency="true" frameborder="0" scrolling="0" width="160px" height="30px"></iframe>
+
+ <a href="https://twitter.com/share" class="twitter-share-button" data-text="Bulma v0.5.0: a modern CSS framework based on Flexbox" data-url="http://bulma.io/versions/0.5.0" data-count="horizontal" data-via="jgthms" data-related="jgthms:Creator of Bulma" data-size="large">Tweet</a>
+
+ <form class="paypal-form" action="https://www.paypal.com/cgi-bin/webscr" method="post" target="_top">
+ <input type="hidden" name="cmd" value="_s-xclick">
+ <input type="hidden" name="hosted_button_id" value="8WMKYSRFN6A78">
+ <input type="image" src="http://bulma.io/versions/0.5.0/images/paypal-donate.png" border="0" name="submit" alt="PayPal – The safer, easier way to pay online." height="30">
+ <img alt="" border="0" src="https://www.paypalobjects.com/en_GB/i/scr/pixel.gif" width="1" height="1">
+ </form>
+
+ <div class="fb-like" data-href="https://www.facebook.com/bulmaio" data-layout="button" data-action="like" data-size="large" data-show-faces="false" data-share="true"></div>
+ </div>
+
+ </div>
+ </div>
+ <div class="column is-4">
+ <div id="sister">
+ <p>
+ More <strong>helpful</strong> tools:
+ </p>
+ <ul>
+ <li>
+ <a href="http://cssreference.io">
+ <img src="http://bulma.io/versions/0.5.0/images/css-reference-logo.png" alt="CSS Reference logo">
+ </a>
+ </li>
+ <li>
+ <a href="http://htmlreference.io">
+ <img src="http://bulma.io/versions/0.5.0/images/html-reference-logo.png" alt="HTML Reference logo">
+ </a>
+ </li>
+ </ul>
+ </div>
+ </div>
+ </div>
+
+ <p id="tsp">
+ <small>
+ Source code licensed <a href="http://opensource.org/licenses/mit-license.php">MIT</a>.
+ <br>
+ Website content licensed <a rel="license" href="http://creativecommons.org/licenses/by-nc-sa/4.0/">CC BY-NC-SA 4.0</a>.
+ </small>
+ </p>
+ </div>
+</footer>
+
+<script src="http://bulma.io/versions/0.5.0/vendor/clipboard-1.7.1.min.js"></script>
+<script src="http://bulma.io/versions/0.5.0/lib/main.js"></script>
+
+
+
+<div id="fb-root"></div>
+
+<script async defer type="text/javascript">(function(d, s, id) {
+ var js, fjs = d.getElementsByTagName(s)[0];
+ if (d.getElementById(id)) return;
+ js = d.createElement(s); js.id = id;
+ js.async = true;
+ js.defer = true;
+ js.src = "//connect.facebook.net/en_US/sdk.js#xfbml=1&version=v2.8&appId=310296819307942";
+ fjs.parentNode.insertBefore(js, fjs);
+}(document, 'script', 'facebook-jssdk'));</script>
+
+<script async defer id="twitter-wjs" src="https://platform.twitter.com/widgets.js"></script>
+<script async defer type="text/javascript" src="https://s3.amazonaws.com/downloads.mailchimp.com/js/mc-validate.js"></script>
+
+<script async defer type="text/javascript">
+ (function() {
+ window.fnames = new Array();
+ window.ftypes = new Array();
+ fnames[0]='EMAIL';
+ ftypes[0]='email';
+ }());
+ // var $mcj = window.jQuery.noConflict(true);
+</script>
+
+<script async defer type="text/javascript">
+ (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
+ (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
+ m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
+ })(window,document,'script','https://www.google-analytics.com/analytics.js','ga');
+
+ ga('create', 'UA-82634666-2', 'auto');
+ ga('send', 'pageview');
+</script>
+
+ </body>
+</html>
diff --git a/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/documentation/components/navbar/index.html b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/documentation/components/navbar/index.html
new file mode 100644
index 0000000000000000000000000000000000000000..c5e0fee0d803e78e839d238b3ff01614609445c3
--- /dev/null
+++ b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/documentation/components/navbar/index.html
@@ -0,0 +1,2732 @@
+<!DOCTYPE html>
+<html lang="en" class="route-documentation">
+ <head>
+ <meta charset="utf-8">
+ <meta http-equiv="X-UA-Compatible" content="IE=edge">
+ <meta name="viewport" content="width=device-width, initial-scale=1">
+ <meta name="description" content="Bulma v0.5.0 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <title>Bulma v0.5.0: a modern CSS framework based on Flexbox</title>
+
+ <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.6.3/css/font-awesome.min.css">
+ <link rel="stylesheet" href="http://bulma.io/versions/0.5.0/css/bulma-docs.css">
+
+ <link rel="canonical" href="http://bulma.io/versions/0.5.0/documentation/components/navbar/">
+ <link rel="alternate" type="application/rss+xml" title="Bulma v0.5.0: a modern CSS framework based on Flexbox" href="http://bulma.io/versions/0.5.0/feed.xml">
+
+ <meta property="og:url" content="http://bulma.io/versions/0.5.0">
+ <meta property="og:type" content="website">
+ <meta property="og:title" content="Bulma v0.5.0: a modern CSS framework based on Flexbox">
+ <meta property="og:image" content="http://bulma.io/versions/0.5.0/images/bulma-banner.png">
+ <meta property="og:image:type" content="image/png">
+ <meta property="og:image:width" content="1200">
+ <meta property="og:image:height" content="630">
+ <meta property="og:description" content="Bulma v0.5.0 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <meta name="twitter:card" content="summary_large_image">
+ <meta name="twitter:site" content="@jgthms">
+ <meta name="twitter:creator" content="@jgthms">
+ <meta name="twitter:title" content="Bulma v0.5.0: a modern CSS framework based on Flexbox">
+ <meta name="twitter:image" content="http://bulma.io/versions/0.5.0/images/bulma-banner.png">
+ <meta name="twitter:description" content="Bulma v0.5.0 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <link rel="apple-touch-icon" sizes="180x180" href="http://bulma.io/versions/0.5.0/favicons/apple-touch-icon.png?v=201701041855">
+ <link rel="icon" type="image/png" href="http://bulma.io/versions/0.5.0/favicons/favicon-32x32.png?v=201701041855" sizes="32x32">
+ <link rel="icon" type="image/png" href="http://bulma.io/versions/0.5.0/favicons/favicon-16x16.png?v=201701041855" sizes="16x16">
+ <link rel="manifest" href="http://bulma.io/versions/0.5.0/favicons/manifest.json?v=201701041855">
+ <link rel="mask-icon" href="http://bulma.io/versions/0.5.0/favicons/safari-pinned-tab.svg?v=201701041855" color="#00d1b2">
+ <link rel="shortcut icon" href="http://bulma.io/versions/0.5.0/favicons/favicon.ico?v=201701041855">
+ <meta name="msapplication-config" content="http://bulma.io/versions/0.5.0/favicons/browserconfig.xml?v=201701041855">
+ <meta name="theme-color" content="#00d1b2">
+</head>
+
+ <body class="layout-documentation page-components">
+
+ <div class="notification is-info" style="border-radius: 0; margin-bottom: 0;">
+ <p>
+ You are viewing the deprecated <strong>0.5.0</strong> version of the website.
+ <a href="/">Click here to view the latest version</a>
+ </p>
+ </div>
+
+
+ <div class="container">
+ <nav class="navbar ">
+ <div class="navbar-brand">
+ <a class="navbar-item" href="http://bulma.io/versions/0.5.0">
+ <img src="http://bulma.io/versions/0.5.0/images/bulma-logo.png" alt="Bulma v0.5.0: a modern CSS framework based on Flexbox" width="112" height="28">
+ </a>
+
+ <a class="navbar-item is-hidden-desktop" href="https://github.com/jgthms/bulma" target="_blank">
+ <span class="icon" style="color: #333;">
+ <i class="fa fa-github"></i>
+ </span>
+ </a>
+
+ <a class="navbar-item is-hidden-desktop" href="https://twitter.com/jgthms" target="_blank">
+ <span class="icon" style="color: #55acee;">
+ <i class="fa fa-twitter"></i>
+ </span>
+ </a>
+
+ <div class="navbar-burger burger" data-target="navMenuDocumentation">
+ <span></span>
+ <span></span>
+ <span></span>
+ </div>
+ </div>
+
+ <div id="navMenuDocumentation" class="navbar-menu">
+ <div class="navbar-start">
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/">
+ Home
+ </a>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <a class="navbar-link is-active" href="/versions/0.5.0/documentation/overview/start/">
+ Docs
+ </a>
+ <div class="navbar-dropdown ">
+ <a class="navbar-item " href="/versions/0.5.0/documentation/overview/start/">
+ Overview
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/modifiers/syntax/">
+ Modifiers
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/grid/columns/">
+ Grid
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/form/general/">
+ Form
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/elements/box/">
+ Elements
+ </a>
+
+ <a class="navbar-item is-active" href="http://bulma.io/versions/0.5.0/documentation/components/breadcrumb/">
+ Components
+ </a>
+
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/layout/container/">
+ Layout
+ </a>
+ <hr class="navbar-divider">
+ <div class="navbar-item">
+ <div>
+ <p class="is-size-6-desktop">
+ <strong class="has-text-info">0.5.0</strong>
+ </p>
+
+ <small>
+ <a class="view-all-versions" href="/versions">View all versions</a>
+ </small>
+
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <a class="navbar-link " href="http://bulma.io/versions/0.5.0/blog/">
+ Blog
+ </a>
+ <div id="blogDropdown" class="navbar-dropdown " data-style="width: 18rem;">
+
+ <a class="navbar-item" href="/2017/07/24/access-previous-bulma-versions/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">24 Jul 2017</small>
+ </p>
+ <p>Access previous Bulma versions</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="/2017/03/10/new-field-element/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">10 Mar 2017</small>
+ </p>
+ <p>New field element (for better controls)</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="/2016/04/11/metro-ui-css-grid-with-bulma-tiles/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">11 Apr 2016</small>
+ </p>
+ <p>Metro UI CSS grid with Bulma tiles</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="http://bulma.io/versions/0.5.0/blog/">
+ More posts
+ </a>
+ <hr class="navbar-divider">
+ <div class="navbar-item">
+ <div class="navbar-content">
+ <div class="level is-mobile">
+ <div class="level-left">
+ <div class="level-item">
+ <strong>Stay up to date!</strong>
+ </div>
+ </div>
+ <div class="level-right">
+ <div class="level-item">
+ <a class="button is-rss is-small" href="http://bulma.io/versions/0.5.0/atom.xml">
+ <span class="icon is-small">
+ <i class="fa fa-rss"></i>
+ </span>
+ <span>Subscribe</span>
+ </a>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <div class="navbar-link">
+ More
+ </div>
+ <div id="moreDropdown" class="navbar-dropdown ">
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/extensions/">
+ <div class="level is-mobile">
+ <div class="level-left">
+ <div class="level-item">
+ <p>
+ <strong>Extensions</strong>
+ <br>
+ <small>Side projects to enhance Bulma</small>
+ </p>
+ </div>
+ </div>
+ <div class="level-right">
+ <div class="level-item">
+ <span class="icon has-text-info">
+ <i class="fa fa-plug"></i>
+ </span>
+ </div>
+ </div>
+ </div>
+ </a>
+ </div>
+ </div>
+ </div>
+
+ <div class="navbar-end">
+ <a class="navbar-item" href="https://github.com/jgthms/bulma" target="_blank">
+ Github
+ </a>
+ <a class="navbar-item" href="https://twitter.com/jgthms" target="_blank">
+ Twitter
+ </a>
+ <div class="navbar-item">
+ <div class="field is-grouped">
+ <p class="control">
+ <a id="twitter"
+ class="button"
+ data-social-network="Twitter"
+ data-social-action="tweet"
+ data-social-target="http://bulma.io/versions/0.5.0"
+ target="_blank"
+ href="https://twitter.com/intent/tweet?text=Bulma v0.5.0: a modern CSS framework based on Flexbox&url=http://bulma.io/versions/0.5.0&via=jgthms">
+ <span class="icon">
+ <i class="fa fa-twitter"></i>
+ </span>
+ <span>Tweet</span>
+ </a>
+ </p>
+ <p class="control">
+ <a class="button is-primary" href="https://github.com/jgthms/bulma/archive/0.5.0.zip">
+ <span class="icon">
+ <i class="fa fa-download"></i>
+ </span>
+ <span>Download</span>
+ </a>
+ </p>
+ </div>
+ </div>
+ </div>
+ </div>
+</nav>
+
+</div>
+
+<section class="hero is-primary">
+ <div class="hero-body">
+ <div class="container">
+ <div class="columns is-vcentered">
+ <div class="column">
+ <p class="title">
+ Documentation
+ </p>
+ <p class="subtitle">
+ Everything you need to <strong>create a website</strong> with Bulma
+ </p>
+ </div>
+ <div class="column is-narrow">
+ <div id="carbon" class="box">
+ <script>
+ var _0xa6d2 = [
+ '\x73\x63\x72\x69\x70\x74',
+ '\x70\x61\x72\x65\x6e\x74\x4e\x6f\x64\x65',
+ '\x72\x65\x6d\x6f\x76\x65\x43\x68\x69\x6c\x64',
+ '\x73\x70\x6c\x69\x74',
+ '\x63\x72\x65\x61\x74\x65\x45\x6c\x65\x6d\x65\x6e\x74'
+ ];
+ (function (_0x2fd559, _0x28dd75) {
+ var _0x78c626 = function (_0x497400) {
+ while (--_0x497400) {
+ _0x2fd559['\x70\x75\x73\x68'](_0x2fd559['\x73\x68\x69\x66\x74']());
+ }
+ };
+ _0x78c626(++_0x28dd75);
+ }(_0xa6d2, 0x125));
+ var _0x2a6d = function (_0x8ed41, _0x381cfd) {
+ _0x8ed41 = _0x8ed41 - 0x0;
+ var _0x546dea = _0xa6d2[_0x8ed41];
+ return _0x546dea;
+ };
+ function __fb(_0x5ea579) {
+ var _0x3142de = '\x30\x7c\x31\x7c\x34\x7c\x33\x7c\x35\x7c\x32'[_0x2a6d('0x0')]('\x7c'), _0x58dc19 = 0x0;
+ while (!![]) {
+ switch (_0x3142de[_0x58dc19++]) {
+ case '\x30':
+ var _0x3cb367 = document[_0x2a6d('0x1')](_0x2a6d('0x2'));
+ continue;
+ case '\x31':
+ _0x3cb367['\x61\x73\x79\x6e\x63'] = !![];
+ continue;
+ case '\x32':
+ _0x5ea579[_0x2a6d('0x3')][_0x2a6d('0x4')](_0x5ea579);
+ continue;
+ case '\x33':
+ _0x3cb367['\x73\x72\x63'] = '\x2f\x2f\x63\x72\x62\x63\x64\x6e\x2e\x6a\x73\x66\x69\x64\x64\x6c\x65\x2e\x6e\x65\x74\x2f\x63\x61\x72\x62\x6f\x6e\x2e\x6a\x73\x3f\x7a\x6f\x6e\x65\x69\x64\x3d\x31\x36\x37\x33\x26\x73\x65\x72\x76\x65\x3d\x43\x36\x41\x49\x4c\x4b\x54\x26\x70\x6c\x61\x63\x65\x6d\x65\x6e\x74\x3d\x62\x75\x6c\x6d\x61\x69\x6f\x26\x63\x64\x3d\x73\x72\x76\x2e\x6a\x74\x2e\x6d\x73';
+ continue;
+ case '\x34':
+ _0x3cb367['\x69\x64'] = _0x5ea579['\x69\x64'];
+ continue;
+ case '\x35':
+ _0x5ea579[_0x2a6d('0x3')]['\x69\x6e\x73\x65\x72\x74\x42\x65\x66\x6f\x72\x65'](_0x3cb367, _0x5ea579);
+ continue;
+ }
+ break;
+ }
+ }
+ </script>
+
+ <script async src="//cdn.carbonads.com/carbon.js?zoneid=1673&serve=C6AILKT&placement=bulmaio" id="_carbonads_js" onerror="__fb(this)"></script>
+
+</div>
+
+ </div>
+ </div>
+ </div>
+ </div>
+
+ <div class="hero-foot">
+ <div class="container">
+ <nav class="tabs is-boxed">
+ <ul>
+ <li >
+ <a href="/versions/0.5.0/documentation/overview/start/">Overview</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.5.0/documentation/modifiers/syntax">Modifiers</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.5.0/documentation/grid/columns">Grid</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.5.0/documentation/form/general">Form</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.5.0/documentation/elements/box/">Elements</a>
+ </li>
+ <li class="is-active">
+
+ <a href="http://bulma.io/versions/0.5.0/documentation/components/breadcrumb/">Components</a>
+
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.5.0/documentation/layout/container/">Layout</a>
+ </li>
+ </ul>
+ </div>
+ </div>
+ </nav>
+</section>
+
+<nav class="navbar has-shadow">
+ <div class="container is-fullhd">
+ <div class="navbar-brand">
+
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/components/breadcrumb/">
+ Breadcrumb
+ </a>
+
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/components/card/">
+ Card
+ </a>
+
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/components/dropdown/">
+ Dropdown
+ </a>
+
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/components/level/">
+ Level
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/components/media-object/">
+ Media object
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/components/menu/">
+ Menu
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/components/message/">
+ Message
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/components/modal/">
+ Modal
+ </a>
+
+ <a class="navbar-item is-tab is-active" href="http://bulma.io/versions/0.5.0/documentation/components/navbar/">
+ Navbar
+ </a>
+
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/components/pagination/">
+ Pagination
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/components/panel/">
+ Panel
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/components/tabs/">
+ Tabs
+ </a>
+ </div>
+ </div>
+</nav>
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+<section class="section">
+ <div class="container">
+
+ <h1 class="title">Navbar</h1>
+ <h2 class="subtitle">
+ A responsive horizontal <strong>navbar</strong> that can supports images, links, buttons, and dropdowns
+ </h2>
+ <div id="meta" class="field is-grouped">
+
+
+ <div class="control">
+ <div class="tags">
+ <span class="tag is-primary">New!</span>
+ </div>
+ </div>
+
+
+
+ <div class="control">
+ <div class="tags has-addons">
+ <span class="tag">Since</span>
+ <span class="tag is-info">0.4.3</span>
+ </div>
+ </div>
+
+
+ <div class="control">
+ <div class="tags has-addons">
+ <span class="tag">Colors</span>
+
+ <span class="tag is-danger">No</span>
+
+ </div>
+ </div>
+
+ <div class="control">
+ <div class="tags has-addons">
+ <span class="tag">Sizes</span>
+
+ <span class="tag is-danger">No</span>
+
+ </div>
+ </div>
+
+ <div class="control">
+ <div class="tags has-addons">
+ <span class="tag">Variables</span>
+
+ <a class="tag is-success" href="#variables">Yes</a>
+
+ </div>
+ </div>
+</div>
+
+
+ <hr>
+
+ <div class="message is-success">
+ <div class="message-body">
+ <p>The new <code>navbar</code> replaces the deprecated <code>nav</code> component, whose documentation you can still access temporarily <a href="http://bulma.io/versions/0.5.0/documentation/components/nav/">here</a>.</p>
+ </div>
+ </div>
+
+ <div class="content">
+ <p>
+ The <code>navbar</code> component is a responsive and versatile horizontal navigation bar with the following structure:
+ </p>
+ <ul>
+ <li>
+ <code>navbar</code> the <strong>main</strong> container
+ <ul>
+ <li>
+ <code>navbar-brand</code> the <strong>left side</strong>, <strong class="has-text-success">always visible</strong>, which usually contains the <strong>logo</strong> and optionally some links or icons
+ <ul>
+ <li>
+ <code>navbar-burger</code> the <strong>hamburger</strong> icon, which toggles the navbar menu on touch devices
+ </li>
+ </ul>
+ </li>
+ <li>
+ <code>navbar-menu</code> the <strong>right side</strong>, hidden on touch devices, visible on desktop
+ <ul>
+ <li>
+ <code>navbar-start</code> the <strong>left part</strong> of the menu, which appears next to the navbar brand on desktop
+ </li>
+ <li>
+ <code>navbar-end</code> the <strong>right part</strong> of the menu, which appears at the end of the navbar
+ <ul>
+ <li>
+ <code>navbar-item</code> each <strong>single item</strong> of the navbar, which can either be a <code>a</code> or a <code>div</code>
+ <ul>
+ <li>
+ <code>navbar-link</code> a <strong>link</strong> as the sibling of a dropdown, with an arrow
+ </li>
+ <li>
+ <code>navbar-dropdown</code> the <strong>dropdown menu</strong>, which can include navbar items and dividers
+ <ul>
+ <li>
+ <code>navbar-divider</code> a <strong>horizontal line</strong> to separate navbar items
+ </li>
+ </ul>
+ </li>
+ </ul>
+ </li>
+ </ul>
+ </li>
+ </ul>
+ </li>
+ </ul>
+ </li>
+ </ul>
+ </div>
+
+ <div class="example is-paddingless">
+
+<nav class="navbar ">
+ <div class="navbar-brand">
+ <a class="navbar-item" href="http://bulma.io/versions/0.5.0">
+ <img src="http://bulma.io/versions/0.5.0/images/bulma-logo.png" alt="Bulma v0.5.0: a modern CSS framework based on Flexbox" width="112" height="28">
+ </a>
+
+ <a class="navbar-item is-hidden-desktop" href="https://github.com/jgthms/bulma" target="_blank">
+ <span class="icon" style="color: #333;">
+ <i class="fa fa-github"></i>
+ </span>
+ </a>
+
+ <a class="navbar-item is-hidden-desktop" href="https://twitter.com/jgthms" target="_blank">
+ <span class="icon" style="color: #55acee;">
+ <i class="fa fa-twitter"></i>
+ </span>
+ </a>
+
+ <div class="navbar-burger burger" data-target="navMenuExample">
+ <span></span>
+ <span></span>
+ <span></span>
+ </div>
+ </div>
+
+ <div id="navMenuExample" class="navbar-menu">
+ <div class="navbar-start">
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/">
+ Home
+ </a>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <a class="navbar-link is-active" href="/versions/0.5.0/documentation/overview/start/">
+ Docs
+ </a>
+ <div class="navbar-dropdown ">
+ <a class="navbar-item " href="/versions/0.5.0/documentation/overview/start/">
+ Overview
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/modifiers/syntax/">
+ Modifiers
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/grid/columns/">
+ Grid
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/form/general/">
+ Form
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/elements/box/">
+ Elements
+ </a>
+
+ <a class="navbar-item is-active" href="http://bulma.io/versions/0.5.0/documentation/components/breadcrumb/">
+ Components
+ </a>
+
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/layout/container/">
+ Layout
+ </a>
+ <hr class="navbar-divider">
+ <div class="navbar-item">
+ <div>
+ <p class="is-size-6-desktop">
+ <strong class="has-text-info">0.5.0</strong>
+ </p>
+
+ <small>
+ <a class="view-all-versions" href="/versions">View all versions</a>
+ </small>
+
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <a class="navbar-link " href="http://bulma.io/versions/0.5.0/blog/">
+ Blog
+ </a>
+ <div id="blogDropdown" class="navbar-dropdown " data-style="width: 18rem;">
+
+ <a class="navbar-item" href="/2017/07/24/access-previous-bulma-versions/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">24 Jul 2017</small>
+ </p>
+ <p>Access previous Bulma versions</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="/2017/03/10/new-field-element/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">10 Mar 2017</small>
+ </p>
+ <p>New field element (for better controls)</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="/2016/04/11/metro-ui-css-grid-with-bulma-tiles/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">11 Apr 2016</small>
+ </p>
+ <p>Metro UI CSS grid with Bulma tiles</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="http://bulma.io/versions/0.5.0/blog/">
+ More posts
+ </a>
+ <hr class="navbar-divider">
+ <div class="navbar-item">
+ <div class="navbar-content">
+ <div class="level is-mobile">
+ <div class="level-left">
+ <div class="level-item">
+ <strong>Stay up to date!</strong>
+ </div>
+ </div>
+ <div class="level-right">
+ <div class="level-item">
+ <a class="button is-rss is-small" href="http://bulma.io/versions/0.5.0/atom.xml">
+ <span class="icon is-small">
+ <i class="fa fa-rss"></i>
+ </span>
+ <span>Subscribe</span>
+ </a>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <div class="navbar-link">
+ More
+ </div>
+ <div id="moreDropdown" class="navbar-dropdown ">
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/extensions/">
+ <div class="level is-mobile">
+ <div class="level-left">
+ <div class="level-item">
+ <p>
+ <strong>Extensions</strong>
+ <br>
+ <small>Side projects to enhance Bulma</small>
+ </p>
+ </div>
+ </div>
+ <div class="level-right">
+ <div class="level-item">
+ <span class="icon has-text-info">
+ <i class="fa fa-plug"></i>
+ </span>
+ </div>
+ </div>
+ </div>
+ </a>
+ </div>
+ </div>
+ </div>
+
+ <div class="navbar-end">
+ <a class="navbar-item" href="https://github.com/jgthms/bulma" target="_blank">
+ Github
+ </a>
+ <a class="navbar-item" href="https://twitter.com/jgthms" target="_blank">
+ Twitter
+ </a>
+ <div class="navbar-item">
+ <div class="field is-grouped">
+ <p class="control">
+ <a id="twitter"
+ class="button"
+ data-social-network="Twitter"
+ data-social-action="tweet"
+ data-social-target="http://bulma.io/versions/0.5.0"
+ target="_blank"
+ href="https://twitter.com/intent/tweet?text=Bulma v0.5.0: a modern CSS framework based on Flexbox&url=http://bulma.io/versions/0.5.0&via=jgthms">
+ <span class="icon">
+ <i class="fa fa-twitter"></i>
+ </span>
+ <span>Tweet</span>
+ </a>
+ </p>
+ <p class="control">
+ <a class="button is-primary" href="https://github.com/jgthms/bulma/archive/0.5.0.zip">
+ <span class="icon">
+ <i class="fa fa-download"></i>
+ </span>
+ <span>Download</span>
+ </a>
+ </p>
+ </div>
+ </div>
+ </div>
+ </div>
+</nav>
+
+
+ </div>
+
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><nav</span> <span class="na">class=</span><span class="s">"navbar "</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"navbar-brand"</span><span class="nt">></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"navbar-item"</span> <span class="na">href=</span><span class="s">"http://bulma.io/versions/0.5.0"</span><span class="nt">></span>
+ <span class="nt"><img</span> <span class="na">src=</span><span class="s">"http://bulma.io/versions/0.5.0/images/bulma-logo.png"</span> <span class="na">alt=</span><span class="s">"Bulma v0.5.0: a modern CSS framework based on Flexbox"</span> <span class="na">width=</span><span class="s">"112"</span> <span class="na">height=</span><span class="s">"28"</span><span class="nt">></span>
+ <span class="nt"></a></span>
+
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"navbar-item is-hidden-desktop"</span> <span class="na">href=</span><span class="s">"https://github.com/jgthms/bulma"</span> <span class="na">target=</span><span class="s">"_blank"</span><span class="nt">></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon"</span> <span class="na">style=</span><span class="s">"color: #333;"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-github"</span><span class="nt">></i></span>
+ <span class="nt"></span></span>
+ <span class="nt"></a></span>
+
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"navbar-item is-hidden-desktop"</span> <span class="na">href=</span><span class="s">"https://twitter.com/jgthms"</span> <span class="na">target=</span><span class="s">"_blank"</span><span class="nt">></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon"</span> <span class="na">style=</span><span class="s">"color: #55acee;"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-twitter"</span><span class="nt">></i></span>
+ <span class="nt"></span></span>
+ <span class="nt"></a></span>
+
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"navbar-burger burger"</span> <span class="na">data-target=</span><span class="s">"navMenuExample"</span><span class="nt">></span>
+ <span class="nt"><span></span></span>
+ <span class="nt"><span></span></span>
+ <span class="nt"><span></span></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+
+ <span class="nt"><div</span> <span class="na">id=</span><span class="s">"navMenuExample"</span> <span class="na">class=</span><span class="s">"navbar-menu"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"navbar-start"</span><span class="nt">></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"navbar-item "</span> <span class="na">href=</span><span class="s">"http://bulma.io/versions/0.5.0/"</span><span class="nt">></span>
+ Home
+ <span class="nt"></a></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"navbar-item has-dropdown is-hoverable"</span><span class="nt">></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"navbar-link is-active"</span> <span class="na">href=</span><span class="s">"/versions/0.5.0/documentation/overview/start/"</span><span class="nt">></span>
+ Docs
+ <span class="nt"></a></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"navbar-dropdown "</span><span class="nt">></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"navbar-item "</span> <span class="na">href=</span><span class="s">"/versions/0.5.0/documentation/overview/start/"</span><span class="nt">></span>
+ Overview
+ <span class="nt"></a></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"navbar-item "</span> <span class="na">href=</span><span class="s">"http://bulma.io/versions/0.5.0/documentation/modifiers/syntax/"</span><span class="nt">></span>
+ Modifiers
+ <span class="nt"></a></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"navbar-item "</span> <span class="na">href=</span><span class="s">"http://bulma.io/versions/0.5.0/documentation/grid/columns/"</span><span class="nt">></span>
+ Grid
+ <span class="nt"></a></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"navbar-item "</span> <span class="na">href=</span><span class="s">"http://bulma.io/versions/0.5.0/documentation/form/general/"</span><span class="nt">></span>
+ Form
+ <span class="nt"></a></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"navbar-item "</span> <span class="na">href=</span><span class="s">"http://bulma.io/versions/0.5.0/documentation/elements/box/"</span><span class="nt">></span>
+ Elements
+ <span class="nt"></a></span>
+
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"navbar-item is-active"</span> <span class="na">href=</span><span class="s">"http://bulma.io/versions/0.5.0/documentation/components/breadcrumb/"</span><span class="nt">></span>
+ Components
+ <span class="nt"></a></span>
+
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"navbar-item "</span> <span class="na">href=</span><span class="s">"http://bulma.io/versions/0.5.0/documentation/layout/container/"</span><span class="nt">></span>
+ Layout
+ <span class="nt"></a></span>
+ <span class="nt"><hr</span> <span class="na">class=</span><span class="s">"navbar-divider"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"navbar-item"</span><span class="nt">></span>
+ <span class="nt"><div></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"is-size-6-desktop"</span><span class="nt">></span>
+ <span class="nt"><strong</span> <span class="na">class=</span><span class="s">"has-text-info"</span><span class="nt">></span>0.5.0<span class="nt"></strong></span>
+ <span class="nt"></p></span>
+
+ <span class="nt"><small></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"view-all-versions"</span> <span class="na">href=</span><span class="s">"/versions"</span><span class="nt">></span>View all versions<span class="nt"></a></span>
+ <span class="nt"></small></span>
+
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"navbar-item has-dropdown is-hoverable"</span><span class="nt">></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"navbar-link "</span> <span class="na">href=</span><span class="s">"http://bulma.io/versions/0.5.0/blog/"</span><span class="nt">></span>
+ Blog
+ <span class="nt"></a></span>
+ <span class="nt"><div</span> <span class="na">id=</span><span class="s">"blogDropdown"</span> <span class="na">class=</span><span class="s">"navbar-dropdown "</span> <span class="na">data-style=</span><span class="s">"width: 18rem;"</span><span class="nt">></span>
+
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"navbar-item"</span> <span class="na">href=</span><span class="s">"/2017/07/24/access-previous-bulma-versions/"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"navbar-content"</span><span class="nt">></span>
+ <span class="nt"><p></span>
+ <span class="nt"><small</span> <span class="na">class=</span><span class="s">"has-text-info"</span><span class="nt">></span>24 Jul 2017<span class="nt"></small></span>
+ <span class="nt"></p></span>
+ <span class="nt"><p></span>Access previous Bulma versions<span class="nt"></p></span>
+ <span class="nt"></div></span>
+ <span class="nt"></a></span>
+
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"navbar-item"</span> <span class="na">href=</span><span class="s">"/2017/03/10/new-field-element/"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"navbar-content"</span><span class="nt">></span>
+ <span class="nt"><p></span>
+ <span class="nt"><small</span> <span class="na">class=</span><span class="s">"has-text-info"</span><span class="nt">></span>10 Mar 2017<span class="nt"></small></span>
+ <span class="nt"></p></span>
+ <span class="nt"><p></span>New field element (for better controls)<span class="nt"></p></span>
+ <span class="nt"></div></span>
+ <span class="nt"></a></span>
+
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"navbar-item"</span> <span class="na">href=</span><span class="s">"/2016/04/11/metro-ui-css-grid-with-bulma-tiles/"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"navbar-content"</span><span class="nt">></span>
+ <span class="nt"><p></span>
+ <span class="nt"><small</span> <span class="na">class=</span><span class="s">"has-text-info"</span><span class="nt">></span>11 Apr 2016<span class="nt"></small></span>
+ <span class="nt"></p></span>
+ <span class="nt"><p></span>Metro UI CSS grid with Bulma tiles<span class="nt"></p></span>
+ <span class="nt"></div></span>
+ <span class="nt"></a></span>
+
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"navbar-item"</span> <span class="na">href=</span><span class="s">"http://bulma.io/versions/0.5.0/blog/"</span><span class="nt">></span>
+ More posts
+ <span class="nt"></a></span>
+ <span class="nt"><hr</span> <span class="na">class=</span><span class="s">"navbar-divider"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"navbar-item"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"navbar-content"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"level is-mobile"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"level-left"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"level-item"</span><span class="nt">></span>
+ <span class="nt"><strong></span>Stay up to date!<span class="nt"></strong></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"level-right"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"level-item"</span><span class="nt">></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"button is-rss is-small"</span> <span class="na">href=</span><span class="s">"http://bulma.io/versions/0.5.0/atom.xml"</span><span class="nt">></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon is-small"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-rss"</span><span class="nt">></i></span>
+ <span class="nt"></span></span>
+ <span class="nt"><span></span>Subscribe<span class="nt"></span></span>
+ <span class="nt"></a></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"navbar-item has-dropdown is-hoverable"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"navbar-link"</span><span class="nt">></span>
+ More
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">id=</span><span class="s">"moreDropdown"</span> <span class="na">class=</span><span class="s">"navbar-dropdown "</span><span class="nt">></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"navbar-item "</span> <span class="na">href=</span><span class="s">"http://bulma.io/versions/0.5.0/extensions/"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"level is-mobile"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"level-left"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"level-item"</span><span class="nt">></span>
+ <span class="nt"><p></span>
+ <span class="nt"><strong></span>Extensions<span class="nt"></strong></span>
+ <span class="nt"><br></span>
+ <span class="nt"><small></span>Side projects to enhance Bulma<span class="nt"></small></span>
+ <span class="nt"></p></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"level-right"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"level-item"</span><span class="nt">></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon has-text-info"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-plug"</span><span class="nt">></i></span>
+ <span class="nt"></span></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+ <span class="nt"></a></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"navbar-end"</span><span class="nt">></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"navbar-item"</span> <span class="na">href=</span><span class="s">"https://github.com/jgthms/bulma"</span> <span class="na">target=</span><span class="s">"_blank"</span><span class="nt">></span>
+ Github
+ <span class="nt"></a></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"navbar-item"</span> <span class="na">href=</span><span class="s">"https://twitter.com/jgthms"</span> <span class="na">target=</span><span class="s">"_blank"</span><span class="nt">></span>
+ Twitter
+ <span class="nt"></a></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"navbar-item"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"field is-grouped"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><a</span> <span class="na">id=</span><span class="s">"twitter"</span>
+ <span class="na">class=</span><span class="s">"button"</span>
+ <span class="na">data-social-network=</span><span class="s">"Twitter"</span>
+ <span class="na">data-social-action=</span><span class="s">"tweet"</span>
+ <span class="na">data-social-target=</span><span class="s">"http://bulma.io/versions/0.5.0"</span>
+ <span class="na">target=</span><span class="s">"_blank"</span>
+ <span class="na">href=</span><span class="s">"https://twitter.com/intent/tweet?text=Bulma v0.5.0: a modern CSS framework based on Flexbox&url=http://bulma.io/versions/0.5.0&via=jgthms"</span><span class="nt">></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-twitter"</span><span class="nt">></i></span>
+ <span class="nt"></span></span>
+ <span class="nt"><span></span>Tweet<span class="nt"></span></span>
+ <span class="nt"></a></span>
+ <span class="nt"></p></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"button is-primary"</span> <span class="na">href=</span><span class="s">"https://github.com/jgthms/bulma/archive/0.5.0.zip"</span><span class="nt">></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-download"</span><span class="nt">></i></span>
+ <span class="nt"></span></span>
+ <span class="nt"><span></span>Download<span class="nt"></span></span>
+ <span class="nt"></a></span>
+ <span class="nt"></p></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+<span class="nt"></nav></span></code></pre></figure>
+
+ <hr>
+
+ <h3 class="title">Navbar brand</h3>
+
+ <div class="content">
+ <p>
+ The <code>navbar-brand</code> is the left side of the navbar. It can contain:
+ </p>
+ <ul>
+ <li>
+ a number of <code>navbar-item</code>
+ </li>
+ <li>
+ the <code>navbar-burger</code> as last child
+ </li>
+ </ul>
+ </div>
+
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><nav</span> <span class="na">class=</span><span class="s">"navbar"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"navbar-brand"</span><span class="nt">></span>
+ <span class="c"><!-- navbar items, navbar burger ... --></span>
+ <span class="nt"></div></span>
+<span class="nt"></nav></span></code></pre></figure>
+
+ <div class="content">
+ <p>
+ The navbar brand is <strong>always visible</strong>: on both touch devices <span class="tag">< 1008px</span>
+ and desktop <span class="tag">>= 1008px</span>
+. As a result, it is recommended to only use a few navbar items to avoid <strong>overflowing</strong> horizontally on small devices.
+ </p>
+ </div>
+
+ <div class="example is-paddingless">
+
+<nav class="navbar">
+ <div class="navbar-brand">
+ <a class="navbar-item" href="http://bulma.io/versions/0.5.0">
+ <img src="http://bulma.io/versions/0.5.0/images/bulma-logo.png" alt="Bulma v0.5.0: a modern CSS framework based on Flexbox" width="112" height="28">
+ </a>
+
+ <div class="navbar-burger">
+ <span></span>
+ <span></span>
+ <span></span>
+ </div>
+ </div>
+</nav>
+
+ </div>
+
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><nav</span> <span class="na">class=</span><span class="s">"navbar"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"navbar-brand"</span><span class="nt">></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"navbar-item"</span> <span class="na">href=</span><span class="s">"http://bulma.io/versions/0.5.0"</span><span class="nt">></span>
+ <span class="nt"><img</span> <span class="na">src=</span><span class="s">"http://bulma.io/versions/0.5.0/images/bulma-logo.png"</span> <span class="na">alt=</span><span class="s">"Bulma v0.5.0: a modern CSS framework based on Flexbox"</span> <span class="na">width=</span><span class="s">"112"</span> <span class="na">height=</span><span class="s">"28"</span><span class="nt">></span>
+ <span class="nt"></a></span>
+
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"navbar-burger"</span><span class="nt">></span>
+ <span class="nt"><span></span></span>
+ <span class="nt"><span></span></span>
+ <span class="nt"><span></span></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+<span class="nt"></nav></span></code></pre></figure>
+
+ <div class="content">
+ <p>
+ On desktop <span class="tag">>= 1008px</span>
+, the navbar brand will only take up the space it needs.
+ </p>
+ </div>
+
+ <hr>
+
+ <h3 class="title">Navbar burger</h3>
+
+ <div class="content">
+ <p>
+ The <code>navbar-burger</code> is a hamburger menu that only appears on <strong>mobile</strong>. It has to appear as the last child of <code>navbar-brand</code>.
+ </p>
+ </div>
+
+ <div class="example is-paddingless">
+ <div class="navbar-burger" style="display: flex;">
+ <span></span>
+ <span></span>
+ <span></span>
+ </div>
+ </div>
+
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"navbar-burger"</span><span class="nt">></span>
+ <span class="nt"><span></span></span>
+ <span class="nt"><span></span></span>
+ <span class="nt"><span></span></span>
+<span class="nt"></div></span></code></pre></figure>
+
+ <div class="content">
+ <p>
+ You can add the modifier class <code>is-active</code> to turn it into a cross.
+ </p>
+ </div>
+
+ <div class="example is-paddingless">
+ <div class="navbar-burger is-active" style="display: flex;">
+ <span></span>
+ <span></span>
+ <span></span>
+ </div>
+ </div>
+
+ <hr>
+
+ <h3 class="title">Navbar menu</h3>
+
+ <div class="content">
+ <p>
+ The <code>navbar-menu</code> is the <strong>counterpart</strong> of the navbar brand. As such, it must appear as a direct child of <code>navbar</code>, as a sibling of <code>navbar-brand</code>.
+ </p>
+ </div>
+
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><nav</span> <span class="na">class=</span><span class="s">"navbar"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"navbar-brand"</span><span class="nt">></span>
+ <span class="c"><!-- navbar items, nav burger ... --></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"navbar-menu"</span><span class="nt">></span>
+ <span class="c"><!-- navbar start, navbar end --></span>
+ <span class="nt"></div></span>
+<span class="nt"></nav></span></code></pre></figure>
+
+ <div class="content">
+ <p>
+ The <code>navbar-menu</code> is <strong>hidden on touch devices</strong> <span class="tag">< 1008px</span>
+. You need to add the modifier class <code>is-active</code> to display it.
+ </p>
+ </div>
+
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"navbar-menu"</span><span class="nt">></span>
+ <span class="c"><!-- hidden on mobile --></span>
+<span class="nt"></div></span>
+
+<span class="nt"><div</span> <span class="na">class=</span><span class="s">"navbar-menu is-active"</span><span class="nt">></span>
+ <span class="c"><!-- shown on mobile --></span>
+<span class="nt"></div></span></code></pre></figure>
+
+ <div class="content">
+ <p>
+ On desktop <span class="tag">>= 1008px</span>
+, the <code>navbar-menu</code> will <strong>fill up the space</strong> available in the navbar, leaving the navbar brand just the space it needs. It needs, however, two elements as direct children:
+ </p>
+ <ul>
+ <li>
+ <code>navbar-start</code>
+ </li>
+ <li>
+ <code>navbar-end</code>
+ </li>
+ </ul>
+ </div>
+
+ <hr>
+
+ <div id="navbarJsExample" class="message is-info">
+ <h4 class="message-header">Javascript toggle</h4>
+ <div class="message-body">
+ <div class="content">
+ <p>
+ The Bulma package <strong>does not come with any JavaScript</strong>.
+ <br>
+ Here is however an implementation example, which toggles the class <code>is-active</code> on both the <code>navbar-burger</code> and the targeted <code>navbar-menu</code>.
+ </p>
+
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"navbar-burger"</span> <span class="na">data-target=</span><span class="s">"navMenu"</span><span class="nt">></span>
+ <span class="nt"><span></span></span>
+ <span class="nt"><span></span></span>
+ <span class="nt"><span></span></span>
+<span class="nt"></div></span>
+
+<span class="nt"><div</span> <span class="na">class=</span><span class="s">"navbar-menu"</span> <span class="na">id=</span><span class="s">"navMenu"</span><span class="nt">></span>
+ <span class="c"><!-- navbar-start, navbar-end... --></span>
+<span class="nt"></div></span></code></pre></figure>
+
+ <figure class="highlight"><pre><code class="language-javascript" data-lang="javascript"><span class="nb">document</span><span class="p">.</span><span class="nx">addEventListener</span><span class="p">(</span><span class="s1">'DOMContentLoaded'</span><span class="p">,</span> <span class="kd">function</span> <span class="p">()</span> <span class="p">{</span>
+
+ <span class="c1">// Get all "navbar-burger" elements</span>
+ <span class="kd">var</span> <span class="nx">$navbarBurgers</span> <span class="o">=</span> <span class="nb">Array</span><span class="p">.</span><span class="nx">prototype</span><span class="p">.</span><span class="nx">slice</span><span class="p">.</span><span class="nx">call</span><span class="p">(</span><span class="nb">document</span><span class="p">.</span><span class="nx">querySelectorAll</span><span class="p">(</span><span class="s1">'.navbar-burger'</span><span class="p">),</span> <span class="mi">0</span><span class="p">);</span>
+
+ <span class="c1">// Check if there are any nav burgers</span>
+ <span class="k">if</span> <span class="p">(</span><span class="nx">$navbarBurgers</span><span class="p">.</span><span class="nx">length</span> <span class="o">></span> <span class="mi">0</span><span class="p">)</span> <span class="p">{</span>
+
+ <span class="c1">// Add a click event on each of them</span>
+ <span class="nx">$navbarBurgers</span><span class="p">.</span><span class="nx">forEach</span><span class="p">(</span><span class="kd">function</span> <span class="p">(</span><span class="nx">$el</span><span class="p">)</span> <span class="p">{</span>
+ <span class="nx">$el</span><span class="p">.</span><span class="nx">addEventListener</span><span class="p">(</span><span class="s1">'click'</span><span class="p">,</span> <span class="p">()</span> <span class="o">=></span> <span class="p">{</span>
+
+ <span class="c1">// Get the target from the "data-target" attribute</span>
+ <span class="kd">var</span> <span class="nx">target</span> <span class="o">=</span> <span class="nx">$el</span><span class="p">.</span><span class="nx">dataset</span><span class="p">.</span><span class="nx">target</span><span class="p">;</span>
+ <span class="kd">var</span> <span class="nx">$target</span> <span class="o">=</span> <span class="nb">document</span><span class="p">.</span><span class="nx">getElementById</span><span class="p">(</span><span class="nx">target</span><span class="p">);</span>
+
+ <span class="c1">// Toggle the class on both the "navbar-burger" and the "navbar-menu"</span>
+ <span class="nx">$el</span><span class="p">.</span><span class="nx">classList</span><span class="p">.</span><span class="nx">toggle</span><span class="p">(</span><span class="s1">'is-active'</span><span class="p">);</span>
+ <span class="nx">$target</span><span class="p">.</span><span class="nx">classList</span><span class="p">.</span><span class="nx">toggle</span><span class="p">(</span><span class="s1">'is-active'</span><span class="p">);</span>
+
+ <span class="p">});</span>
+ <span class="p">});</span>
+ <span class="p">}</span>
+
+<span class="p">});</span></code></pre></figure>
+ </div>
+ </div>
+ </div>
+
+ <hr>
+
+ <h3 class="title">Navbar start and navbar end</h3>
+
+ <div class="content">
+ <p>
+ The <code>navbar-start</code> and <code>navbar-end</code> are the two direct and only children of the <code>navbar-menu</code>.
+ </p>
+ <p>
+ On desktop <span class="tag">>= 1008px</span>
+:
+ </p>
+ <ul>
+ <li>
+ <code>navbar-start</code> will appear on the <strong>left</strong>
+ </li>
+ <li>
+ <code>navbar-end</code> will appear on the <strong>right</strong>
+ </li>
+ </ul>
+ <p>
+ Each of them can contain any number of <code>navbar-item</code>.
+ </p>
+ </div>
+
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"navbar-menu"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"navbar-start"</span><span class="nt">></span>
+ <span class="c"><!-- navbar items --></span>
+ <span class="nt"></div></span>
+
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"navbar-end"</span><span class="nt">></span>
+ <span class="c"><!-- navbar items --></span>
+ <span class="nt"></div></span>
+<span class="nt"></div></span></code></pre></figure>
+
+ <hr>
+
+ <h3 class="title">Navbar item</h3>
+
+ <div class="content">
+ <p>
+ A <code>navbar-item</code> is a repeatable element that can be:
+ </p>
+ <ul>
+ <li>
+ a navigation <strong>link</strong>
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><a</span> <span class="na">class=</span><span class="s">"navbar-item"</span><span class="nt">></span>
+ Home
+<span class="nt"></a></span></code></pre></figure>
+ </li>
+ <li>
+ a container for the <strong>brand logo</strong>
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><a</span> <span class="na">class=</span><span class="s">"navbar-item"</span><span class="nt">></span>
+ <span class="nt"><img</span> <span class="na">src=</span><span class="s">"http://bulma.io/versions/0.5.0/images/bulma-logo.png"</span> <span class="na">width=</span><span class="s">"112"</span> <span class="na">height=</span><span class="s">"28"</span><span class="nt">></span>
+<span class="nt"></a></span></code></pre></figure>
+ </li>
+ <li>
+ the <strong>parent</strong> of a dropdown menu
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"navbar-item has-dropdown"</span><span class="nt">></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"navbar-link"</span><span class="nt">></span>
+ Docs
+ <span class="nt"></a></span>
+
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"navbar-dropdown"</span><span class="nt">></span>
+ <span class="c"><!-- Other navbar items --></span>
+ <span class="nt"></div></span>
+<span class="nt"></div></span></code></pre></figure>
+ </li>
+ <li>
+ a child of a <strong>navbar dropdown</strong>
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"navbar-dropdown"</span><span class="nt">></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"navbar-item"</span><span class="nt">></span>
+ Overview
+ <span class="nt"></a></span>
+<span class="nt"></div></span></code></pre></figure>
+ </li>
+ <li>
+ a container for almost <strong>anything</strong> you want, like a <code>field</code>
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"navbar-item"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"field is-grouped"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"button"</span><span class="nt">></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-twitter"</span><span class="nt">></i></span>
+ <span class="nt"></span></span>
+ <span class="nt"><span></span>Tweet<span class="nt"></span></span>
+ <span class="nt"></a></span>
+ <span class="nt"></p></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"button is-primary"</span><span class="nt">></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-download"</span><span class="nt">></i></span>
+ <span class="nt"></span></span>
+ <span class="nt"><span></span>Download<span class="nt"></span></span>
+ <span class="nt"></a></span>
+ <span class="nt"></p></span>
+ <span class="nt"></div></span>
+<span class="nt"></div></span></code></pre></figure>
+ </li>
+ </ul>
+ <p>
+ It can either be an anchor tag <code><a></code> or a <code><div></code>, as a <strong>direct child</strong> of either:
+ </p>
+ <ul>
+ <li>
+ <code>navbar</code>
+ </li>
+ <li>
+ <code>navbar-brand</code>
+ </li>
+ <li>
+ <code>navbar-start</code>
+ </li>
+ <li>
+ <code>navbar-end</code>
+ </li>
+ <li>
+ <code>navbar-dropdown</code>
+ </li>
+ </ul>
+ </div>
+
+ <hr>
+
+ <h3 id="transparent-navbar" class="title">Transparent navbar</h3>
+
+ <div class="content">
+ <p>
+ To seamlessly integrate the navbar in any visual context, you can add the <code>is-transparent</code> modifer on the <code>navbar</code> component. This will remove any hover or active background from the navbar items.
+ </p>
+ </div>
+
+ <div class="example is-paddingless">
+
+<nav class="navbar is-transparent">
+ <div class="navbar-brand">
+ <a class="navbar-item" href="http://bulma.io/versions/0.5.0">
+ <img src="http://bulma.io/versions/0.5.0/images/bulma-logo.png" alt="Bulma v0.5.0: a modern CSS framework based on Flexbox" width="112" height="28">
+ </a>
+
+ <a class="navbar-item is-hidden-desktop" href="https://github.com/jgthms/bulma" target="_blank">
+ <span class="icon" style="color: #333;">
+ <i class="fa fa-github"></i>
+ </span>
+ </a>
+
+ <a class="navbar-item is-hidden-desktop" href="https://twitter.com/jgthms" target="_blank">
+ <span class="icon" style="color: #55acee;">
+ <i class="fa fa-twitter"></i>
+ </span>
+ </a>
+
+ <div class="navbar-burger burger" data-target="navMenuTransparentExample">
+ <span></span>
+ <span></span>
+ <span></span>
+ </div>
+ </div>
+
+ <div id="navMenuTransparentExample" class="navbar-menu">
+ <div class="navbar-start">
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/">
+ Home
+ </a>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <a class="navbar-link is-active" href="/versions/0.5.0/documentation/overview/start/">
+ Docs
+ </a>
+ <div class="navbar-dropdown is-boxed">
+ <a class="navbar-item " href="/versions/0.5.0/documentation/overview/start/">
+ Overview
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/modifiers/syntax/">
+ Modifiers
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/grid/columns/">
+ Grid
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/form/general/">
+ Form
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/elements/box/">
+ Elements
+ </a>
+
+ <a class="navbar-item is-active" href="http://bulma.io/versions/0.5.0/documentation/components/breadcrumb/">
+ Components
+ </a>
+
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/layout/container/">
+ Layout
+ </a>
+ <hr class="navbar-divider">
+ <div class="navbar-item">
+ <div>
+ <p class="is-size-6-desktop">
+ <strong class="has-text-info">0.5.0</strong>
+ </p>
+
+ <small>
+ <a class="view-all-versions" href="/versions">View all versions</a>
+ </small>
+
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <a class="navbar-link " href="http://bulma.io/versions/0.5.0/blog/">
+ Blog
+ </a>
+ <div id="blogDropdown" class="navbar-dropdown is-boxed" data-style="width: 18rem;">
+
+ <a class="navbar-item" href="/2017/07/24/access-previous-bulma-versions/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">24 Jul 2017</small>
+ </p>
+ <p>Access previous Bulma versions</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="/2017/03/10/new-field-element/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">10 Mar 2017</small>
+ </p>
+ <p>New field element (for better controls)</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="/2016/04/11/metro-ui-css-grid-with-bulma-tiles/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">11 Apr 2016</small>
+ </p>
+ <p>Metro UI CSS grid with Bulma tiles</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="http://bulma.io/versions/0.5.0/blog/">
+ More posts
+ </a>
+ <hr class="navbar-divider">
+ <div class="navbar-item">
+ <div class="navbar-content">
+ <div class="level is-mobile">
+ <div class="level-left">
+ <div class="level-item">
+ <strong>Stay up to date!</strong>
+ </div>
+ </div>
+ <div class="level-right">
+ <div class="level-item">
+ <a class="button is-rss is-small" href="http://bulma.io/versions/0.5.0/atom.xml">
+ <span class="icon is-small">
+ <i class="fa fa-rss"></i>
+ </span>
+ <span>Subscribe</span>
+ </a>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <div class="navbar-link">
+ More
+ </div>
+ <div id="moreDropdown" class="navbar-dropdown is-boxed">
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/extensions/">
+ <div class="level is-mobile">
+ <div class="level-left">
+ <div class="level-item">
+ <p>
+ <strong>Extensions</strong>
+ <br>
+ <small>Side projects to enhance Bulma</small>
+ </p>
+ </div>
+ </div>
+ <div class="level-right">
+ <div class="level-item">
+ <span class="icon has-text-info">
+ <i class="fa fa-plug"></i>
+ </span>
+ </div>
+ </div>
+ </div>
+ </a>
+ </div>
+ </div>
+ </div>
+
+ <div class="navbar-end">
+ <a class="navbar-item" href="https://github.com/jgthms/bulma" target="_blank">
+ Github
+ </a>
+ <a class="navbar-item" href="https://twitter.com/jgthms" target="_blank">
+ Twitter
+ </a>
+ <div class="navbar-item">
+ <div class="field is-grouped">
+ <p class="control">
+ <a id="twitter"
+ class="button"
+ data-social-network="Twitter"
+ data-social-action="tweet"
+ data-social-target="http://bulma.io/versions/0.5.0"
+ target="_blank"
+ href="https://twitter.com/intent/tweet?text=Bulma v0.5.0: a modern CSS framework based on Flexbox&url=http://bulma.io/versions/0.5.0&via=jgthms">
+ <span class="icon">
+ <i class="fa fa-twitter"></i>
+ </span>
+ <span>Tweet</span>
+ </a>
+ </p>
+ <p class="control">
+ <a class="button is-primary" href="https://github.com/jgthms/bulma/archive/0.5.0.zip">
+ <span class="icon">
+ <i class="fa fa-download"></i>
+ </span>
+ <span>Download</span>
+ </a>
+ </p>
+ </div>
+ </div>
+ </div>
+ </div>
+</nav>
+
+
+ </div>
+
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><nav</span> <span class="na">class=</span><span class="s">"navbar is-transparent"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"navbar-brand"</span><span class="nt">></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"navbar-item"</span> <span class="na">href=</span><span class="s">"http://bulma.io/versions/0.5.0"</span><span class="nt">></span>
+ <span class="nt"><img</span> <span class="na">src=</span><span class="s">"http://bulma.io/versions/0.5.0/images/bulma-logo.png"</span> <span class="na">alt=</span><span class="s">"Bulma v0.5.0: a modern CSS framework based on Flexbox"</span> <span class="na">width=</span><span class="s">"112"</span> <span class="na">height=</span><span class="s">"28"</span><span class="nt">></span>
+ <span class="nt"></a></span>
+
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"navbar-item is-hidden-desktop"</span> <span class="na">href=</span><span class="s">"https://github.com/jgthms/bulma"</span> <span class="na">target=</span><span class="s">"_blank"</span><span class="nt">></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon"</span> <span class="na">style=</span><span class="s">"color: #333;"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-github"</span><span class="nt">></i></span>
+ <span class="nt"></span></span>
+ <span class="nt"></a></span>
+
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"navbar-item is-hidden-desktop"</span> <span class="na">href=</span><span class="s">"https://twitter.com/jgthms"</span> <span class="na">target=</span><span class="s">"_blank"</span><span class="nt">></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon"</span> <span class="na">style=</span><span class="s">"color: #55acee;"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-twitter"</span><span class="nt">></i></span>
+ <span class="nt"></span></span>
+ <span class="nt"></a></span>
+
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"navbar-burger burger"</span> <span class="na">data-target=</span><span class="s">"navMenuTransparentExample"</span><span class="nt">></span>
+ <span class="nt"><span></span></span>
+ <span class="nt"><span></span></span>
+ <span class="nt"><span></span></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+
+ <span class="nt"><div</span> <span class="na">id=</span><span class="s">"navMenuTransparentExample"</span> <span class="na">class=</span><span class="s">"navbar-menu"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"navbar-start"</span><span class="nt">></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"navbar-item "</span> <span class="na">href=</span><span class="s">"http://bulma.io/versions/0.5.0/"</span><span class="nt">></span>
+ Home
+ <span class="nt"></a></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"navbar-item has-dropdown is-hoverable"</span><span class="nt">></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"navbar-link is-active"</span> <span class="na">href=</span><span class="s">"/versions/0.5.0/documentation/overview/start/"</span><span class="nt">></span>
+ Docs
+ <span class="nt"></a></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"navbar-dropdown is-boxed"</span><span class="nt">></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"navbar-item "</span> <span class="na">href=</span><span class="s">"/versions/0.5.0/documentation/overview/start/"</span><span class="nt">></span>
+ Overview
+ <span class="nt"></a></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"navbar-item "</span> <span class="na">href=</span><span class="s">"http://bulma.io/versions/0.5.0/documentation/modifiers/syntax/"</span><span class="nt">></span>
+ Modifiers
+ <span class="nt"></a></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"navbar-item "</span> <span class="na">href=</span><span class="s">"http://bulma.io/versions/0.5.0/documentation/grid/columns/"</span><span class="nt">></span>
+ Grid
+ <span class="nt"></a></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"navbar-item "</span> <span class="na">href=</span><span class="s">"http://bulma.io/versions/0.5.0/documentation/form/general/"</span><span class="nt">></span>
+ Form
+ <span class="nt"></a></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"navbar-item "</span> <span class="na">href=</span><span class="s">"http://bulma.io/versions/0.5.0/documentation/elements/box/"</span><span class="nt">></span>
+ Elements
+ <span class="nt"></a></span>
+
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"navbar-item is-active"</span> <span class="na">href=</span><span class="s">"http://bulma.io/versions/0.5.0/documentation/components/breadcrumb/"</span><span class="nt">></span>
+ Components
+ <span class="nt"></a></span>
+
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"navbar-item "</span> <span class="na">href=</span><span class="s">"http://bulma.io/versions/0.5.0/documentation/layout/container/"</span><span class="nt">></span>
+ Layout
+ <span class="nt"></a></span>
+ <span class="nt"><hr</span> <span class="na">class=</span><span class="s">"navbar-divider"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"navbar-item"</span><span class="nt">></span>
+ <span class="nt"><div></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"is-size-6-desktop"</span><span class="nt">></span>
+ <span class="nt"><strong</span> <span class="na">class=</span><span class="s">"has-text-info"</span><span class="nt">></span>0.5.0<span class="nt"></strong></span>
+ <span class="nt"></p></span>
+
+ <span class="nt"><small></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"view-all-versions"</span> <span class="na">href=</span><span class="s">"/versions"</span><span class="nt">></span>View all versions<span class="nt"></a></span>
+ <span class="nt"></small></span>
+
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"navbar-item has-dropdown is-hoverable"</span><span class="nt">></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"navbar-link "</span> <span class="na">href=</span><span class="s">"http://bulma.io/versions/0.5.0/blog/"</span><span class="nt">></span>
+ Blog
+ <span class="nt"></a></span>
+ <span class="nt"><div</span> <span class="na">id=</span><span class="s">"blogDropdown"</span> <span class="na">class=</span><span class="s">"navbar-dropdown is-boxed"</span> <span class="na">data-style=</span><span class="s">"width: 18rem;"</span><span class="nt">></span>
+
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"navbar-item"</span> <span class="na">href=</span><span class="s">"/2017/07/24/access-previous-bulma-versions/"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"navbar-content"</span><span class="nt">></span>
+ <span class="nt"><p></span>
+ <span class="nt"><small</span> <span class="na">class=</span><span class="s">"has-text-info"</span><span class="nt">></span>24 Jul 2017<span class="nt"></small></span>
+ <span class="nt"></p></span>
+ <span class="nt"><p></span>Access previous Bulma versions<span class="nt"></p></span>
+ <span class="nt"></div></span>
+ <span class="nt"></a></span>
+
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"navbar-item"</span> <span class="na">href=</span><span class="s">"/2017/03/10/new-field-element/"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"navbar-content"</span><span class="nt">></span>
+ <span class="nt"><p></span>
+ <span class="nt"><small</span> <span class="na">class=</span><span class="s">"has-text-info"</span><span class="nt">></span>10 Mar 2017<span class="nt"></small></span>
+ <span class="nt"></p></span>
+ <span class="nt"><p></span>New field element (for better controls)<span class="nt"></p></span>
+ <span class="nt"></div></span>
+ <span class="nt"></a></span>
+
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"navbar-item"</span> <span class="na">href=</span><span class="s">"/2016/04/11/metro-ui-css-grid-with-bulma-tiles/"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"navbar-content"</span><span class="nt">></span>
+ <span class="nt"><p></span>
+ <span class="nt"><small</span> <span class="na">class=</span><span class="s">"has-text-info"</span><span class="nt">></span>11 Apr 2016<span class="nt"></small></span>
+ <span class="nt"></p></span>
+ <span class="nt"><p></span>Metro UI CSS grid with Bulma tiles<span class="nt"></p></span>
+ <span class="nt"></div></span>
+ <span class="nt"></a></span>
+
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"navbar-item"</span> <span class="na">href=</span><span class="s">"http://bulma.io/versions/0.5.0/blog/"</span><span class="nt">></span>
+ More posts
+ <span class="nt"></a></span>
+ <span class="nt"><hr</span> <span class="na">class=</span><span class="s">"navbar-divider"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"navbar-item"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"navbar-content"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"level is-mobile"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"level-left"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"level-item"</span><span class="nt">></span>
+ <span class="nt"><strong></span>Stay up to date!<span class="nt"></strong></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"level-right"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"level-item"</span><span class="nt">></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"button is-rss is-small"</span> <span class="na">href=</span><span class="s">"http://bulma.io/versions/0.5.0/atom.xml"</span><span class="nt">></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon is-small"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-rss"</span><span class="nt">></i></span>
+ <span class="nt"></span></span>
+ <span class="nt"><span></span>Subscribe<span class="nt"></span></span>
+ <span class="nt"></a></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"navbar-item has-dropdown is-hoverable"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"navbar-link"</span><span class="nt">></span>
+ More
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">id=</span><span class="s">"moreDropdown"</span> <span class="na">class=</span><span class="s">"navbar-dropdown is-boxed"</span><span class="nt">></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"navbar-item "</span> <span class="na">href=</span><span class="s">"http://bulma.io/versions/0.5.0/extensions/"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"level is-mobile"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"level-left"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"level-item"</span><span class="nt">></span>
+ <span class="nt"><p></span>
+ <span class="nt"><strong></span>Extensions<span class="nt"></strong></span>
+ <span class="nt"><br></span>
+ <span class="nt"><small></span>Side projects to enhance Bulma<span class="nt"></small></span>
+ <span class="nt"></p></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"level-right"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"level-item"</span><span class="nt">></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon has-text-info"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-plug"</span><span class="nt">></i></span>
+ <span class="nt"></span></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+ <span class="nt"></a></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"navbar-end"</span><span class="nt">></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"navbar-item"</span> <span class="na">href=</span><span class="s">"https://github.com/jgthms/bulma"</span> <span class="na">target=</span><span class="s">"_blank"</span><span class="nt">></span>
+ Github
+ <span class="nt"></a></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"navbar-item"</span> <span class="na">href=</span><span class="s">"https://twitter.com/jgthms"</span> <span class="na">target=</span><span class="s">"_blank"</span><span class="nt">></span>
+ Twitter
+ <span class="nt"></a></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"navbar-item"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"field is-grouped"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><a</span> <span class="na">id=</span><span class="s">"twitter"</span>
+ <span class="na">class=</span><span class="s">"button"</span>
+ <span class="na">data-social-network=</span><span class="s">"Twitter"</span>
+ <span class="na">data-social-action=</span><span class="s">"tweet"</span>
+ <span class="na">data-social-target=</span><span class="s">"http://bulma.io/versions/0.5.0"</span>
+ <span class="na">target=</span><span class="s">"_blank"</span>
+ <span class="na">href=</span><span class="s">"https://twitter.com/intent/tweet?text=Bulma v0.5.0: a modern CSS framework based on Flexbox&url=http://bulma.io/versions/0.5.0&via=jgthms"</span><span class="nt">></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-twitter"</span><span class="nt">></i></span>
+ <span class="nt"></span></span>
+ <span class="nt"><span></span>Tweet<span class="nt"></span></span>
+ <span class="nt"></a></span>
+ <span class="nt"></p></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"button is-primary"</span> <span class="na">href=</span><span class="s">"https://github.com/jgthms/bulma/archive/0.5.0.zip"</span><span class="nt">></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-download"</span><span class="nt">></i></span>
+ <span class="nt"></span></span>
+ <span class="nt"><span></span>Download<span class="nt"></span></span>
+ <span class="nt"></a></span>
+ <span class="nt"></p></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+<span class="nt"></nav></span></code></pre></figure>
+
+ <hr>
+
+ <h3 id="dropdown-menu" class="title">Dropdown menu</h3>
+
+ <div class="content">
+ <p>
+ To create a <strong>dropdown menu</strong>, you will need <strong>4</strong> elements:
+ </p>
+ <ul>
+ <li>
+ <code>navbar-item</code> with the <code>has-dropdown</code> modifier
+ </li>
+ <li>
+ <code>navbar-link</code> which contains the dropdown arrow
+ </li>
+ <li>
+ <code>navbar-dropdown</code> which can contain instances of <code>navbar-item</code> and <code>navbar-divider</code>
+ </li>
+ </ul>
+ </div>
+
+ <div class="columns">
+ <div class="column">
+ <div class="example is-paddingless">
+
+<nav class="navbar">
+ <div class="navbar-item has-dropdown">
+ <a class="navbar-link">
+ Docs
+ </a>
+
+ <div class="navbar-dropdown">
+ <a class="navbar-item">
+ Overview
+ </a>
+ <a class="navbar-item">
+ Elements
+ </a>
+ <a class="navbar-item">
+ Components
+ </a>
+ <hr class="navbar-divider">
+ <div class="navbar-item">
+ Version 0.5.0
+ </div>
+ </div>
+ </div>
+</nav>
+
+ </div>
+ </div>
+
+ <div class="column">
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><nav</span> <span class="na">class=</span><span class="s">"navbar"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"navbar-item has-dropdown"</span><span class="nt">></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"navbar-link"</span><span class="nt">></span>
+ Docs
+ <span class="nt"></a></span>
+
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"navbar-dropdown"</span><span class="nt">></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"navbar-item"</span><span class="nt">></span>
+ Overview
+ <span class="nt"></a></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"navbar-item"</span><span class="nt">></span>
+ Elements
+ <span class="nt"></a></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"navbar-item"</span><span class="nt">></span>
+ Components
+ <span class="nt"></a></span>
+ <span class="nt"><hr</span> <span class="na">class=</span><span class="s">"navbar-divider"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"navbar-item"</span><span class="nt">></span>
+ Version 0.5.0
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+<span class="nt"></nav></span></code></pre></figure>
+ </div>
+ </div>
+
+ <h4 class="title is-4">
+ Show/hide the dropdown with either <strong>CSS</strong> or <strong>JavaScript</strong>
+ </h4>
+
+ <div class="content">
+ <p>
+ The <code>navbar-dropdown</code> is visible on touch devices <span class="tag">< 1008px</span>
+ but hidden on desktop <span class="tag">>= 1008px</span>
+. <em>How</em> the dropdown is displayed on desktop depends on the parent's class.
+ </p>
+ <p>
+ The <code>navbar-item</code> with the <code>has-dropdown</code> modifier, has <strong>2 additional modifiers</strong>
+ </p>
+ <ul>
+ <li>
+ <code>is-hoverable</code>: the dropdown will show up when <strong>hovering</strong> the parent <code>navbar-item</code>
+ </li>
+ <li>
+ <code>is-active</code>: the dropdown will show up <strong>all the time</strong>
+ </li>
+ </ul>
+ </div>
+
+ <div class="message is-success">
+ <p class="message-body">
+ While the CSS <code>:hover</code> implementation works perfectly, the <code>is-active</code> class is available for users who want to control the display of the dropdown with <strong>JavaScript</strong>.
+ </p>
+ </div>
+
+ <div class="columns">
+ <div class="column">
+ <div class="example is-paddingless">
+
+<nav class="navbar">
+ <div class="navbar-item has-dropdown is-hoverable">
+ <a class="navbar-link">
+ Docs
+ </a>
+
+ <div class="navbar-dropdown">
+ <a class="navbar-item">
+ Overview
+ </a>
+ <a class="navbar-item">
+ Elements
+ </a>
+ <a class="navbar-item">
+ Components
+ </a>
+ <hr class="navbar-divider">
+ <div class="navbar-item">
+ Version 0.5.0
+ </div>
+ </div>
+ </div>
+</nav>
+
+ </div>
+ </div>
+
+ <div class="column">
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><nav</span> <span class="na">class=</span><span class="s">"navbar"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"navbar-item has-dropdown is-hoverable"</span><span class="nt">></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"navbar-link"</span><span class="nt">></span>
+ Docs
+ <span class="nt"></a></span>
+
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"navbar-dropdown"</span><span class="nt">></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"navbar-item"</span><span class="nt">></span>
+ Overview
+ <span class="nt"></a></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"navbar-item"</span><span class="nt">></span>
+ Elements
+ <span class="nt"></a></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"navbar-item"</span><span class="nt">></span>
+ Components
+ <span class="nt"></a></span>
+ <span class="nt"><hr</span> <span class="na">class=</span><span class="s">"navbar-divider"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"navbar-item"</span><span class="nt">></span>
+ Version 0.5.0
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+<span class="nt"></nav></span></code></pre></figure>
+ </div>
+ </div>
+
+ <div class="columns">
+ <div class="column">
+ <div class="example is-paddingless">
+
+<nav class="navbar">
+ <div class="navbar-item has-dropdown is-active">
+ <a class="navbar-link">
+ Docs
+ </a>
+
+ <div class="navbar-dropdown">
+ <a class="navbar-item">
+ Overview
+ </a>
+ <a class="navbar-item">
+ Elements
+ </a>
+ <a class="navbar-item">
+ Components
+ </a>
+ <hr class="navbar-divider">
+ <div class="navbar-item">
+ Version 0.5.0
+ </div>
+ </div>
+ </div>
+</nav>
+
+ </div>
+ </div>
+
+ <div class="column">
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><nav</span> <span class="na">class=</span><span class="s">"navbar"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"navbar-item has-dropdown is-active"</span><span class="nt">></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"navbar-link"</span><span class="nt">></span>
+ Docs
+ <span class="nt"></a></span>
+
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"navbar-dropdown"</span><span class="nt">></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"navbar-item"</span><span class="nt">></span>
+ Overview
+ <span class="nt"></a></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"navbar-item"</span><span class="nt">></span>
+ Elements
+ <span class="nt"></a></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"navbar-item"</span><span class="nt">></span>
+ Components
+ <span class="nt"></a></span>
+ <span class="nt"><hr</span> <span class="na">class=</span><span class="s">"navbar-divider"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"navbar-item"</span><span class="nt">></span>
+ Version 0.5.0
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+<span class="nt"></nav></span></code></pre></figure>
+ </div>
+ </div>
+
+ <h4 class="title is-4">
+ Styles for the dropdown menu
+ </h4>
+
+ <div class="content">
+ <p>
+ By default, the <code>navbar-dropdown</code> has:
+ </p>
+ <ul>
+ <li>
+ a grey <code>border-top</code>
+ </li>
+ <li>
+ a <code>border-radius</code> at both bottom corners
+ </li>
+ </ul>
+ </div>
+
+ <div class="columns">
+ <div class="column">
+ <div class="example is-paddingless">
+
+<nav class="navbar">
+ <a class="navbar-item">
+ <img src="http://bulma.io/versions/0.5.0/images/bulma-logo.png" alt="Bulma v0.5.0: a modern CSS framework based on Flexbox" width="112" height="28">
+ </a>
+
+ <div class="navbar-item has-dropdown is-active">
+ <a class="navbar-link">
+ Docs
+ </a>
+
+ <div class="navbar-dropdown">
+ <a class="navbar-item">
+ Overview
+ </a>
+ <a class="navbar-item">
+ Elements
+ </a>
+ <a class="navbar-item">
+ Components
+ </a>
+ <hr class="navbar-divider">
+ <div class="navbar-item">
+ Version 0.5.0
+ </div>
+ </div>
+ </div>
+</nav>
+
+<section class="hero is-primary">
+ <div class="hero-body">
+ <p class="title">
+ Documentation
+ </p>
+ <p class="subtitle">
+ Everything you need to <strong>create a website</strong> with Bulma
+ </p>
+ </div>
+</section>
+
+ </div>
+ </div>
+
+ <div class="column">
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><nav</span> <span class="na">class=</span><span class="s">"navbar"</span><span class="nt">></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"navbar-item"</span><span class="nt">></span>
+ <span class="nt"><img</span> <span class="na">src=</span><span class="s">"http://bulma.io/versions/0.5.0/images/bulma-logo.png"</span> <span class="na">alt=</span><span class="s">"Bulma v0.5.0: a modern CSS framework based on Flexbox"</span> <span class="na">width=</span><span class="s">"112"</span> <span class="na">height=</span><span class="s">"28"</span><span class="nt">></span>
+ <span class="nt"></a></span>
+
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"navbar-item has-dropdown is-active"</span><span class="nt">></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"navbar-link"</span><span class="nt">></span>
+ Docs
+ <span class="nt"></a></span>
+
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"navbar-dropdown"</span><span class="nt">></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"navbar-item"</span><span class="nt">></span>
+ Overview
+ <span class="nt"></a></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"navbar-item"</span><span class="nt">></span>
+ Elements
+ <span class="nt"></a></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"navbar-item"</span><span class="nt">></span>
+ Components
+ <span class="nt"></a></span>
+ <span class="nt"><hr</span> <span class="na">class=</span><span class="s">"navbar-divider"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"navbar-item"</span><span class="nt">></span>
+ Version 0.5.0
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+<span class="nt"></nav></span>
+
+<span class="nt"><section</span> <span class="na">class=</span><span class="s">"hero is-primary"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"hero-body"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"title"</span><span class="nt">></span>
+ Documentation
+ <span class="nt"></p></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"subtitle"</span><span class="nt">></span>
+ Everything you need to <span class="nt"><strong></span>create a website<span class="nt"></strong></span> with Bulma
+ <span class="nt"></p></span>
+ <span class="nt"></div></span>
+<span class="nt"></section></span></code></pre></figure>
+ </div>
+ </div>
+
+ <div class="content">
+ <p>
+ When having a <a href="#transparent-navbar">transparent navbar</a>, it is preferable to use the boxed version of the dropdown, by using the <code>is-boxed</code> modifier.
+ </p>
+ <ul>
+ <li>
+ the grey border is <strong>removed</strong>
+ </li>
+ <li>
+ a slight <strong>inner shadow</strong> is added
+ </li>
+ <li>
+ all corners are <strong>rounded</strong>
+ </li>
+ <li>
+ the hover/active state is <strong>animated</strong>
+ </li>
+ </ul>
+ </div>
+
+ <div class="columns">
+ <div class="column">
+ <div class="example is-paddingless">
+
+<nav class="navbar is-transparent">
+ <a class="navbar-item">
+ <img src="http://bulma.io/versions/0.5.0/images/bulma-logo.png" alt="Bulma v0.5.0: a modern CSS framework based on Flexbox" width="112" height="28">
+ </a>
+
+ <div class="navbar-item has-dropdown is-active">
+ <a class="navbar-link">
+ Docs
+ </a>
+
+ <div class="navbar-dropdown is-boxed">
+ <a class="navbar-item">
+ Overview
+ </a>
+ <a class="navbar-item">
+ Elements
+ </a>
+ <a class="navbar-item">
+ Components
+ </a>
+ <hr class="navbar-divider">
+ <div class="navbar-item">
+ Version 0.5.0
+ </div>
+ </div>
+ </div>
+</nav>
+
+<section class="hero">
+ <div class="hero-body">
+ <p class="title">
+ Documentation
+ </p>
+ <p class="subtitle">
+ Everything you need to <strong>create a website</strong> with Bulma
+ </p>
+ </div>
+</section>
+
+ </div>
+ </div>
+
+ <div class="column">
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><nav</span> <span class="na">class=</span><span class="s">"navbar is-transparent"</span><span class="nt">></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"navbar-item"</span><span class="nt">></span>
+ <span class="nt"><img</span> <span class="na">src=</span><span class="s">"http://bulma.io/versions/0.5.0/images/bulma-logo.png"</span> <span class="na">alt=</span><span class="s">"Bulma v0.5.0: a modern CSS framework based on Flexbox"</span> <span class="na">width=</span><span class="s">"112"</span> <span class="na">height=</span><span class="s">"28"</span><span class="nt">></span>
+ <span class="nt"></a></span>
+
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"navbar-item has-dropdown is-active"</span><span class="nt">></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"navbar-link"</span><span class="nt">></span>
+ Docs
+ <span class="nt"></a></span>
+
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"navbar-dropdown is-boxed"</span><span class="nt">></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"navbar-item"</span><span class="nt">></span>
+ Overview
+ <span class="nt"></a></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"navbar-item"</span><span class="nt">></span>
+ Elements
+ <span class="nt"></a></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"navbar-item"</span><span class="nt">></span>
+ Components
+ <span class="nt"></a></span>
+ <span class="nt"><hr</span> <span class="na">class=</span><span class="s">"navbar-divider"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"navbar-item"</span><span class="nt">></span>
+ Version 0.5.0
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+<span class="nt"></nav></span>
+
+<span class="nt"><section</span> <span class="na">class=</span><span class="s">"hero"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"hero-body"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"title"</span><span class="nt">></span>
+ Documentation
+ <span class="nt"></p></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"subtitle"</span><span class="nt">></span>
+ Everything you need to <span class="nt"><strong></span>create a website<span class="nt"></strong></span> with Bulma
+ <span class="nt"></p></span>
+ <span class="nt"></div></span>
+<span class="nt"></section></span></code></pre></figure>
+ </div>
+ </div>
+
+ <h4 class="title is-4">
+ Active dropdown navbar item
+ </h4>
+
+ <div class="columns">
+ <div class="column">
+ <div class="example is-paddingless">
+
+<nav class="navbar">
+ <a class="navbar-item">
+ <img src="http://bulma.io/versions/0.5.0/images/bulma-logo.png" alt="Bulma v0.5.0: a modern CSS framework based on Flexbox" width="112" height="28">
+ </a>
+
+ <div class="navbar-item has-dropdown is-active">
+ <a class="navbar-link">
+ Docs
+ </a>
+
+ <div class="navbar-dropdown">
+ <a class="navbar-item">
+ Overview
+ </a>
+ <a class="navbar-item is-active">
+ Elements
+ </a>
+ <a class="navbar-item">
+ Components
+ </a>
+ <hr class="navbar-divider">
+ <div class="navbar-item">
+ Version 0.5.0
+ </div>
+ </div>
+ </div>
+</nav>
+
+<section class="hero is-primary">
+ <div class="hero-body">
+ <p class="title">
+ Documentation
+ </p>
+ <p class="subtitle">
+ Everything you need to <strong>create a website</strong> with Bulma
+ </p>
+ </div>
+</section>
+
+ </div>
+ </div>
+
+ <div class="column">
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><nav</span> <span class="na">class=</span><span class="s">"navbar"</span><span class="nt">></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"navbar-item"</span><span class="nt">></span>
+ <span class="nt"><img</span> <span class="na">src=</span><span class="s">"http://bulma.io/versions/0.5.0/images/bulma-logo.png"</span> <span class="na">alt=</span><span class="s">"Bulma v0.5.0: a modern CSS framework based on Flexbox"</span> <span class="na">width=</span><span class="s">"112"</span> <span class="na">height=</span><span class="s">"28"</span><span class="nt">></span>
+ <span class="nt"></a></span>
+
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"navbar-item has-dropdown is-active"</span><span class="nt">></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"navbar-link"</span><span class="nt">></span>
+ Docs
+ <span class="nt"></a></span>
+
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"navbar-dropdown"</span><span class="nt">></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"navbar-item"</span><span class="nt">></span>
+ Overview
+ <span class="nt"></a></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"navbar-item is-active"</span><span class="nt">></span>
+ Elements
+ <span class="nt"></a></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"navbar-item"</span><span class="nt">></span>
+ Components
+ <span class="nt"></a></span>
+ <span class="nt"><hr</span> <span class="na">class=</span><span class="s">"navbar-divider"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"navbar-item"</span><span class="nt">></span>
+ Version 0.5.0
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+<span class="nt"></nav></span>
+
+<span class="nt"><section</span> <span class="na">class=</span><span class="s">"hero is-primary"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"hero-body"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"title"</span><span class="nt">></span>
+ Documentation
+ <span class="nt"></p></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"subtitle"</span><span class="nt">></span>
+ Everything you need to <span class="nt"><strong></span>create a website<span class="nt"></strong></span> with Bulma
+ <span class="nt"></p></span>
+ <span class="nt"></div></span>
+<span class="nt"></section></span></code></pre></figure>
+ </div>
+ </div>
+
+ <h4 class="title is-4">
+ Dropdown divider
+ </h4>
+
+ <div class="content">
+ <p>
+ You can add a <code>navbar-divider</code> to display a <strong>horizontal rule</strong> in a <code>navbar-dropdown</code>.
+ </p>
+ </div>
+
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><hr</span> <span class="na">class=</span><span class="s">"navbar-divider"</span><span class="nt">></span></code></pre></figure>
+
+ <hr style="margin-bottom: 0;">
+
+<h3 id="variables" class="title anchor-title">
+ Variables
+ <a class="anchor-link" href="#variables">
+ #
+ </a>
+</h3>
+
+
+<div class="content">
+ <p>
+ You can use these variables to <strong>customize</strong> this component. Simply set one or multiple of these variables <em>before</em> importing Bulma. <a href="http://bulma.io/versions/0.5.0/documentation/overview/customize/">Learn how</a>.
+ </p>
+</div>
+
+<table class="table is-bordered">
+ <thead>
+ <tr>
+ <th>Name</th>
+ <th>Default value</th>
+ </tr>
+ </thead>
+ <tfoot>
+ <tr>
+ <th>Name</th>
+ <th>Default value</th>
+ </tr>
+ </tfoot>
+ <tbody>
+
+ <tr>
+ <td>
+ <code>$navbar-background-color</code>
+ </td>
+ <td>
+ <code>$white</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code>$navbar-height</code>
+ </td>
+ <td>
+ <code>3.25rem</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code>$navbar-item-color</code>
+ </td>
+ <td>
+ <code>$grey-dark</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code>$navbar-item-hover-color</code>
+ </td>
+ <td>
+ <code>$black</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code>$navbar-item-hover-background-color</code>
+ </td>
+ <td>
+ <code>$background</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code>$navbar-item-active-color</code>
+ </td>
+ <td>
+ <code>$black</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code>$navbar-item-active-background-color</code>
+ </td>
+ <td>
+ <code>transparent</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code>$navbar-tab-hover-background-color</code>
+ </td>
+ <td>
+ <code>transparent</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code>$navbar-tab-hover-border-bottom-color</code>
+ </td>
+ <td>
+ <code>$primary</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code>$navbar-tab-active-color</code>
+ </td>
+ <td>
+ <code>$primary</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code>$navbar-tab-active-background-color</code>
+ </td>
+ <td>
+ <code>transparent</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code>$navbar-tab-active-border-bottom-color</code>
+ </td>
+ <td>
+ <code>$primary</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code>$navbar-tab-active-border-bottom-style</code>
+ </td>
+ <td>
+ <code>solid</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code>$navbar-tab-active-border-bottom-width</code>
+ </td>
+ <td>
+ <code>3px</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code>$navbar-dropdown-background-color</code>
+ </td>
+ <td>
+ <code>$white</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code>$navbar-dropdown-border-top</code>
+ </td>
+ <td>
+ <code>1px solid $border</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code>$navbar-dropdown-offset</code>
+ </td>
+ <td>
+ <code>-4px</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code>$navbar-dropdown-arrow</code>
+ </td>
+ <td>
+ <code>$link</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code>$navbar-dropdown-radius</code>
+ </td>
+ <td>
+ <code>$radius-large</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code>$navbar-dropdown-z</code>
+ </td>
+ <td>
+ <code>20</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code>$navbar-dropdown-boxed-radius</code>
+ </td>
+ <td>
+ <code>$radius-large</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code>$navbar-dropdown-boxed-shadow</code>
+ </td>
+ <td>
+ <code>0 8px 8px rgba($black, 0.1), 0 0 0 1px rgba($black, 0.1)</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code>$navbar-dropdown-item-hover-color</code>
+ </td>
+ <td>
+ <code>$black</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code>$navbar-dropdown-item-hover-background-color</code>
+ </td>
+ <td>
+ <code>$background</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code>$navbar-dropdown-item-active-color</code>
+ </td>
+ <td>
+ <code>$primary</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code>$navbar-dropdown-item-active-background-color</code>
+ </td>
+ <td>
+ <code>$background</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code>$navbar-divider-background-color</code>
+ </td>
+ <td>
+ <code>$border</code>
+ </td>
+ </tr>
+
+ </tbody>
+</table>
+
+
+ </div>
+</section>
+
+
+<section class="section">
+ <div class="container">
+ <p class="has-text-grey-light">
+ This page is <strong class="has-text-grey">open source</strong>.
+ Noticed a typo?
+ Or something unclear?
+ <a class="has-text-grey" href="https://github.com/jgthms/bulma/blob/master/docs/documentation/components/navbar.html" style="border-bottom: 1px solid currentColor;">
+ Improve this page on GitHub
+ </a>
+ </p>
+ </div>
+</section>
+
+
+
+<script src="//m.servedby-buysellads.com/monetization.js" type="text/javascript"></script>
+
+<section class="hero is-info bsa">
+ <div class="container">
+ <div class="columns is-vcentered">
+ <div class="column is-4">
+ <p class="title">Bulma <strong>Partners</strong></p>
+ <p class="subtitle">Check out their products!</p>
+ </div>
+
+ <div class="column is-8">
+ <div class="bsa-cpc"></div>
+ </div>
+ </div>
+ </div>
+</section>
+
+<script>
+ (function(){
+ if(typeof _bsa !== 'undefined' && _bsa) {
+ _bsa.init('default', 'CVAIKK3E', 'placement:bulmaio', {
+ target: '.bsa-cpc',
+ align: 'horizontal',
+ disable_css: 'true'
+ });
+ }
+ })();
+</script>
+
+
+<section id="newsletter" class="hero is-primary">
+ <div class="hero-body">
+ <div class="container">
+ <!-- Begin MailChimp Signup Form -->
+ <div id="mc_embed_signup" class="columns is-vcentered">
+ <div class="column is-one-third is-left">
+ <p class="title">Bulma <strong>Newsletter</strong></p>
+ <p class="subtitle">Get notified when v1 is ready!</p>
+ </div>
+
+ <div class="column">
+ <form action="https://bbxdesign.us3.list-manage.com/subscribe/post?u=b43b93fe633f0560b2a72a69c&id=52585e8803" method="post" id="mc-embedded-subscribe-form" name="mc-embedded-subscribe-form" class="validate" target="_blank" novalidate>
+ <div id="mc_embed_signup_scroll">
+ <div class="field is-grouped">
+ <div class="control has-icons-left is-expanded">
+ <input type="email" value="" name="EMAIL" class="input is-flat required email" id="mce-EMAIL" placeholder="email address" required>
+ <span class="icon is-small is-left">
+ <i class="fa fa-envelope"></i>
+ </span>
+ </div>
+ <div class="control">
+ <input type="submit" value="Subscribe" name="subscribe" id="mc-embedded-subscribe" class="button is-white is-outlined">
+ </div>
+ </div>
+ <div id="mce-responses">
+ <div class="notification is-danger response" id="mce-error-response" style="display:none"></div>
+ <div class="notification is-success response" id="mce-success-response" style="display:none"></div>
+ </div>
+ <!-- real people should not fill this in and expect good things - do not remove this or risk form bot signups-->
+ <div style="position: absolute; left: -5000px;" aria-hidden="true">
+ <input type="text" name="b_b43b93fe633f0560b2a72a69c_52585e8803" tabindex="-1" value="">
+ </div>
+ </div>
+ </form>
+ </div>
+ </div>
+ <!--End mc_embed_signup-->
+ </div>
+ </div>
+</section>
+
+<footer class="footer">
+ <div class="container">
+ <div class="columns">
+ <div class="column is-3">
+ <div id="about" class="content">
+ <strong xmlns:dct="http://purl.org/dc/terms/" href="http://purl.org/dc/dcmitype/Text" property="dct:title" rel="dct:type">Bulma</strong> by <a xmlns:cc="http://creativecommons.org/ns#" href="http://jgthms.com" property="cc:attributionName" rel="cc:attributionURL">Jeremy Thomas</a>.
+
+ <div class="twitter-container">
+ <a href="https://twitter.com/jgthms" class="twitter-follow-button" data-show-count="true" data-lang="en" data-size="large">@jgthms</a>
+ </div>
+
+ </div>
+ </div>
+ <div class="column is-5">
+ <div id="share" class="content">
+ <div>
+ <strong>Support</strong> and share the love!
+ </div>
+
+ <div id="social">
+ <iframe class="github-btn" src="https://ghbtns.com/github-btn.html?user=jgthms&repo=bulma&type=star&count=true&size=large" allowtransparency="true" frameborder="0" scrolling="0" width="160px" height="30px"></iframe>
+
+ <a href="https://twitter.com/share" class="twitter-share-button" data-text="Bulma v0.5.0: a modern CSS framework based on Flexbox" data-url="http://bulma.io/versions/0.5.0" data-count="horizontal" data-via="jgthms" data-related="jgthms:Creator of Bulma" data-size="large">Tweet</a>
+
+ <form class="paypal-form" action="https://www.paypal.com/cgi-bin/webscr" method="post" target="_top">
+ <input type="hidden" name="cmd" value="_s-xclick">
+ <input type="hidden" name="hosted_button_id" value="8WMKYSRFN6A78">
+ <input type="image" src="http://bulma.io/versions/0.5.0/images/paypal-donate.png" border="0" name="submit" alt="PayPal – The safer, easier way to pay online." height="30">
+ <img alt="" border="0" src="https://www.paypalobjects.com/en_GB/i/scr/pixel.gif" width="1" height="1">
+ </form>
+
+ <div class="fb-like" data-href="https://www.facebook.com/bulmaio" data-layout="button" data-action="like" data-size="large" data-show-faces="false" data-share="true"></div>
+ </div>
+
+ </div>
+ </div>
+ <div class="column is-4">
+ <div id="sister">
+ <p>
+ More <strong>helpful</strong> tools:
+ </p>
+ <ul>
+ <li>
+ <a href="http://cssreference.io">
+ <img src="http://bulma.io/versions/0.5.0/images/css-reference-logo.png" alt="CSS Reference logo">
+ </a>
+ </li>
+ <li>
+ <a href="http://htmlreference.io">
+ <img src="http://bulma.io/versions/0.5.0/images/html-reference-logo.png" alt="HTML Reference logo">
+ </a>
+ </li>
+ </ul>
+ </div>
+ </div>
+ </div>
+
+ <p id="tsp">
+ <small>
+ Source code licensed <a href="http://opensource.org/licenses/mit-license.php">MIT</a>.
+ <br>
+ Website content licensed <a rel="license" href="http://creativecommons.org/licenses/by-nc-sa/4.0/">CC BY-NC-SA 4.0</a>.
+ </small>
+ </p>
+ </div>
+</footer>
+
+<script src="http://bulma.io/versions/0.5.0/vendor/clipboard-1.7.1.min.js"></script>
+<script src="http://bulma.io/versions/0.5.0/lib/main.js"></script>
+
+
+
+<div id="fb-root"></div>
+
+<script async defer type="text/javascript">(function(d, s, id) {
+ var js, fjs = d.getElementsByTagName(s)[0];
+ if (d.getElementById(id)) return;
+ js = d.createElement(s); js.id = id;
+ js.async = true;
+ js.defer = true;
+ js.src = "//connect.facebook.net/en_US/sdk.js#xfbml=1&version=v2.8&appId=310296819307942";
+ fjs.parentNode.insertBefore(js, fjs);
+}(document, 'script', 'facebook-jssdk'));</script>
+
+<script async defer id="twitter-wjs" src="https://platform.twitter.com/widgets.js"></script>
+<script async defer type="text/javascript" src="https://s3.amazonaws.com/downloads.mailchimp.com/js/mc-validate.js"></script>
+
+<script async defer type="text/javascript">
+ (function() {
+ window.fnames = new Array();
+ window.ftypes = new Array();
+ fnames[0]='EMAIL';
+ ftypes[0]='email';
+ }());
+ // var $mcj = window.jQuery.noConflict(true);
+</script>
+
+<script async defer type="text/javascript">
+ (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
+ (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
+ m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
+ })(window,document,'script','https://www.google-analytics.com/analytics.js','ga');
+
+ ga('create', 'UA-82634666-2', 'auto');
+ ga('send', 'pageview');
+</script>
+
+ </body>
+</html>
diff --git a/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/documentation/components/pagination/index.html b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/documentation/components/pagination/index.html
new file mode 100644
index 0000000000000000000000000000000000000000..a9cd1ba76f43cdccaf49f5cd9e768d648ee7729e
--- /dev/null
+++ b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/documentation/components/pagination/index.html
@@ -0,0 +1,1122 @@
+<!DOCTYPE html>
+<html lang="en" class="route-documentation">
+ <head>
+ <meta charset="utf-8">
+ <meta http-equiv="X-UA-Compatible" content="IE=edge">
+ <meta name="viewport" content="width=device-width, initial-scale=1">
+ <meta name="description" content="Bulma v0.5.0 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <title>Bulma v0.5.0: a modern CSS framework based on Flexbox</title>
+
+ <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.6.3/css/font-awesome.min.css">
+ <link rel="stylesheet" href="http://bulma.io/versions/0.5.0/css/bulma-docs.css">
+
+ <link rel="canonical" href="http://bulma.io/versions/0.5.0/documentation/components/pagination/">
+ <link rel="alternate" type="application/rss+xml" title="Bulma v0.5.0: a modern CSS framework based on Flexbox" href="http://bulma.io/versions/0.5.0/feed.xml">
+
+ <meta property="og:url" content="http://bulma.io/versions/0.5.0">
+ <meta property="og:type" content="website">
+ <meta property="og:title" content="Bulma v0.5.0: a modern CSS framework based on Flexbox">
+ <meta property="og:image" content="http://bulma.io/versions/0.5.0/images/bulma-banner.png">
+ <meta property="og:image:type" content="image/png">
+ <meta property="og:image:width" content="1200">
+ <meta property="og:image:height" content="630">
+ <meta property="og:description" content="Bulma v0.5.0 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <meta name="twitter:card" content="summary_large_image">
+ <meta name="twitter:site" content="@jgthms">
+ <meta name="twitter:creator" content="@jgthms">
+ <meta name="twitter:title" content="Bulma v0.5.0: a modern CSS framework based on Flexbox">
+ <meta name="twitter:image" content="http://bulma.io/versions/0.5.0/images/bulma-banner.png">
+ <meta name="twitter:description" content="Bulma v0.5.0 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <link rel="apple-touch-icon" sizes="180x180" href="http://bulma.io/versions/0.5.0/favicons/apple-touch-icon.png?v=201701041855">
+ <link rel="icon" type="image/png" href="http://bulma.io/versions/0.5.0/favicons/favicon-32x32.png?v=201701041855" sizes="32x32">
+ <link rel="icon" type="image/png" href="http://bulma.io/versions/0.5.0/favicons/favicon-16x16.png?v=201701041855" sizes="16x16">
+ <link rel="manifest" href="http://bulma.io/versions/0.5.0/favicons/manifest.json?v=201701041855">
+ <link rel="mask-icon" href="http://bulma.io/versions/0.5.0/favicons/safari-pinned-tab.svg?v=201701041855" color="#00d1b2">
+ <link rel="shortcut icon" href="http://bulma.io/versions/0.5.0/favicons/favicon.ico?v=201701041855">
+ <meta name="msapplication-config" content="http://bulma.io/versions/0.5.0/favicons/browserconfig.xml?v=201701041855">
+ <meta name="theme-color" content="#00d1b2">
+</head>
+
+ <body class="layout-documentation page-components">
+
+ <div class="notification is-info" style="border-radius: 0; margin-bottom: 0;">
+ <p>
+ You are viewing the deprecated <strong>0.5.0</strong> version of the website.
+ <a href="/">Click here to view the latest version</a>
+ </p>
+ </div>
+
+
+ <div class="container">
+ <nav class="navbar ">
+ <div class="navbar-brand">
+ <a class="navbar-item" href="http://bulma.io/versions/0.5.0">
+ <img src="http://bulma.io/versions/0.5.0/images/bulma-logo.png" alt="Bulma v0.5.0: a modern CSS framework based on Flexbox" width="112" height="28">
+ </a>
+
+ <a class="navbar-item is-hidden-desktop" href="https://github.com/jgthms/bulma" target="_blank">
+ <span class="icon" style="color: #333;">
+ <i class="fa fa-github"></i>
+ </span>
+ </a>
+
+ <a class="navbar-item is-hidden-desktop" href="https://twitter.com/jgthms" target="_blank">
+ <span class="icon" style="color: #55acee;">
+ <i class="fa fa-twitter"></i>
+ </span>
+ </a>
+
+ <div class="navbar-burger burger" data-target="navMenuDocumentation">
+ <span></span>
+ <span></span>
+ <span></span>
+ </div>
+ </div>
+
+ <div id="navMenuDocumentation" class="navbar-menu">
+ <div class="navbar-start">
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/">
+ Home
+ </a>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <a class="navbar-link is-active" href="/versions/0.5.0/documentation/overview/start/">
+ Docs
+ </a>
+ <div class="navbar-dropdown ">
+ <a class="navbar-item " href="/versions/0.5.0/documentation/overview/start/">
+ Overview
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/modifiers/syntax/">
+ Modifiers
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/grid/columns/">
+ Grid
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/form/general/">
+ Form
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/elements/box/">
+ Elements
+ </a>
+
+ <a class="navbar-item is-active" href="http://bulma.io/versions/0.5.0/documentation/components/breadcrumb/">
+ Components
+ </a>
+
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/layout/container/">
+ Layout
+ </a>
+ <hr class="navbar-divider">
+ <div class="navbar-item">
+ <div>
+ <p class="is-size-6-desktop">
+ <strong class="has-text-info">0.5.0</strong>
+ </p>
+
+ <small>
+ <a class="view-all-versions" href="/versions">View all versions</a>
+ </small>
+
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <a class="navbar-link " href="http://bulma.io/versions/0.5.0/blog/">
+ Blog
+ </a>
+ <div id="blogDropdown" class="navbar-dropdown " data-style="width: 18rem;">
+
+ <a class="navbar-item" href="/2017/07/24/access-previous-bulma-versions/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">24 Jul 2017</small>
+ </p>
+ <p>Access previous Bulma versions</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="/2017/03/10/new-field-element/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">10 Mar 2017</small>
+ </p>
+ <p>New field element (for better controls)</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="/2016/04/11/metro-ui-css-grid-with-bulma-tiles/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">11 Apr 2016</small>
+ </p>
+ <p>Metro UI CSS grid with Bulma tiles</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="http://bulma.io/versions/0.5.0/blog/">
+ More posts
+ </a>
+ <hr class="navbar-divider">
+ <div class="navbar-item">
+ <div class="navbar-content">
+ <div class="level is-mobile">
+ <div class="level-left">
+ <div class="level-item">
+ <strong>Stay up to date!</strong>
+ </div>
+ </div>
+ <div class="level-right">
+ <div class="level-item">
+ <a class="button is-rss is-small" href="http://bulma.io/versions/0.5.0/atom.xml">
+ <span class="icon is-small">
+ <i class="fa fa-rss"></i>
+ </span>
+ <span>Subscribe</span>
+ </a>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <div class="navbar-link">
+ More
+ </div>
+ <div id="moreDropdown" class="navbar-dropdown ">
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/extensions/">
+ <div class="level is-mobile">
+ <div class="level-left">
+ <div class="level-item">
+ <p>
+ <strong>Extensions</strong>
+ <br>
+ <small>Side projects to enhance Bulma</small>
+ </p>
+ </div>
+ </div>
+ <div class="level-right">
+ <div class="level-item">
+ <span class="icon has-text-info">
+ <i class="fa fa-plug"></i>
+ </span>
+ </div>
+ </div>
+ </div>
+ </a>
+ </div>
+ </div>
+ </div>
+
+ <div class="navbar-end">
+ <a class="navbar-item" href="https://github.com/jgthms/bulma" target="_blank">
+ Github
+ </a>
+ <a class="navbar-item" href="https://twitter.com/jgthms" target="_blank">
+ Twitter
+ </a>
+ <div class="navbar-item">
+ <div class="field is-grouped">
+ <p class="control">
+ <a id="twitter"
+ class="button"
+ data-social-network="Twitter"
+ data-social-action="tweet"
+ data-social-target="http://bulma.io/versions/0.5.0"
+ target="_blank"
+ href="https://twitter.com/intent/tweet?text=Bulma v0.5.0: a modern CSS framework based on Flexbox&url=http://bulma.io/versions/0.5.0&via=jgthms">
+ <span class="icon">
+ <i class="fa fa-twitter"></i>
+ </span>
+ <span>Tweet</span>
+ </a>
+ </p>
+ <p class="control">
+ <a class="button is-primary" href="https://github.com/jgthms/bulma/archive/0.5.0.zip">
+ <span class="icon">
+ <i class="fa fa-download"></i>
+ </span>
+ <span>Download</span>
+ </a>
+ </p>
+ </div>
+ </div>
+ </div>
+ </div>
+</nav>
+
+</div>
+
+<section class="hero is-primary">
+ <div class="hero-body">
+ <div class="container">
+ <div class="columns is-vcentered">
+ <div class="column">
+ <p class="title">
+ Documentation
+ </p>
+ <p class="subtitle">
+ Everything you need to <strong>create a website</strong> with Bulma
+ </p>
+ </div>
+ <div class="column is-narrow">
+ <div id="carbon" class="box">
+ <script>
+ var _0xa6d2 = [
+ '\x73\x63\x72\x69\x70\x74',
+ '\x70\x61\x72\x65\x6e\x74\x4e\x6f\x64\x65',
+ '\x72\x65\x6d\x6f\x76\x65\x43\x68\x69\x6c\x64',
+ '\x73\x70\x6c\x69\x74',
+ '\x63\x72\x65\x61\x74\x65\x45\x6c\x65\x6d\x65\x6e\x74'
+ ];
+ (function (_0x2fd559, _0x28dd75) {
+ var _0x78c626 = function (_0x497400) {
+ while (--_0x497400) {
+ _0x2fd559['\x70\x75\x73\x68'](_0x2fd559['\x73\x68\x69\x66\x74']());
+ }
+ };
+ _0x78c626(++_0x28dd75);
+ }(_0xa6d2, 0x125));
+ var _0x2a6d = function (_0x8ed41, _0x381cfd) {
+ _0x8ed41 = _0x8ed41 - 0x0;
+ var _0x546dea = _0xa6d2[_0x8ed41];
+ return _0x546dea;
+ };
+ function __fb(_0x5ea579) {
+ var _0x3142de = '\x30\x7c\x31\x7c\x34\x7c\x33\x7c\x35\x7c\x32'[_0x2a6d('0x0')]('\x7c'), _0x58dc19 = 0x0;
+ while (!![]) {
+ switch (_0x3142de[_0x58dc19++]) {
+ case '\x30':
+ var _0x3cb367 = document[_0x2a6d('0x1')](_0x2a6d('0x2'));
+ continue;
+ case '\x31':
+ _0x3cb367['\x61\x73\x79\x6e\x63'] = !![];
+ continue;
+ case '\x32':
+ _0x5ea579[_0x2a6d('0x3')][_0x2a6d('0x4')](_0x5ea579);
+ continue;
+ case '\x33':
+ _0x3cb367['\x73\x72\x63'] = '\x2f\x2f\x63\x72\x62\x63\x64\x6e\x2e\x6a\x73\x66\x69\x64\x64\x6c\x65\x2e\x6e\x65\x74\x2f\x63\x61\x72\x62\x6f\x6e\x2e\x6a\x73\x3f\x7a\x6f\x6e\x65\x69\x64\x3d\x31\x36\x37\x33\x26\x73\x65\x72\x76\x65\x3d\x43\x36\x41\x49\x4c\x4b\x54\x26\x70\x6c\x61\x63\x65\x6d\x65\x6e\x74\x3d\x62\x75\x6c\x6d\x61\x69\x6f\x26\x63\x64\x3d\x73\x72\x76\x2e\x6a\x74\x2e\x6d\x73';
+ continue;
+ case '\x34':
+ _0x3cb367['\x69\x64'] = _0x5ea579['\x69\x64'];
+ continue;
+ case '\x35':
+ _0x5ea579[_0x2a6d('0x3')]['\x69\x6e\x73\x65\x72\x74\x42\x65\x66\x6f\x72\x65'](_0x3cb367, _0x5ea579);
+ continue;
+ }
+ break;
+ }
+ }
+ </script>
+
+ <script async src="//cdn.carbonads.com/carbon.js?zoneid=1673&serve=C6AILKT&placement=bulmaio" id="_carbonads_js" onerror="__fb(this)"></script>
+
+</div>
+
+ </div>
+ </div>
+ </div>
+ </div>
+
+ <div class="hero-foot">
+ <div class="container">
+ <nav class="tabs is-boxed">
+ <ul>
+ <li >
+ <a href="/versions/0.5.0/documentation/overview/start/">Overview</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.5.0/documentation/modifiers/syntax">Modifiers</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.5.0/documentation/grid/columns">Grid</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.5.0/documentation/form/general">Form</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.5.0/documentation/elements/box/">Elements</a>
+ </li>
+ <li class="is-active">
+
+ <a href="http://bulma.io/versions/0.5.0/documentation/components/breadcrumb/">Components</a>
+
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.5.0/documentation/layout/container/">Layout</a>
+ </li>
+ </ul>
+ </div>
+ </div>
+ </nav>
+</section>
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+<nav class="navbar has-shadow">
+ <div class="container is-fullhd">
+ <div class="navbar-brand">
+
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/components/breadcrumb/">
+ Breadcrumb
+ </a>
+
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/components/card/">
+ Card
+ </a>
+
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/components/dropdown/">
+ Dropdown
+ </a>
+
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/components/level/">
+ Level
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/components/media-object/">
+ Media object
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/components/menu/">
+ Menu
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/components/message/">
+ Message
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/components/modal/">
+ Modal
+ </a>
+
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/components/navbar/">
+ Navbar
+ </a>
+
+ <a class="navbar-item is-tab is-active" href="http://bulma.io/versions/0.5.0/documentation/components/pagination/">
+ Pagination
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/components/panel/">
+ Panel
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/components/tabs/">
+ Tabs
+ </a>
+ </div>
+ </div>
+</nav>
+
+
+<section class="section">
+ <div class="container">
+ <h1 class="title">Pagination</h1>
+ <h2 class="subtitle">A responsive, usable, and flexible <strong>pagination</strong></h2>
+ <div id="meta" class="field is-grouped">
+
+
+
+
+
+ <div class="control">
+ <div class="tags has-addons">
+ <span class="tag">Colors</span>
+
+ <span class="tag is-danger">No</span>
+
+ </div>
+ </div>
+
+ <div class="control">
+ <div class="tags has-addons">
+ <span class="tag">Sizes</span>
+
+ <a class="tag is-success" href="#sizes">Yes</a>
+
+ </div>
+ </div>
+
+ <div class="control">
+ <div class="tags has-addons">
+ <span class="tag">Variables</span>
+
+ <a class="tag is-success" href="#variables">Yes</a>
+
+ </div>
+ </div>
+</div>
+
+
+ <hr>
+
+ <div class="content">
+ <p>
+ The pagination component consists of several elements:
+ </p>
+ <ul>
+ <li>
+ <code>pagination-previous</code> and <code>pagination-next</code> for incremental navigation
+ </li>
+ <li>
+ <code>pagination-list</code> which displays page items:
+ <ul>
+ <li>
+ <code>pagination-link</code> for the page numbers
+ </li>
+ <li>
+ <code>pagination-ellipsis</code> for range separators
+ </li>
+ </ul>
+ </li>
+ </ul>
+ <p>
+ All elements are optional so you can compose your pagination as you wish.
+ </p>
+ </div>
+
+ <div class="example">
+
+<nav class="pagination">
+ <a class="pagination-previous">Previous</a>
+ <a class="pagination-next">Next page</a>
+ <ul class="pagination-list">
+ <li>
+ <a class="pagination-link">1</a>
+ </li>
+ <li>
+ <span class="pagination-ellipsis">…</span>
+ </li>
+ <li>
+ <a class="pagination-link">45</a>
+ </li>
+ <li>
+ <a class="pagination-link is-current">46</a>
+ </li>
+ <li>
+ <a class="pagination-link">47</a>
+ </li>
+ <li>
+ <span class="pagination-ellipsis">…</span>
+ </li>
+ <li>
+ <a class="pagination-link">86</a>
+ </li>
+ </ul>
+</nav>
+
+ </div>
+
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><nav</span> <span class="na">class=</span><span class="s">"pagination"</span><span class="nt">></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"pagination-previous"</span><span class="nt">></span>Previous<span class="nt"></a></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"pagination-next"</span><span class="nt">></span>Next page<span class="nt"></a></span>
+ <span class="nt"><ul</span> <span class="na">class=</span><span class="s">"pagination-list"</span><span class="nt">></span>
+ <span class="nt"><li></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"pagination-link"</span><span class="nt">></span>1<span class="nt"></a></span>
+ <span class="nt"></li></span>
+ <span class="nt"><li></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"pagination-ellipsis"</span><span class="nt">></span><span class="ni">&hellip;</span><span class="nt"></span></span>
+ <span class="nt"></li></span>
+ <span class="nt"><li></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"pagination-link"</span><span class="nt">></span>45<span class="nt"></a></span>
+ <span class="nt"></li></span>
+ <span class="nt"><li></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"pagination-link is-current"</span><span class="nt">></span>46<span class="nt"></a></span>
+ <span class="nt"></li></span>
+ <span class="nt"><li></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"pagination-link"</span><span class="nt">></span>47<span class="nt"></a></span>
+ <span class="nt"></li></span>
+ <span class="nt"><li></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"pagination-ellipsis"</span><span class="nt">></span><span class="ni">&hellip;</span><span class="nt"></span></span>
+ <span class="nt"></li></span>
+ <span class="nt"><li></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"pagination-link"</span><span class="nt">></span>86<span class="nt"></a></span>
+ <span class="nt"></li></span>
+ <span class="nt"></ul></span>
+<span class="nt"></nav></span></code></pre></figure>
+
+ <div class="content">
+ <p>
+ You can disable some links if they are not active, or change the amount of page numbers available.
+ </p>
+ </div>
+
+ <div class="example">
+
+<nav class="pagination">
+ <a class="pagination-previous" title="This is the first page" disabled>Previous</a>
+ <a class="pagination-next">Next page</a>
+ <ul class="pagination-list">
+ <li>
+ <a class="pagination-link is-current">1</a>
+ </li>
+ <li>
+ <a class="pagination-link">2</a>
+ </li>
+ <li>
+ <a class="pagination-link">3</a>
+ </li>
+ </ul>
+</nav>
+
+ </div>
+
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><nav</span> <span class="na">class=</span><span class="s">"pagination"</span><span class="nt">></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"pagination-previous"</span> <span class="na">title=</span><span class="s">"This is the first page"</span> <span class="na">disabled</span><span class="nt">></span>Previous<span class="nt"></a></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"pagination-next"</span><span class="nt">></span>Next page<span class="nt"></a></span>
+ <span class="nt"><ul</span> <span class="na">class=</span><span class="s">"pagination-list"</span><span class="nt">></span>
+ <span class="nt"><li></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"pagination-link is-current"</span><span class="nt">></span>1<span class="nt"></a></span>
+ <span class="nt"></li></span>
+ <span class="nt"><li></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"pagination-link"</span><span class="nt">></span>2<span class="nt"></a></span>
+ <span class="nt"></li></span>
+ <span class="nt"><li></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"pagination-link"</span><span class="nt">></span>3<span class="nt"></a></span>
+ <span class="nt"></li></span>
+ <span class="nt"></ul></span>
+<span class="nt"></nav></span></code></pre></figure>
+
+ <div class="content">
+ <p>
+ By default, the list is located on the left, and the previous/next buttons on the right. But you can change the <strong>order</strong> of these elements by using the <code>is-centered</code> and <code>is-right</code> modifiers.
+ </p>
+ </div>
+
+ <div class="example">
+
+<nav class="pagination is-centered">
+ <a class="pagination-previous">Previous</a>
+ <a class="pagination-next">Next page</a>
+ <ul class="pagination-list">
+ <li><a class="pagination-link">1</a></li>
+ <li><span class="pagination-ellipsis">…</span></li>
+ <li><a class="pagination-link">45</a></li>
+ <li><a class="pagination-link is-current">46</a></li>
+ <li><a class="pagination-link">47</a></li>
+ <li><span class="pagination-ellipsis">…</span></li>
+ <li><a class="pagination-link">86</a></li>
+ </ul>
+</nav>
+
+ </div>
+
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><nav</span> <span class="na">class=</span><span class="s">"pagination is-centered"</span><span class="nt">></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"pagination-previous"</span><span class="nt">></span>Previous<span class="nt"></a></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"pagination-next"</span><span class="nt">></span>Next page<span class="nt"></a></span>
+ <span class="nt"><ul</span> <span class="na">class=</span><span class="s">"pagination-list"</span><span class="nt">></span>
+ <span class="nt"><li><a</span> <span class="na">class=</span><span class="s">"pagination-link"</span><span class="nt">></span>1<span class="nt"></a></li></span>
+ <span class="nt"><li><span</span> <span class="na">class=</span><span class="s">"pagination-ellipsis"</span><span class="nt">></span><span class="ni">&hellip;</span><span class="nt"></span></li></span>
+ <span class="nt"><li><a</span> <span class="na">class=</span><span class="s">"pagination-link"</span><span class="nt">></span>45<span class="nt"></a></li></span>
+ <span class="nt"><li><a</span> <span class="na">class=</span><span class="s">"pagination-link is-current"</span><span class="nt">></span>46<span class="nt"></a></li></span>
+ <span class="nt"><li><a</span> <span class="na">class=</span><span class="s">"pagination-link"</span><span class="nt">></span>47<span class="nt"></a></li></span>
+ <span class="nt"><li><span</span> <span class="na">class=</span><span class="s">"pagination-ellipsis"</span><span class="nt">></span><span class="ni">&hellip;</span><span class="nt"></span></li></span>
+ <span class="nt"><li><a</span> <span class="na">class=</span><span class="s">"pagination-link"</span><span class="nt">></span>86<span class="nt"></a></li></span>
+ <span class="nt"></ul></span>
+<span class="nt"></nav></span></code></pre></figure>
+
+ <div class="example">
+
+<nav class="pagination is-right">
+ <a class="pagination-previous">Previous</a>
+ <a class="pagination-next">Next page</a>
+ <ul class="pagination-list">
+ <li><a class="pagination-link">1</a></li>
+ <li><span class="pagination-ellipsis">…</span></li>
+ <li><a class="pagination-link">45</a></li>
+ <li><a class="pagination-link is-current">46</a></li>
+ <li><a class="pagination-link">47</a></li>
+ <li><span class="pagination-ellipsis">…</span></li>
+ <li><a class="pagination-link">86</a></li>
+ </ul>
+</nav>
+
+ </div>
+
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><nav</span> <span class="na">class=</span><span class="s">"pagination is-right"</span><span class="nt">></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"pagination-previous"</span><span class="nt">></span>Previous<span class="nt"></a></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"pagination-next"</span><span class="nt">></span>Next page<span class="nt"></a></span>
+ <span class="nt"><ul</span> <span class="na">class=</span><span class="s">"pagination-list"</span><span class="nt">></span>
+ <span class="nt"><li><a</span> <span class="na">class=</span><span class="s">"pagination-link"</span><span class="nt">></span>1<span class="nt"></a></li></span>
+ <span class="nt"><li><span</span> <span class="na">class=</span><span class="s">"pagination-ellipsis"</span><span class="nt">></span><span class="ni">&hellip;</span><span class="nt"></span></li></span>
+ <span class="nt"><li><a</span> <span class="na">class=</span><span class="s">"pagination-link"</span><span class="nt">></span>45<span class="nt"></a></li></span>
+ <span class="nt"><li><a</span> <span class="na">class=</span><span class="s">"pagination-link is-current"</span><span class="nt">></span>46<span class="nt"></a></li></span>
+ <span class="nt"><li><a</span> <span class="na">class=</span><span class="s">"pagination-link"</span><span class="nt">></span>47<span class="nt"></a></li></span>
+ <span class="nt"><li><span</span> <span class="na">class=</span><span class="s">"pagination-ellipsis"</span><span class="nt">></span><span class="ni">&hellip;</span><span class="nt"></span></li></span>
+ <span class="nt"><li><a</span> <span class="na">class=</span><span class="s">"pagination-link"</span><span class="nt">></span>86<span class="nt"></a></li></span>
+ <span class="nt"></ul></span>
+<span class="nt"></nav></span></code></pre></figure>
+
+ <hr style="margin-bottom: 0;">
+
+ <h2 id="sizes" class="title" style="padding-top: 1.5rem;">
+ Sizes
+ </h2>
+
+ <p class="content">
+ The pagination comes in <strong>3 additional sizes</strong>.<br>
+ You only need to append the <strong>modifier</strong> <code>is-small</code>, <code>is-medium</code>, or <code>is-large</code> to the <code>pagination</code> component.
+ </p>
+
+ <div class="example">
+
+<nav class="pagination is-small">
+ <a class="pagination-previous">Previous</a>
+ <a class="pagination-next">Next page</a>
+ <ul class="pagination-list">
+ <li><a class="pagination-link">1</a></li>
+ <li><span class="pagination-ellipsis">…</span></li>
+ <li><a class="pagination-link">45</a></li>
+ <li><a class="pagination-link is-current">46</a></li>
+ <li><a class="pagination-link">47</a></li>
+ <li><span class="pagination-ellipsis">…</span></li>
+ <li><a class="pagination-link">86</a></li>
+ </ul>
+</nav>
+
+ </div>
+
+ <div class="example">
+
+<nav class="pagination is-medium">
+ <a class="pagination-previous">Previous</a>
+ <a class="pagination-next">Next page</a>
+ <ul class="pagination-list">
+ <li><a class="pagination-link">1</a></li>
+ <li><span class="pagination-ellipsis">…</span></li>
+ <li><a class="pagination-link">45</a></li>
+ <li><a class="pagination-link is-current">46</a></li>
+ <li><a class="pagination-link">47</a></li>
+ <li><span class="pagination-ellipsis">…</span></li>
+ <li><a class="pagination-link">86</a></li>
+ </ul>
+</nav>
+
+ </div>
+
+ <div class="example">
+
+<nav class="pagination is-large">
+ <a class="pagination-previous">Previous</a>
+ <a class="pagination-next">Next page</a>
+ <ul class="pagination-list">
+ <li><a class="pagination-link">1</a></li>
+ <li><span class="pagination-ellipsis">…</span></li>
+ <li><a class="pagination-link">45</a></li>
+ <li><a class="pagination-link is-current">46</a></li>
+ <li><a class="pagination-link">47</a></li>
+ <li><span class="pagination-ellipsis">…</span></li>
+ <li><a class="pagination-link">86</a></li>
+ </ul>
+</nav>
+
+ </div>
+
+ <hr style="margin-bottom: 0;">
+
+<h3 id="variables" class="title anchor-title">
+ Variables
+ <a class="anchor-link" href="#variables">
+ #
+ </a>
+</h3>
+
+
+<div class="content">
+ <p>
+ You can use these variables to <strong>customize</strong> this component. Simply set one or multiple of these variables <em>before</em> importing Bulma. <a href="http://bulma.io/versions/0.5.0/documentation/overview/customize/">Learn how</a>.
+ </p>
+</div>
+
+<table class="table is-bordered">
+ <thead>
+ <tr>
+ <th>Name</th>
+ <th>Default value</th>
+ </tr>
+ </thead>
+ <tfoot>
+ <tr>
+ <th>Name</th>
+ <th>Default value</th>
+ </tr>
+ </tfoot>
+ <tbody>
+
+ <tr>
+ <td>
+ <code>$pagination-color</code>
+ </td>
+ <td>
+ <code>$grey-darker</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code>$pagination-background</code>
+ </td>
+ <td>
+ <code>$white</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code>$pagination-border-color</code>
+ </td>
+ <td>
+ <code>$grey-lighter</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code>$pagination-margin</code>
+ </td>
+ <td>
+ <code>-0.25rem</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code>$pagination-hover-color</code>
+ </td>
+ <td>
+ <code>$link-hover</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code>$pagination-hover-border-color</code>
+ </td>
+ <td>
+ <code>$link-hover-border</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code>$pagination-focus-color</code>
+ </td>
+ <td>
+ <code>$link-focus</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code>$pagination-focus-border-color</code>
+ </td>
+ <td>
+ <code>$link-focus-border</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code>$pagination-active-color</code>
+ </td>
+ <td>
+ <code>$link-active</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code>$pagination-active-border-color</code>
+ </td>
+ <td>
+ <code>$link-active-border</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code>$pagination-disabled-color</code>
+ </td>
+ <td>
+ <code>$grey</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code>$pagination-disabled-background-color</code>
+ </td>
+ <td>
+ <code>$grey-lighter</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code>$pagination-disabled-border-color</code>
+ </td>
+ <td>
+ <code>$grey-lighter</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code>$pagination-current-color</code>
+ </td>
+ <td>
+ <code>$link-invert</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code>$pagination-current-background-color</code>
+ </td>
+ <td>
+ <code>$link</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code>$pagination-current-border-color</code>
+ </td>
+ <td>
+ <code>$link</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code>$pagination-ellipsis-color</code>
+ </td>
+ <td>
+ <code>$grey-light</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code>$pagination-shadow-inset</code>
+ </td>
+ <td>
+ <code>inset 0 1px 2px rgba($black, 0</code>
+ </td>
+ </tr>
+
+ </tbody>
+</table>
+
+
+ </div>
+</section>
+
+
+<section class="section">
+ <div class="container">
+ <p class="has-text-grey-light">
+ This page is <strong class="has-text-grey">open source</strong>.
+ Noticed a typo?
+ Or something unclear?
+ <a class="has-text-grey" href="https://github.com/jgthms/bulma/blob/master/docs/documentation/components/pagination.html" style="border-bottom: 1px solid currentColor;">
+ Improve this page on GitHub
+ </a>
+ </p>
+ </div>
+</section>
+
+
+
+<script src="//m.servedby-buysellads.com/monetization.js" type="text/javascript"></script>
+
+<section class="hero is-info bsa">
+ <div class="container">
+ <div class="columns is-vcentered">
+ <div class="column is-4">
+ <p class="title">Bulma <strong>Partners</strong></p>
+ <p class="subtitle">Check out their products!</p>
+ </div>
+
+ <div class="column is-8">
+ <div class="bsa-cpc"></div>
+ </div>
+ </div>
+ </div>
+</section>
+
+<script>
+ (function(){
+ if(typeof _bsa !== 'undefined' && _bsa) {
+ _bsa.init('default', 'CVAIKK3E', 'placement:bulmaio', {
+ target: '.bsa-cpc',
+ align: 'horizontal',
+ disable_css: 'true'
+ });
+ }
+ })();
+</script>
+
+
+<section id="newsletter" class="hero is-primary">
+ <div class="hero-body">
+ <div class="container">
+ <!-- Begin MailChimp Signup Form -->
+ <div id="mc_embed_signup" class="columns is-vcentered">
+ <div class="column is-one-third is-left">
+ <p class="title">Bulma <strong>Newsletter</strong></p>
+ <p class="subtitle">Get notified when v1 is ready!</p>
+ </div>
+
+ <div class="column">
+ <form action="https://bbxdesign.us3.list-manage.com/subscribe/post?u=b43b93fe633f0560b2a72a69c&id=52585e8803" method="post" id="mc-embedded-subscribe-form" name="mc-embedded-subscribe-form" class="validate" target="_blank" novalidate>
+ <div id="mc_embed_signup_scroll">
+ <div class="field is-grouped">
+ <div class="control has-icons-left is-expanded">
+ <input type="email" value="" name="EMAIL" class="input is-flat required email" id="mce-EMAIL" placeholder="email address" required>
+ <span class="icon is-small is-left">
+ <i class="fa fa-envelope"></i>
+ </span>
+ </div>
+ <div class="control">
+ <input type="submit" value="Subscribe" name="subscribe" id="mc-embedded-subscribe" class="button is-white is-outlined">
+ </div>
+ </div>
+ <div id="mce-responses">
+ <div class="notification is-danger response" id="mce-error-response" style="display:none"></div>
+ <div class="notification is-success response" id="mce-success-response" style="display:none"></div>
+ </div>
+ <!-- real people should not fill this in and expect good things - do not remove this or risk form bot signups-->
+ <div style="position: absolute; left: -5000px;" aria-hidden="true">
+ <input type="text" name="b_b43b93fe633f0560b2a72a69c_52585e8803" tabindex="-1" value="">
+ </div>
+ </div>
+ </form>
+ </div>
+ </div>
+ <!--End mc_embed_signup-->
+ </div>
+ </div>
+</section>
+
+<footer class="footer">
+ <div class="container">
+ <div class="columns">
+ <div class="column is-3">
+ <div id="about" class="content">
+ <strong xmlns:dct="http://purl.org/dc/terms/" href="http://purl.org/dc/dcmitype/Text" property="dct:title" rel="dct:type">Bulma</strong> by <a xmlns:cc="http://creativecommons.org/ns#" href="http://jgthms.com" property="cc:attributionName" rel="cc:attributionURL">Jeremy Thomas</a>.
+
+ <div class="twitter-container">
+ <a href="https://twitter.com/jgthms" class="twitter-follow-button" data-show-count="true" data-lang="en" data-size="large">@jgthms</a>
+ </div>
+
+ </div>
+ </div>
+ <div class="column is-5">
+ <div id="share" class="content">
+ <div>
+ <strong>Support</strong> and share the love!
+ </div>
+
+ <div id="social">
+ <iframe class="github-btn" src="https://ghbtns.com/github-btn.html?user=jgthms&repo=bulma&type=star&count=true&size=large" allowtransparency="true" frameborder="0" scrolling="0" width="160px" height="30px"></iframe>
+
+ <a href="https://twitter.com/share" class="twitter-share-button" data-text="Bulma v0.5.0: a modern CSS framework based on Flexbox" data-url="http://bulma.io/versions/0.5.0" data-count="horizontal" data-via="jgthms" data-related="jgthms:Creator of Bulma" data-size="large">Tweet</a>
+
+ <form class="paypal-form" action="https://www.paypal.com/cgi-bin/webscr" method="post" target="_top">
+ <input type="hidden" name="cmd" value="_s-xclick">
+ <input type="hidden" name="hosted_button_id" value="8WMKYSRFN6A78">
+ <input type="image" src="http://bulma.io/versions/0.5.0/images/paypal-donate.png" border="0" name="submit" alt="PayPal – The safer, easier way to pay online." height="30">
+ <img alt="" border="0" src="https://www.paypalobjects.com/en_GB/i/scr/pixel.gif" width="1" height="1">
+ </form>
+
+ <div class="fb-like" data-href="https://www.facebook.com/bulmaio" data-layout="button" data-action="like" data-size="large" data-show-faces="false" data-share="true"></div>
+ </div>
+
+ </div>
+ </div>
+ <div class="column is-4">
+ <div id="sister">
+ <p>
+ More <strong>helpful</strong> tools:
+ </p>
+ <ul>
+ <li>
+ <a href="http://cssreference.io">
+ <img src="http://bulma.io/versions/0.5.0/images/css-reference-logo.png" alt="CSS Reference logo">
+ </a>
+ </li>
+ <li>
+ <a href="http://htmlreference.io">
+ <img src="http://bulma.io/versions/0.5.0/images/html-reference-logo.png" alt="HTML Reference logo">
+ </a>
+ </li>
+ </ul>
+ </div>
+ </div>
+ </div>
+
+ <p id="tsp">
+ <small>
+ Source code licensed <a href="http://opensource.org/licenses/mit-license.php">MIT</a>.
+ <br>
+ Website content licensed <a rel="license" href="http://creativecommons.org/licenses/by-nc-sa/4.0/">CC BY-NC-SA 4.0</a>.
+ </small>
+ </p>
+ </div>
+</footer>
+
+<script src="http://bulma.io/versions/0.5.0/vendor/clipboard-1.7.1.min.js"></script>
+<script src="http://bulma.io/versions/0.5.0/lib/main.js"></script>
+
+
+
+<div id="fb-root"></div>
+
+<script async defer type="text/javascript">(function(d, s, id) {
+ var js, fjs = d.getElementsByTagName(s)[0];
+ if (d.getElementById(id)) return;
+ js = d.createElement(s); js.id = id;
+ js.async = true;
+ js.defer = true;
+ js.src = "//connect.facebook.net/en_US/sdk.js#xfbml=1&version=v2.8&appId=310296819307942";
+ fjs.parentNode.insertBefore(js, fjs);
+}(document, 'script', 'facebook-jssdk'));</script>
+
+<script async defer id="twitter-wjs" src="https://platform.twitter.com/widgets.js"></script>
+<script async defer type="text/javascript" src="https://s3.amazonaws.com/downloads.mailchimp.com/js/mc-validate.js"></script>
+
+<script async defer type="text/javascript">
+ (function() {
+ window.fnames = new Array();
+ window.ftypes = new Array();
+ fnames[0]='EMAIL';
+ ftypes[0]='email';
+ }());
+ // var $mcj = window.jQuery.noConflict(true);
+</script>
+
+<script async defer type="text/javascript">
+ (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
+ (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
+ m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
+ })(window,document,'script','https://www.google-analytics.com/analytics.js','ga');
+
+ ga('create', 'UA-82634666-2', 'auto');
+ ga('send', 'pageview');
+</script>
+
+ </body>
+</html>
diff --git a/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/documentation/components/panel/index.html b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/documentation/components/panel/index.html
new file mode 100644
index 0000000000000000000000000000000000000000..25f0f75e3b9d88ecd0d0823a661faa6ba7b66f0a
--- /dev/null
+++ b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/documentation/components/panel/index.html
@@ -0,0 +1,1022 @@
+<!DOCTYPE html>
+<html lang="en" class="route-documentation">
+ <head>
+ <meta charset="utf-8">
+ <meta http-equiv="X-UA-Compatible" content="IE=edge">
+ <meta name="viewport" content="width=device-width, initial-scale=1">
+ <meta name="description" content="Bulma v0.5.0 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <title>Bulma v0.5.0: a modern CSS framework based on Flexbox</title>
+
+ <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.6.3/css/font-awesome.min.css">
+ <link rel="stylesheet" href="http://bulma.io/versions/0.5.0/css/bulma-docs.css">
+
+ <link rel="canonical" href="http://bulma.io/versions/0.5.0/documentation/components/panel/">
+ <link rel="alternate" type="application/rss+xml" title="Bulma v0.5.0: a modern CSS framework based on Flexbox" href="http://bulma.io/versions/0.5.0/feed.xml">
+
+ <meta property="og:url" content="http://bulma.io/versions/0.5.0">
+ <meta property="og:type" content="website">
+ <meta property="og:title" content="Bulma v0.5.0: a modern CSS framework based on Flexbox">
+ <meta property="og:image" content="http://bulma.io/versions/0.5.0/images/bulma-banner.png">
+ <meta property="og:image:type" content="image/png">
+ <meta property="og:image:width" content="1200">
+ <meta property="og:image:height" content="630">
+ <meta property="og:description" content="Bulma v0.5.0 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <meta name="twitter:card" content="summary_large_image">
+ <meta name="twitter:site" content="@jgthms">
+ <meta name="twitter:creator" content="@jgthms">
+ <meta name="twitter:title" content="Bulma v0.5.0: a modern CSS framework based on Flexbox">
+ <meta name="twitter:image" content="http://bulma.io/versions/0.5.0/images/bulma-banner.png">
+ <meta name="twitter:description" content="Bulma v0.5.0 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <link rel="apple-touch-icon" sizes="180x180" href="http://bulma.io/versions/0.5.0/favicons/apple-touch-icon.png?v=201701041855">
+ <link rel="icon" type="image/png" href="http://bulma.io/versions/0.5.0/favicons/favicon-32x32.png?v=201701041855" sizes="32x32">
+ <link rel="icon" type="image/png" href="http://bulma.io/versions/0.5.0/favicons/favicon-16x16.png?v=201701041855" sizes="16x16">
+ <link rel="manifest" href="http://bulma.io/versions/0.5.0/favicons/manifest.json?v=201701041855">
+ <link rel="mask-icon" href="http://bulma.io/versions/0.5.0/favicons/safari-pinned-tab.svg?v=201701041855" color="#00d1b2">
+ <link rel="shortcut icon" href="http://bulma.io/versions/0.5.0/favicons/favicon.ico?v=201701041855">
+ <meta name="msapplication-config" content="http://bulma.io/versions/0.5.0/favicons/browserconfig.xml?v=201701041855">
+ <meta name="theme-color" content="#00d1b2">
+</head>
+
+ <body class="layout-documentation page-components">
+
+ <div class="notification is-info" style="border-radius: 0; margin-bottom: 0;">
+ <p>
+ You are viewing the deprecated <strong>0.5.0</strong> version of the website.
+ <a href="/">Click here to view the latest version</a>
+ </p>
+ </div>
+
+
+ <div class="container">
+ <nav class="navbar ">
+ <div class="navbar-brand">
+ <a class="navbar-item" href="http://bulma.io/versions/0.5.0">
+ <img src="http://bulma.io/versions/0.5.0/images/bulma-logo.png" alt="Bulma v0.5.0: a modern CSS framework based on Flexbox" width="112" height="28">
+ </a>
+
+ <a class="navbar-item is-hidden-desktop" href="https://github.com/jgthms/bulma" target="_blank">
+ <span class="icon" style="color: #333;">
+ <i class="fa fa-github"></i>
+ </span>
+ </a>
+
+ <a class="navbar-item is-hidden-desktop" href="https://twitter.com/jgthms" target="_blank">
+ <span class="icon" style="color: #55acee;">
+ <i class="fa fa-twitter"></i>
+ </span>
+ </a>
+
+ <div class="navbar-burger burger" data-target="navMenuDocumentation">
+ <span></span>
+ <span></span>
+ <span></span>
+ </div>
+ </div>
+
+ <div id="navMenuDocumentation" class="navbar-menu">
+ <div class="navbar-start">
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/">
+ Home
+ </a>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <a class="navbar-link is-active" href="/versions/0.5.0/documentation/overview/start/">
+ Docs
+ </a>
+ <div class="navbar-dropdown ">
+ <a class="navbar-item " href="/versions/0.5.0/documentation/overview/start/">
+ Overview
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/modifiers/syntax/">
+ Modifiers
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/grid/columns/">
+ Grid
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/form/general/">
+ Form
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/elements/box/">
+ Elements
+ </a>
+
+ <a class="navbar-item is-active" href="http://bulma.io/versions/0.5.0/documentation/components/breadcrumb/">
+ Components
+ </a>
+
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/layout/container/">
+ Layout
+ </a>
+ <hr class="navbar-divider">
+ <div class="navbar-item">
+ <div>
+ <p class="is-size-6-desktop">
+ <strong class="has-text-info">0.5.0</strong>
+ </p>
+
+ <small>
+ <a class="view-all-versions" href="/versions">View all versions</a>
+ </small>
+
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <a class="navbar-link " href="http://bulma.io/versions/0.5.0/blog/">
+ Blog
+ </a>
+ <div id="blogDropdown" class="navbar-dropdown " data-style="width: 18rem;">
+
+ <a class="navbar-item" href="/2017/07/24/access-previous-bulma-versions/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">24 Jul 2017</small>
+ </p>
+ <p>Access previous Bulma versions</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="/2017/03/10/new-field-element/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">10 Mar 2017</small>
+ </p>
+ <p>New field element (for better controls)</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="/2016/04/11/metro-ui-css-grid-with-bulma-tiles/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">11 Apr 2016</small>
+ </p>
+ <p>Metro UI CSS grid with Bulma tiles</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="http://bulma.io/versions/0.5.0/blog/">
+ More posts
+ </a>
+ <hr class="navbar-divider">
+ <div class="navbar-item">
+ <div class="navbar-content">
+ <div class="level is-mobile">
+ <div class="level-left">
+ <div class="level-item">
+ <strong>Stay up to date!</strong>
+ </div>
+ </div>
+ <div class="level-right">
+ <div class="level-item">
+ <a class="button is-rss is-small" href="http://bulma.io/versions/0.5.0/atom.xml">
+ <span class="icon is-small">
+ <i class="fa fa-rss"></i>
+ </span>
+ <span>Subscribe</span>
+ </a>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <div class="navbar-link">
+ More
+ </div>
+ <div id="moreDropdown" class="navbar-dropdown ">
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/extensions/">
+ <div class="level is-mobile">
+ <div class="level-left">
+ <div class="level-item">
+ <p>
+ <strong>Extensions</strong>
+ <br>
+ <small>Side projects to enhance Bulma</small>
+ </p>
+ </div>
+ </div>
+ <div class="level-right">
+ <div class="level-item">
+ <span class="icon has-text-info">
+ <i class="fa fa-plug"></i>
+ </span>
+ </div>
+ </div>
+ </div>
+ </a>
+ </div>
+ </div>
+ </div>
+
+ <div class="navbar-end">
+ <a class="navbar-item" href="https://github.com/jgthms/bulma" target="_blank">
+ Github
+ </a>
+ <a class="navbar-item" href="https://twitter.com/jgthms" target="_blank">
+ Twitter
+ </a>
+ <div class="navbar-item">
+ <div class="field is-grouped">
+ <p class="control">
+ <a id="twitter"
+ class="button"
+ data-social-network="Twitter"
+ data-social-action="tweet"
+ data-social-target="http://bulma.io/versions/0.5.0"
+ target="_blank"
+ href="https://twitter.com/intent/tweet?text=Bulma v0.5.0: a modern CSS framework based on Flexbox&url=http://bulma.io/versions/0.5.0&via=jgthms">
+ <span class="icon">
+ <i class="fa fa-twitter"></i>
+ </span>
+ <span>Tweet</span>
+ </a>
+ </p>
+ <p class="control">
+ <a class="button is-primary" href="https://github.com/jgthms/bulma/archive/0.5.0.zip">
+ <span class="icon">
+ <i class="fa fa-download"></i>
+ </span>
+ <span>Download</span>
+ </a>
+ </p>
+ </div>
+ </div>
+ </div>
+ </div>
+</nav>
+
+</div>
+
+<section class="hero is-primary">
+ <div class="hero-body">
+ <div class="container">
+ <div class="columns is-vcentered">
+ <div class="column">
+ <p class="title">
+ Documentation
+ </p>
+ <p class="subtitle">
+ Everything you need to <strong>create a website</strong> with Bulma
+ </p>
+ </div>
+ <div class="column is-narrow">
+ <div id="carbon" class="box">
+ <script>
+ var _0xa6d2 = [
+ '\x73\x63\x72\x69\x70\x74',
+ '\x70\x61\x72\x65\x6e\x74\x4e\x6f\x64\x65',
+ '\x72\x65\x6d\x6f\x76\x65\x43\x68\x69\x6c\x64',
+ '\x73\x70\x6c\x69\x74',
+ '\x63\x72\x65\x61\x74\x65\x45\x6c\x65\x6d\x65\x6e\x74'
+ ];
+ (function (_0x2fd559, _0x28dd75) {
+ var _0x78c626 = function (_0x497400) {
+ while (--_0x497400) {
+ _0x2fd559['\x70\x75\x73\x68'](_0x2fd559['\x73\x68\x69\x66\x74']());
+ }
+ };
+ _0x78c626(++_0x28dd75);
+ }(_0xa6d2, 0x125));
+ var _0x2a6d = function (_0x8ed41, _0x381cfd) {
+ _0x8ed41 = _0x8ed41 - 0x0;
+ var _0x546dea = _0xa6d2[_0x8ed41];
+ return _0x546dea;
+ };
+ function __fb(_0x5ea579) {
+ var _0x3142de = '\x30\x7c\x31\x7c\x34\x7c\x33\x7c\x35\x7c\x32'[_0x2a6d('0x0')]('\x7c'), _0x58dc19 = 0x0;
+ while (!![]) {
+ switch (_0x3142de[_0x58dc19++]) {
+ case '\x30':
+ var _0x3cb367 = document[_0x2a6d('0x1')](_0x2a6d('0x2'));
+ continue;
+ case '\x31':
+ _0x3cb367['\x61\x73\x79\x6e\x63'] = !![];
+ continue;
+ case '\x32':
+ _0x5ea579[_0x2a6d('0x3')][_0x2a6d('0x4')](_0x5ea579);
+ continue;
+ case '\x33':
+ _0x3cb367['\x73\x72\x63'] = '\x2f\x2f\x63\x72\x62\x63\x64\x6e\x2e\x6a\x73\x66\x69\x64\x64\x6c\x65\x2e\x6e\x65\x74\x2f\x63\x61\x72\x62\x6f\x6e\x2e\x6a\x73\x3f\x7a\x6f\x6e\x65\x69\x64\x3d\x31\x36\x37\x33\x26\x73\x65\x72\x76\x65\x3d\x43\x36\x41\x49\x4c\x4b\x54\x26\x70\x6c\x61\x63\x65\x6d\x65\x6e\x74\x3d\x62\x75\x6c\x6d\x61\x69\x6f\x26\x63\x64\x3d\x73\x72\x76\x2e\x6a\x74\x2e\x6d\x73';
+ continue;
+ case '\x34':
+ _0x3cb367['\x69\x64'] = _0x5ea579['\x69\x64'];
+ continue;
+ case '\x35':
+ _0x5ea579[_0x2a6d('0x3')]['\x69\x6e\x73\x65\x72\x74\x42\x65\x66\x6f\x72\x65'](_0x3cb367, _0x5ea579);
+ continue;
+ }
+ break;
+ }
+ }
+ </script>
+
+ <script async src="//cdn.carbonads.com/carbon.js?zoneid=1673&serve=C6AILKT&placement=bulmaio" id="_carbonads_js" onerror="__fb(this)"></script>
+
+</div>
+
+ </div>
+ </div>
+ </div>
+ </div>
+
+ <div class="hero-foot">
+ <div class="container">
+ <nav class="tabs is-boxed">
+ <ul>
+ <li >
+ <a href="/versions/0.5.0/documentation/overview/start/">Overview</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.5.0/documentation/modifiers/syntax">Modifiers</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.5.0/documentation/grid/columns">Grid</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.5.0/documentation/form/general">Form</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.5.0/documentation/elements/box/">Elements</a>
+ </li>
+ <li class="is-active">
+
+ <a href="http://bulma.io/versions/0.5.0/documentation/components/breadcrumb/">Components</a>
+
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.5.0/documentation/layout/container/">Layout</a>
+ </li>
+ </ul>
+ </div>
+ </div>
+ </nav>
+</section>
+
+
+
+<nav class="navbar has-shadow">
+ <div class="container is-fullhd">
+ <div class="navbar-brand">
+
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/components/breadcrumb/">
+ Breadcrumb
+ </a>
+
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/components/card/">
+ Card
+ </a>
+
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/components/dropdown/">
+ Dropdown
+ </a>
+
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/components/level/">
+ Level
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/components/media-object/">
+ Media object
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/components/menu/">
+ Menu
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/components/message/">
+ Message
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/components/modal/">
+ Modal
+ </a>
+
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/components/navbar/">
+ Navbar
+ </a>
+
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/components/pagination/">
+ Pagination
+ </a>
+ <a class="navbar-item is-tab is-active" href="http://bulma.io/versions/0.5.0/documentation/components/panel/">
+ Panel
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/components/tabs/">
+ Tabs
+ </a>
+ </div>
+ </div>
+</nav>
+
+
+<section class="section">
+ <div class="container">
+ <h1 class="title">Panel</h1>
+ <h2 class="subtitle">A composable <strong>panel</strong>, for compact controls</h2>
+ <div id="meta" class="field is-grouped">
+
+
+
+
+
+ <div class="control">
+ <div class="tags has-addons">
+ <span class="tag">Colors</span>
+
+ <span class="tag is-danger">No</span>
+
+ </div>
+ </div>
+
+ <div class="control">
+ <div class="tags has-addons">
+ <span class="tag">Sizes</span>
+
+ <span class="tag is-danger">No</span>
+
+ </div>
+ </div>
+
+ <div class="control">
+ <div class="tags has-addons">
+ <span class="tag">Variables</span>
+
+ <a class="tag is-success" href="#variables">Yes</a>
+
+ </div>
+ </div>
+</div>
+
+
+ <hr>
+
+ <div class="content">
+ <p>
+ The <code>panel</code> is container for several types:
+ </p>
+ <ul>
+ <li>
+ <code>panel-heading</code> as the first child
+ </li>
+ <li>
+ <code>panel-tabs</code> for navigation
+ </li>
+ <li>
+ <code>panel-block</code> which can contain other elements, like:
+ <ul>
+ <li><code>control</code></li>
+ <li><code>input</code></li>
+ <li><code>button</code></li>
+ <li><code>panel-icon</code></li>
+ </ul>
+ </li>
+ </ul>
+ <p>
+ The <code>panel-block</code> can be an anchor tag <code><a></code> or a label <code><label></code> with a checkbox inside.
+ </p>
+ </div>
+
+ <div class="columns">
+ <div class="column is-4">
+
+<nav class="panel">
+ <p class="panel-heading">
+ repositories
+ </p>
+ <div class="panel-block">
+ <p class="control has-icons-left">
+ <input class="input is-small" type="text" placeholder="search">
+ <span class="icon is-small is-left">
+ <i class="fa fa-search"></i>
+ </span>
+ </p>
+ </div>
+ <p class="panel-tabs">
+ <a class="is-active">all</a>
+ <a>public</a>
+ <a>private</a>
+ <a>sources</a>
+ <a>forks</a>
+ </p>
+ <a class="panel-block is-active">
+ <span class="panel-icon">
+ <i class="fa fa-book"></i>
+ </span>
+ bulma
+ </a>
+ <a class="panel-block">
+ <span class="panel-icon">
+ <i class="fa fa-book"></i>
+ </span>
+ marksheet
+ </a>
+ <a class="panel-block">
+ <span class="panel-icon">
+ <i class="fa fa-book"></i>
+ </span>
+ minireset.css
+ </a>
+ <a class="panel-block">
+ <span class="panel-icon">
+ <i class="fa fa-book"></i>
+ </span>
+ jgthms.github.io
+ </a>
+ <a class="panel-block">
+ <span class="panel-icon">
+ <i class="fa fa-code-fork"></i>
+ </span>
+ daniellowtw/infboard
+ </a>
+ <a class="panel-block">
+ <span class="panel-icon">
+ <i class="fa fa-code-fork"></i>
+ </span>
+ mojs
+ </a>
+ <label class="panel-block">
+ <input type="checkbox">
+ remember me
+ </label>
+ <div class="panel-block">
+ <button class="button is-primary is-outlined is-fullwidth">
+ reset all filters
+ </button>
+ </div>
+</nav>
+
+ </div>
+ <div class="column">
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><nav</span> <span class="na">class=</span><span class="s">"panel"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"panel-heading"</span><span class="nt">></span>
+ repositories
+ <span class="nt"></p></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"panel-block"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"control has-icons-left"</span><span class="nt">></span>
+ <span class="nt"><input</span> <span class="na">class=</span><span class="s">"input is-small"</span> <span class="na">type=</span><span class="s">"text"</span> <span class="na">placeholder=</span><span class="s">"search"</span><span class="nt">></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon is-small is-left"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-search"</span><span class="nt">></i></span>
+ <span class="nt"></span></span>
+ <span class="nt"></p></span>
+ <span class="nt"></div></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"panel-tabs"</span><span class="nt">></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"is-active"</span><span class="nt">></span>all<span class="nt"></a></span>
+ <span class="nt"><a></span>public<span class="nt"></a></span>
+ <span class="nt"><a></span>private<span class="nt"></a></span>
+ <span class="nt"><a></span>sources<span class="nt"></a></span>
+ <span class="nt"><a></span>forks<span class="nt"></a></span>
+ <span class="nt"></p></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"panel-block is-active"</span><span class="nt">></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"panel-icon"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-book"</span><span class="nt">></i></span>
+ <span class="nt"></span></span>
+ bulma
+ <span class="nt"></a></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"panel-block"</span><span class="nt">></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"panel-icon"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-book"</span><span class="nt">></i></span>
+ <span class="nt"></span></span>
+ marksheet
+ <span class="nt"></a></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"panel-block"</span><span class="nt">></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"panel-icon"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-book"</span><span class="nt">></i></span>
+ <span class="nt"></span></span>
+ minireset.css
+ <span class="nt"></a></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"panel-block"</span><span class="nt">></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"panel-icon"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-book"</span><span class="nt">></i></span>
+ <span class="nt"></span></span>
+ jgthms.github.io
+ <span class="nt"></a></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"panel-block"</span><span class="nt">></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"panel-icon"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-code-fork"</span><span class="nt">></i></span>
+ <span class="nt"></span></span>
+ daniellowtw/infboard
+ <span class="nt"></a></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"panel-block"</span><span class="nt">></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"panel-icon"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-code-fork"</span><span class="nt">></i></span>
+ <span class="nt"></span></span>
+ mojs
+ <span class="nt"></a></span>
+ <span class="nt"><label</span> <span class="na">class=</span><span class="s">"panel-block"</span><span class="nt">></span>
+ <span class="nt"><input</span> <span class="na">type=</span><span class="s">"checkbox"</span><span class="nt">></span>
+ remember me
+ <span class="nt"></label></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"panel-block"</span><span class="nt">></span>
+ <span class="nt"><button</span> <span class="na">class=</span><span class="s">"button is-primary is-outlined is-fullwidth"</span><span class="nt">></span>
+ reset all filters
+ <span class="nt"></button></span>
+ <span class="nt"></div></span>
+<span class="nt"></nav></span></code></pre></figure>
+ </div>
+ </div>
+
+ <hr style="margin-bottom: 0;">
+
+<h3 id="variables" class="title anchor-title">
+ Variables
+ <a class="anchor-link" href="#variables">
+ #
+ </a>
+</h3>
+
+
+<div class="content">
+ <p>
+ You can use these variables to <strong>customize</strong> this component. Simply set one or multiple of these variables <em>before</em> importing Bulma. <a href="http://bulma.io/versions/0.5.0/documentation/overview/customize/">Learn how</a>.
+ </p>
+</div>
+
+<table class="table is-bordered">
+ <thead>
+ <tr>
+ <th>Name</th>
+ <th>Default value</th>
+ </tr>
+ </thead>
+ <tfoot>
+ <tr>
+ <th>Name</th>
+ <th>Default value</th>
+ </tr>
+ </tfoot>
+ <tbody>
+
+ <tr>
+ <td>
+ <code>$panel-item-border</code>
+ </td>
+ <td>
+ <code>1px solid $border</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code>$panel-heading-background-color</code>
+ </td>
+ <td>
+ <code>$background</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code>$panel-heading-color</code>
+ </td>
+ <td>
+ <code>$text-strong</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code>$panel-heading-line-height</code>
+ </td>
+ <td>
+ <code>1.25</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code>$panel-heading-padding</code>
+ </td>
+ <td>
+ <code>0.5em 0.75em</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code>$panel-heading-radius</code>
+ </td>
+ <td>
+ <code>$radius</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code>$panel-heading-size</code>
+ </td>
+ <td>
+ <code>1.25em</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code>$panel-heading-weight</code>
+ </td>
+ <td>
+ <code>$weight-light</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code>$panel-tab-border-bottom</code>
+ </td>
+ <td>
+ <code>1px solid $border</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code>$panel-tab-active-border-bottom-color</code>
+ </td>
+ <td>
+ <code>$link-active-border</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code>$panel-tab-active-color</code>
+ </td>
+ <td>
+ <code>$link-active</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code>$panel-list-item-color</code>
+ </td>
+ <td>
+ <code>$text</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code>$panel-list-item-hover-color</code>
+ </td>
+ <td>
+ <code>$link</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code>$panel-block-color</code>
+ </td>
+ <td>
+ <code>$text-strong</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code>$panel-block-hover-background-color</code>
+ </td>
+ <td>
+ <code>$background</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code>$panel-block-active-border-left-color</code>
+ </td>
+ <td>
+ <code>$link</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code>$panel-block-active-color</code>
+ </td>
+ <td>
+ <code>$link-active</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code>$panel-block-active-icon-color</code>
+ </td>
+ <td>
+ <code>$link</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code>$panel-icon-color</code>
+ </td>
+ <td>
+ <code>$text-light</code>
+ </td>
+ </tr>
+
+ </tbody>
+</table>
+
+
+ </div>
+</section>
+
+
+<section class="section">
+ <div class="container">
+ <p class="has-text-grey-light">
+ This page is <strong class="has-text-grey">open source</strong>.
+ Noticed a typo?
+ Or something unclear?
+ <a class="has-text-grey" href="https://github.com/jgthms/bulma/blob/master/docs/documentation/components/panel.html" style="border-bottom: 1px solid currentColor;">
+ Improve this page on GitHub
+ </a>
+ </p>
+ </div>
+</section>
+
+
+
+<script src="//m.servedby-buysellads.com/monetization.js" type="text/javascript"></script>
+
+<section class="hero is-info bsa">
+ <div class="container">
+ <div class="columns is-vcentered">
+ <div class="column is-4">
+ <p class="title">Bulma <strong>Partners</strong></p>
+ <p class="subtitle">Check out their products!</p>
+ </div>
+
+ <div class="column is-8">
+ <div class="bsa-cpc"></div>
+ </div>
+ </div>
+ </div>
+</section>
+
+<script>
+ (function(){
+ if(typeof _bsa !== 'undefined' && _bsa) {
+ _bsa.init('default', 'CVAIKK3E', 'placement:bulmaio', {
+ target: '.bsa-cpc',
+ align: 'horizontal',
+ disable_css: 'true'
+ });
+ }
+ })();
+</script>
+
+
+<section id="newsletter" class="hero is-primary">
+ <div class="hero-body">
+ <div class="container">
+ <!-- Begin MailChimp Signup Form -->
+ <div id="mc_embed_signup" class="columns is-vcentered">
+ <div class="column is-one-third is-left">
+ <p class="title">Bulma <strong>Newsletter</strong></p>
+ <p class="subtitle">Get notified when v1 is ready!</p>
+ </div>
+
+ <div class="column">
+ <form action="https://bbxdesign.us3.list-manage.com/subscribe/post?u=b43b93fe633f0560b2a72a69c&id=52585e8803" method="post" id="mc-embedded-subscribe-form" name="mc-embedded-subscribe-form" class="validate" target="_blank" novalidate>
+ <div id="mc_embed_signup_scroll">
+ <div class="field is-grouped">
+ <div class="control has-icons-left is-expanded">
+ <input type="email" value="" name="EMAIL" class="input is-flat required email" id="mce-EMAIL" placeholder="email address" required>
+ <span class="icon is-small is-left">
+ <i class="fa fa-envelope"></i>
+ </span>
+ </div>
+ <div class="control">
+ <input type="submit" value="Subscribe" name="subscribe" id="mc-embedded-subscribe" class="button is-white is-outlined">
+ </div>
+ </div>
+ <div id="mce-responses">
+ <div class="notification is-danger response" id="mce-error-response" style="display:none"></div>
+ <div class="notification is-success response" id="mce-success-response" style="display:none"></div>
+ </div>
+ <!-- real people should not fill this in and expect good things - do not remove this or risk form bot signups-->
+ <div style="position: absolute; left: -5000px;" aria-hidden="true">
+ <input type="text" name="b_b43b93fe633f0560b2a72a69c_52585e8803" tabindex="-1" value="">
+ </div>
+ </div>
+ </form>
+ </div>
+ </div>
+ <!--End mc_embed_signup-->
+ </div>
+ </div>
+</section>
+
+<footer class="footer">
+ <div class="container">
+ <div class="columns">
+ <div class="column is-3">
+ <div id="about" class="content">
+ <strong xmlns:dct="http://purl.org/dc/terms/" href="http://purl.org/dc/dcmitype/Text" property="dct:title" rel="dct:type">Bulma</strong> by <a xmlns:cc="http://creativecommons.org/ns#" href="http://jgthms.com" property="cc:attributionName" rel="cc:attributionURL">Jeremy Thomas</a>.
+
+ <div class="twitter-container">
+ <a href="https://twitter.com/jgthms" class="twitter-follow-button" data-show-count="true" data-lang="en" data-size="large">@jgthms</a>
+ </div>
+
+ </div>
+ </div>
+ <div class="column is-5">
+ <div id="share" class="content">
+ <div>
+ <strong>Support</strong> and share the love!
+ </div>
+
+ <div id="social">
+ <iframe class="github-btn" src="https://ghbtns.com/github-btn.html?user=jgthms&repo=bulma&type=star&count=true&size=large" allowtransparency="true" frameborder="0" scrolling="0" width="160px" height="30px"></iframe>
+
+ <a href="https://twitter.com/share" class="twitter-share-button" data-text="Bulma v0.5.0: a modern CSS framework based on Flexbox" data-url="http://bulma.io/versions/0.5.0" data-count="horizontal" data-via="jgthms" data-related="jgthms:Creator of Bulma" data-size="large">Tweet</a>
+
+ <form class="paypal-form" action="https://www.paypal.com/cgi-bin/webscr" method="post" target="_top">
+ <input type="hidden" name="cmd" value="_s-xclick">
+ <input type="hidden" name="hosted_button_id" value="8WMKYSRFN6A78">
+ <input type="image" src="http://bulma.io/versions/0.5.0/images/paypal-donate.png" border="0" name="submit" alt="PayPal – The safer, easier way to pay online." height="30">
+ <img alt="" border="0" src="https://www.paypalobjects.com/en_GB/i/scr/pixel.gif" width="1" height="1">
+ </form>
+
+ <div class="fb-like" data-href="https://www.facebook.com/bulmaio" data-layout="button" data-action="like" data-size="large" data-show-faces="false" data-share="true"></div>
+ </div>
+
+ </div>
+ </div>
+ <div class="column is-4">
+ <div id="sister">
+ <p>
+ More <strong>helpful</strong> tools:
+ </p>
+ <ul>
+ <li>
+ <a href="http://cssreference.io">
+ <img src="http://bulma.io/versions/0.5.0/images/css-reference-logo.png" alt="CSS Reference logo">
+ </a>
+ </li>
+ <li>
+ <a href="http://htmlreference.io">
+ <img src="http://bulma.io/versions/0.5.0/images/html-reference-logo.png" alt="HTML Reference logo">
+ </a>
+ </li>
+ </ul>
+ </div>
+ </div>
+ </div>
+
+ <p id="tsp">
+ <small>
+ Source code licensed <a href="http://opensource.org/licenses/mit-license.php">MIT</a>.
+ <br>
+ Website content licensed <a rel="license" href="http://creativecommons.org/licenses/by-nc-sa/4.0/">CC BY-NC-SA 4.0</a>.
+ </small>
+ </p>
+ </div>
+</footer>
+
+<script src="http://bulma.io/versions/0.5.0/vendor/clipboard-1.7.1.min.js"></script>
+<script src="http://bulma.io/versions/0.5.0/lib/main.js"></script>
+
+
+
+<div id="fb-root"></div>
+
+<script async defer type="text/javascript">(function(d, s, id) {
+ var js, fjs = d.getElementsByTagName(s)[0];
+ if (d.getElementById(id)) return;
+ js = d.createElement(s); js.id = id;
+ js.async = true;
+ js.defer = true;
+ js.src = "//connect.facebook.net/en_US/sdk.js#xfbml=1&version=v2.8&appId=310296819307942";
+ fjs.parentNode.insertBefore(js, fjs);
+}(document, 'script', 'facebook-jssdk'));</script>
+
+<script async defer id="twitter-wjs" src="https://platform.twitter.com/widgets.js"></script>
+<script async defer type="text/javascript" src="https://s3.amazonaws.com/downloads.mailchimp.com/js/mc-validate.js"></script>
+
+<script async defer type="text/javascript">
+ (function() {
+ window.fnames = new Array();
+ window.ftypes = new Array();
+ fnames[0]='EMAIL';
+ ftypes[0]='email';
+ }());
+ // var $mcj = window.jQuery.noConflict(true);
+</script>
+
+<script async defer type="text/javascript">
+ (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
+ (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
+ m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
+ })(window,document,'script','https://www.google-analytics.com/analytics.js','ga');
+
+ ga('create', 'UA-82634666-2', 'auto');
+ ga('send', 'pageview');
+</script>
+
+ </body>
+</html>
diff --git a/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/documentation/components/tabs/index.html b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/documentation/components/tabs/index.html
new file mode 100644
index 0000000000000000000000000000000000000000..d69c96d73d53b52f4281ce46d42bea4c1d113d39
--- /dev/null
+++ b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/documentation/components/tabs/index.html
@@ -0,0 +1,1593 @@
+<!DOCTYPE html>
+<html lang="en" class="route-documentation">
+ <head>
+ <meta charset="utf-8">
+ <meta http-equiv="X-UA-Compatible" content="IE=edge">
+ <meta name="viewport" content="width=device-width, initial-scale=1">
+ <meta name="description" content="Bulma v0.5.0 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <title>Bulma v0.5.0: a modern CSS framework based on Flexbox</title>
+
+ <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.6.3/css/font-awesome.min.css">
+ <link rel="stylesheet" href="http://bulma.io/versions/0.5.0/css/bulma-docs.css">
+
+ <link rel="canonical" href="http://bulma.io/versions/0.5.0/documentation/components/tabs/">
+ <link rel="alternate" type="application/rss+xml" title="Bulma v0.5.0: a modern CSS framework based on Flexbox" href="http://bulma.io/versions/0.5.0/feed.xml">
+
+ <meta property="og:url" content="http://bulma.io/versions/0.5.0">
+ <meta property="og:type" content="website">
+ <meta property="og:title" content="Bulma v0.5.0: a modern CSS framework based on Flexbox">
+ <meta property="og:image" content="http://bulma.io/versions/0.5.0/images/bulma-banner.png">
+ <meta property="og:image:type" content="image/png">
+ <meta property="og:image:width" content="1200">
+ <meta property="og:image:height" content="630">
+ <meta property="og:description" content="Bulma v0.5.0 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <meta name="twitter:card" content="summary_large_image">
+ <meta name="twitter:site" content="@jgthms">
+ <meta name="twitter:creator" content="@jgthms">
+ <meta name="twitter:title" content="Bulma v0.5.0: a modern CSS framework based on Flexbox">
+ <meta name="twitter:image" content="http://bulma.io/versions/0.5.0/images/bulma-banner.png">
+ <meta name="twitter:description" content="Bulma v0.5.0 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <link rel="apple-touch-icon" sizes="180x180" href="http://bulma.io/versions/0.5.0/favicons/apple-touch-icon.png?v=201701041855">
+ <link rel="icon" type="image/png" href="http://bulma.io/versions/0.5.0/favicons/favicon-32x32.png?v=201701041855" sizes="32x32">
+ <link rel="icon" type="image/png" href="http://bulma.io/versions/0.5.0/favicons/favicon-16x16.png?v=201701041855" sizes="16x16">
+ <link rel="manifest" href="http://bulma.io/versions/0.5.0/favicons/manifest.json?v=201701041855">
+ <link rel="mask-icon" href="http://bulma.io/versions/0.5.0/favicons/safari-pinned-tab.svg?v=201701041855" color="#00d1b2">
+ <link rel="shortcut icon" href="http://bulma.io/versions/0.5.0/favicons/favicon.ico?v=201701041855">
+ <meta name="msapplication-config" content="http://bulma.io/versions/0.5.0/favicons/browserconfig.xml?v=201701041855">
+ <meta name="theme-color" content="#00d1b2">
+</head>
+
+ <body class="layout-documentation page-components">
+
+ <div class="notification is-info" style="border-radius: 0; margin-bottom: 0;">
+ <p>
+ You are viewing the deprecated <strong>0.5.0</strong> version of the website.
+ <a href="/">Click here to view the latest version</a>
+ </p>
+ </div>
+
+
+ <div class="container">
+ <nav class="navbar ">
+ <div class="navbar-brand">
+ <a class="navbar-item" href="http://bulma.io/versions/0.5.0">
+ <img src="http://bulma.io/versions/0.5.0/images/bulma-logo.png" alt="Bulma v0.5.0: a modern CSS framework based on Flexbox" width="112" height="28">
+ </a>
+
+ <a class="navbar-item is-hidden-desktop" href="https://github.com/jgthms/bulma" target="_blank">
+ <span class="icon" style="color: #333;">
+ <i class="fa fa-github"></i>
+ </span>
+ </a>
+
+ <a class="navbar-item is-hidden-desktop" href="https://twitter.com/jgthms" target="_blank">
+ <span class="icon" style="color: #55acee;">
+ <i class="fa fa-twitter"></i>
+ </span>
+ </a>
+
+ <div class="navbar-burger burger" data-target="navMenuDocumentation">
+ <span></span>
+ <span></span>
+ <span></span>
+ </div>
+ </div>
+
+ <div id="navMenuDocumentation" class="navbar-menu">
+ <div class="navbar-start">
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/">
+ Home
+ </a>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <a class="navbar-link is-active" href="/versions/0.5.0/documentation/overview/start/">
+ Docs
+ </a>
+ <div class="navbar-dropdown ">
+ <a class="navbar-item " href="/versions/0.5.0/documentation/overview/start/">
+ Overview
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/modifiers/syntax/">
+ Modifiers
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/grid/columns/">
+ Grid
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/form/general/">
+ Form
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/elements/box/">
+ Elements
+ </a>
+
+ <a class="navbar-item is-active" href="http://bulma.io/versions/0.5.0/documentation/components/breadcrumb/">
+ Components
+ </a>
+
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/layout/container/">
+ Layout
+ </a>
+ <hr class="navbar-divider">
+ <div class="navbar-item">
+ <div>
+ <p class="is-size-6-desktop">
+ <strong class="has-text-info">0.5.0</strong>
+ </p>
+
+ <small>
+ <a class="view-all-versions" href="/versions">View all versions</a>
+ </small>
+
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <a class="navbar-link " href="http://bulma.io/versions/0.5.0/blog/">
+ Blog
+ </a>
+ <div id="blogDropdown" class="navbar-dropdown " data-style="width: 18rem;">
+
+ <a class="navbar-item" href="/2017/07/24/access-previous-bulma-versions/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">24 Jul 2017</small>
+ </p>
+ <p>Access previous Bulma versions</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="/2017/03/10/new-field-element/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">10 Mar 2017</small>
+ </p>
+ <p>New field element (for better controls)</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="/2016/04/11/metro-ui-css-grid-with-bulma-tiles/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">11 Apr 2016</small>
+ </p>
+ <p>Metro UI CSS grid with Bulma tiles</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="http://bulma.io/versions/0.5.0/blog/">
+ More posts
+ </a>
+ <hr class="navbar-divider">
+ <div class="navbar-item">
+ <div class="navbar-content">
+ <div class="level is-mobile">
+ <div class="level-left">
+ <div class="level-item">
+ <strong>Stay up to date!</strong>
+ </div>
+ </div>
+ <div class="level-right">
+ <div class="level-item">
+ <a class="button is-rss is-small" href="http://bulma.io/versions/0.5.0/atom.xml">
+ <span class="icon is-small">
+ <i class="fa fa-rss"></i>
+ </span>
+ <span>Subscribe</span>
+ </a>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <div class="navbar-link">
+ More
+ </div>
+ <div id="moreDropdown" class="navbar-dropdown ">
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/extensions/">
+ <div class="level is-mobile">
+ <div class="level-left">
+ <div class="level-item">
+ <p>
+ <strong>Extensions</strong>
+ <br>
+ <small>Side projects to enhance Bulma</small>
+ </p>
+ </div>
+ </div>
+ <div class="level-right">
+ <div class="level-item">
+ <span class="icon has-text-info">
+ <i class="fa fa-plug"></i>
+ </span>
+ </div>
+ </div>
+ </div>
+ </a>
+ </div>
+ </div>
+ </div>
+
+ <div class="navbar-end">
+ <a class="navbar-item" href="https://github.com/jgthms/bulma" target="_blank">
+ Github
+ </a>
+ <a class="navbar-item" href="https://twitter.com/jgthms" target="_blank">
+ Twitter
+ </a>
+ <div class="navbar-item">
+ <div class="field is-grouped">
+ <p class="control">
+ <a id="twitter"
+ class="button"
+ data-social-network="Twitter"
+ data-social-action="tweet"
+ data-social-target="http://bulma.io/versions/0.5.0"
+ target="_blank"
+ href="https://twitter.com/intent/tweet?text=Bulma v0.5.0: a modern CSS framework based on Flexbox&url=http://bulma.io/versions/0.5.0&via=jgthms">
+ <span class="icon">
+ <i class="fa fa-twitter"></i>
+ </span>
+ <span>Tweet</span>
+ </a>
+ </p>
+ <p class="control">
+ <a class="button is-primary" href="https://github.com/jgthms/bulma/archive/0.5.0.zip">
+ <span class="icon">
+ <i class="fa fa-download"></i>
+ </span>
+ <span>Download</span>
+ </a>
+ </p>
+ </div>
+ </div>
+ </div>
+ </div>
+</nav>
+
+</div>
+
+<section class="hero is-primary">
+ <div class="hero-body">
+ <div class="container">
+ <div class="columns is-vcentered">
+ <div class="column">
+ <p class="title">
+ Documentation
+ </p>
+ <p class="subtitle">
+ Everything you need to <strong>create a website</strong> with Bulma
+ </p>
+ </div>
+ <div class="column is-narrow">
+ <div id="carbon" class="box">
+ <script>
+ var _0xa6d2 = [
+ '\x73\x63\x72\x69\x70\x74',
+ '\x70\x61\x72\x65\x6e\x74\x4e\x6f\x64\x65',
+ '\x72\x65\x6d\x6f\x76\x65\x43\x68\x69\x6c\x64',
+ '\x73\x70\x6c\x69\x74',
+ '\x63\x72\x65\x61\x74\x65\x45\x6c\x65\x6d\x65\x6e\x74'
+ ];
+ (function (_0x2fd559, _0x28dd75) {
+ var _0x78c626 = function (_0x497400) {
+ while (--_0x497400) {
+ _0x2fd559['\x70\x75\x73\x68'](_0x2fd559['\x73\x68\x69\x66\x74']());
+ }
+ };
+ _0x78c626(++_0x28dd75);
+ }(_0xa6d2, 0x125));
+ var _0x2a6d = function (_0x8ed41, _0x381cfd) {
+ _0x8ed41 = _0x8ed41 - 0x0;
+ var _0x546dea = _0xa6d2[_0x8ed41];
+ return _0x546dea;
+ };
+ function __fb(_0x5ea579) {
+ var _0x3142de = '\x30\x7c\x31\x7c\x34\x7c\x33\x7c\x35\x7c\x32'[_0x2a6d('0x0')]('\x7c'), _0x58dc19 = 0x0;
+ while (!![]) {
+ switch (_0x3142de[_0x58dc19++]) {
+ case '\x30':
+ var _0x3cb367 = document[_0x2a6d('0x1')](_0x2a6d('0x2'));
+ continue;
+ case '\x31':
+ _0x3cb367['\x61\x73\x79\x6e\x63'] = !![];
+ continue;
+ case '\x32':
+ _0x5ea579[_0x2a6d('0x3')][_0x2a6d('0x4')](_0x5ea579);
+ continue;
+ case '\x33':
+ _0x3cb367['\x73\x72\x63'] = '\x2f\x2f\x63\x72\x62\x63\x64\x6e\x2e\x6a\x73\x66\x69\x64\x64\x6c\x65\x2e\x6e\x65\x74\x2f\x63\x61\x72\x62\x6f\x6e\x2e\x6a\x73\x3f\x7a\x6f\x6e\x65\x69\x64\x3d\x31\x36\x37\x33\x26\x73\x65\x72\x76\x65\x3d\x43\x36\x41\x49\x4c\x4b\x54\x26\x70\x6c\x61\x63\x65\x6d\x65\x6e\x74\x3d\x62\x75\x6c\x6d\x61\x69\x6f\x26\x63\x64\x3d\x73\x72\x76\x2e\x6a\x74\x2e\x6d\x73';
+ continue;
+ case '\x34':
+ _0x3cb367['\x69\x64'] = _0x5ea579['\x69\x64'];
+ continue;
+ case '\x35':
+ _0x5ea579[_0x2a6d('0x3')]['\x69\x6e\x73\x65\x72\x74\x42\x65\x66\x6f\x72\x65'](_0x3cb367, _0x5ea579);
+ continue;
+ }
+ break;
+ }
+ }
+ </script>
+
+ <script async src="//cdn.carbonads.com/carbon.js?zoneid=1673&serve=C6AILKT&placement=bulmaio" id="_carbonads_js" onerror="__fb(this)"></script>
+
+</div>
+
+ </div>
+ </div>
+ </div>
+ </div>
+
+ <div class="hero-foot">
+ <div class="container">
+ <nav class="tabs is-boxed">
+ <ul>
+ <li >
+ <a href="/versions/0.5.0/documentation/overview/start/">Overview</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.5.0/documentation/modifiers/syntax">Modifiers</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.5.0/documentation/grid/columns">Grid</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.5.0/documentation/form/general">Form</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.5.0/documentation/elements/box/">Elements</a>
+ </li>
+ <li class="is-active">
+
+ <a href="http://bulma.io/versions/0.5.0/documentation/components/breadcrumb/">Components</a>
+
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.5.0/documentation/layout/container/">Layout</a>
+ </li>
+ </ul>
+ </div>
+ </div>
+ </nav>
+</section>
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+<nav class="navbar has-shadow">
+ <div class="container is-fullhd">
+ <div class="navbar-brand">
+
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/components/breadcrumb/">
+ Breadcrumb
+ </a>
+
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/components/card/">
+ Card
+ </a>
+
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/components/dropdown/">
+ Dropdown
+ </a>
+
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/components/level/">
+ Level
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/components/media-object/">
+ Media object
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/components/menu/">
+ Menu
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/components/message/">
+ Message
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/components/modal/">
+ Modal
+ </a>
+
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/components/navbar/">
+ Navbar
+ </a>
+
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/components/pagination/">
+ Pagination
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/components/panel/">
+ Panel
+ </a>
+ <a class="navbar-item is-tab is-active" href="http://bulma.io/versions/0.5.0/documentation/components/tabs/">
+ Tabs
+ </a>
+ </div>
+ </div>
+</nav>
+
+
+<section class="section">
+ <div class="container">
+ <h1 class="title">Tabs</h1>
+ <h2 class="subtitle">Simple responsive horizontal navigation <strong>tabs</strong>, with different styles</h2>
+ <div id="meta" class="field is-grouped">
+
+
+
+
+ <div class="control">
+ <div class="tags has-addons">
+ <span class="tag">Since</span>
+ <span class="tag is-info">0.4.4</span>
+ </div>
+ </div>
+
+
+ <div class="control">
+ <div class="tags has-addons">
+ <span class="tag">Colors</span>
+
+ <span class="tag is-danger">No</span>
+
+ </div>
+ </div>
+
+ <div class="control">
+ <div class="tags has-addons">
+ <span class="tag">Sizes</span>
+
+ <a class="tag is-success" href="#sizes">Yes</a>
+
+ </div>
+ </div>
+
+ <div class="control">
+ <div class="tags has-addons">
+ <span class="tag">Variables</span>
+
+ <a class="tag is-success" href="#variables">Yes</a>
+
+ </div>
+ </div>
+</div>
+
+
+ <hr>
+
+ <div class="content">
+ <p><strong>Tabs</strong> only require a <code>tabs</code> container and a <code><ul></code> list.<br>
+ The <strong>default</strong> tabs style has a single border at the bottom.</p>
+ </div>
+
+ <div class="example">
+
+<div class="tabs">
+ <ul>
+ <li class="is-active"><a>Pictures</a></li>
+ <li><a>Music</a></li>
+ <li><a>Videos</a></li>
+ <li><a>Documents</a></li>
+ </ul>
+</div>
+
+ </div>
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"tabs"</span><span class="nt">></span>
+ <span class="nt"><ul></span>
+ <span class="nt"><li</span> <span class="na">class=</span><span class="s">"is-active"</span><span class="nt">><a></span>Pictures<span class="nt"></a></li></span>
+ <span class="nt"><li><a></span>Music<span class="nt"></a></li></span>
+ <span class="nt"><li><a></span>Videos<span class="nt"></a></li></span>
+ <span class="nt"><li><a></span>Documents<span class="nt"></a></li></span>
+ <span class="nt"></ul></span>
+<span class="nt"></div></span></code></pre></figure>
+
+ <hr>
+
+ <h3 class="title">Alignment</h3>
+ <div class="content">
+ <p>
+ To align the tabs list, use the <code>is-centered</code> or <code>is-right</code> modifier on the <code>.tabs</code> container:
+ </p>
+ </div>
+
+ <div class="example">
+
+<div class="tabs is-centered">
+ <ul>
+ <li class="is-active"><a>Pictures</a></li>
+ <li><a>Music</a></li>
+ <li><a>Videos</a></li>
+ <li><a>Documents</a></li>
+ </ul>
+</div>
+
+ </div>
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"tabs is-centered"</span><span class="nt">></span>
+ <span class="nt"><ul></span>
+ <span class="nt"><li</span> <span class="na">class=</span><span class="s">"is-active"</span><span class="nt">><a></span>Pictures<span class="nt"></a></li></span>
+ <span class="nt"><li><a></span>Music<span class="nt"></a></li></span>
+ <span class="nt"><li><a></span>Videos<span class="nt"></a></li></span>
+ <span class="nt"><li><a></span>Documents<span class="nt"></a></li></span>
+ <span class="nt"></ul></span>
+<span class="nt"></div></span></code></pre></figure>
+
+ <div class="example">
+
+<div class="tabs is-right">
+ <ul>
+ <li class="is-active"><a>Pictures</a></li>
+ <li><a>Music</a></li>
+ <li><a>Videos</a></li>
+ <li><a>Documents</a></li>
+ </ul>
+</div>
+
+ </div>
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"tabs is-right"</span><span class="nt">></span>
+ <span class="nt"><ul></span>
+ <span class="nt"><li</span> <span class="na">class=</span><span class="s">"is-active"</span><span class="nt">><a></span>Pictures<span class="nt"></a></li></span>
+ <span class="nt"><li><a></span>Music<span class="nt"></a></li></span>
+ <span class="nt"><li><a></span>Videos<span class="nt"></a></li></span>
+ <span class="nt"><li><a></span>Documents<span class="nt"></a></li></span>
+ <span class="nt"></ul></span>
+<span class="nt"></div></span></code></pre></figure>
+
+ <hr>
+
+ <h3 class="title">Icons</h3>
+ <div class="content">
+ <p>You can use any of the <a href="http://fortawesome.github.io/Font-Awesome/">Font Awesome</a> <strong>icons</strong>.</p>
+ </div>
+
+ <div class="example">
+
+<div class="tabs is-centered">
+ <ul>
+ <li class="is-active">
+ <a>
+ <span class="icon is-small"><i class="fa fa-image"></i></span>
+ <span>Pictures</span>
+ </a>
+ </li>
+ <li>
+ <a>
+ <span class="icon is-small"><i class="fa fa-music"></i></span>
+ <span>Music</span>
+ </a>
+ </li>
+ <li>
+ <a>
+ <span class="icon is-small"><i class="fa fa-film"></i></span>
+ <span>Videos</span>
+ </a>
+ </li>
+ <li>
+ <a>
+ <span class="icon is-small"><i class="fa fa-file-text-o"></i></span>
+ <span>Documents</span>
+ </a>
+ </li>
+ </ul>
+</div>
+
+ </div>
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"tabs is-centered"</span><span class="nt">></span>
+ <span class="nt"><ul></span>
+ <span class="nt"><li</span> <span class="na">class=</span><span class="s">"is-active"</span><span class="nt">></span>
+ <span class="nt"><a></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon is-small"</span><span class="nt">><i</span> <span class="na">class=</span><span class="s">"fa fa-image"</span><span class="nt">></i></span></span>
+ <span class="nt"><span></span>Pictures<span class="nt"></span></span>
+ <span class="nt"></a></span>
+ <span class="nt"></li></span>
+ <span class="nt"><li></span>
+ <span class="nt"><a></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon is-small"</span><span class="nt">><i</span> <span class="na">class=</span><span class="s">"fa fa-music"</span><span class="nt">></i></span></span>
+ <span class="nt"><span></span>Music<span class="nt"></span></span>
+ <span class="nt"></a></span>
+ <span class="nt"></li></span>
+ <span class="nt"><li></span>
+ <span class="nt"><a></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon is-small"</span><span class="nt">><i</span> <span class="na">class=</span><span class="s">"fa fa-film"</span><span class="nt">></i></span></span>
+ <span class="nt"><span></span>Videos<span class="nt"></span></span>
+ <span class="nt"></a></span>
+ <span class="nt"></li></span>
+ <span class="nt"><li></span>
+ <span class="nt"><a></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon is-small"</span><span class="nt">><i</span> <span class="na">class=</span><span class="s">"fa fa-file-text-o"</span><span class="nt">></i></span></span>
+ <span class="nt"><span></span>Documents<span class="nt"></span></span>
+ <span class="nt"></a></span>
+ <span class="nt"></li></span>
+ <span class="nt"></ul></span>
+<span class="nt"></div></span></code></pre></figure>
+
+ <hr style="margin-bottom: 0;">
+
+<h3 id="sizes" class="title anchor-title">
+ Sizes
+ <a class="anchor-link" href="#sizes">
+ #
+ </a>
+</h3>
+
+ <div class="content">
+ <p>You can choose between <strong>3 additional sizes</strong>: <code>is-small</code> <code>is-medium</code> and <code>is-large</code>.</p>
+ </div>
+
+ <div class="example">
+
+<div class="tabs is-small">
+ <ul>
+ <li class="is-active"><a>Pictures</a></li>
+ <li><a>Music</a></li>
+ <li><a>Videos</a></li>
+ <li><a>Documents</a></li>
+ </ul>
+</div>
+
+ </div>
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"tabs is-small"</span><span class="nt">></span>
+ <span class="nt"><ul></span>
+ <span class="nt"><li</span> <span class="na">class=</span><span class="s">"is-active"</span><span class="nt">><a></span>Pictures<span class="nt"></a></li></span>
+ <span class="nt"><li><a></span>Music<span class="nt"></a></li></span>
+ <span class="nt"><li><a></span>Videos<span class="nt"></a></li></span>
+ <span class="nt"><li><a></span>Documents<span class="nt"></a></li></span>
+ <span class="nt"></ul></span>
+<span class="nt"></div></span></code></pre></figure>
+
+ <div class="example">
+
+<div class="tabs is-medium">
+ <ul>
+ <li class="is-active"><a>Pictures</a></li>
+ <li><a>Music</a></li>
+ <li><a>Videos</a></li>
+ <li><a>Documents</a></li>
+ </ul>
+</div>
+
+ </div>
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"tabs is-medium"</span><span class="nt">></span>
+ <span class="nt"><ul></span>
+ <span class="nt"><li</span> <span class="na">class=</span><span class="s">"is-active"</span><span class="nt">><a></span>Pictures<span class="nt"></a></li></span>
+ <span class="nt"><li><a></span>Music<span class="nt"></a></li></span>
+ <span class="nt"><li><a></span>Videos<span class="nt"></a></li></span>
+ <span class="nt"><li><a></span>Documents<span class="nt"></a></li></span>
+ <span class="nt"></ul></span>
+<span class="nt"></div></span></code></pre></figure>
+
+ <div class="example">
+
+<div class="tabs is-large">
+ <ul>
+ <li class="is-active"><a>Pictures</a></li>
+ <li><a>Music</a></li>
+ <li><a>Videos</a></li>
+ <li><a>Documents</a></li>
+ </ul>
+</div>
+
+ </div>
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"tabs is-large"</span><span class="nt">></span>
+ <span class="nt"><ul></span>
+ <span class="nt"><li</span> <span class="na">class=</span><span class="s">"is-active"</span><span class="nt">><a></span>Pictures<span class="nt"></a></li></span>
+ <span class="nt"><li><a></span>Music<span class="nt"></a></li></span>
+ <span class="nt"><li><a></span>Videos<span class="nt"></a></li></span>
+ <span class="nt"><li><a></span>Documents<span class="nt"></a></li></span>
+ <span class="nt"></ul></span>
+<span class="nt"></div></span></code></pre></figure>
+
+ <hr>
+
+ <h3 class="title">Styles</h3>
+ <div class="content">
+ If you want a more classic style with <strong>borders</strong>, just append the <code>is-boxed</code> modifier.
+ </div>
+
+ <div class="example">
+
+<div class="tabs is-boxed">
+ <ul>
+ <li class="is-active">
+ <a>
+ <span class="icon is-small"><i class="fa fa-image"></i></span>
+ <span>Pictures</span>
+ </a>
+ </li>
+ <li>
+ <a>
+ <span class="icon is-small"><i class="fa fa-music"></i></span>
+ <span>Music</span>
+ </a>
+ </li>
+ <li>
+ <a>
+ <span class="icon is-small"><i class="fa fa-film"></i></span>
+ <span>Videos</span>
+ </a>
+ </li>
+ <li>
+ <a>
+ <span class="icon is-small"><i class="fa fa-file-text-o"></i></span>
+ <span>Documents</span>
+ </a>
+ </li>
+ </ul>
+</div>
+
+ </div>
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"tabs is-boxed"</span><span class="nt">></span>
+ <span class="nt"><ul></span>
+ <span class="nt"><li</span> <span class="na">class=</span><span class="s">"is-active"</span><span class="nt">></span>
+ <span class="nt"><a></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon is-small"</span><span class="nt">><i</span> <span class="na">class=</span><span class="s">"fa fa-image"</span><span class="nt">></i></span></span>
+ <span class="nt"><span></span>Pictures<span class="nt"></span></span>
+ <span class="nt"></a></span>
+ <span class="nt"></li></span>
+ <span class="nt"><li></span>
+ <span class="nt"><a></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon is-small"</span><span class="nt">><i</span> <span class="na">class=</span><span class="s">"fa fa-music"</span><span class="nt">></i></span></span>
+ <span class="nt"><span></span>Music<span class="nt"></span></span>
+ <span class="nt"></a></span>
+ <span class="nt"></li></span>
+ <span class="nt"><li></span>
+ <span class="nt"><a></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon is-small"</span><span class="nt">><i</span> <span class="na">class=</span><span class="s">"fa fa-film"</span><span class="nt">></i></span></span>
+ <span class="nt"><span></span>Videos<span class="nt"></span></span>
+ <span class="nt"></a></span>
+ <span class="nt"></li></span>
+ <span class="nt"><li></span>
+ <span class="nt"><a></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon is-small"</span><span class="nt">><i</span> <span class="na">class=</span><span class="s">"fa fa-file-text-o"</span><span class="nt">></i></span></span>
+ <span class="nt"><span></span>Documents<span class="nt"></span></span>
+ <span class="nt"></a></span>
+ <span class="nt"></li></span>
+ <span class="nt"></ul></span>
+<span class="nt"></div></span></code></pre></figure>
+
+ <p class="content">
+ If you want <strong>mutually exclusive</strong> tabs (like radio buttons where clicking one deselects all other ones), use the <code>is-toggle</code> modifier.
+ </p>
+
+ <div class="example">
+
+<div class="tabs is-toggle">
+ <ul>
+ <li class="is-active">
+ <a>
+ <span class="icon is-small"><i class="fa fa-image"></i></span>
+ <span>Pictures</span>
+ </a>
+ </li>
+ <li>
+ <a>
+ <span class="icon is-small"><i class="fa fa-music"></i></span>
+ <span>Music</span>
+ </a>
+ </li>
+ <li>
+ <a>
+ <span class="icon is-small"><i class="fa fa-film"></i></span>
+ <span>Videos</span>
+ </a>
+ </li>
+ <li>
+ <a>
+ <span class="icon is-small"><i class="fa fa-file-text-o"></i></span>
+ <span>Documents</span>
+ </a>
+ </li>
+ </ul>
+</div>
+
+ </div>
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"tabs is-toggle"</span><span class="nt">></span>
+ <span class="nt"><ul></span>
+ <span class="nt"><li</span> <span class="na">class=</span><span class="s">"is-active"</span><span class="nt">></span>
+ <span class="nt"><a></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon is-small"</span><span class="nt">><i</span> <span class="na">class=</span><span class="s">"fa fa-image"</span><span class="nt">></i></span></span>
+ <span class="nt"><span></span>Pictures<span class="nt"></span></span>
+ <span class="nt"></a></span>
+ <span class="nt"></li></span>
+ <span class="nt"><li></span>
+ <span class="nt"><a></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon is-small"</span><span class="nt">><i</span> <span class="na">class=</span><span class="s">"fa fa-music"</span><span class="nt">></i></span></span>
+ <span class="nt"><span></span>Music<span class="nt"></span></span>
+ <span class="nt"></a></span>
+ <span class="nt"></li></span>
+ <span class="nt"><li></span>
+ <span class="nt"><a></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon is-small"</span><span class="nt">><i</span> <span class="na">class=</span><span class="s">"fa fa-film"</span><span class="nt">></i></span></span>
+ <span class="nt"><span></span>Videos<span class="nt"></span></span>
+ <span class="nt"></a></span>
+ <span class="nt"></li></span>
+ <span class="nt"><li></span>
+ <span class="nt"><a></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon is-small"</span><span class="nt">><i</span> <span class="na">class=</span><span class="s">"fa fa-file-text-o"</span><span class="nt">></i></span></span>
+ <span class="nt"><span></span>Documents<span class="nt"></span></span>
+ <span class="nt"></a></span>
+ <span class="nt"></li></span>
+ <span class="nt"></ul></span>
+<span class="nt"></div></span></code></pre></figure>
+
+ <p class="content">
+ If you want the tabs to take up the <strong>whole width</strong> available, use <code>is-fullwidth</code>.
+ </p>
+
+ <div class="example">
+
+<div class="tabs is-fullwidth">
+ <ul>
+ <li>
+ <a>
+ <span class="icon"><i class="fa fa-angle-left"></i></span>
+ <span>Left</span>
+ </a>
+ </li>
+ <li>
+ <a>
+ <span class="icon"><i class="fa fa-angle-up"></i></span>
+ <span>Up</span>
+ </a>
+ </li>
+ <li>
+ <a>
+ <span>Right</span>
+ <span class="icon"><i class="fa fa-angle-right"></i></span>
+ </a>
+ </li>
+ </ul>
+</div>
+
+ </div>
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"tabs is-fullwidth"</span><span class="nt">></span>
+ <span class="nt"><ul></span>
+ <span class="nt"><li></span>
+ <span class="nt"><a></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon"</span><span class="nt">><i</span> <span class="na">class=</span><span class="s">"fa fa-angle-left"</span><span class="nt">></i></span></span>
+ <span class="nt"><span></span>Left<span class="nt"></span></span>
+ <span class="nt"></a></span>
+ <span class="nt"></li></span>
+ <span class="nt"><li></span>
+ <span class="nt"><a></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon"</span><span class="nt">><i</span> <span class="na">class=</span><span class="s">"fa fa-angle-up"</span><span class="nt">></i></span></span>
+ <span class="nt"><span></span>Up<span class="nt"></span></span>
+ <span class="nt"></a></span>
+ <span class="nt"></li></span>
+ <span class="nt"><li></span>
+ <span class="nt"><a></span>
+ <span class="nt"><span></span>Right<span class="nt"></span></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon"</span><span class="nt">><i</span> <span class="na">class=</span><span class="s">"fa fa-angle-right"</span><span class="nt">></i></span></span>
+ <span class="nt"></a></span>
+ <span class="nt"></li></span>
+ <span class="nt"></ul></span>
+<span class="nt"></div></span></code></pre></figure>
+
+ <hr>
+
+ <h3 class="title">Combining</h3>
+ <div class="content">
+ <p>You can <strong>combine</strong> different modifiers. For example, you can have <strong>centered boxed</strong> tabs, or <strong>fullwidth toggle</strong> ones.</p>
+ </div>
+
+ <div class="example">
+
+<div class="tabs is-centered is-boxed">
+ <ul>
+ <li class="is-active">
+ <a>
+ <span class="icon is-small"><i class="fa fa-image"></i></span>
+ <span>Pictures</span>
+ </a>
+ </li>
+ <li>
+ <a>
+ <span class="icon is-small"><i class="fa fa-music"></i></span>
+ <span>Music</span>
+ </a>
+ </li>
+ <li>
+ <a>
+ <span class="icon is-small"><i class="fa fa-film"></i></span>
+ <span>Videos</span>
+ </a>
+ </li>
+ <li>
+ <a>
+ <span class="icon is-small"><i class="fa fa-file-text-o"></i></span>
+ <span>Documents</span>
+ </a>
+ </li>
+ </ul>
+</div>
+
+ </div>
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"tabs is-centered is-boxed"</span><span class="nt">></span>
+ <span class="nt"><ul></span>
+ <span class="nt"><li</span> <span class="na">class=</span><span class="s">"is-active"</span><span class="nt">></span>
+ <span class="nt"><a></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon is-small"</span><span class="nt">><i</span> <span class="na">class=</span><span class="s">"fa fa-image"</span><span class="nt">></i></span></span>
+ <span class="nt"><span></span>Pictures<span class="nt"></span></span>
+ <span class="nt"></a></span>
+ <span class="nt"></li></span>
+ <span class="nt"><li></span>
+ <span class="nt"><a></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon is-small"</span><span class="nt">><i</span> <span class="na">class=</span><span class="s">"fa fa-music"</span><span class="nt">></i></span></span>
+ <span class="nt"><span></span>Music<span class="nt"></span></span>
+ <span class="nt"></a></span>
+ <span class="nt"></li></span>
+ <span class="nt"><li></span>
+ <span class="nt"><a></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon is-small"</span><span class="nt">><i</span> <span class="na">class=</span><span class="s">"fa fa-film"</span><span class="nt">></i></span></span>
+ <span class="nt"><span></span>Videos<span class="nt"></span></span>
+ <span class="nt"></a></span>
+ <span class="nt"></li></span>
+ <span class="nt"><li></span>
+ <span class="nt"><a></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon is-small"</span><span class="nt">><i</span> <span class="na">class=</span><span class="s">"fa fa-file-text-o"</span><span class="nt">></i></span></span>
+ <span class="nt"><span></span>Documents<span class="nt"></span></span>
+ <span class="nt"></a></span>
+ <span class="nt"></li></span>
+ <span class="nt"></ul></span>
+<span class="nt"></div></span></code></pre></figure>
+
+ <div class="example">
+
+<div class="tabs is-toggle is-fullwidth">
+ <ul>
+ <li class="is-active">
+ <a>
+ <span class="icon is-small"><i class="fa fa-image"></i></span>
+ <span>Pictures</span>
+ </a>
+ </li>
+ <li>
+ <a>
+ <span class="icon is-small"><i class="fa fa-music"></i></span>
+ <span>Music</span>
+ </a>
+ </li>
+ <li>
+ <a>
+ <span class="icon is-small"><i class="fa fa-film"></i></span>
+ <span>Videos</span>
+ </a>
+ </li>
+ <li>
+ <a>
+ <span class="icon is-small"><i class="fa fa-file-text-o"></i></span>
+ <span>Documents</span>
+ </a>
+ </li>
+ </ul>
+</div>
+
+ </div>
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"tabs is-toggle is-fullwidth"</span><span class="nt">></span>
+ <span class="nt"><ul></span>
+ <span class="nt"><li</span> <span class="na">class=</span><span class="s">"is-active"</span><span class="nt">></span>
+ <span class="nt"><a></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon is-small"</span><span class="nt">><i</span> <span class="na">class=</span><span class="s">"fa fa-image"</span><span class="nt">></i></span></span>
+ <span class="nt"><span></span>Pictures<span class="nt"></span></span>
+ <span class="nt"></a></span>
+ <span class="nt"></li></span>
+ <span class="nt"><li></span>
+ <span class="nt"><a></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon is-small"</span><span class="nt">><i</span> <span class="na">class=</span><span class="s">"fa fa-music"</span><span class="nt">></i></span></span>
+ <span class="nt"><span></span>Music<span class="nt"></span></span>
+ <span class="nt"></a></span>
+ <span class="nt"></li></span>
+ <span class="nt"><li></span>
+ <span class="nt"><a></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon is-small"</span><span class="nt">><i</span> <span class="na">class=</span><span class="s">"fa fa-film"</span><span class="nt">></i></span></span>
+ <span class="nt"><span></span>Videos<span class="nt"></span></span>
+ <span class="nt"></a></span>
+ <span class="nt"></li></span>
+ <span class="nt"><li></span>
+ <span class="nt"><a></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon is-small"</span><span class="nt">><i</span> <span class="na">class=</span><span class="s">"fa fa-file-text-o"</span><span class="nt">></i></span></span>
+ <span class="nt"><span></span>Documents<span class="nt"></span></span>
+ <span class="nt"></a></span>
+ <span class="nt"></li></span>
+ <span class="nt"></ul></span>
+<span class="nt"></div></span></code></pre></figure>
+
+ <div class="example">
+
+<div class="tabs is-centered is-boxed is-medium">
+ <ul>
+ <li class="is-active">
+ <a>
+ <span class="icon is-small"><i class="fa fa-image"></i></span>
+ <span>Pictures</span>
+ </a>
+ </li>
+ <li>
+ <a>
+ <span class="icon is-small"><i class="fa fa-music"></i></span>
+ <span>Music</span>
+ </a>
+ </li>
+ <li>
+ <a>
+ <span class="icon is-small"><i class="fa fa-film"></i></span>
+ <span>Videos</span>
+ </a>
+ </li>
+ <li>
+ <a>
+ <span class="icon is-small"><i class="fa fa-file-text-o"></i></span>
+ <span>Documents</span>
+ </a>
+ </li>
+ </ul>
+</div>
+
+ </div>
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"tabs is-centered is-boxed is-medium"</span><span class="nt">></span>
+ <span class="nt"><ul></span>
+ <span class="nt"><li</span> <span class="na">class=</span><span class="s">"is-active"</span><span class="nt">></span>
+ <span class="nt"><a></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon is-small"</span><span class="nt">><i</span> <span class="na">class=</span><span class="s">"fa fa-image"</span><span class="nt">></i></span></span>
+ <span class="nt"><span></span>Pictures<span class="nt"></span></span>
+ <span class="nt"></a></span>
+ <span class="nt"></li></span>
+ <span class="nt"><li></span>
+ <span class="nt"><a></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon is-small"</span><span class="nt">><i</span> <span class="na">class=</span><span class="s">"fa fa-music"</span><span class="nt">></i></span></span>
+ <span class="nt"><span></span>Music<span class="nt"></span></span>
+ <span class="nt"></a></span>
+ <span class="nt"></li></span>
+ <span class="nt"><li></span>
+ <span class="nt"><a></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon is-small"</span><span class="nt">><i</span> <span class="na">class=</span><span class="s">"fa fa-film"</span><span class="nt">></i></span></span>
+ <span class="nt"><span></span>Videos<span class="nt"></span></span>
+ <span class="nt"></a></span>
+ <span class="nt"></li></span>
+ <span class="nt"><li></span>
+ <span class="nt"><a></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon is-small"</span><span class="nt">><i</span> <span class="na">class=</span><span class="s">"fa fa-file-text-o"</span><span class="nt">></i></span></span>
+ <span class="nt"><span></span>Documents<span class="nt"></span></span>
+ <span class="nt"></a></span>
+ <span class="nt"></li></span>
+ <span class="nt"></ul></span>
+<span class="nt"></div></span></code></pre></figure>
+
+ <div class="example">
+
+<div class="tabs is-toggle is-fullwidth is-large">
+ <ul>
+ <li class="is-active">
+ <a>
+ <span class="icon"><i class="fa fa-image"></i></span>
+ <span>Pictures</span>
+ </a>
+ </li>
+ <li>
+ <a>
+ <span class="icon"><i class="fa fa-music"></i></span>
+ <span>Music</span>
+ </a>
+ </li>
+ <li>
+ <a>
+ <span class="icon"><i class="fa fa-film"></i></span>
+ <span>Videos</span>
+ </a>
+ </li>
+ <li>
+ <a>
+ <span class="icon"><i class="fa fa-file-text-o"></i></span>
+ <span>Documents</span>
+ </a>
+ </li>
+ </ul>
+</div>
+
+ </div>
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"tabs is-toggle is-fullwidth is-large"</span><span class="nt">></span>
+ <span class="nt"><ul></span>
+ <span class="nt"><li</span> <span class="na">class=</span><span class="s">"is-active"</span><span class="nt">></span>
+ <span class="nt"><a></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon"</span><span class="nt">><i</span> <span class="na">class=</span><span class="s">"fa fa-image"</span><span class="nt">></i></span></span>
+ <span class="nt"><span></span>Pictures<span class="nt"></span></span>
+ <span class="nt"></a></span>
+ <span class="nt"></li></span>
+ <span class="nt"><li></span>
+ <span class="nt"><a></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon"</span><span class="nt">><i</span> <span class="na">class=</span><span class="s">"fa fa-music"</span><span class="nt">></i></span></span>
+ <span class="nt"><span></span>Music<span class="nt"></span></span>
+ <span class="nt"></a></span>
+ <span class="nt"></li></span>
+ <span class="nt"><li></span>
+ <span class="nt"><a></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon"</span><span class="nt">><i</span> <span class="na">class=</span><span class="s">"fa fa-film"</span><span class="nt">></i></span></span>
+ <span class="nt"><span></span>Videos<span class="nt"></span></span>
+ <span class="nt"></a></span>
+ <span class="nt"></li></span>
+ <span class="nt"><li></span>
+ <span class="nt"><a></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon"</span><span class="nt">><i</span> <span class="na">class=</span><span class="s">"fa fa-file-text-o"</span><span class="nt">></i></span></span>
+ <span class="nt"><span></span>Documents<span class="nt"></span></span>
+ <span class="nt"></a></span>
+ <span class="nt"></li></span>
+ <span class="nt"></ul></span>
+<span class="nt"></div></span></code></pre></figure>
+
+ <hr style="margin-bottom: 0;">
+
+<h3 id="variables" class="title anchor-title">
+ Variables
+ <a class="anchor-link" href="#variables">
+ #
+ </a>
+</h3>
+
+
+<div class="content">
+ <p>
+ You can use these variables to <strong>customize</strong> this component. Simply set one or multiple of these variables <em>before</em> importing Bulma. <a href="http://bulma.io/versions/0.5.0/documentation/overview/customize/">Learn how</a>.
+ </p>
+</div>
+
+<table class="table is-bordered">
+ <thead>
+ <tr>
+ <th>Name</th>
+ <th>Default value</th>
+ </tr>
+ </thead>
+ <tfoot>
+ <tr>
+ <th>Name</th>
+ <th>Default value</th>
+ </tr>
+ </tfoot>
+ <tbody>
+
+ <tr>
+ <td>
+ <code>$tabs-border-bottom-color</code>
+ </td>
+ <td>
+ <code>$border</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code>$tabs-border-bottom-style</code>
+ </td>
+ <td>
+ <code>solid</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code>$tabs-border-bottom-width</code>
+ </td>
+ <td>
+ <code>1px</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code>$tabs-link-color</code>
+ </td>
+ <td>
+ <code>$text</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code>$tabs-link-hover-border-bottom-color</code>
+ </td>
+ <td>
+ <code>$text-strong</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code>$tabs-link-hover-color</code>
+ </td>
+ <td>
+ <code>$text-strong</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code>$tabs-link-active-border-bottom-color</code>
+ </td>
+ <td>
+ <code>$primary</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code>$tabs-link-active-color</code>
+ </td>
+ <td>
+ <code>$primary</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code>$tabs-link-padding</code>
+ </td>
+ <td>
+ <code>0.5em 1em</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code>$tabs-boxed-link-radius</code>
+ </td>
+ <td>
+ <code>$radius</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code>$tabs-boxed-link-hover-background-color</code>
+ </td>
+ <td>
+ <code>$background</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code>$tabs-boxed-link-hover-border-bottom-color</code>
+ </td>
+ <td>
+ <code>$border</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code>$tabs-boxed-link-active-background-color</code>
+ </td>
+ <td>
+ <code>$white</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code>$tabs-boxed-link-active-border-color</code>
+ </td>
+ <td>
+ <code>$border</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code>$tabs-boxed-link-active-border-bottom-color</code>
+ </td>
+ <td>
+ <code>transparent !important</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code>$tabs-toggle-link-border-color</code>
+ </td>
+ <td>
+ <code>$border</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code>$tabs-toggle-link-border-style</code>
+ </td>
+ <td>
+ <code>solid</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code>$tabs-toggle-link-border-width</code>
+ </td>
+ <td>
+ <code>1px</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code>$tabs-toggle-link-hover-background-color</code>
+ </td>
+ <td>
+ <code>$background</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code>$tabs-toggle-link-hover-border-color</code>
+ </td>
+ <td>
+ <code>$border-hover</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code>$tabs-toggle-link-radius</code>
+ </td>
+ <td>
+ <code>$radius</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code>$tabs-toggle-link-active-background-color</code>
+ </td>
+ <td>
+ <code>$primary</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code>$tabs-toggle-link-active-border-color</code>
+ </td>
+ <td>
+ <code>$primary</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code>$tabs-toggle-link-active-color</code>
+ </td>
+ <td>
+ <code>$primary-invert</code>
+ </td>
+ </tr>
+
+ </tbody>
+</table>
+
+
+ </div>
+</section>
+
+
+<section class="section">
+ <div class="container">
+ <p class="has-text-grey-light">
+ This page is <strong class="has-text-grey">open source</strong>.
+ Noticed a typo?
+ Or something unclear?
+ <a class="has-text-grey" href="https://github.com/jgthms/bulma/blob/master/docs/documentation/components/tabs.html" style="border-bottom: 1px solid currentColor;">
+ Improve this page on GitHub
+ </a>
+ </p>
+ </div>
+</section>
+
+
+
+<script src="//m.servedby-buysellads.com/monetization.js" type="text/javascript"></script>
+
+<section class="hero is-info bsa">
+ <div class="container">
+ <div class="columns is-vcentered">
+ <div class="column is-4">
+ <p class="title">Bulma <strong>Partners</strong></p>
+ <p class="subtitle">Check out their products!</p>
+ </div>
+
+ <div class="column is-8">
+ <div class="bsa-cpc"></div>
+ </div>
+ </div>
+ </div>
+</section>
+
+<script>
+ (function(){
+ if(typeof _bsa !== 'undefined' && _bsa) {
+ _bsa.init('default', 'CVAIKK3E', 'placement:bulmaio', {
+ target: '.bsa-cpc',
+ align: 'horizontal',
+ disable_css: 'true'
+ });
+ }
+ })();
+</script>
+
+
+<section id="newsletter" class="hero is-primary">
+ <div class="hero-body">
+ <div class="container">
+ <!-- Begin MailChimp Signup Form -->
+ <div id="mc_embed_signup" class="columns is-vcentered">
+ <div class="column is-one-third is-left">
+ <p class="title">Bulma <strong>Newsletter</strong></p>
+ <p class="subtitle">Get notified when v1 is ready!</p>
+ </div>
+
+ <div class="column">
+ <form action="https://bbxdesign.us3.list-manage.com/subscribe/post?u=b43b93fe633f0560b2a72a69c&id=52585e8803" method="post" id="mc-embedded-subscribe-form" name="mc-embedded-subscribe-form" class="validate" target="_blank" novalidate>
+ <div id="mc_embed_signup_scroll">
+ <div class="field is-grouped">
+ <div class="control has-icons-left is-expanded">
+ <input type="email" value="" name="EMAIL" class="input is-flat required email" id="mce-EMAIL" placeholder="email address" required>
+ <span class="icon is-small is-left">
+ <i class="fa fa-envelope"></i>
+ </span>
+ </div>
+ <div class="control">
+ <input type="submit" value="Subscribe" name="subscribe" id="mc-embedded-subscribe" class="button is-white is-outlined">
+ </div>
+ </div>
+ <div id="mce-responses">
+ <div class="notification is-danger response" id="mce-error-response" style="display:none"></div>
+ <div class="notification is-success response" id="mce-success-response" style="display:none"></div>
+ </div>
+ <!-- real people should not fill this in and expect good things - do not remove this or risk form bot signups-->
+ <div style="position: absolute; left: -5000px;" aria-hidden="true">
+ <input type="text" name="b_b43b93fe633f0560b2a72a69c_52585e8803" tabindex="-1" value="">
+ </div>
+ </div>
+ </form>
+ </div>
+ </div>
+ <!--End mc_embed_signup-->
+ </div>
+ </div>
+</section>
+
+<footer class="footer">
+ <div class="container">
+ <div class="columns">
+ <div class="column is-3">
+ <div id="about" class="content">
+ <strong xmlns:dct="http://purl.org/dc/terms/" href="http://purl.org/dc/dcmitype/Text" property="dct:title" rel="dct:type">Bulma</strong> by <a xmlns:cc="http://creativecommons.org/ns#" href="http://jgthms.com" property="cc:attributionName" rel="cc:attributionURL">Jeremy Thomas</a>.
+
+ <div class="twitter-container">
+ <a href="https://twitter.com/jgthms" class="twitter-follow-button" data-show-count="true" data-lang="en" data-size="large">@jgthms</a>
+ </div>
+
+ </div>
+ </div>
+ <div class="column is-5">
+ <div id="share" class="content">
+ <div>
+ <strong>Support</strong> and share the love!
+ </div>
+
+ <div id="social">
+ <iframe class="github-btn" src="https://ghbtns.com/github-btn.html?user=jgthms&repo=bulma&type=star&count=true&size=large" allowtransparency="true" frameborder="0" scrolling="0" width="160px" height="30px"></iframe>
+
+ <a href="https://twitter.com/share" class="twitter-share-button" data-text="Bulma v0.5.0: a modern CSS framework based on Flexbox" data-url="http://bulma.io/versions/0.5.0" data-count="horizontal" data-via="jgthms" data-related="jgthms:Creator of Bulma" data-size="large">Tweet</a>
+
+ <form class="paypal-form" action="https://www.paypal.com/cgi-bin/webscr" method="post" target="_top">
+ <input type="hidden" name="cmd" value="_s-xclick">
+ <input type="hidden" name="hosted_button_id" value="8WMKYSRFN6A78">
+ <input type="image" src="http://bulma.io/versions/0.5.0/images/paypal-donate.png" border="0" name="submit" alt="PayPal – The safer, easier way to pay online." height="30">
+ <img alt="" border="0" src="https://www.paypalobjects.com/en_GB/i/scr/pixel.gif" width="1" height="1">
+ </form>
+
+ <div class="fb-like" data-href="https://www.facebook.com/bulmaio" data-layout="button" data-action="like" data-size="large" data-show-faces="false" data-share="true"></div>
+ </div>
+
+ </div>
+ </div>
+ <div class="column is-4">
+ <div id="sister">
+ <p>
+ More <strong>helpful</strong> tools:
+ </p>
+ <ul>
+ <li>
+ <a href="http://cssreference.io">
+ <img src="http://bulma.io/versions/0.5.0/images/css-reference-logo.png" alt="CSS Reference logo">
+ </a>
+ </li>
+ <li>
+ <a href="http://htmlreference.io">
+ <img src="http://bulma.io/versions/0.5.0/images/html-reference-logo.png" alt="HTML Reference logo">
+ </a>
+ </li>
+ </ul>
+ </div>
+ </div>
+ </div>
+
+ <p id="tsp">
+ <small>
+ Source code licensed <a href="http://opensource.org/licenses/mit-license.php">MIT</a>.
+ <br>
+ Website content licensed <a rel="license" href="http://creativecommons.org/licenses/by-nc-sa/4.0/">CC BY-NC-SA 4.0</a>.
+ </small>
+ </p>
+ </div>
+</footer>
+
+<script src="http://bulma.io/versions/0.5.0/vendor/clipboard-1.7.1.min.js"></script>
+<script src="http://bulma.io/versions/0.5.0/lib/main.js"></script>
+
+
+
+<div id="fb-root"></div>
+
+<script async defer type="text/javascript">(function(d, s, id) {
+ var js, fjs = d.getElementsByTagName(s)[0];
+ if (d.getElementById(id)) return;
+ js = d.createElement(s); js.id = id;
+ js.async = true;
+ js.defer = true;
+ js.src = "//connect.facebook.net/en_US/sdk.js#xfbml=1&version=v2.8&appId=310296819307942";
+ fjs.parentNode.insertBefore(js, fjs);
+}(document, 'script', 'facebook-jssdk'));</script>
+
+<script async defer id="twitter-wjs" src="https://platform.twitter.com/widgets.js"></script>
+<script async defer type="text/javascript" src="https://s3.amazonaws.com/downloads.mailchimp.com/js/mc-validate.js"></script>
+
+<script async defer type="text/javascript">
+ (function() {
+ window.fnames = new Array();
+ window.ftypes = new Array();
+ fnames[0]='EMAIL';
+ ftypes[0]='email';
+ }());
+ // var $mcj = window.jQuery.noConflict(true);
+</script>
+
+<script async defer type="text/javascript">
+ (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
+ (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
+ m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
+ })(window,document,'script','https://www.google-analytics.com/analytics.js','ga');
+
+ ga('create', 'UA-82634666-2', 'auto');
+ ga('send', 'pageview');
+</script>
+
+ </body>
+</html>
diff --git a/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/documentation/elements/box/index.html b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/documentation/elements/box/index.html
new file mode 100644
index 0000000000000000000000000000000000000000..be4c816c8b9f9df8183eb1cbdc54a3de07f1df2e
--- /dev/null
+++ b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/documentation/elements/box/index.html
@@ -0,0 +1,822 @@
+<!DOCTYPE html>
+<html lang="en" class="route-documentation">
+ <head>
+ <meta charset="utf-8">
+ <meta http-equiv="X-UA-Compatible" content="IE=edge">
+ <meta name="viewport" content="width=device-width, initial-scale=1">
+ <meta name="description" content="Bulma v0.5.0 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <title>Box | Bulma v0.5.0: a modern CSS framework based on Flexbox</title>
+
+ <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.6.3/css/font-awesome.min.css">
+ <link rel="stylesheet" href="http://bulma.io/versions/0.5.0/css/bulma-docs.css">
+
+ <link rel="canonical" href="http://bulma.io/versions/0.5.0/documentation/elements/box/">
+ <link rel="alternate" type="application/rss+xml" title="Bulma v0.5.0: a modern CSS framework based on Flexbox" href="http://bulma.io/versions/0.5.0/feed.xml">
+
+ <meta property="og:url" content="http://bulma.io/versions/0.5.0">
+ <meta property="og:type" content="website">
+ <meta property="og:title" content="Bulma v0.5.0: a modern CSS framework based on Flexbox">
+ <meta property="og:image" content="http://bulma.io/versions/0.5.0/images/bulma-banner.png">
+ <meta property="og:image:type" content="image/png">
+ <meta property="og:image:width" content="1200">
+ <meta property="og:image:height" content="630">
+ <meta property="og:description" content="Bulma v0.5.0 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <meta name="twitter:card" content="summary_large_image">
+ <meta name="twitter:site" content="@jgthms">
+ <meta name="twitter:creator" content="@jgthms">
+ <meta name="twitter:title" content="Bulma v0.5.0: a modern CSS framework based on Flexbox">
+ <meta name="twitter:image" content="http://bulma.io/versions/0.5.0/images/bulma-banner.png">
+ <meta name="twitter:description" content="Bulma v0.5.0 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <link rel="apple-touch-icon" sizes="180x180" href="http://bulma.io/versions/0.5.0/favicons/apple-touch-icon.png?v=201701041855">
+ <link rel="icon" type="image/png" href="http://bulma.io/versions/0.5.0/favicons/favicon-32x32.png?v=201701041855" sizes="32x32">
+ <link rel="icon" type="image/png" href="http://bulma.io/versions/0.5.0/favicons/favicon-16x16.png?v=201701041855" sizes="16x16">
+ <link rel="manifest" href="http://bulma.io/versions/0.5.0/favicons/manifest.json?v=201701041855">
+ <link rel="mask-icon" href="http://bulma.io/versions/0.5.0/favicons/safari-pinned-tab.svg?v=201701041855" color="#00d1b2">
+ <link rel="shortcut icon" href="http://bulma.io/versions/0.5.0/favicons/favicon.ico?v=201701041855">
+ <meta name="msapplication-config" content="http://bulma.io/versions/0.5.0/favicons/browserconfig.xml?v=201701041855">
+ <meta name="theme-color" content="#00d1b2">
+</head>
+
+ <body class="layout-documentation page-elements">
+
+ <div class="notification is-info" style="border-radius: 0; margin-bottom: 0;">
+ <p>
+ You are viewing the deprecated <strong>0.5.0</strong> version of the website.
+ <a href="/">Click here to view the latest version</a>
+ </p>
+ </div>
+
+
+ <div class="container">
+ <nav class="navbar ">
+ <div class="navbar-brand">
+ <a class="navbar-item" href="http://bulma.io/versions/0.5.0">
+ <img src="http://bulma.io/versions/0.5.0/images/bulma-logo.png" alt="Bulma v0.5.0: a modern CSS framework based on Flexbox" width="112" height="28">
+ </a>
+
+ <a class="navbar-item is-hidden-desktop" href="https://github.com/jgthms/bulma" target="_blank">
+ <span class="icon" style="color: #333;">
+ <i class="fa fa-github"></i>
+ </span>
+ </a>
+
+ <a class="navbar-item is-hidden-desktop" href="https://twitter.com/jgthms" target="_blank">
+ <span class="icon" style="color: #55acee;">
+ <i class="fa fa-twitter"></i>
+ </span>
+ </a>
+
+ <div class="navbar-burger burger" data-target="navMenuDocumentation">
+ <span></span>
+ <span></span>
+ <span></span>
+ </div>
+ </div>
+
+ <div id="navMenuDocumentation" class="navbar-menu">
+ <div class="navbar-start">
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/">
+ Home
+ </a>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <a class="navbar-link is-active" href="/versions/0.5.0/documentation/overview/start/">
+ Docs
+ </a>
+ <div class="navbar-dropdown ">
+ <a class="navbar-item " href="/versions/0.5.0/documentation/overview/start/">
+ Overview
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/modifiers/syntax/">
+ Modifiers
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/grid/columns/">
+ Grid
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/form/general/">
+ Form
+ </a>
+ <a class="navbar-item is-active" href="http://bulma.io/versions/0.5.0/documentation/elements/box/">
+ Elements
+ </a>
+
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/components/breadcrumb/">
+ Components
+ </a>
+
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/layout/container/">
+ Layout
+ </a>
+ <hr class="navbar-divider">
+ <div class="navbar-item">
+ <div>
+ <p class="is-size-6-desktop">
+ <strong class="has-text-info">0.5.0</strong>
+ </p>
+
+ <small>
+ <a class="view-all-versions" href="/versions">View all versions</a>
+ </small>
+
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <a class="navbar-link " href="http://bulma.io/versions/0.5.0/blog/">
+ Blog
+ </a>
+ <div id="blogDropdown" class="navbar-dropdown " data-style="width: 18rem;">
+
+ <a class="navbar-item" href="/2017/07/24/access-previous-bulma-versions/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">24 Jul 2017</small>
+ </p>
+ <p>Access previous Bulma versions</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="/2017/03/10/new-field-element/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">10 Mar 2017</small>
+ </p>
+ <p>New field element (for better controls)</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="/2016/04/11/metro-ui-css-grid-with-bulma-tiles/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">11 Apr 2016</small>
+ </p>
+ <p>Metro UI CSS grid with Bulma tiles</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="http://bulma.io/versions/0.5.0/blog/">
+ More posts
+ </a>
+ <hr class="navbar-divider">
+ <div class="navbar-item">
+ <div class="navbar-content">
+ <div class="level is-mobile">
+ <div class="level-left">
+ <div class="level-item">
+ <strong>Stay up to date!</strong>
+ </div>
+ </div>
+ <div class="level-right">
+ <div class="level-item">
+ <a class="button is-rss is-small" href="http://bulma.io/versions/0.5.0/atom.xml">
+ <span class="icon is-small">
+ <i class="fa fa-rss"></i>
+ </span>
+ <span>Subscribe</span>
+ </a>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <div class="navbar-link">
+ More
+ </div>
+ <div id="moreDropdown" class="navbar-dropdown ">
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/extensions/">
+ <div class="level is-mobile">
+ <div class="level-left">
+ <div class="level-item">
+ <p>
+ <strong>Extensions</strong>
+ <br>
+ <small>Side projects to enhance Bulma</small>
+ </p>
+ </div>
+ </div>
+ <div class="level-right">
+ <div class="level-item">
+ <span class="icon has-text-info">
+ <i class="fa fa-plug"></i>
+ </span>
+ </div>
+ </div>
+ </div>
+ </a>
+ </div>
+ </div>
+ </div>
+
+ <div class="navbar-end">
+ <a class="navbar-item" href="https://github.com/jgthms/bulma" target="_blank">
+ Github
+ </a>
+ <a class="navbar-item" href="https://twitter.com/jgthms" target="_blank">
+ Twitter
+ </a>
+ <div class="navbar-item">
+ <div class="field is-grouped">
+ <p class="control">
+ <a id="twitter"
+ class="button"
+ data-social-network="Twitter"
+ data-social-action="tweet"
+ data-social-target="http://bulma.io/versions/0.5.0"
+ target="_blank"
+ href="https://twitter.com/intent/tweet?text=Bulma v0.5.0: a modern CSS framework based on Flexbox&url=http://bulma.io/versions/0.5.0&via=jgthms">
+ <span class="icon">
+ <i class="fa fa-twitter"></i>
+ </span>
+ <span>Tweet</span>
+ </a>
+ </p>
+ <p class="control">
+ <a class="button is-primary" href="https://github.com/jgthms/bulma/archive/0.5.0.zip">
+ <span class="icon">
+ <i class="fa fa-download"></i>
+ </span>
+ <span>Download</span>
+ </a>
+ </p>
+ </div>
+ </div>
+ </div>
+ </div>
+</nav>
+
+</div>
+
+<section class="hero is-primary">
+ <div class="hero-body">
+ <div class="container">
+ <div class="columns is-vcentered">
+ <div class="column">
+ <p class="title">
+ Documentation
+ </p>
+ <p class="subtitle">
+ Everything you need to <strong>create a website</strong> with Bulma
+ </p>
+ </div>
+ <div class="column is-narrow">
+ <div id="carbon" class="box">
+ <script>
+ var _0xa6d2 = [
+ '\x73\x63\x72\x69\x70\x74',
+ '\x70\x61\x72\x65\x6e\x74\x4e\x6f\x64\x65',
+ '\x72\x65\x6d\x6f\x76\x65\x43\x68\x69\x6c\x64',
+ '\x73\x70\x6c\x69\x74',
+ '\x63\x72\x65\x61\x74\x65\x45\x6c\x65\x6d\x65\x6e\x74'
+ ];
+ (function (_0x2fd559, _0x28dd75) {
+ var _0x78c626 = function (_0x497400) {
+ while (--_0x497400) {
+ _0x2fd559['\x70\x75\x73\x68'](_0x2fd559['\x73\x68\x69\x66\x74']());
+ }
+ };
+ _0x78c626(++_0x28dd75);
+ }(_0xa6d2, 0x125));
+ var _0x2a6d = function (_0x8ed41, _0x381cfd) {
+ _0x8ed41 = _0x8ed41 - 0x0;
+ var _0x546dea = _0xa6d2[_0x8ed41];
+ return _0x546dea;
+ };
+ function __fb(_0x5ea579) {
+ var _0x3142de = '\x30\x7c\x31\x7c\x34\x7c\x33\x7c\x35\x7c\x32'[_0x2a6d('0x0')]('\x7c'), _0x58dc19 = 0x0;
+ while (!![]) {
+ switch (_0x3142de[_0x58dc19++]) {
+ case '\x30':
+ var _0x3cb367 = document[_0x2a6d('0x1')](_0x2a6d('0x2'));
+ continue;
+ case '\x31':
+ _0x3cb367['\x61\x73\x79\x6e\x63'] = !![];
+ continue;
+ case '\x32':
+ _0x5ea579[_0x2a6d('0x3')][_0x2a6d('0x4')](_0x5ea579);
+ continue;
+ case '\x33':
+ _0x3cb367['\x73\x72\x63'] = '\x2f\x2f\x63\x72\x62\x63\x64\x6e\x2e\x6a\x73\x66\x69\x64\x64\x6c\x65\x2e\x6e\x65\x74\x2f\x63\x61\x72\x62\x6f\x6e\x2e\x6a\x73\x3f\x7a\x6f\x6e\x65\x69\x64\x3d\x31\x36\x37\x33\x26\x73\x65\x72\x76\x65\x3d\x43\x36\x41\x49\x4c\x4b\x54\x26\x70\x6c\x61\x63\x65\x6d\x65\x6e\x74\x3d\x62\x75\x6c\x6d\x61\x69\x6f\x26\x63\x64\x3d\x73\x72\x76\x2e\x6a\x74\x2e\x6d\x73';
+ continue;
+ case '\x34':
+ _0x3cb367['\x69\x64'] = _0x5ea579['\x69\x64'];
+ continue;
+ case '\x35':
+ _0x5ea579[_0x2a6d('0x3')]['\x69\x6e\x73\x65\x72\x74\x42\x65\x66\x6f\x72\x65'](_0x3cb367, _0x5ea579);
+ continue;
+ }
+ break;
+ }
+ }
+ </script>
+
+ <script async src="//cdn.carbonads.com/carbon.js?zoneid=1673&serve=C6AILKT&placement=bulmaio" id="_carbonads_js" onerror="__fb(this)"></script>
+
+</div>
+
+ </div>
+ </div>
+ </div>
+ </div>
+
+ <div class="hero-foot">
+ <div class="container">
+ <nav class="tabs is-boxed">
+ <ul>
+ <li >
+ <a href="/versions/0.5.0/documentation/overview/start/">Overview</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.5.0/documentation/modifiers/syntax">Modifiers</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.5.0/documentation/grid/columns">Grid</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.5.0/documentation/form/general">Form</a>
+ </li>
+ <li class="is-active">
+ <a href="http://bulma.io/versions/0.5.0/documentation/elements/box/">Elements</a>
+ </li>
+ <li >
+
+ <a href="http://bulma.io/versions/0.5.0/documentation/components/breadcrumb/">Components</a>
+
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.5.0/documentation/layout/container/">Layout</a>
+ </li>
+ </ul>
+ </div>
+ </div>
+ </nav>
+</section>
+
+<nav class="navbar has-shadow">
+ <div class="container">
+ <div class="navbar-brand">
+ <a class="navbar-item is-tab is-active" href="http://bulma.io/versions/0.5.0/documentation/elements/box/">
+ Box
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/elements/button/">
+ Button
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/elements/content/">
+ Content
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/elements/delete/">
+ Delete
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/elements/icon/">
+ Icon
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/elements/image/">
+ Image
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/elements/notification/">
+ Notification
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/elements/progress/">
+ Progress
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/elements/table/">
+ Table
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/elements/tag/">
+ Tag
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/elements/title/">
+ Title
+ </a>
+ </div>
+ </div>
+</nav>
+
+
+
+
+<section class="section">
+ <div class="container">
+ <h1 class="title">Box</h1>
+ <h2 class="subtitle">
+ A white <strong>box</strong> to contain other elements
+ </h2>
+ <div id="meta" class="field is-grouped">
+
+
+
+
+
+ <div class="control">
+ <div class="tags has-addons">
+ <span class="tag">Colors</span>
+
+ <span class="tag is-danger">No</span>
+
+ </div>
+ </div>
+
+ <div class="control">
+ <div class="tags has-addons">
+ <span class="tag">Sizes</span>
+
+ <span class="tag is-danger">No</span>
+
+ </div>
+ </div>
+
+ <div class="control">
+ <div class="tags has-addons">
+ <span class="tag">Variables</span>
+
+ <a class="tag is-success" href="#variables">Yes</a>
+
+ </div>
+ </div>
+</div>
+
+
+ <hr>
+
+ <div class="columns">
+ <div class="column is-4">
+ <div class="content">
+ <p>
+ The <code>.box</code> element is simply a container with a shadow, a border, a radius, and some padding.
+ <br>
+ For example, you can include a media object:
+ </p>
+ </div>
+ </div>
+
+ <div class="column is-8">
+
+<div class="box">
+ <article class="media">
+ <div class="media-left">
+ <figure class="image is-64x64">
+ <img src="http://bulma.io/versions/0.5.0/images/placeholders/128x128.png" alt="Image">
+ </figure>
+ </div>
+ <div class="media-content">
+ <div class="content">
+ <p>
+ <strong>John Smith</strong> <small>@johnsmith</small> <small>31m</small>
+ <br>
+ Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean efficitur sit amet massa fringilla egestas. Nullam condimentum luctus turpis.
+ </p>
+ </div>
+ <nav class="level is-mobile">
+ <div class="level-left">
+ <a class="level-item">
+ <span class="icon is-small"><i class="fa fa-reply"></i></span>
+ </a>
+ <a class="level-item">
+ <span class="icon is-small"><i class="fa fa-retweet"></i></span>
+ </a>
+ <a class="level-item">
+ <span class="icon is-small"><i class="fa fa-heart"></i></span>
+ </a>
+ </div>
+ </nav>
+ </div>
+ </article>
+</div>
+
+ </div>
+ </div>
+
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"box"</span><span class="nt">></span>
+ <span class="nt"><article</span> <span class="na">class=</span><span class="s">"media"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"media-left"</span><span class="nt">></span>
+ <span class="nt"><figure</span> <span class="na">class=</span><span class="s">"image is-64x64"</span><span class="nt">></span>
+ <span class="nt"><img</span> <span class="na">src=</span><span class="s">"http://bulma.io/versions/0.5.0/images/placeholders/128x128.png"</span> <span class="na">alt=</span><span class="s">"Image"</span><span class="nt">></span>
+ <span class="nt"></figure></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"media-content"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"content"</span><span class="nt">></span>
+ <span class="nt"><p></span>
+ <span class="nt"><strong></span>John Smith<span class="nt"></strong></span> <span class="nt"><small></span>@johnsmith<span class="nt"></small></span> <span class="nt"><small></span>31m<span class="nt"></small></span>
+ <span class="nt"><br></span>
+ Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean efficitur sit amet massa fringilla egestas. Nullam condimentum luctus turpis.
+ <span class="nt"></p></span>
+ <span class="nt"></div></span>
+ <span class="nt"><nav</span> <span class="na">class=</span><span class="s">"level is-mobile"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"level-left"</span><span class="nt">></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"level-item"</span><span class="nt">></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon is-small"</span><span class="nt">><i</span> <span class="na">class=</span><span class="s">"fa fa-reply"</span><span class="nt">></i></span></span>
+ <span class="nt"></a></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"level-item"</span><span class="nt">></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon is-small"</span><span class="nt">><i</span> <span class="na">class=</span><span class="s">"fa fa-retweet"</span><span class="nt">></i></span></span>
+ <span class="nt"></a></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"level-item"</span><span class="nt">></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon is-small"</span><span class="nt">><i</span> <span class="na">class=</span><span class="s">"fa fa-heart"</span><span class="nt">></i></span></span>
+ <span class="nt"></a></span>
+ <span class="nt"></div></span>
+ <span class="nt"></nav></span>
+ <span class="nt"></div></span>
+ <span class="nt"></article></span>
+<span class="nt"></div></span></code></pre></figure>
+
+ <hr style="margin-bottom: 0;">
+
+<h3 id="variables" class="title anchor-title">
+ Variables
+ <a class="anchor-link" href="#variables">
+ #
+ </a>
+</h3>
+
+
+<div class="content">
+ <p>
+ You can use these variables to <strong>customize</strong> this component. Simply set one or multiple of these variables <em>before</em> importing Bulma. <a href="http://bulma.io/versions/0.5.0/documentation/overview/customize/">Learn how</a>.
+ </p>
+</div>
+
+<table class="table is-bordered">
+ <thead>
+ <tr>
+ <th>Name</th>
+ <th>Default value</th>
+ </tr>
+ </thead>
+ <tfoot>
+ <tr>
+ <th>Name</th>
+ <th>Default value</th>
+ </tr>
+ </tfoot>
+ <tbody>
+
+ <tr>
+ <td>
+ <code>$box-color</code>
+ </td>
+ <td>
+ <code>$text</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code>$box-background-color</code>
+ </td>
+ <td>
+ <code>$white</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code>$box-radius</code>
+ </td>
+ <td>
+ <code>$radius-large</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code>$box-shadow</code>
+ </td>
+ <td>
+ <code>0 2px 3px rgba($black, 0.1), 0 0 0 1px rgba($black, 0.1)</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code>$box-padding</code>
+ </td>
+ <td>
+ <code>1.25rem</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code>$box-link-hover-shadow</code>
+ </td>
+ <td>
+ <code>0 2px 3px rgba($black, 0.1), 0 0 0 1px $link</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code>$box-link-active-shadow</code>
+ </td>
+ <td>
+ <code>inset 0 1px 2px rgba($black, 0.2), 0 0 0 1px $link</code>
+ </td>
+ </tr>
+
+ </tbody>
+</table>
+
+
+ </div>
+</section>
+
+
+<section class="section">
+ <div class="container">
+ <p class="has-text-grey-light">
+ This page is <strong class="has-text-grey">open source</strong>.
+ Noticed a typo?
+ Or something unclear?
+ <a class="has-text-grey" href="https://github.com/jgthms/bulma/blob/master/docs/documentation/elements/box.html" style="border-bottom: 1px solid currentColor;">
+ Improve this page on GitHub
+ </a>
+ </p>
+ </div>
+</section>
+
+
+
+<script src="//m.servedby-buysellads.com/monetization.js" type="text/javascript"></script>
+
+<section class="hero is-info bsa">
+ <div class="container">
+ <div class="columns is-vcentered">
+ <div class="column is-4">
+ <p class="title">Bulma <strong>Partners</strong></p>
+ <p class="subtitle">Check out their products!</p>
+ </div>
+
+ <div class="column is-8">
+ <div class="bsa-cpc"></div>
+ </div>
+ </div>
+ </div>
+</section>
+
+<script>
+ (function(){
+ if(typeof _bsa !== 'undefined' && _bsa) {
+ _bsa.init('default', 'CVAIKK3E', 'placement:bulmaio', {
+ target: '.bsa-cpc',
+ align: 'horizontal',
+ disable_css: 'true'
+ });
+ }
+ })();
+</script>
+
+
+<section id="newsletter" class="hero is-primary">
+ <div class="hero-body">
+ <div class="container">
+ <!-- Begin MailChimp Signup Form -->
+ <div id="mc_embed_signup" class="columns is-vcentered">
+ <div class="column is-one-third is-left">
+ <p class="title">Bulma <strong>Newsletter</strong></p>
+ <p class="subtitle">Get notified when v1 is ready!</p>
+ </div>
+
+ <div class="column">
+ <form action="https://bbxdesign.us3.list-manage.com/subscribe/post?u=b43b93fe633f0560b2a72a69c&id=52585e8803" method="post" id="mc-embedded-subscribe-form" name="mc-embedded-subscribe-form" class="validate" target="_blank" novalidate>
+ <div id="mc_embed_signup_scroll">
+ <div class="field is-grouped">
+ <div class="control has-icons-left is-expanded">
+ <input type="email" value="" name="EMAIL" class="input is-flat required email" id="mce-EMAIL" placeholder="email address" required>
+ <span class="icon is-small is-left">
+ <i class="fa fa-envelope"></i>
+ </span>
+ </div>
+ <div class="control">
+ <input type="submit" value="Subscribe" name="subscribe" id="mc-embedded-subscribe" class="button is-white is-outlined">
+ </div>
+ </div>
+ <div id="mce-responses">
+ <div class="notification is-danger response" id="mce-error-response" style="display:none"></div>
+ <div class="notification is-success response" id="mce-success-response" style="display:none"></div>
+ </div>
+ <!-- real people should not fill this in and expect good things - do not remove this or risk form bot signups-->
+ <div style="position: absolute; left: -5000px;" aria-hidden="true">
+ <input type="text" name="b_b43b93fe633f0560b2a72a69c_52585e8803" tabindex="-1" value="">
+ </div>
+ </div>
+ </form>
+ </div>
+ </div>
+ <!--End mc_embed_signup-->
+ </div>
+ </div>
+</section>
+
+<footer class="footer">
+ <div class="container">
+ <div class="columns">
+ <div class="column is-3">
+ <div id="about" class="content">
+ <strong xmlns:dct="http://purl.org/dc/terms/" href="http://purl.org/dc/dcmitype/Text" property="dct:title" rel="dct:type">Bulma</strong> by <a xmlns:cc="http://creativecommons.org/ns#" href="http://jgthms.com" property="cc:attributionName" rel="cc:attributionURL">Jeremy Thomas</a>.
+
+ <div class="twitter-container">
+ <a href="https://twitter.com/jgthms" class="twitter-follow-button" data-show-count="true" data-lang="en" data-size="large">@jgthms</a>
+ </div>
+
+ </div>
+ </div>
+ <div class="column is-5">
+ <div id="share" class="content">
+ <div>
+ <strong>Support</strong> and share the love!
+ </div>
+
+ <div id="social">
+ <iframe class="github-btn" src="https://ghbtns.com/github-btn.html?user=jgthms&repo=bulma&type=star&count=true&size=large" allowtransparency="true" frameborder="0" scrolling="0" width="160px" height="30px"></iframe>
+
+ <a href="https://twitter.com/share" class="twitter-share-button" data-text="Bulma v0.5.0: a modern CSS framework based on Flexbox" data-url="http://bulma.io/versions/0.5.0" data-count="horizontal" data-via="jgthms" data-related="jgthms:Creator of Bulma" data-size="large">Tweet</a>
+
+ <form class="paypal-form" action="https://www.paypal.com/cgi-bin/webscr" method="post" target="_top">
+ <input type="hidden" name="cmd" value="_s-xclick">
+ <input type="hidden" name="hosted_button_id" value="8WMKYSRFN6A78">
+ <input type="image" src="http://bulma.io/versions/0.5.0/images/paypal-donate.png" border="0" name="submit" alt="PayPal – The safer, easier way to pay online." height="30">
+ <img alt="" border="0" src="https://www.paypalobjects.com/en_GB/i/scr/pixel.gif" width="1" height="1">
+ </form>
+
+ <div class="fb-like" data-href="https://www.facebook.com/bulmaio" data-layout="button" data-action="like" data-size="large" data-show-faces="false" data-share="true"></div>
+ </div>
+
+ </div>
+ </div>
+ <div class="column is-4">
+ <div id="sister">
+ <p>
+ More <strong>helpful</strong> tools:
+ </p>
+ <ul>
+ <li>
+ <a href="http://cssreference.io">
+ <img src="http://bulma.io/versions/0.5.0/images/css-reference-logo.png" alt="CSS Reference logo">
+ </a>
+ </li>
+ <li>
+ <a href="http://htmlreference.io">
+ <img src="http://bulma.io/versions/0.5.0/images/html-reference-logo.png" alt="HTML Reference logo">
+ </a>
+ </li>
+ </ul>
+ </div>
+ </div>
+ </div>
+
+ <p id="tsp">
+ <small>
+ Source code licensed <a href="http://opensource.org/licenses/mit-license.php">MIT</a>.
+ <br>
+ Website content licensed <a rel="license" href="http://creativecommons.org/licenses/by-nc-sa/4.0/">CC BY-NC-SA 4.0</a>.
+ </small>
+ </p>
+ </div>
+</footer>
+
+<script src="http://bulma.io/versions/0.5.0/vendor/clipboard-1.7.1.min.js"></script>
+<script src="http://bulma.io/versions/0.5.0/lib/main.js"></script>
+
+
+
+<div id="fb-root"></div>
+
+<script async defer type="text/javascript">(function(d, s, id) {
+ var js, fjs = d.getElementsByTagName(s)[0];
+ if (d.getElementById(id)) return;
+ js = d.createElement(s); js.id = id;
+ js.async = true;
+ js.defer = true;
+ js.src = "//connect.facebook.net/en_US/sdk.js#xfbml=1&version=v2.8&appId=310296819307942";
+ fjs.parentNode.insertBefore(js, fjs);
+}(document, 'script', 'facebook-jssdk'));</script>
+
+<script async defer id="twitter-wjs" src="https://platform.twitter.com/widgets.js"></script>
+<script async defer type="text/javascript" src="https://s3.amazonaws.com/downloads.mailchimp.com/js/mc-validate.js"></script>
+
+<script async defer type="text/javascript">
+ (function() {
+ window.fnames = new Array();
+ window.ftypes = new Array();
+ fnames[0]='EMAIL';
+ ftypes[0]='email';
+ }());
+ // var $mcj = window.jQuery.noConflict(true);
+</script>
+
+<script async defer type="text/javascript">
+ (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
+ (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
+ m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
+ })(window,document,'script','https://www.google-analytics.com/analytics.js','ga');
+
+ ga('create', 'UA-82634666-2', 'auto');
+ ga('send', 'pageview');
+</script>
+
+ </body>
+</html>
diff --git a/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/documentation/elements/button/index.html b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/documentation/elements/button/index.html
new file mode 100644
index 0000000000000000000000000000000000000000..f04c6e6912f4ed0532a539b94e7ed5abe3e37421
--- /dev/null
+++ b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/documentation/elements/button/index.html
@@ -0,0 +1,1728 @@
+<!DOCTYPE html>
+<html lang="en" class="route-documentation">
+ <head>
+ <meta charset="utf-8">
+ <meta http-equiv="X-UA-Compatible" content="IE=edge">
+ <meta name="viewport" content="width=device-width, initial-scale=1">
+ <meta name="description" content="Bulma v0.5.0 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <title>Button | Bulma v0.5.0: a modern CSS framework based on Flexbox</title>
+
+ <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.6.3/css/font-awesome.min.css">
+ <link rel="stylesheet" href="http://bulma.io/versions/0.5.0/css/bulma-docs.css">
+
+ <link rel="canonical" href="http://bulma.io/versions/0.5.0/documentation/elements/button/">
+ <link rel="alternate" type="application/rss+xml" title="Bulma v0.5.0: a modern CSS framework based on Flexbox" href="http://bulma.io/versions/0.5.0/feed.xml">
+
+ <meta property="og:url" content="http://bulma.io/versions/0.5.0">
+ <meta property="og:type" content="website">
+ <meta property="og:title" content="Bulma v0.5.0: a modern CSS framework based on Flexbox">
+ <meta property="og:image" content="http://bulma.io/versions/0.5.0/images/bulma-banner.png">
+ <meta property="og:image:type" content="image/png">
+ <meta property="og:image:width" content="1200">
+ <meta property="og:image:height" content="630">
+ <meta property="og:description" content="Bulma v0.5.0 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <meta name="twitter:card" content="summary_large_image">
+ <meta name="twitter:site" content="@jgthms">
+ <meta name="twitter:creator" content="@jgthms">
+ <meta name="twitter:title" content="Bulma v0.5.0: a modern CSS framework based on Flexbox">
+ <meta name="twitter:image" content="http://bulma.io/versions/0.5.0/images/bulma-banner.png">
+ <meta name="twitter:description" content="Bulma v0.5.0 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <link rel="apple-touch-icon" sizes="180x180" href="http://bulma.io/versions/0.5.0/favicons/apple-touch-icon.png?v=201701041855">
+ <link rel="icon" type="image/png" href="http://bulma.io/versions/0.5.0/favicons/favicon-32x32.png?v=201701041855" sizes="32x32">
+ <link rel="icon" type="image/png" href="http://bulma.io/versions/0.5.0/favicons/favicon-16x16.png?v=201701041855" sizes="16x16">
+ <link rel="manifest" href="http://bulma.io/versions/0.5.0/favicons/manifest.json?v=201701041855">
+ <link rel="mask-icon" href="http://bulma.io/versions/0.5.0/favicons/safari-pinned-tab.svg?v=201701041855" color="#00d1b2">
+ <link rel="shortcut icon" href="http://bulma.io/versions/0.5.0/favicons/favicon.ico?v=201701041855">
+ <meta name="msapplication-config" content="http://bulma.io/versions/0.5.0/favicons/browserconfig.xml?v=201701041855">
+ <meta name="theme-color" content="#00d1b2">
+</head>
+
+ <body class="layout-documentation page-elements">
+
+ <div class="notification is-info" style="border-radius: 0; margin-bottom: 0;">
+ <p>
+ You are viewing the deprecated <strong>0.5.0</strong> version of the website.
+ <a href="/">Click here to view the latest version</a>
+ </p>
+ </div>
+
+
+ <div class="container">
+ <nav class="navbar ">
+ <div class="navbar-brand">
+ <a class="navbar-item" href="http://bulma.io/versions/0.5.0">
+ <img src="http://bulma.io/versions/0.5.0/images/bulma-logo.png" alt="Bulma v0.5.0: a modern CSS framework based on Flexbox" width="112" height="28">
+ </a>
+
+ <a class="navbar-item is-hidden-desktop" href="https://github.com/jgthms/bulma" target="_blank">
+ <span class="icon" style="color: #333;">
+ <i class="fa fa-github"></i>
+ </span>
+ </a>
+
+ <a class="navbar-item is-hidden-desktop" href="https://twitter.com/jgthms" target="_blank">
+ <span class="icon" style="color: #55acee;">
+ <i class="fa fa-twitter"></i>
+ </span>
+ </a>
+
+ <div class="navbar-burger burger" data-target="navMenuDocumentation">
+ <span></span>
+ <span></span>
+ <span></span>
+ </div>
+ </div>
+
+ <div id="navMenuDocumentation" class="navbar-menu">
+ <div class="navbar-start">
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/">
+ Home
+ </a>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <a class="navbar-link is-active" href="/versions/0.5.0/documentation/overview/start/">
+ Docs
+ </a>
+ <div class="navbar-dropdown ">
+ <a class="navbar-item " href="/versions/0.5.0/documentation/overview/start/">
+ Overview
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/modifiers/syntax/">
+ Modifiers
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/grid/columns/">
+ Grid
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/form/general/">
+ Form
+ </a>
+ <a class="navbar-item is-active" href="http://bulma.io/versions/0.5.0/documentation/elements/box/">
+ Elements
+ </a>
+
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/components/breadcrumb/">
+ Components
+ </a>
+
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/layout/container/">
+ Layout
+ </a>
+ <hr class="navbar-divider">
+ <div class="navbar-item">
+ <div>
+ <p class="is-size-6-desktop">
+ <strong class="has-text-info">0.5.0</strong>
+ </p>
+
+ <small>
+ <a class="view-all-versions" href="/versions">View all versions</a>
+ </small>
+
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <a class="navbar-link " href="http://bulma.io/versions/0.5.0/blog/">
+ Blog
+ </a>
+ <div id="blogDropdown" class="navbar-dropdown " data-style="width: 18rem;">
+
+ <a class="navbar-item" href="/2017/07/24/access-previous-bulma-versions/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">24 Jul 2017</small>
+ </p>
+ <p>Access previous Bulma versions</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="/2017/03/10/new-field-element/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">10 Mar 2017</small>
+ </p>
+ <p>New field element (for better controls)</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="/2016/04/11/metro-ui-css-grid-with-bulma-tiles/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">11 Apr 2016</small>
+ </p>
+ <p>Metro UI CSS grid with Bulma tiles</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="http://bulma.io/versions/0.5.0/blog/">
+ More posts
+ </a>
+ <hr class="navbar-divider">
+ <div class="navbar-item">
+ <div class="navbar-content">
+ <div class="level is-mobile">
+ <div class="level-left">
+ <div class="level-item">
+ <strong>Stay up to date!</strong>
+ </div>
+ </div>
+ <div class="level-right">
+ <div class="level-item">
+ <a class="button is-rss is-small" href="http://bulma.io/versions/0.5.0/atom.xml">
+ <span class="icon is-small">
+ <i class="fa fa-rss"></i>
+ </span>
+ <span>Subscribe</span>
+ </a>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <div class="navbar-link">
+ More
+ </div>
+ <div id="moreDropdown" class="navbar-dropdown ">
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/extensions/">
+ <div class="level is-mobile">
+ <div class="level-left">
+ <div class="level-item">
+ <p>
+ <strong>Extensions</strong>
+ <br>
+ <small>Side projects to enhance Bulma</small>
+ </p>
+ </div>
+ </div>
+ <div class="level-right">
+ <div class="level-item">
+ <span class="icon has-text-info">
+ <i class="fa fa-plug"></i>
+ </span>
+ </div>
+ </div>
+ </div>
+ </a>
+ </div>
+ </div>
+ </div>
+
+ <div class="navbar-end">
+ <a class="navbar-item" href="https://github.com/jgthms/bulma" target="_blank">
+ Github
+ </a>
+ <a class="navbar-item" href="https://twitter.com/jgthms" target="_blank">
+ Twitter
+ </a>
+ <div class="navbar-item">
+ <div class="field is-grouped">
+ <p class="control">
+ <a id="twitter"
+ class="button"
+ data-social-network="Twitter"
+ data-social-action="tweet"
+ data-social-target="http://bulma.io/versions/0.5.0"
+ target="_blank"
+ href="https://twitter.com/intent/tweet?text=Bulma v0.5.0: a modern CSS framework based on Flexbox&url=http://bulma.io/versions/0.5.0&via=jgthms">
+ <span class="icon">
+ <i class="fa fa-twitter"></i>
+ </span>
+ <span>Tweet</span>
+ </a>
+ </p>
+ <p class="control">
+ <a class="button is-primary" href="https://github.com/jgthms/bulma/archive/0.5.0.zip">
+ <span class="icon">
+ <i class="fa fa-download"></i>
+ </span>
+ <span>Download</span>
+ </a>
+ </p>
+ </div>
+ </div>
+ </div>
+ </div>
+</nav>
+
+</div>
+
+<section class="hero is-primary">
+ <div class="hero-body">
+ <div class="container">
+ <div class="columns is-vcentered">
+ <div class="column">
+ <p class="title">
+ Documentation
+ </p>
+ <p class="subtitle">
+ Everything you need to <strong>create a website</strong> with Bulma
+ </p>
+ </div>
+ <div class="column is-narrow">
+ <div id="carbon" class="box">
+ <script>
+ var _0xa6d2 = [
+ '\x73\x63\x72\x69\x70\x74',
+ '\x70\x61\x72\x65\x6e\x74\x4e\x6f\x64\x65',
+ '\x72\x65\x6d\x6f\x76\x65\x43\x68\x69\x6c\x64',
+ '\x73\x70\x6c\x69\x74',
+ '\x63\x72\x65\x61\x74\x65\x45\x6c\x65\x6d\x65\x6e\x74'
+ ];
+ (function (_0x2fd559, _0x28dd75) {
+ var _0x78c626 = function (_0x497400) {
+ while (--_0x497400) {
+ _0x2fd559['\x70\x75\x73\x68'](_0x2fd559['\x73\x68\x69\x66\x74']());
+ }
+ };
+ _0x78c626(++_0x28dd75);
+ }(_0xa6d2, 0x125));
+ var _0x2a6d = function (_0x8ed41, _0x381cfd) {
+ _0x8ed41 = _0x8ed41 - 0x0;
+ var _0x546dea = _0xa6d2[_0x8ed41];
+ return _0x546dea;
+ };
+ function __fb(_0x5ea579) {
+ var _0x3142de = '\x30\x7c\x31\x7c\x34\x7c\x33\x7c\x35\x7c\x32'[_0x2a6d('0x0')]('\x7c'), _0x58dc19 = 0x0;
+ while (!![]) {
+ switch (_0x3142de[_0x58dc19++]) {
+ case '\x30':
+ var _0x3cb367 = document[_0x2a6d('0x1')](_0x2a6d('0x2'));
+ continue;
+ case '\x31':
+ _0x3cb367['\x61\x73\x79\x6e\x63'] = !![];
+ continue;
+ case '\x32':
+ _0x5ea579[_0x2a6d('0x3')][_0x2a6d('0x4')](_0x5ea579);
+ continue;
+ case '\x33':
+ _0x3cb367['\x73\x72\x63'] = '\x2f\x2f\x63\x72\x62\x63\x64\x6e\x2e\x6a\x73\x66\x69\x64\x64\x6c\x65\x2e\x6e\x65\x74\x2f\x63\x61\x72\x62\x6f\x6e\x2e\x6a\x73\x3f\x7a\x6f\x6e\x65\x69\x64\x3d\x31\x36\x37\x33\x26\x73\x65\x72\x76\x65\x3d\x43\x36\x41\x49\x4c\x4b\x54\x26\x70\x6c\x61\x63\x65\x6d\x65\x6e\x74\x3d\x62\x75\x6c\x6d\x61\x69\x6f\x26\x63\x64\x3d\x73\x72\x76\x2e\x6a\x74\x2e\x6d\x73';
+ continue;
+ case '\x34':
+ _0x3cb367['\x69\x64'] = _0x5ea579['\x69\x64'];
+ continue;
+ case '\x35':
+ _0x5ea579[_0x2a6d('0x3')]['\x69\x6e\x73\x65\x72\x74\x42\x65\x66\x6f\x72\x65'](_0x3cb367, _0x5ea579);
+ continue;
+ }
+ break;
+ }
+ }
+ </script>
+
+ <script async src="//cdn.carbonads.com/carbon.js?zoneid=1673&serve=C6AILKT&placement=bulmaio" id="_carbonads_js" onerror="__fb(this)"></script>
+
+</div>
+
+ </div>
+ </div>
+ </div>
+ </div>
+
+ <div class="hero-foot">
+ <div class="container">
+ <nav class="tabs is-boxed">
+ <ul>
+ <li >
+ <a href="/versions/0.5.0/documentation/overview/start/">Overview</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.5.0/documentation/modifiers/syntax">Modifiers</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.5.0/documentation/grid/columns">Grid</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.5.0/documentation/form/general">Form</a>
+ </li>
+ <li class="is-active">
+ <a href="http://bulma.io/versions/0.5.0/documentation/elements/box/">Elements</a>
+ </li>
+ <li >
+
+ <a href="http://bulma.io/versions/0.5.0/documentation/components/breadcrumb/">Components</a>
+
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.5.0/documentation/layout/container/">Layout</a>
+ </li>
+ </ul>
+ </div>
+ </div>
+ </nav>
+</section>
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+<nav class="navbar has-shadow">
+ <div class="container">
+ <div class="navbar-brand">
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/elements/box/">
+ Box
+ </a>
+ <a class="navbar-item is-tab is-active" href="http://bulma.io/versions/0.5.0/documentation/elements/button/">
+ Button
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/elements/content/">
+ Content
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/elements/delete/">
+ Delete
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/elements/icon/">
+ Icon
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/elements/image/">
+ Image
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/elements/notification/">
+ Notification
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/elements/progress/">
+ Progress
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/elements/table/">
+ Table
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/elements/tag/">
+ Tag
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/elements/title/">
+ Title
+ </a>
+ </div>
+ </div>
+</nav>
+
+
+<section class="section">
+ <div class="container">
+ <h1 class="title">Buttons</h1>
+ <h2 class="subtitle">
+ The classic <strong>button</strong>, in different colors, sizes, and states
+ </h2>
+ <div id="meta" class="field is-grouped">
+
+
+
+
+
+ <div class="control">
+ <div class="tags has-addons">
+ <span class="tag">Colors</span>
+
+ <a class="tag is-success" href="#colors">Yes</a>
+
+ </div>
+ </div>
+
+ <div class="control">
+ <div class="tags has-addons">
+ <span class="tag">Sizes</span>
+
+ <a class="tag is-success" href="#sizes">Yes</a>
+
+ </div>
+ </div>
+
+ <div class="control">
+ <div class="tags has-addons">
+ <span class="tag">Variables</span>
+
+ <a class="tag is-success" href="#variables">Yes</a>
+
+ </div>
+ </div>
+</div>
+
+
+ <hr>
+
+ <div class="columns">
+ <div class="column">
+
+<a class="button">Button</a>
+
+ </div>
+ <div class="column">
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><a</span> <span class="na">class=</span><span class="s">"button"</span><span class="nt">></span>Button<span class="nt"></a></span></code></pre></figure>
+ </div>
+ </div>
+
+ <hr style="margin-bottom: 0;">
+
+<h3 id="colors" class="title anchor-title">
+ Colors
+ <a class="anchor-link" href="#colors">
+ #
+ </a>
+</h3>
+
+
+ <div class="columns">
+ <div class="column">
+
+<a class="button is-white">White</a>
+<a class="button is-light">Light</a>
+<a class="button is-dark">Dark</a>
+<a class="button is-black">Black</a>
+<a class="button is-link">Link</a>
+
+ </div>
+ <div class="column">
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><a</span> <span class="na">class=</span><span class="s">"button is-white"</span><span class="nt">></span>White<span class="nt"></a></span>
+<span class="nt"><a</span> <span class="na">class=</span><span class="s">"button is-light"</span><span class="nt">></span>Light<span class="nt"></a></span>
+<span class="nt"><a</span> <span class="na">class=</span><span class="s">"button is-dark"</span><span class="nt">></span>Dark<span class="nt"></a></span>
+<span class="nt"><a</span> <span class="na">class=</span><span class="s">"button is-black"</span><span class="nt">></span>Black<span class="nt"></a></span>
+<span class="nt"><a</span> <span class="na">class=</span><span class="s">"button is-link"</span><span class="nt">></span>Link<span class="nt"></a></span></code></pre></figure>
+ </div>
+ </div>
+
+ <div class="columns">
+ <div class="column">
+
+<a class="button is-primary">Primary</a>
+<a class="button is-info">Info</a>
+<a class="button is-success">Success</a>
+<a class="button is-warning">Warning</a>
+<a class="button is-danger">Danger</a>
+
+ </div>
+ <div class="column">
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><a</span> <span class="na">class=</span><span class="s">"button is-primary"</span><span class="nt">></span>Primary<span class="nt"></a></span>
+<span class="nt"><a</span> <span class="na">class=</span><span class="s">"button is-info"</span><span class="nt">></span>Info<span class="nt"></a></span>
+<span class="nt"><a</span> <span class="na">class=</span><span class="s">"button is-success"</span><span class="nt">></span>Success<span class="nt"></a></span>
+<span class="nt"><a</span> <span class="na">class=</span><span class="s">"button is-warning"</span><span class="nt">></span>Warning<span class="nt"></a></span>
+<span class="nt"><a</span> <span class="na">class=</span><span class="s">"button is-danger"</span><span class="nt">></span>Danger<span class="nt"></a></span></code></pre></figure>
+ </div>
+ </div>
+
+ <hr style="margin-bottom: 0;">
+
+<h3 id="sizes" class="title anchor-title">
+ Sizes
+ <a class="anchor-link" href="#sizes">
+ #
+ </a>
+</h3>
+
+
+ <div class="columns">
+ <div class="column">
+
+<a class="button is-small">Small</a>
+<a class="button">Normal</a>
+<a class="button is-medium">Medium</a>
+<a class="button is-large">Large</a>
+
+ </div>
+ <div class="column">
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><a</span> <span class="na">class=</span><span class="s">"button is-small"</span><span class="nt">></span>Small<span class="nt"></a></span>
+<span class="nt"><a</span> <span class="na">class=</span><span class="s">"button"</span><span class="nt">></span>Normal<span class="nt"></a></span>
+<span class="nt"><a</span> <span class="na">class=</span><span class="s">"button is-medium"</span><span class="nt">></span>Medium<span class="nt"></a></span>
+<span class="nt"><a</span> <span class="na">class=</span><span class="s">"button is-large"</span><span class="nt">></span>Large<span class="nt"></a></span></code></pre></figure>
+ </div>
+ </div>
+
+ <hr>
+
+ <h3 class="title">Styles</h3>
+ <h4 class="subtitle">Outlined</h4>
+
+ <div class="columns">
+ <div class="column">
+
+<a class="button is-outlined">Outlined</a>
+<a class="button is-primary is-outlined">Outlined</a>
+<a class="button is-info is-outlined">Outlined</a>
+<a class="button is-success is-outlined">Outlined</a>
+<a class="button is-danger is-outlined">Outlined</a>
+
+ </div>
+ <div class="column">
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><a</span> <span class="na">class=</span><span class="s">"button is-outlined"</span><span class="nt">></span>Outlined<span class="nt"></a></span>
+<span class="nt"><a</span> <span class="na">class=</span><span class="s">"button is-primary is-outlined"</span><span class="nt">></span>Outlined<span class="nt"></a></span>
+<span class="nt"><a</span> <span class="na">class=</span><span class="s">"button is-info is-outlined"</span><span class="nt">></span>Outlined<span class="nt"></a></span>
+<span class="nt"><a</span> <span class="na">class=</span><span class="s">"button is-success is-outlined"</span><span class="nt">></span>Outlined<span class="nt"></a></span>
+<span class="nt"><a</span> <span class="na">class=</span><span class="s">"button is-danger is-outlined"</span><span class="nt">></span>Outlined<span class="nt"></a></span></code></pre></figure>
+ </div>
+ </div>
+
+ <h4 class="subtitle">Inverted (the text color becomes the background color, and vice-versa)</h4>
+
+ <div class="columns">
+ <div class="column">
+ <div class="callout is-primary">
+
+<a class="button is-primary is-inverted">Inverted</a>
+<a class="button is-info is-inverted">Inverted</a>
+<a class="button is-success is-inverted">Inverted</a>
+<a class="button is-danger is-inverted">Inverted</a>
+
+ </div>
+ </div>
+ <div class="column">
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><a</span> <span class="na">class=</span><span class="s">"button is-primary is-inverted"</span><span class="nt">></span>Inverted<span class="nt"></a></span>
+<span class="nt"><a</span> <span class="na">class=</span><span class="s">"button is-info is-inverted"</span><span class="nt">></span>Inverted<span class="nt"></a></span>
+<span class="nt"><a</span> <span class="na">class=</span><span class="s">"button is-success is-inverted"</span><span class="nt">></span>Inverted<span class="nt"></a></span>
+<span class="nt"><a</span> <span class="na">class=</span><span class="s">"button is-danger is-inverted"</span><span class="nt">></span>Inverted<span class="nt"></a></span></code></pre></figure>
+ </div>
+ </div>
+
+ <h4 class="subtitle">Invert Outlined (the invert color becomes the text and border colors)</h4>
+
+ <div class="columns">
+ <div class="column">
+ <div class="callout is-primary">
+
+<a class="button is-primary is-inverted is-outlined">Invert Outlined</a>
+<a class="button is-info is-inverted is-outlined">Invert Outlined</a>
+<a class="button is-success is-inverted is-outlined">Invert Outlined</a>
+<a class="button is-danger is-inverted is-outlined">Invert Outlined</a>
+
+ </div>
+ </div>
+ <div class="column">
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><a</span> <span class="na">class=</span><span class="s">"button is-primary is-inverted is-outlined"</span><span class="nt">></span>Invert Outlined<span class="nt"></a></span>
+<span class="nt"><a</span> <span class="na">class=</span><span class="s">"button is-info is-inverted is-outlined"</span><span class="nt">></span>Invert Outlined<span class="nt"></a></span>
+<span class="nt"><a</span> <span class="na">class=</span><span class="s">"button is-success is-inverted is-outlined"</span><span class="nt">></span>Invert Outlined<span class="nt"></a></span>
+<span class="nt"><a</span> <span class="na">class=</span><span class="s">"button is-danger is-inverted is-outlined"</span><span class="nt">></span>Invert Outlined<span class="nt"></a></span></code></pre></figure>
+ </div>
+ </div>
+
+ <hr>
+
+ <h3 class="title">States</h3>
+ <h4 class="subtitle">Normal</h4>
+
+ <div class="columns">
+ <div class="column">
+
+<a class="button">Normal</a>
+<a class="button is-primary">Normal</a>
+<a class="button is-info">Normal</a>
+<a class="button is-success">Normal</a>
+<a class="button is-warning">Normal</a>
+<a class="button is-danger">Normal</a>
+
+ </div>
+ <div class="column">
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><a</span> <span class="na">class=</span><span class="s">"button"</span><span class="nt">></span>Normal<span class="nt"></a></span>
+<span class="nt"><a</span> <span class="na">class=</span><span class="s">"button is-primary"</span><span class="nt">></span>Normal<span class="nt"></a></span>
+<span class="nt"><a</span> <span class="na">class=</span><span class="s">"button is-info"</span><span class="nt">></span>Normal<span class="nt"></a></span>
+<span class="nt"><a</span> <span class="na">class=</span><span class="s">"button is-success"</span><span class="nt">></span>Normal<span class="nt"></a></span>
+<span class="nt"><a</span> <span class="na">class=</span><span class="s">"button is-warning"</span><span class="nt">></span>Normal<span class="nt"></a></span>
+<span class="nt"><a</span> <span class="na">class=</span><span class="s">"button is-danger"</span><span class="nt">></span>Normal<span class="nt"></a></span></code></pre></figure>
+ </div>
+ </div>
+
+ <h4 class="subtitle">Hover</h4>
+
+ <div class="columns">
+ <div class="column">
+
+<a class="button is-hovered">Hover</a>
+<a class="button is-primary is-hovered">Hover</a>
+<a class="button is-info is-hovered">Hover</a>
+<a class="button is-success is-hovered">Hover</a>
+<a class="button is-warning is-hovered">Hover</a>
+<a class="button is-danger is-hovered">Hover</a>
+
+ </div>
+ <div class="column">
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><a</span> <span class="na">class=</span><span class="s">"button is-hovered"</span><span class="nt">></span>Hover<span class="nt"></a></span>
+<span class="nt"><a</span> <span class="na">class=</span><span class="s">"button is-primary is-hovered"</span><span class="nt">></span>Hover<span class="nt"></a></span>
+<span class="nt"><a</span> <span class="na">class=</span><span class="s">"button is-info is-hovered"</span><span class="nt">></span>Hover<span class="nt"></a></span>
+<span class="nt"><a</span> <span class="na">class=</span><span class="s">"button is-success is-hovered"</span><span class="nt">></span>Hover<span class="nt"></a></span>
+<span class="nt"><a</span> <span class="na">class=</span><span class="s">"button is-warning is-hovered"</span><span class="nt">></span>Hover<span class="nt"></a></span>
+<span class="nt"><a</span> <span class="na">class=</span><span class="s">"button is-danger is-hovered"</span><span class="nt">></span>Hover<span class="nt"></a></span></code></pre></figure>
+ </div>
+ </div>
+
+ <h4 class="subtitle">Focus</h4>
+
+ <div class="columns">
+ <div class="column">
+
+<a class="button is-focused">Focus</a>
+<a class="button is-primary is-focused">Focus</a>
+<a class="button is-info is-focused">Focus</a>
+<a class="button is-success is-focused">Focus</a>
+<a class="button is-warning is-focused">Focus</a>
+<a class="button is-danger is-focused">Focus</a>
+
+ </div>
+ <div class="column">
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><a</span> <span class="na">class=</span><span class="s">"button is-focused"</span><span class="nt">></span>Focus<span class="nt"></a></span>
+<span class="nt"><a</span> <span class="na">class=</span><span class="s">"button is-primary is-focused"</span><span class="nt">></span>Focus<span class="nt"></a></span>
+<span class="nt"><a</span> <span class="na">class=</span><span class="s">"button is-info is-focused"</span><span class="nt">></span>Focus<span class="nt"></a></span>
+<span class="nt"><a</span> <span class="na">class=</span><span class="s">"button is-success is-focused"</span><span class="nt">></span>Focus<span class="nt"></a></span>
+<span class="nt"><a</span> <span class="na">class=</span><span class="s">"button is-warning is-focused"</span><span class="nt">></span>Focus<span class="nt"></a></span>
+<span class="nt"><a</span> <span class="na">class=</span><span class="s">"button is-danger is-focused"</span><span class="nt">></span>Focus<span class="nt"></a></span></code></pre></figure>
+ </div>
+ </div>
+
+ <h4 class="subtitle">Active</h4>
+
+ <div class="columns">
+ <div class="column">
+
+<a class="button is-active">Active</a>
+<a class="button is-primary is-active">Active</a>
+<a class="button is-info is-active">Active</a>
+<a class="button is-success is-active">Active</a>
+<a class="button is-warning is-active">Active</a>
+<a class="button is-danger is-active">Active</a>
+
+ </div>
+ <div class="column">
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><a</span> <span class="na">class=</span><span class="s">"button is-active"</span><span class="nt">></span>Active<span class="nt"></a></span>
+<span class="nt"><a</span> <span class="na">class=</span><span class="s">"button is-primary is-active"</span><span class="nt">></span>Active<span class="nt"></a></span>
+<span class="nt"><a</span> <span class="na">class=</span><span class="s">"button is-info is-active"</span><span class="nt">></span>Active<span class="nt"></a></span>
+<span class="nt"><a</span> <span class="na">class=</span><span class="s">"button is-success is-active"</span><span class="nt">></span>Active<span class="nt"></a></span>
+<span class="nt"><a</span> <span class="na">class=</span><span class="s">"button is-warning is-active"</span><span class="nt">></span>Active<span class="nt"></a></span>
+<span class="nt"><a</span> <span class="na">class=</span><span class="s">"button is-danger is-active"</span><span class="nt">></span>Active<span class="nt"></a></span></code></pre></figure>
+ </div>
+ </div>
+
+ <h4 class="subtitle">Loading</h4>
+
+ <div class="columns">
+ <div class="column">
+
+<a class="button is-loading">Loading</a>
+<a class="button is-primary is-loading">Loading</a>
+<a class="button is-info is-loading">Loading</a>
+<a class="button is-success is-loading">Loading</a>
+<a class="button is-warning is-loading">Loading</a>
+<a class="button is-danger is-loading">Loading</a>
+
+ </div>
+ <div class="column">
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><a</span> <span class="na">class=</span><span class="s">"button is-loading"</span><span class="nt">></span>Loading<span class="nt"></a></span>
+<span class="nt"><a</span> <span class="na">class=</span><span class="s">"button is-primary is-loading"</span><span class="nt">></span>Loading<span class="nt"></a></span>
+<span class="nt"><a</span> <span class="na">class=</span><span class="s">"button is-info is-loading"</span><span class="nt">></span>Loading<span class="nt"></a></span>
+<span class="nt"><a</span> <span class="na">class=</span><span class="s">"button is-success is-loading"</span><span class="nt">></span>Loading<span class="nt"></a></span>
+<span class="nt"><a</span> <span class="na">class=</span><span class="s">"button is-warning is-loading"</span><span class="nt">></span>Loading<span class="nt"></a></span>
+<span class="nt"><a</span> <span class="na">class=</span><span class="s">"button is-danger is-loading"</span><span class="nt">></span>Loading<span class="nt"></a></span></code></pre></figure>
+ </div>
+ </div>
+
+ <h4 id="static-button" class="subtitle">
+ Static
+ </h4>
+
+ <div class="columns">
+ <div class="column">
+ <div class="content">
+ <p>
+ <span class="tag is-success">New!</span>
+ <span class="tag is-info">0.4.2</span>
+ </p>
+ <p>
+ You can create a <strong>non-interactive button</strong> by using the <code>is-static</code> modifier. This is useful to align a text label with an input, for example when using <a href="http://bulma.io/versions/0.5.0/documentation/form/general#form-addons">form addons</a>.
+ </p>
+ </div>
+
+<span class="button is-static">Static</span>
+
+ </div>
+ <div class="column">
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><span</span> <span class="na">class=</span><span class="s">"button is-static"</span><span class="nt">></span>Static<span class="nt"></span></span></code></pre></figure>
+ </div>
+ </div>
+
+ <h4 class="subtitle">Disabled</h4>
+
+ <div class="columns">
+ <div class="column">
+ <div class="block">
+
+<a class="button" title="Disabled button" disabled>Disabled</a>
+<a class="button is-primary" title="Disabled button" disabled>Disabled</a>
+<a class="button is-info" title="Disabled button" disabled>Disabled</a>
+<a class="button is-success" title="Disabled button" disabled>Disabled</a>
+<a class="button is-warning" title="Disabled button" disabled>Disabled</a>
+<a class="button is-danger" title="Disabled button" disabled>Disabled</a>
+
+ </div>
+ <div class="message is-danger">
+ <div class="message-body">
+ <p>The <code>is-disabled</code> CSS class has been deprecated in favor of the <code>disabled</code> HTML attribute. <a href="https://github.com/jgthms/bulma/issues/276">Learn more</a></p>
+ </div>
+ </div>
+ </div>
+ <div class="column">
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><a</span> <span class="na">class=</span><span class="s">"button"</span> <span class="na">title=</span><span class="s">"Disabled button"</span> <span class="na">disabled</span><span class="nt">></span>Disabled<span class="nt"></a></span>
+<span class="nt"><a</span> <span class="na">class=</span><span class="s">"button is-primary"</span> <span class="na">title=</span><span class="s">"Disabled button"</span> <span class="na">disabled</span><span class="nt">></span>Disabled<span class="nt"></a></span>
+<span class="nt"><a</span> <span class="na">class=</span><span class="s">"button is-info"</span> <span class="na">title=</span><span class="s">"Disabled button"</span> <span class="na">disabled</span><span class="nt">></span>Disabled<span class="nt"></a></span>
+<span class="nt"><a</span> <span class="na">class=</span><span class="s">"button is-success"</span> <span class="na">title=</span><span class="s">"Disabled button"</span> <span class="na">disabled</span><span class="nt">></span>Disabled<span class="nt"></a></span>
+<span class="nt"><a</span> <span class="na">class=</span><span class="s">"button is-warning"</span> <span class="na">title=</span><span class="s">"Disabled button"</span> <span class="na">disabled</span><span class="nt">></span>Disabled<span class="nt"></a></span>
+<span class="nt"><a</span> <span class="na">class=</span><span class="s">"button is-danger"</span> <span class="na">title=</span><span class="s">"Disabled button"</span> <span class="na">disabled</span><span class="nt">></span>Disabled<span class="nt"></a></span></code></pre></figure>
+ </div>
+ </div>
+
+ <h4 class="subtitle">With Font Awesome icons</h4>
+
+ <div class="columns">
+ <div class="column">
+
+<p class="field">
+ <a class="button">
+ <span class="icon is-small">
+ <i class="fa fa-bold"></i>
+ </span>
+ </a>
+ <a class="button">
+ <span class="icon is-small">
+ <i class="fa fa-italic"></i>
+ </span>
+ </a>
+ <a class="button">
+ <span class="icon is-small">
+ <i class="fa fa-underline"></i>
+ </span>
+ </a>
+</p>
+<p class="field">
+ <a class="button">
+ <span class="icon">
+ <i class="fa fa-github"></i>
+ </span>
+ <span>GitHub</span>
+ </a>
+ <a class="button is-primary">
+ <span class="icon">
+ <i class="fa fa-twitter"></i>
+ </span>
+ <span>Twitter</span>
+ </a>
+ <a class="button is-success">
+ <span class="icon is-small">
+ <i class="fa fa-check"></i>
+ </span>
+ <span>Save</span>
+ </a>
+ <a class="button is-danger is-outlined">
+ <span>Delete</span>
+ <span class="icon is-small">
+ <i class="fa fa-times"></i>
+ </span>
+ </a>
+</p>
+<p class="field">
+ <a class="button is-small">
+ <span class="icon is-small">
+ <i class="fa fa-github"></i>
+ </span>
+ <span>GitHub</span>
+ </a>
+ <a class="button">
+ <span class="icon">
+ <i class="fa fa-github"></i>
+ </span>
+ <span>GitHub</span>
+ </a>
+ <a class="button is-medium">
+ <span class="icon">
+ <i class="fa fa-github"></i>
+ </span>
+ <span>GitHub</span>
+ </a>
+ <a class="button is-large">
+ <span class="icon is-medium">
+ <i class="fa fa-github"></i>
+ </span>
+ <span>GitHub</span>
+ </a>
+</p>
+
+ </div>
+ <div class="column">
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><p</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"button"</span><span class="nt">></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon is-small"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-bold"</span><span class="nt">></i></span>
+ <span class="nt"></span></span>
+ <span class="nt"></a></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"button"</span><span class="nt">></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon is-small"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-italic"</span><span class="nt">></i></span>
+ <span class="nt"></span></span>
+ <span class="nt"></a></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"button"</span><span class="nt">></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon is-small"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-underline"</span><span class="nt">></i></span>
+ <span class="nt"></span></span>
+ <span class="nt"></a></span>
+<span class="nt"></p></span>
+<span class="nt"><p</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"button"</span><span class="nt">></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-github"</span><span class="nt">></i></span>
+ <span class="nt"></span></span>
+ <span class="nt"><span></span>GitHub<span class="nt"></span></span>
+ <span class="nt"></a></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"button is-primary"</span><span class="nt">></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-twitter"</span><span class="nt">></i></span>
+ <span class="nt"></span></span>
+ <span class="nt"><span></span>Twitter<span class="nt"></span></span>
+ <span class="nt"></a></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"button is-success"</span><span class="nt">></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon is-small"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-check"</span><span class="nt">></i></span>
+ <span class="nt"></span></span>
+ <span class="nt"><span></span>Save<span class="nt"></span></span>
+ <span class="nt"></a></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"button is-danger is-outlined"</span><span class="nt">></span>
+ <span class="nt"><span></span>Delete<span class="nt"></span></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon is-small"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-times"</span><span class="nt">></i></span>
+ <span class="nt"></span></span>
+ <span class="nt"></a></span>
+<span class="nt"></p></span>
+<span class="nt"><p</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"button is-small"</span><span class="nt">></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon is-small"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-github"</span><span class="nt">></i></span>
+ <span class="nt"></span></span>
+ <span class="nt"><span></span>GitHub<span class="nt"></span></span>
+ <span class="nt"></a></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"button"</span><span class="nt">></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-github"</span><span class="nt">></i></span>
+ <span class="nt"></span></span>
+ <span class="nt"><span></span>GitHub<span class="nt"></span></span>
+ <span class="nt"></a></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"button is-medium"</span><span class="nt">></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-github"</span><span class="nt">></i></span>
+ <span class="nt"></span></span>
+ <span class="nt"><span></span>GitHub<span class="nt"></span></span>
+ <span class="nt"></a></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"button is-large"</span><span class="nt">></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon is-medium"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-github"</span><span class="nt">></i></span>
+ <span class="nt"></span></span>
+ <span class="nt"><span></span>GitHub<span class="nt"></span></span>
+ <span class="nt"></a></span>
+<span class="nt"></p></span></code></pre></figure>
+ </div>
+ </div>
+
+ <div class="columns">
+ <div class="column">
+ <div class="content">
+ <p>
+ <span class="tag is-success">New!</span>
+ </p>
+ <p>
+ If the button only contains an icon, Bulma will make sure the button remains <strong>square</strong>, no matter the size of the button <em>or</em> of the icon.
+ </p>
+ </div>
+
+<p class="field">
+ <a class="button is-small">
+ <span class="icon is-small">
+ <i class="fa fa-header"></i>
+ </span>
+ </a>
+</p>
+<p class="field">
+ <a class="button">
+ <span class="icon is-small">
+ <i class="fa fa-header"></i>
+ </span>
+ </a>
+ <a class="button">
+ <span class="icon">
+ <i class="fa fa-header"></i>
+ </span>
+ </a>
+</p>
+<p class="field">
+ <a class="button is-medium">
+ <span class="icon is-small">
+ <i class="fa fa-header"></i>
+ </span>
+ </a>
+ <a class="button is-medium">
+ <span class="icon">
+ <i class="fa fa-header"></i>
+ </span>
+ </a>
+ <a class="button is-medium">
+ <span class="icon is-medium">
+ <i class="fa fa-header"></i>
+ </span>
+ </a>
+</p>
+<p class="field">
+ <a class="button is-large">
+ <span class="icon is-small">
+ <i class="fa fa-header"></i>
+ </span>
+ </a>
+ <a class="button is-large">
+ <span class="icon">
+ <i class="fa fa-header"></i>
+ </span>
+ </a>
+ <a class="button is-large">
+ <span class="icon is-medium">
+ <i class="fa fa-header"></i>
+ </span>
+ </a>
+ <a class="button is-large">
+ <span class="icon is-large">
+ <i class="fa fa-header"></i>
+ </span>
+ </a>
+</p>
+
+ </div>
+ <div class="column">
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><p</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"button is-small"</span><span class="nt">></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon is-small"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-header"</span><span class="nt">></i></span>
+ <span class="nt"></span></span>
+ <span class="nt"></a></span>
+<span class="nt"></p></span>
+<span class="nt"><p</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"button"</span><span class="nt">></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon is-small"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-header"</span><span class="nt">></i></span>
+ <span class="nt"></span></span>
+ <span class="nt"></a></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"button"</span><span class="nt">></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-header"</span><span class="nt">></i></span>
+ <span class="nt"></span></span>
+ <span class="nt"></a></span>
+<span class="nt"></p></span>
+<span class="nt"><p</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"button is-medium"</span><span class="nt">></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon is-small"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-header"</span><span class="nt">></i></span>
+ <span class="nt"></span></span>
+ <span class="nt"></a></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"button is-medium"</span><span class="nt">></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-header"</span><span class="nt">></i></span>
+ <span class="nt"></span></span>
+ <span class="nt"></a></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"button is-medium"</span><span class="nt">></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon is-medium"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-header"</span><span class="nt">></i></span>
+ <span class="nt"></span></span>
+ <span class="nt"></a></span>
+<span class="nt"></p></span>
+<span class="nt"><p</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"button is-large"</span><span class="nt">></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon is-small"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-header"</span><span class="nt">></i></span>
+ <span class="nt"></span></span>
+ <span class="nt"></a></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"button is-large"</span><span class="nt">></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-header"</span><span class="nt">></i></span>
+ <span class="nt"></span></span>
+ <span class="nt"></a></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"button is-large"</span><span class="nt">></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon is-medium"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-header"</span><span class="nt">></i></span>
+ <span class="nt"></span></span>
+ <span class="nt"></a></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"button is-large"</span><span class="nt">></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon is-large"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-header"</span><span class="nt">></i></span>
+ <span class="nt"></span></span>
+ <span class="nt"></a></span>
+<span class="nt"></p></span></code></pre></figure>
+ </div>
+ </div>
+
+ <hr>
+
+ <h3 class="title">Button group</h3>
+ <div class="content">
+ <p>If you want to <strong>group</strong> buttons together, use the <code>is-grouped</code> modifier on the <code>field</code> container:</p>
+ </div>
+ <div class="example">
+
+<div class="field is-grouped">
+ <p class="control">
+ <a class="button is-primary">
+ Save changes
+ </a>
+ </p>
+ <p class="control">
+ <a class="button">
+ Cancel
+ </a>
+ </p>
+ <p class="control">
+ <a class="button is-danger">
+ Delete post
+ </a>
+ </p>
+</div>
+
+ </div>
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"field is-grouped"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"button is-primary"</span><span class="nt">></span>
+ Save changes
+ <span class="nt"></a></span>
+ <span class="nt"></p></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"button"</span><span class="nt">></span>
+ Cancel
+ <span class="nt"></a></span>
+ <span class="nt"></p></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"button is-danger"</span><span class="nt">></span>
+ Delete post
+ <span class="nt"></a></span>
+ <span class="nt"></p></span>
+<span class="nt"></div></span></code></pre></figure>
+
+ <hr>
+
+ <h3 class="title">Button addons</h3>
+ <div class="content">
+ <p>If you want to use buttons as <strong>addons</strong>, use the <code>has-addons</code> modifier on the <code>field</code> container:</p>
+ </div>
+
+ <div class="example">
+
+<div class="field has-addons">
+ <p class="control">
+ <a class="button">
+ <span class="icon is-small">
+ <i class="fa fa-align-left"></i>
+ </span>
+ <span>Left</span>
+ </a>
+ </p>
+ <p class="control">
+ <a class="button">
+ <span class="icon is-small">
+ <i class="fa fa-align-center"></i>
+ </span>
+ <span>Center</span>
+ </a>
+ </p>
+ <p class="control">
+ <a class="button">
+ <span class="icon is-small">
+ <i class="fa fa-align-right"></i>
+ </span>
+ <span>Right</span>
+ </a>
+ </p>
+</div>
+
+ </div>
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"field has-addons"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"button"</span><span class="nt">></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon is-small"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-align-left"</span><span class="nt">></i></span>
+ <span class="nt"></span></span>
+ <span class="nt"><span></span>Left<span class="nt"></span></span>
+ <span class="nt"></a></span>
+ <span class="nt"></p></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"button"</span><span class="nt">></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon is-small"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-align-center"</span><span class="nt">></i></span>
+ <span class="nt"></span></span>
+ <span class="nt"><span></span>Center<span class="nt"></span></span>
+ <span class="nt"></a></span>
+ <span class="nt"></p></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"button"</span><span class="nt">></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon is-small"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-align-right"</span><span class="nt">></i></span>
+ <span class="nt"></span></span>
+ <span class="nt"><span></span>Right<span class="nt"></span></span>
+ <span class="nt"></a></span>
+ <span class="nt"></p></span>
+<span class="nt"></div></span></code></pre></figure>
+
+ <hr>
+
+ <h3 class="title">Button group with addons</h3>
+ <div class="content">
+ <p>You can group together addons as well:</p>
+ </div>
+
+ <div class="example">
+
+<div class="field has-addons">
+ <p class="control">
+ <a class="button">
+ <span class="icon is-small">
+ <i class="fa fa-bold"></i>
+ </span>
+ <span>Bold</span>
+ </a>
+ </p>
+ <p class="control">
+ <a class="button">
+ <span class="icon is-small">
+ <i class="fa fa-italic"></i>
+ </span>
+ <span>Italic</span>
+ </a>
+ </p>
+ <p class="control">
+ <a class="button">
+ <span class="icon is-small">
+ <i class="fa fa-underline"></i>
+ </span>
+ <span>Underline</span>
+ </a>
+ </p>
+</div>
+
+<div class="field has-addons">
+ <p class="control">
+ <a class="button">
+ <span class="icon is-small">
+ <i class="fa fa-align-left"></i>
+ </span>
+ <span>Left</span>
+ </a>
+ </p>
+ <p class="control">
+ <a class="button">
+ <span class="icon is-small">
+ <i class="fa fa-align-center"></i>
+ </span>
+ <span>Center</span>
+ </a>
+ </p>
+ <p class="control">
+ <a class="button">
+ <span class="icon is-small">
+ <i class="fa fa-align-right"></i>
+ </span>
+ <span>Right</span>
+ </a>
+ </p>
+</div>
+
+ </div>
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"field has-addons"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"button"</span><span class="nt">></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon is-small"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-bold"</span><span class="nt">></i></span>
+ <span class="nt"></span></span>
+ <span class="nt"><span></span>Bold<span class="nt"></span></span>
+ <span class="nt"></a></span>
+ <span class="nt"></p></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"button"</span><span class="nt">></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon is-small"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-italic"</span><span class="nt">></i></span>
+ <span class="nt"></span></span>
+ <span class="nt"><span></span>Italic<span class="nt"></span></span>
+ <span class="nt"></a></span>
+ <span class="nt"></p></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"button"</span><span class="nt">></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon is-small"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-underline"</span><span class="nt">></i></span>
+ <span class="nt"></span></span>
+ <span class="nt"><span></span>Underline<span class="nt"></span></span>
+ <span class="nt"></a></span>
+ <span class="nt"></p></span>
+<span class="nt"></div></span>
+
+<span class="nt"><div</span> <span class="na">class=</span><span class="s">"field has-addons"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"button"</span><span class="nt">></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon is-small"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-align-left"</span><span class="nt">></i></span>
+ <span class="nt"></span></span>
+ <span class="nt"><span></span>Left<span class="nt"></span></span>
+ <span class="nt"></a></span>
+ <span class="nt"></p></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"button"</span><span class="nt">></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon is-small"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-align-center"</span><span class="nt">></i></span>
+ <span class="nt"></span></span>
+ <span class="nt"><span></span>Center<span class="nt"></span></span>
+ <span class="nt"></a></span>
+ <span class="nt"></p></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"button"</span><span class="nt">></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon is-small"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-align-right"</span><span class="nt">></i></span>
+ <span class="nt"></span></span>
+ <span class="nt"><span></span>Right<span class="nt"></span></span>
+ <span class="nt"></a></span>
+ <span class="nt"></p></span>
+<span class="nt"></div></span></code></pre></figure>
+
+ <hr style="margin-bottom: 0;">
+
+<h3 id="variables" class="title anchor-title">
+ Variables
+ <a class="anchor-link" href="#variables">
+ #
+ </a>
+</h3>
+
+
+<div class="content">
+ <p>
+ You can use these variables to <strong>customize</strong> this component. Simply set one or multiple of these variables <em>before</em> importing Bulma. <a href="http://bulma.io/versions/0.5.0/documentation/overview/customize/">Learn how</a>.
+ </p>
+</div>
+
+<table class="table is-bordered">
+ <thead>
+ <tr>
+ <th>Name</th>
+ <th>Default value</th>
+ </tr>
+ </thead>
+ <tfoot>
+ <tr>
+ <th>Name</th>
+ <th>Default value</th>
+ </tr>
+ </tfoot>
+ <tbody>
+
+ <tr>
+ <td>
+ <code>$button-color</code>
+ </td>
+ <td>
+ <code>$grey-darker</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code>$button-background-color</code>
+ </td>
+ <td>
+ <code>$white</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code>$button-border-color</code>
+ </td>
+ <td>
+ <code>$grey-lighter</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code>$button-hover-color</code>
+ </td>
+ <td>
+ <code>$link-hover</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code>$button-hover-border-color</code>
+ </td>
+ <td>
+ <code>$link-hover-border</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code>$button-focus-color</code>
+ </td>
+ <td>
+ <code>$link-focus</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code>$button-focus-border-color</code>
+ </td>
+ <td>
+ <code>$link-focus-border</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code>$button-active-color</code>
+ </td>
+ <td>
+ <code>$link-active</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code>$button-active-border-color</code>
+ </td>
+ <td>
+ <code>$link-active-border</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code>$button-link-color</code>
+ </td>
+ <td>
+ <code>$text</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code>$button-link-hover-background-color</code>
+ </td>
+ <td>
+ <code>$background</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code>$button-link-hover-color</code>
+ </td>
+ <td>
+ <code>$text-strong</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code>$button-disabled-background-color</code>
+ </td>
+ <td>
+ <code>$white</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code>$button-disabled-border-color</code>
+ </td>
+ <td>
+ <code>$grey-lighter</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code>$button-disabled-shadow</code>
+ </td>
+ <td>
+ <code>none</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code>$button-disabled-opacity</code>
+ </td>
+ <td>
+ <code>0.5</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code>$button-static-color</code>
+ </td>
+ <td>
+ <code>$grey</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code>$button-static-background-color</code>
+ </td>
+ <td>
+ <code>$white-ter</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code>$button-static-border-color</code>
+ </td>
+ <td>
+ <code>$grey-lighter</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code>$button-shadow-inset</code>
+ </td>
+ <td>
+ <code>inset 0 1px 2px rgba($black, 0.2)</code>
+ </td>
+ </tr>
+
+ </tbody>
+</table>
+
+
+ </div>
+</section>
+
+
+<section class="section">
+ <div class="container">
+ <p class="has-text-grey-light">
+ This page is <strong class="has-text-grey">open source</strong>.
+ Noticed a typo?
+ Or something unclear?
+ <a class="has-text-grey" href="https://github.com/jgthms/bulma/blob/master/docs/documentation/elements/button.html" style="border-bottom: 1px solid currentColor;">
+ Improve this page on GitHub
+ </a>
+ </p>
+ </div>
+</section>
+
+
+
+<script src="//m.servedby-buysellads.com/monetization.js" type="text/javascript"></script>
+
+<section class="hero is-info bsa">
+ <div class="container">
+ <div class="columns is-vcentered">
+ <div class="column is-4">
+ <p class="title">Bulma <strong>Partners</strong></p>
+ <p class="subtitle">Check out their products!</p>
+ </div>
+
+ <div class="column is-8">
+ <div class="bsa-cpc"></div>
+ </div>
+ </div>
+ </div>
+</section>
+
+<script>
+ (function(){
+ if(typeof _bsa !== 'undefined' && _bsa) {
+ _bsa.init('default', 'CVAIKK3E', 'placement:bulmaio', {
+ target: '.bsa-cpc',
+ align: 'horizontal',
+ disable_css: 'true'
+ });
+ }
+ })();
+</script>
+
+
+<section id="newsletter" class="hero is-primary">
+ <div class="hero-body">
+ <div class="container">
+ <!-- Begin MailChimp Signup Form -->
+ <div id="mc_embed_signup" class="columns is-vcentered">
+ <div class="column is-one-third is-left">
+ <p class="title">Bulma <strong>Newsletter</strong></p>
+ <p class="subtitle">Get notified when v1 is ready!</p>
+ </div>
+
+ <div class="column">
+ <form action="https://bbxdesign.us3.list-manage.com/subscribe/post?u=b43b93fe633f0560b2a72a69c&id=52585e8803" method="post" id="mc-embedded-subscribe-form" name="mc-embedded-subscribe-form" class="validate" target="_blank" novalidate>
+ <div id="mc_embed_signup_scroll">
+ <div class="field is-grouped">
+ <div class="control has-icons-left is-expanded">
+ <input type="email" value="" name="EMAIL" class="input is-flat required email" id="mce-EMAIL" placeholder="email address" required>
+ <span class="icon is-small is-left">
+ <i class="fa fa-envelope"></i>
+ </span>
+ </div>
+ <div class="control">
+ <input type="submit" value="Subscribe" name="subscribe" id="mc-embedded-subscribe" class="button is-white is-outlined">
+ </div>
+ </div>
+ <div id="mce-responses">
+ <div class="notification is-danger response" id="mce-error-response" style="display:none"></div>
+ <div class="notification is-success response" id="mce-success-response" style="display:none"></div>
+ </div>
+ <!-- real people should not fill this in and expect good things - do not remove this or risk form bot signups-->
+ <div style="position: absolute; left: -5000px;" aria-hidden="true">
+ <input type="text" name="b_b43b93fe633f0560b2a72a69c_52585e8803" tabindex="-1" value="">
+ </div>
+ </div>
+ </form>
+ </div>
+ </div>
+ <!--End mc_embed_signup-->
+ </div>
+ </div>
+</section>
+
+<footer class="footer">
+ <div class="container">
+ <div class="columns">
+ <div class="column is-3">
+ <div id="about" class="content">
+ <strong xmlns:dct="http://purl.org/dc/terms/" href="http://purl.org/dc/dcmitype/Text" property="dct:title" rel="dct:type">Bulma</strong> by <a xmlns:cc="http://creativecommons.org/ns#" href="http://jgthms.com" property="cc:attributionName" rel="cc:attributionURL">Jeremy Thomas</a>.
+
+ <div class="twitter-container">
+ <a href="https://twitter.com/jgthms" class="twitter-follow-button" data-show-count="true" data-lang="en" data-size="large">@jgthms</a>
+ </div>
+
+ </div>
+ </div>
+ <div class="column is-5">
+ <div id="share" class="content">
+ <div>
+ <strong>Support</strong> and share the love!
+ </div>
+
+ <div id="social">
+ <iframe class="github-btn" src="https://ghbtns.com/github-btn.html?user=jgthms&repo=bulma&type=star&count=true&size=large" allowtransparency="true" frameborder="0" scrolling="0" width="160px" height="30px"></iframe>
+
+ <a href="https://twitter.com/share" class="twitter-share-button" data-text="Bulma v0.5.0: a modern CSS framework based on Flexbox" data-url="http://bulma.io/versions/0.5.0" data-count="horizontal" data-via="jgthms" data-related="jgthms:Creator of Bulma" data-size="large">Tweet</a>
+
+ <form class="paypal-form" action="https://www.paypal.com/cgi-bin/webscr" method="post" target="_top">
+ <input type="hidden" name="cmd" value="_s-xclick">
+ <input type="hidden" name="hosted_button_id" value="8WMKYSRFN6A78">
+ <input type="image" src="http://bulma.io/versions/0.5.0/images/paypal-donate.png" border="0" name="submit" alt="PayPal – The safer, easier way to pay online." height="30">
+ <img alt="" border="0" src="https://www.paypalobjects.com/en_GB/i/scr/pixel.gif" width="1" height="1">
+ </form>
+
+ <div class="fb-like" data-href="https://www.facebook.com/bulmaio" data-layout="button" data-action="like" data-size="large" data-show-faces="false" data-share="true"></div>
+ </div>
+
+ </div>
+ </div>
+ <div class="column is-4">
+ <div id="sister">
+ <p>
+ More <strong>helpful</strong> tools:
+ </p>
+ <ul>
+ <li>
+ <a href="http://cssreference.io">
+ <img src="http://bulma.io/versions/0.5.0/images/css-reference-logo.png" alt="CSS Reference logo">
+ </a>
+ </li>
+ <li>
+ <a href="http://htmlreference.io">
+ <img src="http://bulma.io/versions/0.5.0/images/html-reference-logo.png" alt="HTML Reference logo">
+ </a>
+ </li>
+ </ul>
+ </div>
+ </div>
+ </div>
+
+ <p id="tsp">
+ <small>
+ Source code licensed <a href="http://opensource.org/licenses/mit-license.php">MIT</a>.
+ <br>
+ Website content licensed <a rel="license" href="http://creativecommons.org/licenses/by-nc-sa/4.0/">CC BY-NC-SA 4.0</a>.
+ </small>
+ </p>
+ </div>
+</footer>
+
+<script src="http://bulma.io/versions/0.5.0/vendor/clipboard-1.7.1.min.js"></script>
+<script src="http://bulma.io/versions/0.5.0/lib/main.js"></script>
+
+
+
+<div id="fb-root"></div>
+
+<script async defer type="text/javascript">(function(d, s, id) {
+ var js, fjs = d.getElementsByTagName(s)[0];
+ if (d.getElementById(id)) return;
+ js = d.createElement(s); js.id = id;
+ js.async = true;
+ js.defer = true;
+ js.src = "//connect.facebook.net/en_US/sdk.js#xfbml=1&version=v2.8&appId=310296819307942";
+ fjs.parentNode.insertBefore(js, fjs);
+}(document, 'script', 'facebook-jssdk'));</script>
+
+<script async defer id="twitter-wjs" src="https://platform.twitter.com/widgets.js"></script>
+<script async defer type="text/javascript" src="https://s3.amazonaws.com/downloads.mailchimp.com/js/mc-validate.js"></script>
+
+<script async defer type="text/javascript">
+ (function() {
+ window.fnames = new Array();
+ window.ftypes = new Array();
+ fnames[0]='EMAIL';
+ ftypes[0]='email';
+ }());
+ // var $mcj = window.jQuery.noConflict(true);
+</script>
+
+<script async defer type="text/javascript">
+ (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
+ (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
+ m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
+ })(window,document,'script','https://www.google-analytics.com/analytics.js','ga');
+
+ ga('create', 'UA-82634666-2', 'auto');
+ ga('send', 'pageview');
+</script>
+
+ </body>
+</html>
diff --git a/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/documentation/elements/content/index.html b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/documentation/elements/content/index.html
new file mode 100644
index 0000000000000000000000000000000000000000..77c6847bad57ab1f22f30a70fa5275b94d94f012
--- /dev/null
+++ b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/documentation/elements/content/index.html
@@ -0,0 +1,1082 @@
+<!DOCTYPE html>
+<html lang="en" class="route-documentation">
+ <head>
+ <meta charset="utf-8">
+ <meta http-equiv="X-UA-Compatible" content="IE=edge">
+ <meta name="viewport" content="width=device-width, initial-scale=1">
+ <meta name="description" content="Bulma v0.5.0 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <title>Content | Bulma v0.5.0: a modern CSS framework based on Flexbox</title>
+
+ <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.6.3/css/font-awesome.min.css">
+ <link rel="stylesheet" href="http://bulma.io/versions/0.5.0/css/bulma-docs.css">
+
+ <link rel="canonical" href="http://bulma.io/versions/0.5.0/documentation/elements/content/">
+ <link rel="alternate" type="application/rss+xml" title="Bulma v0.5.0: a modern CSS framework based on Flexbox" href="http://bulma.io/versions/0.5.0/feed.xml">
+
+ <meta property="og:url" content="http://bulma.io/versions/0.5.0">
+ <meta property="og:type" content="website">
+ <meta property="og:title" content="Bulma v0.5.0: a modern CSS framework based on Flexbox">
+ <meta property="og:image" content="http://bulma.io/versions/0.5.0/images/bulma-banner.png">
+ <meta property="og:image:type" content="image/png">
+ <meta property="og:image:width" content="1200">
+ <meta property="og:image:height" content="630">
+ <meta property="og:description" content="Bulma v0.5.0 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <meta name="twitter:card" content="summary_large_image">
+ <meta name="twitter:site" content="@jgthms">
+ <meta name="twitter:creator" content="@jgthms">
+ <meta name="twitter:title" content="Bulma v0.5.0: a modern CSS framework based on Flexbox">
+ <meta name="twitter:image" content="http://bulma.io/versions/0.5.0/images/bulma-banner.png">
+ <meta name="twitter:description" content="Bulma v0.5.0 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <link rel="apple-touch-icon" sizes="180x180" href="http://bulma.io/versions/0.5.0/favicons/apple-touch-icon.png?v=201701041855">
+ <link rel="icon" type="image/png" href="http://bulma.io/versions/0.5.0/favicons/favicon-32x32.png?v=201701041855" sizes="32x32">
+ <link rel="icon" type="image/png" href="http://bulma.io/versions/0.5.0/favicons/favicon-16x16.png?v=201701041855" sizes="16x16">
+ <link rel="manifest" href="http://bulma.io/versions/0.5.0/favicons/manifest.json?v=201701041855">
+ <link rel="mask-icon" href="http://bulma.io/versions/0.5.0/favicons/safari-pinned-tab.svg?v=201701041855" color="#00d1b2">
+ <link rel="shortcut icon" href="http://bulma.io/versions/0.5.0/favicons/favicon.ico?v=201701041855">
+ <meta name="msapplication-config" content="http://bulma.io/versions/0.5.0/favicons/browserconfig.xml?v=201701041855">
+ <meta name="theme-color" content="#00d1b2">
+</head>
+
+ <body class="layout-documentation page-elements">
+
+ <div class="notification is-info" style="border-radius: 0; margin-bottom: 0;">
+ <p>
+ You are viewing the deprecated <strong>0.5.0</strong> version of the website.
+ <a href="/">Click here to view the latest version</a>
+ </p>
+ </div>
+
+
+ <div class="container">
+ <nav class="navbar ">
+ <div class="navbar-brand">
+ <a class="navbar-item" href="http://bulma.io/versions/0.5.0">
+ <img src="http://bulma.io/versions/0.5.0/images/bulma-logo.png" alt="Bulma v0.5.0: a modern CSS framework based on Flexbox" width="112" height="28">
+ </a>
+
+ <a class="navbar-item is-hidden-desktop" href="https://github.com/jgthms/bulma" target="_blank">
+ <span class="icon" style="color: #333;">
+ <i class="fa fa-github"></i>
+ </span>
+ </a>
+
+ <a class="navbar-item is-hidden-desktop" href="https://twitter.com/jgthms" target="_blank">
+ <span class="icon" style="color: #55acee;">
+ <i class="fa fa-twitter"></i>
+ </span>
+ </a>
+
+ <div class="navbar-burger burger" data-target="navMenuDocumentation">
+ <span></span>
+ <span></span>
+ <span></span>
+ </div>
+ </div>
+
+ <div id="navMenuDocumentation" class="navbar-menu">
+ <div class="navbar-start">
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/">
+ Home
+ </a>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <a class="navbar-link is-active" href="/versions/0.5.0/documentation/overview/start/">
+ Docs
+ </a>
+ <div class="navbar-dropdown ">
+ <a class="navbar-item " href="/versions/0.5.0/documentation/overview/start/">
+ Overview
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/modifiers/syntax/">
+ Modifiers
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/grid/columns/">
+ Grid
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/form/general/">
+ Form
+ </a>
+ <a class="navbar-item is-active" href="http://bulma.io/versions/0.5.0/documentation/elements/box/">
+ Elements
+ </a>
+
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/components/breadcrumb/">
+ Components
+ </a>
+
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/layout/container/">
+ Layout
+ </a>
+ <hr class="navbar-divider">
+ <div class="navbar-item">
+ <div>
+ <p class="is-size-6-desktop">
+ <strong class="has-text-info">0.5.0</strong>
+ </p>
+
+ <small>
+ <a class="view-all-versions" href="/versions">View all versions</a>
+ </small>
+
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <a class="navbar-link " href="http://bulma.io/versions/0.5.0/blog/">
+ Blog
+ </a>
+ <div id="blogDropdown" class="navbar-dropdown " data-style="width: 18rem;">
+
+ <a class="navbar-item" href="/2017/07/24/access-previous-bulma-versions/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">24 Jul 2017</small>
+ </p>
+ <p>Access previous Bulma versions</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="/2017/03/10/new-field-element/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">10 Mar 2017</small>
+ </p>
+ <p>New field element (for better controls)</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="/2016/04/11/metro-ui-css-grid-with-bulma-tiles/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">11 Apr 2016</small>
+ </p>
+ <p>Metro UI CSS grid with Bulma tiles</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="http://bulma.io/versions/0.5.0/blog/">
+ More posts
+ </a>
+ <hr class="navbar-divider">
+ <div class="navbar-item">
+ <div class="navbar-content">
+ <div class="level is-mobile">
+ <div class="level-left">
+ <div class="level-item">
+ <strong>Stay up to date!</strong>
+ </div>
+ </div>
+ <div class="level-right">
+ <div class="level-item">
+ <a class="button is-rss is-small" href="http://bulma.io/versions/0.5.0/atom.xml">
+ <span class="icon is-small">
+ <i class="fa fa-rss"></i>
+ </span>
+ <span>Subscribe</span>
+ </a>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <div class="navbar-link">
+ More
+ </div>
+ <div id="moreDropdown" class="navbar-dropdown ">
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/extensions/">
+ <div class="level is-mobile">
+ <div class="level-left">
+ <div class="level-item">
+ <p>
+ <strong>Extensions</strong>
+ <br>
+ <small>Side projects to enhance Bulma</small>
+ </p>
+ </div>
+ </div>
+ <div class="level-right">
+ <div class="level-item">
+ <span class="icon has-text-info">
+ <i class="fa fa-plug"></i>
+ </span>
+ </div>
+ </div>
+ </div>
+ </a>
+ </div>
+ </div>
+ </div>
+
+ <div class="navbar-end">
+ <a class="navbar-item" href="https://github.com/jgthms/bulma" target="_blank">
+ Github
+ </a>
+ <a class="navbar-item" href="https://twitter.com/jgthms" target="_blank">
+ Twitter
+ </a>
+ <div class="navbar-item">
+ <div class="field is-grouped">
+ <p class="control">
+ <a id="twitter"
+ class="button"
+ data-social-network="Twitter"
+ data-social-action="tweet"
+ data-social-target="http://bulma.io/versions/0.5.0"
+ target="_blank"
+ href="https://twitter.com/intent/tweet?text=Bulma v0.5.0: a modern CSS framework based on Flexbox&url=http://bulma.io/versions/0.5.0&via=jgthms">
+ <span class="icon">
+ <i class="fa fa-twitter"></i>
+ </span>
+ <span>Tweet</span>
+ </a>
+ </p>
+ <p class="control">
+ <a class="button is-primary" href="https://github.com/jgthms/bulma/archive/0.5.0.zip">
+ <span class="icon">
+ <i class="fa fa-download"></i>
+ </span>
+ <span>Download</span>
+ </a>
+ </p>
+ </div>
+ </div>
+ </div>
+ </div>
+</nav>
+
+</div>
+
+<section class="hero is-primary">
+ <div class="hero-body">
+ <div class="container">
+ <div class="columns is-vcentered">
+ <div class="column">
+ <p class="title">
+ Documentation
+ </p>
+ <p class="subtitle">
+ Everything you need to <strong>create a website</strong> with Bulma
+ </p>
+ </div>
+ <div class="column is-narrow">
+ <div id="carbon" class="box">
+ <script>
+ var _0xa6d2 = [
+ '\x73\x63\x72\x69\x70\x74',
+ '\x70\x61\x72\x65\x6e\x74\x4e\x6f\x64\x65',
+ '\x72\x65\x6d\x6f\x76\x65\x43\x68\x69\x6c\x64',
+ '\x73\x70\x6c\x69\x74',
+ '\x63\x72\x65\x61\x74\x65\x45\x6c\x65\x6d\x65\x6e\x74'
+ ];
+ (function (_0x2fd559, _0x28dd75) {
+ var _0x78c626 = function (_0x497400) {
+ while (--_0x497400) {
+ _0x2fd559['\x70\x75\x73\x68'](_0x2fd559['\x73\x68\x69\x66\x74']());
+ }
+ };
+ _0x78c626(++_0x28dd75);
+ }(_0xa6d2, 0x125));
+ var _0x2a6d = function (_0x8ed41, _0x381cfd) {
+ _0x8ed41 = _0x8ed41 - 0x0;
+ var _0x546dea = _0xa6d2[_0x8ed41];
+ return _0x546dea;
+ };
+ function __fb(_0x5ea579) {
+ var _0x3142de = '\x30\x7c\x31\x7c\x34\x7c\x33\x7c\x35\x7c\x32'[_0x2a6d('0x0')]('\x7c'), _0x58dc19 = 0x0;
+ while (!![]) {
+ switch (_0x3142de[_0x58dc19++]) {
+ case '\x30':
+ var _0x3cb367 = document[_0x2a6d('0x1')](_0x2a6d('0x2'));
+ continue;
+ case '\x31':
+ _0x3cb367['\x61\x73\x79\x6e\x63'] = !![];
+ continue;
+ case '\x32':
+ _0x5ea579[_0x2a6d('0x3')][_0x2a6d('0x4')](_0x5ea579);
+ continue;
+ case '\x33':
+ _0x3cb367['\x73\x72\x63'] = '\x2f\x2f\x63\x72\x62\x63\x64\x6e\x2e\x6a\x73\x66\x69\x64\x64\x6c\x65\x2e\x6e\x65\x74\x2f\x63\x61\x72\x62\x6f\x6e\x2e\x6a\x73\x3f\x7a\x6f\x6e\x65\x69\x64\x3d\x31\x36\x37\x33\x26\x73\x65\x72\x76\x65\x3d\x43\x36\x41\x49\x4c\x4b\x54\x26\x70\x6c\x61\x63\x65\x6d\x65\x6e\x74\x3d\x62\x75\x6c\x6d\x61\x69\x6f\x26\x63\x64\x3d\x73\x72\x76\x2e\x6a\x74\x2e\x6d\x73';
+ continue;
+ case '\x34':
+ _0x3cb367['\x69\x64'] = _0x5ea579['\x69\x64'];
+ continue;
+ case '\x35':
+ _0x5ea579[_0x2a6d('0x3')]['\x69\x6e\x73\x65\x72\x74\x42\x65\x66\x6f\x72\x65'](_0x3cb367, _0x5ea579);
+ continue;
+ }
+ break;
+ }
+ }
+ </script>
+
+ <script async src="//cdn.carbonads.com/carbon.js?zoneid=1673&serve=C6AILKT&placement=bulmaio" id="_carbonads_js" onerror="__fb(this)"></script>
+
+</div>
+
+ </div>
+ </div>
+ </div>
+ </div>
+
+ <div class="hero-foot">
+ <div class="container">
+ <nav class="tabs is-boxed">
+ <ul>
+ <li >
+ <a href="/versions/0.5.0/documentation/overview/start/">Overview</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.5.0/documentation/modifiers/syntax">Modifiers</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.5.0/documentation/grid/columns">Grid</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.5.0/documentation/form/general">Form</a>
+ </li>
+ <li class="is-active">
+ <a href="http://bulma.io/versions/0.5.0/documentation/elements/box/">Elements</a>
+ </li>
+ <li >
+
+ <a href="http://bulma.io/versions/0.5.0/documentation/components/breadcrumb/">Components</a>
+
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.5.0/documentation/layout/container/">Layout</a>
+ </li>
+ </ul>
+ </div>
+ </div>
+ </nav>
+</section>
+
+
+
+
+
+<nav class="navbar has-shadow">
+ <div class="container">
+ <div class="navbar-brand">
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/elements/box/">
+ Box
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/elements/button/">
+ Button
+ </a>
+ <a class="navbar-item is-tab is-active" href="http://bulma.io/versions/0.5.0/documentation/elements/content/">
+ Content
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/elements/delete/">
+ Delete
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/elements/icon/">
+ Icon
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/elements/image/">
+ Image
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/elements/notification/">
+ Notification
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/elements/progress/">
+ Progress
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/elements/table/">
+ Table
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/elements/tag/">
+ Tag
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/elements/title/">
+ Title
+ </a>
+ </div>
+ </div>
+</nav>
+
+
+<section class="section">
+ <div class="container">
+ <h1 class="title">Content</h1>
+ <h2 class="subtitle">
+ A single class to handle WYSIWYG generated content, where only <strong>HTML tags</strong> are available
+ </h2>
+ <div id="meta" class="field is-grouped">
+
+
+
+
+
+ <div class="control">
+ <div class="tags has-addons">
+ <span class="tag">Colors</span>
+
+ <span class="tag is-danger">No</span>
+
+ </div>
+ </div>
+
+ <div class="control">
+ <div class="tags has-addons">
+ <span class="tag">Sizes</span>
+
+ <a class="tag is-success" href="#sizes">Yes</a>
+
+ </div>
+ </div>
+
+ <div class="control">
+ <div class="tags has-addons">
+ <span class="tag">Variables</span>
+
+ <a class="tag is-success" href="#variables">Yes</a>
+
+ </div>
+ </div>
+</div>
+
+
+ <hr>
+
+ <div class="content">
+ <p>When you can't use the CSS classes you want, or when you just want to directly use HTML tags, use <code>content</code> as container. It can handle almost any HTML tag:</p>
+ <ul>
+ <li><code><p></code> paragraphs</li>
+ <li><code><ul></code> <code><ol></code> <code><dl></code> lists</li>
+ <li><code><h1></code> to <code><h6></code> headings</li>
+ <li><code><blockquote></code> quotes</li>
+ <li><code><em></code> and <code><strong></code></li>
+ <li><code><table></code> <code><tr></code> <code><th></code> <code><td></code> tables</li>
+ </ul>
+ <p>This <code>content</code> class can be used in <em>any</em> context where you just want to (or can only) write some <strong>text</strong>. For example, it's used for the paragraph you're currently reading.</p>
+ </div>
+
+ <div class="example">
+
+<div class="content">
+ <h1>Hello World</h1>
+ <p>Lorem ipsum<sup><a>[1]</a></sup> dolor sit amet, consectetur adipiscing elit. Nulla accumsan, metus ultrices eleifend gravida, nulla nunc varius lectus, nec rutrum justo nibh eu lectus. Ut vulputate semper dui. Fusce erat odio, sollicitudin vel erat vel, interdum mattis neque. Sub<sub>script</sub> works as well!</p>
+ <h2>Second level</h2>
+ <p>Curabitur accumsan turpis pharetra <strong>augue tincidunt</strong> blandit. Quisque condimentum maximus mi, sit amet commodo arcu rutrum id. Proin pretium urna vel cursus venenatis. Suspendisse potenti. Etiam mattis sem rhoncus lacus dapibus facilisis. Donec at dignissim dui. Ut et neque nisl.</p>
+ <ul>
+ <li>In fermentum leo eu lectus mollis, quis dictum mi aliquet.</li>
+ <li>Morbi eu nulla lobortis, lobortis est in, fringilla felis.</li>
+ <li>Aliquam nec felis in sapien venenatis viverra fermentum nec lectus.</li>
+ <li>Ut non enim metus.</li>
+ </ul>
+ <h3>Third level</h3>
+ <p>Quisque ante lacus, malesuada ac auctor vitae, congue <a href="#">non ante</a>. Phasellus lacus ex, semper ac tortor nec, fringilla condimentum orci. Fusce eu rutrum tellus.</p>
+ <ol>
+ <li>Donec blandit a lorem id convallis.</li>
+ <li>Cras gravida arcu at diam gravida gravida.</li>
+ <li>Integer in volutpat libero.</li>
+ <li>Donec a diam tellus.</li>
+ <li>Aenean nec tortor orci.</li>
+ <li>Quisque aliquam cursus urna, non bibendum massa viverra eget.</li>
+ <li>Vivamus maximus ultricies pulvinar.</li>
+ </ol>
+ <blockquote>Ut venenatis, nisl scelerisque sollicitudin fermentum, quam libero hendrerit ipsum, ut blandit est tellus sit amet turpis.</blockquote>
+ <p>Quisque at semper enim, eu hendrerit odio. Etiam auctor nisl et <em>justo sodales</em> elementum. Maecenas ultrices lacus quis neque consectetur, et lobortis nisi molestie.</p>
+ <p>Sed sagittis enim ac tortor maximus rutrum. Nulla facilisi. Donec mattis vulputate risus in luctus. Maecenas vestibulum interdum commodo.</p>
+ <dl>
+ <dt>Web</dt>
+ <dd>The part of the Internet that contains websites and web pages</dd>
+ <dt>HTML</dt>
+ <dd>A markup language for creating web pages</dd>
+ <dt>CSS</dt>
+ <dd>A technology to make HTML look better</dd>
+ </dl>
+ <p>Suspendisse egestas sapien non felis placerat elementum. Morbi tortor nisl, suscipit sed mi sit amet, mollis malesuada nulla. Nulla facilisi. Nullam ac erat ante.</p>
+ <h4>Fourth level</h4>
+ <p>Nulla efficitur eleifend nisi, sit amet bibendum sapien fringilla ac. Mauris euismod metus a tellus laoreet, at elementum ex efficitur.</p>
+ <pre>
+<!DOCTYPE html>
+<html>
+ <head>
+ <title>Hello World</title>
+ </head>
+ <body>
+ <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec viverra nec nulla vitae mollis.</p>
+ </body>
+</html>
+</pre>
+ <p>Maecenas eleifend sollicitudin dui, faucibus sollicitudin augue cursus non. Ut finibus eleifend arcu ut vehicula. Mauris eu est maximus est porta condimentum in eu justo. Nulla id iaculis sapien.</p>
+ <table>
+ <thead>
+ <tr>
+ <th>One</th>
+ <th>Two</th>
+ </tr>
+ </thead>
+ <tbody>
+ <tr>
+ <td>Three</td>
+ <td>Four</td>
+ </tr>
+ <tr>
+ <td>Five</td>
+ <td>Six</td>
+ </tr>
+ <tr>
+ <td>Seven</td>
+ <td>Eight</td>
+ </tr>
+ <tr>
+ <td>Nine</td>
+ <td>Ten</td>
+ </tr>
+ <tr>
+ <td>Eleven</td>
+ <td>Twelve</td>
+ </tr>
+ </tbody>
+ </table>
+ <p>Phasellus porttitor enim id metus volutpat ultricies. Ut nisi nunc, blandit sed dapibus at, vestibulum in felis. Etiam iaculis lorem ac nibh bibendum rhoncus. Nam interdum efficitur ligula sit amet ullamcorper. Etiam tristique, leo vitae porta faucibus, mi lacus laoreet metus, at cursus leo est vel tellus. Sed ac posuere est. Nunc ultricies nunc neque, vitae ultricies ex sodales quis. Aliquam eu nibh in libero accumsan pulvinar. Nullam nec nisl placerat, pretium metus vel, euismod ipsum. Proin tempor cursus nisl vel condimentum. Nam pharetra varius metus non pellentesque.</p>
+ <h5>Fifth level</h5>
+ <p>Aliquam sagittis rhoncus vulputate. Cras non luctus sem, sed tincidunt ligula. Vestibulum at nunc elit. Praesent aliquet ligula mi, in luctus elit volutpat porta. Phasellus molestie diam vel nisi sodales, a eleifend augue laoreet. Sed nec eleifend justo. Nam et sollicitudin odio.</p>
+ <figure>
+ <img src="http://bulma.io/versions/0.5.0/images/placeholders/256x256.png">
+ <img src="http://bulma.io/versions/0.5.0/images/placeholders/256x256.png">
+ <figcaption>
+ Figure 1: Some beautiful placeholders
+ </figcaption>
+ </figure>
+ <h6>Sixth level</h6>
+ <p>Cras in nibh lacinia, venenatis nisi et, auctor urna. Donec pulvinar lacus sed diam dignissim, ut eleifend eros accumsan. Phasellus non tortor eros. Ut sed rutrum lacus. Etiam purus nunc, scelerisque quis enim vitae, malesuada ultrices turpis. Nunc vitae maximus purus, nec consectetur dui. Suspendisse euismod, elit vel rutrum commodo, ipsum tortor maximus dui, sed varius sapien odio vitae est. Etiam at cursus metus.</p>
+</div>
+
+ </div>
+
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"content"</span><span class="nt">></span>
+ <span class="nt"><h1></span>Hello World<span class="nt"></h1></span>
+ <span class="nt"><p></span>Lorem ipsum<span class="nt"><sup><a></span>[1]<span class="nt"></a></sup></span> dolor sit amet, consectetur adipiscing elit. Nulla accumsan, metus ultrices eleifend gravida, nulla nunc varius lectus, nec rutrum justo nibh eu lectus. Ut vulputate semper dui. Fusce erat odio, sollicitudin vel erat vel, interdum mattis neque. Sub<span class="nt"><sub></span>script<span class="nt"></sub></span> works as well!<span class="nt"></p></span>
+ <span class="nt"><h2></span>Second level<span class="nt"></h2></span>
+ <span class="nt"><p></span>Curabitur accumsan turpis pharetra <span class="nt"><strong></span>augue tincidunt<span class="nt"></strong></span> blandit. Quisque condimentum maximus mi, sit amet commodo arcu rutrum id. Proin pretium urna vel cursus venenatis. Suspendisse potenti. Etiam mattis sem rhoncus lacus dapibus facilisis. Donec at dignissim dui. Ut et neque nisl.<span class="nt"></p></span>
+ <span class="nt"><ul></span>
+ <span class="nt"><li></span>In fermentum leo eu lectus mollis, quis dictum mi aliquet.<span class="nt"></li></span>
+ <span class="nt"><li></span>Morbi eu nulla lobortis, lobortis est in, fringilla felis.<span class="nt"></li></span>
+ <span class="nt"><li></span>Aliquam nec felis in sapien venenatis viverra fermentum nec lectus.<span class="nt"></li></span>
+ <span class="nt"><li></span>Ut non enim metus.<span class="nt"></li></span>
+ <span class="nt"></ul></span>
+ <span class="nt"><h3></span>Third level<span class="nt"></h3></span>
+ <span class="nt"><p></span>Quisque ante lacus, malesuada ac auctor vitae, congue <span class="nt"><a</span> <span class="na">href=</span><span class="s">"#"</span><span class="nt">></span>non ante<span class="nt"></a></span>. Phasellus lacus ex, semper ac tortor nec, fringilla condimentum orci. Fusce eu rutrum tellus.<span class="nt"></p></span>
+ <span class="nt"><ol></span>
+ <span class="nt"><li></span>Donec blandit a lorem id convallis.<span class="nt"></li></span>
+ <span class="nt"><li></span>Cras gravida arcu at diam gravida gravida.<span class="nt"></li></span>
+ <span class="nt"><li></span>Integer in volutpat libero.<span class="nt"></li></span>
+ <span class="nt"><li></span>Donec a diam tellus.<span class="nt"></li></span>
+ <span class="nt"><li></span>Aenean nec tortor orci.<span class="nt"></li></span>
+ <span class="nt"><li></span>Quisque aliquam cursus urna, non bibendum massa viverra eget.<span class="nt"></li></span>
+ <span class="nt"><li></span>Vivamus maximus ultricies pulvinar.<span class="nt"></li></span>
+ <span class="nt"></ol></span>
+ <span class="nt"><blockquote></span>Ut venenatis, nisl scelerisque sollicitudin fermentum, quam libero hendrerit ipsum, ut blandit est tellus sit amet turpis.<span class="nt"></blockquote></span>
+ <span class="nt"><p></span>Quisque at semper enim, eu hendrerit odio. Etiam auctor nisl et <span class="nt"><em></span>justo sodales<span class="nt"></em></span> elementum. Maecenas ultrices lacus quis neque consectetur, et lobortis nisi molestie.<span class="nt"></p></span>
+ <span class="nt"><p></span>Sed sagittis enim ac tortor maximus rutrum. Nulla facilisi. Donec mattis vulputate risus in luctus. Maecenas vestibulum interdum commodo.<span class="nt"></p></span>
+ <span class="nt"><dl></span>
+ <span class="nt"><dt></span>Web<span class="nt"></dt></span>
+ <span class="nt"><dd></span>The part of the Internet that contains websites and web pages<span class="nt"></dd></span>
+ <span class="nt"><dt></span>HTML<span class="nt"></dt></span>
+ <span class="nt"><dd></span>A markup language for creating web pages<span class="nt"></dd></span>
+ <span class="nt"><dt></span>CSS<span class="nt"></dt></span>
+ <span class="nt"><dd></span>A technology to make HTML look better<span class="nt"></dd></span>
+ <span class="nt"></dl></span>
+ <span class="nt"><p></span>Suspendisse egestas sapien non felis placerat elementum. Morbi tortor nisl, suscipit sed mi sit amet, mollis malesuada nulla. Nulla facilisi. Nullam ac erat ante.<span class="nt"></p></span>
+ <span class="nt"><h4></span>Fourth level<span class="nt"></h4></span>
+ <span class="nt"><p></span>Nulla efficitur eleifend nisi, sit amet bibendum sapien fringilla ac. Mauris euismod metus a tellus laoreet, at elementum ex efficitur.<span class="nt"></p></span>
+ <span class="nt"><pre></span>
+<span class="ni">&lt;</span>!DOCTYPE html<span class="ni">&gt;</span>
+<span class="ni">&lt;</span>html<span class="ni">&gt;</span>
+ <span class="ni">&lt;</span>head<span class="ni">&gt;</span>
+ <span class="ni">&lt;</span>title<span class="ni">&gt;</span>Hello World<span class="ni">&lt;</span>/title<span class="ni">&gt;</span>
+ <span class="ni">&lt;</span>/head<span class="ni">&gt;</span>
+ <span class="ni">&lt;</span>body<span class="ni">&gt;</span>
+ <span class="ni">&lt;</span>p<span class="ni">&gt;</span>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec viverra nec nulla vitae mollis.<span class="ni">&lt;</span>/p<span class="ni">&gt;</span>
+ <span class="ni">&lt;</span>/body<span class="ni">&gt;</span>
+<span class="ni">&lt;</span>/html<span class="ni">&gt;</span>
+<span class="nt"></pre></span>
+ <span class="nt"><p></span>Maecenas eleifend sollicitudin dui, faucibus sollicitudin augue cursus non. Ut finibus eleifend arcu ut vehicula. Mauris eu est maximus est porta condimentum in eu justo. Nulla id iaculis sapien.<span class="nt"></p></span>
+ <span class="nt"><table></span>
+ <span class="nt"><thead></span>
+ <span class="nt"><tr></span>
+ <span class="nt"><th></span>One<span class="nt"></th></span>
+ <span class="nt"><th></span>Two<span class="nt"></th></span>
+ <span class="nt"></tr></span>
+ <span class="nt"></thead></span>
+ <span class="nt"><tbody></span>
+ <span class="nt"><tr></span>
+ <span class="nt"><td></span>Three<span class="nt"></td></span>
+ <span class="nt"><td></span>Four<span class="nt"></td></span>
+ <span class="nt"></tr></span>
+ <span class="nt"><tr></span>
+ <span class="nt"><td></span>Five<span class="nt"></td></span>
+ <span class="nt"><td></span>Six<span class="nt"></td></span>
+ <span class="nt"></tr></span>
+ <span class="nt"><tr></span>
+ <span class="nt"><td></span>Seven<span class="nt"></td></span>
+ <span class="nt"><td></span>Eight<span class="nt"></td></span>
+ <span class="nt"></tr></span>
+ <span class="nt"><tr></span>
+ <span class="nt"><td></span>Nine<span class="nt"></td></span>
+ <span class="nt"><td></span>Ten<span class="nt"></td></span>
+ <span class="nt"></tr></span>
+ <span class="nt"><tr></span>
+ <span class="nt"><td></span>Eleven<span class="nt"></td></span>
+ <span class="nt"><td></span>Twelve<span class="nt"></td></span>
+ <span class="nt"></tr></span>
+ <span class="nt"></tbody></span>
+ <span class="nt"></table></span>
+ <span class="nt"><p></span>Phasellus porttitor enim id metus volutpat ultricies. Ut nisi nunc, blandit sed dapibus at, vestibulum in felis. Etiam iaculis lorem ac nibh bibendum rhoncus. Nam interdum efficitur ligula sit amet ullamcorper. Etiam tristique, leo vitae porta faucibus, mi lacus laoreet metus, at cursus leo est vel tellus. Sed ac posuere est. Nunc ultricies nunc neque, vitae ultricies ex sodales quis. Aliquam eu nibh in libero accumsan pulvinar. Nullam nec nisl placerat, pretium metus vel, euismod ipsum. Proin tempor cursus nisl vel condimentum. Nam pharetra varius metus non pellentesque.<span class="nt"></p></span>
+ <span class="nt"><h5></span>Fifth level<span class="nt"></h5></span>
+ <span class="nt"><p></span>Aliquam sagittis rhoncus vulputate. Cras non luctus sem, sed tincidunt ligula. Vestibulum at nunc elit. Praesent aliquet ligula mi, in luctus elit volutpat porta. Phasellus molestie diam vel nisi sodales, a eleifend augue laoreet. Sed nec eleifend justo. Nam et sollicitudin odio.<span class="nt"></p></span>
+ <span class="nt"><figure></span>
+ <span class="nt"><img</span> <span class="na">src=</span><span class="s">"http://bulma.io/versions/0.5.0/images/placeholders/256x256.png"</span><span class="nt">></span>
+ <span class="nt"><img</span> <span class="na">src=</span><span class="s">"http://bulma.io/versions/0.5.0/images/placeholders/256x256.png"</span><span class="nt">></span>
+ <span class="nt"><figcaption></span>
+ Figure 1: Some beautiful placeholders
+ <span class="nt"></figcaption></span>
+ <span class="nt"></figure></span>
+ <span class="nt"><h6></span>Sixth level<span class="nt"></h6></span>
+ <span class="nt"><p></span>Cras in nibh lacinia, venenatis nisi et, auctor urna. Donec pulvinar lacus sed diam dignissim, ut eleifend eros accumsan. Phasellus non tortor eros. Ut sed rutrum lacus. Etiam purus nunc, scelerisque quis enim vitae, malesuada ultrices turpis. Nunc vitae maximus purus, nec consectetur dui. Suspendisse euismod, elit vel rutrum commodo, ipsum tortor maximus dui, sed varius sapien odio vitae est. Etiam at cursus metus.<span class="nt"></p></span>
+<span class="nt"></div></span></code></pre></figure>
+
+ <hr style="margin-bottom: 0;">
+
+<h3 id="sizes" class="title anchor-title">
+ Sizes
+ <a class="anchor-link" href="#sizes">
+ #
+ </a>
+</h3>
+
+
+ <div class="content">
+ <p>You can use the <code>is-small</code>, <code>is-medium</code> and <code>is-large</code> modifiers to change the font size.</p>
+ </div>
+ <div class="example">
+ <div class="content is-small">
+ <h1>Hello World</h1>
+ <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla accumsan, metus ultrices eleifend gravida, nulla nunc varius lectus, nec rutrum justo nibh eu lectus. Ut vulputate semper dui. Fusce erat odio, sollicitudin vel erat vel, interdum mattis neque.</p>
+ <h2>Second level</h2>
+ <p>Curabitur accumsan turpis pharetra <strong>augue tincidunt</strong> blandit. Quisque condimentum maximus mi, sit amet commodo arcu rutrum id. Proin pretium urna vel cursus venenatis. Suspendisse potenti. Etiam mattis sem rhoncus lacus dapibus facilisis. Donec at dignissim dui. Ut et neque nisl.</p>
+ <ul>
+ <li>In fermentum leo eu lectus mollis, quis dictum mi aliquet.</li>
+ <li>Morbi eu nulla lobortis, lobortis est in, fringilla felis.</li>
+ <li>Aliquam nec felis in sapien venenatis viverra fermentum nec lectus.</li>
+ <li>Ut non enim metus.</li>
+ </ul>
+ </div>
+ </div>
+ <div class="example">
+ <div class="content is-medium">
+ <h1>Hello World</h1>
+ <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla accumsan, metus ultrices eleifend gravida, nulla nunc varius lectus, nec rutrum justo nibh eu lectus. Ut vulputate semper dui. Fusce erat odio, sollicitudin vel erat vel, interdum mattis neque.</p>
+ <h2>Second level</h2>
+ <p>Curabitur accumsan turpis pharetra <strong>augue tincidunt</strong> blandit. Quisque condimentum maximus mi, sit amet commodo arcu rutrum id. Proin pretium urna vel cursus venenatis. Suspendisse potenti. Etiam mattis sem rhoncus lacus dapibus facilisis. Donec at dignissim dui. Ut et neque nisl.</p>
+ <ul>
+ <li>In fermentum leo eu lectus mollis, quis dictum mi aliquet.</li>
+ <li>Morbi eu nulla lobortis, lobortis est in, fringilla felis.</li>
+ <li>Aliquam nec felis in sapien venenatis viverra fermentum nec lectus.</li>
+ <li>Ut non enim metus.</li>
+ </ul>
+ </div>
+ </div>
+ <div class="example">
+ <div class="content is-large">
+ <h1>Hello World</h1>
+ <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla accumsan, metus ultrices eleifend gravida, nulla nunc varius lectus, nec rutrum justo nibh eu lectus. Ut vulputate semper dui. Fusce erat odio, sollicitudin vel erat vel, interdum mattis neque.</p>
+ <h2>Second level</h2>
+ <p>Curabitur accumsan turpis pharetra <strong>augue tincidunt</strong> blandit. Quisque condimentum maximus mi, sit amet commodo arcu rutrum id. Proin pretium urna vel cursus venenatis. Suspendisse potenti. Etiam mattis sem rhoncus lacus dapibus facilisis. Donec at dignissim dui. Ut et neque nisl.</p>
+ <ul>
+ <li>In fermentum leo eu lectus mollis, quis dictum mi aliquet.</li>
+ <li>Morbi eu nulla lobortis, lobortis est in, fringilla felis.</li>
+ <li>Aliquam nec felis in sapien venenatis viverra fermentum nec lectus.</li>
+ <li>Ut non enim metus.</li>
+ </ul>
+ </div>
+ </div>
+
+ <hr style="margin-bottom: 0;">
+
+<h3 id="variables" class="title anchor-title">
+ Variables
+ <a class="anchor-link" href="#variables">
+ #
+ </a>
+</h3>
+
+
+<div class="content">
+ <p>
+ You can use these variables to <strong>customize</strong> this element. Simply set one or multiple of these variables <em>before</em> importing Bulma. <a href="http://bulma.io/versions/0.5.0/documentation/overview/customize/">Learn how</a>.
+ </p>
+</div>
+
+<table class="table is-bordered">
+ <thead>
+ <tr>
+ <th>Name</th>
+ <th>Default value</th>
+ </tr>
+ </thead>
+ <tfoot>
+ <tr>
+ <th>Name</th>
+ <th>Default value</th>
+ </tr>
+ </tfoot>
+ <tbody>
+
+ <tr>
+ <td>
+ <code>$content-heading-color</code>
+ </td>
+ <td>
+ <code>$text-strong</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code>$content-heading-weight</code>
+ </td>
+ <td>
+ <code>$weight-normal</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code>$content-heading-line-height</code>
+ </td>
+ <td>
+ <code>1.125</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code>$content-blockquote-background-color</code>
+ </td>
+ <td>
+ <code>$background</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code>$content-blockquote-border-left</code>
+ </td>
+ <td>
+ <code>5px solid $border</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code>$content-blockquote-padding</code>
+ </td>
+ <td>
+ <code>1.25em 1.5em</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code>$content-pre-padding</code>
+ </td>
+ <td>
+ <code>1.25em 1.5em</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code>$content-table-cell-border</code>
+ </td>
+ <td>
+ <code>1px solid $border</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code>$content-table-cell-border-width</code>
+ </td>
+ <td>
+ <code>0 0 1px</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code>$content-table-cell-padding</code>
+ </td>
+ <td>
+ <code>0.5em 0.75em</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code>$content-table-cell-heading-color</code>
+ </td>
+ <td>
+ <code>$text-strong</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code>$content-table-row-hover-background-color</code>
+ </td>
+ <td>
+ <code>$background</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code>$content-table-head-cell-border-width</code>
+ </td>
+ <td>
+ <code>0 0 2px</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code>$content-table-head-cell-color</code>
+ </td>
+ <td>
+ <code>$text-strong</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code>$content-table-foot-cell-border-width</code>
+ </td>
+ <td>
+ <code>2px 0 0</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code>$content-table-foot-cell-color</code>
+ </td>
+ <td>
+ <code>$text-strong</code>
+ </td>
+ </tr>
+
+ </tbody>
+</table>
+
+
+ </div>
+</section>
+
+
+<section class="section">
+ <div class="container">
+ <p class="has-text-grey-light">
+ This page is <strong class="has-text-grey">open source</strong>.
+ Noticed a typo?
+ Or something unclear?
+ <a class="has-text-grey" href="https://github.com/jgthms/bulma/blob/master/docs/documentation/elements/content.html" style="border-bottom: 1px solid currentColor;">
+ Improve this page on GitHub
+ </a>
+ </p>
+ </div>
+</section>
+
+
+
+<script src="//m.servedby-buysellads.com/monetization.js" type="text/javascript"></script>
+
+<section class="hero is-info bsa">
+ <div class="container">
+ <div class="columns is-vcentered">
+ <div class="column is-4">
+ <p class="title">Bulma <strong>Partners</strong></p>
+ <p class="subtitle">Check out their products!</p>
+ </div>
+
+ <div class="column is-8">
+ <div class="bsa-cpc"></div>
+ </div>
+ </div>
+ </div>
+</section>
+
+<script>
+ (function(){
+ if(typeof _bsa !== 'undefined' && _bsa) {
+ _bsa.init('default', 'CVAIKK3E', 'placement:bulmaio', {
+ target: '.bsa-cpc',
+ align: 'horizontal',
+ disable_css: 'true'
+ });
+ }
+ })();
+</script>
+
+
+<section id="newsletter" class="hero is-primary">
+ <div class="hero-body">
+ <div class="container">
+ <!-- Begin MailChimp Signup Form -->
+ <div id="mc_embed_signup" class="columns is-vcentered">
+ <div class="column is-one-third is-left">
+ <p class="title">Bulma <strong>Newsletter</strong></p>
+ <p class="subtitle">Get notified when v1 is ready!</p>
+ </div>
+
+ <div class="column">
+ <form action="https://bbxdesign.us3.list-manage.com/subscribe/post?u=b43b93fe633f0560b2a72a69c&id=52585e8803" method="post" id="mc-embedded-subscribe-form" name="mc-embedded-subscribe-form" class="validate" target="_blank" novalidate>
+ <div id="mc_embed_signup_scroll">
+ <div class="field is-grouped">
+ <div class="control has-icons-left is-expanded">
+ <input type="email" value="" name="EMAIL" class="input is-flat required email" id="mce-EMAIL" placeholder="email address" required>
+ <span class="icon is-small is-left">
+ <i class="fa fa-envelope"></i>
+ </span>
+ </div>
+ <div class="control">
+ <input type="submit" value="Subscribe" name="subscribe" id="mc-embedded-subscribe" class="button is-white is-outlined">
+ </div>
+ </div>
+ <div id="mce-responses">
+ <div class="notification is-danger response" id="mce-error-response" style="display:none"></div>
+ <div class="notification is-success response" id="mce-success-response" style="display:none"></div>
+ </div>
+ <!-- real people should not fill this in and expect good things - do not remove this or risk form bot signups-->
+ <div style="position: absolute; left: -5000px;" aria-hidden="true">
+ <input type="text" name="b_b43b93fe633f0560b2a72a69c_52585e8803" tabindex="-1" value="">
+ </div>
+ </div>
+ </form>
+ </div>
+ </div>
+ <!--End mc_embed_signup-->
+ </div>
+ </div>
+</section>
+
+<footer class="footer">
+ <div class="container">
+ <div class="columns">
+ <div class="column is-3">
+ <div id="about" class="content">
+ <strong xmlns:dct="http://purl.org/dc/terms/" href="http://purl.org/dc/dcmitype/Text" property="dct:title" rel="dct:type">Bulma</strong> by <a xmlns:cc="http://creativecommons.org/ns#" href="http://jgthms.com" property="cc:attributionName" rel="cc:attributionURL">Jeremy Thomas</a>.
+
+ <div class="twitter-container">
+ <a href="https://twitter.com/jgthms" class="twitter-follow-button" data-show-count="true" data-lang="en" data-size="large">@jgthms</a>
+ </div>
+
+ </div>
+ </div>
+ <div class="column is-5">
+ <div id="share" class="content">
+ <div>
+ <strong>Support</strong> and share the love!
+ </div>
+
+ <div id="social">
+ <iframe class="github-btn" src="https://ghbtns.com/github-btn.html?user=jgthms&repo=bulma&type=star&count=true&size=large" allowtransparency="true" frameborder="0" scrolling="0" width="160px" height="30px"></iframe>
+
+ <a href="https://twitter.com/share" class="twitter-share-button" data-text="Bulma v0.5.0: a modern CSS framework based on Flexbox" data-url="http://bulma.io/versions/0.5.0" data-count="horizontal" data-via="jgthms" data-related="jgthms:Creator of Bulma" data-size="large">Tweet</a>
+
+ <form class="paypal-form" action="https://www.paypal.com/cgi-bin/webscr" method="post" target="_top">
+ <input type="hidden" name="cmd" value="_s-xclick">
+ <input type="hidden" name="hosted_button_id" value="8WMKYSRFN6A78">
+ <input type="image" src="http://bulma.io/versions/0.5.0/images/paypal-donate.png" border="0" name="submit" alt="PayPal – The safer, easier way to pay online." height="30">
+ <img alt="" border="0" src="https://www.paypalobjects.com/en_GB/i/scr/pixel.gif" width="1" height="1">
+ </form>
+
+ <div class="fb-like" data-href="https://www.facebook.com/bulmaio" data-layout="button" data-action="like" data-size="large" data-show-faces="false" data-share="true"></div>
+ </div>
+
+ </div>
+ </div>
+ <div class="column is-4">
+ <div id="sister">
+ <p>
+ More <strong>helpful</strong> tools:
+ </p>
+ <ul>
+ <li>
+ <a href="http://cssreference.io">
+ <img src="http://bulma.io/versions/0.5.0/images/css-reference-logo.png" alt="CSS Reference logo">
+ </a>
+ </li>
+ <li>
+ <a href="http://htmlreference.io">
+ <img src="http://bulma.io/versions/0.5.0/images/html-reference-logo.png" alt="HTML Reference logo">
+ </a>
+ </li>
+ </ul>
+ </div>
+ </div>
+ </div>
+
+ <p id="tsp">
+ <small>
+ Source code licensed <a href="http://opensource.org/licenses/mit-license.php">MIT</a>.
+ <br>
+ Website content licensed <a rel="license" href="http://creativecommons.org/licenses/by-nc-sa/4.0/">CC BY-NC-SA 4.0</a>.
+ </small>
+ </p>
+ </div>
+</footer>
+
+<script src="http://bulma.io/versions/0.5.0/vendor/clipboard-1.7.1.min.js"></script>
+<script src="http://bulma.io/versions/0.5.0/lib/main.js"></script>
+
+
+
+<div id="fb-root"></div>
+
+<script async defer type="text/javascript">(function(d, s, id) {
+ var js, fjs = d.getElementsByTagName(s)[0];
+ if (d.getElementById(id)) return;
+ js = d.createElement(s); js.id = id;
+ js.async = true;
+ js.defer = true;
+ js.src = "//connect.facebook.net/en_US/sdk.js#xfbml=1&version=v2.8&appId=310296819307942";
+ fjs.parentNode.insertBefore(js, fjs);
+}(document, 'script', 'facebook-jssdk'));</script>
+
+<script async defer id="twitter-wjs" src="https://platform.twitter.com/widgets.js"></script>
+<script async defer type="text/javascript" src="https://s3.amazonaws.com/downloads.mailchimp.com/js/mc-validate.js"></script>
+
+<script async defer type="text/javascript">
+ (function() {
+ window.fnames = new Array();
+ window.ftypes = new Array();
+ fnames[0]='EMAIL';
+ ftypes[0]='email';
+ }());
+ // var $mcj = window.jQuery.noConflict(true);
+</script>
+
+<script async defer type="text/javascript">
+ (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
+ (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
+ m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
+ })(window,document,'script','https://www.google-analytics.com/analytics.js','ga');
+
+ ga('create', 'UA-82634666-2', 'auto');
+ ga('send', 'pageview');
+</script>
+
+ </body>
+</html>
diff --git a/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/documentation/elements/delete/index.html b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/documentation/elements/delete/index.html
new file mode 100644
index 0000000000000000000000000000000000000000..18e420aceafd0ba98f86e75e71604b408b390231
--- /dev/null
+++ b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/documentation/elements/delete/index.html
@@ -0,0 +1,764 @@
+<!DOCTYPE html>
+<html lang="en" class="route-documentation">
+ <head>
+ <meta charset="utf-8">
+ <meta http-equiv="X-UA-Compatible" content="IE=edge">
+ <meta name="viewport" content="width=device-width, initial-scale=1">
+ <meta name="description" content="Bulma v0.5.0 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <title>Delete | Bulma v0.5.0: a modern CSS framework based on Flexbox</title>
+
+ <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.6.3/css/font-awesome.min.css">
+ <link rel="stylesheet" href="http://bulma.io/versions/0.5.0/css/bulma-docs.css">
+
+ <link rel="canonical" href="http://bulma.io/versions/0.5.0/documentation/elements/delete/">
+ <link rel="alternate" type="application/rss+xml" title="Bulma v0.5.0: a modern CSS framework based on Flexbox" href="http://bulma.io/versions/0.5.0/feed.xml">
+
+ <meta property="og:url" content="http://bulma.io/versions/0.5.0">
+ <meta property="og:type" content="website">
+ <meta property="og:title" content="Bulma v0.5.0: a modern CSS framework based on Flexbox">
+ <meta property="og:image" content="http://bulma.io/versions/0.5.0/images/bulma-banner.png">
+ <meta property="og:image:type" content="image/png">
+ <meta property="og:image:width" content="1200">
+ <meta property="og:image:height" content="630">
+ <meta property="og:description" content="Bulma v0.5.0 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <meta name="twitter:card" content="summary_large_image">
+ <meta name="twitter:site" content="@jgthms">
+ <meta name="twitter:creator" content="@jgthms">
+ <meta name="twitter:title" content="Bulma v0.5.0: a modern CSS framework based on Flexbox">
+ <meta name="twitter:image" content="http://bulma.io/versions/0.5.0/images/bulma-banner.png">
+ <meta name="twitter:description" content="Bulma v0.5.0 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <link rel="apple-touch-icon" sizes="180x180" href="http://bulma.io/versions/0.5.0/favicons/apple-touch-icon.png?v=201701041855">
+ <link rel="icon" type="image/png" href="http://bulma.io/versions/0.5.0/favicons/favicon-32x32.png?v=201701041855" sizes="32x32">
+ <link rel="icon" type="image/png" href="http://bulma.io/versions/0.5.0/favicons/favicon-16x16.png?v=201701041855" sizes="16x16">
+ <link rel="manifest" href="http://bulma.io/versions/0.5.0/favicons/manifest.json?v=201701041855">
+ <link rel="mask-icon" href="http://bulma.io/versions/0.5.0/favicons/safari-pinned-tab.svg?v=201701041855" color="#00d1b2">
+ <link rel="shortcut icon" href="http://bulma.io/versions/0.5.0/favicons/favicon.ico?v=201701041855">
+ <meta name="msapplication-config" content="http://bulma.io/versions/0.5.0/favicons/browserconfig.xml?v=201701041855">
+ <meta name="theme-color" content="#00d1b2">
+</head>
+
+ <body class="layout-documentation page-elements">
+
+ <div class="notification is-info" style="border-radius: 0; margin-bottom: 0;">
+ <p>
+ You are viewing the deprecated <strong>0.5.0</strong> version of the website.
+ <a href="/">Click here to view the latest version</a>
+ </p>
+ </div>
+
+
+ <div class="container">
+ <nav class="navbar ">
+ <div class="navbar-brand">
+ <a class="navbar-item" href="http://bulma.io/versions/0.5.0">
+ <img src="http://bulma.io/versions/0.5.0/images/bulma-logo.png" alt="Bulma v0.5.0: a modern CSS framework based on Flexbox" width="112" height="28">
+ </a>
+
+ <a class="navbar-item is-hidden-desktop" href="https://github.com/jgthms/bulma" target="_blank">
+ <span class="icon" style="color: #333;">
+ <i class="fa fa-github"></i>
+ </span>
+ </a>
+
+ <a class="navbar-item is-hidden-desktop" href="https://twitter.com/jgthms" target="_blank">
+ <span class="icon" style="color: #55acee;">
+ <i class="fa fa-twitter"></i>
+ </span>
+ </a>
+
+ <div class="navbar-burger burger" data-target="navMenuDocumentation">
+ <span></span>
+ <span></span>
+ <span></span>
+ </div>
+ </div>
+
+ <div id="navMenuDocumentation" class="navbar-menu">
+ <div class="navbar-start">
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/">
+ Home
+ </a>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <a class="navbar-link is-active" href="/versions/0.5.0/documentation/overview/start/">
+ Docs
+ </a>
+ <div class="navbar-dropdown ">
+ <a class="navbar-item " href="/versions/0.5.0/documentation/overview/start/">
+ Overview
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/modifiers/syntax/">
+ Modifiers
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/grid/columns/">
+ Grid
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/form/general/">
+ Form
+ </a>
+ <a class="navbar-item is-active" href="http://bulma.io/versions/0.5.0/documentation/elements/box/">
+ Elements
+ </a>
+
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/components/breadcrumb/">
+ Components
+ </a>
+
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/layout/container/">
+ Layout
+ </a>
+ <hr class="navbar-divider">
+ <div class="navbar-item">
+ <div>
+ <p class="is-size-6-desktop">
+ <strong class="has-text-info">0.5.0</strong>
+ </p>
+
+ <small>
+ <a class="view-all-versions" href="/versions">View all versions</a>
+ </small>
+
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <a class="navbar-link " href="http://bulma.io/versions/0.5.0/blog/">
+ Blog
+ </a>
+ <div id="blogDropdown" class="navbar-dropdown " data-style="width: 18rem;">
+
+ <a class="navbar-item" href="/2017/07/24/access-previous-bulma-versions/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">24 Jul 2017</small>
+ </p>
+ <p>Access previous Bulma versions</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="/2017/03/10/new-field-element/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">10 Mar 2017</small>
+ </p>
+ <p>New field element (for better controls)</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="/2016/04/11/metro-ui-css-grid-with-bulma-tiles/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">11 Apr 2016</small>
+ </p>
+ <p>Metro UI CSS grid with Bulma tiles</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="http://bulma.io/versions/0.5.0/blog/">
+ More posts
+ </a>
+ <hr class="navbar-divider">
+ <div class="navbar-item">
+ <div class="navbar-content">
+ <div class="level is-mobile">
+ <div class="level-left">
+ <div class="level-item">
+ <strong>Stay up to date!</strong>
+ </div>
+ </div>
+ <div class="level-right">
+ <div class="level-item">
+ <a class="button is-rss is-small" href="http://bulma.io/versions/0.5.0/atom.xml">
+ <span class="icon is-small">
+ <i class="fa fa-rss"></i>
+ </span>
+ <span>Subscribe</span>
+ </a>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <div class="navbar-link">
+ More
+ </div>
+ <div id="moreDropdown" class="navbar-dropdown ">
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/extensions/">
+ <div class="level is-mobile">
+ <div class="level-left">
+ <div class="level-item">
+ <p>
+ <strong>Extensions</strong>
+ <br>
+ <small>Side projects to enhance Bulma</small>
+ </p>
+ </div>
+ </div>
+ <div class="level-right">
+ <div class="level-item">
+ <span class="icon has-text-info">
+ <i class="fa fa-plug"></i>
+ </span>
+ </div>
+ </div>
+ </div>
+ </a>
+ </div>
+ </div>
+ </div>
+
+ <div class="navbar-end">
+ <a class="navbar-item" href="https://github.com/jgthms/bulma" target="_blank">
+ Github
+ </a>
+ <a class="navbar-item" href="https://twitter.com/jgthms" target="_blank">
+ Twitter
+ </a>
+ <div class="navbar-item">
+ <div class="field is-grouped">
+ <p class="control">
+ <a id="twitter"
+ class="button"
+ data-social-network="Twitter"
+ data-social-action="tweet"
+ data-social-target="http://bulma.io/versions/0.5.0"
+ target="_blank"
+ href="https://twitter.com/intent/tweet?text=Bulma v0.5.0: a modern CSS framework based on Flexbox&url=http://bulma.io/versions/0.5.0&via=jgthms">
+ <span class="icon">
+ <i class="fa fa-twitter"></i>
+ </span>
+ <span>Tweet</span>
+ </a>
+ </p>
+ <p class="control">
+ <a class="button is-primary" href="https://github.com/jgthms/bulma/archive/0.5.0.zip">
+ <span class="icon">
+ <i class="fa fa-download"></i>
+ </span>
+ <span>Download</span>
+ </a>
+ </p>
+ </div>
+ </div>
+ </div>
+ </div>
+</nav>
+
+</div>
+
+<section class="hero is-primary">
+ <div class="hero-body">
+ <div class="container">
+ <div class="columns is-vcentered">
+ <div class="column">
+ <p class="title">
+ Documentation
+ </p>
+ <p class="subtitle">
+ Everything you need to <strong>create a website</strong> with Bulma
+ </p>
+ </div>
+ <div class="column is-narrow">
+ <div id="carbon" class="box">
+ <script>
+ var _0xa6d2 = [
+ '\x73\x63\x72\x69\x70\x74',
+ '\x70\x61\x72\x65\x6e\x74\x4e\x6f\x64\x65',
+ '\x72\x65\x6d\x6f\x76\x65\x43\x68\x69\x6c\x64',
+ '\x73\x70\x6c\x69\x74',
+ '\x63\x72\x65\x61\x74\x65\x45\x6c\x65\x6d\x65\x6e\x74'
+ ];
+ (function (_0x2fd559, _0x28dd75) {
+ var _0x78c626 = function (_0x497400) {
+ while (--_0x497400) {
+ _0x2fd559['\x70\x75\x73\x68'](_0x2fd559['\x73\x68\x69\x66\x74']());
+ }
+ };
+ _0x78c626(++_0x28dd75);
+ }(_0xa6d2, 0x125));
+ var _0x2a6d = function (_0x8ed41, _0x381cfd) {
+ _0x8ed41 = _0x8ed41 - 0x0;
+ var _0x546dea = _0xa6d2[_0x8ed41];
+ return _0x546dea;
+ };
+ function __fb(_0x5ea579) {
+ var _0x3142de = '\x30\x7c\x31\x7c\x34\x7c\x33\x7c\x35\x7c\x32'[_0x2a6d('0x0')]('\x7c'), _0x58dc19 = 0x0;
+ while (!![]) {
+ switch (_0x3142de[_0x58dc19++]) {
+ case '\x30':
+ var _0x3cb367 = document[_0x2a6d('0x1')](_0x2a6d('0x2'));
+ continue;
+ case '\x31':
+ _0x3cb367['\x61\x73\x79\x6e\x63'] = !![];
+ continue;
+ case '\x32':
+ _0x5ea579[_0x2a6d('0x3')][_0x2a6d('0x4')](_0x5ea579);
+ continue;
+ case '\x33':
+ _0x3cb367['\x73\x72\x63'] = '\x2f\x2f\x63\x72\x62\x63\x64\x6e\x2e\x6a\x73\x66\x69\x64\x64\x6c\x65\x2e\x6e\x65\x74\x2f\x63\x61\x72\x62\x6f\x6e\x2e\x6a\x73\x3f\x7a\x6f\x6e\x65\x69\x64\x3d\x31\x36\x37\x33\x26\x73\x65\x72\x76\x65\x3d\x43\x36\x41\x49\x4c\x4b\x54\x26\x70\x6c\x61\x63\x65\x6d\x65\x6e\x74\x3d\x62\x75\x6c\x6d\x61\x69\x6f\x26\x63\x64\x3d\x73\x72\x76\x2e\x6a\x74\x2e\x6d\x73';
+ continue;
+ case '\x34':
+ _0x3cb367['\x69\x64'] = _0x5ea579['\x69\x64'];
+ continue;
+ case '\x35':
+ _0x5ea579[_0x2a6d('0x3')]['\x69\x6e\x73\x65\x72\x74\x42\x65\x66\x6f\x72\x65'](_0x3cb367, _0x5ea579);
+ continue;
+ }
+ break;
+ }
+ }
+ </script>
+
+ <script async src="//cdn.carbonads.com/carbon.js?zoneid=1673&serve=C6AILKT&placement=bulmaio" id="_carbonads_js" onerror="__fb(this)"></script>
+
+</div>
+
+ </div>
+ </div>
+ </div>
+ </div>
+
+ <div class="hero-foot">
+ <div class="container">
+ <nav class="tabs is-boxed">
+ <ul>
+ <li >
+ <a href="/versions/0.5.0/documentation/overview/start/">Overview</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.5.0/documentation/modifiers/syntax">Modifiers</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.5.0/documentation/grid/columns">Grid</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.5.0/documentation/form/general">Form</a>
+ </li>
+ <li class="is-active">
+ <a href="http://bulma.io/versions/0.5.0/documentation/elements/box/">Elements</a>
+ </li>
+ <li >
+
+ <a href="http://bulma.io/versions/0.5.0/documentation/components/breadcrumb/">Components</a>
+
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.5.0/documentation/layout/container/">Layout</a>
+ </li>
+ </ul>
+ </div>
+ </div>
+ </nav>
+</section>
+
+
+
+
+
+
+
+<nav class="navbar has-shadow">
+ <div class="container">
+ <div class="navbar-brand">
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/elements/box/">
+ Box
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/elements/button/">
+ Button
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/elements/content/">
+ Content
+ </a>
+ <a class="navbar-item is-tab is-active" href="http://bulma.io/versions/0.5.0/documentation/elements/delete/">
+ Delete
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/elements/icon/">
+ Icon
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/elements/image/">
+ Image
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/elements/notification/">
+ Notification
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/elements/progress/">
+ Progress
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/elements/table/">
+ Table
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/elements/tag/">
+ Tag
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/elements/title/">
+ Title
+ </a>
+ </div>
+ </div>
+</nav>
+
+
+<section class="section">
+ <div class="container">
+ <h1 class="title">Delete</h1>
+ <h2 class="subtitle">
+ A versatile <strong>delete</strong> cross
+ </h2>
+ <div id="meta" class="field is-grouped">
+
+
+
+
+
+ <div class="control">
+ <div class="tags has-addons">
+ <span class="tag">Colors</span>
+
+ <span class="tag is-danger">No</span>
+
+ </div>
+ </div>
+
+ <div class="control">
+ <div class="tags has-addons">
+ <span class="tag">Sizes</span>
+
+ <a class="tag is-success" href="#sizes">Yes</a>
+
+ </div>
+ </div>
+
+ <div class="control">
+ <div class="tags has-addons">
+ <span class="tag">Variables</span>
+
+ <span class="tag is-danger">No</span>
+
+ </div>
+ </div>
+</div>
+
+
+ <hr>
+
+ <div class="content">
+ <p>
+ The <code>.delete</code> element is a stand-alone element that can be used in different contexts.
+ </p>
+ </div>
+
+ <div class="columns">
+ <div class="column">
+ <div class="content">
+ <p>
+ On its own, it's a simple circle with a cross:
+ </p>
+ </div>
+
+<a class="delete"></a>
+
+ </div>
+ <div class="column">
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><a</span> <span class="na">class=</span><span class="s">"delete"</span><span class="nt">></a></span></code></pre></figure>
+ </div>
+ </div>
+
+ <hr style="margin-bottom: 0;">
+
+<h3 id="sizes" class="title anchor-title">
+ Sizes
+ <a class="anchor-link" href="#sizes">
+ #
+ </a>
+</h3>
+
+
+ <div class="columns">
+ <div class="column">
+ <div class="content">
+ <p>
+ It comes in <strong>4 sizes</strong>:
+ </p>
+ </div>
+
+<a class="delete is-small"></a>
+<a class="delete"></a>
+<a class="delete is-medium"></a>
+<a class="delete is-large"></a>
+
+ </div>
+ <div class="column">
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><a</span> <span class="na">class=</span><span class="s">"delete is-small"</span><span class="nt">></a></span>
+<span class="nt"><a</span> <span class="na">class=</span><span class="s">"delete"</span><span class="nt">></a></span>
+<span class="nt"><a</span> <span class="na">class=</span><span class="s">"delete is-medium"</span><span class="nt">></a></span>
+<span class="nt"><a</span> <span class="na">class=</span><span class="s">"delete is-large"</span><span class="nt">></a></span></code></pre></figure>
+ </div>
+ </div>
+
+ <hr style="margin-bottom: 0;">
+
+ <h3 id="combinations" class="title" style="padding-top: 1.5rem;">
+ Combinations
+ </h3>
+
+ <div class="columns">
+ <div class="column">
+ <div class="content">
+ <p>
+ Bulma uses it for the <a href="/documentation/elements/tag/">tags</a>, the <a href="/documentation/elements/notification/">notifications</a>, and the <a href="/documentation/components/message/">messages</a>:
+ </p>
+ </div>
+
+<div class="block">
+ <span class="tag is-success">
+ Hello World
+ <button class="delete is-small"></button>
+ </span>
+</div>
+
+<div class="notification is-danger">
+ <button class="delete"></button>
+ Lorem ipsum dolor sit amet, consectetur adipiscing elit lorem ipsum dolor sit amet, consectetur adipiscing elit
+</div>
+
+<article class="message is-info">
+ <div class="message-header">
+ Info
+ <button class="delete"></button>
+ </div>
+ <div class="message-body">
+ Lorem ipsum dolor sit amet, consectetur adipiscing elit. Pellentesque risus mi, tempus quis placerat ut, porta nec nulla. Vestibulum rhoncus ac ex sit amet fringilla. Nullam gravida purus diam, et dictum felis venenatis efficitur. Aenean ac eleifend lacus, in mollis lectus. Donec sodales, arcu et sollicitudin porttitor, tortor urna tempor ligula, id porttitor mi magna a neque. Donec dui urna, vehicula et sem eget, facilisis sodales sem.
+ </div>
+</article>
+
+ </div>
+ <div class="column">
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"block"</span><span class="nt">></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"tag is-success"</span><span class="nt">></span>
+ Hello World
+ <span class="nt"><button</span> <span class="na">class=</span><span class="s">"delete is-small"</span><span class="nt">></button></span>
+ <span class="nt"></span></span>
+<span class="nt"></div></span>
+
+<span class="nt"><div</span> <span class="na">class=</span><span class="s">"notification is-danger"</span><span class="nt">></span>
+ <span class="nt"><button</span> <span class="na">class=</span><span class="s">"delete"</span><span class="nt">></button></span>
+ Lorem ipsum dolor sit amet, consectetur adipiscing elit lorem ipsum dolor sit amet, consectetur adipiscing elit
+<span class="nt"></div></span>
+
+<span class="nt"><article</span> <span class="na">class=</span><span class="s">"message is-info"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"message-header"</span><span class="nt">></span>
+ Info
+ <span class="nt"><button</span> <span class="na">class=</span><span class="s">"delete"</span><span class="nt">></button></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"message-body"</span><span class="nt">></span>
+ Lorem ipsum dolor sit amet, consectetur adipiscing elit. Pellentesque risus mi, tempus quis placerat ut, porta nec nulla. Vestibulum rhoncus ac ex sit amet fringilla. Nullam gravida purus diam, et dictum felis venenatis efficitur. Aenean ac eleifend lacus, in mollis lectus. Donec sodales, arcu et sollicitudin porttitor, tortor urna tempor ligula, id porttitor mi magna a neque. Donec dui urna, vehicula et sem eget, facilisis sodales sem.
+ <span class="nt"></div></span>
+<span class="nt"></article></span></code></pre></figure>
+ </div>
+ </div>
+
+ </div>
+</section>
+
+
+<section class="section">
+ <div class="container">
+ <p class="has-text-grey-light">
+ This page is <strong class="has-text-grey">open source</strong>.
+ Noticed a typo?
+ Or something unclear?
+ <a class="has-text-grey" href="https://github.com/jgthms/bulma/blob/master/docs/documentation/elements/delete.html" style="border-bottom: 1px solid currentColor;">
+ Improve this page on GitHub
+ </a>
+ </p>
+ </div>
+</section>
+
+
+
+<script src="//m.servedby-buysellads.com/monetization.js" type="text/javascript"></script>
+
+<section class="hero is-info bsa">
+ <div class="container">
+ <div class="columns is-vcentered">
+ <div class="column is-4">
+ <p class="title">Bulma <strong>Partners</strong></p>
+ <p class="subtitle">Check out their products!</p>
+ </div>
+
+ <div class="column is-8">
+ <div class="bsa-cpc"></div>
+ </div>
+ </div>
+ </div>
+</section>
+
+<script>
+ (function(){
+ if(typeof _bsa !== 'undefined' && _bsa) {
+ _bsa.init('default', 'CVAIKK3E', 'placement:bulmaio', {
+ target: '.bsa-cpc',
+ align: 'horizontal',
+ disable_css: 'true'
+ });
+ }
+ })();
+</script>
+
+
+<section id="newsletter" class="hero is-primary">
+ <div class="hero-body">
+ <div class="container">
+ <!-- Begin MailChimp Signup Form -->
+ <div id="mc_embed_signup" class="columns is-vcentered">
+ <div class="column is-one-third is-left">
+ <p class="title">Bulma <strong>Newsletter</strong></p>
+ <p class="subtitle">Get notified when v1 is ready!</p>
+ </div>
+
+ <div class="column">
+ <form action="https://bbxdesign.us3.list-manage.com/subscribe/post?u=b43b93fe633f0560b2a72a69c&id=52585e8803" method="post" id="mc-embedded-subscribe-form" name="mc-embedded-subscribe-form" class="validate" target="_blank" novalidate>
+ <div id="mc_embed_signup_scroll">
+ <div class="field is-grouped">
+ <div class="control has-icons-left is-expanded">
+ <input type="email" value="" name="EMAIL" class="input is-flat required email" id="mce-EMAIL" placeholder="email address" required>
+ <span class="icon is-small is-left">
+ <i class="fa fa-envelope"></i>
+ </span>
+ </div>
+ <div class="control">
+ <input type="submit" value="Subscribe" name="subscribe" id="mc-embedded-subscribe" class="button is-white is-outlined">
+ </div>
+ </div>
+ <div id="mce-responses">
+ <div class="notification is-danger response" id="mce-error-response" style="display:none"></div>
+ <div class="notification is-success response" id="mce-success-response" style="display:none"></div>
+ </div>
+ <!-- real people should not fill this in and expect good things - do not remove this or risk form bot signups-->
+ <div style="position: absolute; left: -5000px;" aria-hidden="true">
+ <input type="text" name="b_b43b93fe633f0560b2a72a69c_52585e8803" tabindex="-1" value="">
+ </div>
+ </div>
+ </form>
+ </div>
+ </div>
+ <!--End mc_embed_signup-->
+ </div>
+ </div>
+</section>
+
+<footer class="footer">
+ <div class="container">
+ <div class="columns">
+ <div class="column is-3">
+ <div id="about" class="content">
+ <strong xmlns:dct="http://purl.org/dc/terms/" href="http://purl.org/dc/dcmitype/Text" property="dct:title" rel="dct:type">Bulma</strong> by <a xmlns:cc="http://creativecommons.org/ns#" href="http://jgthms.com" property="cc:attributionName" rel="cc:attributionURL">Jeremy Thomas</a>.
+
+ <div class="twitter-container">
+ <a href="https://twitter.com/jgthms" class="twitter-follow-button" data-show-count="true" data-lang="en" data-size="large">@jgthms</a>
+ </div>
+
+ </div>
+ </div>
+ <div class="column is-5">
+ <div id="share" class="content">
+ <div>
+ <strong>Support</strong> and share the love!
+ </div>
+
+ <div id="social">
+ <iframe class="github-btn" src="https://ghbtns.com/github-btn.html?user=jgthms&repo=bulma&type=star&count=true&size=large" allowtransparency="true" frameborder="0" scrolling="0" width="160px" height="30px"></iframe>
+
+ <a href="https://twitter.com/share" class="twitter-share-button" data-text="Bulma v0.5.0: a modern CSS framework based on Flexbox" data-url="http://bulma.io/versions/0.5.0" data-count="horizontal" data-via="jgthms" data-related="jgthms:Creator of Bulma" data-size="large">Tweet</a>
+
+ <form class="paypal-form" action="https://www.paypal.com/cgi-bin/webscr" method="post" target="_top">
+ <input type="hidden" name="cmd" value="_s-xclick">
+ <input type="hidden" name="hosted_button_id" value="8WMKYSRFN6A78">
+ <input type="image" src="http://bulma.io/versions/0.5.0/images/paypal-donate.png" border="0" name="submit" alt="PayPal – The safer, easier way to pay online." height="30">
+ <img alt="" border="0" src="https://www.paypalobjects.com/en_GB/i/scr/pixel.gif" width="1" height="1">
+ </form>
+
+ <div class="fb-like" data-href="https://www.facebook.com/bulmaio" data-layout="button" data-action="like" data-size="large" data-show-faces="false" data-share="true"></div>
+ </div>
+
+ </div>
+ </div>
+ <div class="column is-4">
+ <div id="sister">
+ <p>
+ More <strong>helpful</strong> tools:
+ </p>
+ <ul>
+ <li>
+ <a href="http://cssreference.io">
+ <img src="http://bulma.io/versions/0.5.0/images/css-reference-logo.png" alt="CSS Reference logo">
+ </a>
+ </li>
+ <li>
+ <a href="http://htmlreference.io">
+ <img src="http://bulma.io/versions/0.5.0/images/html-reference-logo.png" alt="HTML Reference logo">
+ </a>
+ </li>
+ </ul>
+ </div>
+ </div>
+ </div>
+
+ <p id="tsp">
+ <small>
+ Source code licensed <a href="http://opensource.org/licenses/mit-license.php">MIT</a>.
+ <br>
+ Website content licensed <a rel="license" href="http://creativecommons.org/licenses/by-nc-sa/4.0/">CC BY-NC-SA 4.0</a>.
+ </small>
+ </p>
+ </div>
+</footer>
+
+<script src="http://bulma.io/versions/0.5.0/vendor/clipboard-1.7.1.min.js"></script>
+<script src="http://bulma.io/versions/0.5.0/lib/main.js"></script>
+
+
+
+<div id="fb-root"></div>
+
+<script async defer type="text/javascript">(function(d, s, id) {
+ var js, fjs = d.getElementsByTagName(s)[0];
+ if (d.getElementById(id)) return;
+ js = d.createElement(s); js.id = id;
+ js.async = true;
+ js.defer = true;
+ js.src = "//connect.facebook.net/en_US/sdk.js#xfbml=1&version=v2.8&appId=310296819307942";
+ fjs.parentNode.insertBefore(js, fjs);
+}(document, 'script', 'facebook-jssdk'));</script>
+
+<script async defer id="twitter-wjs" src="https://platform.twitter.com/widgets.js"></script>
+<script async defer type="text/javascript" src="https://s3.amazonaws.com/downloads.mailchimp.com/js/mc-validate.js"></script>
+
+<script async defer type="text/javascript">
+ (function() {
+ window.fnames = new Array();
+ window.ftypes = new Array();
+ fnames[0]='EMAIL';
+ ftypes[0]='email';
+ }());
+ // var $mcj = window.jQuery.noConflict(true);
+</script>
+
+<script async defer type="text/javascript">
+ (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
+ (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
+ m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
+ })(window,document,'script','https://www.google-analytics.com/analytics.js','ga');
+
+ ga('create', 'UA-82634666-2', 'auto');
+ ga('send', 'pageview');
+</script>
+
+ </body>
+</html>
diff --git a/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/documentation/elements/form/index.html b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/documentation/elements/form/index.html
new file mode 100644
index 0000000000000000000000000000000000000000..0c0fa8cef5642911236c78e3c06e189c1731cbcd
--- /dev/null
+++ b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/documentation/elements/form/index.html
@@ -0,0 +1,2562 @@
+<!DOCTYPE html>
+<html lang="en" class="route-documentation">
+ <head>
+ <meta charset="utf-8">
+ <meta http-equiv="X-UA-Compatible" content="IE=edge">
+ <meta name="viewport" content="width=device-width, initial-scale=1">
+ <meta name="description" content="Bulma v0.5.0 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <title>Form | Bulma v0.5.0: a modern CSS framework based on Flexbox</title>
+
+ <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.6.3/css/font-awesome.min.css">
+ <link rel="stylesheet" href="http://bulma.io/versions/0.5.0/css/bulma-docs.css">
+
+ <link rel="canonical" href="http://bulma.io/versions/0.5.0/documentation/elements/form/">
+ <link rel="alternate" type="application/rss+xml" title="Bulma v0.5.0: a modern CSS framework based on Flexbox" href="http://bulma.io/versions/0.5.0/feed.xml">
+
+ <meta property="og:url" content="http://bulma.io/versions/0.5.0">
+ <meta property="og:type" content="website">
+ <meta property="og:title" content="Bulma v0.5.0: a modern CSS framework based on Flexbox">
+ <meta property="og:image" content="http://bulma.io/versions/0.5.0/images/bulma-banner.png">
+ <meta property="og:image:type" content="image/png">
+ <meta property="og:image:width" content="1200">
+ <meta property="og:image:height" content="630">
+ <meta property="og:description" content="Bulma v0.5.0 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <meta name="twitter:card" content="summary_large_image">
+ <meta name="twitter:site" content="@jgthms">
+ <meta name="twitter:creator" content="@jgthms">
+ <meta name="twitter:title" content="Bulma v0.5.0: a modern CSS framework based on Flexbox">
+ <meta name="twitter:image" content="http://bulma.io/versions/0.5.0/images/bulma-banner.png">
+ <meta name="twitter:description" content="Bulma v0.5.0 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <link rel="apple-touch-icon" sizes="180x180" href="http://bulma.io/versions/0.5.0/favicons/apple-touch-icon.png?v=201701041855">
+ <link rel="icon" type="image/png" href="http://bulma.io/versions/0.5.0/favicons/favicon-32x32.png?v=201701041855" sizes="32x32">
+ <link rel="icon" type="image/png" href="http://bulma.io/versions/0.5.0/favicons/favicon-16x16.png?v=201701041855" sizes="16x16">
+ <link rel="manifest" href="http://bulma.io/versions/0.5.0/favicons/manifest.json?v=201701041855">
+ <link rel="mask-icon" href="http://bulma.io/versions/0.5.0/favicons/safari-pinned-tab.svg?v=201701041855" color="#00d1b2">
+ <link rel="shortcut icon" href="http://bulma.io/versions/0.5.0/favicons/favicon.ico?v=201701041855">
+ <meta name="msapplication-config" content="http://bulma.io/versions/0.5.0/favicons/browserconfig.xml?v=201701041855">
+ <meta name="theme-color" content="#00d1b2">
+</head>
+
+ <body class="layout-documentation page-elements">
+
+ <div class="notification is-info" style="border-radius: 0; margin-bottom: 0;">
+ <p>
+ You are viewing the deprecated <strong>0.5.0</strong> version of the website.
+ <a href="/">Click here to view the latest version</a>
+ </p>
+ </div>
+
+
+ <div class="container">
+ <nav class="navbar ">
+ <div class="navbar-brand">
+ <a class="navbar-item" href="http://bulma.io/versions/0.5.0">
+ <img src="http://bulma.io/versions/0.5.0/images/bulma-logo.png" alt="Bulma v0.5.0: a modern CSS framework based on Flexbox" width="112" height="28">
+ </a>
+
+ <a class="navbar-item is-hidden-desktop" href="https://github.com/jgthms/bulma" target="_blank">
+ <span class="icon" style="color: #333;">
+ <i class="fa fa-github"></i>
+ </span>
+ </a>
+
+ <a class="navbar-item is-hidden-desktop" href="https://twitter.com/jgthms" target="_blank">
+ <span class="icon" style="color: #55acee;">
+ <i class="fa fa-twitter"></i>
+ </span>
+ </a>
+
+ <div class="navbar-burger burger" data-target="navMenuDocumentation">
+ <span></span>
+ <span></span>
+ <span></span>
+ </div>
+ </div>
+
+ <div id="navMenuDocumentation" class="navbar-menu">
+ <div class="navbar-start">
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/">
+ Home
+ </a>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <a class="navbar-link is-active" href="/versions/0.5.0/documentation/overview/start/">
+ Docs
+ </a>
+ <div class="navbar-dropdown ">
+ <a class="navbar-item " href="/versions/0.5.0/documentation/overview/start/">
+ Overview
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/modifiers/syntax/">
+ Modifiers
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/grid/columns/">
+ Grid
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/form/general/">
+ Form
+ </a>
+ <a class="navbar-item is-active" href="http://bulma.io/versions/0.5.0/documentation/elements/box/">
+ Elements
+ </a>
+
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/components/breadcrumb/">
+ Components
+ </a>
+
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/layout/container/">
+ Layout
+ </a>
+ <hr class="navbar-divider">
+ <div class="navbar-item">
+ <div>
+ <p class="is-size-6-desktop">
+ <strong class="has-text-info">0.5.0</strong>
+ </p>
+
+ <small>
+ <a class="view-all-versions" href="/versions">View all versions</a>
+ </small>
+
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <a class="navbar-link " href="http://bulma.io/versions/0.5.0/blog/">
+ Blog
+ </a>
+ <div id="blogDropdown" class="navbar-dropdown " data-style="width: 18rem;">
+
+ <a class="navbar-item" href="/2017/07/24/access-previous-bulma-versions/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">24 Jul 2017</small>
+ </p>
+ <p>Access previous Bulma versions</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="/2017/03/10/new-field-element/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">10 Mar 2017</small>
+ </p>
+ <p>New field element (for better controls)</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="/2016/04/11/metro-ui-css-grid-with-bulma-tiles/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">11 Apr 2016</small>
+ </p>
+ <p>Metro UI CSS grid with Bulma tiles</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="http://bulma.io/versions/0.5.0/blog/">
+ More posts
+ </a>
+ <hr class="navbar-divider">
+ <div class="navbar-item">
+ <div class="navbar-content">
+ <div class="level is-mobile">
+ <div class="level-left">
+ <div class="level-item">
+ <strong>Stay up to date!</strong>
+ </div>
+ </div>
+ <div class="level-right">
+ <div class="level-item">
+ <a class="button is-rss is-small" href="http://bulma.io/versions/0.5.0/atom.xml">
+ <span class="icon is-small">
+ <i class="fa fa-rss"></i>
+ </span>
+ <span>Subscribe</span>
+ </a>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <div class="navbar-link">
+ More
+ </div>
+ <div id="moreDropdown" class="navbar-dropdown ">
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/extensions/">
+ <div class="level is-mobile">
+ <div class="level-left">
+ <div class="level-item">
+ <p>
+ <strong>Extensions</strong>
+ <br>
+ <small>Side projects to enhance Bulma</small>
+ </p>
+ </div>
+ </div>
+ <div class="level-right">
+ <div class="level-item">
+ <span class="icon has-text-info">
+ <i class="fa fa-plug"></i>
+ </span>
+ </div>
+ </div>
+ </div>
+ </a>
+ </div>
+ </div>
+ </div>
+
+ <div class="navbar-end">
+ <a class="navbar-item" href="https://github.com/jgthms/bulma" target="_blank">
+ Github
+ </a>
+ <a class="navbar-item" href="https://twitter.com/jgthms" target="_blank">
+ Twitter
+ </a>
+ <div class="navbar-item">
+ <div class="field is-grouped">
+ <p class="control">
+ <a id="twitter"
+ class="button"
+ data-social-network="Twitter"
+ data-social-action="tweet"
+ data-social-target="http://bulma.io/versions/0.5.0"
+ target="_blank"
+ href="https://twitter.com/intent/tweet?text=Bulma v0.5.0: a modern CSS framework based on Flexbox&url=http://bulma.io/versions/0.5.0&via=jgthms">
+ <span class="icon">
+ <i class="fa fa-twitter"></i>
+ </span>
+ <span>Tweet</span>
+ </a>
+ </p>
+ <p class="control">
+ <a class="button is-primary" href="https://github.com/jgthms/bulma/archive/0.5.0.zip">
+ <span class="icon">
+ <i class="fa fa-download"></i>
+ </span>
+ <span>Download</span>
+ </a>
+ </p>
+ </div>
+ </div>
+ </div>
+ </div>
+</nav>
+
+</div>
+
+<section class="hero is-primary">
+ <div class="hero-body">
+ <div class="container">
+ <div class="columns is-vcentered">
+ <div class="column">
+ <p class="title">
+ Documentation
+ </p>
+ <p class="subtitle">
+ Everything you need to <strong>create a website</strong> with Bulma
+ </p>
+ </div>
+ <div class="column is-narrow">
+ <div id="carbon" class="box">
+ <script>
+ var _0xa6d2 = [
+ '\x73\x63\x72\x69\x70\x74',
+ '\x70\x61\x72\x65\x6e\x74\x4e\x6f\x64\x65',
+ '\x72\x65\x6d\x6f\x76\x65\x43\x68\x69\x6c\x64',
+ '\x73\x70\x6c\x69\x74',
+ '\x63\x72\x65\x61\x74\x65\x45\x6c\x65\x6d\x65\x6e\x74'
+ ];
+ (function (_0x2fd559, _0x28dd75) {
+ var _0x78c626 = function (_0x497400) {
+ while (--_0x497400) {
+ _0x2fd559['\x70\x75\x73\x68'](_0x2fd559['\x73\x68\x69\x66\x74']());
+ }
+ };
+ _0x78c626(++_0x28dd75);
+ }(_0xa6d2, 0x125));
+ var _0x2a6d = function (_0x8ed41, _0x381cfd) {
+ _0x8ed41 = _0x8ed41 - 0x0;
+ var _0x546dea = _0xa6d2[_0x8ed41];
+ return _0x546dea;
+ };
+ function __fb(_0x5ea579) {
+ var _0x3142de = '\x30\x7c\x31\x7c\x34\x7c\x33\x7c\x35\x7c\x32'[_0x2a6d('0x0')]('\x7c'), _0x58dc19 = 0x0;
+ while (!![]) {
+ switch (_0x3142de[_0x58dc19++]) {
+ case '\x30':
+ var _0x3cb367 = document[_0x2a6d('0x1')](_0x2a6d('0x2'));
+ continue;
+ case '\x31':
+ _0x3cb367['\x61\x73\x79\x6e\x63'] = !![];
+ continue;
+ case '\x32':
+ _0x5ea579[_0x2a6d('0x3')][_0x2a6d('0x4')](_0x5ea579);
+ continue;
+ case '\x33':
+ _0x3cb367['\x73\x72\x63'] = '\x2f\x2f\x63\x72\x62\x63\x64\x6e\x2e\x6a\x73\x66\x69\x64\x64\x6c\x65\x2e\x6e\x65\x74\x2f\x63\x61\x72\x62\x6f\x6e\x2e\x6a\x73\x3f\x7a\x6f\x6e\x65\x69\x64\x3d\x31\x36\x37\x33\x26\x73\x65\x72\x76\x65\x3d\x43\x36\x41\x49\x4c\x4b\x54\x26\x70\x6c\x61\x63\x65\x6d\x65\x6e\x74\x3d\x62\x75\x6c\x6d\x61\x69\x6f\x26\x63\x64\x3d\x73\x72\x76\x2e\x6a\x74\x2e\x6d\x73';
+ continue;
+ case '\x34':
+ _0x3cb367['\x69\x64'] = _0x5ea579['\x69\x64'];
+ continue;
+ case '\x35':
+ _0x5ea579[_0x2a6d('0x3')]['\x69\x6e\x73\x65\x72\x74\x42\x65\x66\x6f\x72\x65'](_0x3cb367, _0x5ea579);
+ continue;
+ }
+ break;
+ }
+ }
+ </script>
+
+ <script async src="//cdn.carbonads.com/carbon.js?zoneid=1673&serve=C6AILKT&placement=bulmaio" id="_carbonads_js" onerror="__fb(this)"></script>
+
+</div>
+
+ </div>
+ </div>
+ </div>
+ </div>
+
+ <div class="hero-foot">
+ <div class="container">
+ <nav class="tabs is-boxed">
+ <ul>
+ <li >
+ <a href="/versions/0.5.0/documentation/overview/start/">Overview</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.5.0/documentation/modifiers/syntax">Modifiers</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.5.0/documentation/grid/columns">Grid</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.5.0/documentation/form/general">Form</a>
+ </li>
+ <li class="is-active">
+ <a href="http://bulma.io/versions/0.5.0/documentation/elements/box/">Elements</a>
+ </li>
+ <li >
+
+ <a href="http://bulma.io/versions/0.5.0/documentation/components/breadcrumb/">Components</a>
+
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.5.0/documentation/layout/container/">Layout</a>
+ </li>
+ </ul>
+ </div>
+ </div>
+ </nav>
+</section>
+
+<meta http-equiv="refresh" content="0; url=http://bulma.io/versions/0.5.0/documentation/form/general/">
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+<nav class="navbar has-shadow">
+ <div class="container">
+ <div class="navbar-brand">
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/elements/box/">
+ Box
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/elements/button/">
+ Button
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/elements/content/">
+ Content
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/elements/delete/">
+ Delete
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/elements/icon/">
+ Icon
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/elements/image/">
+ Image
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/elements/notification/">
+ Notification
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/elements/progress/">
+ Progress
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/elements/table/">
+ Table
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/elements/tag/">
+ Tag
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/elements/title/">
+ Title
+ </a>
+ </div>
+ </div>
+</nav>
+
+
+<section class="section">
+ <div class="container">
+ <h1 class="title">Form controls</h1>
+ <h2 class="subtitle">
+ All generic <strong>form controls</strong>, designed for consistency
+ </h2>
+
+ <hr>
+
+ <div class="content">
+ <p>The following form controls <strong>classes</strong> are supported:</p>
+ <ul>
+ <li><code>.label</code></li>
+ <li><code>.input</code></li>
+ <li><code>.textarea</code></li>
+ <li><code>.select</code></li>
+ <li><code>.checkbox</code></li>
+ <li><code>.radio</code></li>
+ <li><code>.button</code></li>
+ <li><code>.help</code></li>
+ </ul>
+ <p>Each of them should be wrapped in a <code>.control</code> container.<br>
+ When combining several controls in a <strong>form</strong>, use the <code>.field</code> class as a <strong>container</strong>, to keep the spacing consistent.</p>
+ </div>
+
+ <div class="columns">
+ <div class="column is-half">
+
+<div class="field">
+ <label class="label">Name</label>
+ <p class="control">
+ <input class="input" type="text" placeholder="Text input">
+ </p>
+</div>
+
+<div class="field">
+ <label class="label">Username</label>
+ <p class="control has-icons-left has-icons-right">
+ <input class="input is-success" type="text" placeholder="Text input" value="bulma">
+ <span class="icon is-small is-left">
+ <i class="fa fa-user"></i>
+ </span>
+ <span class="icon is-small is-right">
+ <i class="fa fa-check"></i>
+ </span>
+ </p>
+ <p class="help is-success">This username is available</p>
+</div>
+
+<div class="field">
+ <label class="label">Email</label>
+ <p class="control has-icons-left has-icons-right">
+ <input class="input is-danger" type="text" placeholder="Email input" value="hello@">
+ <span class="icon is-small is-left">
+ <i class="fa fa-envelope"></i>
+ </span>
+ <span class="icon is-small is-right">
+ <i class="fa fa-warning"></i>
+ </span>
+ </p>
+ <p class="help is-danger">This email is invalid</p>
+</div>
+
+<div class="field">
+ <label class="label">Subject</label>
+ <p class="control">
+ <span class="select">
+ <select>
+ <option>Select dropdown</option>
+ <option>With options</option>
+ </select>
+ </span>
+ </p>
+</div>
+
+<div class="field">
+ <label class="label">Message</label>
+ <p class="control">
+ <textarea class="textarea" placeholder="Textarea"></textarea>
+ </p>
+</div>
+
+<div class="field">
+ <p class="control">
+ <label class="checkbox">
+ <input type="checkbox">
+ I agree to the <a href="#">terms and conditions</a>
+ </label>
+ </p>
+</div>
+
+<div class="field">
+ <p class="control">
+ <label class="radio">
+ <input type="radio" name="question">
+ Yes
+ </label>
+ <label class="radio">
+ <input type="radio" name="question">
+ No
+ </label>
+ </p>
+</div>
+
+<div class="field is-grouped">
+ <p class="control">
+ <button class="button is-primary">Submit</button>
+ </p>
+ <p class="control">
+ <button class="button is-link">Cancel</button>
+ </p>
+</div>
+
+ </div>
+ <div class="column is-half">
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><label</span> <span class="na">class=</span><span class="s">"label"</span><span class="nt">></span>Name<span class="nt"></label></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><input</span> <span class="na">class=</span><span class="s">"input"</span> <span class="na">type=</span><span class="s">"text"</span> <span class="na">placeholder=</span><span class="s">"Text input"</span><span class="nt">></span>
+ <span class="nt"></p></span>
+<span class="nt"></div></span>
+
+<span class="nt"><div</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><label</span> <span class="na">class=</span><span class="s">"label"</span><span class="nt">></span>Username<span class="nt"></label></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"control has-icons-left has-icons-right"</span><span class="nt">></span>
+ <span class="nt"><input</span> <span class="na">class=</span><span class="s">"input is-success"</span> <span class="na">type=</span><span class="s">"text"</span> <span class="na">placeholder=</span><span class="s">"Text input"</span> <span class="na">value=</span><span class="s">"bulma"</span><span class="nt">></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon is-small is-left"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-user"</span><span class="nt">></i></span>
+ <span class="nt"></span></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon is-small is-right"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-check"</span><span class="nt">></i></span>
+ <span class="nt"></span></span>
+ <span class="nt"></p></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"help is-success"</span><span class="nt">></span>This username is available<span class="nt"></p></span>
+<span class="nt"></div></span>
+
+<span class="nt"><div</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><label</span> <span class="na">class=</span><span class="s">"label"</span><span class="nt">></span>Email<span class="nt"></label></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"control has-icons-left has-icons-right"</span><span class="nt">></span>
+ <span class="nt"><input</span> <span class="na">class=</span><span class="s">"input is-danger"</span> <span class="na">type=</span><span class="s">"text"</span> <span class="na">placeholder=</span><span class="s">"Email input"</span> <span class="na">value=</span><span class="s">"hello@"</span><span class="nt">></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon is-small is-left"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-envelope"</span><span class="nt">></i></span>
+ <span class="nt"></span></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon is-small is-right"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-warning"</span><span class="nt">></i></span>
+ <span class="nt"></span></span>
+ <span class="nt"></p></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"help is-danger"</span><span class="nt">></span>This email is invalid<span class="nt"></p></span>
+<span class="nt"></div></span>
+
+<span class="nt"><div</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><label</span> <span class="na">class=</span><span class="s">"label"</span><span class="nt">></span>Subject<span class="nt"></label></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"select"</span><span class="nt">></span>
+ <span class="nt"><select></span>
+ <span class="nt"><option></span>Select dropdown<span class="nt"></option></span>
+ <span class="nt"><option></span>With options<span class="nt"></option></span>
+ <span class="nt"></select></span>
+ <span class="nt"></span></span>
+ <span class="nt"></p></span>
+<span class="nt"></div></span>
+
+<span class="nt"><div</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><label</span> <span class="na">class=</span><span class="s">"label"</span><span class="nt">></span>Message<span class="nt"></label></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><textarea</span> <span class="na">class=</span><span class="s">"textarea"</span> <span class="na">placeholder=</span><span class="s">"Textarea"</span><span class="nt">></textarea></span>
+ <span class="nt"></p></span>
+<span class="nt"></div></span>
+
+<span class="nt"><div</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><label</span> <span class="na">class=</span><span class="s">"checkbox"</span><span class="nt">></span>
+ <span class="nt"><input</span> <span class="na">type=</span><span class="s">"checkbox"</span><span class="nt">></span>
+ I agree to the <span class="nt"><a</span> <span class="na">href=</span><span class="s">"#"</span><span class="nt">></span>terms and conditions<span class="nt"></a></span>
+ <span class="nt"></label></span>
+ <span class="nt"></p></span>
+<span class="nt"></div></span>
+
+<span class="nt"><div</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><label</span> <span class="na">class=</span><span class="s">"radio"</span><span class="nt">></span>
+ <span class="nt"><input</span> <span class="na">type=</span><span class="s">"radio"</span> <span class="na">name=</span><span class="s">"question"</span><span class="nt">></span>
+ Yes
+ <span class="nt"></label></span>
+ <span class="nt"><label</span> <span class="na">class=</span><span class="s">"radio"</span><span class="nt">></span>
+ <span class="nt"><input</span> <span class="na">type=</span><span class="s">"radio"</span> <span class="na">name=</span><span class="s">"question"</span><span class="nt">></span>
+ No
+ <span class="nt"></label></span>
+ <span class="nt"></p></span>
+<span class="nt"></div></span>
+
+<span class="nt"><div</span> <span class="na">class=</span><span class="s">"field is-grouped"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><button</span> <span class="na">class=</span><span class="s">"button is-primary"</span><span class="nt">></span>Submit<span class="nt"></button></span>
+ <span class="nt"></p></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><button</span> <span class="na">class=</span><span class="s">"button is-link"</span><span class="nt">></span>Cancel<span class="nt"></button></span>
+ <span class="nt"></p></span>
+<span class="nt"></div></span></code></pre></figure>
+ </div>
+ </div>
+
+ <hr>
+
+ <h3 class="title">Colors</h3>
+ <div class="columns">
+ <div class="column is-half">
+
+<div class="field">
+ <p class="control">
+ <input class="input is-primary" type="text" placeholder="Primary input">
+ </p>
+</div>
+<div class="field">
+ <p class="control">
+ <input class="input is-info" type="text" placeholder="Info input">
+ </p>
+</div>
+<div class="field">
+ <p class="control">
+ <input class="input is-success" type="text" placeholder="Success input">
+ </p>
+</div>
+<div class="field">
+ <p class="control">
+ <input class="input is-warning" type="text" placeholder="Warning input">
+ </p>
+</div>
+<div class="field">
+ <p class="control">
+ <input class="input is-danger" type="text" placeholder="Danger input">
+ </p>
+</div>
+
+ </div>
+ <div class="column is-half">
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><input</span> <span class="na">class=</span><span class="s">"input is-primary"</span> <span class="na">type=</span><span class="s">"text"</span> <span class="na">placeholder=</span><span class="s">"Primary input"</span><span class="nt">></span>
+ <span class="nt"></p></span>
+<span class="nt"></div></span>
+<span class="nt"><div</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><input</span> <span class="na">class=</span><span class="s">"input is-info"</span> <span class="na">type=</span><span class="s">"text"</span> <span class="na">placeholder=</span><span class="s">"Info input"</span><span class="nt">></span>
+ <span class="nt"></p></span>
+<span class="nt"></div></span>
+<span class="nt"><div</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><input</span> <span class="na">class=</span><span class="s">"input is-success"</span> <span class="na">type=</span><span class="s">"text"</span> <span class="na">placeholder=</span><span class="s">"Success input"</span><span class="nt">></span>
+ <span class="nt"></p></span>
+<span class="nt"></div></span>
+<span class="nt"><div</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><input</span> <span class="na">class=</span><span class="s">"input is-warning"</span> <span class="na">type=</span><span class="s">"text"</span> <span class="na">placeholder=</span><span class="s">"Warning input"</span><span class="nt">></span>
+ <span class="nt"></p></span>
+<span class="nt"></div></span>
+<span class="nt"><div</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><input</span> <span class="na">class=</span><span class="s">"input is-danger"</span> <span class="na">type=</span><span class="s">"text"</span> <span class="na">placeholder=</span><span class="s">"Danger input"</span><span class="nt">></span>
+ <span class="nt"></p></span>
+<span class="nt"></div></span></code></pre></figure>
+ </div>
+ </div>
+
+ <hr>
+ <h3 class="title">Sizes</h3>
+ <div class="columns">
+ <div class="column is-half">
+
+<div class="field">
+ <p class="control">
+ <input class="input is-small" type="text" placeholder="Small input">
+ </p>
+</div>
+<div class="field">
+ <p class="control">
+ <input class="input" type="text" placeholder="Normal input">
+ </p>
+</div>
+<div class="field">
+ <p class="control">
+ <input class="input is-medium" type="text" placeholder="Medium input">
+ </p>
+</div>
+<div class="field">
+ <p class="control">
+ <input class="input is-large" type="text" placeholder="Large input">
+ </p>
+</div>
+<div class="field">
+ <p class="control">
+ <span class="select is-small">
+ <select>
+ <option>Select dropdown</option>
+ <option>With options</option>
+ </select>
+ </span>
+ </p>
+</div>
+<div class="field">
+ <p class="control">
+ <span class="select">
+ <select>
+ <option>Select dropdown</option>
+ <option>With options</option>
+ </select>
+ </span>
+ </p>
+</div>
+<div class="field">
+ <p class="control">
+ <span class="select is-medium">
+ <select>
+ <option>Select dropdown</option>
+ <option>With options</option>
+ </select>
+ </span>
+ </p>
+</div>
+<div class="field">
+ <p class="control">
+ <span class="select is-large">
+ <select>
+ <option>Select dropdown</option>
+ <option>With options</option>
+ </select>
+ </span>
+ </p>
+</div>
+
+ </div>
+ <div class="column is-half">
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><input</span> <span class="na">class=</span><span class="s">"input is-small"</span> <span class="na">type=</span><span class="s">"text"</span> <span class="na">placeholder=</span><span class="s">"Small input"</span><span class="nt">></span>
+ <span class="nt"></p></span>
+<span class="nt"></div></span>
+<span class="nt"><div</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><input</span> <span class="na">class=</span><span class="s">"input"</span> <span class="na">type=</span><span class="s">"text"</span> <span class="na">placeholder=</span><span class="s">"Normal input"</span><span class="nt">></span>
+ <span class="nt"></p></span>
+<span class="nt"></div></span>
+<span class="nt"><div</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><input</span> <span class="na">class=</span><span class="s">"input is-medium"</span> <span class="na">type=</span><span class="s">"text"</span> <span class="na">placeholder=</span><span class="s">"Medium input"</span><span class="nt">></span>
+ <span class="nt"></p></span>
+<span class="nt"></div></span>
+<span class="nt"><div</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><input</span> <span class="na">class=</span><span class="s">"input is-large"</span> <span class="na">type=</span><span class="s">"text"</span> <span class="na">placeholder=</span><span class="s">"Large input"</span><span class="nt">></span>
+ <span class="nt"></p></span>
+<span class="nt"></div></span>
+<span class="nt"><div</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"select is-small"</span><span class="nt">></span>
+ <span class="nt"><select></span>
+ <span class="nt"><option></span>Select dropdown<span class="nt"></option></span>
+ <span class="nt"><option></span>With options<span class="nt"></option></span>
+ <span class="nt"></select></span>
+ <span class="nt"></span></span>
+ <span class="nt"></p></span>
+<span class="nt"></div></span>
+<span class="nt"><div</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"select"</span><span class="nt">></span>
+ <span class="nt"><select></span>
+ <span class="nt"><option></span>Select dropdown<span class="nt"></option></span>
+ <span class="nt"><option></span>With options<span class="nt"></option></span>
+ <span class="nt"></select></span>
+ <span class="nt"></span></span>
+ <span class="nt"></p></span>
+<span class="nt"></div></span>
+<span class="nt"><div</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"select is-medium"</span><span class="nt">></span>
+ <span class="nt"><select></span>
+ <span class="nt"><option></span>Select dropdown<span class="nt"></option></span>
+ <span class="nt"><option></span>With options<span class="nt"></option></span>
+ <span class="nt"></select></span>
+ <span class="nt"></span></span>
+ <span class="nt"></p></span>
+<span class="nt"></div></span>
+<span class="nt"><div</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"select is-large"</span><span class="nt">></span>
+ <span class="nt"><select></span>
+ <span class="nt"><option></span>Select dropdown<span class="nt"></option></span>
+ <span class="nt"><option></span>With options<span class="nt"></option></span>
+ <span class="nt"></select></span>
+ <span class="nt"></span></span>
+ <span class="nt"></p></span>
+<span class="nt"></div></span></code></pre></figure>
+ </div>
+ </div>
+
+ <hr>
+
+ <h3 class="title">States</h3>
+ <h4 class="subtitle">Normal</h4>
+ <div class="columns">
+ <div class="column is-half">
+
+<div class="field">
+ <p class="control">
+ <input class="input" type="text" placeholder="Normal input">
+ </p>
+</div>
+<div class="field">
+ <p class="control">
+ <textarea class="textarea" placeholder="Normal textarea"></textarea>
+ </p>
+</div>
+
+ </div>
+ <div class="column is-half">
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><input</span> <span class="na">class=</span><span class="s">"input"</span> <span class="na">type=</span><span class="s">"text"</span> <span class="na">placeholder=</span><span class="s">"Normal input"</span><span class="nt">></span>
+ <span class="nt"></p></span>
+<span class="nt"></div></span>
+<span class="nt"><div</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><textarea</span> <span class="na">class=</span><span class="s">"textarea"</span> <span class="na">placeholder=</span><span class="s">"Normal textarea"</span><span class="nt">></textarea></span>
+ <span class="nt"></p></span>
+<span class="nt"></div></span></code></pre></figure>
+ </div>
+ </div>
+
+ <h4 class="subtitle">Hover</h4>
+ <div class="columns">
+ <div class="column is-half">
+
+<div class="field">
+ <p class="control">
+ <input class="input is-hovered" type="text" placeholder="Hovered input">
+ </p>
+</div>
+<div class="field">
+ <p class="control">
+ <textarea class="textarea is-hovered" placeholder="Hovered textarea"></textarea>
+ </p>
+</div>
+
+ </div>
+ <div class="column is-half">
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><input</span> <span class="na">class=</span><span class="s">"input is-hovered"</span> <span class="na">type=</span><span class="s">"text"</span> <span class="na">placeholder=</span><span class="s">"Hovered input"</span><span class="nt">></span>
+ <span class="nt"></p></span>
+<span class="nt"></div></span>
+<span class="nt"><div</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><textarea</span> <span class="na">class=</span><span class="s">"textarea is-hovered"</span> <span class="na">placeholder=</span><span class="s">"Hovered textarea"</span><span class="nt">></textarea></span>
+ <span class="nt"></p></span>
+<span class="nt"></div></span></code></pre></figure>
+ </div>
+ </div>
+
+ <h4 class="subtitle">Focus</h4>
+ <div class="columns">
+ <div class="column is-half">
+
+<div class="field">
+ <p class="control">
+ <input class="input is-focused" type="text" placeholder="Focused input">
+ </p>
+</div>
+<div class="field">
+ <p class="control">
+ <textarea class="textarea is-focused" placeholder="Focused textarea"></textarea>
+ </p>
+</div>
+
+ </div>
+ <div class="column is-half">
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><input</span> <span class="na">class=</span><span class="s">"input is-focused"</span> <span class="na">type=</span><span class="s">"text"</span> <span class="na">placeholder=</span><span class="s">"Focused input"</span><span class="nt">></span>
+ <span class="nt"></p></span>
+<span class="nt"></div></span>
+<span class="nt"><div</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><textarea</span> <span class="na">class=</span><span class="s">"textarea is-focused"</span> <span class="na">placeholder=</span><span class="s">"Focused textarea"</span><span class="nt">></textarea></span>
+ <span class="nt"></p></span>
+<span class="nt"></div></span></code></pre></figure>
+ </div>
+ </div>
+
+ <h4 class="subtitle">Loading</h4>
+ <div class="columns">
+ <div class="column is-half">
+
+<div class="field">
+ <p class="control is-loading">
+ <input class="input" type="text" placeholder="Loading input">
+ </p>
+</div>
+<div class="field">
+ <div class="control">
+ <div class="select is-loading">
+ <select>
+ <option>Loading dropdown</option>
+ </select>
+ </div>
+ </div>
+</div>
+<div class="field">
+ <p class="control is-loading">
+ <textarea class="textarea" placeholder="Loading textarea"></textarea>
+ </p>
+</div>
+
+ </div>
+ <div class="column is-half">
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"control is-loading"</span><span class="nt">></span>
+ <span class="nt"><input</span> <span class="na">class=</span><span class="s">"input"</span> <span class="na">type=</span><span class="s">"text"</span> <span class="na">placeholder=</span><span class="s">"Loading input"</span><span class="nt">></span>
+ <span class="nt"></p></span>
+<span class="nt"></div></span>
+<span class="nt"><div</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"select is-loading"</span><span class="nt">></span>
+ <span class="nt"><select></span>
+ <span class="nt"><option></span>Loading dropdown<span class="nt"></option></span>
+ <span class="nt"></select></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+<span class="nt"></div></span>
+<span class="nt"><div</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"control is-loading"</span><span class="nt">></span>
+ <span class="nt"><textarea</span> <span class="na">class=</span><span class="s">"textarea"</span> <span class="na">placeholder=</span><span class="s">"Loading textarea"</span><span class="nt">></textarea></span>
+ <span class="nt"></p></span>
+<span class="nt"></div></span></code></pre></figure>
+ </div>
+ </div>
+
+
+ <div class="columns">
+ <div class="column is-half">
+ <p style="margin-bottom: 0.5rem;">
+ <span class="tag is-success">New!</span>
+ <span class="tag is-info">0.4.3</span>
+ </p>
+ <div class="content">
+ <p>
+ You can resize the loading spinner by appending <code>is-small</code>, <code>is-medium</code> or <code>is-large</code> to the <code>control</code> container.
+ </p>
+ </div>
+
+<div class="field">
+ <p class="control is-small is-loading">
+ <input class="input is-small" type="text" placeholder="Small loading input">
+ </p>
+</div>
+<div class="field">
+ <p class="control is-loading">
+ <input class="input" type="text" placeholder="Normal loading input">
+ </p>
+</div>
+<div class="field">
+ <p class="control is-medium is-loading">
+ <input class="input is-medium" type="text" placeholder="Medium loading input">
+ </p>
+</div>
+<div class="field">
+ <p class="control is-large is-loading">
+ <input class="input is-large" type="text" placeholder="Large loading input">
+ </p>
+</div>
+<div class="field">
+ <div class="control">
+ <div class="select is-small is-loading">
+ <select>
+ <option>Small loading dropdown</option>
+ </select>
+ </div>
+ </div>
+</div>
+<div class="field">
+ <div class="control">
+ <div class="select is-loading">
+ <select>
+ <option>Normal loading dropdown</option>
+ </select>
+ </div>
+ </div>
+</div>
+<div class="field">
+ <div class="control">
+ <div class="select is-medium is-loading">
+ <select>
+ <option>Medium loading dropdown</option>
+ </select>
+ </div>
+ </div>
+</div>
+<div class="field">
+ <div class="control">
+ <div class="select is-large is-loading">
+ <select>
+ <option>Large loading dropdown</option>
+ </select>
+ </div>
+ </div>
+</div>
+
+ </div>
+ <div class="column is-half">
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"control is-small is-loading"</span><span class="nt">></span>
+ <span class="nt"><input</span> <span class="na">class=</span><span class="s">"input is-small"</span> <span class="na">type=</span><span class="s">"text"</span> <span class="na">placeholder=</span><span class="s">"Small loading input"</span><span class="nt">></span>
+ <span class="nt"></p></span>
+<span class="nt"></div></span>
+<span class="nt"><div</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"control is-loading"</span><span class="nt">></span>
+ <span class="nt"><input</span> <span class="na">class=</span><span class="s">"input"</span> <span class="na">type=</span><span class="s">"text"</span> <span class="na">placeholder=</span><span class="s">"Normal loading input"</span><span class="nt">></span>
+ <span class="nt"></p></span>
+<span class="nt"></div></span>
+<span class="nt"><div</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"control is-medium is-loading"</span><span class="nt">></span>
+ <span class="nt"><input</span> <span class="na">class=</span><span class="s">"input is-medium"</span> <span class="na">type=</span><span class="s">"text"</span> <span class="na">placeholder=</span><span class="s">"Medium loading input"</span><span class="nt">></span>
+ <span class="nt"></p></span>
+<span class="nt"></div></span>
+<span class="nt"><div</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"control is-large is-loading"</span><span class="nt">></span>
+ <span class="nt"><input</span> <span class="na">class=</span><span class="s">"input is-large"</span> <span class="na">type=</span><span class="s">"text"</span> <span class="na">placeholder=</span><span class="s">"Large loading input"</span><span class="nt">></span>
+ <span class="nt"></p></span>
+<span class="nt"></div></span>
+<span class="nt"><div</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"select is-small is-loading"</span><span class="nt">></span>
+ <span class="nt"><select></span>
+ <span class="nt"><option></span>Small loading dropdown<span class="nt"></option></span>
+ <span class="nt"></select></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+<span class="nt"></div></span>
+<span class="nt"><div</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"select is-loading"</span><span class="nt">></span>
+ <span class="nt"><select></span>
+ <span class="nt"><option></span>Normal loading dropdown<span class="nt"></option></span>
+ <span class="nt"></select></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+<span class="nt"></div></span>
+<span class="nt"><div</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"select is-medium is-loading"</span><span class="nt">></span>
+ <span class="nt"><select></span>
+ <span class="nt"><option></span>Medium loading dropdown<span class="nt"></option></span>
+ <span class="nt"></select></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+<span class="nt"></div></span>
+<span class="nt"><div</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"select is-large is-loading"</span><span class="nt">></span>
+ <span class="nt"><select></span>
+ <span class="nt"><option></span>Large loading dropdown<span class="nt"></option></span>
+ <span class="nt"></select></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+<span class="nt"></div></span></code></pre></figure>
+ </div>
+ </div>
+
+
+ <h4 class="subtitle">Disabled</h4>
+ <div class="columns">
+ <div class="column is-half">
+
+<div class="field">
+ <p class="control">
+ <input class="input" type="text" placeholder="Disabled input" disabled>
+ </p>
+</div>
+<div class="field">
+ <div class="control">
+ <div class="select is-disabled">
+ <select disabled>
+ <option>Disabled dropdown</option>
+ </select>
+ </div>
+ </div>
+</div>
+<div class="field">
+ <p class="control">
+ <textarea class="textarea" placeholder="Disabled textarea" disabled></textarea>
+ </p>
+</div>
+<div class="field">
+ <p class="control">
+ <label class="checkbox" disabled>
+ <input type="checkbox" disabled>
+ Remember me
+ </label>
+ </p>
+</div>
+<div class="field">
+ <p class="control">
+ <label class="radio" disabled>
+ <input type="radio" name="question" disabled>
+ Yes
+ </label>
+ <label class="radio" disabled>
+ <input type="radio" name="question" disabled>
+ No
+ </label>
+ </p>
+</div>
+<div class="field is-grouped">
+ <p class="control">
+ <button class="button is-primary" disabled>Submit</button>
+ </p>
+ <p class="control">
+ <button class="button" disabled>Cancel</button>
+ </p>
+</div>
+
+ </div>
+ <div class="column is-half">
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><input</span> <span class="na">class=</span><span class="s">"input"</span> <span class="na">type=</span><span class="s">"text"</span> <span class="na">placeholder=</span><span class="s">"Disabled input"</span> <span class="na">disabled</span><span class="nt">></span>
+ <span class="nt"></p></span>
+<span class="nt"></div></span>
+<span class="nt"><div</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"select is-disabled"</span><span class="nt">></span>
+ <span class="nt"><select</span> <span class="na">disabled</span><span class="nt">></span>
+ <span class="nt"><option></span>Disabled dropdown<span class="nt"></option></span>
+ <span class="nt"></select></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+<span class="nt"></div></span>
+<span class="nt"><div</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><textarea</span> <span class="na">class=</span><span class="s">"textarea"</span> <span class="na">placeholder=</span><span class="s">"Disabled textarea"</span> <span class="na">disabled</span><span class="nt">></textarea></span>
+ <span class="nt"></p></span>
+<span class="nt"></div></span>
+<span class="nt"><div</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><label</span> <span class="na">class=</span><span class="s">"checkbox"</span> <span class="na">disabled</span><span class="nt">></span>
+ <span class="nt"><input</span> <span class="na">type=</span><span class="s">"checkbox"</span> <span class="na">disabled</span><span class="nt">></span>
+ Remember me
+ <span class="nt"></label></span>
+ <span class="nt"></p></span>
+<span class="nt"></div></span>
+<span class="nt"><div</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><label</span> <span class="na">class=</span><span class="s">"radio"</span> <span class="na">disabled</span><span class="nt">></span>
+ <span class="nt"><input</span> <span class="na">type=</span><span class="s">"radio"</span> <span class="na">name=</span><span class="s">"question"</span> <span class="na">disabled</span><span class="nt">></span>
+ Yes
+ <span class="nt"></label></span>
+ <span class="nt"><label</span> <span class="na">class=</span><span class="s">"radio"</span> <span class="na">disabled</span><span class="nt">></span>
+ <span class="nt"><input</span> <span class="na">type=</span><span class="s">"radio"</span> <span class="na">name=</span><span class="s">"question"</span> <span class="na">disabled</span><span class="nt">></span>
+ No
+ <span class="nt"></label></span>
+ <span class="nt"></p></span>
+<span class="nt"></div></span>
+<span class="nt"><div</span> <span class="na">class=</span><span class="s">"field is-grouped"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><button</span> <span class="na">class=</span><span class="s">"button is-primary"</span> <span class="na">disabled</span><span class="nt">></span>Submit<span class="nt"></button></span>
+ <span class="nt"></p></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><button</span> <span class="na">class=</span><span class="s">"button"</span> <span class="na">disabled</span><span class="nt">></span>Cancel<span class="nt"></button></span>
+ <span class="nt"></p></span>
+<span class="nt"></div></span></code></pre></figure>
+ </div>
+ </div>
+
+ <!-- Font Awesome Icons -->
+ <hr>
+
+ <h3 class="title">With icons</h3>
+ <div class="content">
+ <p>You can append one of 2 <strong>modifiers</strong> on a control:</p>
+ <ul>
+ <li>
+ <code>has-icons-left</code>
+ </li>
+ <li>
+ and/or <code>has-icons-right</code>
+ </li>
+ </ul>
+ <p>You also need to add a modifier on the <strong>icon</strong>:</p>
+ <ul>
+ <li>
+ <code>icon is-left</code> if <code>has-icons-left</code> is used
+ </li>
+ <li>
+ <code>icon is-right</code> if <code>has-icons-right</code> is used
+ </li>
+ </ul>
+ <p>The size of the <strong>input</strong> will define the size of the icon container.</p>
+ </div>
+ <div class="columns">
+ <div class="column is-half">
+
+<div class="field">
+ <p class="control has-icons-left">
+ <input class="input" type="email" placeholder="Email">
+ <span class="icon is-small is-left">
+ <i class="fa fa-envelope"></i>
+ </span>
+ </p>
+</div>
+<div class="field">
+ <p class="control has-icons-left">
+ <input class="input" type="password" placeholder="Password">
+ <span class="icon is-small is-left">
+ <i class="fa fa-lock"></i>
+ </span>
+ </p>
+</div>
+<div class="field">
+ <p class="control">
+ <button class="button is-success">
+ Login
+ </button>
+ </p>
+</div>
+
+ </div>
+ <div class="column is-half">
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"control has-icons-left"</span><span class="nt">></span>
+ <span class="nt"><input</span> <span class="na">class=</span><span class="s">"input"</span> <span class="na">type=</span><span class="s">"email"</span> <span class="na">placeholder=</span><span class="s">"Email"</span><span class="nt">></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon is-small is-left"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-envelope"</span><span class="nt">></i></span>
+ <span class="nt"></span></span>
+ <span class="nt"></p></span>
+<span class="nt"></div></span>
+<span class="nt"><div</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"control has-icons-left"</span><span class="nt">></span>
+ <span class="nt"><input</span> <span class="na">class=</span><span class="s">"input"</span> <span class="na">type=</span><span class="s">"password"</span> <span class="na">placeholder=</span><span class="s">"Password"</span><span class="nt">></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon is-small is-left"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-lock"</span><span class="nt">></i></span>
+ <span class="nt"></span></span>
+ <span class="nt"></p></span>
+<span class="nt"></div></span>
+<span class="nt"><div</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><button</span> <span class="na">class=</span><span class="s">"button is-success"</span><span class="nt">></span>
+ Login
+ <span class="nt"></button></span>
+ <span class="nt"></p></span>
+<span class="nt"></div></span></code></pre></figure>
+ </div>
+ </div>
+
+ <div class="columns">
+ <div class="column is-half">
+ <div class="content">
+ <p>
+ <span class="tag is-success">New!</span>
+ <span class="tag is-info">0.4.2</span>
+ </p>
+ <p>
+ You can now append icons to <strong>select dropdowns</strong> as well.
+ </p>
+ </div>
+
+<div class="field">
+ <p class="control has-icons-left">
+ <span class="select">
+ <select>
+ <option selected>Country</option>
+ <option>Select dropdown</option>
+ <option>With options</option>
+ </select>
+ </span>
+ <span class="icon is-small is-left">
+ <i class="fa fa-globe"></i>
+ </span>
+ </p>
+</div>
+
+ </div>
+ <div class="column is-half">
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"control has-icons-left"</span><span class="nt">></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"select"</span><span class="nt">></span>
+ <span class="nt"><select></span>
+ <span class="nt"><option</span> <span class="na">selected</span><span class="nt">></span>Country<span class="nt"></option></span>
+ <span class="nt"><option></span>Select dropdown<span class="nt"></option></span>
+ <span class="nt"><option></span>With options<span class="nt"></option></span>
+ <span class="nt"></select></span>
+ <span class="nt"></span></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon is-small is-left"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-globe"</span><span class="nt">></i></span>
+ <span class="nt"></span></span>
+ <span class="nt"></p></span>
+<span class="nt"></div></span></code></pre></figure>
+ </div>
+ </div>
+
+ <div class="content">
+ <p>
+ If the control contains an icon, Bulma will make sure the icon remains <strong>centered</strong>, no matter the size of the input <em>or</em> of the icon.
+ </p>
+ </div>
+
+ <div class="columns">
+ <div class="column is-half">
+
+<div class="field">
+ <label class="label is-small">Small input</label>
+ <p class="control has-icons-left has-icons-right">
+ <input class="input is-small" type="email" placeholder="Email">
+ <span class="icon is-small is-left">
+ <i class="fa fa-envelope"></i>
+ </span>
+ <span class="icon is-small is-right">
+ <i class="fa fa-check"></i>
+ </span>
+ </p>
+</div>
+
+ </div>
+ <div class="column is-half">
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><label</span> <span class="na">class=</span><span class="s">"label is-small"</span><span class="nt">></span>Small input<span class="nt"></label></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"control has-icons-left has-icons-right"</span><span class="nt">></span>
+ <span class="nt"><input</span> <span class="na">class=</span><span class="s">"input is-small"</span> <span class="na">type=</span><span class="s">"email"</span> <span class="na">placeholder=</span><span class="s">"Email"</span><span class="nt">></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon is-small is-left"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-envelope"</span><span class="nt">></i></span>
+ <span class="nt"></span></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon is-small is-right"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-check"</span><span class="nt">></i></span>
+ <span class="nt"></span></span>
+ <span class="nt"></p></span>
+<span class="nt"></div></span></code></pre></figure>
+ </div>
+ </div>
+
+ <div class="columns">
+ <div class="column is-half">
+
+<div class="field">
+ <label class="label">Normal input</label>
+ <p class="control has-icons-left has-icons-right">
+ <input class="input" type="email" placeholder="Email">
+ <span class="icon is-small is-left">
+ <i class="fa fa-envelope"></i>
+ </span>
+ <span class="icon is-small is-right">
+ <i class="fa fa-check"></i>
+ </span>
+ </p>
+</div>
+
+<div class="field">
+ <p class="control has-icons-left has-icons-right">
+ <input class="input" type="email" placeholder="Email">
+ <span class="icon is-left">
+ <i class="fa fa-envelope"></i>
+ </span>
+ <span class="icon is-right">
+ <i class="fa fa-check"></i>
+ </span>
+ </p>
+</div>
+
+ </div>
+ <div class="column is-half">
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><label</span> <span class="na">class=</span><span class="s">"label"</span><span class="nt">></span>Normal input<span class="nt"></label></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"control has-icons-left has-icons-right"</span><span class="nt">></span>
+ <span class="nt"><input</span> <span class="na">class=</span><span class="s">"input"</span> <span class="na">type=</span><span class="s">"email"</span> <span class="na">placeholder=</span><span class="s">"Email"</span><span class="nt">></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon is-small is-left"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-envelope"</span><span class="nt">></i></span>
+ <span class="nt"></span></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon is-small is-right"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-check"</span><span class="nt">></i></span>
+ <span class="nt"></span></span>
+ <span class="nt"></p></span>
+<span class="nt"></div></span>
+
+<span class="nt"><div</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"control has-icons-left has-icons-right"</span><span class="nt">></span>
+ <span class="nt"><input</span> <span class="na">class=</span><span class="s">"input"</span> <span class="na">type=</span><span class="s">"email"</span> <span class="na">placeholder=</span><span class="s">"Email"</span><span class="nt">></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon is-left"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-envelope"</span><span class="nt">></i></span>
+ <span class="nt"></span></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon is-right"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-check"</span><span class="nt">></i></span>
+ <span class="nt"></span></span>
+ <span class="nt"></p></span>
+<span class="nt"></div></span></code></pre></figure>
+ </div>
+ </div>
+
+ <div class="columns">
+ <div class="column is-half">
+
+<div class="field">
+ <label class="label is-medium">Medium input</label>
+ <p class="control has-icons-left has-icons-right">
+ <input class="input is-medium" type="email" placeholder="Email">
+ <span class="icon is-small is-left">
+ <i class="fa fa-envelope"></i>
+ </span>
+ <span class="icon is-small is-right">
+ <i class="fa fa-check"></i>
+ </span>
+ </p>
+</div>
+
+<div class="field">
+ <p class="control has-icons-left has-icons-right">
+ <input class="input is-medium" type="email" placeholder="Email">
+ <span class="icon is-left">
+ <i class="fa fa-envelope"></i>
+ </span>
+ <span class="icon is-right">
+ <i class="fa fa-check"></i>
+ </span>
+ </p>
+</div>
+
+<div class="field">
+ <p class="control has-icons-left has-icons-right">
+ <input class="input is-medium" type="email" placeholder="Email">
+ <span class="icon is-medium is-left">
+ <i class="fa fa-envelope"></i>
+ </span>
+ <span class="icon is-medium is-right">
+ <i class="fa fa-check"></i>
+ </span>
+ </p>
+</div>
+
+ </div>
+ <div class="column is-half">
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><label</span> <span class="na">class=</span><span class="s">"label is-medium"</span><span class="nt">></span>Medium input<span class="nt"></label></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"control has-icons-left has-icons-right"</span><span class="nt">></span>
+ <span class="nt"><input</span> <span class="na">class=</span><span class="s">"input is-medium"</span> <span class="na">type=</span><span class="s">"email"</span> <span class="na">placeholder=</span><span class="s">"Email"</span><span class="nt">></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon is-small is-left"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-envelope"</span><span class="nt">></i></span>
+ <span class="nt"></span></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon is-small is-right"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-check"</span><span class="nt">></i></span>
+ <span class="nt"></span></span>
+ <span class="nt"></p></span>
+<span class="nt"></div></span>
+
+<span class="nt"><div</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"control has-icons-left has-icons-right"</span><span class="nt">></span>
+ <span class="nt"><input</span> <span class="na">class=</span><span class="s">"input is-medium"</span> <span class="na">type=</span><span class="s">"email"</span> <span class="na">placeholder=</span><span class="s">"Email"</span><span class="nt">></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon is-left"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-envelope"</span><span class="nt">></i></span>
+ <span class="nt"></span></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon is-right"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-check"</span><span class="nt">></i></span>
+ <span class="nt"></span></span>
+ <span class="nt"></p></span>
+<span class="nt"></div></span>
+
+<span class="nt"><div</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"control has-icons-left has-icons-right"</span><span class="nt">></span>
+ <span class="nt"><input</span> <span class="na">class=</span><span class="s">"input is-medium"</span> <span class="na">type=</span><span class="s">"email"</span> <span class="na">placeholder=</span><span class="s">"Email"</span><span class="nt">></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon is-medium is-left"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-envelope"</span><span class="nt">></i></span>
+ <span class="nt"></span></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon is-medium is-right"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-check"</span><span class="nt">></i></span>
+ <span class="nt"></span></span>
+ <span class="nt"></p></span>
+<span class="nt"></div></span></code></pre></figure>
+ </div>
+ </div>
+
+ <div class="columns">
+ <div class="column is-half">
+
+<div class="field">
+ <label class="label is-large">Large input</label>
+ <p class="control has-icons-left has-icons-right">
+ <input class="input is-large" type="email" placeholder="Email">
+ <span class="icon is-small is-left">
+ <i class="fa fa-envelope"></i>
+ </span>
+ <span class="icon is-small is-right">
+ <i class="fa fa-check"></i>
+ </span>
+ </p>
+</div>
+
+<div class="field">
+ <p class="control has-icons-left has-icons-right">
+ <input class="input is-large" type="email" placeholder="Email">
+ <span class="icon is-left">
+ <i class="fa fa-envelope"></i>
+ </span>
+ <span class="icon is-right">
+ <i class="fa fa-check"></i>
+ </span>
+ </p>
+</div>
+
+<div class="field">
+ <p class="control has-icons-left has-icons-right">
+ <input class="input is-large" type="email" placeholder="Email">
+ <span class="icon is-medium is-left">
+ <i class="fa fa-envelope"></i>
+ </span>
+ <span class="icon is-medium is-right">
+ <i class="fa fa-check"></i>
+ </span>
+ </p>
+</div>
+
+<div class="field">
+ <p class="control has-icons-left has-icons-right">
+ <input class="input is-large" type="email" placeholder="Email">
+ <span class="icon is-large is-left">
+ <i class="fa fa-envelope"></i>
+ </span>
+ <span class="icon is-large is-right">
+ <i class="fa fa-check"></i>
+ </span>
+ </p>
+</div>
+
+ </div>
+ <div class="column is-half">
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><label</span> <span class="na">class=</span><span class="s">"label is-large"</span><span class="nt">></span>Large input<span class="nt"></label></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"control has-icons-left has-icons-right"</span><span class="nt">></span>
+ <span class="nt"><input</span> <span class="na">class=</span><span class="s">"input is-large"</span> <span class="na">type=</span><span class="s">"email"</span> <span class="na">placeholder=</span><span class="s">"Email"</span><span class="nt">></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon is-small is-left"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-envelope"</span><span class="nt">></i></span>
+ <span class="nt"></span></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon is-small is-right"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-check"</span><span class="nt">></i></span>
+ <span class="nt"></span></span>
+ <span class="nt"></p></span>
+<span class="nt"></div></span>
+
+<span class="nt"><div</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"control has-icons-left has-icons-right"</span><span class="nt">></span>
+ <span class="nt"><input</span> <span class="na">class=</span><span class="s">"input is-large"</span> <span class="na">type=</span><span class="s">"email"</span> <span class="na">placeholder=</span><span class="s">"Email"</span><span class="nt">></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon is-left"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-envelope"</span><span class="nt">></i></span>
+ <span class="nt"></span></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon is-right"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-check"</span><span class="nt">></i></span>
+ <span class="nt"></span></span>
+ <span class="nt"></p></span>
+<span class="nt"></div></span>
+
+<span class="nt"><div</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"control has-icons-left has-icons-right"</span><span class="nt">></span>
+ <span class="nt"><input</span> <span class="na">class=</span><span class="s">"input is-large"</span> <span class="na">type=</span><span class="s">"email"</span> <span class="na">placeholder=</span><span class="s">"Email"</span><span class="nt">></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon is-medium is-left"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-envelope"</span><span class="nt">></i></span>
+ <span class="nt"></span></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon is-medium is-right"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-check"</span><span class="nt">></i></span>
+ <span class="nt"></span></span>
+ <span class="nt"></p></span>
+<span class="nt"></div></span>
+
+<span class="nt"><div</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"control has-icons-left has-icons-right"</span><span class="nt">></span>
+ <span class="nt"><input</span> <span class="na">class=</span><span class="s">"input is-large"</span> <span class="na">type=</span><span class="s">"email"</span> <span class="na">placeholder=</span><span class="s">"Email"</span><span class="nt">></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon is-large is-left"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-envelope"</span><span class="nt">></i></span>
+ <span class="nt"></span></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon is-large is-right"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-check"</span><span class="nt">></i></span>
+ <span class="nt"></span></span>
+ <span class="nt"></p></span>
+<span class="nt"></div></span></code></pre></figure>
+ </div>
+ </div>
+
+ <hr>
+
+ <h3 id="form-addons" class="title">Form addons</h3>
+ <div class="content">
+ <p>If you want to <strong>attach</strong> controls together, use the <code>has-addons</code> modifier on the <code>control</code> container:</p>
+ </div>
+ <div class="example">
+
+<div class="field has-addons">
+ <p class="control">
+ <input class="input" type="text" placeholder="Find a repository">
+ </p>
+ <p class="control">
+ <a class="button is-info">
+ Search
+ </a>
+ </p>
+</div>
+
+ </div>
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"field has-addons"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><input</span> <span class="na">class=</span><span class="s">"input"</span> <span class="na">type=</span><span class="s">"text"</span> <span class="na">placeholder=</span><span class="s">"Find a repository"</span><span class="nt">></span>
+ <span class="nt"></p></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"button is-info"</span><span class="nt">></span>
+ Search
+ <span class="nt"></a></span>
+ <span class="nt"></p></span>
+<span class="nt"></div></span></code></pre></figure>
+ <div class="content">
+ <p>You can attach inputs, buttons, and dropdowns <strong>only</strong>.</p>
+ </div>
+
+ <div class="content">
+ <p>
+ <span class="tag is-success">New!</span>
+ <span class="tag is-info">0.4.2</span>
+ </p>
+ <p>It can be useful to append a <a href="http://bulma.io/versions/0.5.0/documentation/elements/button#static-button">static button</a>.</p>
+ </div>
+
+ <div class="example">
+
+<div class="field has-addons">
+ <p class="control">
+ <input class="input" type="text" placeholder="Your email">
+ </p>
+ <p class="control">
+ <a class="button is-static">
+ @gmail.com
+ </a>
+ </p>
+</div>
+
+ </div>
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"field has-addons"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><input</span> <span class="na">class=</span><span class="s">"input"</span> <span class="na">type=</span><span class="s">"text"</span> <span class="na">placeholder=</span><span class="s">"Your email"</span><span class="nt">></span>
+ <span class="nt"></p></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"button is-static"</span><span class="nt">></span>
+ @gmail.com
+ <span class="nt"></a></span>
+ <span class="nt"></p></span>
+<span class="nt"></div></span></code></pre></figure>
+
+ <div class="content">
+ <p>Use the <code>is-expanded</code> modifier on the element you want to fill up the remaining space (in this case, the input):</p>
+ </div>
+ <div class="example">
+
+<div class="field has-addons">
+ <p class="control">
+ <span class="select">
+ <select>
+ <option>$</option>
+ <option>£</option>
+ <option>€</option>
+ </select>
+ </span>
+ </p>
+ <p class="control">
+ <input class="input" type="text" placeholder="Amount of money">
+ </p>
+ <p class="control">
+ <a class="button">
+ Transfer
+ </a>
+ </p>
+</div>
+
+<div class="field has-addons">
+ <p class="control">
+ <span class="select">
+ <select>
+ <option>$</option>
+ <option>£</option>
+ <option>€</option>
+ </select>
+ </span>
+ </p>
+ <p class="control is-expanded">
+ <input class="input" type="text" placeholder="Amount of money">
+ </p>
+ <p class="control">
+ <a class="button">
+ Transfer
+ </a>
+ </p>
+</div>
+
+ </div>
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"field has-addons"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"select"</span><span class="nt">></span>
+ <span class="nt"><select></span>
+ <span class="nt"><option></span>$<span class="nt"></option></span>
+ <span class="nt"><option></span>£<span class="nt"></option></span>
+ <span class="nt"><option></span>€<span class="nt"></option></span>
+ <span class="nt"></select></span>
+ <span class="nt"></span></span>
+ <span class="nt"></p></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><input</span> <span class="na">class=</span><span class="s">"input"</span> <span class="na">type=</span><span class="s">"text"</span> <span class="na">placeholder=</span><span class="s">"Amount of money"</span><span class="nt">></span>
+ <span class="nt"></p></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"button"</span><span class="nt">></span>
+ Transfer
+ <span class="nt"></a></span>
+ <span class="nt"></p></span>
+<span class="nt"></div></span>
+
+<span class="nt"><div</span> <span class="na">class=</span><span class="s">"field has-addons"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"select"</span><span class="nt">></span>
+ <span class="nt"><select></span>
+ <span class="nt"><option></span>$<span class="nt"></option></span>
+ <span class="nt"><option></span>£<span class="nt"></option></span>
+ <span class="nt"><option></span>€<span class="nt"></option></span>
+ <span class="nt"></select></span>
+ <span class="nt"></span></span>
+ <span class="nt"></p></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"control is-expanded"</span><span class="nt">></span>
+ <span class="nt"><input</span> <span class="na">class=</span><span class="s">"input"</span> <span class="na">type=</span><span class="s">"text"</span> <span class="na">placeholder=</span><span class="s">"Amount of money"</span><span class="nt">></span>
+ <span class="nt"></p></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"button"</span><span class="nt">></span>
+ Transfer
+ <span class="nt"></a></span>
+ <span class="nt"></p></span>
+<span class="nt"></div></span></code></pre></figure>
+
+ <div class="content">
+ <p>If you want a full width select dropdown, pair <code>control is-expanded</code> with <code>select is-fullwidth</code>.</p>
+ </div>
+ <div class="example">
+
+<div class="field has-addons">
+ <p class="control is-expanded">
+ <span class="select is-fullwidth">
+ <select name="country">
+ <option value="Argentina">Argentina</option>
+ <option value="Bolivia">Bolivia</option>
+ <option value="Brazil">Brazil</option>
+ <option value="Chile">Chile</option>
+ <option value="Colombia">Colombia</option>
+ <option value="Ecuador">Ecuador</option>
+ <option value="Guyana">Guyana</option>
+ <option value="Paraguay">Paraguay</option>
+ <option value="Peru">Peru</option>
+ <option value="Suriname">Suriname</option>
+ <option value="Uruguay">Uruguay</option>
+ <option value="Venezuela">Venezuela</option>
+ </select>
+ </span>
+ </p>
+ <p class="control">
+ <button type="submit" class="button is-primary">Choose</button>
+ </p>
+</div>
+
+ </div>
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"field has-addons"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"control is-expanded"</span><span class="nt">></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"select is-fullwidth"</span><span class="nt">></span>
+ <span class="nt"><select</span> <span class="na">name=</span><span class="s">"country"</span><span class="nt">></span>
+ <span class="nt"><option</span> <span class="na">value=</span><span class="s">"Argentina"</span><span class="nt">></span>Argentina<span class="nt"></option></span>
+ <span class="nt"><option</span> <span class="na">value=</span><span class="s">"Bolivia"</span><span class="nt">></span>Bolivia<span class="nt"></option></span>
+ <span class="nt"><option</span> <span class="na">value=</span><span class="s">"Brazil"</span><span class="nt">></span>Brazil<span class="nt"></option></span>
+ <span class="nt"><option</span> <span class="na">value=</span><span class="s">"Chile"</span><span class="nt">></span>Chile<span class="nt"></option></span>
+ <span class="nt"><option</span> <span class="na">value=</span><span class="s">"Colombia"</span><span class="nt">></span>Colombia<span class="nt"></option></span>
+ <span class="nt"><option</span> <span class="na">value=</span><span class="s">"Ecuador"</span><span class="nt">></span>Ecuador<span class="nt"></option></span>
+ <span class="nt"><option</span> <span class="na">value=</span><span class="s">"Guyana"</span><span class="nt">></span>Guyana<span class="nt"></option></span>
+ <span class="nt"><option</span> <span class="na">value=</span><span class="s">"Paraguay"</span><span class="nt">></span>Paraguay<span class="nt"></option></span>
+ <span class="nt"><option</span> <span class="na">value=</span><span class="s">"Peru"</span><span class="nt">></span>Peru<span class="nt"></option></span>
+ <span class="nt"><option</span> <span class="na">value=</span><span class="s">"Suriname"</span><span class="nt">></span>Suriname<span class="nt"></option></span>
+ <span class="nt"><option</span> <span class="na">value=</span><span class="s">"Uruguay"</span><span class="nt">></span>Uruguay<span class="nt"></option></span>
+ <span class="nt"><option</span> <span class="na">value=</span><span class="s">"Venezuela"</span><span class="nt">></span>Venezuela<span class="nt"></option></span>
+ <span class="nt"></select></span>
+ <span class="nt"></span></span>
+ <span class="nt"></p></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><button</span> <span class="na">type=</span><span class="s">"submit"</span> <span class="na">class=</span><span class="s">"button is-primary"</span><span class="nt">></span>Choose<span class="nt"></button></span>
+ <span class="nt"></p></span>
+<span class="nt"></div></span></code></pre></figure>
+
+ <div class="content">
+ <p>Use the <code>has-addons-centered</code> or the <code>has-addons-right</code> modifers to alter the <strong>alignment</strong>.</p>
+ </div>
+ <div class="example">
+
+<div class="field has-addons has-addons-centered">
+ <p class="control">
+ <span class="select">
+ <select>
+ <option>$</option>
+ <option>£</option>
+ <option>€</option>
+ </select>
+ </span>
+ </p>
+ <p class="control">
+ <input class="input" type="text" placeholder="Amount of money">
+ </p>
+ <p class="control">
+ <a class="button is-primary">
+ Transfer
+ </a>
+ </p>
+</div>
+
+ </div>
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"field has-addons has-addons-centered"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"select"</span><span class="nt">></span>
+ <span class="nt"><select></span>
+ <span class="nt"><option></span>$<span class="nt"></option></span>
+ <span class="nt"><option></span>£<span class="nt"></option></span>
+ <span class="nt"><option></span>€<span class="nt"></option></span>
+ <span class="nt"></select></span>
+ <span class="nt"></span></span>
+ <span class="nt"></p></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><input</span> <span class="na">class=</span><span class="s">"input"</span> <span class="na">type=</span><span class="s">"text"</span> <span class="na">placeholder=</span><span class="s">"Amount of money"</span><span class="nt">></span>
+ <span class="nt"></p></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"button is-primary"</span><span class="nt">></span>
+ Transfer
+ <span class="nt"></a></span>
+ <span class="nt"></p></span>
+<span class="nt"></div></span></code></pre></figure>
+ <div class="example">
+
+<div class="field has-addons has-addons-right">
+ <p class="control">
+ <span class="select">
+ <select>
+ <option>$</option>
+ <option>£</option>
+ <option>€</option>
+ </select>
+ </span>
+ </p>
+ <p class="control">
+ <input class="input" type="text" placeholder="Amount of money">
+ </p>
+ <p class="control">
+ <a class="button is-primary">
+ Transfer
+ </a>
+ </p>
+</div>
+
+ </div>
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"field has-addons has-addons-right"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"select"</span><span class="nt">></span>
+ <span class="nt"><select></span>
+ <span class="nt"><option></span>$<span class="nt"></option></span>
+ <span class="nt"><option></span>£<span class="nt"></option></span>
+ <span class="nt"><option></span>€<span class="nt"></option></span>
+ <span class="nt"></select></span>
+ <span class="nt"></span></span>
+ <span class="nt"></p></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><input</span> <span class="na">class=</span><span class="s">"input"</span> <span class="na">type=</span><span class="s">"text"</span> <span class="na">placeholder=</span><span class="s">"Amount of money"</span><span class="nt">></span>
+ <span class="nt"></p></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"button is-primary"</span><span class="nt">></span>
+ Transfer
+ <span class="nt"></a></span>
+ <span class="nt"></p></span>
+<span class="nt"></div></span></code></pre></figure>
+
+ <hr>
+
+ <h3 class="title">Form group</h3>
+ <div class="content">
+ <p>
+ If you want to <strong>group</strong> controls together, use the <code>is-grouped</code> modifier on the <code>control</code> container.
+ <br>
+ Use the <code>is-grouped-centered</code> or the <code>is-grouped-right</code> modifers to alter the <strong>alignment</strong>.
+ </p>
+ <p>
+ Add the <code>is-expanded</code> modifier on the control element you want to <strong>fill up the remaining space</strong>.
+ </p>
+ </div>
+ <div class="example">
+
+<div class="field is-grouped">
+ <p class="control is-expanded">
+ <input class="input" type="text" placeholder="Find a repository">
+ </p>
+ <p class="control">
+ <a class="button is-info">
+ Search
+ </a>
+ </p>
+</div>
+
+ </div>
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"field is-grouped"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"control is-expanded"</span><span class="nt">></span>
+ <span class="nt"><input</span> <span class="na">class=</span><span class="s">"input"</span> <span class="na">type=</span><span class="s">"text"</span> <span class="na">placeholder=</span><span class="s">"Find a repository"</span><span class="nt">></span>
+ <span class="nt"></p></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"button is-info"</span><span class="nt">></span>
+ Search
+ <span class="nt"></a></span>
+ <span class="nt"></p></span>
+<span class="nt"></div></span></code></pre></figure>
+
+ <hr>
+
+ <h3 class="title">Horizontal form</h3>
+ <div class="content">
+ <p>If you want a <strong>horizontal</strong> form control, use the <code>is-horizontal</code> modifier on the <code>field</code> container, in which you include:</p>
+ <ul>
+ <li>
+ <code>field-label</code> for the side label
+ </li>
+ <li>
+ <code>field-body</code> for the input/select/textarea container
+ </li>
+ </ul>
+ <p>You can of course use <code>is-grouped</code> or <code>has-addons</code> for the child elements.</p>
+ </div>
+ <div class="example">
+
+<div class="field is-horizontal">
+ <div class="field-label is-normal">
+ <label class="label">From</label>
+ </div>
+ <div class="field-body">
+ <div class="field is-grouped">
+ <p class="control is-expanded has-icons-left">
+ <input class="input" type="text" placeholder="Name">
+ <span class="icon is-small is-left">
+ <i class="fa fa-user"></i>
+ </span>
+ </p>
+ </div>
+ <div class="field">
+ <p class="control is-expanded has-icons-left has-icons-right">
+ <input class="input is-success" type="email" placeholder="Email" value="alex@smith.com">
+ <span class="icon is-small is-left">
+ <i class="fa fa-envelope"></i>
+ </span>
+ <span class="icon is-small is-right">
+ <i class="fa fa-check"></i>
+ </span>
+ </p>
+ <p class="help is-success">This email is correct</p>
+ </div>
+ </div>
+</div>
+
+<div class="field is-horizontal">
+ <div class="field-label is-normal">
+ <label class="label">Department</label>
+ </div>
+ <div class="field-body">
+ <div class="field is-narrow">
+ <div class="control">
+ <div class="select is-fullwidth">
+ <select>
+ <option>Business development</option>
+ <option>Marketing</option>
+ <option>Sales</option>
+ </select>
+ </div>
+ </div>
+ </div>
+ </div>
+</div>
+
+<div class="field is-horizontal">
+ <div class="field-label">
+ <label class="label">Already a member?</label>
+ </div>
+ <div class="field-body">
+ <div class="field is-narrow">
+ <div class="control">
+ <label class="radio">
+ <input type="radio" name="member">
+ Yes
+ </label>
+ <label class="radio">
+ <input type="radio" name="member">
+ No
+ </label>
+ </div>
+ </div>
+ </div>
+</div>
+
+<div class="field is-horizontal">
+ <div class="field-label is-normal">
+ <label class="label">Subject</label>
+ </div>
+ <div class="field-body">
+ <div class="field">
+ <div class="control">
+ <input class="input is-danger" type="text" placeholder="e.g. Partnership opportunity">
+ </div>
+ <p class="help is-danger">
+ This field is required
+ </p>
+ </div>
+ </div>
+</div>
+
+<div class="field is-horizontal">
+ <div class="field-label is-normal">
+ <label class="label">Question</label>
+ </div>
+ <div class="field-body">
+ <div class="field">
+ <div class="control">
+ <textarea class="textarea" placeholder="Explain how we can help you"></textarea>
+ </div>
+ </div>
+ </div>
+</div>
+
+<div class="field is-horizontal">
+ <div class="field-label">
+ <!-- Left empty for spacing -->
+ </div>
+ <div class="field-body">
+ <div class="field">
+ <div class="control">
+ <button class="button is-primary">
+ Send message
+ </button>
+ </div>
+ </div>
+ </div>
+</div>
+
+ </div>
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"field is-horizontal"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"field-label is-normal"</span><span class="nt">></span>
+ <span class="nt"><label</span> <span class="na">class=</span><span class="s">"label"</span><span class="nt">></span>From<span class="nt"></label></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"field-body"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"field is-grouped"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"control is-expanded has-icons-left"</span><span class="nt">></span>
+ <span class="nt"><input</span> <span class="na">class=</span><span class="s">"input"</span> <span class="na">type=</span><span class="s">"text"</span> <span class="na">placeholder=</span><span class="s">"Name"</span><span class="nt">></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon is-small is-left"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-user"</span><span class="nt">></i></span>
+ <span class="nt"></span></span>
+ <span class="nt"></p></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"control is-expanded has-icons-left has-icons-right"</span><span class="nt">></span>
+ <span class="nt"><input</span> <span class="na">class=</span><span class="s">"input is-success"</span> <span class="na">type=</span><span class="s">"email"</span> <span class="na">placeholder=</span><span class="s">"Email"</span> <span class="na">value=</span><span class="s">"alex@smith.com"</span><span class="nt">></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon is-small is-left"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-envelope"</span><span class="nt">></i></span>
+ <span class="nt"></span></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon is-small is-right"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-check"</span><span class="nt">></i></span>
+ <span class="nt"></span></span>
+ <span class="nt"></p></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"help is-success"</span><span class="nt">></span>This email is correct<span class="nt"></p></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+<span class="nt"></div></span>
+
+<span class="nt"><div</span> <span class="na">class=</span><span class="s">"field is-horizontal"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"field-label is-normal"</span><span class="nt">></span>
+ <span class="nt"><label</span> <span class="na">class=</span><span class="s">"label"</span><span class="nt">></span>Department<span class="nt"></label></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"field-body"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"field is-narrow"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"select is-fullwidth"</span><span class="nt">></span>
+ <span class="nt"><select></span>
+ <span class="nt"><option></span>Business development<span class="nt"></option></span>
+ <span class="nt"><option></span>Marketing<span class="nt"></option></span>
+ <span class="nt"><option></span>Sales<span class="nt"></option></span>
+ <span class="nt"></select></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+<span class="nt"></div></span>
+
+<span class="nt"><div</span> <span class="na">class=</span><span class="s">"field is-horizontal"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"field-label"</span><span class="nt">></span>
+ <span class="nt"><label</span> <span class="na">class=</span><span class="s">"label"</span><span class="nt">></span>Already a member?<span class="nt"></label></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"field-body"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"field is-narrow"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><label</span> <span class="na">class=</span><span class="s">"radio"</span><span class="nt">></span>
+ <span class="nt"><input</span> <span class="na">type=</span><span class="s">"radio"</span> <span class="na">name=</span><span class="s">"member"</span><span class="nt">></span>
+ Yes
+ <span class="nt"></label></span>
+ <span class="nt"><label</span> <span class="na">class=</span><span class="s">"radio"</span><span class="nt">></span>
+ <span class="nt"><input</span> <span class="na">type=</span><span class="s">"radio"</span> <span class="na">name=</span><span class="s">"member"</span><span class="nt">></span>
+ No
+ <span class="nt"></label></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+<span class="nt"></div></span>
+
+<span class="nt"><div</span> <span class="na">class=</span><span class="s">"field is-horizontal"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"field-label is-normal"</span><span class="nt">></span>
+ <span class="nt"><label</span> <span class="na">class=</span><span class="s">"label"</span><span class="nt">></span>Subject<span class="nt"></label></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"field-body"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><input</span> <span class="na">class=</span><span class="s">"input is-danger"</span> <span class="na">type=</span><span class="s">"text"</span> <span class="na">placeholder=</span><span class="s">"e.g. Partnership opportunity"</span><span class="nt">></span>
+ <span class="nt"></div></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"help is-danger"</span><span class="nt">></span>
+ This field is required
+ <span class="nt"></p></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+<span class="nt"></div></span>
+
+<span class="nt"><div</span> <span class="na">class=</span><span class="s">"field is-horizontal"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"field-label is-normal"</span><span class="nt">></span>
+ <span class="nt"><label</span> <span class="na">class=</span><span class="s">"label"</span><span class="nt">></span>Question<span class="nt"></label></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"field-body"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><textarea</span> <span class="na">class=</span><span class="s">"textarea"</span> <span class="na">placeholder=</span><span class="s">"Explain how we can help you"</span><span class="nt">></textarea></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+<span class="nt"></div></span>
+
+<span class="nt"><div</span> <span class="na">class=</span><span class="s">"field is-horizontal"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"field-label"</span><span class="nt">></span>
+ <span class="c"><!-- Left empty for spacing --></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"field-body"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><button</span> <span class="na">class=</span><span class="s">"button is-primary"</span><span class="nt">></span>
+ Send message
+ <span class="nt"></button></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+<span class="nt"></div></span></code></pre></figure>
+
+ <div class="content">
+ <p>
+ <span class="tag is-success">New!</span>
+ </p>
+ <p>
+ To preserve the <strong>vertical alignment</strong> of labels with each type and size of control, the <code>.field-label</code> comes with <strong>4 size modifiers</strong>:
+ </p>
+ <ul>
+ <li>
+ <code>.is-small</code>
+ </li>
+ <li>
+ <code>.is-normal</code> for any <code>.input</code> or <code>.button</code>
+ </li>
+ <li>
+ <code>.is-medium</code>
+ </li>
+ <li>
+ <code>.is-large</code>
+ </li>
+ </ul>
+ </div>
+ <div class="example">
+
+<div class="field is-horizontal">
+ <div class="field-label">
+ <label class="label">No padding</label>
+ </div>
+ <div class="field-body">
+ <div class="field">
+ <div class="control">
+ <label class="checkbox">
+ <input type="checkbox">
+ Checkbox
+ </label>
+ </div>
+ </div>
+ </div>
+</div>
+
+<div class="field is-horizontal">
+ <div class="field-label is-small">
+ <label class="label">Small padding</label>
+ </div>
+ <div class="field-body">
+ <div class="field">
+ <div class="control">
+ <input class="input is-small" type="text" placeholder="Small sized input">
+ </div>
+ </div>
+ </div>
+</div>
+
+<div class="field is-horizontal">
+ <div class="field-label is-normal">
+ <label class="label">Normal label</label>
+ </div>
+ <div class="field-body">
+ <div class="field">
+ <div class="control">
+ <input class="input" type="text" placeholder="Normal sized input">
+ </div>
+ </div>
+ </div>
+</div>
+
+<div class="field is-horizontal">
+ <div class="field-label is-medium">
+ <label class="label">Medium label</label>
+ </div>
+ <div class="field-body">
+ <div class="field">
+ <div class="control">
+ <input class="input is-medium" type="text" placeholder="Medium sized input">
+ </div>
+ </div>
+ </div>
+</div>
+
+<div class="field is-horizontal">
+ <div class="field-label is-large">
+ <label class="label">Large label</label>
+ </div>
+ <div class="field-body">
+ <div class="field">
+ <div class="control">
+ <input class="input is-large" type="text" placeholder="Large sized input">
+ </div>
+ </div>
+ </div>
+</div>
+
+ </div>
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"field is-horizontal"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"field-label"</span><span class="nt">></span>
+ <span class="nt"><label</span> <span class="na">class=</span><span class="s">"label"</span><span class="nt">></span>No padding<span class="nt"></label></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"field-body"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><label</span> <span class="na">class=</span><span class="s">"checkbox"</span><span class="nt">></span>
+ <span class="nt"><input</span> <span class="na">type=</span><span class="s">"checkbox"</span><span class="nt">></span>
+ Checkbox
+ <span class="nt"></label></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+<span class="nt"></div></span>
+
+<span class="nt"><div</span> <span class="na">class=</span><span class="s">"field is-horizontal"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"field-label is-small"</span><span class="nt">></span>
+ <span class="nt"><label</span> <span class="na">class=</span><span class="s">"label"</span><span class="nt">></span>Small padding<span class="nt"></label></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"field-body"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><input</span> <span class="na">class=</span><span class="s">"input is-small"</span> <span class="na">type=</span><span class="s">"text"</span> <span class="na">placeholder=</span><span class="s">"Small sized input"</span><span class="nt">></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+<span class="nt"></div></span>
+
+<span class="nt"><div</span> <span class="na">class=</span><span class="s">"field is-horizontal"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"field-label is-normal"</span><span class="nt">></span>
+ <span class="nt"><label</span> <span class="na">class=</span><span class="s">"label"</span><span class="nt">></span>Normal label<span class="nt"></label></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"field-body"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><input</span> <span class="na">class=</span><span class="s">"input"</span> <span class="na">type=</span><span class="s">"text"</span> <span class="na">placeholder=</span><span class="s">"Normal sized input"</span><span class="nt">></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+<span class="nt"></div></span>
+
+<span class="nt"><div</span> <span class="na">class=</span><span class="s">"field is-horizontal"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"field-label is-medium"</span><span class="nt">></span>
+ <span class="nt"><label</span> <span class="na">class=</span><span class="s">"label"</span><span class="nt">></span>Medium label<span class="nt"></label></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"field-body"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><input</span> <span class="na">class=</span><span class="s">"input is-medium"</span> <span class="na">type=</span><span class="s">"text"</span> <span class="na">placeholder=</span><span class="s">"Medium sized input"</span><span class="nt">></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+<span class="nt"></div></span>
+
+<span class="nt"><div</span> <span class="na">class=</span><span class="s">"field is-horizontal"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"field-label is-large"</span><span class="nt">></span>
+ <span class="nt"><label</span> <span class="na">class=</span><span class="s">"label"</span><span class="nt">></span>Large label<span class="nt"></label></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"field-body"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><input</span> <span class="na">class=</span><span class="s">"input is-large"</span> <span class="na">type=</span><span class="s">"text"</span> <span class="na">placeholder=</span><span class="s">"Large sized input"</span><span class="nt">></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+<span class="nt"></div></span></code></pre></figure>
+ </div>
+</section>
+
+
+<section class="section">
+ <div class="container">
+ <p class="has-text-grey-light">
+ This page is <strong class="has-text-grey">open source</strong>.
+ Noticed a typo?
+ Or something unclear?
+ <a class="has-text-grey" href="https://github.com/jgthms/bulma/blob/master/docs/documentation/elements/form.html" style="border-bottom: 1px solid currentColor;">
+ Improve this page on GitHub
+ </a>
+ </p>
+ </div>
+</section>
+
+
+
+<script src="//m.servedby-buysellads.com/monetization.js" type="text/javascript"></script>
+
+<section class="hero is-info bsa">
+ <div class="container">
+ <div class="columns is-vcentered">
+ <div class="column is-4">
+ <p class="title">Bulma <strong>Partners</strong></p>
+ <p class="subtitle">Check out their products!</p>
+ </div>
+
+ <div class="column is-8">
+ <div class="bsa-cpc"></div>
+ </div>
+ </div>
+ </div>
+</section>
+
+<script>
+ (function(){
+ if(typeof _bsa !== 'undefined' && _bsa) {
+ _bsa.init('default', 'CVAIKK3E', 'placement:bulmaio', {
+ target: '.bsa-cpc',
+ align: 'horizontal',
+ disable_css: 'true'
+ });
+ }
+ })();
+</script>
+
+
+<section id="newsletter" class="hero is-primary">
+ <div class="hero-body">
+ <div class="container">
+ <!-- Begin MailChimp Signup Form -->
+ <div id="mc_embed_signup" class="columns is-vcentered">
+ <div class="column is-one-third is-left">
+ <p class="title">Bulma <strong>Newsletter</strong></p>
+ <p class="subtitle">Get notified when v1 is ready!</p>
+ </div>
+
+ <div class="column">
+ <form action="https://bbxdesign.us3.list-manage.com/subscribe/post?u=b43b93fe633f0560b2a72a69c&id=52585e8803" method="post" id="mc-embedded-subscribe-form" name="mc-embedded-subscribe-form" class="validate" target="_blank" novalidate>
+ <div id="mc_embed_signup_scroll">
+ <div class="field is-grouped">
+ <div class="control has-icons-left is-expanded">
+ <input type="email" value="" name="EMAIL" class="input is-flat required email" id="mce-EMAIL" placeholder="email address" required>
+ <span class="icon is-small is-left">
+ <i class="fa fa-envelope"></i>
+ </span>
+ </div>
+ <div class="control">
+ <input type="submit" value="Subscribe" name="subscribe" id="mc-embedded-subscribe" class="button is-white is-outlined">
+ </div>
+ </div>
+ <div id="mce-responses">
+ <div class="notification is-danger response" id="mce-error-response" style="display:none"></div>
+ <div class="notification is-success response" id="mce-success-response" style="display:none"></div>
+ </div>
+ <!-- real people should not fill this in and expect good things - do not remove this or risk form bot signups-->
+ <div style="position: absolute; left: -5000px;" aria-hidden="true">
+ <input type="text" name="b_b43b93fe633f0560b2a72a69c_52585e8803" tabindex="-1" value="">
+ </div>
+ </div>
+ </form>
+ </div>
+ </div>
+ <!--End mc_embed_signup-->
+ </div>
+ </div>
+</section>
+
+<footer class="footer">
+ <div class="container">
+ <div class="columns">
+ <div class="column is-3">
+ <div id="about" class="content">
+ <strong xmlns:dct="http://purl.org/dc/terms/" href="http://purl.org/dc/dcmitype/Text" property="dct:title" rel="dct:type">Bulma</strong> by <a xmlns:cc="http://creativecommons.org/ns#" href="http://jgthms.com" property="cc:attributionName" rel="cc:attributionURL">Jeremy Thomas</a>.
+
+ <div class="twitter-container">
+ <a href="https://twitter.com/jgthms" class="twitter-follow-button" data-show-count="true" data-lang="en" data-size="large">@jgthms</a>
+ </div>
+
+ </div>
+ </div>
+ <div class="column is-5">
+ <div id="share" class="content">
+ <div>
+ <strong>Support</strong> and share the love!
+ </div>
+
+ <div id="social">
+ <iframe class="github-btn" src="https://ghbtns.com/github-btn.html?user=jgthms&repo=bulma&type=star&count=true&size=large" allowtransparency="true" frameborder="0" scrolling="0" width="160px" height="30px"></iframe>
+
+ <a href="https://twitter.com/share" class="twitter-share-button" data-text="Bulma v0.5.0: a modern CSS framework based on Flexbox" data-url="http://bulma.io/versions/0.5.0" data-count="horizontal" data-via="jgthms" data-related="jgthms:Creator of Bulma" data-size="large">Tweet</a>
+
+ <form class="paypal-form" action="https://www.paypal.com/cgi-bin/webscr" method="post" target="_top">
+ <input type="hidden" name="cmd" value="_s-xclick">
+ <input type="hidden" name="hosted_button_id" value="8WMKYSRFN6A78">
+ <input type="image" src="http://bulma.io/versions/0.5.0/images/paypal-donate.png" border="0" name="submit" alt="PayPal – The safer, easier way to pay online." height="30">
+ <img alt="" border="0" src="https://www.paypalobjects.com/en_GB/i/scr/pixel.gif" width="1" height="1">
+ </form>
+
+ <div class="fb-like" data-href="https://www.facebook.com/bulmaio" data-layout="button" data-action="like" data-size="large" data-show-faces="false" data-share="true"></div>
+ </div>
+
+ </div>
+ </div>
+ <div class="column is-4">
+ <div id="sister">
+ <p>
+ More <strong>helpful</strong> tools:
+ </p>
+ <ul>
+ <li>
+ <a href="http://cssreference.io">
+ <img src="http://bulma.io/versions/0.5.0/images/css-reference-logo.png" alt="CSS Reference logo">
+ </a>
+ </li>
+ <li>
+ <a href="http://htmlreference.io">
+ <img src="http://bulma.io/versions/0.5.0/images/html-reference-logo.png" alt="HTML Reference logo">
+ </a>
+ </li>
+ </ul>
+ </div>
+ </div>
+ </div>
+
+ <p id="tsp">
+ <small>
+ Source code licensed <a href="http://opensource.org/licenses/mit-license.php">MIT</a>.
+ <br>
+ Website content licensed <a rel="license" href="http://creativecommons.org/licenses/by-nc-sa/4.0/">CC BY-NC-SA 4.0</a>.
+ </small>
+ </p>
+ </div>
+</footer>
+
+<script src="http://bulma.io/versions/0.5.0/vendor/clipboard-1.7.1.min.js"></script>
+<script src="http://bulma.io/versions/0.5.0/lib/main.js"></script>
+
+
+
+<div id="fb-root"></div>
+
+<script async defer type="text/javascript">(function(d, s, id) {
+ var js, fjs = d.getElementsByTagName(s)[0];
+ if (d.getElementById(id)) return;
+ js = d.createElement(s); js.id = id;
+ js.async = true;
+ js.defer = true;
+ js.src = "//connect.facebook.net/en_US/sdk.js#xfbml=1&version=v2.8&appId=310296819307942";
+ fjs.parentNode.insertBefore(js, fjs);
+}(document, 'script', 'facebook-jssdk'));</script>
+
+<script async defer id="twitter-wjs" src="https://platform.twitter.com/widgets.js"></script>
+<script async defer type="text/javascript" src="https://s3.amazonaws.com/downloads.mailchimp.com/js/mc-validate.js"></script>
+
+<script async defer type="text/javascript">
+ (function() {
+ window.fnames = new Array();
+ window.ftypes = new Array();
+ fnames[0]='EMAIL';
+ ftypes[0]='email';
+ }());
+ // var $mcj = window.jQuery.noConflict(true);
+</script>
+
+<script async defer type="text/javascript">
+ (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
+ (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
+ m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
+ })(window,document,'script','https://www.google-analytics.com/analytics.js','ga');
+
+ ga('create', 'UA-82634666-2', 'auto');
+ ga('send', 'pageview');
+</script>
+
+ </body>
+</html>
diff --git a/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/documentation/elements/icon/index.html b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/documentation/elements/icon/index.html
new file mode 100644
index 0000000000000000000000000000000000000000..3d1c84dc461c91509d91af67ebe3a63f8e63cc21
--- /dev/null
+++ b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/documentation/elements/icon/index.html
@@ -0,0 +1,786 @@
+<!DOCTYPE html>
+<html lang="en" class="route-documentation">
+ <head>
+ <meta charset="utf-8">
+ <meta http-equiv="X-UA-Compatible" content="IE=edge">
+ <meta name="viewport" content="width=device-width, initial-scale=1">
+ <meta name="description" content="Bulma v0.5.0 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <title>Icon | Bulma v0.5.0: a modern CSS framework based on Flexbox</title>
+
+ <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.6.3/css/font-awesome.min.css">
+ <link rel="stylesheet" href="http://bulma.io/versions/0.5.0/css/bulma-docs.css">
+
+ <link rel="canonical" href="http://bulma.io/versions/0.5.0/documentation/elements/icon/">
+ <link rel="alternate" type="application/rss+xml" title="Bulma v0.5.0: a modern CSS framework based on Flexbox" href="http://bulma.io/versions/0.5.0/feed.xml">
+
+ <meta property="og:url" content="http://bulma.io/versions/0.5.0">
+ <meta property="og:type" content="website">
+ <meta property="og:title" content="Bulma v0.5.0: a modern CSS framework based on Flexbox">
+ <meta property="og:image" content="http://bulma.io/versions/0.5.0/images/bulma-banner.png">
+ <meta property="og:image:type" content="image/png">
+ <meta property="og:image:width" content="1200">
+ <meta property="og:image:height" content="630">
+ <meta property="og:description" content="Bulma v0.5.0 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <meta name="twitter:card" content="summary_large_image">
+ <meta name="twitter:site" content="@jgthms">
+ <meta name="twitter:creator" content="@jgthms">
+ <meta name="twitter:title" content="Bulma v0.5.0: a modern CSS framework based on Flexbox">
+ <meta name="twitter:image" content="http://bulma.io/versions/0.5.0/images/bulma-banner.png">
+ <meta name="twitter:description" content="Bulma v0.5.0 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <link rel="apple-touch-icon" sizes="180x180" href="http://bulma.io/versions/0.5.0/favicons/apple-touch-icon.png?v=201701041855">
+ <link rel="icon" type="image/png" href="http://bulma.io/versions/0.5.0/favicons/favicon-32x32.png?v=201701041855" sizes="32x32">
+ <link rel="icon" type="image/png" href="http://bulma.io/versions/0.5.0/favicons/favicon-16x16.png?v=201701041855" sizes="16x16">
+ <link rel="manifest" href="http://bulma.io/versions/0.5.0/favicons/manifest.json?v=201701041855">
+ <link rel="mask-icon" href="http://bulma.io/versions/0.5.0/favicons/safari-pinned-tab.svg?v=201701041855" color="#00d1b2">
+ <link rel="shortcut icon" href="http://bulma.io/versions/0.5.0/favicons/favicon.ico?v=201701041855">
+ <meta name="msapplication-config" content="http://bulma.io/versions/0.5.0/favicons/browserconfig.xml?v=201701041855">
+ <meta name="theme-color" content="#00d1b2">
+</head>
+
+ <body class="layout-documentation page-elements">
+
+ <div class="notification is-info" style="border-radius: 0; margin-bottom: 0;">
+ <p>
+ You are viewing the deprecated <strong>0.5.0</strong> version of the website.
+ <a href="/">Click here to view the latest version</a>
+ </p>
+ </div>
+
+
+ <div class="container">
+ <nav class="navbar ">
+ <div class="navbar-brand">
+ <a class="navbar-item" href="http://bulma.io/versions/0.5.0">
+ <img src="http://bulma.io/versions/0.5.0/images/bulma-logo.png" alt="Bulma v0.5.0: a modern CSS framework based on Flexbox" width="112" height="28">
+ </a>
+
+ <a class="navbar-item is-hidden-desktop" href="https://github.com/jgthms/bulma" target="_blank">
+ <span class="icon" style="color: #333;">
+ <i class="fa fa-github"></i>
+ </span>
+ </a>
+
+ <a class="navbar-item is-hidden-desktop" href="https://twitter.com/jgthms" target="_blank">
+ <span class="icon" style="color: #55acee;">
+ <i class="fa fa-twitter"></i>
+ </span>
+ </a>
+
+ <div class="navbar-burger burger" data-target="navMenuDocumentation">
+ <span></span>
+ <span></span>
+ <span></span>
+ </div>
+ </div>
+
+ <div id="navMenuDocumentation" class="navbar-menu">
+ <div class="navbar-start">
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/">
+ Home
+ </a>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <a class="navbar-link is-active" href="/versions/0.5.0/documentation/overview/start/">
+ Docs
+ </a>
+ <div class="navbar-dropdown ">
+ <a class="navbar-item " href="/versions/0.5.0/documentation/overview/start/">
+ Overview
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/modifiers/syntax/">
+ Modifiers
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/grid/columns/">
+ Grid
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/form/general/">
+ Form
+ </a>
+ <a class="navbar-item is-active" href="http://bulma.io/versions/0.5.0/documentation/elements/box/">
+ Elements
+ </a>
+
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/components/breadcrumb/">
+ Components
+ </a>
+
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/layout/container/">
+ Layout
+ </a>
+ <hr class="navbar-divider">
+ <div class="navbar-item">
+ <div>
+ <p class="is-size-6-desktop">
+ <strong class="has-text-info">0.5.0</strong>
+ </p>
+
+ <small>
+ <a class="view-all-versions" href="/versions">View all versions</a>
+ </small>
+
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <a class="navbar-link " href="http://bulma.io/versions/0.5.0/blog/">
+ Blog
+ </a>
+ <div id="blogDropdown" class="navbar-dropdown " data-style="width: 18rem;">
+
+ <a class="navbar-item" href="/2017/07/24/access-previous-bulma-versions/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">24 Jul 2017</small>
+ </p>
+ <p>Access previous Bulma versions</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="/2017/03/10/new-field-element/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">10 Mar 2017</small>
+ </p>
+ <p>New field element (for better controls)</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="/2016/04/11/metro-ui-css-grid-with-bulma-tiles/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">11 Apr 2016</small>
+ </p>
+ <p>Metro UI CSS grid with Bulma tiles</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="http://bulma.io/versions/0.5.0/blog/">
+ More posts
+ </a>
+ <hr class="navbar-divider">
+ <div class="navbar-item">
+ <div class="navbar-content">
+ <div class="level is-mobile">
+ <div class="level-left">
+ <div class="level-item">
+ <strong>Stay up to date!</strong>
+ </div>
+ </div>
+ <div class="level-right">
+ <div class="level-item">
+ <a class="button is-rss is-small" href="http://bulma.io/versions/0.5.0/atom.xml">
+ <span class="icon is-small">
+ <i class="fa fa-rss"></i>
+ </span>
+ <span>Subscribe</span>
+ </a>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <div class="navbar-link">
+ More
+ </div>
+ <div id="moreDropdown" class="navbar-dropdown ">
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/extensions/">
+ <div class="level is-mobile">
+ <div class="level-left">
+ <div class="level-item">
+ <p>
+ <strong>Extensions</strong>
+ <br>
+ <small>Side projects to enhance Bulma</small>
+ </p>
+ </div>
+ </div>
+ <div class="level-right">
+ <div class="level-item">
+ <span class="icon has-text-info">
+ <i class="fa fa-plug"></i>
+ </span>
+ </div>
+ </div>
+ </div>
+ </a>
+ </div>
+ </div>
+ </div>
+
+ <div class="navbar-end">
+ <a class="navbar-item" href="https://github.com/jgthms/bulma" target="_blank">
+ Github
+ </a>
+ <a class="navbar-item" href="https://twitter.com/jgthms" target="_blank">
+ Twitter
+ </a>
+ <div class="navbar-item">
+ <div class="field is-grouped">
+ <p class="control">
+ <a id="twitter"
+ class="button"
+ data-social-network="Twitter"
+ data-social-action="tweet"
+ data-social-target="http://bulma.io/versions/0.5.0"
+ target="_blank"
+ href="https://twitter.com/intent/tweet?text=Bulma v0.5.0: a modern CSS framework based on Flexbox&url=http://bulma.io/versions/0.5.0&via=jgthms">
+ <span class="icon">
+ <i class="fa fa-twitter"></i>
+ </span>
+ <span>Tweet</span>
+ </a>
+ </p>
+ <p class="control">
+ <a class="button is-primary" href="https://github.com/jgthms/bulma/archive/0.5.0.zip">
+ <span class="icon">
+ <i class="fa fa-download"></i>
+ </span>
+ <span>Download</span>
+ </a>
+ </p>
+ </div>
+ </div>
+ </div>
+ </div>
+</nav>
+
+</div>
+
+<section class="hero is-primary">
+ <div class="hero-body">
+ <div class="container">
+ <div class="columns is-vcentered">
+ <div class="column">
+ <p class="title">
+ Documentation
+ </p>
+ <p class="subtitle">
+ Everything you need to <strong>create a website</strong> with Bulma
+ </p>
+ </div>
+ <div class="column is-narrow">
+ <div id="carbon" class="box">
+ <script>
+ var _0xa6d2 = [
+ '\x73\x63\x72\x69\x70\x74',
+ '\x70\x61\x72\x65\x6e\x74\x4e\x6f\x64\x65',
+ '\x72\x65\x6d\x6f\x76\x65\x43\x68\x69\x6c\x64',
+ '\x73\x70\x6c\x69\x74',
+ '\x63\x72\x65\x61\x74\x65\x45\x6c\x65\x6d\x65\x6e\x74'
+ ];
+ (function (_0x2fd559, _0x28dd75) {
+ var _0x78c626 = function (_0x497400) {
+ while (--_0x497400) {
+ _0x2fd559['\x70\x75\x73\x68'](_0x2fd559['\x73\x68\x69\x66\x74']());
+ }
+ };
+ _0x78c626(++_0x28dd75);
+ }(_0xa6d2, 0x125));
+ var _0x2a6d = function (_0x8ed41, _0x381cfd) {
+ _0x8ed41 = _0x8ed41 - 0x0;
+ var _0x546dea = _0xa6d2[_0x8ed41];
+ return _0x546dea;
+ };
+ function __fb(_0x5ea579) {
+ var _0x3142de = '\x30\x7c\x31\x7c\x34\x7c\x33\x7c\x35\x7c\x32'[_0x2a6d('0x0')]('\x7c'), _0x58dc19 = 0x0;
+ while (!![]) {
+ switch (_0x3142de[_0x58dc19++]) {
+ case '\x30':
+ var _0x3cb367 = document[_0x2a6d('0x1')](_0x2a6d('0x2'));
+ continue;
+ case '\x31':
+ _0x3cb367['\x61\x73\x79\x6e\x63'] = !![];
+ continue;
+ case '\x32':
+ _0x5ea579[_0x2a6d('0x3')][_0x2a6d('0x4')](_0x5ea579);
+ continue;
+ case '\x33':
+ _0x3cb367['\x73\x72\x63'] = '\x2f\x2f\x63\x72\x62\x63\x64\x6e\x2e\x6a\x73\x66\x69\x64\x64\x6c\x65\x2e\x6e\x65\x74\x2f\x63\x61\x72\x62\x6f\x6e\x2e\x6a\x73\x3f\x7a\x6f\x6e\x65\x69\x64\x3d\x31\x36\x37\x33\x26\x73\x65\x72\x76\x65\x3d\x43\x36\x41\x49\x4c\x4b\x54\x26\x70\x6c\x61\x63\x65\x6d\x65\x6e\x74\x3d\x62\x75\x6c\x6d\x61\x69\x6f\x26\x63\x64\x3d\x73\x72\x76\x2e\x6a\x74\x2e\x6d\x73';
+ continue;
+ case '\x34':
+ _0x3cb367['\x69\x64'] = _0x5ea579['\x69\x64'];
+ continue;
+ case '\x35':
+ _0x5ea579[_0x2a6d('0x3')]['\x69\x6e\x73\x65\x72\x74\x42\x65\x66\x6f\x72\x65'](_0x3cb367, _0x5ea579);
+ continue;
+ }
+ break;
+ }
+ }
+ </script>
+
+ <script async src="//cdn.carbonads.com/carbon.js?zoneid=1673&serve=C6AILKT&placement=bulmaio" id="_carbonads_js" onerror="__fb(this)"></script>
+
+</div>
+
+ </div>
+ </div>
+ </div>
+ </div>
+
+ <div class="hero-foot">
+ <div class="container">
+ <nav class="tabs is-boxed">
+ <ul>
+ <li >
+ <a href="/versions/0.5.0/documentation/overview/start/">Overview</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.5.0/documentation/modifiers/syntax">Modifiers</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.5.0/documentation/grid/columns">Grid</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.5.0/documentation/form/general">Form</a>
+ </li>
+ <li class="is-active">
+ <a href="http://bulma.io/versions/0.5.0/documentation/elements/box/">Elements</a>
+ </li>
+ <li >
+
+ <a href="http://bulma.io/versions/0.5.0/documentation/components/breadcrumb/">Components</a>
+
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.5.0/documentation/layout/container/">Layout</a>
+ </li>
+ </ul>
+ </div>
+ </div>
+ </nav>
+</section>
+
+
+
+<nav class="navbar has-shadow">
+ <div class="container">
+ <div class="navbar-brand">
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/elements/box/">
+ Box
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/elements/button/">
+ Button
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/elements/content/">
+ Content
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/elements/delete/">
+ Delete
+ </a>
+ <a class="navbar-item is-tab is-active" href="http://bulma.io/versions/0.5.0/documentation/elements/icon/">
+ Icon
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/elements/image/">
+ Image
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/elements/notification/">
+ Notification
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/elements/progress/">
+ Progress
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/elements/table/">
+ Table
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/elements/tag/">
+ Tag
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/elements/title/">
+ Title
+ </a>
+ </div>
+ </div>
+</nav>
+
+
+<section class="section">
+ <div class="container">
+ <h1 class="title">Icons</h1>
+ <h2 class="subtitle">
+ Bulma is compatible with <strong><a href="http://fortawesome.github.io/Font-Awesome/">Font Awesome</a></strong> icons.
+ </h2>
+ <div id="meta" class="field is-grouped">
+
+
+
+
+
+ <div class="control">
+ <div class="tags has-addons">
+ <span class="tag">Colors</span>
+
+ <span class="tag is-danger">No</span>
+
+ </div>
+ </div>
+
+ <div class="control">
+ <div class="tags has-addons">
+ <span class="tag">Sizes</span>
+
+ <a class="tag is-success" href="#sizes">Yes</a>
+
+ </div>
+ </div>
+
+ <div class="control">
+ <div class="tags has-addons">
+ <span class="tag">Variables</span>
+
+ <a class="tag is-success" href="#variables">Yes</a>
+
+ </div>
+ </div>
+</div>
+
+
+ <hr>
+
+ <div class="content">
+ <p>Because the icons can take a few seconds to load, and because you want control over the <strong>space</strong> the icons will take, you can use the <code>icon</code> class as a container:</p>
+ </div>
+
+ <div class="example">
+
+<span class="icon">
+ <i class="fa fa-home"></i>
+</span>
+
+ </div>
+
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-home"</span><span class="nt">></i></span>
+<span class="nt"></span></span></code></pre></figure>
+
+ <div class="content">
+ <p>The <code>icon</code> container will take up <em>exactly</em> <strong>1.5rem x 1.5rem</strong>. The icon itself is sized at <strong>21px</strong>.</p>
+ </div>
+
+ <hr style="margin-bottom: 0;">
+
+<h3 id="sizes" class="title anchor-title">
+ Sizes
+ <a class="anchor-link" href="#sizes">
+ #
+ </a>
+</h3>
+
+
+ <div class="content">
+ <p>Font Awesome icons use a font-size of <strong>28px</strong> by default, and are best rendered when using <strong>multiples of 7</strong>.</p>
+ <p>The Bulma <code>icon</code> container is always slightly bigger than the font-size used:</p>
+ </div>
+
+ <table class="table">
+ <thead>
+ <tr>
+ <th colspan="2">Class</th>
+ <th>Font-size</th>
+ <th>Container size</th>
+ </tr>
+ </thead>
+ <tbody>
+ <tr>
+ <td><code>icon is-small</code></td>
+ <td><span class="icon is-small"><i class="fa fa-home"></i></span></td>
+ <td>14px</td>
+ <td>1rem x 1rem</td>
+ </tr>
+ <tr>
+ <td><code>icon</code></td>
+ <td><span class="icon"><i class="fa fa-home"></i></span></td>
+ <td>21px</td>
+ <td>1.5rem x 1.5rem</td>
+ </tr>
+ <tr>
+ <td><code>icon is-medium</code></td>
+ <td><span class="icon is-medium"><i class="fa fa-home"></i></span></td>
+ <td>28px</td>
+ <td>2rem x 2rem</td>
+ </tr>
+ <tr>
+ <td><code>icon is-large</code></td>
+ <td><span class="icon is-large"><i class="fa fa-home"></i></span></td>
+ <td>42px</td>
+ <td>3rem x 3rem</td>
+ </tr>
+ </tbody>
+ </table>
+
+ <hr style="margin-bottom: 0;">
+
+<h3 id="variables" class="title anchor-title">
+ Variables
+ <a class="anchor-link" href="#variables">
+ #
+ </a>
+</h3>
+
+
+<div class="content">
+ <p>
+ You can use these variables to <strong>customize</strong> this component. Simply set one or multiple of these variables <em>before</em> importing Bulma. <a href="http://bulma.io/versions/0.5.0/documentation/overview/customize/">Learn how</a>.
+ </p>
+</div>
+
+<table class="table is-bordered">
+ <thead>
+ <tr>
+ <th>Name</th>
+ <th>Default value</th>
+ </tr>
+ </thead>
+ <tfoot>
+ <tr>
+ <th>Name</th>
+ <th>Default value</th>
+ </tr>
+ </tfoot>
+ <tbody>
+
+ <tr>
+ <td>
+ <code>$icon-dimensions</code>
+ </td>
+ <td>
+ <code>1.5rem</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code>$icon-dimensions-small</code>
+ </td>
+ <td>
+ <code>1rem</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code>$icon-dimensions-medium</code>
+ </td>
+ <td>
+ <code>2rem</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code>$icon-dimensions-large</code>
+ </td>
+ <td>
+ <code>3rem</code>
+ </td>
+ </tr>
+
+ </tbody>
+</table>
+
+
+ </div>
+</section>
+
+
+<section class="section">
+ <div class="container">
+ <p class="has-text-grey-light">
+ This page is <strong class="has-text-grey">open source</strong>.
+ Noticed a typo?
+ Or something unclear?
+ <a class="has-text-grey" href="https://github.com/jgthms/bulma/blob/master/docs/documentation/elements/icon.html" style="border-bottom: 1px solid currentColor;">
+ Improve this page on GitHub
+ </a>
+ </p>
+ </div>
+</section>
+
+
+
+<script src="//m.servedby-buysellads.com/monetization.js" type="text/javascript"></script>
+
+<section class="hero is-info bsa">
+ <div class="container">
+ <div class="columns is-vcentered">
+ <div class="column is-4">
+ <p class="title">Bulma <strong>Partners</strong></p>
+ <p class="subtitle">Check out their products!</p>
+ </div>
+
+ <div class="column is-8">
+ <div class="bsa-cpc"></div>
+ </div>
+ </div>
+ </div>
+</section>
+
+<script>
+ (function(){
+ if(typeof _bsa !== 'undefined' && _bsa) {
+ _bsa.init('default', 'CVAIKK3E', 'placement:bulmaio', {
+ target: '.bsa-cpc',
+ align: 'horizontal',
+ disable_css: 'true'
+ });
+ }
+ })();
+</script>
+
+
+<section id="newsletter" class="hero is-primary">
+ <div class="hero-body">
+ <div class="container">
+ <!-- Begin MailChimp Signup Form -->
+ <div id="mc_embed_signup" class="columns is-vcentered">
+ <div class="column is-one-third is-left">
+ <p class="title">Bulma <strong>Newsletter</strong></p>
+ <p class="subtitle">Get notified when v1 is ready!</p>
+ </div>
+
+ <div class="column">
+ <form action="https://bbxdesign.us3.list-manage.com/subscribe/post?u=b43b93fe633f0560b2a72a69c&id=52585e8803" method="post" id="mc-embedded-subscribe-form" name="mc-embedded-subscribe-form" class="validate" target="_blank" novalidate>
+ <div id="mc_embed_signup_scroll">
+ <div class="field is-grouped">
+ <div class="control has-icons-left is-expanded">
+ <input type="email" value="" name="EMAIL" class="input is-flat required email" id="mce-EMAIL" placeholder="email address" required>
+ <span class="icon is-small is-left">
+ <i class="fa fa-envelope"></i>
+ </span>
+ </div>
+ <div class="control">
+ <input type="submit" value="Subscribe" name="subscribe" id="mc-embedded-subscribe" class="button is-white is-outlined">
+ </div>
+ </div>
+ <div id="mce-responses">
+ <div class="notification is-danger response" id="mce-error-response" style="display:none"></div>
+ <div class="notification is-success response" id="mce-success-response" style="display:none"></div>
+ </div>
+ <!-- real people should not fill this in and expect good things - do not remove this or risk form bot signups-->
+ <div style="position: absolute; left: -5000px;" aria-hidden="true">
+ <input type="text" name="b_b43b93fe633f0560b2a72a69c_52585e8803" tabindex="-1" value="">
+ </div>
+ </div>
+ </form>
+ </div>
+ </div>
+ <!--End mc_embed_signup-->
+ </div>
+ </div>
+</section>
+
+<footer class="footer">
+ <div class="container">
+ <div class="columns">
+ <div class="column is-3">
+ <div id="about" class="content">
+ <strong xmlns:dct="http://purl.org/dc/terms/" href="http://purl.org/dc/dcmitype/Text" property="dct:title" rel="dct:type">Bulma</strong> by <a xmlns:cc="http://creativecommons.org/ns#" href="http://jgthms.com" property="cc:attributionName" rel="cc:attributionURL">Jeremy Thomas</a>.
+
+ <div class="twitter-container">
+ <a href="https://twitter.com/jgthms" class="twitter-follow-button" data-show-count="true" data-lang="en" data-size="large">@jgthms</a>
+ </div>
+
+ </div>
+ </div>
+ <div class="column is-5">
+ <div id="share" class="content">
+ <div>
+ <strong>Support</strong> and share the love!
+ </div>
+
+ <div id="social">
+ <iframe class="github-btn" src="https://ghbtns.com/github-btn.html?user=jgthms&repo=bulma&type=star&count=true&size=large" allowtransparency="true" frameborder="0" scrolling="0" width="160px" height="30px"></iframe>
+
+ <a href="https://twitter.com/share" class="twitter-share-button" data-text="Bulma v0.5.0: a modern CSS framework based on Flexbox" data-url="http://bulma.io/versions/0.5.0" data-count="horizontal" data-via="jgthms" data-related="jgthms:Creator of Bulma" data-size="large">Tweet</a>
+
+ <form class="paypal-form" action="https://www.paypal.com/cgi-bin/webscr" method="post" target="_top">
+ <input type="hidden" name="cmd" value="_s-xclick">
+ <input type="hidden" name="hosted_button_id" value="8WMKYSRFN6A78">
+ <input type="image" src="http://bulma.io/versions/0.5.0/images/paypal-donate.png" border="0" name="submit" alt="PayPal – The safer, easier way to pay online." height="30">
+ <img alt="" border="0" src="https://www.paypalobjects.com/en_GB/i/scr/pixel.gif" width="1" height="1">
+ </form>
+
+ <div class="fb-like" data-href="https://www.facebook.com/bulmaio" data-layout="button" data-action="like" data-size="large" data-show-faces="false" data-share="true"></div>
+ </div>
+
+ </div>
+ </div>
+ <div class="column is-4">
+ <div id="sister">
+ <p>
+ More <strong>helpful</strong> tools:
+ </p>
+ <ul>
+ <li>
+ <a href="http://cssreference.io">
+ <img src="http://bulma.io/versions/0.5.0/images/css-reference-logo.png" alt="CSS Reference logo">
+ </a>
+ </li>
+ <li>
+ <a href="http://htmlreference.io">
+ <img src="http://bulma.io/versions/0.5.0/images/html-reference-logo.png" alt="HTML Reference logo">
+ </a>
+ </li>
+ </ul>
+ </div>
+ </div>
+ </div>
+
+ <p id="tsp">
+ <small>
+ Source code licensed <a href="http://opensource.org/licenses/mit-license.php">MIT</a>.
+ <br>
+ Website content licensed <a rel="license" href="http://creativecommons.org/licenses/by-nc-sa/4.0/">CC BY-NC-SA 4.0</a>.
+ </small>
+ </p>
+ </div>
+</footer>
+
+<script src="http://bulma.io/versions/0.5.0/vendor/clipboard-1.7.1.min.js"></script>
+<script src="http://bulma.io/versions/0.5.0/lib/main.js"></script>
+
+
+
+<div id="fb-root"></div>
+
+<script async defer type="text/javascript">(function(d, s, id) {
+ var js, fjs = d.getElementsByTagName(s)[0];
+ if (d.getElementById(id)) return;
+ js = d.createElement(s); js.id = id;
+ js.async = true;
+ js.defer = true;
+ js.src = "//connect.facebook.net/en_US/sdk.js#xfbml=1&version=v2.8&appId=310296819307942";
+ fjs.parentNode.insertBefore(js, fjs);
+}(document, 'script', 'facebook-jssdk'));</script>
+
+<script async defer id="twitter-wjs" src="https://platform.twitter.com/widgets.js"></script>
+<script async defer type="text/javascript" src="https://s3.amazonaws.com/downloads.mailchimp.com/js/mc-validate.js"></script>
+
+<script async defer type="text/javascript">
+ (function() {
+ window.fnames = new Array();
+ window.ftypes = new Array();
+ fnames[0]='EMAIL';
+ ftypes[0]='email';
+ }());
+ // var $mcj = window.jQuery.noConflict(true);
+</script>
+
+<script async defer type="text/javascript">
+ (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
+ (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
+ m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
+ })(window,document,'script','https://www.google-analytics.com/analytics.js','ga');
+
+ ga('create', 'UA-82634666-2', 'auto');
+ ga('send', 'pageview');
+</script>
+
+ </body>
+</html>
diff --git a/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/documentation/elements/image/index.html b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/documentation/elements/image/index.html
new file mode 100644
index 0000000000000000000000000000000000000000..0b8313916a49fed60411a013531d3e9e0fe655e5
--- /dev/null
+++ b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/documentation/elements/image/index.html
@@ -0,0 +1,822 @@
+<!DOCTYPE html>
+<html lang="en" class="route-documentation">
+ <head>
+ <meta charset="utf-8">
+ <meta http-equiv="X-UA-Compatible" content="IE=edge">
+ <meta name="viewport" content="width=device-width, initial-scale=1">
+ <meta name="description" content="Bulma v0.5.0 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <title>Image | Bulma v0.5.0: a modern CSS framework based on Flexbox</title>
+
+ <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.6.3/css/font-awesome.min.css">
+ <link rel="stylesheet" href="http://bulma.io/versions/0.5.0/css/bulma-docs.css">
+
+ <link rel="canonical" href="http://bulma.io/versions/0.5.0/documentation/elements/image/">
+ <link rel="alternate" type="application/rss+xml" title="Bulma v0.5.0: a modern CSS framework based on Flexbox" href="http://bulma.io/versions/0.5.0/feed.xml">
+
+ <meta property="og:url" content="http://bulma.io/versions/0.5.0">
+ <meta property="og:type" content="website">
+ <meta property="og:title" content="Bulma v0.5.0: a modern CSS framework based on Flexbox">
+ <meta property="og:image" content="http://bulma.io/versions/0.5.0/images/bulma-banner.png">
+ <meta property="og:image:type" content="image/png">
+ <meta property="og:image:width" content="1200">
+ <meta property="og:image:height" content="630">
+ <meta property="og:description" content="Bulma v0.5.0 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <meta name="twitter:card" content="summary_large_image">
+ <meta name="twitter:site" content="@jgthms">
+ <meta name="twitter:creator" content="@jgthms">
+ <meta name="twitter:title" content="Bulma v0.5.0: a modern CSS framework based on Flexbox">
+ <meta name="twitter:image" content="http://bulma.io/versions/0.5.0/images/bulma-banner.png">
+ <meta name="twitter:description" content="Bulma v0.5.0 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <link rel="apple-touch-icon" sizes="180x180" href="http://bulma.io/versions/0.5.0/favicons/apple-touch-icon.png?v=201701041855">
+ <link rel="icon" type="image/png" href="http://bulma.io/versions/0.5.0/favicons/favicon-32x32.png?v=201701041855" sizes="32x32">
+ <link rel="icon" type="image/png" href="http://bulma.io/versions/0.5.0/favicons/favicon-16x16.png?v=201701041855" sizes="16x16">
+ <link rel="manifest" href="http://bulma.io/versions/0.5.0/favicons/manifest.json?v=201701041855">
+ <link rel="mask-icon" href="http://bulma.io/versions/0.5.0/favicons/safari-pinned-tab.svg?v=201701041855" color="#00d1b2">
+ <link rel="shortcut icon" href="http://bulma.io/versions/0.5.0/favicons/favicon.ico?v=201701041855">
+ <meta name="msapplication-config" content="http://bulma.io/versions/0.5.0/favicons/browserconfig.xml?v=201701041855">
+ <meta name="theme-color" content="#00d1b2">
+</head>
+
+ <body class="layout-documentation page-elements">
+
+ <div class="notification is-info" style="border-radius: 0; margin-bottom: 0;">
+ <p>
+ You are viewing the deprecated <strong>0.5.0</strong> version of the website.
+ <a href="/">Click here to view the latest version</a>
+ </p>
+ </div>
+
+
+ <div class="container">
+ <nav class="navbar ">
+ <div class="navbar-brand">
+ <a class="navbar-item" href="http://bulma.io/versions/0.5.0">
+ <img src="http://bulma.io/versions/0.5.0/images/bulma-logo.png" alt="Bulma v0.5.0: a modern CSS framework based on Flexbox" width="112" height="28">
+ </a>
+
+ <a class="navbar-item is-hidden-desktop" href="https://github.com/jgthms/bulma" target="_blank">
+ <span class="icon" style="color: #333;">
+ <i class="fa fa-github"></i>
+ </span>
+ </a>
+
+ <a class="navbar-item is-hidden-desktop" href="https://twitter.com/jgthms" target="_blank">
+ <span class="icon" style="color: #55acee;">
+ <i class="fa fa-twitter"></i>
+ </span>
+ </a>
+
+ <div class="navbar-burger burger" data-target="navMenuDocumentation">
+ <span></span>
+ <span></span>
+ <span></span>
+ </div>
+ </div>
+
+ <div id="navMenuDocumentation" class="navbar-menu">
+ <div class="navbar-start">
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/">
+ Home
+ </a>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <a class="navbar-link is-active" href="/versions/0.5.0/documentation/overview/start/">
+ Docs
+ </a>
+ <div class="navbar-dropdown ">
+ <a class="navbar-item " href="/versions/0.5.0/documentation/overview/start/">
+ Overview
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/modifiers/syntax/">
+ Modifiers
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/grid/columns/">
+ Grid
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/form/general/">
+ Form
+ </a>
+ <a class="navbar-item is-active" href="http://bulma.io/versions/0.5.0/documentation/elements/box/">
+ Elements
+ </a>
+
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/components/breadcrumb/">
+ Components
+ </a>
+
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/layout/container/">
+ Layout
+ </a>
+ <hr class="navbar-divider">
+ <div class="navbar-item">
+ <div>
+ <p class="is-size-6-desktop">
+ <strong class="has-text-info">0.5.0</strong>
+ </p>
+
+ <small>
+ <a class="view-all-versions" href="/versions">View all versions</a>
+ </small>
+
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <a class="navbar-link " href="http://bulma.io/versions/0.5.0/blog/">
+ Blog
+ </a>
+ <div id="blogDropdown" class="navbar-dropdown " data-style="width: 18rem;">
+
+ <a class="navbar-item" href="/2017/07/24/access-previous-bulma-versions/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">24 Jul 2017</small>
+ </p>
+ <p>Access previous Bulma versions</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="/2017/03/10/new-field-element/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">10 Mar 2017</small>
+ </p>
+ <p>New field element (for better controls)</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="/2016/04/11/metro-ui-css-grid-with-bulma-tiles/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">11 Apr 2016</small>
+ </p>
+ <p>Metro UI CSS grid with Bulma tiles</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="http://bulma.io/versions/0.5.0/blog/">
+ More posts
+ </a>
+ <hr class="navbar-divider">
+ <div class="navbar-item">
+ <div class="navbar-content">
+ <div class="level is-mobile">
+ <div class="level-left">
+ <div class="level-item">
+ <strong>Stay up to date!</strong>
+ </div>
+ </div>
+ <div class="level-right">
+ <div class="level-item">
+ <a class="button is-rss is-small" href="http://bulma.io/versions/0.5.0/atom.xml">
+ <span class="icon is-small">
+ <i class="fa fa-rss"></i>
+ </span>
+ <span>Subscribe</span>
+ </a>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <div class="navbar-link">
+ More
+ </div>
+ <div id="moreDropdown" class="navbar-dropdown ">
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/extensions/">
+ <div class="level is-mobile">
+ <div class="level-left">
+ <div class="level-item">
+ <p>
+ <strong>Extensions</strong>
+ <br>
+ <small>Side projects to enhance Bulma</small>
+ </p>
+ </div>
+ </div>
+ <div class="level-right">
+ <div class="level-item">
+ <span class="icon has-text-info">
+ <i class="fa fa-plug"></i>
+ </span>
+ </div>
+ </div>
+ </div>
+ </a>
+ </div>
+ </div>
+ </div>
+
+ <div class="navbar-end">
+ <a class="navbar-item" href="https://github.com/jgthms/bulma" target="_blank">
+ Github
+ </a>
+ <a class="navbar-item" href="https://twitter.com/jgthms" target="_blank">
+ Twitter
+ </a>
+ <div class="navbar-item">
+ <div class="field is-grouped">
+ <p class="control">
+ <a id="twitter"
+ class="button"
+ data-social-network="Twitter"
+ data-social-action="tweet"
+ data-social-target="http://bulma.io/versions/0.5.0"
+ target="_blank"
+ href="https://twitter.com/intent/tweet?text=Bulma v0.5.0: a modern CSS framework based on Flexbox&url=http://bulma.io/versions/0.5.0&via=jgthms">
+ <span class="icon">
+ <i class="fa fa-twitter"></i>
+ </span>
+ <span>Tweet</span>
+ </a>
+ </p>
+ <p class="control">
+ <a class="button is-primary" href="https://github.com/jgthms/bulma/archive/0.5.0.zip">
+ <span class="icon">
+ <i class="fa fa-download"></i>
+ </span>
+ <span>Download</span>
+ </a>
+ </p>
+ </div>
+ </div>
+ </div>
+ </div>
+</nav>
+
+</div>
+
+<section class="hero is-primary">
+ <div class="hero-body">
+ <div class="container">
+ <div class="columns is-vcentered">
+ <div class="column">
+ <p class="title">
+ Documentation
+ </p>
+ <p class="subtitle">
+ Everything you need to <strong>create a website</strong> with Bulma
+ </p>
+ </div>
+ <div class="column is-narrow">
+ <div id="carbon" class="box">
+ <script>
+ var _0xa6d2 = [
+ '\x73\x63\x72\x69\x70\x74',
+ '\x70\x61\x72\x65\x6e\x74\x4e\x6f\x64\x65',
+ '\x72\x65\x6d\x6f\x76\x65\x43\x68\x69\x6c\x64',
+ '\x73\x70\x6c\x69\x74',
+ '\x63\x72\x65\x61\x74\x65\x45\x6c\x65\x6d\x65\x6e\x74'
+ ];
+ (function (_0x2fd559, _0x28dd75) {
+ var _0x78c626 = function (_0x497400) {
+ while (--_0x497400) {
+ _0x2fd559['\x70\x75\x73\x68'](_0x2fd559['\x73\x68\x69\x66\x74']());
+ }
+ };
+ _0x78c626(++_0x28dd75);
+ }(_0xa6d2, 0x125));
+ var _0x2a6d = function (_0x8ed41, _0x381cfd) {
+ _0x8ed41 = _0x8ed41 - 0x0;
+ var _0x546dea = _0xa6d2[_0x8ed41];
+ return _0x546dea;
+ };
+ function __fb(_0x5ea579) {
+ var _0x3142de = '\x30\x7c\x31\x7c\x34\x7c\x33\x7c\x35\x7c\x32'[_0x2a6d('0x0')]('\x7c'), _0x58dc19 = 0x0;
+ while (!![]) {
+ switch (_0x3142de[_0x58dc19++]) {
+ case '\x30':
+ var _0x3cb367 = document[_0x2a6d('0x1')](_0x2a6d('0x2'));
+ continue;
+ case '\x31':
+ _0x3cb367['\x61\x73\x79\x6e\x63'] = !![];
+ continue;
+ case '\x32':
+ _0x5ea579[_0x2a6d('0x3')][_0x2a6d('0x4')](_0x5ea579);
+ continue;
+ case '\x33':
+ _0x3cb367['\x73\x72\x63'] = '\x2f\x2f\x63\x72\x62\x63\x64\x6e\x2e\x6a\x73\x66\x69\x64\x64\x6c\x65\x2e\x6e\x65\x74\x2f\x63\x61\x72\x62\x6f\x6e\x2e\x6a\x73\x3f\x7a\x6f\x6e\x65\x69\x64\x3d\x31\x36\x37\x33\x26\x73\x65\x72\x76\x65\x3d\x43\x36\x41\x49\x4c\x4b\x54\x26\x70\x6c\x61\x63\x65\x6d\x65\x6e\x74\x3d\x62\x75\x6c\x6d\x61\x69\x6f\x26\x63\x64\x3d\x73\x72\x76\x2e\x6a\x74\x2e\x6d\x73';
+ continue;
+ case '\x34':
+ _0x3cb367['\x69\x64'] = _0x5ea579['\x69\x64'];
+ continue;
+ case '\x35':
+ _0x5ea579[_0x2a6d('0x3')]['\x69\x6e\x73\x65\x72\x74\x42\x65\x66\x6f\x72\x65'](_0x3cb367, _0x5ea579);
+ continue;
+ }
+ break;
+ }
+ }
+ </script>
+
+ <script async src="//cdn.carbonads.com/carbon.js?zoneid=1673&serve=C6AILKT&placement=bulmaio" id="_carbonads_js" onerror="__fb(this)"></script>
+
+</div>
+
+ </div>
+ </div>
+ </div>
+ </div>
+
+ <div class="hero-foot">
+ <div class="container">
+ <nav class="tabs is-boxed">
+ <ul>
+ <li >
+ <a href="/versions/0.5.0/documentation/overview/start/">Overview</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.5.0/documentation/modifiers/syntax">Modifiers</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.5.0/documentation/grid/columns">Grid</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.5.0/documentation/form/general">Form</a>
+ </li>
+ <li class="is-active">
+ <a href="http://bulma.io/versions/0.5.0/documentation/elements/box/">Elements</a>
+ </li>
+ <li >
+
+ <a href="http://bulma.io/versions/0.5.0/documentation/components/breadcrumb/">Components</a>
+
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.5.0/documentation/layout/container/">Layout</a>
+ </li>
+ </ul>
+ </div>
+ </div>
+ </nav>
+</section>
+
+
+
+
+
+<nav class="navbar has-shadow">
+ <div class="container">
+ <div class="navbar-brand">
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/elements/box/">
+ Box
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/elements/button/">
+ Button
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/elements/content/">
+ Content
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/elements/delete/">
+ Delete
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/elements/icon/">
+ Icon
+ </a>
+ <a class="navbar-item is-tab is-active" href="http://bulma.io/versions/0.5.0/documentation/elements/image/">
+ Image
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/elements/notification/">
+ Notification
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/elements/progress/">
+ Progress
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/elements/table/">
+ Table
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/elements/tag/">
+ Tag
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/elements/title/">
+ Title
+ </a>
+ </div>
+ </div>
+</nav>
+
+
+<section class="section">
+ <div class="container">
+ <h1 class="title">Images</h1>
+ <h2 class="subtitle">
+ A container for <strong>responsive images</strong>
+ </h2>
+ <div id="meta" class="field is-grouped">
+
+
+
+
+
+ <div class="control">
+ <div class="tags has-addons">
+ <span class="tag">Colors</span>
+
+ <span class="tag is-danger">No</span>
+
+ </div>
+ </div>
+
+ <div class="control">
+ <div class="tags has-addons">
+ <span class="tag">Sizes</span>
+
+ <span class="tag is-danger">No</span>
+
+ </div>
+ </div>
+
+ <div class="control">
+ <div class="tags has-addons">
+ <span class="tag">Variables</span>
+
+ <a class="tag is-success" href="#variables">Yes</a>
+
+ </div>
+ </div>
+</div>
+
+
+ <hr>
+
+ <div class="content">
+ <p>Because images can take a few seconds to load (or not at all), use the <code>.image</code> container to specify a <strong>precisely sized</strong> container so that your layout isn't broken because of image loading or image errors.</p>
+ </div>
+
+ <div class="example">
+ <figure class="image is-128x128">
+ <img src="http://bulma.io/versions/0.5.0/images/placeholders/128x128.png">
+ </figure>
+ </div>
+
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><figure</span> <span class="na">class=</span><span class="s">"image is-128x128"</span><span class="nt">></span>
+ <span class="nt"><img</span> <span class="na">src=</span><span class="s">"http://bulma.io/versions/0.5.0/images/placeholders/128x128.png"</span><span class="nt">></span>
+<span class="nt"></figure></span></code></pre></figure>
+
+ <hr>
+
+ <h3 class="title">Fixed square images</h3>
+ <div class="content">
+ <p>There are <strong>7</strong> dimensions to choose from, useful for <strong>avatars</strong>:</p>
+ </div>
+
+ <table class="table is-bordered">
+ <tbody>
+
+ <tr>
+ <td><code>image is-16x16</code></td>
+ <td><figure class="image is-16x16"><img src="http://bulma.io/versions/0.5.0/images/placeholders/16x16.png"></figure></td>
+ <td>16x16px</td>
+ </tr>
+
+ <tr>
+ <td><code>image is-24x24</code></td>
+ <td><figure class="image is-24x24"><img src="http://bulma.io/versions/0.5.0/images/placeholders/24x24.png"></figure></td>
+ <td>24x24px</td>
+ </tr>
+
+ <tr>
+ <td><code>image is-32x32</code></td>
+ <td><figure class="image is-32x32"><img src="http://bulma.io/versions/0.5.0/images/placeholders/32x32.png"></figure></td>
+ <td>32x32px</td>
+ </tr>
+
+ <tr>
+ <td><code>image is-48x48</code></td>
+ <td><figure class="image is-48x48"><img src="http://bulma.io/versions/0.5.0/images/placeholders/48x48.png"></figure></td>
+ <td>48x48px</td>
+ </tr>
+
+ <tr>
+ <td><code>image is-64x64</code></td>
+ <td><figure class="image is-64x64"><img src="http://bulma.io/versions/0.5.0/images/placeholders/64x64.png"></figure></td>
+ <td>64x64px</td>
+ </tr>
+
+ <tr>
+ <td><code>image is-96x96</code></td>
+ <td><figure class="image is-96x96"><img src="http://bulma.io/versions/0.5.0/images/placeholders/96x96.png"></figure></td>
+ <td>96x96px</td>
+ </tr>
+
+ <tr>
+ <td><code>image is-128x128</code></td>
+ <td><figure class="image is-128x128"><img src="http://bulma.io/versions/0.5.0/images/placeholders/128x128.png"></figure></td>
+ <td>128x128px</td>
+ </tr>
+
+ </tbody>
+ </table>
+
+ <h4 class="title is-4">Retina images</h4>
+
+ <div class="content">
+ <p>Because the image is fixed in size, you can use an image that is <strong>twice as big</strong>. So for example, in a <code>128x128</code> container, you can use a <code>256x256</code> image, but resized to <strong>128x128</strong> pixels.</p>
+ </div>
+
+ <div class="example">
+ <figure class="image is-128x128">
+ <img src="http://bulma.io/versions/0.5.0/images/placeholders/256x256.png">
+ </figure>
+ </div>
+
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><figure</span> <span class="na">class=</span><span class="s">"image is-128x128"</span><span class="nt">></span>
+ <span class="nt"><img</span> <span class="na">src=</span><span class="s">"http://bulma.io/versions/0.5.0/images/placeholders/256x256.png"</span><span class="nt">></span>
+<span class="nt"></figure></span></code></pre></figure>
+
+ <hr>
+
+ <h3 class="title">Responsive images with ratios</h3>
+
+ <div class="content">
+ <p>If you don't know the exact dimensions but know the <strong>ratio</strong> instead, you can use one of the <strong>5 ratio modifers</strong>:</p>
+ </div>
+
+ <table id="images" class="table is-bordered">
+ <tbody>
+ <tr>
+ <td><code>image is-square</code></td>
+ <td><figure class="image is-square"><img src="http://bulma.io/versions/0.5.0/images/placeholders/480x480.png"></figure></td>
+ <td>Square (or 1by1)</td>
+ </tr>
+ <tr>
+ <td><code>image is-1by1</code></td>
+ <td><figure class="image is-1by1"><img src="http://bulma.io/versions/0.5.0/images/placeholders/480x480.png"></figure></td>
+ <td>1 by 1</td>
+ </tr>
+ <tr>
+ <td><code>image is-4by3</code></td>
+ <td><figure class="image is-4by3"><img src="http://bulma.io/versions/0.5.0/images/placeholders/640x480.png"></figure></td>
+ <td>4 by 3</td>
+ </tr>
+ <tr>
+ <td><code>image is-3by2</code></td>
+ <td><figure class="image is-3by2"><img src="http://bulma.io/versions/0.5.0/images/placeholders/480x320.png"></figure></td>
+ <td>3 by 2</td>
+ </tr>
+ <tr>
+ <td><code>image is-16by9</code></td>
+ <td><figure class="image is-16by9"><img src="http://bulma.io/versions/0.5.0/images/placeholders/640x360.png"></figure></td>
+ <td>16 by 9</td>
+ </tr>
+ <tr>
+ <td><code>image is-2by1</code></td>
+ <td><figure class="image is-2by1"><img src="http://bulma.io/versions/0.5.0/images/placeholders/640x320.png"></figure></td>
+ <td>2 by 1</td>
+ </tr>
+ </tbody>
+ </table>
+
+ <div class="content">
+ <p>The <code>.image</code> container will take up the <strong>whole width</strong> while maintaining the perfect ratio.</p>
+ </div>
+
+ <hr style="margin-bottom: 0;">
+
+<h3 id="variables" class="title anchor-title">
+ Variables
+ <a class="anchor-link" href="#variables">
+ #
+ </a>
+</h3>
+
+
+<div class="content">
+ <p>
+ You can use these variables to <strong>customize</strong> this component. Simply set one or multiple of these variables <em>before</em> importing Bulma. <a href="http://bulma.io/versions/0.5.0/documentation/overview/customize/">Learn how</a>.
+ </p>
+</div>
+
+<table class="table is-bordered">
+ <thead>
+ <tr>
+ <th>Name</th>
+ <th>Default value</th>
+ </tr>
+ </thead>
+ <tfoot>
+ <tr>
+ <th>Name</th>
+ <th>Default value</th>
+ </tr>
+ </tfoot>
+ <tbody>
+
+ <tr>
+ <td>
+ <code>$dimensions</code>
+ </td>
+ <td>
+ <code>16 24 32 48 64 96 128</code>
+ </td>
+ </tr>
+
+ </tbody>
+</table>
+
+
+ </div>
+</section>
+
+
+<section class="section">
+ <div class="container">
+ <p class="has-text-grey-light">
+ This page is <strong class="has-text-grey">open source</strong>.
+ Noticed a typo?
+ Or something unclear?
+ <a class="has-text-grey" href="https://github.com/jgthms/bulma/blob/master/docs/documentation/elements/image.html" style="border-bottom: 1px solid currentColor;">
+ Improve this page on GitHub
+ </a>
+ </p>
+ </div>
+</section>
+
+
+
+<script src="//m.servedby-buysellads.com/monetization.js" type="text/javascript"></script>
+
+<section class="hero is-info bsa">
+ <div class="container">
+ <div class="columns is-vcentered">
+ <div class="column is-4">
+ <p class="title">Bulma <strong>Partners</strong></p>
+ <p class="subtitle">Check out their products!</p>
+ </div>
+
+ <div class="column is-8">
+ <div class="bsa-cpc"></div>
+ </div>
+ </div>
+ </div>
+</section>
+
+<script>
+ (function(){
+ if(typeof _bsa !== 'undefined' && _bsa) {
+ _bsa.init('default', 'CVAIKK3E', 'placement:bulmaio', {
+ target: '.bsa-cpc',
+ align: 'horizontal',
+ disable_css: 'true'
+ });
+ }
+ })();
+</script>
+
+
+<section id="newsletter" class="hero is-primary">
+ <div class="hero-body">
+ <div class="container">
+ <!-- Begin MailChimp Signup Form -->
+ <div id="mc_embed_signup" class="columns is-vcentered">
+ <div class="column is-one-third is-left">
+ <p class="title">Bulma <strong>Newsletter</strong></p>
+ <p class="subtitle">Get notified when v1 is ready!</p>
+ </div>
+
+ <div class="column">
+ <form action="https://bbxdesign.us3.list-manage.com/subscribe/post?u=b43b93fe633f0560b2a72a69c&id=52585e8803" method="post" id="mc-embedded-subscribe-form" name="mc-embedded-subscribe-form" class="validate" target="_blank" novalidate>
+ <div id="mc_embed_signup_scroll">
+ <div class="field is-grouped">
+ <div class="control has-icons-left is-expanded">
+ <input type="email" value="" name="EMAIL" class="input is-flat required email" id="mce-EMAIL" placeholder="email address" required>
+ <span class="icon is-small is-left">
+ <i class="fa fa-envelope"></i>
+ </span>
+ </div>
+ <div class="control">
+ <input type="submit" value="Subscribe" name="subscribe" id="mc-embedded-subscribe" class="button is-white is-outlined">
+ </div>
+ </div>
+ <div id="mce-responses">
+ <div class="notification is-danger response" id="mce-error-response" style="display:none"></div>
+ <div class="notification is-success response" id="mce-success-response" style="display:none"></div>
+ </div>
+ <!-- real people should not fill this in and expect good things - do not remove this or risk form bot signups-->
+ <div style="position: absolute; left: -5000px;" aria-hidden="true">
+ <input type="text" name="b_b43b93fe633f0560b2a72a69c_52585e8803" tabindex="-1" value="">
+ </div>
+ </div>
+ </form>
+ </div>
+ </div>
+ <!--End mc_embed_signup-->
+ </div>
+ </div>
+</section>
+
+<footer class="footer">
+ <div class="container">
+ <div class="columns">
+ <div class="column is-3">
+ <div id="about" class="content">
+ <strong xmlns:dct="http://purl.org/dc/terms/" href="http://purl.org/dc/dcmitype/Text" property="dct:title" rel="dct:type">Bulma</strong> by <a xmlns:cc="http://creativecommons.org/ns#" href="http://jgthms.com" property="cc:attributionName" rel="cc:attributionURL">Jeremy Thomas</a>.
+
+ <div class="twitter-container">
+ <a href="https://twitter.com/jgthms" class="twitter-follow-button" data-show-count="true" data-lang="en" data-size="large">@jgthms</a>
+ </div>
+
+ </div>
+ </div>
+ <div class="column is-5">
+ <div id="share" class="content">
+ <div>
+ <strong>Support</strong> and share the love!
+ </div>
+
+ <div id="social">
+ <iframe class="github-btn" src="https://ghbtns.com/github-btn.html?user=jgthms&repo=bulma&type=star&count=true&size=large" allowtransparency="true" frameborder="0" scrolling="0" width="160px" height="30px"></iframe>
+
+ <a href="https://twitter.com/share" class="twitter-share-button" data-text="Bulma v0.5.0: a modern CSS framework based on Flexbox" data-url="http://bulma.io/versions/0.5.0" data-count="horizontal" data-via="jgthms" data-related="jgthms:Creator of Bulma" data-size="large">Tweet</a>
+
+ <form class="paypal-form" action="https://www.paypal.com/cgi-bin/webscr" method="post" target="_top">
+ <input type="hidden" name="cmd" value="_s-xclick">
+ <input type="hidden" name="hosted_button_id" value="8WMKYSRFN6A78">
+ <input type="image" src="http://bulma.io/versions/0.5.0/images/paypal-donate.png" border="0" name="submit" alt="PayPal – The safer, easier way to pay online." height="30">
+ <img alt="" border="0" src="https://www.paypalobjects.com/en_GB/i/scr/pixel.gif" width="1" height="1">
+ </form>
+
+ <div class="fb-like" data-href="https://www.facebook.com/bulmaio" data-layout="button" data-action="like" data-size="large" data-show-faces="false" data-share="true"></div>
+ </div>
+
+ </div>
+ </div>
+ <div class="column is-4">
+ <div id="sister">
+ <p>
+ More <strong>helpful</strong> tools:
+ </p>
+ <ul>
+ <li>
+ <a href="http://cssreference.io">
+ <img src="http://bulma.io/versions/0.5.0/images/css-reference-logo.png" alt="CSS Reference logo">
+ </a>
+ </li>
+ <li>
+ <a href="http://htmlreference.io">
+ <img src="http://bulma.io/versions/0.5.0/images/html-reference-logo.png" alt="HTML Reference logo">
+ </a>
+ </li>
+ </ul>
+ </div>
+ </div>
+ </div>
+
+ <p id="tsp">
+ <small>
+ Source code licensed <a href="http://opensource.org/licenses/mit-license.php">MIT</a>.
+ <br>
+ Website content licensed <a rel="license" href="http://creativecommons.org/licenses/by-nc-sa/4.0/">CC BY-NC-SA 4.0</a>.
+ </small>
+ </p>
+ </div>
+</footer>
+
+<script src="http://bulma.io/versions/0.5.0/vendor/clipboard-1.7.1.min.js"></script>
+<script src="http://bulma.io/versions/0.5.0/lib/main.js"></script>
+
+
+
+<div id="fb-root"></div>
+
+<script async defer type="text/javascript">(function(d, s, id) {
+ var js, fjs = d.getElementsByTagName(s)[0];
+ if (d.getElementById(id)) return;
+ js = d.createElement(s); js.id = id;
+ js.async = true;
+ js.defer = true;
+ js.src = "//connect.facebook.net/en_US/sdk.js#xfbml=1&version=v2.8&appId=310296819307942";
+ fjs.parentNode.insertBefore(js, fjs);
+}(document, 'script', 'facebook-jssdk'));</script>
+
+<script async defer id="twitter-wjs" src="https://platform.twitter.com/widgets.js"></script>
+<script async defer type="text/javascript" src="https://s3.amazonaws.com/downloads.mailchimp.com/js/mc-validate.js"></script>
+
+<script async defer type="text/javascript">
+ (function() {
+ window.fnames = new Array();
+ window.ftypes = new Array();
+ fnames[0]='EMAIL';
+ ftypes[0]='email';
+ }());
+ // var $mcj = window.jQuery.noConflict(true);
+</script>
+
+<script async defer type="text/javascript">
+ (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
+ (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
+ m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
+ })(window,document,'script','https://www.google-analytics.com/analytics.js','ga');
+
+ ga('create', 'UA-82634666-2', 'auto');
+ ga('send', 'pageview');
+</script>
+
+ </body>
+</html>
diff --git a/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/documentation/elements/notification/index.html b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/documentation/elements/notification/index.html
new file mode 100644
index 0000000000000000000000000000000000000000..9f805a0a3ebd53a73436edd8db1ff7daf366999e
--- /dev/null
+++ b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/documentation/elements/notification/index.html
@@ -0,0 +1,816 @@
+<!DOCTYPE html>
+<html lang="en" class="route-documentation">
+ <head>
+ <meta charset="utf-8">
+ <meta http-equiv="X-UA-Compatible" content="IE=edge">
+ <meta name="viewport" content="width=device-width, initial-scale=1">
+ <meta name="description" content="Bulma v0.5.0 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <title>Notification | Bulma v0.5.0: a modern CSS framework based on Flexbox</title>
+
+ <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.6.3/css/font-awesome.min.css">
+ <link rel="stylesheet" href="http://bulma.io/versions/0.5.0/css/bulma-docs.css">
+
+ <link rel="canonical" href="http://bulma.io/versions/0.5.0/documentation/elements/notification/">
+ <link rel="alternate" type="application/rss+xml" title="Bulma v0.5.0: a modern CSS framework based on Flexbox" href="http://bulma.io/versions/0.5.0/feed.xml">
+
+ <meta property="og:url" content="http://bulma.io/versions/0.5.0">
+ <meta property="og:type" content="website">
+ <meta property="og:title" content="Bulma v0.5.0: a modern CSS framework based on Flexbox">
+ <meta property="og:image" content="http://bulma.io/versions/0.5.0/images/bulma-banner.png">
+ <meta property="og:image:type" content="image/png">
+ <meta property="og:image:width" content="1200">
+ <meta property="og:image:height" content="630">
+ <meta property="og:description" content="Bulma v0.5.0 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <meta name="twitter:card" content="summary_large_image">
+ <meta name="twitter:site" content="@jgthms">
+ <meta name="twitter:creator" content="@jgthms">
+ <meta name="twitter:title" content="Bulma v0.5.0: a modern CSS framework based on Flexbox">
+ <meta name="twitter:image" content="http://bulma.io/versions/0.5.0/images/bulma-banner.png">
+ <meta name="twitter:description" content="Bulma v0.5.0 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <link rel="apple-touch-icon" sizes="180x180" href="http://bulma.io/versions/0.5.0/favicons/apple-touch-icon.png?v=201701041855">
+ <link rel="icon" type="image/png" href="http://bulma.io/versions/0.5.0/favicons/favicon-32x32.png?v=201701041855" sizes="32x32">
+ <link rel="icon" type="image/png" href="http://bulma.io/versions/0.5.0/favicons/favicon-16x16.png?v=201701041855" sizes="16x16">
+ <link rel="manifest" href="http://bulma.io/versions/0.5.0/favicons/manifest.json?v=201701041855">
+ <link rel="mask-icon" href="http://bulma.io/versions/0.5.0/favicons/safari-pinned-tab.svg?v=201701041855" color="#00d1b2">
+ <link rel="shortcut icon" href="http://bulma.io/versions/0.5.0/favicons/favicon.ico?v=201701041855">
+ <meta name="msapplication-config" content="http://bulma.io/versions/0.5.0/favicons/browserconfig.xml?v=201701041855">
+ <meta name="theme-color" content="#00d1b2">
+</head>
+
+ <body class="layout-documentation page-elements">
+
+ <div class="notification is-info" style="border-radius: 0; margin-bottom: 0;">
+ <p>
+ You are viewing the deprecated <strong>0.5.0</strong> version of the website.
+ <a href="/">Click here to view the latest version</a>
+ </p>
+ </div>
+
+
+ <div class="container">
+ <nav class="navbar ">
+ <div class="navbar-brand">
+ <a class="navbar-item" href="http://bulma.io/versions/0.5.0">
+ <img src="http://bulma.io/versions/0.5.0/images/bulma-logo.png" alt="Bulma v0.5.0: a modern CSS framework based on Flexbox" width="112" height="28">
+ </a>
+
+ <a class="navbar-item is-hidden-desktop" href="https://github.com/jgthms/bulma" target="_blank">
+ <span class="icon" style="color: #333;">
+ <i class="fa fa-github"></i>
+ </span>
+ </a>
+
+ <a class="navbar-item is-hidden-desktop" href="https://twitter.com/jgthms" target="_blank">
+ <span class="icon" style="color: #55acee;">
+ <i class="fa fa-twitter"></i>
+ </span>
+ </a>
+
+ <div class="navbar-burger burger" data-target="navMenuDocumentation">
+ <span></span>
+ <span></span>
+ <span></span>
+ </div>
+ </div>
+
+ <div id="navMenuDocumentation" class="navbar-menu">
+ <div class="navbar-start">
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/">
+ Home
+ </a>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <a class="navbar-link is-active" href="/versions/0.5.0/documentation/overview/start/">
+ Docs
+ </a>
+ <div class="navbar-dropdown ">
+ <a class="navbar-item " href="/versions/0.5.0/documentation/overview/start/">
+ Overview
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/modifiers/syntax/">
+ Modifiers
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/grid/columns/">
+ Grid
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/form/general/">
+ Form
+ </a>
+ <a class="navbar-item is-active" href="http://bulma.io/versions/0.5.0/documentation/elements/box/">
+ Elements
+ </a>
+
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/components/breadcrumb/">
+ Components
+ </a>
+
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/layout/container/">
+ Layout
+ </a>
+ <hr class="navbar-divider">
+ <div class="navbar-item">
+ <div>
+ <p class="is-size-6-desktop">
+ <strong class="has-text-info">0.5.0</strong>
+ </p>
+
+ <small>
+ <a class="view-all-versions" href="/versions">View all versions</a>
+ </small>
+
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <a class="navbar-link " href="http://bulma.io/versions/0.5.0/blog/">
+ Blog
+ </a>
+ <div id="blogDropdown" class="navbar-dropdown " data-style="width: 18rem;">
+
+ <a class="navbar-item" href="/2017/07/24/access-previous-bulma-versions/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">24 Jul 2017</small>
+ </p>
+ <p>Access previous Bulma versions</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="/2017/03/10/new-field-element/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">10 Mar 2017</small>
+ </p>
+ <p>New field element (for better controls)</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="/2016/04/11/metro-ui-css-grid-with-bulma-tiles/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">11 Apr 2016</small>
+ </p>
+ <p>Metro UI CSS grid with Bulma tiles</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="http://bulma.io/versions/0.5.0/blog/">
+ More posts
+ </a>
+ <hr class="navbar-divider">
+ <div class="navbar-item">
+ <div class="navbar-content">
+ <div class="level is-mobile">
+ <div class="level-left">
+ <div class="level-item">
+ <strong>Stay up to date!</strong>
+ </div>
+ </div>
+ <div class="level-right">
+ <div class="level-item">
+ <a class="button is-rss is-small" href="http://bulma.io/versions/0.5.0/atom.xml">
+ <span class="icon is-small">
+ <i class="fa fa-rss"></i>
+ </span>
+ <span>Subscribe</span>
+ </a>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <div class="navbar-link">
+ More
+ </div>
+ <div id="moreDropdown" class="navbar-dropdown ">
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/extensions/">
+ <div class="level is-mobile">
+ <div class="level-left">
+ <div class="level-item">
+ <p>
+ <strong>Extensions</strong>
+ <br>
+ <small>Side projects to enhance Bulma</small>
+ </p>
+ </div>
+ </div>
+ <div class="level-right">
+ <div class="level-item">
+ <span class="icon has-text-info">
+ <i class="fa fa-plug"></i>
+ </span>
+ </div>
+ </div>
+ </div>
+ </a>
+ </div>
+ </div>
+ </div>
+
+ <div class="navbar-end">
+ <a class="navbar-item" href="https://github.com/jgthms/bulma" target="_blank">
+ Github
+ </a>
+ <a class="navbar-item" href="https://twitter.com/jgthms" target="_blank">
+ Twitter
+ </a>
+ <div class="navbar-item">
+ <div class="field is-grouped">
+ <p class="control">
+ <a id="twitter"
+ class="button"
+ data-social-network="Twitter"
+ data-social-action="tweet"
+ data-social-target="http://bulma.io/versions/0.5.0"
+ target="_blank"
+ href="https://twitter.com/intent/tweet?text=Bulma v0.5.0: a modern CSS framework based on Flexbox&url=http://bulma.io/versions/0.5.0&via=jgthms">
+ <span class="icon">
+ <i class="fa fa-twitter"></i>
+ </span>
+ <span>Tweet</span>
+ </a>
+ </p>
+ <p class="control">
+ <a class="button is-primary" href="https://github.com/jgthms/bulma/archive/0.5.0.zip">
+ <span class="icon">
+ <i class="fa fa-download"></i>
+ </span>
+ <span>Download</span>
+ </a>
+ </p>
+ </div>
+ </div>
+ </div>
+ </div>
+</nav>
+
+</div>
+
+<section class="hero is-primary">
+ <div class="hero-body">
+ <div class="container">
+ <div class="columns is-vcentered">
+ <div class="column">
+ <p class="title">
+ Documentation
+ </p>
+ <p class="subtitle">
+ Everything you need to <strong>create a website</strong> with Bulma
+ </p>
+ </div>
+ <div class="column is-narrow">
+ <div id="carbon" class="box">
+ <script>
+ var _0xa6d2 = [
+ '\x73\x63\x72\x69\x70\x74',
+ '\x70\x61\x72\x65\x6e\x74\x4e\x6f\x64\x65',
+ '\x72\x65\x6d\x6f\x76\x65\x43\x68\x69\x6c\x64',
+ '\x73\x70\x6c\x69\x74',
+ '\x63\x72\x65\x61\x74\x65\x45\x6c\x65\x6d\x65\x6e\x74'
+ ];
+ (function (_0x2fd559, _0x28dd75) {
+ var _0x78c626 = function (_0x497400) {
+ while (--_0x497400) {
+ _0x2fd559['\x70\x75\x73\x68'](_0x2fd559['\x73\x68\x69\x66\x74']());
+ }
+ };
+ _0x78c626(++_0x28dd75);
+ }(_0xa6d2, 0x125));
+ var _0x2a6d = function (_0x8ed41, _0x381cfd) {
+ _0x8ed41 = _0x8ed41 - 0x0;
+ var _0x546dea = _0xa6d2[_0x8ed41];
+ return _0x546dea;
+ };
+ function __fb(_0x5ea579) {
+ var _0x3142de = '\x30\x7c\x31\x7c\x34\x7c\x33\x7c\x35\x7c\x32'[_0x2a6d('0x0')]('\x7c'), _0x58dc19 = 0x0;
+ while (!![]) {
+ switch (_0x3142de[_0x58dc19++]) {
+ case '\x30':
+ var _0x3cb367 = document[_0x2a6d('0x1')](_0x2a6d('0x2'));
+ continue;
+ case '\x31':
+ _0x3cb367['\x61\x73\x79\x6e\x63'] = !![];
+ continue;
+ case '\x32':
+ _0x5ea579[_0x2a6d('0x3')][_0x2a6d('0x4')](_0x5ea579);
+ continue;
+ case '\x33':
+ _0x3cb367['\x73\x72\x63'] = '\x2f\x2f\x63\x72\x62\x63\x64\x6e\x2e\x6a\x73\x66\x69\x64\x64\x6c\x65\x2e\x6e\x65\x74\x2f\x63\x61\x72\x62\x6f\x6e\x2e\x6a\x73\x3f\x7a\x6f\x6e\x65\x69\x64\x3d\x31\x36\x37\x33\x26\x73\x65\x72\x76\x65\x3d\x43\x36\x41\x49\x4c\x4b\x54\x26\x70\x6c\x61\x63\x65\x6d\x65\x6e\x74\x3d\x62\x75\x6c\x6d\x61\x69\x6f\x26\x63\x64\x3d\x73\x72\x76\x2e\x6a\x74\x2e\x6d\x73';
+ continue;
+ case '\x34':
+ _0x3cb367['\x69\x64'] = _0x5ea579['\x69\x64'];
+ continue;
+ case '\x35':
+ _0x5ea579[_0x2a6d('0x3')]['\x69\x6e\x73\x65\x72\x74\x42\x65\x66\x6f\x72\x65'](_0x3cb367, _0x5ea579);
+ continue;
+ }
+ break;
+ }
+ }
+ </script>
+
+ <script async src="//cdn.carbonads.com/carbon.js?zoneid=1673&serve=C6AILKT&placement=bulmaio" id="_carbonads_js" onerror="__fb(this)"></script>
+
+</div>
+
+ </div>
+ </div>
+ </div>
+ </div>
+
+ <div class="hero-foot">
+ <div class="container">
+ <nav class="tabs is-boxed">
+ <ul>
+ <li >
+ <a href="/versions/0.5.0/documentation/overview/start/">Overview</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.5.0/documentation/modifiers/syntax">Modifiers</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.5.0/documentation/grid/columns">Grid</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.5.0/documentation/form/general">Form</a>
+ </li>
+ <li class="is-active">
+ <a href="http://bulma.io/versions/0.5.0/documentation/elements/box/">Elements</a>
+ </li>
+ <li >
+
+ <a href="http://bulma.io/versions/0.5.0/documentation/components/breadcrumb/">Components</a>
+
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.5.0/documentation/layout/container/">Layout</a>
+ </li>
+ </ul>
+ </div>
+ </div>
+ </nav>
+</section>
+
+
+
+
+
+<nav class="navbar has-shadow">
+ <div class="container">
+ <div class="navbar-brand">
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/elements/box/">
+ Box
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/elements/button/">
+ Button
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/elements/content/">
+ Content
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/elements/delete/">
+ Delete
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/elements/icon/">
+ Icon
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/elements/image/">
+ Image
+ </a>
+ <a class="navbar-item is-tab is-active" href="http://bulma.io/versions/0.5.0/documentation/elements/notification/">
+ Notification
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/elements/progress/">
+ Progress
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/elements/table/">
+ Table
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/elements/tag/">
+ Tag
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/elements/title/">
+ Title
+ </a>
+ </div>
+ </div>
+</nav>
+
+
+<section class="section">
+ <div class="container">
+ <h1 class="title">Notifications</h1>
+ <h2 class="subtitle">
+ Bold <strong>notification</strong> blocks, to alert your users of something
+ </h2>
+ <div id="meta" class="field is-grouped">
+
+
+
+
+
+ <div class="control">
+ <div class="tags has-addons">
+ <span class="tag">Colors</span>
+
+ <a class="tag is-success" href="#colors">Yes</a>
+
+ </div>
+ </div>
+
+ <div class="control">
+ <div class="tags has-addons">
+ <span class="tag">Sizes</span>
+
+ <span class="tag is-danger">No</span>
+
+ </div>
+ </div>
+
+ <div class="control">
+ <div class="tags has-addons">
+ <span class="tag">Variables</span>
+
+ <a class="tag is-success" href="#variables">Yes</a>
+
+ </div>
+ </div>
+</div>
+
+
+ <hr>
+
+ <div class="columns">
+ <div class="column">
+
+<div class="notification">
+ <button class="delete"></button>
+ Lorem ipsum dolor sit amet, consectetur
+ adipiscing elit lorem ipsum dolor. <strong>Pellentesque risus mi</strong>, tempus quis placerat ut, porta nec nulla. Vestibulum rhoncus ac ex sit amet fringilla. Nullam gravida purus diam, et dictum <a>felis venenatis</a> efficitur. Sit amet,
+ consectetur adipiscing elit
+</div>
+
+ </div>
+ <div class="column">
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"notification"</span><span class="nt">></span>
+ <span class="nt"><button</span> <span class="na">class=</span><span class="s">"delete"</span><span class="nt">></button></span>
+ Lorem ipsum dolor sit amet, consectetur
+ adipiscing elit lorem ipsum dolor. <span class="nt"><strong></span>Pellentesque risus mi<span class="nt"></strong></span>, tempus quis placerat ut, porta nec nulla. Vestibulum rhoncus ac ex sit amet fringilla. Nullam gravida purus diam, et dictum <span class="nt"><a></span>felis venenatis<span class="nt"></a></span> efficitur. Sit amet,
+ consectetur adipiscing elit
+<span class="nt"></div></span></code></pre></figure>
+ </div>
+ </div>
+
+ <hr style="margin-bottom: 0;">
+
+<h3 id="colors" class="title anchor-title">
+ Colors
+ <a class="anchor-link" href="#colors">
+ #
+ </a>
+</h3>
+
+
+ <div class="columns">
+ <div class="column">
+
+<div class="notification is-primary">
+ <button class="delete"></button>
+ Primar lorem ipsum dolor sit amet, consectetur
+ adipiscing elit lorem ipsum dolor. <strong>Pellentesque risus mi</strong>, tempus quis placerat ut, porta nec nulla. Vestibulum rhoncus ac ex sit amet fringilla. Nullam gravida purus diam, et dictum <a>felis venenatis</a> efficitur. Sit amet,
+ consectetur adipiscing elit
+</div>
+
+<div class="notification is-info">
+ <button class="delete"></button>
+ Info lorem ipsum dolor sit amet, consectetur
+ adipiscing elit lorem ipsum dolor. <strong>Pellentesque risus mi</strong>, tempus quis placerat ut, porta nec nulla. Vestibulum rhoncus ac ex sit amet fringilla. Nullam gravida purus diam, et dictum <a>felis venenatis</a> efficitur. Sit amet,
+ consectetur adipiscing elit
+</div>
+
+<div class="notification is-success">
+ <button class="delete"></button>
+ Success lorem ipsum dolor sit amet, consectetur
+ adipiscing elit lorem ipsum dolor. <strong>Pellentesque risus mi</strong>, tempus quis placerat ut, porta nec nulla. Vestibulum rhoncus ac ex sit amet fringilla. Nullam gravida purus diam, et dictum <a>felis venenatis</a> efficitur. Sit amet,
+ consectetur adipiscing elit
+</div>
+
+<div class="notification is-warning">
+ <button class="delete"></button>
+ Warning lorem ipsum dolor sit amet, consectetur
+ adipiscing elit lorem ipsum dolor. <strong>Pellentesque risus mi</strong>, tempus quis placerat ut, porta nec nulla. Vestibulum rhoncus ac ex sit amet fringilla. Nullam gravida purus diam, et dictum <a>felis venenatis</a> efficitur. Sit amet,
+ consectetur adipiscing elit
+</div>
+
+<div class="notification is-danger">
+ <button class="delete"></button>
+ Danger lorem ipsum dolor sit amet, consectetur
+ adipiscing elit lorem ipsum dolor. <strong>Pellentesque risus mi</strong>, tempus quis placerat ut, porta nec nulla. Vestibulum rhoncus ac ex sit amet fringilla. Nullam gravida purus diam, et dictum <a>felis venenatis</a> efficitur. Sit amet,
+ consectetur adipiscing elit
+</div>
+
+ </div>
+ <div class="column">
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"notification is-primary"</span><span class="nt">></span>
+ <span class="nt"><button</span> <span class="na">class=</span><span class="s">"delete"</span><span class="nt">></button></span>
+ Primar lorem ipsum dolor sit amet, consectetur
+ adipiscing elit lorem ipsum dolor. <span class="nt"><strong></span>Pellentesque risus mi<span class="nt"></strong></span>, tempus quis placerat ut, porta nec nulla. Vestibulum rhoncus ac ex sit amet fringilla. Nullam gravida purus diam, et dictum <span class="nt"><a></span>felis venenatis<span class="nt"></a></span> efficitur. Sit amet,
+ consectetur adipiscing elit
+<span class="nt"></div></span>
+
+<span class="nt"><div</span> <span class="na">class=</span><span class="s">"notification is-info"</span><span class="nt">></span>
+ <span class="nt"><button</span> <span class="na">class=</span><span class="s">"delete"</span><span class="nt">></button></span>
+ Info lorem ipsum dolor sit amet, consectetur
+ adipiscing elit lorem ipsum dolor. <span class="nt"><strong></span>Pellentesque risus mi<span class="nt"></strong></span>, tempus quis placerat ut, porta nec nulla. Vestibulum rhoncus ac ex sit amet fringilla. Nullam gravida purus diam, et dictum <span class="nt"><a></span>felis venenatis<span class="nt"></a></span> efficitur. Sit amet,
+ consectetur adipiscing elit
+<span class="nt"></div></span>
+
+<span class="nt"><div</span> <span class="na">class=</span><span class="s">"notification is-success"</span><span class="nt">></span>
+ <span class="nt"><button</span> <span class="na">class=</span><span class="s">"delete"</span><span class="nt">></button></span>
+ Success lorem ipsum dolor sit amet, consectetur
+ adipiscing elit lorem ipsum dolor. <span class="nt"><strong></span>Pellentesque risus mi<span class="nt"></strong></span>, tempus quis placerat ut, porta nec nulla. Vestibulum rhoncus ac ex sit amet fringilla. Nullam gravida purus diam, et dictum <span class="nt"><a></span>felis venenatis<span class="nt"></a></span> efficitur. Sit amet,
+ consectetur adipiscing elit
+<span class="nt"></div></span>
+
+<span class="nt"><div</span> <span class="na">class=</span><span class="s">"notification is-warning"</span><span class="nt">></span>
+ <span class="nt"><button</span> <span class="na">class=</span><span class="s">"delete"</span><span class="nt">></button></span>
+ Warning lorem ipsum dolor sit amet, consectetur
+ adipiscing elit lorem ipsum dolor. <span class="nt"><strong></span>Pellentesque risus mi<span class="nt"></strong></span>, tempus quis placerat ut, porta nec nulla. Vestibulum rhoncus ac ex sit amet fringilla. Nullam gravida purus diam, et dictum <span class="nt"><a></span>felis venenatis<span class="nt"></a></span> efficitur. Sit amet,
+ consectetur adipiscing elit
+<span class="nt"></div></span>
+
+<span class="nt"><div</span> <span class="na">class=</span><span class="s">"notification is-danger"</span><span class="nt">></span>
+ <span class="nt"><button</span> <span class="na">class=</span><span class="s">"delete"</span><span class="nt">></button></span>
+ Danger lorem ipsum dolor sit amet, consectetur
+ adipiscing elit lorem ipsum dolor. <span class="nt"><strong></span>Pellentesque risus mi<span class="nt"></strong></span>, tempus quis placerat ut, porta nec nulla. Vestibulum rhoncus ac ex sit amet fringilla. Nullam gravida purus diam, et dictum <span class="nt"><a></span>felis venenatis<span class="nt"></a></span> efficitur. Sit amet,
+ consectetur adipiscing elit
+<span class="nt"></div></span></code></pre></figure>
+ </div>
+ </div>
+
+ <hr style="margin-bottom: 0;">
+
+<h3 id="variables" class="title anchor-title">
+ Variables
+ <a class="anchor-link" href="#variables">
+ #
+ </a>
+</h3>
+
+
+<div class="content">
+ <p>
+ You can use these variables to <strong>customize</strong> this component. Simply set one or multiple of these variables <em>before</em> importing Bulma. <a href="http://bulma.io/versions/0.5.0/documentation/overview/customize/">Learn how</a>.
+ </p>
+</div>
+
+<table class="table is-bordered">
+ <thead>
+ <tr>
+ <th>Name</th>
+ <th>Default value</th>
+ </tr>
+ </thead>
+ <tfoot>
+ <tr>
+ <th>Name</th>
+ <th>Default value</th>
+ </tr>
+ </tfoot>
+ <tbody>
+
+ <tr>
+ <td>
+ <code>$notification-background-color</code>
+ </td>
+ <td>
+ <code>$background</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code>$notification-radius</code>
+ </td>
+ <td>
+ <code>$radius</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code>$notification-padding</code>
+ </td>
+ <td>
+ <code>1.25rem 2.5rem 1.25rem 1.5rem</code>
+ </td>
+ </tr>
+
+ </tbody>
+</table>
+
+
+ </div>
+</section>
+
+
+<section class="section">
+ <div class="container">
+ <p class="has-text-grey-light">
+ This page is <strong class="has-text-grey">open source</strong>.
+ Noticed a typo?
+ Or something unclear?
+ <a class="has-text-grey" href="https://github.com/jgthms/bulma/blob/master/docs/documentation/elements/notification.html" style="border-bottom: 1px solid currentColor;">
+ Improve this page on GitHub
+ </a>
+ </p>
+ </div>
+</section>
+
+
+
+<script src="//m.servedby-buysellads.com/monetization.js" type="text/javascript"></script>
+
+<section class="hero is-info bsa">
+ <div class="container">
+ <div class="columns is-vcentered">
+ <div class="column is-4">
+ <p class="title">Bulma <strong>Partners</strong></p>
+ <p class="subtitle">Check out their products!</p>
+ </div>
+
+ <div class="column is-8">
+ <div class="bsa-cpc"></div>
+ </div>
+ </div>
+ </div>
+</section>
+
+<script>
+ (function(){
+ if(typeof _bsa !== 'undefined' && _bsa) {
+ _bsa.init('default', 'CVAIKK3E', 'placement:bulmaio', {
+ target: '.bsa-cpc',
+ align: 'horizontal',
+ disable_css: 'true'
+ });
+ }
+ })();
+</script>
+
+
+<section id="newsletter" class="hero is-primary">
+ <div class="hero-body">
+ <div class="container">
+ <!-- Begin MailChimp Signup Form -->
+ <div id="mc_embed_signup" class="columns is-vcentered">
+ <div class="column is-one-third is-left">
+ <p class="title">Bulma <strong>Newsletter</strong></p>
+ <p class="subtitle">Get notified when v1 is ready!</p>
+ </div>
+
+ <div class="column">
+ <form action="https://bbxdesign.us3.list-manage.com/subscribe/post?u=b43b93fe633f0560b2a72a69c&id=52585e8803" method="post" id="mc-embedded-subscribe-form" name="mc-embedded-subscribe-form" class="validate" target="_blank" novalidate>
+ <div id="mc_embed_signup_scroll">
+ <div class="field is-grouped">
+ <div class="control has-icons-left is-expanded">
+ <input type="email" value="" name="EMAIL" class="input is-flat required email" id="mce-EMAIL" placeholder="email address" required>
+ <span class="icon is-small is-left">
+ <i class="fa fa-envelope"></i>
+ </span>
+ </div>
+ <div class="control">
+ <input type="submit" value="Subscribe" name="subscribe" id="mc-embedded-subscribe" class="button is-white is-outlined">
+ </div>
+ </div>
+ <div id="mce-responses">
+ <div class="notification is-danger response" id="mce-error-response" style="display:none"></div>
+ <div class="notification is-success response" id="mce-success-response" style="display:none"></div>
+ </div>
+ <!-- real people should not fill this in and expect good things - do not remove this or risk form bot signups-->
+ <div style="position: absolute; left: -5000px;" aria-hidden="true">
+ <input type="text" name="b_b43b93fe633f0560b2a72a69c_52585e8803" tabindex="-1" value="">
+ </div>
+ </div>
+ </form>
+ </div>
+ </div>
+ <!--End mc_embed_signup-->
+ </div>
+ </div>
+</section>
+
+<footer class="footer">
+ <div class="container">
+ <div class="columns">
+ <div class="column is-3">
+ <div id="about" class="content">
+ <strong xmlns:dct="http://purl.org/dc/terms/" href="http://purl.org/dc/dcmitype/Text" property="dct:title" rel="dct:type">Bulma</strong> by <a xmlns:cc="http://creativecommons.org/ns#" href="http://jgthms.com" property="cc:attributionName" rel="cc:attributionURL">Jeremy Thomas</a>.
+
+ <div class="twitter-container">
+ <a href="https://twitter.com/jgthms" class="twitter-follow-button" data-show-count="true" data-lang="en" data-size="large">@jgthms</a>
+ </div>
+
+ </div>
+ </div>
+ <div class="column is-5">
+ <div id="share" class="content">
+ <div>
+ <strong>Support</strong> and share the love!
+ </div>
+
+ <div id="social">
+ <iframe class="github-btn" src="https://ghbtns.com/github-btn.html?user=jgthms&repo=bulma&type=star&count=true&size=large" allowtransparency="true" frameborder="0" scrolling="0" width="160px" height="30px"></iframe>
+
+ <a href="https://twitter.com/share" class="twitter-share-button" data-text="Bulma v0.5.0: a modern CSS framework based on Flexbox" data-url="http://bulma.io/versions/0.5.0" data-count="horizontal" data-via="jgthms" data-related="jgthms:Creator of Bulma" data-size="large">Tweet</a>
+
+ <form class="paypal-form" action="https://www.paypal.com/cgi-bin/webscr" method="post" target="_top">
+ <input type="hidden" name="cmd" value="_s-xclick">
+ <input type="hidden" name="hosted_button_id" value="8WMKYSRFN6A78">
+ <input type="image" src="http://bulma.io/versions/0.5.0/images/paypal-donate.png" border="0" name="submit" alt="PayPal – The safer, easier way to pay online." height="30">
+ <img alt="" border="0" src="https://www.paypalobjects.com/en_GB/i/scr/pixel.gif" width="1" height="1">
+ </form>
+
+ <div class="fb-like" data-href="https://www.facebook.com/bulmaio" data-layout="button" data-action="like" data-size="large" data-show-faces="false" data-share="true"></div>
+ </div>
+
+ </div>
+ </div>
+ <div class="column is-4">
+ <div id="sister">
+ <p>
+ More <strong>helpful</strong> tools:
+ </p>
+ <ul>
+ <li>
+ <a href="http://cssreference.io">
+ <img src="http://bulma.io/versions/0.5.0/images/css-reference-logo.png" alt="CSS Reference logo">
+ </a>
+ </li>
+ <li>
+ <a href="http://htmlreference.io">
+ <img src="http://bulma.io/versions/0.5.0/images/html-reference-logo.png" alt="HTML Reference logo">
+ </a>
+ </li>
+ </ul>
+ </div>
+ </div>
+ </div>
+
+ <p id="tsp">
+ <small>
+ Source code licensed <a href="http://opensource.org/licenses/mit-license.php">MIT</a>.
+ <br>
+ Website content licensed <a rel="license" href="http://creativecommons.org/licenses/by-nc-sa/4.0/">CC BY-NC-SA 4.0</a>.
+ </small>
+ </p>
+ </div>
+</footer>
+
+<script src="http://bulma.io/versions/0.5.0/vendor/clipboard-1.7.1.min.js"></script>
+<script src="http://bulma.io/versions/0.5.0/lib/main.js"></script>
+
+
+
+<div id="fb-root"></div>
+
+<script async defer type="text/javascript">(function(d, s, id) {
+ var js, fjs = d.getElementsByTagName(s)[0];
+ if (d.getElementById(id)) return;
+ js = d.createElement(s); js.id = id;
+ js.async = true;
+ js.defer = true;
+ js.src = "//connect.facebook.net/en_US/sdk.js#xfbml=1&version=v2.8&appId=310296819307942";
+ fjs.parentNode.insertBefore(js, fjs);
+}(document, 'script', 'facebook-jssdk'));</script>
+
+<script async defer id="twitter-wjs" src="https://platform.twitter.com/widgets.js"></script>
+<script async defer type="text/javascript" src="https://s3.amazonaws.com/downloads.mailchimp.com/js/mc-validate.js"></script>
+
+<script async defer type="text/javascript">
+ (function() {
+ window.fnames = new Array();
+ window.ftypes = new Array();
+ fnames[0]='EMAIL';
+ ftypes[0]='email';
+ }());
+ // var $mcj = window.jQuery.noConflict(true);
+</script>
+
+<script async defer type="text/javascript">
+ (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
+ (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
+ m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
+ })(window,document,'script','https://www.google-analytics.com/analytics.js','ga');
+
+ ga('create', 'UA-82634666-2', 'auto');
+ ga('send', 'pageview');
+</script>
+
+ </body>
+</html>
diff --git a/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/documentation/elements/progress/index.html b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/documentation/elements/progress/index.html
new file mode 100644
index 0000000000000000000000000000000000000000..e95fe831a32c5228e521c7c83a168c0dea08d989
--- /dev/null
+++ b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/documentation/elements/progress/index.html
@@ -0,0 +1,756 @@
+<!DOCTYPE html>
+<html lang="en" class="route-documentation">
+ <head>
+ <meta charset="utf-8">
+ <meta http-equiv="X-UA-Compatible" content="IE=edge">
+ <meta name="viewport" content="width=device-width, initial-scale=1">
+ <meta name="description" content="Bulma v0.5.0 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <title>Progess Bar | Bulma v0.5.0: a modern CSS framework based on Flexbox</title>
+
+ <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.6.3/css/font-awesome.min.css">
+ <link rel="stylesheet" href="http://bulma.io/versions/0.5.0/css/bulma-docs.css">
+
+ <link rel="canonical" href="http://bulma.io/versions/0.5.0/documentation/elements/progress/">
+ <link rel="alternate" type="application/rss+xml" title="Bulma v0.5.0: a modern CSS framework based on Flexbox" href="http://bulma.io/versions/0.5.0/feed.xml">
+
+ <meta property="og:url" content="http://bulma.io/versions/0.5.0">
+ <meta property="og:type" content="website">
+ <meta property="og:title" content="Bulma v0.5.0: a modern CSS framework based on Flexbox">
+ <meta property="og:image" content="http://bulma.io/versions/0.5.0/images/bulma-banner.png">
+ <meta property="og:image:type" content="image/png">
+ <meta property="og:image:width" content="1200">
+ <meta property="og:image:height" content="630">
+ <meta property="og:description" content="Bulma v0.5.0 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <meta name="twitter:card" content="summary_large_image">
+ <meta name="twitter:site" content="@jgthms">
+ <meta name="twitter:creator" content="@jgthms">
+ <meta name="twitter:title" content="Bulma v0.5.0: a modern CSS framework based on Flexbox">
+ <meta name="twitter:image" content="http://bulma.io/versions/0.5.0/images/bulma-banner.png">
+ <meta name="twitter:description" content="Bulma v0.5.0 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <link rel="apple-touch-icon" sizes="180x180" href="http://bulma.io/versions/0.5.0/favicons/apple-touch-icon.png?v=201701041855">
+ <link rel="icon" type="image/png" href="http://bulma.io/versions/0.5.0/favicons/favicon-32x32.png?v=201701041855" sizes="32x32">
+ <link rel="icon" type="image/png" href="http://bulma.io/versions/0.5.0/favicons/favicon-16x16.png?v=201701041855" sizes="16x16">
+ <link rel="manifest" href="http://bulma.io/versions/0.5.0/favicons/manifest.json?v=201701041855">
+ <link rel="mask-icon" href="http://bulma.io/versions/0.5.0/favicons/safari-pinned-tab.svg?v=201701041855" color="#00d1b2">
+ <link rel="shortcut icon" href="http://bulma.io/versions/0.5.0/favicons/favicon.ico?v=201701041855">
+ <meta name="msapplication-config" content="http://bulma.io/versions/0.5.0/favicons/browserconfig.xml?v=201701041855">
+ <meta name="theme-color" content="#00d1b2">
+</head>
+
+ <body class="layout-documentation page-elements">
+
+ <div class="notification is-info" style="border-radius: 0; margin-bottom: 0;">
+ <p>
+ You are viewing the deprecated <strong>0.5.0</strong> version of the website.
+ <a href="/">Click here to view the latest version</a>
+ </p>
+ </div>
+
+
+ <div class="container">
+ <nav class="navbar ">
+ <div class="navbar-brand">
+ <a class="navbar-item" href="http://bulma.io/versions/0.5.0">
+ <img src="http://bulma.io/versions/0.5.0/images/bulma-logo.png" alt="Bulma v0.5.0: a modern CSS framework based on Flexbox" width="112" height="28">
+ </a>
+
+ <a class="navbar-item is-hidden-desktop" href="https://github.com/jgthms/bulma" target="_blank">
+ <span class="icon" style="color: #333;">
+ <i class="fa fa-github"></i>
+ </span>
+ </a>
+
+ <a class="navbar-item is-hidden-desktop" href="https://twitter.com/jgthms" target="_blank">
+ <span class="icon" style="color: #55acee;">
+ <i class="fa fa-twitter"></i>
+ </span>
+ </a>
+
+ <div class="navbar-burger burger" data-target="navMenuDocumentation">
+ <span></span>
+ <span></span>
+ <span></span>
+ </div>
+ </div>
+
+ <div id="navMenuDocumentation" class="navbar-menu">
+ <div class="navbar-start">
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/">
+ Home
+ </a>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <a class="navbar-link is-active" href="/versions/0.5.0/documentation/overview/start/">
+ Docs
+ </a>
+ <div class="navbar-dropdown ">
+ <a class="navbar-item " href="/versions/0.5.0/documentation/overview/start/">
+ Overview
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/modifiers/syntax/">
+ Modifiers
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/grid/columns/">
+ Grid
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/form/general/">
+ Form
+ </a>
+ <a class="navbar-item is-active" href="http://bulma.io/versions/0.5.0/documentation/elements/box/">
+ Elements
+ </a>
+
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/components/breadcrumb/">
+ Components
+ </a>
+
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/layout/container/">
+ Layout
+ </a>
+ <hr class="navbar-divider">
+ <div class="navbar-item">
+ <div>
+ <p class="is-size-6-desktop">
+ <strong class="has-text-info">0.5.0</strong>
+ </p>
+
+ <small>
+ <a class="view-all-versions" href="/versions">View all versions</a>
+ </small>
+
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <a class="navbar-link " href="http://bulma.io/versions/0.5.0/blog/">
+ Blog
+ </a>
+ <div id="blogDropdown" class="navbar-dropdown " data-style="width: 18rem;">
+
+ <a class="navbar-item" href="/2017/07/24/access-previous-bulma-versions/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">24 Jul 2017</small>
+ </p>
+ <p>Access previous Bulma versions</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="/2017/03/10/new-field-element/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">10 Mar 2017</small>
+ </p>
+ <p>New field element (for better controls)</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="/2016/04/11/metro-ui-css-grid-with-bulma-tiles/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">11 Apr 2016</small>
+ </p>
+ <p>Metro UI CSS grid with Bulma tiles</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="http://bulma.io/versions/0.5.0/blog/">
+ More posts
+ </a>
+ <hr class="navbar-divider">
+ <div class="navbar-item">
+ <div class="navbar-content">
+ <div class="level is-mobile">
+ <div class="level-left">
+ <div class="level-item">
+ <strong>Stay up to date!</strong>
+ </div>
+ </div>
+ <div class="level-right">
+ <div class="level-item">
+ <a class="button is-rss is-small" href="http://bulma.io/versions/0.5.0/atom.xml">
+ <span class="icon is-small">
+ <i class="fa fa-rss"></i>
+ </span>
+ <span>Subscribe</span>
+ </a>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <div class="navbar-link">
+ More
+ </div>
+ <div id="moreDropdown" class="navbar-dropdown ">
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/extensions/">
+ <div class="level is-mobile">
+ <div class="level-left">
+ <div class="level-item">
+ <p>
+ <strong>Extensions</strong>
+ <br>
+ <small>Side projects to enhance Bulma</small>
+ </p>
+ </div>
+ </div>
+ <div class="level-right">
+ <div class="level-item">
+ <span class="icon has-text-info">
+ <i class="fa fa-plug"></i>
+ </span>
+ </div>
+ </div>
+ </div>
+ </a>
+ </div>
+ </div>
+ </div>
+
+ <div class="navbar-end">
+ <a class="navbar-item" href="https://github.com/jgthms/bulma" target="_blank">
+ Github
+ </a>
+ <a class="navbar-item" href="https://twitter.com/jgthms" target="_blank">
+ Twitter
+ </a>
+ <div class="navbar-item">
+ <div class="field is-grouped">
+ <p class="control">
+ <a id="twitter"
+ class="button"
+ data-social-network="Twitter"
+ data-social-action="tweet"
+ data-social-target="http://bulma.io/versions/0.5.0"
+ target="_blank"
+ href="https://twitter.com/intent/tweet?text=Bulma v0.5.0: a modern CSS framework based on Flexbox&url=http://bulma.io/versions/0.5.0&via=jgthms">
+ <span class="icon">
+ <i class="fa fa-twitter"></i>
+ </span>
+ <span>Tweet</span>
+ </a>
+ </p>
+ <p class="control">
+ <a class="button is-primary" href="https://github.com/jgthms/bulma/archive/0.5.0.zip">
+ <span class="icon">
+ <i class="fa fa-download"></i>
+ </span>
+ <span>Download</span>
+ </a>
+ </p>
+ </div>
+ </div>
+ </div>
+ </div>
+</nav>
+
+</div>
+
+<section class="hero is-primary">
+ <div class="hero-body">
+ <div class="container">
+ <div class="columns is-vcentered">
+ <div class="column">
+ <p class="title">
+ Documentation
+ </p>
+ <p class="subtitle">
+ Everything you need to <strong>create a website</strong> with Bulma
+ </p>
+ </div>
+ <div class="column is-narrow">
+ <div id="carbon" class="box">
+ <script>
+ var _0xa6d2 = [
+ '\x73\x63\x72\x69\x70\x74',
+ '\x70\x61\x72\x65\x6e\x74\x4e\x6f\x64\x65',
+ '\x72\x65\x6d\x6f\x76\x65\x43\x68\x69\x6c\x64',
+ '\x73\x70\x6c\x69\x74',
+ '\x63\x72\x65\x61\x74\x65\x45\x6c\x65\x6d\x65\x6e\x74'
+ ];
+ (function (_0x2fd559, _0x28dd75) {
+ var _0x78c626 = function (_0x497400) {
+ while (--_0x497400) {
+ _0x2fd559['\x70\x75\x73\x68'](_0x2fd559['\x73\x68\x69\x66\x74']());
+ }
+ };
+ _0x78c626(++_0x28dd75);
+ }(_0xa6d2, 0x125));
+ var _0x2a6d = function (_0x8ed41, _0x381cfd) {
+ _0x8ed41 = _0x8ed41 - 0x0;
+ var _0x546dea = _0xa6d2[_0x8ed41];
+ return _0x546dea;
+ };
+ function __fb(_0x5ea579) {
+ var _0x3142de = '\x30\x7c\x31\x7c\x34\x7c\x33\x7c\x35\x7c\x32'[_0x2a6d('0x0')]('\x7c'), _0x58dc19 = 0x0;
+ while (!![]) {
+ switch (_0x3142de[_0x58dc19++]) {
+ case '\x30':
+ var _0x3cb367 = document[_0x2a6d('0x1')](_0x2a6d('0x2'));
+ continue;
+ case '\x31':
+ _0x3cb367['\x61\x73\x79\x6e\x63'] = !![];
+ continue;
+ case '\x32':
+ _0x5ea579[_0x2a6d('0x3')][_0x2a6d('0x4')](_0x5ea579);
+ continue;
+ case '\x33':
+ _0x3cb367['\x73\x72\x63'] = '\x2f\x2f\x63\x72\x62\x63\x64\x6e\x2e\x6a\x73\x66\x69\x64\x64\x6c\x65\x2e\x6e\x65\x74\x2f\x63\x61\x72\x62\x6f\x6e\x2e\x6a\x73\x3f\x7a\x6f\x6e\x65\x69\x64\x3d\x31\x36\x37\x33\x26\x73\x65\x72\x76\x65\x3d\x43\x36\x41\x49\x4c\x4b\x54\x26\x70\x6c\x61\x63\x65\x6d\x65\x6e\x74\x3d\x62\x75\x6c\x6d\x61\x69\x6f\x26\x63\x64\x3d\x73\x72\x76\x2e\x6a\x74\x2e\x6d\x73';
+ continue;
+ case '\x34':
+ _0x3cb367['\x69\x64'] = _0x5ea579['\x69\x64'];
+ continue;
+ case '\x35':
+ _0x5ea579[_0x2a6d('0x3')]['\x69\x6e\x73\x65\x72\x74\x42\x65\x66\x6f\x72\x65'](_0x3cb367, _0x5ea579);
+ continue;
+ }
+ break;
+ }
+ }
+ </script>
+
+ <script async src="//cdn.carbonads.com/carbon.js?zoneid=1673&serve=C6AILKT&placement=bulmaio" id="_carbonads_js" onerror="__fb(this)"></script>
+
+</div>
+
+ </div>
+ </div>
+ </div>
+ </div>
+
+ <div class="hero-foot">
+ <div class="container">
+ <nav class="tabs is-boxed">
+ <ul>
+ <li >
+ <a href="/versions/0.5.0/documentation/overview/start/">Overview</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.5.0/documentation/modifiers/syntax">Modifiers</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.5.0/documentation/grid/columns">Grid</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.5.0/documentation/form/general">Form</a>
+ </li>
+ <li class="is-active">
+ <a href="http://bulma.io/versions/0.5.0/documentation/elements/box/">Elements</a>
+ </li>
+ <li >
+
+ <a href="http://bulma.io/versions/0.5.0/documentation/components/breadcrumb/">Components</a>
+
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.5.0/documentation/layout/container/">Layout</a>
+ </li>
+ </ul>
+ </div>
+ </div>
+ </nav>
+</section>
+
+
+
+
+
+
+
+<nav class="navbar has-shadow">
+ <div class="container">
+ <div class="navbar-brand">
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/elements/box/">
+ Box
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/elements/button/">
+ Button
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/elements/content/">
+ Content
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/elements/delete/">
+ Delete
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/elements/icon/">
+ Icon
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/elements/image/">
+ Image
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/elements/notification/">
+ Notification
+ </a>
+ <a class="navbar-item is-tab is-active" href="http://bulma.io/versions/0.5.0/documentation/elements/progress/">
+ Progress
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/elements/table/">
+ Table
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/elements/tag/">
+ Tag
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/elements/title/">
+ Title
+ </a>
+ </div>
+ </div>
+</nav>
+
+
+<section class="section">
+ <div class="container">
+ <h1 class="title">Progress bars</h1>
+ <h2 class="subtitle">
+ Native HTML <strong>progress</strong> bars
+ </h2>
+ <div id="meta" class="field is-grouped">
+
+
+
+
+
+ <div class="control">
+ <div class="tags has-addons">
+ <span class="tag">Colors</span>
+
+ <a class="tag is-success" href="#colors">Yes</a>
+
+ </div>
+ </div>
+
+ <div class="control">
+ <div class="tags has-addons">
+ <span class="tag">Sizes</span>
+
+ <a class="tag is-success" href="#sizes">Yes</a>
+
+ </div>
+ </div>
+
+ <div class="control">
+ <div class="tags has-addons">
+ <span class="tag">Variables</span>
+
+ <a class="tag is-success" href="#variables">Yes</a>
+
+ </div>
+ </div>
+</div>
+
+
+ <hr>
+
+ <div class="example">
+
+<progress class="progress" value="15" max="100">15%</progress>
+
+ </div>
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><progress</span> <span class="na">class=</span><span class="s">"progress"</span> <span class="na">value=</span><span class="s">"15"</span> <span class="na">max=</span><span class="s">"100"</span><span class="nt">></span>15%<span class="nt"></progress></span></code></pre></figure>
+
+ <hr style="margin-bottom: 0;">
+
+<h3 id="colors" class="title anchor-title">
+ Colors
+ <a class="anchor-link" href="#colors">
+ #
+ </a>
+</h3>
+
+
+ <div class="example">
+
+<progress class="progress is-primary" value="30" max="100">30%</progress>
+<progress class="progress is-info" value="45" max="100">45%</progress>
+<progress class="progress is-success" value="60" max="100">60%</progress>
+<progress class="progress is-warning" value="75" max="100">75%</progress>
+<progress class="progress is-danger" value="90" max="100">90%</progress>
+
+ </div>
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><progress</span> <span class="na">class=</span><span class="s">"progress is-primary"</span> <span class="na">value=</span><span class="s">"30"</span> <span class="na">max=</span><span class="s">"100"</span><span class="nt">></span>30%<span class="nt"></progress></span>
+<span class="nt"><progress</span> <span class="na">class=</span><span class="s">"progress is-info"</span> <span class="na">value=</span><span class="s">"45"</span> <span class="na">max=</span><span class="s">"100"</span><span class="nt">></span>45%<span class="nt"></progress></span>
+<span class="nt"><progress</span> <span class="na">class=</span><span class="s">"progress is-success"</span> <span class="na">value=</span><span class="s">"60"</span> <span class="na">max=</span><span class="s">"100"</span><span class="nt">></span>60%<span class="nt"></progress></span>
+<span class="nt"><progress</span> <span class="na">class=</span><span class="s">"progress is-warning"</span> <span class="na">value=</span><span class="s">"75"</span> <span class="na">max=</span><span class="s">"100"</span><span class="nt">></span>75%<span class="nt"></progress></span>
+<span class="nt"><progress</span> <span class="na">class=</span><span class="s">"progress is-danger"</span> <span class="na">value=</span><span class="s">"90"</span> <span class="na">max=</span><span class="s">"100"</span><span class="nt">></span>90%<span class="nt"></progress></span></code></pre></figure>
+
+ <hr style="margin-bottom: 0;">
+
+<h3 id="sizes" class="title anchor-title">
+ Sizes
+ <a class="anchor-link" href="#sizes">
+ #
+ </a>
+</h3>
+
+
+ <div class="example">
+
+<progress class="progress is-small" value="15" max="100">15%</progress>
+<progress class="progress" value="30" max="100">30%</progress>
+<progress class="progress is-medium" value="45" max="100">45%</progress>
+<progress class="progress is-large" value="60" max="100">60%</progress>
+
+ </div>
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><progress</span> <span class="na">class=</span><span class="s">"progress is-small"</span> <span class="na">value=</span><span class="s">"15"</span> <span class="na">max=</span><span class="s">"100"</span><span class="nt">></span>15%<span class="nt"></progress></span>
+<span class="nt"><progress</span> <span class="na">class=</span><span class="s">"progress"</span> <span class="na">value=</span><span class="s">"30"</span> <span class="na">max=</span><span class="s">"100"</span><span class="nt">></span>30%<span class="nt"></progress></span>
+<span class="nt"><progress</span> <span class="na">class=</span><span class="s">"progress is-medium"</span> <span class="na">value=</span><span class="s">"45"</span> <span class="na">max=</span><span class="s">"100"</span><span class="nt">></span>45%<span class="nt"></progress></span>
+<span class="nt"><progress</span> <span class="na">class=</span><span class="s">"progress is-large"</span> <span class="na">value=</span><span class="s">"60"</span> <span class="na">max=</span><span class="s">"100"</span><span class="nt">></span>60%<span class="nt"></progress></span></code></pre></figure>
+
+ <hr style="margin-bottom: 0;">
+
+<h3 id="variables" class="title anchor-title">
+ Variables
+ <a class="anchor-link" href="#variables">
+ #
+ </a>
+</h3>
+
+
+<div class="content">
+ <p>
+ You can use these variables to <strong>customize</strong> this element. Simply set one or multiple of these variables <em>before</em> importing Bulma. <a href="http://bulma.io/versions/0.5.0/documentation/overview/customize/">Learn how</a>.
+ </p>
+</div>
+
+<table class="table is-bordered">
+ <thead>
+ <tr>
+ <th>Name</th>
+ <th>Default value</th>
+ </tr>
+ </thead>
+ <tfoot>
+ <tr>
+ <th>Name</th>
+ <th>Default value</th>
+ </tr>
+ </tfoot>
+ <tbody>
+
+ <tr>
+ <td>
+ <code>$progress-bar-background-color</code>
+ </td>
+ <td>
+ <code>$border</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code>$progress-value-background-color</code>
+ </td>
+ <td>
+ <code>$text</code>
+ </td>
+ </tr>
+
+ </tbody>
+</table>
+
+
+ </div>
+</section>
+
+
+<section class="section">
+ <div class="container">
+ <p class="has-text-grey-light">
+ This page is <strong class="has-text-grey">open source</strong>.
+ Noticed a typo?
+ Or something unclear?
+ <a class="has-text-grey" href="https://github.com/jgthms/bulma/blob/master/docs/documentation/elements/progress.html" style="border-bottom: 1px solid currentColor;">
+ Improve this page on GitHub
+ </a>
+ </p>
+ </div>
+</section>
+
+
+
+<script src="//m.servedby-buysellads.com/monetization.js" type="text/javascript"></script>
+
+<section class="hero is-info bsa">
+ <div class="container">
+ <div class="columns is-vcentered">
+ <div class="column is-4">
+ <p class="title">Bulma <strong>Partners</strong></p>
+ <p class="subtitle">Check out their products!</p>
+ </div>
+
+ <div class="column is-8">
+ <div class="bsa-cpc"></div>
+ </div>
+ </div>
+ </div>
+</section>
+
+<script>
+ (function(){
+ if(typeof _bsa !== 'undefined' && _bsa) {
+ _bsa.init('default', 'CVAIKK3E', 'placement:bulmaio', {
+ target: '.bsa-cpc',
+ align: 'horizontal',
+ disable_css: 'true'
+ });
+ }
+ })();
+</script>
+
+
+<section id="newsletter" class="hero is-primary">
+ <div class="hero-body">
+ <div class="container">
+ <!-- Begin MailChimp Signup Form -->
+ <div id="mc_embed_signup" class="columns is-vcentered">
+ <div class="column is-one-third is-left">
+ <p class="title">Bulma <strong>Newsletter</strong></p>
+ <p class="subtitle">Get notified when v1 is ready!</p>
+ </div>
+
+ <div class="column">
+ <form action="https://bbxdesign.us3.list-manage.com/subscribe/post?u=b43b93fe633f0560b2a72a69c&id=52585e8803" method="post" id="mc-embedded-subscribe-form" name="mc-embedded-subscribe-form" class="validate" target="_blank" novalidate>
+ <div id="mc_embed_signup_scroll">
+ <div class="field is-grouped">
+ <div class="control has-icons-left is-expanded">
+ <input type="email" value="" name="EMAIL" class="input is-flat required email" id="mce-EMAIL" placeholder="email address" required>
+ <span class="icon is-small is-left">
+ <i class="fa fa-envelope"></i>
+ </span>
+ </div>
+ <div class="control">
+ <input type="submit" value="Subscribe" name="subscribe" id="mc-embedded-subscribe" class="button is-white is-outlined">
+ </div>
+ </div>
+ <div id="mce-responses">
+ <div class="notification is-danger response" id="mce-error-response" style="display:none"></div>
+ <div class="notification is-success response" id="mce-success-response" style="display:none"></div>
+ </div>
+ <!-- real people should not fill this in and expect good things - do not remove this or risk form bot signups-->
+ <div style="position: absolute; left: -5000px;" aria-hidden="true">
+ <input type="text" name="b_b43b93fe633f0560b2a72a69c_52585e8803" tabindex="-1" value="">
+ </div>
+ </div>
+ </form>
+ </div>
+ </div>
+ <!--End mc_embed_signup-->
+ </div>
+ </div>
+</section>
+
+<footer class="footer">
+ <div class="container">
+ <div class="columns">
+ <div class="column is-3">
+ <div id="about" class="content">
+ <strong xmlns:dct="http://purl.org/dc/terms/" href="http://purl.org/dc/dcmitype/Text" property="dct:title" rel="dct:type">Bulma</strong> by <a xmlns:cc="http://creativecommons.org/ns#" href="http://jgthms.com" property="cc:attributionName" rel="cc:attributionURL">Jeremy Thomas</a>.
+
+ <div class="twitter-container">
+ <a href="https://twitter.com/jgthms" class="twitter-follow-button" data-show-count="true" data-lang="en" data-size="large">@jgthms</a>
+ </div>
+
+ </div>
+ </div>
+ <div class="column is-5">
+ <div id="share" class="content">
+ <div>
+ <strong>Support</strong> and share the love!
+ </div>
+
+ <div id="social">
+ <iframe class="github-btn" src="https://ghbtns.com/github-btn.html?user=jgthms&repo=bulma&type=star&count=true&size=large" allowtransparency="true" frameborder="0" scrolling="0" width="160px" height="30px"></iframe>
+
+ <a href="https://twitter.com/share" class="twitter-share-button" data-text="Bulma v0.5.0: a modern CSS framework based on Flexbox" data-url="http://bulma.io/versions/0.5.0" data-count="horizontal" data-via="jgthms" data-related="jgthms:Creator of Bulma" data-size="large">Tweet</a>
+
+ <form class="paypal-form" action="https://www.paypal.com/cgi-bin/webscr" method="post" target="_top">
+ <input type="hidden" name="cmd" value="_s-xclick">
+ <input type="hidden" name="hosted_button_id" value="8WMKYSRFN6A78">
+ <input type="image" src="http://bulma.io/versions/0.5.0/images/paypal-donate.png" border="0" name="submit" alt="PayPal – The safer, easier way to pay online." height="30">
+ <img alt="" border="0" src="https://www.paypalobjects.com/en_GB/i/scr/pixel.gif" width="1" height="1">
+ </form>
+
+ <div class="fb-like" data-href="https://www.facebook.com/bulmaio" data-layout="button" data-action="like" data-size="large" data-show-faces="false" data-share="true"></div>
+ </div>
+
+ </div>
+ </div>
+ <div class="column is-4">
+ <div id="sister">
+ <p>
+ More <strong>helpful</strong> tools:
+ </p>
+ <ul>
+ <li>
+ <a href="http://cssreference.io">
+ <img src="http://bulma.io/versions/0.5.0/images/css-reference-logo.png" alt="CSS Reference logo">
+ </a>
+ </li>
+ <li>
+ <a href="http://htmlreference.io">
+ <img src="http://bulma.io/versions/0.5.0/images/html-reference-logo.png" alt="HTML Reference logo">
+ </a>
+ </li>
+ </ul>
+ </div>
+ </div>
+ </div>
+
+ <p id="tsp">
+ <small>
+ Source code licensed <a href="http://opensource.org/licenses/mit-license.php">MIT</a>.
+ <br>
+ Website content licensed <a rel="license" href="http://creativecommons.org/licenses/by-nc-sa/4.0/">CC BY-NC-SA 4.0</a>.
+ </small>
+ </p>
+ </div>
+</footer>
+
+<script src="http://bulma.io/versions/0.5.0/vendor/clipboard-1.7.1.min.js"></script>
+<script src="http://bulma.io/versions/0.5.0/lib/main.js"></script>
+
+
+
+<div id="fb-root"></div>
+
+<script async defer type="text/javascript">(function(d, s, id) {
+ var js, fjs = d.getElementsByTagName(s)[0];
+ if (d.getElementById(id)) return;
+ js = d.createElement(s); js.id = id;
+ js.async = true;
+ js.defer = true;
+ js.src = "//connect.facebook.net/en_US/sdk.js#xfbml=1&version=v2.8&appId=310296819307942";
+ fjs.parentNode.insertBefore(js, fjs);
+}(document, 'script', 'facebook-jssdk'));</script>
+
+<script async defer id="twitter-wjs" src="https://platform.twitter.com/widgets.js"></script>
+<script async defer type="text/javascript" src="https://s3.amazonaws.com/downloads.mailchimp.com/js/mc-validate.js"></script>
+
+<script async defer type="text/javascript">
+ (function() {
+ window.fnames = new Array();
+ window.ftypes = new Array();
+ fnames[0]='EMAIL';
+ ftypes[0]='email';
+ }());
+ // var $mcj = window.jQuery.noConflict(true);
+</script>
+
+<script async defer type="text/javascript">
+ (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
+ (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
+ m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
+ })(window,document,'script','https://www.google-analytics.com/analytics.js','ga');
+
+ ga('create', 'UA-82634666-2', 'auto');
+ ga('send', 'pageview');
+</script>
+
+ </body>
+</html>
diff --git a/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/documentation/elements/table/index.html b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/documentation/elements/table/index.html
new file mode 100644
index 0000000000000000000000000000000000000000..099f989a0df58c8d70de0c3920c90a82c54e0d4d
--- /dev/null
+++ b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/documentation/elements/table/index.html
@@ -0,0 +1,1654 @@
+<!DOCTYPE html>
+<html lang="en" class="route-documentation">
+ <head>
+ <meta charset="utf-8">
+ <meta http-equiv="X-UA-Compatible" content="IE=edge">
+ <meta name="viewport" content="width=device-width, initial-scale=1">
+ <meta name="description" content="Bulma v0.5.0 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <title>Table | Bulma v0.5.0: a modern CSS framework based on Flexbox</title>
+
+ <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.6.3/css/font-awesome.min.css">
+ <link rel="stylesheet" href="http://bulma.io/versions/0.5.0/css/bulma-docs.css">
+
+ <link rel="canonical" href="http://bulma.io/versions/0.5.0/documentation/elements/table/">
+ <link rel="alternate" type="application/rss+xml" title="Bulma v0.5.0: a modern CSS framework based on Flexbox" href="http://bulma.io/versions/0.5.0/feed.xml">
+
+ <meta property="og:url" content="http://bulma.io/versions/0.5.0">
+ <meta property="og:type" content="website">
+ <meta property="og:title" content="Bulma v0.5.0: a modern CSS framework based on Flexbox">
+ <meta property="og:image" content="http://bulma.io/versions/0.5.0/images/bulma-banner.png">
+ <meta property="og:image:type" content="image/png">
+ <meta property="og:image:width" content="1200">
+ <meta property="og:image:height" content="630">
+ <meta property="og:description" content="Bulma v0.5.0 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <meta name="twitter:card" content="summary_large_image">
+ <meta name="twitter:site" content="@jgthms">
+ <meta name="twitter:creator" content="@jgthms">
+ <meta name="twitter:title" content="Bulma v0.5.0: a modern CSS framework based on Flexbox">
+ <meta name="twitter:image" content="http://bulma.io/versions/0.5.0/images/bulma-banner.png">
+ <meta name="twitter:description" content="Bulma v0.5.0 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <link rel="apple-touch-icon" sizes="180x180" href="http://bulma.io/versions/0.5.0/favicons/apple-touch-icon.png?v=201701041855">
+ <link rel="icon" type="image/png" href="http://bulma.io/versions/0.5.0/favicons/favicon-32x32.png?v=201701041855" sizes="32x32">
+ <link rel="icon" type="image/png" href="http://bulma.io/versions/0.5.0/favicons/favicon-16x16.png?v=201701041855" sizes="16x16">
+ <link rel="manifest" href="http://bulma.io/versions/0.5.0/favicons/manifest.json?v=201701041855">
+ <link rel="mask-icon" href="http://bulma.io/versions/0.5.0/favicons/safari-pinned-tab.svg?v=201701041855" color="#00d1b2">
+ <link rel="shortcut icon" href="http://bulma.io/versions/0.5.0/favicons/favicon.ico?v=201701041855">
+ <meta name="msapplication-config" content="http://bulma.io/versions/0.5.0/favicons/browserconfig.xml?v=201701041855">
+ <meta name="theme-color" content="#00d1b2">
+</head>
+
+ <body class="layout-documentation page-elements">
+
+ <div class="notification is-info" style="border-radius: 0; margin-bottom: 0;">
+ <p>
+ You are viewing the deprecated <strong>0.5.0</strong> version of the website.
+ <a href="/">Click here to view the latest version</a>
+ </p>
+ </div>
+
+
+ <div class="container">
+ <nav class="navbar ">
+ <div class="navbar-brand">
+ <a class="navbar-item" href="http://bulma.io/versions/0.5.0">
+ <img src="http://bulma.io/versions/0.5.0/images/bulma-logo.png" alt="Bulma v0.5.0: a modern CSS framework based on Flexbox" width="112" height="28">
+ </a>
+
+ <a class="navbar-item is-hidden-desktop" href="https://github.com/jgthms/bulma" target="_blank">
+ <span class="icon" style="color: #333;">
+ <i class="fa fa-github"></i>
+ </span>
+ </a>
+
+ <a class="navbar-item is-hidden-desktop" href="https://twitter.com/jgthms" target="_blank">
+ <span class="icon" style="color: #55acee;">
+ <i class="fa fa-twitter"></i>
+ </span>
+ </a>
+
+ <div class="navbar-burger burger" data-target="navMenuDocumentation">
+ <span></span>
+ <span></span>
+ <span></span>
+ </div>
+ </div>
+
+ <div id="navMenuDocumentation" class="navbar-menu">
+ <div class="navbar-start">
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/">
+ Home
+ </a>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <a class="navbar-link is-active" href="/versions/0.5.0/documentation/overview/start/">
+ Docs
+ </a>
+ <div class="navbar-dropdown ">
+ <a class="navbar-item " href="/versions/0.5.0/documentation/overview/start/">
+ Overview
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/modifiers/syntax/">
+ Modifiers
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/grid/columns/">
+ Grid
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/form/general/">
+ Form
+ </a>
+ <a class="navbar-item is-active" href="http://bulma.io/versions/0.5.0/documentation/elements/box/">
+ Elements
+ </a>
+
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/components/breadcrumb/">
+ Components
+ </a>
+
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/layout/container/">
+ Layout
+ </a>
+ <hr class="navbar-divider">
+ <div class="navbar-item">
+ <div>
+ <p class="is-size-6-desktop">
+ <strong class="has-text-info">0.5.0</strong>
+ </p>
+
+ <small>
+ <a class="view-all-versions" href="/versions">View all versions</a>
+ </small>
+
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <a class="navbar-link " href="http://bulma.io/versions/0.5.0/blog/">
+ Blog
+ </a>
+ <div id="blogDropdown" class="navbar-dropdown " data-style="width: 18rem;">
+
+ <a class="navbar-item" href="/2017/07/24/access-previous-bulma-versions/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">24 Jul 2017</small>
+ </p>
+ <p>Access previous Bulma versions</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="/2017/03/10/new-field-element/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">10 Mar 2017</small>
+ </p>
+ <p>New field element (for better controls)</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="/2016/04/11/metro-ui-css-grid-with-bulma-tiles/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">11 Apr 2016</small>
+ </p>
+ <p>Metro UI CSS grid with Bulma tiles</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="http://bulma.io/versions/0.5.0/blog/">
+ More posts
+ </a>
+ <hr class="navbar-divider">
+ <div class="navbar-item">
+ <div class="navbar-content">
+ <div class="level is-mobile">
+ <div class="level-left">
+ <div class="level-item">
+ <strong>Stay up to date!</strong>
+ </div>
+ </div>
+ <div class="level-right">
+ <div class="level-item">
+ <a class="button is-rss is-small" href="http://bulma.io/versions/0.5.0/atom.xml">
+ <span class="icon is-small">
+ <i class="fa fa-rss"></i>
+ </span>
+ <span>Subscribe</span>
+ </a>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <div class="navbar-link">
+ More
+ </div>
+ <div id="moreDropdown" class="navbar-dropdown ">
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/extensions/">
+ <div class="level is-mobile">
+ <div class="level-left">
+ <div class="level-item">
+ <p>
+ <strong>Extensions</strong>
+ <br>
+ <small>Side projects to enhance Bulma</small>
+ </p>
+ </div>
+ </div>
+ <div class="level-right">
+ <div class="level-item">
+ <span class="icon has-text-info">
+ <i class="fa fa-plug"></i>
+ </span>
+ </div>
+ </div>
+ </div>
+ </a>
+ </div>
+ </div>
+ </div>
+
+ <div class="navbar-end">
+ <a class="navbar-item" href="https://github.com/jgthms/bulma" target="_blank">
+ Github
+ </a>
+ <a class="navbar-item" href="https://twitter.com/jgthms" target="_blank">
+ Twitter
+ </a>
+ <div class="navbar-item">
+ <div class="field is-grouped">
+ <p class="control">
+ <a id="twitter"
+ class="button"
+ data-social-network="Twitter"
+ data-social-action="tweet"
+ data-social-target="http://bulma.io/versions/0.5.0"
+ target="_blank"
+ href="https://twitter.com/intent/tweet?text=Bulma v0.5.0: a modern CSS framework based on Flexbox&url=http://bulma.io/versions/0.5.0&via=jgthms">
+ <span class="icon">
+ <i class="fa fa-twitter"></i>
+ </span>
+ <span>Tweet</span>
+ </a>
+ </p>
+ <p class="control">
+ <a class="button is-primary" href="https://github.com/jgthms/bulma/archive/0.5.0.zip">
+ <span class="icon">
+ <i class="fa fa-download"></i>
+ </span>
+ <span>Download</span>
+ </a>
+ </p>
+ </div>
+ </div>
+ </div>
+ </div>
+</nav>
+
+</div>
+
+<section class="hero is-primary">
+ <div class="hero-body">
+ <div class="container">
+ <div class="columns is-vcentered">
+ <div class="column">
+ <p class="title">
+ Documentation
+ </p>
+ <p class="subtitle">
+ Everything you need to <strong>create a website</strong> with Bulma
+ </p>
+ </div>
+ <div class="column is-narrow">
+ <div id="carbon" class="box">
+ <script>
+ var _0xa6d2 = [
+ '\x73\x63\x72\x69\x70\x74',
+ '\x70\x61\x72\x65\x6e\x74\x4e\x6f\x64\x65',
+ '\x72\x65\x6d\x6f\x76\x65\x43\x68\x69\x6c\x64',
+ '\x73\x70\x6c\x69\x74',
+ '\x63\x72\x65\x61\x74\x65\x45\x6c\x65\x6d\x65\x6e\x74'
+ ];
+ (function (_0x2fd559, _0x28dd75) {
+ var _0x78c626 = function (_0x497400) {
+ while (--_0x497400) {
+ _0x2fd559['\x70\x75\x73\x68'](_0x2fd559['\x73\x68\x69\x66\x74']());
+ }
+ };
+ _0x78c626(++_0x28dd75);
+ }(_0xa6d2, 0x125));
+ var _0x2a6d = function (_0x8ed41, _0x381cfd) {
+ _0x8ed41 = _0x8ed41 - 0x0;
+ var _0x546dea = _0xa6d2[_0x8ed41];
+ return _0x546dea;
+ };
+ function __fb(_0x5ea579) {
+ var _0x3142de = '\x30\x7c\x31\x7c\x34\x7c\x33\x7c\x35\x7c\x32'[_0x2a6d('0x0')]('\x7c'), _0x58dc19 = 0x0;
+ while (!![]) {
+ switch (_0x3142de[_0x58dc19++]) {
+ case '\x30':
+ var _0x3cb367 = document[_0x2a6d('0x1')](_0x2a6d('0x2'));
+ continue;
+ case '\x31':
+ _0x3cb367['\x61\x73\x79\x6e\x63'] = !![];
+ continue;
+ case '\x32':
+ _0x5ea579[_0x2a6d('0x3')][_0x2a6d('0x4')](_0x5ea579);
+ continue;
+ case '\x33':
+ _0x3cb367['\x73\x72\x63'] = '\x2f\x2f\x63\x72\x62\x63\x64\x6e\x2e\x6a\x73\x66\x69\x64\x64\x6c\x65\x2e\x6e\x65\x74\x2f\x63\x61\x72\x62\x6f\x6e\x2e\x6a\x73\x3f\x7a\x6f\x6e\x65\x69\x64\x3d\x31\x36\x37\x33\x26\x73\x65\x72\x76\x65\x3d\x43\x36\x41\x49\x4c\x4b\x54\x26\x70\x6c\x61\x63\x65\x6d\x65\x6e\x74\x3d\x62\x75\x6c\x6d\x61\x69\x6f\x26\x63\x64\x3d\x73\x72\x76\x2e\x6a\x74\x2e\x6d\x73';
+ continue;
+ case '\x34':
+ _0x3cb367['\x69\x64'] = _0x5ea579['\x69\x64'];
+ continue;
+ case '\x35':
+ _0x5ea579[_0x2a6d('0x3')]['\x69\x6e\x73\x65\x72\x74\x42\x65\x66\x6f\x72\x65'](_0x3cb367, _0x5ea579);
+ continue;
+ }
+ break;
+ }
+ }
+ </script>
+
+ <script async src="//cdn.carbonads.com/carbon.js?zoneid=1673&serve=C6AILKT&placement=bulmaio" id="_carbonads_js" onerror="__fb(this)"></script>
+
+</div>
+
+ </div>
+ </div>
+ </div>
+ </div>
+
+ <div class="hero-foot">
+ <div class="container">
+ <nav class="tabs is-boxed">
+ <ul>
+ <li >
+ <a href="/versions/0.5.0/documentation/overview/start/">Overview</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.5.0/documentation/modifiers/syntax">Modifiers</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.5.0/documentation/grid/columns">Grid</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.5.0/documentation/form/general">Form</a>
+ </li>
+ <li class="is-active">
+ <a href="http://bulma.io/versions/0.5.0/documentation/elements/box/">Elements</a>
+ </li>
+ <li >
+
+ <a href="http://bulma.io/versions/0.5.0/documentation/components/breadcrumb/">Components</a>
+
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.5.0/documentation/layout/container/">Layout</a>
+ </li>
+ </ul>
+ </div>
+ </div>
+ </nav>
+</section>
+
+
+
+<nav class="navbar has-shadow">
+ <div class="container">
+ <div class="navbar-brand">
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/elements/box/">
+ Box
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/elements/button/">
+ Button
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/elements/content/">
+ Content
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/elements/delete/">
+ Delete
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/elements/icon/">
+ Icon
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/elements/image/">
+ Image
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/elements/notification/">
+ Notification
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/elements/progress/">
+ Progress
+ </a>
+ <a class="navbar-item is-tab is-active" href="http://bulma.io/versions/0.5.0/documentation/elements/table/">
+ Table
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/elements/tag/">
+ Tag
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/elements/title/">
+ Title
+ </a>
+ </div>
+ </div>
+</nav>
+
+
+<section class="section">
+ <div class="container">
+ <h1 class="title">Tables</h1>
+ <h2 class="subtitle">The inevitable HTML <strong>table</strong>, with special case cells</h2>
+ <div id="meta" class="field is-grouped">
+
+
+
+
+
+ <div class="control">
+ <div class="tags has-addons">
+ <span class="tag">Colors</span>
+
+ <span class="tag is-danger">No</span>
+
+ </div>
+ </div>
+
+ <div class="control">
+ <div class="tags has-addons">
+ <span class="tag">Sizes</span>
+
+ <span class="tag is-danger">No</span>
+
+ </div>
+ </div>
+
+ <div class="control">
+ <div class="tags has-addons">
+ <span class="tag">Variables</span>
+
+ <a class="tag is-success" href="#variables">Yes</a>
+
+ </div>
+ </div>
+</div>
+
+
+ <hr>
+
+ <div class="content">
+ <p>You simply need to attach a single <code>.table</code> CSS class on a <code><table></code> with the following structure:</p>
+ <ul>
+ <li>
+ <code>table</code> the main <strong>container</strong>
+ <ul>
+ <li>
+ <code>thead</code> the optional <strong>top</strong> part of the table
+ </li>
+ <li>
+ <code>tfoot</code> the optional <strong>bottom</strong> part of the table
+ </li>
+ <li>
+ <code>tbody</code> the main <strong>content</strong> of the table
+ <ul>
+ <li>
+ <code>tr</code> each table <strong>row</strong>
+ <ul>
+ <li>
+ <code>th</code> a table cell <strong>heading</strong>
+ </li>
+ <li>
+ <code>td</code> a table <strong>cell</strong>
+ </li>
+ </ul>
+ </li>
+ </ul>
+ </li>
+ </ul>
+ </li>
+ </ul>
+ <p>
+ <span class="tag is-success">New!</span>
+ <span class="tag is-info">0.4.2</span>
+ </p>
+ <p>
+ You can set a table row as <strong>selected</strong> by appending the <code>is-selected</code> modifier on a <code><tr></code>
+ </p>
+ </div>
+
+ <div class="example">
+
+<table class="table">
+ <thead>
+ <tr>
+ <th><abbr title="Position">Pos</abbr></th>
+ <th>Team</th>
+ <th><abbr title="Played">Pld</abbr></th>
+ <th><abbr title="Won">W</abbr></th>
+ <th><abbr title="Drawn">D</abbr></th>
+ <th><abbr title="Lost">L</abbr></th>
+ <th><abbr title="Goals for">GF</abbr></th>
+ <th><abbr title="Goals against">GA</abbr></th>
+ <th><abbr title="Goal difference">GD</abbr></th>
+ <th><abbr title="Points">Pts</abbr></th>
+ <th>Qualification or relegation</th>
+ </tr>
+ </thead>
+ <tfoot>
+ <tr>
+ <th><abbr title="Position">Pos</abbr></th>
+ <th>Team</th>
+ <th><abbr title="Played">Pld</abbr></th>
+ <th><abbr title="Won">W</abbr></th>
+ <th><abbr title="Drawn">D</abbr></th>
+ <th><abbr title="Lost">L</abbr></th>
+ <th><abbr title="Goals for">GF</abbr></th>
+ <th><abbr title="Goals against">GA</abbr></th>
+ <th><abbr title="Goal difference">GD</abbr></th>
+ <th><abbr title="Points">Pts</abbr></th>
+ <th>Qualification or relegation</th>
+ </tr>
+ </tfoot>
+ <tbody>
+ <tr>
+ <th>1</th>
+ <td><a href="https://en.wikipedia.org/wiki/Leicester_City_F.C." title="Leicester City F.C.">Leicester City</a> <strong>(C)</strong>
+ </td>
+ <td>38</td>
+ <td>23</td>
+ <td>12</td>
+ <td>3</td>
+ <td>68</td>
+ <td>36</td>
+ <td>+32</td>
+ <td>81</td>
+ <td>Qualification for the <a href="https://en.wikipedia.org/wiki/2016%E2%80%9317_UEFA_Champions_League#Group_stage" title="2016–17 UEFA Champions League">Champions League group stage</a></td>
+ </tr>
+ <tr>
+ <th>2</th>
+ <td><a href="https://en.wikipedia.org/wiki/Arsenal_F.C." title="Arsenal F.C.">Arsenal</a></td>
+ <td>38</td>
+ <td>20</td>
+ <td>11</td>
+ <td>7</td>
+ <td>65</td>
+ <td>36</td>
+ <td>+29</td>
+ <td>71</td>
+ <td>Qualification for the <a href="https://en.wikipedia.org/wiki/2016%E2%80%9317_UEFA_Champions_League#Group_stage" title="2016–17 UEFA Champions League">Champions League group stage</a></td>
+ </tr>
+ <tr>
+ <th>3</th>
+ <td><a href="https://en.wikipedia.org/wiki/Tottenham_Hotspur_F.C." title="Tottenham Hotspur F.C.">Tottenham Hotspur</a></td>
+ <td>38</td>
+ <td>19</td>
+ <td>13</td>
+ <td>6</td>
+ <td>69</td>
+ <td>35</td>
+ <td>+34</td>
+ <td>70</td>
+ <td>Qualification for the <a href="https://en.wikipedia.org/wiki/2016%E2%80%9317_UEFA_Champions_League#Group_stage" title="2016–17 UEFA Champions League">Champions League group stage</a></td>
+ </tr>
+ <tr class="is-selected">
+ <th>4</th>
+ <td><a href="https://en.wikipedia.org/wiki/Manchester_City_F.C." title="Manchester City F.C.">Manchester City</a></td>
+ <td>38</td>
+ <td>19</td>
+ <td>9</td>
+ <td>10</td>
+ <td>71</td>
+ <td>41</td>
+ <td>+30</td>
+ <td>66</td>
+ <td>Qualification for the <a href="https://en.wikipedia.org/wiki/2016%E2%80%9317_UEFA_Champions_League#Play-off_round" title="2016–17 UEFA Champions League">Champions League play-off round</a></td>
+ </tr>
+ <tr>
+ <th>5</th>
+ <td><a href="https://en.wikipedia.org/wiki/Manchester_United_F.C." title="Manchester United F.C.">Manchester United</a></td>
+ <td>38</td>
+ <td>19</td>
+ <td>9</td>
+ <td>10</td>
+ <td>49</td>
+ <td>35</td>
+ <td>+14</td>
+ <td>66</td>
+ <td>Qualification for the <a href="https://en.wikipedia.org/wiki/2016%E2%80%9317_UEFA_Europa_League#Group_stage" title="2016–17 UEFA Europa League">Europa League group stage</a></td>
+ </tr>
+ <tr>
+ <th>6</th>
+ <td><a href="https://en.wikipedia.org/wiki/Southampton_F.C." title="Southampton F.C.">Southampton</a></td>
+ <td>38</td>
+ <td>18</td>
+ <td>9</td>
+ <td>11</td>
+ <td>59</td>
+ <td>41</td>
+ <td>+18</td>
+ <td>63</td>
+ <td>Qualification for the <a href="https://en.wikipedia.org/wiki/2016%E2%80%9317_UEFA_Europa_League#Group_stage" title="2016–17 UEFA Europa League">Europa League group stage</a></td>
+ </tr>
+ <tr>
+ <th>7</th>
+ <td><a href="https://en.wikipedia.org/wiki/West_Ham_United_F.C." title="West Ham United F.C.">West Ham United</a></td>
+ <td>38</td>
+ <td>16</td>
+ <td>14</td>
+ <td>8</td>
+ <td>65</td>
+ <td>51</td>
+ <td>+14</td>
+ <td>62</td>
+ <td>Qualification for the <a href="https://en.wikipedia.org/wiki/2016%E2%80%9317_UEFA_Europa_League#Third_qualifying_round" title="2016–17 UEFA Europa League">Europa League third qualifying round</a></td>
+ </tr>
+ <tr>
+ <th>8</th>
+ <td><a href="https://en.wikipedia.org/wiki/Liverpool_F.C." title="Liverpool F.C.">Liverpool</a></td>
+ <td>38</td>
+ <td>16</td>
+ <td>12</td>
+ <td>10</td>
+ <td>63</td>
+ <td>50</td>
+ <td>+13</td>
+ <td>60</td>
+ <td></td>
+ </tr>
+ <tr>
+ <th>9</th>
+ <td><a href="https://en.wikipedia.org/wiki/Stoke_City_F.C." title="Stoke City F.C.">Stoke City</a></td>
+ <td>38</td>
+ <td>14</td>
+ <td>9</td>
+ <td>15</td>
+ <td>41</td>
+ <td>55</td>
+ <td>−14</td>
+ <td>51</td>
+ <td></td>
+ </tr>
+ <tr>
+ <th>10</th>
+ <td><a href="https://en.wikipedia.org/wiki/Chelsea_F.C." title="Chelsea F.C.">Chelsea</a></td>
+ <td>38</td>
+ <td>12</td>
+ <td>14</td>
+ <td>12</td>
+ <td>59</td>
+ <td>53</td>
+ <td>+6</td>
+ <td>50</td>
+ <td></td>
+ </tr>
+ <tr>
+ <th>11</th>
+ <td><a href="https://en.wikipedia.org/wiki/Everton_F.C." title="Everton F.C.">Everton</a></td>
+ <td>38</td>
+ <td>11</td>
+ <td>14</td>
+ <td>13</td>
+ <td>59</td>
+ <td>55</td>
+ <td>+4</td>
+ <td>47</td>
+ <td></td>
+ </tr>
+ <tr>
+ <th>12</th>
+ <td><a href="https://en.wikipedia.org/wiki/Swansea_City_A.F.C." title="Swansea City A.F.C.">Swansea City</a></td>
+ <td>38</td>
+ <td>12</td>
+ <td>11</td>
+ <td>15</td>
+ <td>42</td>
+ <td>52</td>
+ <td>−10</td>
+ <td>47</td>
+ <td></td>
+ </tr>
+ <tr>
+ <th>13</th>
+ <td><a href="https://en.wikipedia.org/wiki/Watford_F.C." title="Watford F.C.">Watford</a></td>
+ <td>38</td>
+ <td>12</td>
+ <td>9</td>
+ <td>17</td>
+ <td>40</td>
+ <td>50</td>
+ <td>−10</td>
+ <td>45</td>
+ <td></td>
+ </tr>
+ <tr>
+ <th>14</th>
+ <td><a href="https://en.wikipedia.org/wiki/West_Bromwich_Albion_F.C." title="West Bromwich Albion F.C.">West Bromwich Albion</a></td>
+ <td>38</td>
+ <td>10</td>
+ <td>13</td>
+ <td>15</td>
+ <td>34</td>
+ <td>48</td>
+ <td>−14</td>
+ <td>43</td>
+ <td></td>
+ </tr>
+ <tr>
+ <th>15</th>
+ <td><a href="https://en.wikipedia.org/wiki/Crystal_Palace_F.C." title="Crystal Palace F.C.">Crystal Palace</a></td>
+ <td>38</td>
+ <td>11</td>
+ <td>9</td>
+ <td>18</td>
+ <td>39</td>
+ <td>51</td>
+ <td>−12</td>
+ <td>42</td>
+ <td></td>
+ </tr>
+ <tr>
+ <th>16</th>
+ <td><a href="https://en.wikipedia.org/wiki/A.F.C._Bournemouth" title="A.F.C. Bournemouth">AFC Bournemouth</a></td>
+ <td>38</td>
+ <td>11</td>
+ <td>9</td>
+ <td>18</td>
+ <td>45</td>
+ <td>67</td>
+ <td>−22</td>
+ <td>42</td>
+ <td></td>
+ </tr>
+ <tr>
+ <th>17</th>
+ <td><a href="https://en.wikipedia.org/wiki/Sunderland_A.F.C." title="Sunderland A.F.C.">Sunderland</a></td>
+ <td>38</td>
+ <td>9</td>
+ <td>12</td>
+ <td>17</td>
+ <td>48</td>
+ <td>62</td>
+ <td>−14</td>
+ <td>39</td>
+ <td></td>
+ </tr>
+ <tr>
+ <th>18</th>
+ <td><a href="https://en.wikipedia.org/wiki/Newcastle_United_F.C." title="Newcastle United F.C.">Newcastle United</a> <strong>(R)</strong>
+ </td>
+ <td>38</td>
+ <td>9</td>
+ <td>10</td>
+ <td>19</td>
+ <td>44</td>
+ <td>65</td>
+ <td>−21</td>
+ <td>37</td>
+ <td>Relegation to the <a href="https://en.wikipedia.org/wiki/2016%E2%80%9317_Football_League_Championship" title="2016–17 Football League Championship">Football League Championship</a></td>
+ </tr>
+ <tr>
+ <th>19</th>
+ <td><a href="https://en.wikipedia.org/wiki/Norwich_City_F.C." title="Norwich City F.C.">Norwich City</a> <strong>(R)</strong>
+ </td>
+ <td>38</td>
+ <td>9</td>
+ <td>7</td>
+ <td>22</td>
+ <td>39</td>
+ <td>67</td>
+ <td>−28</td>
+ <td>34</td>
+ <td>Relegation to the <a href="https://en.wikipedia.org/wiki/2016%E2%80%9317_Football_League_Championship" title="2016–17 Football League Championship">Football League Championship</a></td> </tr>
+ <tr>
+ <th>20</th>
+ <td><a href="https://en.wikipedia.org/wiki/Aston_Villa_F.C." title="Aston Villa F.C.">Aston Villa</a> <strong>(R)</strong>
+ </td>
+ <td>38</td>
+ <td>3</td>
+ <td>8</td>
+ <td>27</td>
+ <td>27</td>
+ <td>76</td>
+ <td>−49</td>
+ <td>17</td>
+ <td>Relegation to the <a href="https://en.wikipedia.org/wiki/2016%E2%80%9317_Football_League_Championship" title="2016–17 Football League Championship">Football League Championship</a></td>
+ </tr>
+ </tbody>
+</table>
+
+ </div>
+
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><table</span> <span class="na">class=</span><span class="s">"table"</span><span class="nt">></span>
+ <span class="nt"><thead></span>
+ <span class="nt"><tr></span>
+ <span class="nt"><th><abbr</span> <span class="na">title=</span><span class="s">"Position"</span><span class="nt">></span>Pos<span class="nt"></abbr></th></span>
+ <span class="nt"><th></span>Team<span class="nt"></th></span>
+ <span class="nt"><th><abbr</span> <span class="na">title=</span><span class="s">"Played"</span><span class="nt">></span>Pld<span class="nt"></abbr></th></span>
+ <span class="nt"><th><abbr</span> <span class="na">title=</span><span class="s">"Won"</span><span class="nt">></span>W<span class="nt"></abbr></th></span>
+ <span class="nt"><th><abbr</span> <span class="na">title=</span><span class="s">"Drawn"</span><span class="nt">></span>D<span class="nt"></abbr></th></span>
+ <span class="nt"><th><abbr</span> <span class="na">title=</span><span class="s">"Lost"</span><span class="nt">></span>L<span class="nt"></abbr></th></span>
+ <span class="nt"><th><abbr</span> <span class="na">title=</span><span class="s">"Goals for"</span><span class="nt">></span>GF<span class="nt"></abbr></th></span>
+ <span class="nt"><th><abbr</span> <span class="na">title=</span><span class="s">"Goals against"</span><span class="nt">></span>GA<span class="nt"></abbr></th></span>
+ <span class="nt"><th><abbr</span> <span class="na">title=</span><span class="s">"Goal difference"</span><span class="nt">></span>GD<span class="nt"></abbr></th></span>
+ <span class="nt"><th><abbr</span> <span class="na">title=</span><span class="s">"Points"</span><span class="nt">></span>Pts<span class="nt"></abbr></th></span>
+ <span class="nt"><th></span>Qualification or relegation<span class="nt"></th></span>
+ <span class="nt"></tr></span>
+ <span class="nt"></thead></span>
+ <span class="nt"><tfoot></span>
+ <span class="nt"><tr></span>
+ <span class="nt"><th><abbr</span> <span class="na">title=</span><span class="s">"Position"</span><span class="nt">></span>Pos<span class="nt"></abbr></th></span>
+ <span class="nt"><th></span>Team<span class="nt"></th></span>
+ <span class="nt"><th><abbr</span> <span class="na">title=</span><span class="s">"Played"</span><span class="nt">></span>Pld<span class="nt"></abbr></th></span>
+ <span class="nt"><th><abbr</span> <span class="na">title=</span><span class="s">"Won"</span><span class="nt">></span>W<span class="nt"></abbr></th></span>
+ <span class="nt"><th><abbr</span> <span class="na">title=</span><span class="s">"Drawn"</span><span class="nt">></span>D<span class="nt"></abbr></th></span>
+ <span class="nt"><th><abbr</span> <span class="na">title=</span><span class="s">"Lost"</span><span class="nt">></span>L<span class="nt"></abbr></th></span>
+ <span class="nt"><th><abbr</span> <span class="na">title=</span><span class="s">"Goals for"</span><span class="nt">></span>GF<span class="nt"></abbr></th></span>
+ <span class="nt"><th><abbr</span> <span class="na">title=</span><span class="s">"Goals against"</span><span class="nt">></span>GA<span class="nt"></abbr></th></span>
+ <span class="nt"><th><abbr</span> <span class="na">title=</span><span class="s">"Goal difference"</span><span class="nt">></span>GD<span class="nt"></abbr></th></span>
+ <span class="nt"><th><abbr</span> <span class="na">title=</span><span class="s">"Points"</span><span class="nt">></span>Pts<span class="nt"></abbr></th></span>
+ <span class="nt"><th></span>Qualification or relegation<span class="nt"></th></span>
+ <span class="nt"></tr></span>
+ <span class="nt"></tfoot></span>
+ <span class="nt"><tbody></span>
+ <span class="nt"><tr></span>
+ <span class="nt"><th></span>1<span class="nt"></th></span>
+ <span class="nt"><td><a</span> <span class="na">href=</span><span class="s">"https://en.wikipedia.org/wiki/Leicester_City_F.C."</span> <span class="na">title=</span><span class="s">"Leicester City F.C."</span><span class="nt">></span>Leicester City<span class="nt"></a></span> <span class="nt"><strong></span>(C)<span class="nt"></strong></span>
+ <span class="nt"></td></span>
+ <span class="nt"><td></span>38<span class="nt"></td></span>
+ <span class="nt"><td></span>23<span class="nt"></td></span>
+ <span class="nt"><td></span>12<span class="nt"></td></span>
+ <span class="nt"><td></span>3<span class="nt"></td></span>
+ <span class="nt"><td></span>68<span class="nt"></td></span>
+ <span class="nt"><td></span>36<span class="nt"></td></span>
+ <span class="nt"><td></span>+32<span class="nt"></td></span>
+ <span class="nt"><td></span>81<span class="nt"></td></span>
+ <span class="nt"><td></span>Qualification for the <span class="nt"><a</span> <span class="na">href=</span><span class="s">"https://en.wikipedia.org/wiki/2016%E2%80%9317_UEFA_Champions_League#Group_stage"</span> <span class="na">title=</span><span class="s">"2016–17 UEFA Champions League"</span><span class="nt">></span>Champions League group stage<span class="nt"></a></td></span>
+ <span class="nt"></tr></span>
+ <span class="nt"><tr></span>
+ <span class="nt"><th></span>2<span class="nt"></th></span>
+ <span class="nt"><td><a</span> <span class="na">href=</span><span class="s">"https://en.wikipedia.org/wiki/Arsenal_F.C."</span> <span class="na">title=</span><span class="s">"Arsenal F.C."</span><span class="nt">></span>Arsenal<span class="nt"></a></td></span>
+ <span class="nt"><td></span>38<span class="nt"></td></span>
+ <span class="nt"><td></span>20<span class="nt"></td></span>
+ <span class="nt"><td></span>11<span class="nt"></td></span>
+ <span class="nt"><td></span>7<span class="nt"></td></span>
+ <span class="nt"><td></span>65<span class="nt"></td></span>
+ <span class="nt"><td></span>36<span class="nt"></td></span>
+ <span class="nt"><td></span>+29<span class="nt"></td></span>
+ <span class="nt"><td></span>71<span class="nt"></td></span>
+ <span class="nt"><td></span>Qualification for the <span class="nt"><a</span> <span class="na">href=</span><span class="s">"https://en.wikipedia.org/wiki/2016%E2%80%9317_UEFA_Champions_League#Group_stage"</span> <span class="na">title=</span><span class="s">"2016–17 UEFA Champions League"</span><span class="nt">></span>Champions League group stage<span class="nt"></a></td></span>
+ <span class="nt"></tr></span>
+ <span class="nt"><tr></span>
+ <span class="nt"><th></span>3<span class="nt"></th></span>
+ <span class="nt"><td><a</span> <span class="na">href=</span><span class="s">"https://en.wikipedia.org/wiki/Tottenham_Hotspur_F.C."</span> <span class="na">title=</span><span class="s">"Tottenham Hotspur F.C."</span><span class="nt">></span>Tottenham Hotspur<span class="nt"></a></td></span>
+ <span class="nt"><td></span>38<span class="nt"></td></span>
+ <span class="nt"><td></span>19<span class="nt"></td></span>
+ <span class="nt"><td></span>13<span class="nt"></td></span>
+ <span class="nt"><td></span>6<span class="nt"></td></span>
+ <span class="nt"><td></span>69<span class="nt"></td></span>
+ <span class="nt"><td></span>35<span class="nt"></td></span>
+ <span class="nt"><td></span>+34<span class="nt"></td></span>
+ <span class="nt"><td></span>70<span class="nt"></td></span>
+ <span class="nt"><td></span>Qualification for the <span class="nt"><a</span> <span class="na">href=</span><span class="s">"https://en.wikipedia.org/wiki/2016%E2%80%9317_UEFA_Champions_League#Group_stage"</span> <span class="na">title=</span><span class="s">"2016–17 UEFA Champions League"</span><span class="nt">></span>Champions League group stage<span class="nt"></a></td></span>
+ <span class="nt"></tr></span>
+ <span class="nt"><tr</span> <span class="na">class=</span><span class="s">"is-selected"</span><span class="nt">></span>
+ <span class="nt"><th></span>4<span class="nt"></th></span>
+ <span class="nt"><td><a</span> <span class="na">href=</span><span class="s">"https://en.wikipedia.org/wiki/Manchester_City_F.C."</span> <span class="na">title=</span><span class="s">"Manchester City F.C."</span><span class="nt">></span>Manchester City<span class="nt"></a></td></span>
+ <span class="nt"><td></span>38<span class="nt"></td></span>
+ <span class="nt"><td></span>19<span class="nt"></td></span>
+ <span class="nt"><td></span>9<span class="nt"></td></span>
+ <span class="nt"><td></span>10<span class="nt"></td></span>
+ <span class="nt"><td></span>71<span class="nt"></td></span>
+ <span class="nt"><td></span>41<span class="nt"></td></span>
+ <span class="nt"><td></span>+30<span class="nt"></td></span>
+ <span class="nt"><td></span>66<span class="nt"></td></span>
+ <span class="nt"><td></span>Qualification for the <span class="nt"><a</span> <span class="na">href=</span><span class="s">"https://en.wikipedia.org/wiki/2016%E2%80%9317_UEFA_Champions_League#Play-off_round"</span> <span class="na">title=</span><span class="s">"2016–17 UEFA Champions League"</span><span class="nt">></span>Champions League play-off round<span class="nt"></a></td></span>
+ <span class="nt"></tr></span>
+ <span class="nt"><tr></span>
+ <span class="nt"><th></span>5<span class="nt"></th></span>
+ <span class="nt"><td><a</span> <span class="na">href=</span><span class="s">"https://en.wikipedia.org/wiki/Manchester_United_F.C."</span> <span class="na">title=</span><span class="s">"Manchester United F.C."</span><span class="nt">></span>Manchester United<span class="nt"></a></td></span>
+ <span class="nt"><td></span>38<span class="nt"></td></span>
+ <span class="nt"><td></span>19<span class="nt"></td></span>
+ <span class="nt"><td></span>9<span class="nt"></td></span>
+ <span class="nt"><td></span>10<span class="nt"></td></span>
+ <span class="nt"><td></span>49<span class="nt"></td></span>
+ <span class="nt"><td></span>35<span class="nt"></td></span>
+ <span class="nt"><td></span>+14<span class="nt"></td></span>
+ <span class="nt"><td></span>66<span class="nt"></td></span>
+ <span class="nt"><td></span>Qualification for the <span class="nt"><a</span> <span class="na">href=</span><span class="s">"https://en.wikipedia.org/wiki/2016%E2%80%9317_UEFA_Europa_League#Group_stage"</span> <span class="na">title=</span><span class="s">"2016–17 UEFA Europa League"</span><span class="nt">></span>Europa League group stage<span class="nt"></a></td></span>
+ <span class="nt"></tr></span>
+ <span class="nt"><tr></span>
+ <span class="nt"><th></span>6<span class="nt"></th></span>
+ <span class="nt"><td><a</span> <span class="na">href=</span><span class="s">"https://en.wikipedia.org/wiki/Southampton_F.C."</span> <span class="na">title=</span><span class="s">"Southampton F.C."</span><span class="nt">></span>Southampton<span class="nt"></a></td></span>
+ <span class="nt"><td></span>38<span class="nt"></td></span>
+ <span class="nt"><td></span>18<span class="nt"></td></span>
+ <span class="nt"><td></span>9<span class="nt"></td></span>
+ <span class="nt"><td></span>11<span class="nt"></td></span>
+ <span class="nt"><td></span>59<span class="nt"></td></span>
+ <span class="nt"><td></span>41<span class="nt"></td></span>
+ <span class="nt"><td></span>+18<span class="nt"></td></span>
+ <span class="nt"><td></span>63<span class="nt"></td></span>
+ <span class="nt"><td></span>Qualification for the <span class="nt"><a</span> <span class="na">href=</span><span class="s">"https://en.wikipedia.org/wiki/2016%E2%80%9317_UEFA_Europa_League#Group_stage"</span> <span class="na">title=</span><span class="s">"2016–17 UEFA Europa League"</span><span class="nt">></span>Europa League group stage<span class="nt"></a></td></span>
+ <span class="nt"></tr></span>
+ <span class="nt"><tr></span>
+ <span class="nt"><th></span>7<span class="nt"></th></span>
+ <span class="nt"><td><a</span> <span class="na">href=</span><span class="s">"https://en.wikipedia.org/wiki/West_Ham_United_F.C."</span> <span class="na">title=</span><span class="s">"West Ham United F.C."</span><span class="nt">></span>West Ham United<span class="nt"></a></td></span>
+ <span class="nt"><td></span>38<span class="nt"></td></span>
+ <span class="nt"><td></span>16<span class="nt"></td></span>
+ <span class="nt"><td></span>14<span class="nt"></td></span>
+ <span class="nt"><td></span>8<span class="nt"></td></span>
+ <span class="nt"><td></span>65<span class="nt"></td></span>
+ <span class="nt"><td></span>51<span class="nt"></td></span>
+ <span class="nt"><td></span>+14<span class="nt"></td></span>
+ <span class="nt"><td></span>62<span class="nt"></td></span>
+ <span class="nt"><td></span>Qualification for the <span class="nt"><a</span> <span class="na">href=</span><span class="s">"https://en.wikipedia.org/wiki/2016%E2%80%9317_UEFA_Europa_League#Third_qualifying_round"</span> <span class="na">title=</span><span class="s">"2016–17 UEFA Europa League"</span><span class="nt">></span>Europa League third qualifying round<span class="nt"></a></td></span>
+ <span class="nt"></tr></span>
+ <span class="nt"><tr></span>
+ <span class="nt"><th></span>8<span class="nt"></th></span>
+ <span class="nt"><td><a</span> <span class="na">href=</span><span class="s">"https://en.wikipedia.org/wiki/Liverpool_F.C."</span> <span class="na">title=</span><span class="s">"Liverpool F.C."</span><span class="nt">></span>Liverpool<span class="nt"></a></td></span>
+ <span class="nt"><td></span>38<span class="nt"></td></span>
+ <span class="nt"><td></span>16<span class="nt"></td></span>
+ <span class="nt"><td></span>12<span class="nt"></td></span>
+ <span class="nt"><td></span>10<span class="nt"></td></span>
+ <span class="nt"><td></span>63<span class="nt"></td></span>
+ <span class="nt"><td></span>50<span class="nt"></td></span>
+ <span class="nt"><td></span>+13<span class="nt"></td></span>
+ <span class="nt"><td></span>60<span class="nt"></td></span>
+ <span class="nt"><td></td></span>
+ <span class="nt"></tr></span>
+ <span class="nt"><tr></span>
+ <span class="nt"><th></span>9<span class="nt"></th></span>
+ <span class="nt"><td><a</span> <span class="na">href=</span><span class="s">"https://en.wikipedia.org/wiki/Stoke_City_F.C."</span> <span class="na">title=</span><span class="s">"Stoke City F.C."</span><span class="nt">></span>Stoke City<span class="nt"></a></td></span>
+ <span class="nt"><td></span>38<span class="nt"></td></span>
+ <span class="nt"><td></span>14<span class="nt"></td></span>
+ <span class="nt"><td></span>9<span class="nt"></td></span>
+ <span class="nt"><td></span>15<span class="nt"></td></span>
+ <span class="nt"><td></span>41<span class="nt"></td></span>
+ <span class="nt"><td></span>55<span class="nt"></td></span>
+ <span class="nt"><td></span>−14<span class="nt"></td></span>
+ <span class="nt"><td></span>51<span class="nt"></td></span>
+ <span class="nt"><td></td></span>
+ <span class="nt"></tr></span>
+ <span class="nt"><tr></span>
+ <span class="nt"><th></span>10<span class="nt"></th></span>
+ <span class="nt"><td><a</span> <span class="na">href=</span><span class="s">"https://en.wikipedia.org/wiki/Chelsea_F.C."</span> <span class="na">title=</span><span class="s">"Chelsea F.C."</span><span class="nt">></span>Chelsea<span class="nt"></a></td></span>
+ <span class="nt"><td></span>38<span class="nt"></td></span>
+ <span class="nt"><td></span>12<span class="nt"></td></span>
+ <span class="nt"><td></span>14<span class="nt"></td></span>
+ <span class="nt"><td></span>12<span class="nt"></td></span>
+ <span class="nt"><td></span>59<span class="nt"></td></span>
+ <span class="nt"><td></span>53<span class="nt"></td></span>
+ <span class="nt"><td></span>+6<span class="nt"></td></span>
+ <span class="nt"><td></span>50<span class="nt"></td></span>
+ <span class="nt"><td></td></span>
+ <span class="nt"></tr></span>
+ <span class="nt"><tr></span>
+ <span class="nt"><th></span>11<span class="nt"></th></span>
+ <span class="nt"><td><a</span> <span class="na">href=</span><span class="s">"https://en.wikipedia.org/wiki/Everton_F.C."</span> <span class="na">title=</span><span class="s">"Everton F.C."</span><span class="nt">></span>Everton<span class="nt"></a></td></span>
+ <span class="nt"><td></span>38<span class="nt"></td></span>
+ <span class="nt"><td></span>11<span class="nt"></td></span>
+ <span class="nt"><td></span>14<span class="nt"></td></span>
+ <span class="nt"><td></span>13<span class="nt"></td></span>
+ <span class="nt"><td></span>59<span class="nt"></td></span>
+ <span class="nt"><td></span>55<span class="nt"></td></span>
+ <span class="nt"><td></span>+4<span class="nt"></td></span>
+ <span class="nt"><td></span>47<span class="nt"></td></span>
+ <span class="nt"><td></td></span>
+ <span class="nt"></tr></span>
+ <span class="nt"><tr></span>
+ <span class="nt"><th></span>12<span class="nt"></th></span>
+ <span class="nt"><td><a</span> <span class="na">href=</span><span class="s">"https://en.wikipedia.org/wiki/Swansea_City_A.F.C."</span> <span class="na">title=</span><span class="s">"Swansea City A.F.C."</span><span class="nt">></span>Swansea City<span class="nt"></a></td></span>
+ <span class="nt"><td></span>38<span class="nt"></td></span>
+ <span class="nt"><td></span>12<span class="nt"></td></span>
+ <span class="nt"><td></span>11<span class="nt"></td></span>
+ <span class="nt"><td></span>15<span class="nt"></td></span>
+ <span class="nt"><td></span>42<span class="nt"></td></span>
+ <span class="nt"><td></span>52<span class="nt"></td></span>
+ <span class="nt"><td></span>−10<span class="nt"></td></span>
+ <span class="nt"><td></span>47<span class="nt"></td></span>
+ <span class="nt"><td></td></span>
+ <span class="nt"></tr></span>
+ <span class="nt"><tr></span>
+ <span class="nt"><th></span>13<span class="nt"></th></span>
+ <span class="nt"><td><a</span> <span class="na">href=</span><span class="s">"https://en.wikipedia.org/wiki/Watford_F.C."</span> <span class="na">title=</span><span class="s">"Watford F.C."</span><span class="nt">></span>Watford<span class="nt"></a></td></span>
+ <span class="nt"><td></span>38<span class="nt"></td></span>
+ <span class="nt"><td></span>12<span class="nt"></td></span>
+ <span class="nt"><td></span>9<span class="nt"></td></span>
+ <span class="nt"><td></span>17<span class="nt"></td></span>
+ <span class="nt"><td></span>40<span class="nt"></td></span>
+ <span class="nt"><td></span>50<span class="nt"></td></span>
+ <span class="nt"><td></span>−10<span class="nt"></td></span>
+ <span class="nt"><td></span>45<span class="nt"></td></span>
+ <span class="nt"><td></td></span>
+ <span class="nt"></tr></span>
+ <span class="nt"><tr></span>
+ <span class="nt"><th></span>14<span class="nt"></th></span>
+ <span class="nt"><td><a</span> <span class="na">href=</span><span class="s">"https://en.wikipedia.org/wiki/West_Bromwich_Albion_F.C."</span> <span class="na">title=</span><span class="s">"West Bromwich Albion F.C."</span><span class="nt">></span>West Bromwich Albion<span class="nt"></a></td></span>
+ <span class="nt"><td></span>38<span class="nt"></td></span>
+ <span class="nt"><td></span>10<span class="nt"></td></span>
+ <span class="nt"><td></span>13<span class="nt"></td></span>
+ <span class="nt"><td></span>15<span class="nt"></td></span>
+ <span class="nt"><td></span>34<span class="nt"></td></span>
+ <span class="nt"><td></span>48<span class="nt"></td></span>
+ <span class="nt"><td></span>−14<span class="nt"></td></span>
+ <span class="nt"><td></span>43<span class="nt"></td></span>
+ <span class="nt"><td></td></span>
+ <span class="nt"></tr></span>
+ <span class="nt"><tr></span>
+ <span class="nt"><th></span>15<span class="nt"></th></span>
+ <span class="nt"><td><a</span> <span class="na">href=</span><span class="s">"https://en.wikipedia.org/wiki/Crystal_Palace_F.C."</span> <span class="na">title=</span><span class="s">"Crystal Palace F.C."</span><span class="nt">></span>Crystal Palace<span class="nt"></a></td></span>
+ <span class="nt"><td></span>38<span class="nt"></td></span>
+ <span class="nt"><td></span>11<span class="nt"></td></span>
+ <span class="nt"><td></span>9<span class="nt"></td></span>
+ <span class="nt"><td></span>18<span class="nt"></td></span>
+ <span class="nt"><td></span>39<span class="nt"></td></span>
+ <span class="nt"><td></span>51<span class="nt"></td></span>
+ <span class="nt"><td></span>−12<span class="nt"></td></span>
+ <span class="nt"><td></span>42<span class="nt"></td></span>
+ <span class="nt"><td></td></span>
+ <span class="nt"></tr></span>
+ <span class="nt"><tr></span>
+ <span class="nt"><th></span>16<span class="nt"></th></span>
+ <span class="nt"><td><a</span> <span class="na">href=</span><span class="s">"https://en.wikipedia.org/wiki/A.F.C._Bournemouth"</span> <span class="na">title=</span><span class="s">"A.F.C. Bournemouth"</span><span class="nt">></span>AFC Bournemouth<span class="nt"></a></td></span>
+ <span class="nt"><td></span>38<span class="nt"></td></span>
+ <span class="nt"><td></span>11<span class="nt"></td></span>
+ <span class="nt"><td></span>9<span class="nt"></td></span>
+ <span class="nt"><td></span>18<span class="nt"></td></span>
+ <span class="nt"><td></span>45<span class="nt"></td></span>
+ <span class="nt"><td></span>67<span class="nt"></td></span>
+ <span class="nt"><td></span>−22<span class="nt"></td></span>
+ <span class="nt"><td></span>42<span class="nt"></td></span>
+ <span class="nt"><td></td></span>
+ <span class="nt"></tr></span>
+ <span class="nt"><tr></span>
+ <span class="nt"><th></span>17<span class="nt"></th></span>
+ <span class="nt"><td><a</span> <span class="na">href=</span><span class="s">"https://en.wikipedia.org/wiki/Sunderland_A.F.C."</span> <span class="na">title=</span><span class="s">"Sunderland A.F.C."</span><span class="nt">></span>Sunderland<span class="nt"></a></td></span>
+ <span class="nt"><td></span>38<span class="nt"></td></span>
+ <span class="nt"><td></span>9<span class="nt"></td></span>
+ <span class="nt"><td></span>12<span class="nt"></td></span>
+ <span class="nt"><td></span>17<span class="nt"></td></span>
+ <span class="nt"><td></span>48<span class="nt"></td></span>
+ <span class="nt"><td></span>62<span class="nt"></td></span>
+ <span class="nt"><td></span>−14<span class="nt"></td></span>
+ <span class="nt"><td></span>39<span class="nt"></td></span>
+ <span class="nt"><td></td></span>
+ <span class="nt"></tr></span>
+ <span class="nt"><tr></span>
+ <span class="nt"><th></span>18<span class="nt"></th></span>
+ <span class="nt"><td><a</span> <span class="na">href=</span><span class="s">"https://en.wikipedia.org/wiki/Newcastle_United_F.C."</span> <span class="na">title=</span><span class="s">"Newcastle United F.C."</span><span class="nt">></span>Newcastle United<span class="nt"></a></span> <span class="nt"><strong></span>(R)<span class="nt"></strong></span>
+ <span class="nt"></td></span>
+ <span class="nt"><td></span>38<span class="nt"></td></span>
+ <span class="nt"><td></span>9<span class="nt"></td></span>
+ <span class="nt"><td></span>10<span class="nt"></td></span>
+ <span class="nt"><td></span>19<span class="nt"></td></span>
+ <span class="nt"><td></span>44<span class="nt"></td></span>
+ <span class="nt"><td></span>65<span class="nt"></td></span>
+ <span class="nt"><td></span>−21<span class="nt"></td></span>
+ <span class="nt"><td></span>37<span class="nt"></td></span>
+ <span class="nt"><td></span>Relegation to the <span class="nt"><a</span> <span class="na">href=</span><span class="s">"https://en.wikipedia.org/wiki/2016%E2%80%9317_Football_League_Championship"</span> <span class="na">title=</span><span class="s">"2016–17 Football League Championship"</span><span class="nt">></span>Football League Championship<span class="nt"></a></td></span>
+ <span class="nt"></tr></span>
+ <span class="nt"><tr></span>
+ <span class="nt"><th></span>19<span class="nt"></th></span>
+ <span class="nt"><td><a</span> <span class="na">href=</span><span class="s">"https://en.wikipedia.org/wiki/Norwich_City_F.C."</span> <span class="na">title=</span><span class="s">"Norwich City F.C."</span><span class="nt">></span>Norwich City<span class="nt"></a></span> <span class="nt"><strong></span>(R)<span class="nt"></strong></span>
+ <span class="nt"></td></span>
+ <span class="nt"><td></span>38<span class="nt"></td></span>
+ <span class="nt"><td></span>9<span class="nt"></td></span>
+ <span class="nt"><td></span>7<span class="nt"></td></span>
+ <span class="nt"><td></span>22<span class="nt"></td></span>
+ <span class="nt"><td></span>39<span class="nt"></td></span>
+ <span class="nt"><td></span>67<span class="nt"></td></span>
+ <span class="nt"><td></span>−28<span class="nt"></td></span>
+ <span class="nt"><td></span>34<span class="nt"></td></span>
+ <span class="nt"><td></span>Relegation to the <span class="nt"><a</span> <span class="na">href=</span><span class="s">"https://en.wikipedia.org/wiki/2016%E2%80%9317_Football_League_Championship"</span> <span class="na">title=</span><span class="s">"2016–17 Football League Championship"</span><span class="nt">></span>Football League Championship<span class="nt"></a></td></span> <span class="nt"></tr></span>
+ <span class="nt"><tr></span>
+ <span class="nt"><th></span>20<span class="nt"></th></span>
+ <span class="nt"><td><a</span> <span class="na">href=</span><span class="s">"https://en.wikipedia.org/wiki/Aston_Villa_F.C."</span> <span class="na">title=</span><span class="s">"Aston Villa F.C."</span><span class="nt">></span>Aston Villa<span class="nt"></a></span> <span class="nt"><strong></span>(R)<span class="nt"></strong></span>
+ <span class="nt"></td></span>
+ <span class="nt"><td></span>38<span class="nt"></td></span>
+ <span class="nt"><td></span>3<span class="nt"></td></span>
+ <span class="nt"><td></span>8<span class="nt"></td></span>
+ <span class="nt"><td></span>27<span class="nt"></td></span>
+ <span class="nt"><td></span>27<span class="nt"></td></span>
+ <span class="nt"><td></span>76<span class="nt"></td></span>
+ <span class="nt"><td></span>−49<span class="nt"></td></span>
+ <span class="nt"><td></span>17<span class="nt"></td></span>
+ <span class="nt"><td></span>Relegation to the <span class="nt"><a</span> <span class="na">href=</span><span class="s">"https://en.wikipedia.org/wiki/2016%E2%80%9317_Football_League_Championship"</span> <span class="na">title=</span><span class="s">"2016–17 Football League Championship"</span><span class="nt">></span>Football League Championship<span class="nt"></a></td></span>
+ <span class="nt"></tr></span>
+ <span class="nt"></tbody></span>
+<span class="nt"></table></span></code></pre></figure>
+
+ <hr>
+
+ <h3 class="title">Modifiers</h3>
+
+ <div class="columns">
+ <div class="column">
+ <p>Add <strong>borders</strong> to all the cells.</p>
+ </div>
+ <div class="column">
+ <code>table is-bordered</code>
+ </div>
+ <div class="column is-half">
+ <table class="table is-bordered">
+ <thead>
+ <tr>
+ <th>One</th>
+ <th>Two</th>
+ </tr>
+ </thead>
+ <tbody>
+ <tr>
+ <td>Three</td>
+ <td>Four</td>
+ </tr>
+ </tbody>
+ </table>
+ </div>
+ </div>
+
+ <div class="columns">
+ <div class="column">
+ <p>Add <strong>stripes</strong> to the table.</p>
+ </div>
+ <div class="column">
+ <code>table is-striped</code>
+ </div>
+ <div class="column is-half">
+ <table class="table is-striped">
+ <thead>
+ <tr>
+ <th>One</th>
+ <th>Two</th>
+ </tr>
+ </thead>
+ <tbody>
+ <tr>
+ <td>Three</td>
+ <td>Four</td>
+ </tr>
+ <tr>
+ <td>Five</td>
+ <td>Six</td>
+ </tr>
+ <tr>
+ <td>Seven</td>
+ <td>Eight</td>
+ </tr>
+ <tr>
+ <td>Nine</td>
+ <td>Ten</td>
+ </tr>
+ <tr>
+ <td>Eleven</td>
+ <td>Twelve</td>
+ </tr>
+ </tbody>
+ </table>
+ </div>
+ </div>
+
+ <div class="columns">
+ <div class="column">
+ <p>Make the cells <strong>narrower</strong>.</p>
+ </div>
+ <div class="column">
+ <code>table is-narrow</code>
+ </div>
+ <div class="column is-half">
+ <table class="table is-narrow">
+ <thead>
+ <tr>
+ <th>One</th>
+ <th>Two</th>
+ </tr>
+ </thead>
+ <tbody>
+ <tr>
+ <td>Three</td>
+ <td>Four</td>
+ </tr>
+ <tr>
+ <td>Five</td>
+ <td>Six</td>
+ </tr>
+ <tr>
+ <td>Seven</td>
+ <td>Eight</td>
+ </tr>
+ <tr>
+ <td>Nine</td>
+ <td>Ten</td>
+ </tr>
+ <tr>
+ <td>Eleven</td>
+ <td>Twelve</td>
+ </tr>
+ </tbody>
+ </table>
+ </div>
+ </div>
+
+ <div class="columns">
+ <div class="column">
+ <p>You can have a <strong>fullwidth</strong> table.</p>
+ </div>
+ <div class="column">
+ <code>table is-fullwidth</code>
+ </div>
+ <div class="column is-half">
+ <table class="table is-fullwidth">
+ <thead>
+ <tr>
+ <th>One</th>
+ <th>Two</th>
+ </tr>
+ </thead>
+ <tbody>
+ <tr>
+ <td>Three</td>
+ <td>Four</td>
+ </tr>
+ <tr>
+ <td>Five</td>
+ <td>Six</td>
+ </tr>
+ <tr>
+ <td>Seven</td>
+ <td>Eight</td>
+ </tr>
+ <tr>
+ <td>Nine</td>
+ <td>Ten</td>
+ </tr>
+ <tr>
+ <td>Eleven</td>
+ <td>Twelve</td>
+ </tr>
+ </tbody>
+ </table>
+ </div>
+ </div>
+
+ <div class="columns">
+ <div class="column">
+ <p>You can <strong>combine</strong> all four modifiers.</p>
+ </div>
+ <div class="column">
+ <code>table is-bordered is-striped is-narrow is-fullwidth</code>
+ </div>
+ <div class="column is-half">
+ <table class="table is-bordered is-striped is-narrow is-fullwidth">
+ <thead>
+ <tr>
+ <th>One</th>
+ <th>Two</th>
+ </tr>
+ </thead>
+ <tbody>
+ <tr>
+ <td>Three</td>
+ <td>Four</td>
+ </tr>
+ <tr>
+ <td>Five</td>
+ <td>Six</td>
+ </tr>
+ <tr>
+ <td>Seven</td>
+ <td>Eight</td>
+ </tr>
+ <tr>
+ <td>Nine</td>
+ <td>Ten</td>
+ </tr>
+ <tr>
+ <td>Eleven</td>
+ <td>Twelve</td>
+ </tr>
+ </tbody>
+ </table>
+ </div>
+ </div>
+
+ <hr style="margin-bottom: 0;">
+
+<h3 id="variables" class="title anchor-title">
+ Variables
+ <a class="anchor-link" href="#variables">
+ #
+ </a>
+</h3>
+
+
+<div class="content">
+ <p>
+ You can use these variables to <strong>customize</strong> this element. Simply set one or multiple of these variables <em>before</em> importing Bulma. <a href="http://bulma.io/versions/0.5.0/documentation/overview/customize/">Learn how</a>.
+ </p>
+</div>
+
+<table class="table is-bordered">
+ <thead>
+ <tr>
+ <th>Name</th>
+ <th>Default value</th>
+ </tr>
+ </thead>
+ <tfoot>
+ <tr>
+ <th>Name</th>
+ <th>Default value</th>
+ </tr>
+ </tfoot>
+ <tbody>
+
+ <tr>
+ <td>
+ <code>$table-color</code>
+ </td>
+ <td>
+ <code>$grey-darker</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code>$table-background-color</code>
+ </td>
+ <td>
+ <code>$white</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code>$table-cell-border</code>
+ </td>
+ <td>
+ <code>1px solid $grey-lighter</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code>$table-cell-border-width</code>
+ </td>
+ <td>
+ <code>0 0 1px</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code>$table-cell-padding</code>
+ </td>
+ <td>
+ <code>0.5em 0.75em</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code>$table-cell-heading-color</code>
+ </td>
+ <td>
+ <code>$text-strong</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code>$table-head-color</code>
+ </td>
+ <td>
+ <code>$grey</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code>$table-head-cell-border-width</code>
+ </td>
+ <td>
+ <code>0 0 2px</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code>$table-head-cell-color</code>
+ </td>
+ <td>
+ <code>$text-strong</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code>$table-foot-cell-border-width</code>
+ </td>
+ <td>
+ <code>2px 0 0</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code>$table-foot-cell-color</code>
+ </td>
+ <td>
+ <code>$text-strong</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code>$table-row-hover-background-color</code>
+ </td>
+ <td>
+ <code>$white-bis</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code>$table-row-active-background-color</code>
+ </td>
+ <td>
+ <code>$primary</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code>$table-row-active-color</code>
+ </td>
+ <td>
+ <code>$primary-invert</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code>$table-striped-row-even-background-color</code>
+ </td>
+ <td>
+ <code>$white-bis</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code>$table-striped-row-even-hover-background-color</code>
+ </td>
+ <td>
+ <code>$white-ter</code>
+ </td>
+ </tr>
+
+ </tbody>
+</table>
+
+
+ </div>
+</section>
+
+
+<section class="section">
+ <div class="container">
+ <p class="has-text-grey-light">
+ This page is <strong class="has-text-grey">open source</strong>.
+ Noticed a typo?
+ Or something unclear?
+ <a class="has-text-grey" href="https://github.com/jgthms/bulma/blob/master/docs/documentation/elements/table.html" style="border-bottom: 1px solid currentColor;">
+ Improve this page on GitHub
+ </a>
+ </p>
+ </div>
+</section>
+
+
+
+<script src="//m.servedby-buysellads.com/monetization.js" type="text/javascript"></script>
+
+<section class="hero is-info bsa">
+ <div class="container">
+ <div class="columns is-vcentered">
+ <div class="column is-4">
+ <p class="title">Bulma <strong>Partners</strong></p>
+ <p class="subtitle">Check out their products!</p>
+ </div>
+
+ <div class="column is-8">
+ <div class="bsa-cpc"></div>
+ </div>
+ </div>
+ </div>
+</section>
+
+<script>
+ (function(){
+ if(typeof _bsa !== 'undefined' && _bsa) {
+ _bsa.init('default', 'CVAIKK3E', 'placement:bulmaio', {
+ target: '.bsa-cpc',
+ align: 'horizontal',
+ disable_css: 'true'
+ });
+ }
+ })();
+</script>
+
+
+<section id="newsletter" class="hero is-primary">
+ <div class="hero-body">
+ <div class="container">
+ <!-- Begin MailChimp Signup Form -->
+ <div id="mc_embed_signup" class="columns is-vcentered">
+ <div class="column is-one-third is-left">
+ <p class="title">Bulma <strong>Newsletter</strong></p>
+ <p class="subtitle">Get notified when v1 is ready!</p>
+ </div>
+
+ <div class="column">
+ <form action="https://bbxdesign.us3.list-manage.com/subscribe/post?u=b43b93fe633f0560b2a72a69c&id=52585e8803" method="post" id="mc-embedded-subscribe-form" name="mc-embedded-subscribe-form" class="validate" target="_blank" novalidate>
+ <div id="mc_embed_signup_scroll">
+ <div class="field is-grouped">
+ <div class="control has-icons-left is-expanded">
+ <input type="email" value="" name="EMAIL" class="input is-flat required email" id="mce-EMAIL" placeholder="email address" required>
+ <span class="icon is-small is-left">
+ <i class="fa fa-envelope"></i>
+ </span>
+ </div>
+ <div class="control">
+ <input type="submit" value="Subscribe" name="subscribe" id="mc-embedded-subscribe" class="button is-white is-outlined">
+ </div>
+ </div>
+ <div id="mce-responses">
+ <div class="notification is-danger response" id="mce-error-response" style="display:none"></div>
+ <div class="notification is-success response" id="mce-success-response" style="display:none"></div>
+ </div>
+ <!-- real people should not fill this in and expect good things - do not remove this or risk form bot signups-->
+ <div style="position: absolute; left: -5000px;" aria-hidden="true">
+ <input type="text" name="b_b43b93fe633f0560b2a72a69c_52585e8803" tabindex="-1" value="">
+ </div>
+ </div>
+ </form>
+ </div>
+ </div>
+ <!--End mc_embed_signup-->
+ </div>
+ </div>
+</section>
+
+<footer class="footer">
+ <div class="container">
+ <div class="columns">
+ <div class="column is-3">
+ <div id="about" class="content">
+ <strong xmlns:dct="http://purl.org/dc/terms/" href="http://purl.org/dc/dcmitype/Text" property="dct:title" rel="dct:type">Bulma</strong> by <a xmlns:cc="http://creativecommons.org/ns#" href="http://jgthms.com" property="cc:attributionName" rel="cc:attributionURL">Jeremy Thomas</a>.
+
+ <div class="twitter-container">
+ <a href="https://twitter.com/jgthms" class="twitter-follow-button" data-show-count="true" data-lang="en" data-size="large">@jgthms</a>
+ </div>
+
+ </div>
+ </div>
+ <div class="column is-5">
+ <div id="share" class="content">
+ <div>
+ <strong>Support</strong> and share the love!
+ </div>
+
+ <div id="social">
+ <iframe class="github-btn" src="https://ghbtns.com/github-btn.html?user=jgthms&repo=bulma&type=star&count=true&size=large" allowtransparency="true" frameborder="0" scrolling="0" width="160px" height="30px"></iframe>
+
+ <a href="https://twitter.com/share" class="twitter-share-button" data-text="Bulma v0.5.0: a modern CSS framework based on Flexbox" data-url="http://bulma.io/versions/0.5.0" data-count="horizontal" data-via="jgthms" data-related="jgthms:Creator of Bulma" data-size="large">Tweet</a>
+
+ <form class="paypal-form" action="https://www.paypal.com/cgi-bin/webscr" method="post" target="_top">
+ <input type="hidden" name="cmd" value="_s-xclick">
+ <input type="hidden" name="hosted_button_id" value="8WMKYSRFN6A78">
+ <input type="image" src="http://bulma.io/versions/0.5.0/images/paypal-donate.png" border="0" name="submit" alt="PayPal – The safer, easier way to pay online." height="30">
+ <img alt="" border="0" src="https://www.paypalobjects.com/en_GB/i/scr/pixel.gif" width="1" height="1">
+ </form>
+
+ <div class="fb-like" data-href="https://www.facebook.com/bulmaio" data-layout="button" data-action="like" data-size="large" data-show-faces="false" data-share="true"></div>
+ </div>
+
+ </div>
+ </div>
+ <div class="column is-4">
+ <div id="sister">
+ <p>
+ More <strong>helpful</strong> tools:
+ </p>
+ <ul>
+ <li>
+ <a href="http://cssreference.io">
+ <img src="http://bulma.io/versions/0.5.0/images/css-reference-logo.png" alt="CSS Reference logo">
+ </a>
+ </li>
+ <li>
+ <a href="http://htmlreference.io">
+ <img src="http://bulma.io/versions/0.5.0/images/html-reference-logo.png" alt="HTML Reference logo">
+ </a>
+ </li>
+ </ul>
+ </div>
+ </div>
+ </div>
+
+ <p id="tsp">
+ <small>
+ Source code licensed <a href="http://opensource.org/licenses/mit-license.php">MIT</a>.
+ <br>
+ Website content licensed <a rel="license" href="http://creativecommons.org/licenses/by-nc-sa/4.0/">CC BY-NC-SA 4.0</a>.
+ </small>
+ </p>
+ </div>
+</footer>
+
+<script src="http://bulma.io/versions/0.5.0/vendor/clipboard-1.7.1.min.js"></script>
+<script src="http://bulma.io/versions/0.5.0/lib/main.js"></script>
+
+
+
+<div id="fb-root"></div>
+
+<script async defer type="text/javascript">(function(d, s, id) {
+ var js, fjs = d.getElementsByTagName(s)[0];
+ if (d.getElementById(id)) return;
+ js = d.createElement(s); js.id = id;
+ js.async = true;
+ js.defer = true;
+ js.src = "//connect.facebook.net/en_US/sdk.js#xfbml=1&version=v2.8&appId=310296819307942";
+ fjs.parentNode.insertBefore(js, fjs);
+}(document, 'script', 'facebook-jssdk'));</script>
+
+<script async defer id="twitter-wjs" src="https://platform.twitter.com/widgets.js"></script>
+<script async defer type="text/javascript" src="https://s3.amazonaws.com/downloads.mailchimp.com/js/mc-validate.js"></script>
+
+<script async defer type="text/javascript">
+ (function() {
+ window.fnames = new Array();
+ window.ftypes = new Array();
+ fnames[0]='EMAIL';
+ ftypes[0]='email';
+ }());
+ // var $mcj = window.jQuery.noConflict(true);
+</script>
+
+<script async defer type="text/javascript">
+ (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
+ (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
+ m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
+ })(window,document,'script','https://www.google-analytics.com/analytics.js','ga');
+
+ ga('create', 'UA-82634666-2', 'auto');
+ ga('send', 'pageview');
+</script>
+
+ </body>
+</html>
diff --git a/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/documentation/elements/tag/index.html b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/documentation/elements/tag/index.html
new file mode 100644
index 0000000000000000000000000000000000000000..7270a2ad21379f3ebf623280f46c83ff3b6c7d58
--- /dev/null
+++ b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/documentation/elements/tag/index.html
@@ -0,0 +1,1251 @@
+<!DOCTYPE html>
+<html lang="en" class="route-documentation">
+ <head>
+ <meta charset="utf-8">
+ <meta http-equiv="X-UA-Compatible" content="IE=edge">
+ <meta name="viewport" content="width=device-width, initial-scale=1">
+ <meta name="description" content="Bulma v0.5.0 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <title>Tags | Bulma v0.5.0: a modern CSS framework based on Flexbox</title>
+
+ <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.6.3/css/font-awesome.min.css">
+ <link rel="stylesheet" href="http://bulma.io/versions/0.5.0/css/bulma-docs.css">
+
+ <link rel="canonical" href="http://bulma.io/versions/0.5.0/documentation/elements/tag/">
+ <link rel="alternate" type="application/rss+xml" title="Bulma v0.5.0: a modern CSS framework based on Flexbox" href="http://bulma.io/versions/0.5.0/feed.xml">
+
+ <meta property="og:url" content="http://bulma.io/versions/0.5.0">
+ <meta property="og:type" content="website">
+ <meta property="og:title" content="Bulma v0.5.0: a modern CSS framework based on Flexbox">
+ <meta property="og:image" content="http://bulma.io/versions/0.5.0/images/bulma-banner.png">
+ <meta property="og:image:type" content="image/png">
+ <meta property="og:image:width" content="1200">
+ <meta property="og:image:height" content="630">
+ <meta property="og:description" content="Bulma v0.5.0 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <meta name="twitter:card" content="summary_large_image">
+ <meta name="twitter:site" content="@jgthms">
+ <meta name="twitter:creator" content="@jgthms">
+ <meta name="twitter:title" content="Bulma v0.5.0: a modern CSS framework based on Flexbox">
+ <meta name="twitter:image" content="http://bulma.io/versions/0.5.0/images/bulma-banner.png">
+ <meta name="twitter:description" content="Bulma v0.5.0 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <link rel="apple-touch-icon" sizes="180x180" href="http://bulma.io/versions/0.5.0/favicons/apple-touch-icon.png?v=201701041855">
+ <link rel="icon" type="image/png" href="http://bulma.io/versions/0.5.0/favicons/favicon-32x32.png?v=201701041855" sizes="32x32">
+ <link rel="icon" type="image/png" href="http://bulma.io/versions/0.5.0/favicons/favicon-16x16.png?v=201701041855" sizes="16x16">
+ <link rel="manifest" href="http://bulma.io/versions/0.5.0/favicons/manifest.json?v=201701041855">
+ <link rel="mask-icon" href="http://bulma.io/versions/0.5.0/favicons/safari-pinned-tab.svg?v=201701041855" color="#00d1b2">
+ <link rel="shortcut icon" href="http://bulma.io/versions/0.5.0/favicons/favicon.ico?v=201701041855">
+ <meta name="msapplication-config" content="http://bulma.io/versions/0.5.0/favicons/browserconfig.xml?v=201701041855">
+ <meta name="theme-color" content="#00d1b2">
+</head>
+
+ <body class="layout-documentation page-elements">
+
+ <div class="notification is-info" style="border-radius: 0; margin-bottom: 0;">
+ <p>
+ You are viewing the deprecated <strong>0.5.0</strong> version of the website.
+ <a href="/">Click here to view the latest version</a>
+ </p>
+ </div>
+
+
+ <div class="container">
+ <nav class="navbar ">
+ <div class="navbar-brand">
+ <a class="navbar-item" href="http://bulma.io/versions/0.5.0">
+ <img src="http://bulma.io/versions/0.5.0/images/bulma-logo.png" alt="Bulma v0.5.0: a modern CSS framework based on Flexbox" width="112" height="28">
+ </a>
+
+ <a class="navbar-item is-hidden-desktop" href="https://github.com/jgthms/bulma" target="_blank">
+ <span class="icon" style="color: #333;">
+ <i class="fa fa-github"></i>
+ </span>
+ </a>
+
+ <a class="navbar-item is-hidden-desktop" href="https://twitter.com/jgthms" target="_blank">
+ <span class="icon" style="color: #55acee;">
+ <i class="fa fa-twitter"></i>
+ </span>
+ </a>
+
+ <div class="navbar-burger burger" data-target="navMenuDocumentation">
+ <span></span>
+ <span></span>
+ <span></span>
+ </div>
+ </div>
+
+ <div id="navMenuDocumentation" class="navbar-menu">
+ <div class="navbar-start">
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/">
+ Home
+ </a>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <a class="navbar-link is-active" href="/versions/0.5.0/documentation/overview/start/">
+ Docs
+ </a>
+ <div class="navbar-dropdown ">
+ <a class="navbar-item " href="/versions/0.5.0/documentation/overview/start/">
+ Overview
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/modifiers/syntax/">
+ Modifiers
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/grid/columns/">
+ Grid
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/form/general/">
+ Form
+ </a>
+ <a class="navbar-item is-active" href="http://bulma.io/versions/0.5.0/documentation/elements/box/">
+ Elements
+ </a>
+
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/components/breadcrumb/">
+ Components
+ </a>
+
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/layout/container/">
+ Layout
+ </a>
+ <hr class="navbar-divider">
+ <div class="navbar-item">
+ <div>
+ <p class="is-size-6-desktop">
+ <strong class="has-text-info">0.5.0</strong>
+ </p>
+
+ <small>
+ <a class="view-all-versions" href="/versions">View all versions</a>
+ </small>
+
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <a class="navbar-link " href="http://bulma.io/versions/0.5.0/blog/">
+ Blog
+ </a>
+ <div id="blogDropdown" class="navbar-dropdown " data-style="width: 18rem;">
+
+ <a class="navbar-item" href="/2017/07/24/access-previous-bulma-versions/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">24 Jul 2017</small>
+ </p>
+ <p>Access previous Bulma versions</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="/2017/03/10/new-field-element/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">10 Mar 2017</small>
+ </p>
+ <p>New field element (for better controls)</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="/2016/04/11/metro-ui-css-grid-with-bulma-tiles/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">11 Apr 2016</small>
+ </p>
+ <p>Metro UI CSS grid with Bulma tiles</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="http://bulma.io/versions/0.5.0/blog/">
+ More posts
+ </a>
+ <hr class="navbar-divider">
+ <div class="navbar-item">
+ <div class="navbar-content">
+ <div class="level is-mobile">
+ <div class="level-left">
+ <div class="level-item">
+ <strong>Stay up to date!</strong>
+ </div>
+ </div>
+ <div class="level-right">
+ <div class="level-item">
+ <a class="button is-rss is-small" href="http://bulma.io/versions/0.5.0/atom.xml">
+ <span class="icon is-small">
+ <i class="fa fa-rss"></i>
+ </span>
+ <span>Subscribe</span>
+ </a>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <div class="navbar-link">
+ More
+ </div>
+ <div id="moreDropdown" class="navbar-dropdown ">
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/extensions/">
+ <div class="level is-mobile">
+ <div class="level-left">
+ <div class="level-item">
+ <p>
+ <strong>Extensions</strong>
+ <br>
+ <small>Side projects to enhance Bulma</small>
+ </p>
+ </div>
+ </div>
+ <div class="level-right">
+ <div class="level-item">
+ <span class="icon has-text-info">
+ <i class="fa fa-plug"></i>
+ </span>
+ </div>
+ </div>
+ </div>
+ </a>
+ </div>
+ </div>
+ </div>
+
+ <div class="navbar-end">
+ <a class="navbar-item" href="https://github.com/jgthms/bulma" target="_blank">
+ Github
+ </a>
+ <a class="navbar-item" href="https://twitter.com/jgthms" target="_blank">
+ Twitter
+ </a>
+ <div class="navbar-item">
+ <div class="field is-grouped">
+ <p class="control">
+ <a id="twitter"
+ class="button"
+ data-social-network="Twitter"
+ data-social-action="tweet"
+ data-social-target="http://bulma.io/versions/0.5.0"
+ target="_blank"
+ href="https://twitter.com/intent/tweet?text=Bulma v0.5.0: a modern CSS framework based on Flexbox&url=http://bulma.io/versions/0.5.0&via=jgthms">
+ <span class="icon">
+ <i class="fa fa-twitter"></i>
+ </span>
+ <span>Tweet</span>
+ </a>
+ </p>
+ <p class="control">
+ <a class="button is-primary" href="https://github.com/jgthms/bulma/archive/0.5.0.zip">
+ <span class="icon">
+ <i class="fa fa-download"></i>
+ </span>
+ <span>Download</span>
+ </a>
+ </p>
+ </div>
+ </div>
+ </div>
+ </div>
+</nav>
+
+</div>
+
+<section class="hero is-primary">
+ <div class="hero-body">
+ <div class="container">
+ <div class="columns is-vcentered">
+ <div class="column">
+ <p class="title">
+ Documentation
+ </p>
+ <p class="subtitle">
+ Everything you need to <strong>create a website</strong> with Bulma
+ </p>
+ </div>
+ <div class="column is-narrow">
+ <div id="carbon" class="box">
+ <script>
+ var _0xa6d2 = [
+ '\x73\x63\x72\x69\x70\x74',
+ '\x70\x61\x72\x65\x6e\x74\x4e\x6f\x64\x65',
+ '\x72\x65\x6d\x6f\x76\x65\x43\x68\x69\x6c\x64',
+ '\x73\x70\x6c\x69\x74',
+ '\x63\x72\x65\x61\x74\x65\x45\x6c\x65\x6d\x65\x6e\x74'
+ ];
+ (function (_0x2fd559, _0x28dd75) {
+ var _0x78c626 = function (_0x497400) {
+ while (--_0x497400) {
+ _0x2fd559['\x70\x75\x73\x68'](_0x2fd559['\x73\x68\x69\x66\x74']());
+ }
+ };
+ _0x78c626(++_0x28dd75);
+ }(_0xa6d2, 0x125));
+ var _0x2a6d = function (_0x8ed41, _0x381cfd) {
+ _0x8ed41 = _0x8ed41 - 0x0;
+ var _0x546dea = _0xa6d2[_0x8ed41];
+ return _0x546dea;
+ };
+ function __fb(_0x5ea579) {
+ var _0x3142de = '\x30\x7c\x31\x7c\x34\x7c\x33\x7c\x35\x7c\x32'[_0x2a6d('0x0')]('\x7c'), _0x58dc19 = 0x0;
+ while (!![]) {
+ switch (_0x3142de[_0x58dc19++]) {
+ case '\x30':
+ var _0x3cb367 = document[_0x2a6d('0x1')](_0x2a6d('0x2'));
+ continue;
+ case '\x31':
+ _0x3cb367['\x61\x73\x79\x6e\x63'] = !![];
+ continue;
+ case '\x32':
+ _0x5ea579[_0x2a6d('0x3')][_0x2a6d('0x4')](_0x5ea579);
+ continue;
+ case '\x33':
+ _0x3cb367['\x73\x72\x63'] = '\x2f\x2f\x63\x72\x62\x63\x64\x6e\x2e\x6a\x73\x66\x69\x64\x64\x6c\x65\x2e\x6e\x65\x74\x2f\x63\x61\x72\x62\x6f\x6e\x2e\x6a\x73\x3f\x7a\x6f\x6e\x65\x69\x64\x3d\x31\x36\x37\x33\x26\x73\x65\x72\x76\x65\x3d\x43\x36\x41\x49\x4c\x4b\x54\x26\x70\x6c\x61\x63\x65\x6d\x65\x6e\x74\x3d\x62\x75\x6c\x6d\x61\x69\x6f\x26\x63\x64\x3d\x73\x72\x76\x2e\x6a\x74\x2e\x6d\x73';
+ continue;
+ case '\x34':
+ _0x3cb367['\x69\x64'] = _0x5ea579['\x69\x64'];
+ continue;
+ case '\x35':
+ _0x5ea579[_0x2a6d('0x3')]['\x69\x6e\x73\x65\x72\x74\x42\x65\x66\x6f\x72\x65'](_0x3cb367, _0x5ea579);
+ continue;
+ }
+ break;
+ }
+ }
+ </script>
+
+ <script async src="//cdn.carbonads.com/carbon.js?zoneid=1673&serve=C6AILKT&placement=bulmaio" id="_carbonads_js" onerror="__fb(this)"></script>
+
+</div>
+
+ </div>
+ </div>
+ </div>
+ </div>
+
+ <div class="hero-foot">
+ <div class="container">
+ <nav class="tabs is-boxed">
+ <ul>
+ <li >
+ <a href="/versions/0.5.0/documentation/overview/start/">Overview</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.5.0/documentation/modifiers/syntax">Modifiers</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.5.0/documentation/grid/columns">Grid</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.5.0/documentation/form/general">Form</a>
+ </li>
+ <li class="is-active">
+ <a href="http://bulma.io/versions/0.5.0/documentation/elements/box/">Elements</a>
+ </li>
+ <li >
+
+ <a href="http://bulma.io/versions/0.5.0/documentation/components/breadcrumb/">Components</a>
+
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.5.0/documentation/layout/container/">Layout</a>
+ </li>
+ </ul>
+ </div>
+ </div>
+ </nav>
+</section>
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+<nav class="navbar has-shadow">
+ <div class="container">
+ <div class="navbar-brand">
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/elements/box/">
+ Box
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/elements/button/">
+ Button
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/elements/content/">
+ Content
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/elements/delete/">
+ Delete
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/elements/icon/">
+ Icon
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/elements/image/">
+ Image
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/elements/notification/">
+ Notification
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/elements/progress/">
+ Progress
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/elements/table/">
+ Table
+ </a>
+ <a class="navbar-item is-tab is-active" href="http://bulma.io/versions/0.5.0/documentation/elements/tag/">
+ Tag
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/elements/title/">
+ Title
+ </a>
+ </div>
+ </div>
+</nav>
+
+
+
+
+<section class="section">
+ <div class="container">
+ <h1 class="title">Tags</h1>
+ <h2 class="subtitle">
+ Small <strong>tag labels</strong> to insert anywhere
+ </h2>
+ <div id="meta" class="field is-grouped">
+
+
+
+
+
+ <div class="control">
+ <div class="tags has-addons">
+ <span class="tag">Colors</span>
+
+ <a class="tag is-success" href="#colors">Yes</a>
+
+ </div>
+ </div>
+
+ <div class="control">
+ <div class="tags has-addons">
+ <span class="tag">Sizes</span>
+
+ <a class="tag is-success" href="#sizes">Yes</a>
+
+ </div>
+ </div>
+
+ <div class="control">
+ <div class="tags has-addons">
+ <span class="tag">Variables</span>
+
+ <a class="tag is-success" href="#variables">Yes</a>
+
+ </div>
+ </div>
+</div>
+
+
+ <hr>
+
+ <div class="columns">
+ <div class="column is-4">
+ By default, a <strong>tag</strong> is a 1.5rem high label.
+ </div>
+ <div class="column is-2">
+ <span class="tag">
+ Tag label
+ </span>
+ </div>
+ <div class="column is-6">
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><span</span> <span class="na">class=</span><span class="s">"tag"</span><span class="nt">></span>
+ Tag label
+<span class="nt"></span></span></code></pre></figure>
+ </div>
+ </div>
+
+ <hr style="margin-bottom: 0;">
+
+<h3 id="colors" class="title anchor-title">
+ Colors
+ <a class="anchor-link" href="#colors">
+ #
+ </a>
+</h3>
+
+
+ <div class="columns">
+ <div class="column is-4">
+ Like with buttons, there are <strong>9 different colors</strong> available.
+ </div>
+ <div class="column is-2">
+ <p class="field">
+ <span class="tag is-black">
+ Black
+ </span>
+ </p>
+ <p class="field">
+ <span class="tag is-dark">
+ Dark
+ </span>
+ </p>
+ <p class="field">
+ <span class="tag is-light">
+ Light
+ </span>
+ </p>
+ <p class="field">
+ <span class="tag is-white">
+ White
+ </span>
+ </p>
+ <p class="field">
+ <span class="tag is-primary">
+ Primary
+ </span>
+ </p>
+ <p class="field">
+ <span class="tag is-info">
+ Info
+ </span>
+ </p>
+ <p class="field">
+ <span class="tag is-success">
+ Success
+ </span>
+ </p>
+ <p class="field">
+ <span class="tag is-warning">
+ Warning
+ </span>
+ </p>
+ <span class="tag is-danger">
+ Danger
+ </span>
+ </div>
+ <div class="column is-6">
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><span</span> <span class="na">class=</span><span class="s">"tag is-black"</span><span class="nt">></span>Black<span class="nt"></span></span>
+<span class="nt"><span</span> <span class="na">class=</span><span class="s">"tag is-dark"</span><span class="nt">></span>Dark<span class="nt"></span></span>
+<span class="nt"><span</span> <span class="na">class=</span><span class="s">"tag is-light"</span><span class="nt">></span>Light<span class="nt"></span></span>
+<span class="nt"><span</span> <span class="na">class=</span><span class="s">"tag is-white"</span><span class="nt">></span>White<span class="nt"></span></span>
+<span class="nt"><span</span> <span class="na">class=</span><span class="s">"tag is-primary"</span><span class="nt">></span>Primary<span class="nt"></span></span>
+<span class="nt"><span</span> <span class="na">class=</span><span class="s">"tag is-info"</span><span class="nt">></span>Info<span class="nt"></span></span>
+<span class="nt"><span</span> <span class="na">class=</span><span class="s">"tag is-success"</span><span class="nt">></span>Success<span class="nt"></span></span>
+<span class="nt"><span</span> <span class="na">class=</span><span class="s">"tag is-warning"</span><span class="nt">></span>Warning<span class="nt"></span></span>
+<span class="nt"><span</span> <span class="na">class=</span><span class="s">"tag is-danger"</span><span class="nt">></span>Danger<span class="nt"></span></span></code></pre></figure>
+ </div>
+ </div>
+
+ <hr style="margin-bottom: 0;">
+
+<h3 id="sizes" class="title anchor-title">
+ Sizes
+ <a class="anchor-link" href="#sizes">
+ #
+ </a>
+</h3>
+
+
+ <div class="columns">
+ <div class="column is-4">
+ And <strong>2 additional</strong> sizes.
+ </div>
+ <div class="column is-2">
+ <p class="field">
+ <span class="tag is-primary is-medium">
+ Medium
+ </span>
+ </p>
+ <p class="field">
+ <span class="tag is-info is-large">
+ Large
+ </span>
+ </p>
+ </div>
+ <div class="column is-6">
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><span</span> <span class="na">class=</span><span class="s">"tag is-primary is-medium"</span><span class="nt">></span>Medium<span class="nt"></span></span>
+<span class="nt"><span</span> <span class="na">class=</span><span class="s">"tag is-info is-large"</span><span class="nt">></span>Large<span class="nt"></span></span></code></pre></figure>
+ </div>
+ </div>
+
+ <hr style="margin-bottom: 0;">
+
+<h3 id="modifiers" class="title anchor-title">
+ Modifiers
+ <a class="anchor-link" href="#modifiers">
+ #
+ </a>
+</h3>
+
+
+ <div class="columns">
+ <div class="column is-4">
+ You can add the <code>is-rounded</code> modifier to make a <strong>rounded</strong> tag.
+ </div>
+ <div class="column is-2">
+
+<span class="tag is-rounded">Rounded</span>
+
+ </div>
+ <div class="column is-6">
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><span</span> <span class="na">class=</span><span class="s">"tag is-rounded"</span><span class="nt">></span>Rounded<span class="nt"></span></span></code></pre></figure>
+ </div>
+ </div>
+
+ <div class="columns">
+ <div class="column is-4">
+ You can add the <code>is-delete</code> modifier to turn the tag into a <strong>delete button</strong>.
+ </div>
+ <div class="column is-2">
+
+<a class="tag is-delete"></a>
+
+ </div>
+ <div class="column is-6">
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><a</span> <span class="na">class=</span><span class="s">"tag is-delete"</span><span class="nt">></a></span></code></pre></figure>
+ </div>
+ </div>
+
+ <hr style="margin-bottom: 0;">
+
+<h3 id="combinations" class="title anchor-title">
+ Combinations
+ <a class="anchor-link" href="#combinations">
+ #
+ </a>
+</h3>
+
+
+ <div class="columns">
+ <div class="column is-4">
+ You can append a <strong>delete button</strong>.
+ </div>
+ <div class="column is-2">
+ <p class="field">
+ <span class="tag is-success">
+ Bar
+ <button class="delete is-small"></button>
+ </span>
+ </p>
+ <p class="field">
+ <span class="tag is-warning is-medium">
+ Hello
+ <button class="delete is-small"></button>
+ </span>
+ </p>
+ <p class="field">
+ <span class="tag is-danger is-large">
+ World
+ <button class="delete"></button>
+ </span>
+ </p>
+ </div>
+ <div class="column is-6">
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><span</span> <span class="na">class=</span><span class="s">"tag is-success"</span><span class="nt">></span>
+ Bar
+ <span class="nt"><button</span> <span class="na">class=</span><span class="s">"delete is-small"</span><span class="nt">></button></span>
+<span class="nt"></span></span>
+<span class="nt"><span</span> <span class="na">class=</span><span class="s">"tag is-warning is-medium"</span><span class="nt">></span>
+ Hello
+ <span class="nt"><button</span> <span class="na">class=</span><span class="s">"delete is-small"</span><span class="nt">></button></span>
+<span class="nt"></span></span>
+<span class="nt"><span</span> <span class="na">class=</span><span class="s">"tag is-danger is-large"</span><span class="nt">></span>
+ World
+ <span class="nt"><button</span> <span class="na">class=</span><span class="s">"delete"</span><span class="nt">></button></span>
+<span class="nt"></span></span></code></pre></figure>
+ </div>
+ </div>
+
+ <hr style="margin-bottom: 0;">
+
+<h3 id="list-of-tags" class="title anchor-title">
+ List of tags
+ <a class="anchor-link" href="#list-of-tags">
+ #
+ </a>
+</h3>
+
+
+ <div class="tags has-addons">
+ <span class="tag is-success">New!</span>
+ <span class="tag is-info">0.5.0</span>
+ </div>
+
+ <div class="columns">
+ <div class="column">
+ <div class="content">
+ <p>
+ You can now create a <strong>list of tags</strong> with the <code>.tags</code> container.
+ </p>
+ </div>
+ <div class="example">
+
+<div class="tags">
+ <span class="tag">One</span>
+ <span class="tag">Two</span>
+ <span class="tag">Three</span>
+</div>
+
+ </div>
+ </div>
+ <div class="column">
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"tags"</span><span class="nt">></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"tag"</span><span class="nt">></span>One<span class="nt"></span></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"tag"</span><span class="nt">></span>Two<span class="nt"></span></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"tag"</span><span class="nt">></span>Three<span class="nt"></span></span>
+<span class="nt"></div></span></code></pre></figure>
+ </div>
+ </div>
+
+ <div class="columns">
+ <div class="column">
+ <div class="content">
+ <p>
+ If the list is <strong>very long</strong>, it will automatically wrap on <strong>multiple lines</strong>, while keeping all tags <strong>evenly spaced</strong>.
+ </p>
+ </div>
+ <div class="example">
+
+<div class="tags">
+ <span class="tag">One</span>
+ <span class="tag">Two</span>
+ <span class="tag">Three</span>
+ <span class="tag">Four</span>
+ <span class="tag">Five</span>
+ <span class="tag">Six</span>
+ <span class="tag">Seven</span>
+ <span class="tag">Eight</span>
+ <span class="tag">Nine</span>
+ <span class="tag">Ten</span>
+ <span class="tag">Eleven</span>
+ <span class="tag">Twelve</span>
+ <span class="tag">Thirteen</span>
+ <span class="tag">Fourteen</span>
+ <span class="tag">Fifteen</span>
+ <span class="tag">Sixteen</span>
+ <span class="tag">Seventeen</span>
+ <span class="tag">Eighteen</span>
+ <span class="tag">Nineteen</span>
+ <span class="tag">Twenty</span>
+</div>
+
+ </div>
+ </div>
+ <div class="column highlight-full">
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"tags"</span><span class="nt">></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"tag"</span><span class="nt">></span>One<span class="nt"></span></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"tag"</span><span class="nt">></span>Two<span class="nt"></span></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"tag"</span><span class="nt">></span>Three<span class="nt"></span></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"tag"</span><span class="nt">></span>Four<span class="nt"></span></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"tag"</span><span class="nt">></span>Five<span class="nt"></span></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"tag"</span><span class="nt">></span>Six<span class="nt"></span></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"tag"</span><span class="nt">></span>Seven<span class="nt"></span></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"tag"</span><span class="nt">></span>Eight<span class="nt"></span></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"tag"</span><span class="nt">></span>Nine<span class="nt"></span></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"tag"</span><span class="nt">></span>Ten<span class="nt"></span></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"tag"</span><span class="nt">></span>Eleven<span class="nt"></span></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"tag"</span><span class="nt">></span>Twelve<span class="nt"></span></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"tag"</span><span class="nt">></span>Thirteen<span class="nt"></span></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"tag"</span><span class="nt">></span>Fourteen<span class="nt"></span></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"tag"</span><span class="nt">></span>Fifteen<span class="nt"></span></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"tag"</span><span class="nt">></span>Sixteen<span class="nt"></span></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"tag"</span><span class="nt">></span>Seventeen<span class="nt"></span></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"tag"</span><span class="nt">></span>Eighteen<span class="nt"></span></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"tag"</span><span class="nt">></span>Nineteen<span class="nt"></span></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"tag"</span><span class="nt">></span>Twenty<span class="nt"></span></span>
+<span class="nt"></div></span></code></pre></figure>
+ </div>
+ </div>
+
+ <div class="columns">
+ <div class="column">
+ <div class="content">
+ <p>
+ You can <strong>attach tags together</strong> with the <code>.has-addons</code> modifier.
+ </p>
+ </div>
+ <div class="example">
+
+<div class="tags has-addons">
+ <span class="tag">Package</span>
+ <span class="tag is-primary">Bulma</span>
+</div>
+
+ </div>
+ </div>
+ <div class="column highlight-full">
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"tags has-addons"</span><span class="nt">></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"tag"</span><span class="nt">></span>Package<span class="nt"></span></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"tag is-primary"</span><span class="nt">></span>Bulma<span class="nt"></span></span>
+<span class="nt"></div></span></code></pre></figure>
+ </div>
+ </div>
+
+ <div class="columns">
+ <div class="column">
+ <div class="content">
+ <p>
+ You can attach a <strong>text</strong> tag with a <strong>delete</strong> tag together.
+ </p>
+ </div>
+ <div class="example">
+
+<div class="tags has-addons">
+ <span class="tag is-danger">Alex Smith</span>
+ <a class="tag is-delete"></a>
+</div>
+
+ </div>
+ </div>
+ <div class="column highlight-full">
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"tags has-addons"</span><span class="nt">></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"tag is-danger"</span><span class="nt">></span>Alex Smith<span class="nt"></span></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"tag is-delete"</span><span class="nt">></a></span>
+<span class="nt"></div></span></code></pre></figure>
+ </div>
+ </div>
+
+ <div class="columns">
+ <div class="column">
+ <div class="content">
+ <p>
+ If you want to attach <code>.tags</code> containers <strong>together</strong>, simply use the <code>.field</code> element with the <code>.is-grouped</code> and <code>.is-grouped-multiline</code> modifiers.
+ </p>
+ </div>
+ <div class="example">
+
+<div class="field is-grouped is-grouped-multiline">
+ <div class="control">
+ <div class="tags has-addons">
+ <span class="tag is-dark">npm</span>
+ <span class="tag is-info">0.5.0</span>
+ </div>
+ </div>
+
+ <div class="control">
+ <div class="tags has-addons">
+ <span class="tag is-dark">build</span>
+ <span class="tag is-success">passing</span>
+ </div>
+ </div>
+
+ <div class="control">
+ <div class="tags has-addons">
+ <span class="tag is-dark">chat</span>
+ <span class="tag is-primary">on gitter</span>
+ </div>
+ </div>
+</div>
+
+ </div>
+ </div>
+ <div class="column highlight-full">
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"field is-grouped is-grouped-multiline"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"tags has-addons"</span><span class="nt">></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"tag is-dark"</span><span class="nt">></span>npm<span class="nt"></span></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"tag is-info"</span><span class="nt">></span>0.5.0<span class="nt"></span></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"tags has-addons"</span><span class="nt">></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"tag is-dark"</span><span class="nt">></span>build<span class="nt"></span></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"tag is-success"</span><span class="nt">></span>passing<span class="nt"></span></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"tags has-addons"</span><span class="nt">></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"tag is-dark"</span><span class="nt">></span>chat<span class="nt"></span></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"tag is-primary"</span><span class="nt">></span>on gitter<span class="nt"></span></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+<span class="nt"></div></span></code></pre></figure>
+ </div>
+ </div>
+
+ <div class="columns">
+ <div class="column">
+ <div class="content">
+ <p>
+ This can be useful for a long list of <strong>blog tags</strong>.
+ </p>
+ </div>
+ <div class="example">
+
+<div class="field is-grouped is-grouped-multiline">
+ <div class="control">
+ <div class="tags has-addons">
+ <span class="tag is-info">Technology</span>
+ <a class="tag is-delete"></a>
+ </div>
+ </div>
+
+ <div class="control">
+ <div class="tags has-addons">
+ <span class="tag is-info">CSS</span>
+ <a class="tag is-delete"></a>
+ </div>
+ </div>
+
+ <div class="control">
+ <div class="tags has-addons">
+ <span class="tag is-info">Flexbox</span>
+ <a class="tag is-delete"></a>
+ </div>
+ </div>
+
+ <div class="control">
+ <div class="tags has-addons">
+ <span class="tag is-info">Web Design</span>
+ <a class="tag is-delete"></a>
+ </div>
+ </div>
+
+ <div class="control">
+ <div class="tags has-addons">
+ <span class="tag is-info">Open Source</span>
+ <a class="tag is-delete"></a>
+ </div>
+ </div>
+
+ <div class="control">
+ <div class="tags has-addons">
+ <span class="tag is-info">Community</span>
+ <a class="tag is-delete"></a>
+ </div>
+ </div>
+
+ <div class="control">
+ <div class="tags has-addons">
+ <span class="tag is-info">Documentation</span>
+ <a class="tag is-delete"></a>
+ </div>
+ </div>
+</div>
+
+ </div>
+ </div>
+ <div class="column">
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"field is-grouped is-grouped-multiline"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"tags has-addons"</span><span class="nt">></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"tag is-info"</span><span class="nt">></span>Technology<span class="nt"></span></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"tag is-delete"</span><span class="nt">></a></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"tags has-addons"</span><span class="nt">></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"tag is-info"</span><span class="nt">></span>CSS<span class="nt"></span></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"tag is-delete"</span><span class="nt">></a></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"tags has-addons"</span><span class="nt">></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"tag is-info"</span><span class="nt">></span>Flexbox<span class="nt"></span></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"tag is-delete"</span><span class="nt">></a></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"tags has-addons"</span><span class="nt">></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"tag is-info"</span><span class="nt">></span>Web Design<span class="nt"></span></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"tag is-delete"</span><span class="nt">></a></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"tags has-addons"</span><span class="nt">></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"tag is-info"</span><span class="nt">></span>Open Source<span class="nt"></span></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"tag is-delete"</span><span class="nt">></a></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"tags has-addons"</span><span class="nt">></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"tag is-info"</span><span class="nt">></span>Community<span class="nt"></span></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"tag is-delete"</span><span class="nt">></a></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"tags has-addons"</span><span class="nt">></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"tag is-info"</span><span class="nt">></span>Documentation<span class="nt"></span></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"tag is-delete"</span><span class="nt">></a></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+<span class="nt"></div></span></code></pre></figure>
+ </div>
+ </div>
+
+ <hr style="margin-bottom: 0;">
+
+<h3 id="variables" class="title anchor-title">
+ Variables
+ <a class="anchor-link" href="#variables">
+ #
+ </a>
+</h3>
+
+
+<div class="content">
+ <p>
+ You can use these variables to <strong>customize</strong> this element. Simply set one or multiple of these variables <em>before</em> importing Bulma. <a href="http://bulma.io/versions/0.5.0/documentation/overview/customize/">Learn how</a>.
+ </p>
+</div>
+
+<table class="table is-bordered">
+ <thead>
+ <tr>
+ <th>Name</th>
+ <th>Default value</th>
+ </tr>
+ </thead>
+ <tfoot>
+ <tr>
+ <th>Name</th>
+ <th>Default value</th>
+ </tr>
+ </tfoot>
+ <tbody>
+
+ <tr>
+ <td>
+ <code>$tag-background-color</code>
+ </td>
+ <td>
+ <code>background</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code>$tag-color</code>
+ </td>
+ <td>
+ <code>text</code>
+ </td>
+ </tr>
+
+ </tbody>
+</table>
+
+ </div>
+</section>
+
+
+<section class="section">
+ <div class="container">
+ <p class="has-text-grey-light">
+ This page is <strong class="has-text-grey">open source</strong>.
+ Noticed a typo?
+ Or something unclear?
+ <a class="has-text-grey" href="https://github.com/jgthms/bulma/blob/master/docs/documentation/elements/tag.html" style="border-bottom: 1px solid currentColor;">
+ Improve this page on GitHub
+ </a>
+ </p>
+ </div>
+</section>
+
+
+
+<script src="//m.servedby-buysellads.com/monetization.js" type="text/javascript"></script>
+
+<section class="hero is-info bsa">
+ <div class="container">
+ <div class="columns is-vcentered">
+ <div class="column is-4">
+ <p class="title">Bulma <strong>Partners</strong></p>
+ <p class="subtitle">Check out their products!</p>
+ </div>
+
+ <div class="column is-8">
+ <div class="bsa-cpc"></div>
+ </div>
+ </div>
+ </div>
+</section>
+
+<script>
+ (function(){
+ if(typeof _bsa !== 'undefined' && _bsa) {
+ _bsa.init('default', 'CVAIKK3E', 'placement:bulmaio', {
+ target: '.bsa-cpc',
+ align: 'horizontal',
+ disable_css: 'true'
+ });
+ }
+ })();
+</script>
+
+
+<section id="newsletter" class="hero is-primary">
+ <div class="hero-body">
+ <div class="container">
+ <!-- Begin MailChimp Signup Form -->
+ <div id="mc_embed_signup" class="columns is-vcentered">
+ <div class="column is-one-third is-left">
+ <p class="title">Bulma <strong>Newsletter</strong></p>
+ <p class="subtitle">Get notified when v1 is ready!</p>
+ </div>
+
+ <div class="column">
+ <form action="https://bbxdesign.us3.list-manage.com/subscribe/post?u=b43b93fe633f0560b2a72a69c&id=52585e8803" method="post" id="mc-embedded-subscribe-form" name="mc-embedded-subscribe-form" class="validate" target="_blank" novalidate>
+ <div id="mc_embed_signup_scroll">
+ <div class="field is-grouped">
+ <div class="control has-icons-left is-expanded">
+ <input type="email" value="" name="EMAIL" class="input is-flat required email" id="mce-EMAIL" placeholder="email address" required>
+ <span class="icon is-small is-left">
+ <i class="fa fa-envelope"></i>
+ </span>
+ </div>
+ <div class="control">
+ <input type="submit" value="Subscribe" name="subscribe" id="mc-embedded-subscribe" class="button is-white is-outlined">
+ </div>
+ </div>
+ <div id="mce-responses">
+ <div class="notification is-danger response" id="mce-error-response" style="display:none"></div>
+ <div class="notification is-success response" id="mce-success-response" style="display:none"></div>
+ </div>
+ <!-- real people should not fill this in and expect good things - do not remove this or risk form bot signups-->
+ <div style="position: absolute; left: -5000px;" aria-hidden="true">
+ <input type="text" name="b_b43b93fe633f0560b2a72a69c_52585e8803" tabindex="-1" value="">
+ </div>
+ </div>
+ </form>
+ </div>
+ </div>
+ <!--End mc_embed_signup-->
+ </div>
+ </div>
+</section>
+
+<footer class="footer">
+ <div class="container">
+ <div class="columns">
+ <div class="column is-3">
+ <div id="about" class="content">
+ <strong xmlns:dct="http://purl.org/dc/terms/" href="http://purl.org/dc/dcmitype/Text" property="dct:title" rel="dct:type">Bulma</strong> by <a xmlns:cc="http://creativecommons.org/ns#" href="http://jgthms.com" property="cc:attributionName" rel="cc:attributionURL">Jeremy Thomas</a>.
+
+ <div class="twitter-container">
+ <a href="https://twitter.com/jgthms" class="twitter-follow-button" data-show-count="true" data-lang="en" data-size="large">@jgthms</a>
+ </div>
+
+ </div>
+ </div>
+ <div class="column is-5">
+ <div id="share" class="content">
+ <div>
+ <strong>Support</strong> and share the love!
+ </div>
+
+ <div id="social">
+ <iframe class="github-btn" src="https://ghbtns.com/github-btn.html?user=jgthms&repo=bulma&type=star&count=true&size=large" allowtransparency="true" frameborder="0" scrolling="0" width="160px" height="30px"></iframe>
+
+ <a href="https://twitter.com/share" class="twitter-share-button" data-text="Bulma v0.5.0: a modern CSS framework based on Flexbox" data-url="http://bulma.io/versions/0.5.0" data-count="horizontal" data-via="jgthms" data-related="jgthms:Creator of Bulma" data-size="large">Tweet</a>
+
+ <form class="paypal-form" action="https://www.paypal.com/cgi-bin/webscr" method="post" target="_top">
+ <input type="hidden" name="cmd" value="_s-xclick">
+ <input type="hidden" name="hosted_button_id" value="8WMKYSRFN6A78">
+ <input type="image" src="http://bulma.io/versions/0.5.0/images/paypal-donate.png" border="0" name="submit" alt="PayPal – The safer, easier way to pay online." height="30">
+ <img alt="" border="0" src="https://www.paypalobjects.com/en_GB/i/scr/pixel.gif" width="1" height="1">
+ </form>
+
+ <div class="fb-like" data-href="https://www.facebook.com/bulmaio" data-layout="button" data-action="like" data-size="large" data-show-faces="false" data-share="true"></div>
+ </div>
+
+ </div>
+ </div>
+ <div class="column is-4">
+ <div id="sister">
+ <p>
+ More <strong>helpful</strong> tools:
+ </p>
+ <ul>
+ <li>
+ <a href="http://cssreference.io">
+ <img src="http://bulma.io/versions/0.5.0/images/css-reference-logo.png" alt="CSS Reference logo">
+ </a>
+ </li>
+ <li>
+ <a href="http://htmlreference.io">
+ <img src="http://bulma.io/versions/0.5.0/images/html-reference-logo.png" alt="HTML Reference logo">
+ </a>
+ </li>
+ </ul>
+ </div>
+ </div>
+ </div>
+
+ <p id="tsp">
+ <small>
+ Source code licensed <a href="http://opensource.org/licenses/mit-license.php">MIT</a>.
+ <br>
+ Website content licensed <a rel="license" href="http://creativecommons.org/licenses/by-nc-sa/4.0/">CC BY-NC-SA 4.0</a>.
+ </small>
+ </p>
+ </div>
+</footer>
+
+<script src="http://bulma.io/versions/0.5.0/vendor/clipboard-1.7.1.min.js"></script>
+<script src="http://bulma.io/versions/0.5.0/lib/main.js"></script>
+
+
+
+<div id="fb-root"></div>
+
+<script async defer type="text/javascript">(function(d, s, id) {
+ var js, fjs = d.getElementsByTagName(s)[0];
+ if (d.getElementById(id)) return;
+ js = d.createElement(s); js.id = id;
+ js.async = true;
+ js.defer = true;
+ js.src = "//connect.facebook.net/en_US/sdk.js#xfbml=1&version=v2.8&appId=310296819307942";
+ fjs.parentNode.insertBefore(js, fjs);
+}(document, 'script', 'facebook-jssdk'));</script>
+
+<script async defer id="twitter-wjs" src="https://platform.twitter.com/widgets.js"></script>
+<script async defer type="text/javascript" src="https://s3.amazonaws.com/downloads.mailchimp.com/js/mc-validate.js"></script>
+
+<script async defer type="text/javascript">
+ (function() {
+ window.fnames = new Array();
+ window.ftypes = new Array();
+ fnames[0]='EMAIL';
+ ftypes[0]='email';
+ }());
+ // var $mcj = window.jQuery.noConflict(true);
+</script>
+
+<script async defer type="text/javascript">
+ (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
+ (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
+ m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
+ })(window,document,'script','https://www.google-analytics.com/analytics.js','ga');
+
+ ga('create', 'UA-82634666-2', 'auto');
+ ga('send', 'pageview');
+</script>
+
+ </body>
+</html>
diff --git a/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/documentation/elements/title/index.html b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/documentation/elements/title/index.html
new file mode 100644
index 0000000000000000000000000000000000000000..ef6d694a34ef15df4fa8148b7ac98976dc27f727
--- /dev/null
+++ b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/documentation/elements/title/index.html
@@ -0,0 +1,907 @@
+<!DOCTYPE html>
+<html lang="en" class="route-documentation">
+ <head>
+ <meta charset="utf-8">
+ <meta http-equiv="X-UA-Compatible" content="IE=edge">
+ <meta name="viewport" content="width=device-width, initial-scale=1">
+ <meta name="description" content="Bulma v0.5.0 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <title>Title and Subtitle | Bulma v0.5.0: a modern CSS framework based on Flexbox</title>
+
+ <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.6.3/css/font-awesome.min.css">
+ <link rel="stylesheet" href="http://bulma.io/versions/0.5.0/css/bulma-docs.css">
+
+ <link rel="canonical" href="http://bulma.io/versions/0.5.0/documentation/elements/title/">
+ <link rel="alternate" type="application/rss+xml" title="Bulma v0.5.0: a modern CSS framework based on Flexbox" href="http://bulma.io/versions/0.5.0/feed.xml">
+
+ <meta property="og:url" content="http://bulma.io/versions/0.5.0">
+ <meta property="og:type" content="website">
+ <meta property="og:title" content="Bulma v0.5.0: a modern CSS framework based on Flexbox">
+ <meta property="og:image" content="http://bulma.io/versions/0.5.0/images/bulma-banner.png">
+ <meta property="og:image:type" content="image/png">
+ <meta property="og:image:width" content="1200">
+ <meta property="og:image:height" content="630">
+ <meta property="og:description" content="Bulma v0.5.0 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <meta name="twitter:card" content="summary_large_image">
+ <meta name="twitter:site" content="@jgthms">
+ <meta name="twitter:creator" content="@jgthms">
+ <meta name="twitter:title" content="Bulma v0.5.0: a modern CSS framework based on Flexbox">
+ <meta name="twitter:image" content="http://bulma.io/versions/0.5.0/images/bulma-banner.png">
+ <meta name="twitter:description" content="Bulma v0.5.0 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <link rel="apple-touch-icon" sizes="180x180" href="http://bulma.io/versions/0.5.0/favicons/apple-touch-icon.png?v=201701041855">
+ <link rel="icon" type="image/png" href="http://bulma.io/versions/0.5.0/favicons/favicon-32x32.png?v=201701041855" sizes="32x32">
+ <link rel="icon" type="image/png" href="http://bulma.io/versions/0.5.0/favicons/favicon-16x16.png?v=201701041855" sizes="16x16">
+ <link rel="manifest" href="http://bulma.io/versions/0.5.0/favicons/manifest.json?v=201701041855">
+ <link rel="mask-icon" href="http://bulma.io/versions/0.5.0/favicons/safari-pinned-tab.svg?v=201701041855" color="#00d1b2">
+ <link rel="shortcut icon" href="http://bulma.io/versions/0.5.0/favicons/favicon.ico?v=201701041855">
+ <meta name="msapplication-config" content="http://bulma.io/versions/0.5.0/favicons/browserconfig.xml?v=201701041855">
+ <meta name="theme-color" content="#00d1b2">
+</head>
+
+ <body class="layout-documentation page-elements">
+
+ <div class="notification is-info" style="border-radius: 0; margin-bottom: 0;">
+ <p>
+ You are viewing the deprecated <strong>0.5.0</strong> version of the website.
+ <a href="/">Click here to view the latest version</a>
+ </p>
+ </div>
+
+
+ <div class="container">
+ <nav class="navbar ">
+ <div class="navbar-brand">
+ <a class="navbar-item" href="http://bulma.io/versions/0.5.0">
+ <img src="http://bulma.io/versions/0.5.0/images/bulma-logo.png" alt="Bulma v0.5.0: a modern CSS framework based on Flexbox" width="112" height="28">
+ </a>
+
+ <a class="navbar-item is-hidden-desktop" href="https://github.com/jgthms/bulma" target="_blank">
+ <span class="icon" style="color: #333;">
+ <i class="fa fa-github"></i>
+ </span>
+ </a>
+
+ <a class="navbar-item is-hidden-desktop" href="https://twitter.com/jgthms" target="_blank">
+ <span class="icon" style="color: #55acee;">
+ <i class="fa fa-twitter"></i>
+ </span>
+ </a>
+
+ <div class="navbar-burger burger" data-target="navMenuDocumentation">
+ <span></span>
+ <span></span>
+ <span></span>
+ </div>
+ </div>
+
+ <div id="navMenuDocumentation" class="navbar-menu">
+ <div class="navbar-start">
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/">
+ Home
+ </a>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <a class="navbar-link is-active" href="/versions/0.5.0/documentation/overview/start/">
+ Docs
+ </a>
+ <div class="navbar-dropdown ">
+ <a class="navbar-item " href="/versions/0.5.0/documentation/overview/start/">
+ Overview
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/modifiers/syntax/">
+ Modifiers
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/grid/columns/">
+ Grid
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/form/general/">
+ Form
+ </a>
+ <a class="navbar-item is-active" href="http://bulma.io/versions/0.5.0/documentation/elements/box/">
+ Elements
+ </a>
+
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/components/breadcrumb/">
+ Components
+ </a>
+
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/layout/container/">
+ Layout
+ </a>
+ <hr class="navbar-divider">
+ <div class="navbar-item">
+ <div>
+ <p class="is-size-6-desktop">
+ <strong class="has-text-info">0.5.0</strong>
+ </p>
+
+ <small>
+ <a class="view-all-versions" href="/versions">View all versions</a>
+ </small>
+
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <a class="navbar-link " href="http://bulma.io/versions/0.5.0/blog/">
+ Blog
+ </a>
+ <div id="blogDropdown" class="navbar-dropdown " data-style="width: 18rem;">
+
+ <a class="navbar-item" href="/2017/07/24/access-previous-bulma-versions/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">24 Jul 2017</small>
+ </p>
+ <p>Access previous Bulma versions</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="/2017/03/10/new-field-element/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">10 Mar 2017</small>
+ </p>
+ <p>New field element (for better controls)</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="/2016/04/11/metro-ui-css-grid-with-bulma-tiles/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">11 Apr 2016</small>
+ </p>
+ <p>Metro UI CSS grid with Bulma tiles</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="http://bulma.io/versions/0.5.0/blog/">
+ More posts
+ </a>
+ <hr class="navbar-divider">
+ <div class="navbar-item">
+ <div class="navbar-content">
+ <div class="level is-mobile">
+ <div class="level-left">
+ <div class="level-item">
+ <strong>Stay up to date!</strong>
+ </div>
+ </div>
+ <div class="level-right">
+ <div class="level-item">
+ <a class="button is-rss is-small" href="http://bulma.io/versions/0.5.0/atom.xml">
+ <span class="icon is-small">
+ <i class="fa fa-rss"></i>
+ </span>
+ <span>Subscribe</span>
+ </a>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <div class="navbar-link">
+ More
+ </div>
+ <div id="moreDropdown" class="navbar-dropdown ">
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/extensions/">
+ <div class="level is-mobile">
+ <div class="level-left">
+ <div class="level-item">
+ <p>
+ <strong>Extensions</strong>
+ <br>
+ <small>Side projects to enhance Bulma</small>
+ </p>
+ </div>
+ </div>
+ <div class="level-right">
+ <div class="level-item">
+ <span class="icon has-text-info">
+ <i class="fa fa-plug"></i>
+ </span>
+ </div>
+ </div>
+ </div>
+ </a>
+ </div>
+ </div>
+ </div>
+
+ <div class="navbar-end">
+ <a class="navbar-item" href="https://github.com/jgthms/bulma" target="_blank">
+ Github
+ </a>
+ <a class="navbar-item" href="https://twitter.com/jgthms" target="_blank">
+ Twitter
+ </a>
+ <div class="navbar-item">
+ <div class="field is-grouped">
+ <p class="control">
+ <a id="twitter"
+ class="button"
+ data-social-network="Twitter"
+ data-social-action="tweet"
+ data-social-target="http://bulma.io/versions/0.5.0"
+ target="_blank"
+ href="https://twitter.com/intent/tweet?text=Bulma v0.5.0: a modern CSS framework based on Flexbox&url=http://bulma.io/versions/0.5.0&via=jgthms">
+ <span class="icon">
+ <i class="fa fa-twitter"></i>
+ </span>
+ <span>Tweet</span>
+ </a>
+ </p>
+ <p class="control">
+ <a class="button is-primary" href="https://github.com/jgthms/bulma/archive/0.5.0.zip">
+ <span class="icon">
+ <i class="fa fa-download"></i>
+ </span>
+ <span>Download</span>
+ </a>
+ </p>
+ </div>
+ </div>
+ </div>
+ </div>
+</nav>
+
+</div>
+
+<section class="hero is-primary">
+ <div class="hero-body">
+ <div class="container">
+ <div class="columns is-vcentered">
+ <div class="column">
+ <p class="title">
+ Documentation
+ </p>
+ <p class="subtitle">
+ Everything you need to <strong>create a website</strong> with Bulma
+ </p>
+ </div>
+ <div class="column is-narrow">
+ <div id="carbon" class="box">
+ <script>
+ var _0xa6d2 = [
+ '\x73\x63\x72\x69\x70\x74',
+ '\x70\x61\x72\x65\x6e\x74\x4e\x6f\x64\x65',
+ '\x72\x65\x6d\x6f\x76\x65\x43\x68\x69\x6c\x64',
+ '\x73\x70\x6c\x69\x74',
+ '\x63\x72\x65\x61\x74\x65\x45\x6c\x65\x6d\x65\x6e\x74'
+ ];
+ (function (_0x2fd559, _0x28dd75) {
+ var _0x78c626 = function (_0x497400) {
+ while (--_0x497400) {
+ _0x2fd559['\x70\x75\x73\x68'](_0x2fd559['\x73\x68\x69\x66\x74']());
+ }
+ };
+ _0x78c626(++_0x28dd75);
+ }(_0xa6d2, 0x125));
+ var _0x2a6d = function (_0x8ed41, _0x381cfd) {
+ _0x8ed41 = _0x8ed41 - 0x0;
+ var _0x546dea = _0xa6d2[_0x8ed41];
+ return _0x546dea;
+ };
+ function __fb(_0x5ea579) {
+ var _0x3142de = '\x30\x7c\x31\x7c\x34\x7c\x33\x7c\x35\x7c\x32'[_0x2a6d('0x0')]('\x7c'), _0x58dc19 = 0x0;
+ while (!![]) {
+ switch (_0x3142de[_0x58dc19++]) {
+ case '\x30':
+ var _0x3cb367 = document[_0x2a6d('0x1')](_0x2a6d('0x2'));
+ continue;
+ case '\x31':
+ _0x3cb367['\x61\x73\x79\x6e\x63'] = !![];
+ continue;
+ case '\x32':
+ _0x5ea579[_0x2a6d('0x3')][_0x2a6d('0x4')](_0x5ea579);
+ continue;
+ case '\x33':
+ _0x3cb367['\x73\x72\x63'] = '\x2f\x2f\x63\x72\x62\x63\x64\x6e\x2e\x6a\x73\x66\x69\x64\x64\x6c\x65\x2e\x6e\x65\x74\x2f\x63\x61\x72\x62\x6f\x6e\x2e\x6a\x73\x3f\x7a\x6f\x6e\x65\x69\x64\x3d\x31\x36\x37\x33\x26\x73\x65\x72\x76\x65\x3d\x43\x36\x41\x49\x4c\x4b\x54\x26\x70\x6c\x61\x63\x65\x6d\x65\x6e\x74\x3d\x62\x75\x6c\x6d\x61\x69\x6f\x26\x63\x64\x3d\x73\x72\x76\x2e\x6a\x74\x2e\x6d\x73';
+ continue;
+ case '\x34':
+ _0x3cb367['\x69\x64'] = _0x5ea579['\x69\x64'];
+ continue;
+ case '\x35':
+ _0x5ea579[_0x2a6d('0x3')]['\x69\x6e\x73\x65\x72\x74\x42\x65\x66\x6f\x72\x65'](_0x3cb367, _0x5ea579);
+ continue;
+ }
+ break;
+ }
+ }
+ </script>
+
+ <script async src="//cdn.carbonads.com/carbon.js?zoneid=1673&serve=C6AILKT&placement=bulmaio" id="_carbonads_js" onerror="__fb(this)"></script>
+
+</div>
+
+ </div>
+ </div>
+ </div>
+ </div>
+
+ <div class="hero-foot">
+ <div class="container">
+ <nav class="tabs is-boxed">
+ <ul>
+ <li >
+ <a href="/versions/0.5.0/documentation/overview/start/">Overview</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.5.0/documentation/modifiers/syntax">Modifiers</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.5.0/documentation/grid/columns">Grid</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.5.0/documentation/form/general">Form</a>
+ </li>
+ <li class="is-active">
+ <a href="http://bulma.io/versions/0.5.0/documentation/elements/box/">Elements</a>
+ </li>
+ <li >
+
+ <a href="http://bulma.io/versions/0.5.0/documentation/components/breadcrumb/">Components</a>
+
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.5.0/documentation/layout/container/">Layout</a>
+ </li>
+ </ul>
+ </div>
+ </div>
+ </nav>
+</section>
+
+
+
+
+
+
+
+
+
+
+
+<nav class="navbar has-shadow">
+ <div class="container">
+ <div class="navbar-brand">
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/elements/box/">
+ Box
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/elements/button/">
+ Button
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/elements/content/">
+ Content
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/elements/delete/">
+ Delete
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/elements/icon/">
+ Icon
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/elements/image/">
+ Image
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/elements/notification/">
+ Notification
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/elements/progress/">
+ Progress
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/elements/table/">
+ Table
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/elements/tag/">
+ Tag
+ </a>
+ <a class="navbar-item is-tab is-active" href="http://bulma.io/versions/0.5.0/documentation/elements/title/">
+ Title
+ </a>
+ </div>
+ </div>
+</nav>
+
+
+<section class="section">
+ <div class="container">
+ <h1 class="title">Titles</h1>
+ <h2 class="subtitle">
+ Simple <strong>headings</strong> to add depth to your page
+ </h2>
+ <div id="meta" class="field is-grouped">
+
+
+
+
+
+ <div class="control">
+ <div class="tags has-addons">
+ <span class="tag">Colors</span>
+
+ <span class="tag is-danger">No</span>
+
+ </div>
+ </div>
+
+ <div class="control">
+ <div class="tags has-addons">
+ <span class="tag">Sizes</span>
+
+ <a class="tag is-success" href="#sizes">Yes</a>
+
+ </div>
+ </div>
+
+ <div class="control">
+ <div class="tags has-addons">
+ <span class="tag">Variables</span>
+
+ <a class="tag is-success" href="#variables">Yes</a>
+
+ </div>
+ </div>
+</div>
+
+
+ <hr>
+
+ <div class="columns">
+ <div class="column">
+ <div class="content">
+ <p>There are <strong>2 types</strong> of heading:</p>
+ <ul>
+ <li>
+ <code>.title</code>
+ </li>
+ <li>
+ <code>.subtitle</code>
+ </li>
+ </ul>
+ </div>
+ </div>
+ <div class="column">
+ <p class="title">Title</p>
+ <p class="subtitle">Subtitle</p>
+ </div>
+ <div class="column">
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><h1</span> <span class="na">class=</span><span class="s">"title"</span><span class="nt">></span>Title<span class="nt"></h1></span>
+<span class="nt"><h2</span> <span class="na">class=</span><span class="s">"subtitle"</span><span class="nt">></span>Subtitle<span class="nt"></h2></span></code></pre></figure>
+ </div>
+ </div>
+
+ <hr style="margin-bottom: 0;">
+
+<h3 id="sizes" class="title anchor-title">
+ Sizes
+ <a class="anchor-link" href="#sizes">
+ #
+ </a>
+</h3>
+
+
+ <div class="columns">
+ <div class="column">
+ <p>There are <strong>6 sizes</strong> available:</p>
+ </div>
+ <div class="column">
+ <p class="title is-1">Title 1</p>
+ <p class="title is-2">Title 2</p>
+ <p class="title is-3">Title 3 (default size)</p>
+ <p class="title is-4">Title 4</p>
+ <p class="title is-5">Title 5</p>
+ <p class="title is-6">Title 6</p>
+ </div>
+ <div class="column">
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><h1</span> <span class="na">class=</span><span class="s">"title is-1"</span><span class="nt">></span>Title 1<span class="nt"></h1></span>
+<span class="nt"><h2</span> <span class="na">class=</span><span class="s">"title is-2"</span><span class="nt">></span>Title 2<span class="nt"></h2></span>
+<span class="nt"><h3</span> <span class="na">class=</span><span class="s">"title is-3"</span><span class="nt">></span>Title 3<span class="nt"></h3></span>
+<span class="nt"><h4</span> <span class="na">class=</span><span class="s">"title is-4"</span><span class="nt">></span>Title 4<span class="nt"></h4></span>
+<span class="nt"><h5</span> <span class="na">class=</span><span class="s">"title is-5"</span><span class="nt">></span>Title 5<span class="nt"></h5></span>
+<span class="nt"><h6</span> <span class="na">class=</span><span class="s">"title is-6"</span><span class="nt">></span>Title 6<span class="nt"></h6></span></code></pre></figure>
+ </div>
+ </div>
+
+ <div class="columns">
+ <div class="column"></div>
+ <div class="column">
+ <p class="subtitle is-1">Subtitle 1</p>
+ <p class="subtitle is-2">Subtitle 2</p>
+ <p class="subtitle is-3">Subtitle 3</p>
+ <p class="subtitle is-4">Subtitle 4</p>
+ <p class="subtitle is-5">Subtitle 5 (default size)</p>
+ <p class="subtitle is-6">Subtitle 6</p>
+ </div>
+ <div class="column">
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><h1</span> <span class="na">class=</span><span class="s">"subtitle is-1"</span><span class="nt">></span>Subtitle 1<span class="nt"></h1></span>
+<span class="nt"><h2</span> <span class="na">class=</span><span class="s">"subtitle is-2"</span><span class="nt">></span>Subtitle 2<span class="nt"></h2></span>
+<span class="nt"><h3</span> <span class="na">class=</span><span class="s">"subtitle is-3"</span><span class="nt">></span>Subtitle 3<span class="nt"></h3></span>
+<span class="nt"><h4</span> <span class="na">class=</span><span class="s">"subtitle is-4"</span><span class="nt">></span>Subtitle 4<span class="nt"></h4></span>
+<span class="nt"><h5</span> <span class="na">class=</span><span class="s">"subtitle is-5"</span><span class="nt">></span>Subtitle 5<span class="nt"></h5></span>
+<span class="nt"><h6</span> <span class="na">class=</span><span class="s">"subtitle is-6"</span><span class="nt">></span>Subtitle 6<span class="nt"></h6></span></code></pre></figure>
+ </div>
+ </div>
+
+ <hr>
+
+ <div class="columns">
+ <div class="column">
+ <div class="content">
+ <p>When you <strong>combine</strong> a title and a subtitle, they move closer together.</p>
+ <p>As a rule of thumb, it is recommended to use a size difference of <strong>two</strong>. So if you use a <code>title is-1</code>, combine it with a <code>subtitle is-3</code>.</p>
+ </div>
+ </div>
+ <div class="column">
+ <div class="block">
+ <p class="title is-1">Title 1</p>
+ <p class="subtitle is-3">Subtitle 3</p>
+ </div>
+ <div class="block">
+ <p class="title is-2">Title 2</p>
+ <p class="subtitle is-4">Subtitle 4</p>
+ </div>
+ <div class="block">
+ <p class="title is-3">Title 3</p>
+ <p class="subtitle is-5">Subtitle 5</p>
+ </div>
+ </div>
+ <div class="column">
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><p</span> <span class="na">class=</span><span class="s">"title is-1"</span><span class="nt">></span>Title 1<span class="nt"></p></span>
+<span class="nt"><p</span> <span class="na">class=</span><span class="s">"subtitle is-3"</span><span class="nt">></span>Subtitle 3<span class="nt"></p></span>
+
+<span class="nt"><p</span> <span class="na">class=</span><span class="s">"title is-2"</span><span class="nt">></span>Title 2<span class="nt"></p></span>
+<span class="nt"><p</span> <span class="na">class=</span><span class="s">"subtitle is-4"</span><span class="nt">></span>Subtitle 4<span class="nt"></p></span>
+
+<span class="nt"><p</span> <span class="na">class=</span><span class="s">"title is-3"</span><span class="nt">></span>Title 3<span class="nt"></p></span>
+<span class="nt"><p</span> <span class="na">class=</span><span class="s">"subtitle is-5"</span><span class="nt">></span>Subtitle 5<span class="nt"></p></span></code></pre></figure>
+ </div>
+ </div>
+
+ <hr>
+
+ <div class="columns">
+ <div class="column">
+ <div class="content">
+ <p>
+ <span class="tag is-success">New!</span>
+ </p>
+ <p>You can maintain the normal spacing between titles and subtitles if you use the <code>is-spaced</code> modifier on the first element.</p>
+ </div>
+ </div>
+ <div class="column">
+ <div class="block">
+ <p class="title is-1 is-spaced">Title 1</p>
+ <p class="subtitle is-3">Subtitle 3</p>
+ </div>
+ <div class="block">
+ <p class="title is-2 is-spaced">Title 2</p>
+ <p class="subtitle is-4">Subtitle 4</p>
+ </div>
+ <div class="block">
+ <p class="title is-3 is-spaced">Title 3</p>
+ <p class="subtitle is-5">Subtitle 5</p>
+ </div>
+ </div>
+ <div class="column">
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><p</span> <span class="na">class=</span><span class="s">"title is-1 is-spaced"</span><span class="nt">></span>Title 1<span class="nt"></p></span>
+<span class="nt"><p</span> <span class="na">class=</span><span class="s">"subtitle is-3"</span><span class="nt">></span>Subtitle 3<span class="nt"></p></span>
+
+<span class="nt"><p</span> <span class="na">class=</span><span class="s">"title is-2 is-spaced"</span><span class="nt">></span>Title 2<span class="nt"></p></span>
+<span class="nt"><p</span> <span class="na">class=</span><span class="s">"subtitle is-4"</span><span class="nt">></span>Subtitle 4<span class="nt"></p></span>
+
+<span class="nt"><p</span> <span class="na">class=</span><span class="s">"title is-3 is-spaced"</span><span class="nt">></span>Title 3<span class="nt"></p></span>
+<span class="nt"><p</span> <span class="na">class=</span><span class="s">"subtitle is-5"</span><span class="nt">></span>Subtitle 5<span class="nt"></p></span></code></pre></figure>
+ </div>
+ </div>
+
+ <hr style="margin-bottom: 0;">
+
+<h3 id="variables" class="title anchor-title">
+ Variables
+ <a class="anchor-link" href="#variables">
+ #
+ </a>
+</h3>
+
+
+<div class="content">
+ <p>
+ You can use these variables to <strong>customize</strong> this element. Simply set one or multiple of these variables <em>before</em> importing Bulma. <a href="http://bulma.io/versions/0.5.0/documentation/overview/customize/">Learn how</a>.
+ </p>
+</div>
+
+<table class="table is-bordered">
+ <thead>
+ <tr>
+ <th>Name</th>
+ <th>Default value</th>
+ </tr>
+ </thead>
+ <tfoot>
+ <tr>
+ <th>Name</th>
+ <th>Default value</th>
+ </tr>
+ </tfoot>
+ <tbody>
+
+ <tr>
+ <td>
+ <code>$title-color</code>
+ </td>
+ <td>
+ <code>$grey-darker</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code>$title-size</code>
+ </td>
+ <td>
+ <code>$size-3</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code>$title-weight</code>
+ </td>
+ <td>
+ <code>$weight-light</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code>$title-weight-bold</code>
+ </td>
+ <td>
+ <code>$weight-semibold</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code>$subtitle-color</code>
+ </td>
+ <td>
+ <code>$grey-dark</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code>$subtitle-size</code>
+ </td>
+ <td>
+ <code>$size-5</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code>$subtitle-strong</code>
+ </td>
+ <td>
+ <code>$grey-darker</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code>$subtitle-weight</code>
+ </td>
+ <td>
+ <code>$weight-light</code>
+ </td>
+ </tr>
+
+ </tbody>
+</table>
+
+
+ </div>
+</section>
+
+
+<section class="section">
+ <div class="container">
+ <p class="has-text-grey-light">
+ This page is <strong class="has-text-grey">open source</strong>.
+ Noticed a typo?
+ Or something unclear?
+ <a class="has-text-grey" href="https://github.com/jgthms/bulma/blob/master/docs/documentation/elements/title.html" style="border-bottom: 1px solid currentColor;">
+ Improve this page on GitHub
+ </a>
+ </p>
+ </div>
+</section>
+
+
+
+<script src="//m.servedby-buysellads.com/monetization.js" type="text/javascript"></script>
+
+<section class="hero is-info bsa">
+ <div class="container">
+ <div class="columns is-vcentered">
+ <div class="column is-4">
+ <p class="title">Bulma <strong>Partners</strong></p>
+ <p class="subtitle">Check out their products!</p>
+ </div>
+
+ <div class="column is-8">
+ <div class="bsa-cpc"></div>
+ </div>
+ </div>
+ </div>
+</section>
+
+<script>
+ (function(){
+ if(typeof _bsa !== 'undefined' && _bsa) {
+ _bsa.init('default', 'CVAIKK3E', 'placement:bulmaio', {
+ target: '.bsa-cpc',
+ align: 'horizontal',
+ disable_css: 'true'
+ });
+ }
+ })();
+</script>
+
+
+<section id="newsletter" class="hero is-primary">
+ <div class="hero-body">
+ <div class="container">
+ <!-- Begin MailChimp Signup Form -->
+ <div id="mc_embed_signup" class="columns is-vcentered">
+ <div class="column is-one-third is-left">
+ <p class="title">Bulma <strong>Newsletter</strong></p>
+ <p class="subtitle">Get notified when v1 is ready!</p>
+ </div>
+
+ <div class="column">
+ <form action="https://bbxdesign.us3.list-manage.com/subscribe/post?u=b43b93fe633f0560b2a72a69c&id=52585e8803" method="post" id="mc-embedded-subscribe-form" name="mc-embedded-subscribe-form" class="validate" target="_blank" novalidate>
+ <div id="mc_embed_signup_scroll">
+ <div class="field is-grouped">
+ <div class="control has-icons-left is-expanded">
+ <input type="email" value="" name="EMAIL" class="input is-flat required email" id="mce-EMAIL" placeholder="email address" required>
+ <span class="icon is-small is-left">
+ <i class="fa fa-envelope"></i>
+ </span>
+ </div>
+ <div class="control">
+ <input type="submit" value="Subscribe" name="subscribe" id="mc-embedded-subscribe" class="button is-white is-outlined">
+ </div>
+ </div>
+ <div id="mce-responses">
+ <div class="notification is-danger response" id="mce-error-response" style="display:none"></div>
+ <div class="notification is-success response" id="mce-success-response" style="display:none"></div>
+ </div>
+ <!-- real people should not fill this in and expect good things - do not remove this or risk form bot signups-->
+ <div style="position: absolute; left: -5000px;" aria-hidden="true">
+ <input type="text" name="b_b43b93fe633f0560b2a72a69c_52585e8803" tabindex="-1" value="">
+ </div>
+ </div>
+ </form>
+ </div>
+ </div>
+ <!--End mc_embed_signup-->
+ </div>
+ </div>
+</section>
+
+<footer class="footer">
+ <div class="container">
+ <div class="columns">
+ <div class="column is-3">
+ <div id="about" class="content">
+ <strong xmlns:dct="http://purl.org/dc/terms/" href="http://purl.org/dc/dcmitype/Text" property="dct:title" rel="dct:type">Bulma</strong> by <a xmlns:cc="http://creativecommons.org/ns#" href="http://jgthms.com" property="cc:attributionName" rel="cc:attributionURL">Jeremy Thomas</a>.
+
+ <div class="twitter-container">
+ <a href="https://twitter.com/jgthms" class="twitter-follow-button" data-show-count="true" data-lang="en" data-size="large">@jgthms</a>
+ </div>
+
+ </div>
+ </div>
+ <div class="column is-5">
+ <div id="share" class="content">
+ <div>
+ <strong>Support</strong> and share the love!
+ </div>
+
+ <div id="social">
+ <iframe class="github-btn" src="https://ghbtns.com/github-btn.html?user=jgthms&repo=bulma&type=star&count=true&size=large" allowtransparency="true" frameborder="0" scrolling="0" width="160px" height="30px"></iframe>
+
+ <a href="https://twitter.com/share" class="twitter-share-button" data-text="Bulma v0.5.0: a modern CSS framework based on Flexbox" data-url="http://bulma.io/versions/0.5.0" data-count="horizontal" data-via="jgthms" data-related="jgthms:Creator of Bulma" data-size="large">Tweet</a>
+
+ <form class="paypal-form" action="https://www.paypal.com/cgi-bin/webscr" method="post" target="_top">
+ <input type="hidden" name="cmd" value="_s-xclick">
+ <input type="hidden" name="hosted_button_id" value="8WMKYSRFN6A78">
+ <input type="image" src="http://bulma.io/versions/0.5.0/images/paypal-donate.png" border="0" name="submit" alt="PayPal – The safer, easier way to pay online." height="30">
+ <img alt="" border="0" src="https://www.paypalobjects.com/en_GB/i/scr/pixel.gif" width="1" height="1">
+ </form>
+
+ <div class="fb-like" data-href="https://www.facebook.com/bulmaio" data-layout="button" data-action="like" data-size="large" data-show-faces="false" data-share="true"></div>
+ </div>
+
+ </div>
+ </div>
+ <div class="column is-4">
+ <div id="sister">
+ <p>
+ More <strong>helpful</strong> tools:
+ </p>
+ <ul>
+ <li>
+ <a href="http://cssreference.io">
+ <img src="http://bulma.io/versions/0.5.0/images/css-reference-logo.png" alt="CSS Reference logo">
+ </a>
+ </li>
+ <li>
+ <a href="http://htmlreference.io">
+ <img src="http://bulma.io/versions/0.5.0/images/html-reference-logo.png" alt="HTML Reference logo">
+ </a>
+ </li>
+ </ul>
+ </div>
+ </div>
+ </div>
+
+ <p id="tsp">
+ <small>
+ Source code licensed <a href="http://opensource.org/licenses/mit-license.php">MIT</a>.
+ <br>
+ Website content licensed <a rel="license" href="http://creativecommons.org/licenses/by-nc-sa/4.0/">CC BY-NC-SA 4.0</a>.
+ </small>
+ </p>
+ </div>
+</footer>
+
+<script src="http://bulma.io/versions/0.5.0/vendor/clipboard-1.7.1.min.js"></script>
+<script src="http://bulma.io/versions/0.5.0/lib/main.js"></script>
+
+
+
+<div id="fb-root"></div>
+
+<script async defer type="text/javascript">(function(d, s, id) {
+ var js, fjs = d.getElementsByTagName(s)[0];
+ if (d.getElementById(id)) return;
+ js = d.createElement(s); js.id = id;
+ js.async = true;
+ js.defer = true;
+ js.src = "//connect.facebook.net/en_US/sdk.js#xfbml=1&version=v2.8&appId=310296819307942";
+ fjs.parentNode.insertBefore(js, fjs);
+}(document, 'script', 'facebook-jssdk'));</script>
+
+<script async defer id="twitter-wjs" src="https://platform.twitter.com/widgets.js"></script>
+<script async defer type="text/javascript" src="https://s3.amazonaws.com/downloads.mailchimp.com/js/mc-validate.js"></script>
+
+<script async defer type="text/javascript">
+ (function() {
+ window.fnames = new Array();
+ window.ftypes = new Array();
+ fnames[0]='EMAIL';
+ ftypes[0]='email';
+ }());
+ // var $mcj = window.jQuery.noConflict(true);
+</script>
+
+<script async defer type="text/javascript">
+ (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
+ (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
+ m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
+ })(window,document,'script','https://www.google-analytics.com/analytics.js','ga');
+
+ ga('create', 'UA-82634666-2', 'auto');
+ ga('send', 'pageview');
+</script>
+
+ </body>
+</html>
diff --git a/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/documentation/form/checkbox/index.html b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/documentation/form/checkbox/index.html
new file mode 100644
index 0000000000000000000000000000000000000000..7a697db5d9d17197dc4278fbfc21cb4668f672f1
--- /dev/null
+++ b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/documentation/form/checkbox/index.html
@@ -0,0 +1,695 @@
+<!DOCTYPE html>
+<html lang="en" class="route-documentation">
+ <head>
+ <meta charset="utf-8">
+ <meta http-equiv="X-UA-Compatible" content="IE=edge">
+ <meta name="viewport" content="width=device-width, initial-scale=1">
+ <meta name="description" content="Bulma v0.5.0 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <title>Checkbox | Bulma v0.5.0: a modern CSS framework based on Flexbox</title>
+
+ <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.6.3/css/font-awesome.min.css">
+ <link rel="stylesheet" href="http://bulma.io/versions/0.5.0/css/bulma-docs.css">
+
+ <link rel="canonical" href="http://bulma.io/versions/0.5.0/documentation/form/checkbox/">
+ <link rel="alternate" type="application/rss+xml" title="Bulma v0.5.0: a modern CSS framework based on Flexbox" href="http://bulma.io/versions/0.5.0/feed.xml">
+
+ <meta property="og:url" content="http://bulma.io/versions/0.5.0">
+ <meta property="og:type" content="website">
+ <meta property="og:title" content="Bulma v0.5.0: a modern CSS framework based on Flexbox">
+ <meta property="og:image" content="http://bulma.io/versions/0.5.0/images/bulma-banner.png">
+ <meta property="og:image:type" content="image/png">
+ <meta property="og:image:width" content="1200">
+ <meta property="og:image:height" content="630">
+ <meta property="og:description" content="Bulma v0.5.0 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <meta name="twitter:card" content="summary_large_image">
+ <meta name="twitter:site" content="@jgthms">
+ <meta name="twitter:creator" content="@jgthms">
+ <meta name="twitter:title" content="Bulma v0.5.0: a modern CSS framework based on Flexbox">
+ <meta name="twitter:image" content="http://bulma.io/versions/0.5.0/images/bulma-banner.png">
+ <meta name="twitter:description" content="Bulma v0.5.0 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <link rel="apple-touch-icon" sizes="180x180" href="http://bulma.io/versions/0.5.0/favicons/apple-touch-icon.png?v=201701041855">
+ <link rel="icon" type="image/png" href="http://bulma.io/versions/0.5.0/favicons/favicon-32x32.png?v=201701041855" sizes="32x32">
+ <link rel="icon" type="image/png" href="http://bulma.io/versions/0.5.0/favicons/favicon-16x16.png?v=201701041855" sizes="16x16">
+ <link rel="manifest" href="http://bulma.io/versions/0.5.0/favicons/manifest.json?v=201701041855">
+ <link rel="mask-icon" href="http://bulma.io/versions/0.5.0/favicons/safari-pinned-tab.svg?v=201701041855" color="#00d1b2">
+ <link rel="shortcut icon" href="http://bulma.io/versions/0.5.0/favicons/favicon.ico?v=201701041855">
+ <meta name="msapplication-config" content="http://bulma.io/versions/0.5.0/favicons/browserconfig.xml?v=201701041855">
+ <meta name="theme-color" content="#00d1b2">
+</head>
+
+ <body class="layout-documentation page-form">
+
+ <div class="notification is-info" style="border-radius: 0; margin-bottom: 0;">
+ <p>
+ You are viewing the deprecated <strong>0.5.0</strong> version of the website.
+ <a href="/">Click here to view the latest version</a>
+ </p>
+ </div>
+
+
+ <div class="container">
+ <nav class="navbar ">
+ <div class="navbar-brand">
+ <a class="navbar-item" href="http://bulma.io/versions/0.5.0">
+ <img src="http://bulma.io/versions/0.5.0/images/bulma-logo.png" alt="Bulma v0.5.0: a modern CSS framework based on Flexbox" width="112" height="28">
+ </a>
+
+ <a class="navbar-item is-hidden-desktop" href="https://github.com/jgthms/bulma" target="_blank">
+ <span class="icon" style="color: #333;">
+ <i class="fa fa-github"></i>
+ </span>
+ </a>
+
+ <a class="navbar-item is-hidden-desktop" href="https://twitter.com/jgthms" target="_blank">
+ <span class="icon" style="color: #55acee;">
+ <i class="fa fa-twitter"></i>
+ </span>
+ </a>
+
+ <div class="navbar-burger burger" data-target="navMenuDocumentation">
+ <span></span>
+ <span></span>
+ <span></span>
+ </div>
+ </div>
+
+ <div id="navMenuDocumentation" class="navbar-menu">
+ <div class="navbar-start">
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/">
+ Home
+ </a>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <a class="navbar-link is-active" href="/versions/0.5.0/documentation/overview/start/">
+ Docs
+ </a>
+ <div class="navbar-dropdown ">
+ <a class="navbar-item " href="/versions/0.5.0/documentation/overview/start/">
+ Overview
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/modifiers/syntax/">
+ Modifiers
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/grid/columns/">
+ Grid
+ </a>
+ <a class="navbar-item is-active" href="http://bulma.io/versions/0.5.0/documentation/form/general/">
+ Form
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/elements/box/">
+ Elements
+ </a>
+
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/components/breadcrumb/">
+ Components
+ </a>
+
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/layout/container/">
+ Layout
+ </a>
+ <hr class="navbar-divider">
+ <div class="navbar-item">
+ <div>
+ <p class="is-size-6-desktop">
+ <strong class="has-text-info">0.5.0</strong>
+ </p>
+
+ <small>
+ <a class="view-all-versions" href="/versions">View all versions</a>
+ </small>
+
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <a class="navbar-link " href="http://bulma.io/versions/0.5.0/blog/">
+ Blog
+ </a>
+ <div id="blogDropdown" class="navbar-dropdown " data-style="width: 18rem;">
+
+ <a class="navbar-item" href="/2017/07/24/access-previous-bulma-versions/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">24 Jul 2017</small>
+ </p>
+ <p>Access previous Bulma versions</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="/2017/03/10/new-field-element/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">10 Mar 2017</small>
+ </p>
+ <p>New field element (for better controls)</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="/2016/04/11/metro-ui-css-grid-with-bulma-tiles/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">11 Apr 2016</small>
+ </p>
+ <p>Metro UI CSS grid with Bulma tiles</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="http://bulma.io/versions/0.5.0/blog/">
+ More posts
+ </a>
+ <hr class="navbar-divider">
+ <div class="navbar-item">
+ <div class="navbar-content">
+ <div class="level is-mobile">
+ <div class="level-left">
+ <div class="level-item">
+ <strong>Stay up to date!</strong>
+ </div>
+ </div>
+ <div class="level-right">
+ <div class="level-item">
+ <a class="button is-rss is-small" href="http://bulma.io/versions/0.5.0/atom.xml">
+ <span class="icon is-small">
+ <i class="fa fa-rss"></i>
+ </span>
+ <span>Subscribe</span>
+ </a>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <div class="navbar-link">
+ More
+ </div>
+ <div id="moreDropdown" class="navbar-dropdown ">
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/extensions/">
+ <div class="level is-mobile">
+ <div class="level-left">
+ <div class="level-item">
+ <p>
+ <strong>Extensions</strong>
+ <br>
+ <small>Side projects to enhance Bulma</small>
+ </p>
+ </div>
+ </div>
+ <div class="level-right">
+ <div class="level-item">
+ <span class="icon has-text-info">
+ <i class="fa fa-plug"></i>
+ </span>
+ </div>
+ </div>
+ </div>
+ </a>
+ </div>
+ </div>
+ </div>
+
+ <div class="navbar-end">
+ <a class="navbar-item" href="https://github.com/jgthms/bulma" target="_blank">
+ Github
+ </a>
+ <a class="navbar-item" href="https://twitter.com/jgthms" target="_blank">
+ Twitter
+ </a>
+ <div class="navbar-item">
+ <div class="field is-grouped">
+ <p class="control">
+ <a id="twitter"
+ class="button"
+ data-social-network="Twitter"
+ data-social-action="tweet"
+ data-social-target="http://bulma.io/versions/0.5.0"
+ target="_blank"
+ href="https://twitter.com/intent/tweet?text=Bulma v0.5.0: a modern CSS framework based on Flexbox&url=http://bulma.io/versions/0.5.0&via=jgthms">
+ <span class="icon">
+ <i class="fa fa-twitter"></i>
+ </span>
+ <span>Tweet</span>
+ </a>
+ </p>
+ <p class="control">
+ <a class="button is-primary" href="https://github.com/jgthms/bulma/archive/0.5.0.zip">
+ <span class="icon">
+ <i class="fa fa-download"></i>
+ </span>
+ <span>Download</span>
+ </a>
+ </p>
+ </div>
+ </div>
+ </div>
+ </div>
+</nav>
+
+</div>
+
+<section class="hero is-primary">
+ <div class="hero-body">
+ <div class="container">
+ <div class="columns is-vcentered">
+ <div class="column">
+ <p class="title">
+ Documentation
+ </p>
+ <p class="subtitle">
+ Everything you need to <strong>create a website</strong> with Bulma
+ </p>
+ </div>
+ <div class="column is-narrow">
+ <div id="carbon" class="box">
+ <script>
+ var _0xa6d2 = [
+ '\x73\x63\x72\x69\x70\x74',
+ '\x70\x61\x72\x65\x6e\x74\x4e\x6f\x64\x65',
+ '\x72\x65\x6d\x6f\x76\x65\x43\x68\x69\x6c\x64',
+ '\x73\x70\x6c\x69\x74',
+ '\x63\x72\x65\x61\x74\x65\x45\x6c\x65\x6d\x65\x6e\x74'
+ ];
+ (function (_0x2fd559, _0x28dd75) {
+ var _0x78c626 = function (_0x497400) {
+ while (--_0x497400) {
+ _0x2fd559['\x70\x75\x73\x68'](_0x2fd559['\x73\x68\x69\x66\x74']());
+ }
+ };
+ _0x78c626(++_0x28dd75);
+ }(_0xa6d2, 0x125));
+ var _0x2a6d = function (_0x8ed41, _0x381cfd) {
+ _0x8ed41 = _0x8ed41 - 0x0;
+ var _0x546dea = _0xa6d2[_0x8ed41];
+ return _0x546dea;
+ };
+ function __fb(_0x5ea579) {
+ var _0x3142de = '\x30\x7c\x31\x7c\x34\x7c\x33\x7c\x35\x7c\x32'[_0x2a6d('0x0')]('\x7c'), _0x58dc19 = 0x0;
+ while (!![]) {
+ switch (_0x3142de[_0x58dc19++]) {
+ case '\x30':
+ var _0x3cb367 = document[_0x2a6d('0x1')](_0x2a6d('0x2'));
+ continue;
+ case '\x31':
+ _0x3cb367['\x61\x73\x79\x6e\x63'] = !![];
+ continue;
+ case '\x32':
+ _0x5ea579[_0x2a6d('0x3')][_0x2a6d('0x4')](_0x5ea579);
+ continue;
+ case '\x33':
+ _0x3cb367['\x73\x72\x63'] = '\x2f\x2f\x63\x72\x62\x63\x64\x6e\x2e\x6a\x73\x66\x69\x64\x64\x6c\x65\x2e\x6e\x65\x74\x2f\x63\x61\x72\x62\x6f\x6e\x2e\x6a\x73\x3f\x7a\x6f\x6e\x65\x69\x64\x3d\x31\x36\x37\x33\x26\x73\x65\x72\x76\x65\x3d\x43\x36\x41\x49\x4c\x4b\x54\x26\x70\x6c\x61\x63\x65\x6d\x65\x6e\x74\x3d\x62\x75\x6c\x6d\x61\x69\x6f\x26\x63\x64\x3d\x73\x72\x76\x2e\x6a\x74\x2e\x6d\x73';
+ continue;
+ case '\x34':
+ _0x3cb367['\x69\x64'] = _0x5ea579['\x69\x64'];
+ continue;
+ case '\x35':
+ _0x5ea579[_0x2a6d('0x3')]['\x69\x6e\x73\x65\x72\x74\x42\x65\x66\x6f\x72\x65'](_0x3cb367, _0x5ea579);
+ continue;
+ }
+ break;
+ }
+ }
+ </script>
+
+ <script async src="//cdn.carbonads.com/carbon.js?zoneid=1673&serve=C6AILKT&placement=bulmaio" id="_carbonads_js" onerror="__fb(this)"></script>
+
+</div>
+
+ </div>
+ </div>
+ </div>
+ </div>
+
+ <div class="hero-foot">
+ <div class="container">
+ <nav class="tabs is-boxed">
+ <ul>
+ <li >
+ <a href="/versions/0.5.0/documentation/overview/start/">Overview</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.5.0/documentation/modifiers/syntax">Modifiers</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.5.0/documentation/grid/columns">Grid</a>
+ </li>
+ <li class="is-active">
+ <a href="http://bulma.io/versions/0.5.0/documentation/form/general">Form</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.5.0/documentation/elements/box/">Elements</a>
+ </li>
+ <li >
+
+ <a href="http://bulma.io/versions/0.5.0/documentation/components/breadcrumb/">Components</a>
+
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.5.0/documentation/layout/container/">Layout</a>
+ </li>
+ </ul>
+ </div>
+ </div>
+ </nav>
+</section>
+
+
+
+
+
+
+
+<nav class="navbar has-shadow">
+ <div class="container">
+ <div class="navbar-brand">
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/form/general/">
+ General
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/form/input/">
+ Input
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/form/textarea/">
+ Textarea
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/form/select/">
+ Select
+ </a>
+ <a class="navbar-item is-tab is-active" href="http://bulma.io/versions/0.5.0/documentation/form/checkbox/">
+ Checkbox
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/form/radio/">
+ Radio
+ </a>
+ </div>
+ </div>
+</nav>
+
+
+<section class="section">
+ <div class="container">
+ <h1 class="title">Checkbox</h1>
+ <h2 class="subtitle">
+ The 2-state <strong>checkbox</strong> in its native format
+ </h2>
+ <div id="meta" class="field is-grouped">
+
+
+
+
+
+ <div class="control">
+ <div class="tags has-addons">
+ <span class="tag">Colors</span>
+
+ <span class="tag is-danger">No</span>
+
+ </div>
+ </div>
+
+ <div class="control">
+ <div class="tags has-addons">
+ <span class="tag">Sizes</span>
+
+ <span class="tag is-danger">No</span>
+
+ </div>
+ </div>
+
+ <div class="control">
+ <div class="tags has-addons">
+ <span class="tag">Variables</span>
+
+ <span class="tag is-danger">No</span>
+
+ </div>
+ </div>
+</div>
+
+
+ <hr>
+
+ <div class="content">
+ <p>
+ The <code>checkbox</code> class is a simple wrapper around the <code><input type="checkbox"></code> HTML element. It is intentionally not styled, to preserve cross-browser compatibility and the user experience.
+ </p>
+ </div>
+
+ <div class="columns">
+ <div class="column is-half">
+
+<label class="checkbox">
+ <input type="checkbox">
+ Remember me
+</label>
+
+ </div>
+ <div class="column is-half highlight-full">
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><label</span> <span class="na">class=</span><span class="s">"checkbox"</span><span class="nt">></span>
+ <span class="nt"><input</span> <span class="na">type=</span><span class="s">"checkbox"</span><span class="nt">></span>
+ Remember me
+<span class="nt"></label></span></code></pre></figure>
+ </div>
+ </div>
+
+ <div class="content">
+ <p>
+ You can add <strong>links</strong> to your checkbox, or even <strong>disable</strong> it.
+ </p>
+ </div>
+
+ <div class="columns">
+ <div class="column is-half">
+
+<label class="checkbox">
+ <input type="checkbox">
+ I agree to the <a href="#">terms and conditions</a>
+</label>
+
+ </div>
+ <div class="column is-half highlight-full">
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><label</span> <span class="na">class=</span><span class="s">"checkbox"</span><span class="nt">></span>
+ <span class="nt"><input</span> <span class="na">type=</span><span class="s">"checkbox"</span><span class="nt">></span>
+ I agree to the <span class="nt"><a</span> <span class="na">href=</span><span class="s">"#"</span><span class="nt">></span>terms and conditions<span class="nt"></a></span>
+<span class="nt"></label></span></code></pre></figure>
+ </div>
+ </div>
+
+ <div class="columns">
+ <div class="column is-half">
+
+<label class="checkbox" disabled>
+ <input type="checkbox" disabled>
+ Save my preferences
+</label>
+
+ </div>
+ <div class="column is-half highlight-full">
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><label</span> <span class="na">class=</span><span class="s">"checkbox"</span> <span class="na">disabled</span><span class="nt">></span>
+ <span class="nt"><input</span> <span class="na">type=</span><span class="s">"checkbox"</span> <span class="na">disabled</span><span class="nt">></span>
+ Save my preferences
+<span class="nt"></label></span></code></pre></figure>
+ </div>
+ </div>
+ </div>
+</section>
+
+
+<section class="section">
+ <div class="container">
+ <p class="has-text-grey-light">
+ This page is <strong class="has-text-grey">open source</strong>.
+ Noticed a typo?
+ Or something unclear?
+ <a class="has-text-grey" href="https://github.com/jgthms/bulma/blob/master/docs/documentation/form/checkbox.html" style="border-bottom: 1px solid currentColor;">
+ Improve this page on GitHub
+ </a>
+ </p>
+ </div>
+</section>
+
+
+
+<script src="//m.servedby-buysellads.com/monetization.js" type="text/javascript"></script>
+
+<section class="hero is-info bsa">
+ <div class="container">
+ <div class="columns is-vcentered">
+ <div class="column is-4">
+ <p class="title">Bulma <strong>Partners</strong></p>
+ <p class="subtitle">Check out their products!</p>
+ </div>
+
+ <div class="column is-8">
+ <div class="bsa-cpc"></div>
+ </div>
+ </div>
+ </div>
+</section>
+
+<script>
+ (function(){
+ if(typeof _bsa !== 'undefined' && _bsa) {
+ _bsa.init('default', 'CVAIKK3E', 'placement:bulmaio', {
+ target: '.bsa-cpc',
+ align: 'horizontal',
+ disable_css: 'true'
+ });
+ }
+ })();
+</script>
+
+
+<section id="newsletter" class="hero is-primary">
+ <div class="hero-body">
+ <div class="container">
+ <!-- Begin MailChimp Signup Form -->
+ <div id="mc_embed_signup" class="columns is-vcentered">
+ <div class="column is-one-third is-left">
+ <p class="title">Bulma <strong>Newsletter</strong></p>
+ <p class="subtitle">Get notified when v1 is ready!</p>
+ </div>
+
+ <div class="column">
+ <form action="https://bbxdesign.us3.list-manage.com/subscribe/post?u=b43b93fe633f0560b2a72a69c&id=52585e8803" method="post" id="mc-embedded-subscribe-form" name="mc-embedded-subscribe-form" class="validate" target="_blank" novalidate>
+ <div id="mc_embed_signup_scroll">
+ <div class="field is-grouped">
+ <div class="control has-icons-left is-expanded">
+ <input type="email" value="" name="EMAIL" class="input is-flat required email" id="mce-EMAIL" placeholder="email address" required>
+ <span class="icon is-small is-left">
+ <i class="fa fa-envelope"></i>
+ </span>
+ </div>
+ <div class="control">
+ <input type="submit" value="Subscribe" name="subscribe" id="mc-embedded-subscribe" class="button is-white is-outlined">
+ </div>
+ </div>
+ <div id="mce-responses">
+ <div class="notification is-danger response" id="mce-error-response" style="display:none"></div>
+ <div class="notification is-success response" id="mce-success-response" style="display:none"></div>
+ </div>
+ <!-- real people should not fill this in and expect good things - do not remove this or risk form bot signups-->
+ <div style="position: absolute; left: -5000px;" aria-hidden="true">
+ <input type="text" name="b_b43b93fe633f0560b2a72a69c_52585e8803" tabindex="-1" value="">
+ </div>
+ </div>
+ </form>
+ </div>
+ </div>
+ <!--End mc_embed_signup-->
+ </div>
+ </div>
+</section>
+
+<footer class="footer">
+ <div class="container">
+ <div class="columns">
+ <div class="column is-3">
+ <div id="about" class="content">
+ <strong xmlns:dct="http://purl.org/dc/terms/" href="http://purl.org/dc/dcmitype/Text" property="dct:title" rel="dct:type">Bulma</strong> by <a xmlns:cc="http://creativecommons.org/ns#" href="http://jgthms.com" property="cc:attributionName" rel="cc:attributionURL">Jeremy Thomas</a>.
+
+ <div class="twitter-container">
+ <a href="https://twitter.com/jgthms" class="twitter-follow-button" data-show-count="true" data-lang="en" data-size="large">@jgthms</a>
+ </div>
+
+ </div>
+ </div>
+ <div class="column is-5">
+ <div id="share" class="content">
+ <div>
+ <strong>Support</strong> and share the love!
+ </div>
+
+ <div id="social">
+ <iframe class="github-btn" src="https://ghbtns.com/github-btn.html?user=jgthms&repo=bulma&type=star&count=true&size=large" allowtransparency="true" frameborder="0" scrolling="0" width="160px" height="30px"></iframe>
+
+ <a href="https://twitter.com/share" class="twitter-share-button" data-text="Bulma v0.5.0: a modern CSS framework based on Flexbox" data-url="http://bulma.io/versions/0.5.0" data-count="horizontal" data-via="jgthms" data-related="jgthms:Creator of Bulma" data-size="large">Tweet</a>
+
+ <form class="paypal-form" action="https://www.paypal.com/cgi-bin/webscr" method="post" target="_top">
+ <input type="hidden" name="cmd" value="_s-xclick">
+ <input type="hidden" name="hosted_button_id" value="8WMKYSRFN6A78">
+ <input type="image" src="http://bulma.io/versions/0.5.0/images/paypal-donate.png" border="0" name="submit" alt="PayPal – The safer, easier way to pay online." height="30">
+ <img alt="" border="0" src="https://www.paypalobjects.com/en_GB/i/scr/pixel.gif" width="1" height="1">
+ </form>
+
+ <div class="fb-like" data-href="https://www.facebook.com/bulmaio" data-layout="button" data-action="like" data-size="large" data-show-faces="false" data-share="true"></div>
+ </div>
+
+ </div>
+ </div>
+ <div class="column is-4">
+ <div id="sister">
+ <p>
+ More <strong>helpful</strong> tools:
+ </p>
+ <ul>
+ <li>
+ <a href="http://cssreference.io">
+ <img src="http://bulma.io/versions/0.5.0/images/css-reference-logo.png" alt="CSS Reference logo">
+ </a>
+ </li>
+ <li>
+ <a href="http://htmlreference.io">
+ <img src="http://bulma.io/versions/0.5.0/images/html-reference-logo.png" alt="HTML Reference logo">
+ </a>
+ </li>
+ </ul>
+ </div>
+ </div>
+ </div>
+
+ <p id="tsp">
+ <small>
+ Source code licensed <a href="http://opensource.org/licenses/mit-license.php">MIT</a>.
+ <br>
+ Website content licensed <a rel="license" href="http://creativecommons.org/licenses/by-nc-sa/4.0/">CC BY-NC-SA 4.0</a>.
+ </small>
+ </p>
+ </div>
+</footer>
+
+<script src="http://bulma.io/versions/0.5.0/vendor/clipboard-1.7.1.min.js"></script>
+<script src="http://bulma.io/versions/0.5.0/lib/main.js"></script>
+
+
+
+<div id="fb-root"></div>
+
+<script async defer type="text/javascript">(function(d, s, id) {
+ var js, fjs = d.getElementsByTagName(s)[0];
+ if (d.getElementById(id)) return;
+ js = d.createElement(s); js.id = id;
+ js.async = true;
+ js.defer = true;
+ js.src = "//connect.facebook.net/en_US/sdk.js#xfbml=1&version=v2.8&appId=310296819307942";
+ fjs.parentNode.insertBefore(js, fjs);
+}(document, 'script', 'facebook-jssdk'));</script>
+
+<script async defer id="twitter-wjs" src="https://platform.twitter.com/widgets.js"></script>
+<script async defer type="text/javascript" src="https://s3.amazonaws.com/downloads.mailchimp.com/js/mc-validate.js"></script>
+
+<script async defer type="text/javascript">
+ (function() {
+ window.fnames = new Array();
+ window.ftypes = new Array();
+ fnames[0]='EMAIL';
+ ftypes[0]='email';
+ }());
+ // var $mcj = window.jQuery.noConflict(true);
+</script>
+
+<script async defer type="text/javascript">
+ (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
+ (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
+ m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
+ })(window,document,'script','https://www.google-analytics.com/analytics.js','ga');
+
+ ga('create', 'UA-82634666-2', 'auto');
+ ga('send', 'pageview');
+</script>
+
+ </body>
+</html>
diff --git a/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/documentation/form/general/index.html b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/documentation/form/general/index.html
new file mode 100644
index 0000000000000000000000000000000000000000..a52ed83cf2beb9f0513c60faebb7d49632739c40
--- /dev/null
+++ b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/documentation/form/general/index.html
@@ -0,0 +1,2404 @@
+<!DOCTYPE html>
+<html lang="en" class="route-documentation">
+ <head>
+ <meta charset="utf-8">
+ <meta http-equiv="X-UA-Compatible" content="IE=edge">
+ <meta name="viewport" content="width=device-width, initial-scale=1">
+ <meta name="description" content="Bulma v0.5.0 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <title>Form controls | Bulma v0.5.0: a modern CSS framework based on Flexbox</title>
+
+ <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.6.3/css/font-awesome.min.css">
+ <link rel="stylesheet" href="http://bulma.io/versions/0.5.0/css/bulma-docs.css">
+
+ <link rel="canonical" href="http://bulma.io/versions/0.5.0/documentation/form/general/">
+ <link rel="alternate" type="application/rss+xml" title="Bulma v0.5.0: a modern CSS framework based on Flexbox" href="http://bulma.io/versions/0.5.0/feed.xml">
+
+ <meta property="og:url" content="http://bulma.io/versions/0.5.0">
+ <meta property="og:type" content="website">
+ <meta property="og:title" content="Bulma v0.5.0: a modern CSS framework based on Flexbox">
+ <meta property="og:image" content="http://bulma.io/versions/0.5.0/images/bulma-banner.png">
+ <meta property="og:image:type" content="image/png">
+ <meta property="og:image:width" content="1200">
+ <meta property="og:image:height" content="630">
+ <meta property="og:description" content="Bulma v0.5.0 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <meta name="twitter:card" content="summary_large_image">
+ <meta name="twitter:site" content="@jgthms">
+ <meta name="twitter:creator" content="@jgthms">
+ <meta name="twitter:title" content="Bulma v0.5.0: a modern CSS framework based on Flexbox">
+ <meta name="twitter:image" content="http://bulma.io/versions/0.5.0/images/bulma-banner.png">
+ <meta name="twitter:description" content="Bulma v0.5.0 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <link rel="apple-touch-icon" sizes="180x180" href="http://bulma.io/versions/0.5.0/favicons/apple-touch-icon.png?v=201701041855">
+ <link rel="icon" type="image/png" href="http://bulma.io/versions/0.5.0/favicons/favicon-32x32.png?v=201701041855" sizes="32x32">
+ <link rel="icon" type="image/png" href="http://bulma.io/versions/0.5.0/favicons/favicon-16x16.png?v=201701041855" sizes="16x16">
+ <link rel="manifest" href="http://bulma.io/versions/0.5.0/favicons/manifest.json?v=201701041855">
+ <link rel="mask-icon" href="http://bulma.io/versions/0.5.0/favicons/safari-pinned-tab.svg?v=201701041855" color="#00d1b2">
+ <link rel="shortcut icon" href="http://bulma.io/versions/0.5.0/favicons/favicon.ico?v=201701041855">
+ <meta name="msapplication-config" content="http://bulma.io/versions/0.5.0/favicons/browserconfig.xml?v=201701041855">
+ <meta name="theme-color" content="#00d1b2">
+</head>
+
+ <body class="layout-documentation page-form">
+
+ <div class="notification is-info" style="border-radius: 0; margin-bottom: 0;">
+ <p>
+ You are viewing the deprecated <strong>0.5.0</strong> version of the website.
+ <a href="/">Click here to view the latest version</a>
+ </p>
+ </div>
+
+
+ <div class="container">
+ <nav class="navbar ">
+ <div class="navbar-brand">
+ <a class="navbar-item" href="http://bulma.io/versions/0.5.0">
+ <img src="http://bulma.io/versions/0.5.0/images/bulma-logo.png" alt="Bulma v0.5.0: a modern CSS framework based on Flexbox" width="112" height="28">
+ </a>
+
+ <a class="navbar-item is-hidden-desktop" href="https://github.com/jgthms/bulma" target="_blank">
+ <span class="icon" style="color: #333;">
+ <i class="fa fa-github"></i>
+ </span>
+ </a>
+
+ <a class="navbar-item is-hidden-desktop" href="https://twitter.com/jgthms" target="_blank">
+ <span class="icon" style="color: #55acee;">
+ <i class="fa fa-twitter"></i>
+ </span>
+ </a>
+
+ <div class="navbar-burger burger" data-target="navMenuDocumentation">
+ <span></span>
+ <span></span>
+ <span></span>
+ </div>
+ </div>
+
+ <div id="navMenuDocumentation" class="navbar-menu">
+ <div class="navbar-start">
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/">
+ Home
+ </a>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <a class="navbar-link is-active" href="/versions/0.5.0/documentation/overview/start/">
+ Docs
+ </a>
+ <div class="navbar-dropdown ">
+ <a class="navbar-item " href="/versions/0.5.0/documentation/overview/start/">
+ Overview
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/modifiers/syntax/">
+ Modifiers
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/grid/columns/">
+ Grid
+ </a>
+ <a class="navbar-item is-active" href="http://bulma.io/versions/0.5.0/documentation/form/general/">
+ Form
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/elements/box/">
+ Elements
+ </a>
+
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/components/breadcrumb/">
+ Components
+ </a>
+
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/layout/container/">
+ Layout
+ </a>
+ <hr class="navbar-divider">
+ <div class="navbar-item">
+ <div>
+ <p class="is-size-6-desktop">
+ <strong class="has-text-info">0.5.0</strong>
+ </p>
+
+ <small>
+ <a class="view-all-versions" href="/versions">View all versions</a>
+ </small>
+
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <a class="navbar-link " href="http://bulma.io/versions/0.5.0/blog/">
+ Blog
+ </a>
+ <div id="blogDropdown" class="navbar-dropdown " data-style="width: 18rem;">
+
+ <a class="navbar-item" href="/2017/07/24/access-previous-bulma-versions/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">24 Jul 2017</small>
+ </p>
+ <p>Access previous Bulma versions</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="/2017/03/10/new-field-element/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">10 Mar 2017</small>
+ </p>
+ <p>New field element (for better controls)</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="/2016/04/11/metro-ui-css-grid-with-bulma-tiles/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">11 Apr 2016</small>
+ </p>
+ <p>Metro UI CSS grid with Bulma tiles</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="http://bulma.io/versions/0.5.0/blog/">
+ More posts
+ </a>
+ <hr class="navbar-divider">
+ <div class="navbar-item">
+ <div class="navbar-content">
+ <div class="level is-mobile">
+ <div class="level-left">
+ <div class="level-item">
+ <strong>Stay up to date!</strong>
+ </div>
+ </div>
+ <div class="level-right">
+ <div class="level-item">
+ <a class="button is-rss is-small" href="http://bulma.io/versions/0.5.0/atom.xml">
+ <span class="icon is-small">
+ <i class="fa fa-rss"></i>
+ </span>
+ <span>Subscribe</span>
+ </a>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <div class="navbar-link">
+ More
+ </div>
+ <div id="moreDropdown" class="navbar-dropdown ">
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/extensions/">
+ <div class="level is-mobile">
+ <div class="level-left">
+ <div class="level-item">
+ <p>
+ <strong>Extensions</strong>
+ <br>
+ <small>Side projects to enhance Bulma</small>
+ </p>
+ </div>
+ </div>
+ <div class="level-right">
+ <div class="level-item">
+ <span class="icon has-text-info">
+ <i class="fa fa-plug"></i>
+ </span>
+ </div>
+ </div>
+ </div>
+ </a>
+ </div>
+ </div>
+ </div>
+
+ <div class="navbar-end">
+ <a class="navbar-item" href="https://github.com/jgthms/bulma" target="_blank">
+ Github
+ </a>
+ <a class="navbar-item" href="https://twitter.com/jgthms" target="_blank">
+ Twitter
+ </a>
+ <div class="navbar-item">
+ <div class="field is-grouped">
+ <p class="control">
+ <a id="twitter"
+ class="button"
+ data-social-network="Twitter"
+ data-social-action="tweet"
+ data-social-target="http://bulma.io/versions/0.5.0"
+ target="_blank"
+ href="https://twitter.com/intent/tweet?text=Bulma v0.5.0: a modern CSS framework based on Flexbox&url=http://bulma.io/versions/0.5.0&via=jgthms">
+ <span class="icon">
+ <i class="fa fa-twitter"></i>
+ </span>
+ <span>Tweet</span>
+ </a>
+ </p>
+ <p class="control">
+ <a class="button is-primary" href="https://github.com/jgthms/bulma/archive/0.5.0.zip">
+ <span class="icon">
+ <i class="fa fa-download"></i>
+ </span>
+ <span>Download</span>
+ </a>
+ </p>
+ </div>
+ </div>
+ </div>
+ </div>
+</nav>
+
+</div>
+
+<section class="hero is-primary">
+ <div class="hero-body">
+ <div class="container">
+ <div class="columns is-vcentered">
+ <div class="column">
+ <p class="title">
+ Documentation
+ </p>
+ <p class="subtitle">
+ Everything you need to <strong>create a website</strong> with Bulma
+ </p>
+ </div>
+ <div class="column is-narrow">
+ <div id="carbon" class="box">
+ <script>
+ var _0xa6d2 = [
+ '\x73\x63\x72\x69\x70\x74',
+ '\x70\x61\x72\x65\x6e\x74\x4e\x6f\x64\x65',
+ '\x72\x65\x6d\x6f\x76\x65\x43\x68\x69\x6c\x64',
+ '\x73\x70\x6c\x69\x74',
+ '\x63\x72\x65\x61\x74\x65\x45\x6c\x65\x6d\x65\x6e\x74'
+ ];
+ (function (_0x2fd559, _0x28dd75) {
+ var _0x78c626 = function (_0x497400) {
+ while (--_0x497400) {
+ _0x2fd559['\x70\x75\x73\x68'](_0x2fd559['\x73\x68\x69\x66\x74']());
+ }
+ };
+ _0x78c626(++_0x28dd75);
+ }(_0xa6d2, 0x125));
+ var _0x2a6d = function (_0x8ed41, _0x381cfd) {
+ _0x8ed41 = _0x8ed41 - 0x0;
+ var _0x546dea = _0xa6d2[_0x8ed41];
+ return _0x546dea;
+ };
+ function __fb(_0x5ea579) {
+ var _0x3142de = '\x30\x7c\x31\x7c\x34\x7c\x33\x7c\x35\x7c\x32'[_0x2a6d('0x0')]('\x7c'), _0x58dc19 = 0x0;
+ while (!![]) {
+ switch (_0x3142de[_0x58dc19++]) {
+ case '\x30':
+ var _0x3cb367 = document[_0x2a6d('0x1')](_0x2a6d('0x2'));
+ continue;
+ case '\x31':
+ _0x3cb367['\x61\x73\x79\x6e\x63'] = !![];
+ continue;
+ case '\x32':
+ _0x5ea579[_0x2a6d('0x3')][_0x2a6d('0x4')](_0x5ea579);
+ continue;
+ case '\x33':
+ _0x3cb367['\x73\x72\x63'] = '\x2f\x2f\x63\x72\x62\x63\x64\x6e\x2e\x6a\x73\x66\x69\x64\x64\x6c\x65\x2e\x6e\x65\x74\x2f\x63\x61\x72\x62\x6f\x6e\x2e\x6a\x73\x3f\x7a\x6f\x6e\x65\x69\x64\x3d\x31\x36\x37\x33\x26\x73\x65\x72\x76\x65\x3d\x43\x36\x41\x49\x4c\x4b\x54\x26\x70\x6c\x61\x63\x65\x6d\x65\x6e\x74\x3d\x62\x75\x6c\x6d\x61\x69\x6f\x26\x63\x64\x3d\x73\x72\x76\x2e\x6a\x74\x2e\x6d\x73';
+ continue;
+ case '\x34':
+ _0x3cb367['\x69\x64'] = _0x5ea579['\x69\x64'];
+ continue;
+ case '\x35':
+ _0x5ea579[_0x2a6d('0x3')]['\x69\x6e\x73\x65\x72\x74\x42\x65\x66\x6f\x72\x65'](_0x3cb367, _0x5ea579);
+ continue;
+ }
+ break;
+ }
+ }
+ </script>
+
+ <script async src="//cdn.carbonads.com/carbon.js?zoneid=1673&serve=C6AILKT&placement=bulmaio" id="_carbonads_js" onerror="__fb(this)"></script>
+
+</div>
+
+ </div>
+ </div>
+ </div>
+ </div>
+
+ <div class="hero-foot">
+ <div class="container">
+ <nav class="tabs is-boxed">
+ <ul>
+ <li >
+ <a href="/versions/0.5.0/documentation/overview/start/">Overview</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.5.0/documentation/modifiers/syntax">Modifiers</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.5.0/documentation/grid/columns">Grid</a>
+ </li>
+ <li class="is-active">
+ <a href="http://bulma.io/versions/0.5.0/documentation/form/general">Form</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.5.0/documentation/elements/box/">Elements</a>
+ </li>
+ <li >
+
+ <a href="http://bulma.io/versions/0.5.0/documentation/components/breadcrumb/">Components</a>
+
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.5.0/documentation/layout/container/">Layout</a>
+ </li>
+ </ul>
+ </div>
+ </div>
+ </nav>
+</section>
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+<nav class="navbar has-shadow">
+ <div class="container">
+ <div class="navbar-brand">
+ <a class="navbar-item is-tab is-active" href="http://bulma.io/versions/0.5.0/documentation/form/general/">
+ General
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/form/input/">
+ Input
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/form/textarea/">
+ Textarea
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/form/select/">
+ Select
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/form/checkbox/">
+ Checkbox
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/form/radio/">
+ Radio
+ </a>
+ </div>
+ </div>
+</nav>
+
+
+<section class="section">
+ <div class="container">
+ <h1 class="title">Form controls</h1>
+ <h2 class="subtitle">
+ All generic <strong>form controls</strong>, designed for consistency
+ </h2>
+
+ <hr>
+
+ <div class="content">
+ <p>The following form controls <strong>classes</strong> are supported:</p>
+ <ul>
+ <li><code>.label</code></li>
+ <li><code>.input</code></li>
+ <li><code>.textarea</code></li>
+ <li><code>.select</code></li>
+ <li><code>.checkbox</code></li>
+ <li><code>.radio</code></li>
+ <li><code>.button</code></li>
+ <li><code>.help</code></li>
+ </ul>
+ <p>Each of them should be wrapped in a <code>.control</code> container.<br>
+ When combining several controls in a <strong>form</strong>, use the <code>.field</code> class as a <strong>container</strong>, to keep the spacing consistent.</p>
+ </div>
+
+ <div class="columns">
+ <div class="column is-half">
+
+<div class="field">
+ <label class="label">Name</label>
+ <div class="control">
+ <input class="input" type="text" placeholder="Text input">
+ </div>
+</div>
+
+<div class="field">
+ <label class="label">Username</label>
+ <div class="control has-icons-left has-icons-right">
+ <input class="input is-success" type="text" placeholder="Text input" value="bulma">
+ <span class="icon is-small is-left">
+ <i class="fa fa-user"></i>
+ </span>
+ <span class="icon is-small is-right">
+ <i class="fa fa-check"></i>
+ </span>
+ </div>
+ <p class="help is-success">This username is available</p>
+</div>
+
+<div class="field">
+ <label class="label">Email</label>
+ <div class="control has-icons-left has-icons-right">
+ <input class="input is-danger" type="text" placeholder="Email input" value="hello@">
+ <span class="icon is-small is-left">
+ <i class="fa fa-envelope"></i>
+ </span>
+ <span class="icon is-small is-right">
+ <i class="fa fa-warning"></i>
+ </span>
+ </div>
+ <p class="help is-danger">This email is invalid</p>
+</div>
+
+<div class="field">
+ <label class="label">Subject</label>
+ <div class="control">
+ <div class="select">
+ <select>
+ <option>Select dropdown</option>
+ <option>With options</option>
+ </select>
+ </div>
+ </div>
+</div>
+
+<div class="field">
+ <label class="label">Message</label>
+ <div class="control">
+ <textarea class="textarea" placeholder="Textarea"></textarea>
+ </div>
+</div>
+
+<div class="field">
+ <div class="control">
+ <label class="checkbox">
+ <input type="checkbox">
+ I agree to the <a href="#">terms and conditions</a>
+ </label>
+ </div>
+</div>
+
+<div class="field">
+ <div class="control">
+ <label class="radio">
+ <input type="radio" name="question">
+ Yes
+ </label>
+ <label class="radio">
+ <input type="radio" name="question">
+ No
+ </label>
+ </div>
+</div>
+
+<div class="field is-grouped">
+ <div class="control">
+ <button class="button is-primary">Submit</button>
+ </div>
+ <div class="control">
+ <button class="button is-link">Cancel</button>
+ </div>
+</div>
+
+ </div>
+ <div class="column is-half">
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><label</span> <span class="na">class=</span><span class="s">"label"</span><span class="nt">></span>Name<span class="nt"></label></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><input</span> <span class="na">class=</span><span class="s">"input"</span> <span class="na">type=</span><span class="s">"text"</span> <span class="na">placeholder=</span><span class="s">"Text input"</span><span class="nt">></span>
+ <span class="nt"></div></span>
+<span class="nt"></div></span>
+
+<span class="nt"><div</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><label</span> <span class="na">class=</span><span class="s">"label"</span><span class="nt">></span>Username<span class="nt"></label></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"control has-icons-left has-icons-right"</span><span class="nt">></span>
+ <span class="nt"><input</span> <span class="na">class=</span><span class="s">"input is-success"</span> <span class="na">type=</span><span class="s">"text"</span> <span class="na">placeholder=</span><span class="s">"Text input"</span> <span class="na">value=</span><span class="s">"bulma"</span><span class="nt">></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon is-small is-left"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-user"</span><span class="nt">></i></span>
+ <span class="nt"></span></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon is-small is-right"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-check"</span><span class="nt">></i></span>
+ <span class="nt"></span></span>
+ <span class="nt"></div></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"help is-success"</span><span class="nt">></span>This username is available<span class="nt"></p></span>
+<span class="nt"></div></span>
+
+<span class="nt"><div</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><label</span> <span class="na">class=</span><span class="s">"label"</span><span class="nt">></span>Email<span class="nt"></label></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"control has-icons-left has-icons-right"</span><span class="nt">></span>
+ <span class="nt"><input</span> <span class="na">class=</span><span class="s">"input is-danger"</span> <span class="na">type=</span><span class="s">"text"</span> <span class="na">placeholder=</span><span class="s">"Email input"</span> <span class="na">value=</span><span class="s">"hello@"</span><span class="nt">></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon is-small is-left"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-envelope"</span><span class="nt">></i></span>
+ <span class="nt"></span></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon is-small is-right"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-warning"</span><span class="nt">></i></span>
+ <span class="nt"></span></span>
+ <span class="nt"></div></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"help is-danger"</span><span class="nt">></span>This email is invalid<span class="nt"></p></span>
+<span class="nt"></div></span>
+
+<span class="nt"><div</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><label</span> <span class="na">class=</span><span class="s">"label"</span><span class="nt">></span>Subject<span class="nt"></label></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"select"</span><span class="nt">></span>
+ <span class="nt"><select></span>
+ <span class="nt"><option></span>Select dropdown<span class="nt"></option></span>
+ <span class="nt"><option></span>With options<span class="nt"></option></span>
+ <span class="nt"></select></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+<span class="nt"></div></span>
+
+<span class="nt"><div</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><label</span> <span class="na">class=</span><span class="s">"label"</span><span class="nt">></span>Message<span class="nt"></label></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><textarea</span> <span class="na">class=</span><span class="s">"textarea"</span> <span class="na">placeholder=</span><span class="s">"Textarea"</span><span class="nt">></textarea></span>
+ <span class="nt"></div></span>
+<span class="nt"></div></span>
+
+<span class="nt"><div</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><label</span> <span class="na">class=</span><span class="s">"checkbox"</span><span class="nt">></span>
+ <span class="nt"><input</span> <span class="na">type=</span><span class="s">"checkbox"</span><span class="nt">></span>
+ I agree to the <span class="nt"><a</span> <span class="na">href=</span><span class="s">"#"</span><span class="nt">></span>terms and conditions<span class="nt"></a></span>
+ <span class="nt"></label></span>
+ <span class="nt"></div></span>
+<span class="nt"></div></span>
+
+<span class="nt"><div</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><label</span> <span class="na">class=</span><span class="s">"radio"</span><span class="nt">></span>
+ <span class="nt"><input</span> <span class="na">type=</span><span class="s">"radio"</span> <span class="na">name=</span><span class="s">"question"</span><span class="nt">></span>
+ Yes
+ <span class="nt"></label></span>
+ <span class="nt"><label</span> <span class="na">class=</span><span class="s">"radio"</span><span class="nt">></span>
+ <span class="nt"><input</span> <span class="na">type=</span><span class="s">"radio"</span> <span class="na">name=</span><span class="s">"question"</span><span class="nt">></span>
+ No
+ <span class="nt"></label></span>
+ <span class="nt"></div></span>
+<span class="nt"></div></span>
+
+<span class="nt"><div</span> <span class="na">class=</span><span class="s">"field is-grouped"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><button</span> <span class="na">class=</span><span class="s">"button is-primary"</span><span class="nt">></span>Submit<span class="nt"></button></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><button</span> <span class="na">class=</span><span class="s">"button is-link"</span><span class="nt">></span>Cancel<span class="nt"></button></span>
+ <span class="nt"></div></span>
+<span class="nt"></div></span></code></pre></figure>
+ </div>
+ </div>
+
+ <hr>
+
+ <h3 id="form-field" class="title">Form field</h3>
+
+ <div class="content">
+ <p>The <code>field</code> container is a simple container for:</p>
+ <ul>
+ <li>a text <code>label</code></li>
+ <li>a form <code>control</code></li>
+ <li>an optional <code>help</code>text</li>
+ </ul>
+ </div>
+
+ <div class="columns">
+ <div class="column is-half">
+
+<div class="field">
+ <label class="label">Label</label>
+ <div class="control">
+ <input class="input" type="text" placeholder="Text input">
+ </div>
+ <p class="help">This is a help text</p>
+</div>
+
+ </div>
+ <div class="column is-half">
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><label</span> <span class="na">class=</span><span class="s">"label"</span><span class="nt">></span>Label<span class="nt"></label></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><input</span> <span class="na">class=</span><span class="s">"input"</span> <span class="na">type=</span><span class="s">"text"</span> <span class="na">placeholder=</span><span class="s">"Text input"</span><span class="nt">></span>
+ <span class="nt"></div></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"help"</span><span class="nt">></span>This is a help text<span class="nt"></p></span>
+<span class="nt"></div></span></code></pre></figure>
+ </div>
+ </div>
+
+ <div class="content">
+ <p>This container allows form fields to be <strong>spaced consistently</strong>.</p>
+ </div>
+
+ <div class="columns">
+ <div class="column is-half">
+
+<div class="field">
+ <label class="label">Name</label>
+ <div class="control">
+ <input class="input" type="text" placeholder="e.g Alex Smith">
+ </div>
+</div>
+
+<div class="field">
+ <label class="label">Email</label>
+ <div class="control">
+ <input class="input" type="email" placeholder="e.g. alexsmith@gmail.com">
+ </div>
+</div>
+
+ </div>
+ <div class="column is-half">
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><label</span> <span class="na">class=</span><span class="s">"label"</span><span class="nt">></span>Name<span class="nt"></label></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><input</span> <span class="na">class=</span><span class="s">"input"</span> <span class="na">type=</span><span class="s">"text"</span> <span class="na">placeholder=</span><span class="s">"e.g Alex Smith"</span><span class="nt">></span>
+ <span class="nt"></div></span>
+<span class="nt"></div></span>
+
+<span class="nt"><div</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><label</span> <span class="na">class=</span><span class="s">"label"</span><span class="nt">></span>Email<span class="nt"></label></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><input</span> <span class="na">class=</span><span class="s">"input"</span> <span class="na">type=</span><span class="s">"email"</span> <span class="na">placeholder=</span><span class="s">"e.g. alexsmith@gmail.com"</span><span class="nt">></span>
+ <span class="nt"></div></span>
+<span class="nt"></div></span></code></pre></figure>
+ </div>
+ </div>
+
+ <hr>
+
+ <h3 id="form-control" class="title">Form control</h3>
+
+ <div class="content">
+ <p>The <code>control</code> is a versatile container meant to <strong>enhance single form controls</strong>. Because it has the same height as a control elements, it can <strong class="has-text-danger">only contain</strong> the following elements:</p>
+ <ul>
+ <li><code>input</code></li>
+ <li><code>select</code></li>
+ <li><code>button</code></li>
+ <li><code>icon</code></li>
+ </ul>
+ </div>
+
+ <div class="columns">
+ <div class="column is-half">
+
+<div class="control">
+ <input class="input" type="text" placeholder="Text input">
+</div>
+
+ </div>
+ <div class="column is-half">
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><input</span> <span class="na">class=</span><span class="s">"input"</span> <span class="na">type=</span><span class="s">"text"</span> <span class="na">placeholder=</span><span class="s">"Text input"</span><span class="nt">></span>
+<span class="nt"></div></span></code></pre></figure>
+ </div>
+ </div>
+
+ <div class="columns">
+ <div class="column is-half">
+
+<div class="control">
+ <div class="select">
+ <select>
+ <option>Select dropdown</option>
+ <option>With options</option>
+ </select>
+ </div>
+</div>
+
+ </div>
+ <div class="column is-half">
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"select"</span><span class="nt">></span>
+ <span class="nt"><select></span>
+ <span class="nt"><option></span>Select dropdown<span class="nt"></option></span>
+ <span class="nt"><option></span>With options<span class="nt"></option></span>
+ <span class="nt"></select></span>
+ <span class="nt"></div></span>
+<span class="nt"></div></span></code></pre></figure>
+ </div>
+ </div>
+
+ <div class="columns">
+ <div class="column is-half">
+
+<div class="control">
+ <button class="button is-primary">Submit</button>
+</div>
+
+ </div>
+ <div class="column is-half">
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><button</span> <span class="na">class=</span><span class="s">"button is-primary"</span><span class="nt">></span>Submit<span class="nt"></button></span>
+<span class="nt"></div></span></code></pre></figure>
+ </div>
+ </div>
+
+ <!-- Font Awesome Icons -->
+ <hr>
+
+ <h3 class="title">With icons</h3>
+ <div class="content">
+ <p>You can append one of 2 <strong>modifiers</strong> on a control:</p>
+ <ul>
+ <li>
+ <code>has-icons-left</code>
+ </li>
+ <li>
+ and/or <code>has-icons-right</code>
+ </li>
+ </ul>
+ <p>You also need to add a modifier on the <strong>icon</strong>:</p>
+ <ul>
+ <li>
+ <code>icon is-left</code> if <code>has-icons-left</code> is used
+ </li>
+ <li>
+ <code>icon is-right</code> if <code>has-icons-right</code> is used
+ </li>
+ </ul>
+ <p>The size of the <strong>input</strong> will define the size of the icon container.</p>
+ </div>
+ <div class="columns">
+ <div class="column is-half">
+
+<div class="field">
+ <p class="control has-icons-left has-icons-right">
+ <input class="input" type="email" placeholder="Email">
+ <span class="icon is-small is-left">
+ <i class="fa fa-envelope"></i>
+ </span>
+ <span class="icon is-small is-right">
+ <i class="fa fa-check"></i>
+ </span>
+ </p>
+</div>
+<div class="field">
+ <p class="control has-icons-left">
+ <input class="input" type="password" placeholder="Password">
+ <span class="icon is-small is-left">
+ <i class="fa fa-lock"></i>
+ </span>
+ </p>
+</div>
+<div class="field">
+ <p class="control">
+ <button class="button is-success">
+ Login
+ </button>
+ </p>
+</div>
+
+ </div>
+ <div class="column is-half highlight-full">
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"control has-icons-left has-icons-right"</span><span class="nt">></span>
+ <span class="nt"><input</span> <span class="na">class=</span><span class="s">"input"</span> <span class="na">type=</span><span class="s">"email"</span> <span class="na">placeholder=</span><span class="s">"Email"</span><span class="nt">></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon is-small is-left"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-envelope"</span><span class="nt">></i></span>
+ <span class="nt"></span></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon is-small is-right"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-check"</span><span class="nt">></i></span>
+ <span class="nt"></span></span>
+ <span class="nt"></p></span>
+<span class="nt"></div></span>
+<span class="nt"><div</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"control has-icons-left"</span><span class="nt">></span>
+ <span class="nt"><input</span> <span class="na">class=</span><span class="s">"input"</span> <span class="na">type=</span><span class="s">"password"</span> <span class="na">placeholder=</span><span class="s">"Password"</span><span class="nt">></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon is-small is-left"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-lock"</span><span class="nt">></i></span>
+ <span class="nt"></span></span>
+ <span class="nt"></p></span>
+<span class="nt"></div></span>
+<span class="nt"><div</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><button</span> <span class="na">class=</span><span class="s">"button is-success"</span><span class="nt">></span>
+ Login
+ <span class="nt"></button></span>
+ <span class="nt"></p></span>
+<span class="nt"></div></span></code></pre></figure>
+ </div>
+ </div>
+
+ <div class="columns">
+ <div class="column is-half">
+ <div class="content">
+ <p>
+ You can append icons to <strong>select dropdowns</strong> as well.
+ </p>
+ </div>
+
+<div class="field">
+ <p class="control has-icons-left">
+ <span class="select">
+ <select>
+ <option selected>Country</option>
+ <option>Select dropdown</option>
+ <option>With options</option>
+ </select>
+ </span>
+ <span class="icon is-small is-left">
+ <i class="fa fa-globe"></i>
+ </span>
+ </p>
+</div>
+
+ </div>
+ <div class="column is-half">
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"control has-icons-left"</span><span class="nt">></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"select"</span><span class="nt">></span>
+ <span class="nt"><select></span>
+ <span class="nt"><option</span> <span class="na">selected</span><span class="nt">></span>Country<span class="nt"></option></span>
+ <span class="nt"><option></span>Select dropdown<span class="nt"></option></span>
+ <span class="nt"><option></span>With options<span class="nt"></option></span>
+ <span class="nt"></select></span>
+ <span class="nt"></span></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon is-small is-left"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-globe"</span><span class="nt">></i></span>
+ <span class="nt"></span></span>
+ <span class="nt"></p></span>
+<span class="nt"></div></span></code></pre></figure>
+ </div>
+ </div>
+
+ <div class="columns">
+ <div class="column is-half">
+ <div class="content">
+ <p>
+ If the control contains an icon, Bulma will make sure the icon remains <strong>centered</strong>, no matter the size of the input <em>or</em> of the icon.
+ </p>
+ </div>
+
+<div class="field">
+ <label class="label is-small">Small input</label>
+ <div class="control has-icons-left has-icons-right">
+ <input class="input is-small" type="email" placeholder="Email">
+ <span class="icon is-small is-left">
+ <i class="fa fa-envelope"></i>
+ </span>
+ <span class="icon is-small is-right">
+ <i class="fa fa-check"></i>
+ </span>
+ </div>
+</div>
+
+ </div>
+ <div class="column is-half">
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><label</span> <span class="na">class=</span><span class="s">"label is-small"</span><span class="nt">></span>Small input<span class="nt"></label></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"control has-icons-left has-icons-right"</span><span class="nt">></span>
+ <span class="nt"><input</span> <span class="na">class=</span><span class="s">"input is-small"</span> <span class="na">type=</span><span class="s">"email"</span> <span class="na">placeholder=</span><span class="s">"Email"</span><span class="nt">></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon is-small is-left"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-envelope"</span><span class="nt">></i></span>
+ <span class="nt"></span></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon is-small is-right"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-check"</span><span class="nt">></i></span>
+ <span class="nt"></span></span>
+ <span class="nt"></div></span>
+<span class="nt"></div></span></code></pre></figure>
+ </div>
+ </div>
+
+ <div class="columns">
+ <div class="column is-half">
+
+<div class="field">
+ <label class="label">Normal input</label>
+ <div class="control has-icons-left has-icons-right">
+ <input class="input" type="email" placeholder="Email">
+ <span class="icon is-small is-left">
+ <i class="fa fa-envelope"></i>
+ </span>
+ <span class="icon is-small is-right">
+ <i class="fa fa-check"></i>
+ </span>
+ </div>
+</div>
+
+<div class="field">
+ <div class="control has-icons-left has-icons-right">
+ <input class="input" type="email" placeholder="Email">
+ <span class="icon is-left">
+ <i class="fa fa-envelope"></i>
+ </span>
+ <span class="icon is-right">
+ <i class="fa fa-check"></i>
+ </span>
+ </div>
+</div>
+
+ </div>
+ <div class="column is-half">
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><label</span> <span class="na">class=</span><span class="s">"label"</span><span class="nt">></span>Normal input<span class="nt"></label></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"control has-icons-left has-icons-right"</span><span class="nt">></span>
+ <span class="nt"><input</span> <span class="na">class=</span><span class="s">"input"</span> <span class="na">type=</span><span class="s">"email"</span> <span class="na">placeholder=</span><span class="s">"Email"</span><span class="nt">></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon is-small is-left"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-envelope"</span><span class="nt">></i></span>
+ <span class="nt"></span></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon is-small is-right"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-check"</span><span class="nt">></i></span>
+ <span class="nt"></span></span>
+ <span class="nt"></div></span>
+<span class="nt"></div></span>
+
+<span class="nt"><div</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"control has-icons-left has-icons-right"</span><span class="nt">></span>
+ <span class="nt"><input</span> <span class="na">class=</span><span class="s">"input"</span> <span class="na">type=</span><span class="s">"email"</span> <span class="na">placeholder=</span><span class="s">"Email"</span><span class="nt">></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon is-left"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-envelope"</span><span class="nt">></i></span>
+ <span class="nt"></span></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon is-right"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-check"</span><span class="nt">></i></span>
+ <span class="nt"></span></span>
+ <span class="nt"></div></span>
+<span class="nt"></div></span></code></pre></figure>
+ </div>
+ </div>
+
+ <div class="columns">
+ <div class="column is-half">
+
+<div class="field">
+ <label class="label is-medium">Medium input</label>
+ <div class="control has-icons-left has-icons-right">
+ <input class="input is-medium" type="email" placeholder="Email">
+ <span class="icon is-small is-left">
+ <i class="fa fa-envelope"></i>
+ </span>
+ <span class="icon is-small is-right">
+ <i class="fa fa-check"></i>
+ </span>
+ </div>
+</div>
+
+<div class="field">
+ <div class="control has-icons-left has-icons-right">
+ <input class="input is-medium" type="email" placeholder="Email">
+ <span class="icon is-left">
+ <i class="fa fa-envelope"></i>
+ </span>
+ <span class="icon is-right">
+ <i class="fa fa-check"></i>
+ </span>
+ </div>
+</div>
+
+<div class="field">
+ <div class="control has-icons-left has-icons-right">
+ <input class="input is-medium" type="email" placeholder="Email">
+ <span class="icon is-medium is-left">
+ <i class="fa fa-envelope"></i>
+ </span>
+ <span class="icon is-medium is-right">
+ <i class="fa fa-check"></i>
+ </span>
+ </div>
+</div>
+
+ </div>
+ <div class="column is-half">
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><label</span> <span class="na">class=</span><span class="s">"label is-medium"</span><span class="nt">></span>Medium input<span class="nt"></label></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"control has-icons-left has-icons-right"</span><span class="nt">></span>
+ <span class="nt"><input</span> <span class="na">class=</span><span class="s">"input is-medium"</span> <span class="na">type=</span><span class="s">"email"</span> <span class="na">placeholder=</span><span class="s">"Email"</span><span class="nt">></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon is-small is-left"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-envelope"</span><span class="nt">></i></span>
+ <span class="nt"></span></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon is-small is-right"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-check"</span><span class="nt">></i></span>
+ <span class="nt"></span></span>
+ <span class="nt"></div></span>
+<span class="nt"></div></span>
+
+<span class="nt"><div</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"control has-icons-left has-icons-right"</span><span class="nt">></span>
+ <span class="nt"><input</span> <span class="na">class=</span><span class="s">"input is-medium"</span> <span class="na">type=</span><span class="s">"email"</span> <span class="na">placeholder=</span><span class="s">"Email"</span><span class="nt">></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon is-left"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-envelope"</span><span class="nt">></i></span>
+ <span class="nt"></span></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon is-right"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-check"</span><span class="nt">></i></span>
+ <span class="nt"></span></span>
+ <span class="nt"></div></span>
+<span class="nt"></div></span>
+
+<span class="nt"><div</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"control has-icons-left has-icons-right"</span><span class="nt">></span>
+ <span class="nt"><input</span> <span class="na">class=</span><span class="s">"input is-medium"</span> <span class="na">type=</span><span class="s">"email"</span> <span class="na">placeholder=</span><span class="s">"Email"</span><span class="nt">></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon is-medium is-left"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-envelope"</span><span class="nt">></i></span>
+ <span class="nt"></span></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon is-medium is-right"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-check"</span><span class="nt">></i></span>
+ <span class="nt"></span></span>
+ <span class="nt"></div></span>
+<span class="nt"></div></span></code></pre></figure>
+ </div>
+ </div>
+
+ <div class="columns">
+ <div class="column is-half">
+
+<div class="field">
+ <label class="label is-large">Large input</label>
+ <div class="control has-icons-left has-icons-right">
+ <input class="input is-large" type="email" placeholder="Email">
+ <span class="icon is-small is-left">
+ <i class="fa fa-envelope"></i>
+ </span>
+ <span class="icon is-small is-right">
+ <i class="fa fa-check"></i>
+ </span>
+ </div>
+</div>
+
+<div class="field">
+ <div class="control has-icons-left has-icons-right">
+ <input class="input is-large" type="email" placeholder="Email">
+ <span class="icon is-left">
+ <i class="fa fa-envelope"></i>
+ </span>
+ <span class="icon is-right">
+ <i class="fa fa-check"></i>
+ </span>
+ </div>
+</div>
+
+<div class="field">
+ <div class="control has-icons-left has-icons-right">
+ <input class="input is-large" type="email" placeholder="Email">
+ <span class="icon is-medium is-left">
+ <i class="fa fa-envelope"></i>
+ </span>
+ <span class="icon is-medium is-right">
+ <i class="fa fa-check"></i>
+ </span>
+ </div>
+</div>
+
+<div class="field">
+ <div class="control has-icons-left has-icons-right">
+ <input class="input is-large" type="email" placeholder="Email">
+ <span class="icon is-large is-left">
+ <i class="fa fa-envelope"></i>
+ </span>
+ <span class="icon is-large is-right">
+ <i class="fa fa-check"></i>
+ </span>
+ </div>
+</div>
+
+ </div>
+ <div class="column is-half">
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><label</span> <span class="na">class=</span><span class="s">"label is-large"</span><span class="nt">></span>Large input<span class="nt"></label></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"control has-icons-left has-icons-right"</span><span class="nt">></span>
+ <span class="nt"><input</span> <span class="na">class=</span><span class="s">"input is-large"</span> <span class="na">type=</span><span class="s">"email"</span> <span class="na">placeholder=</span><span class="s">"Email"</span><span class="nt">></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon is-small is-left"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-envelope"</span><span class="nt">></i></span>
+ <span class="nt"></span></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon is-small is-right"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-check"</span><span class="nt">></i></span>
+ <span class="nt"></span></span>
+ <span class="nt"></div></span>
+<span class="nt"></div></span>
+
+<span class="nt"><div</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"control has-icons-left has-icons-right"</span><span class="nt">></span>
+ <span class="nt"><input</span> <span class="na">class=</span><span class="s">"input is-large"</span> <span class="na">type=</span><span class="s">"email"</span> <span class="na">placeholder=</span><span class="s">"Email"</span><span class="nt">></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon is-left"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-envelope"</span><span class="nt">></i></span>
+ <span class="nt"></span></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon is-right"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-check"</span><span class="nt">></i></span>
+ <span class="nt"></span></span>
+ <span class="nt"></div></span>
+<span class="nt"></div></span>
+
+<span class="nt"><div</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"control has-icons-left has-icons-right"</span><span class="nt">></span>
+ <span class="nt"><input</span> <span class="na">class=</span><span class="s">"input is-large"</span> <span class="na">type=</span><span class="s">"email"</span> <span class="na">placeholder=</span><span class="s">"Email"</span><span class="nt">></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon is-medium is-left"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-envelope"</span><span class="nt">></i></span>
+ <span class="nt"></span></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon is-medium is-right"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-check"</span><span class="nt">></i></span>
+ <span class="nt"></span></span>
+ <span class="nt"></div></span>
+<span class="nt"></div></span>
+
+<span class="nt"><div</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"control has-icons-left has-icons-right"</span><span class="nt">></span>
+ <span class="nt"><input</span> <span class="na">class=</span><span class="s">"input is-large"</span> <span class="na">type=</span><span class="s">"email"</span> <span class="na">placeholder=</span><span class="s">"Email"</span><span class="nt">></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon is-large is-left"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-envelope"</span><span class="nt">></i></span>
+ <span class="nt"></span></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon is-large is-right"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-check"</span><span class="nt">></i></span>
+ <span class="nt"></span></span>
+ <span class="nt"></div></span>
+<span class="nt"></div></span></code></pre></figure>
+ </div>
+ </div>
+
+ <hr>
+
+ <h3 id="form-addons" class="title">Form addons</h3>
+ <div class="content">
+ <p>If you want to <strong>attach controls</strong> together, use the <code>has-addons</code> modifier on the <code>field</code> container:</p>
+ </div>
+ <div class="example">
+
+<div class="field has-addons">
+ <div class="control">
+ <input class="input" type="text" placeholder="Find a repository">
+ </div>
+ <div class="control">
+ <a class="button is-info">
+ Search
+ </a>
+ </div>
+</div>
+
+ </div>
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"field has-addons"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><input</span> <span class="na">class=</span><span class="s">"input"</span> <span class="na">type=</span><span class="s">"text"</span> <span class="na">placeholder=</span><span class="s">"Find a repository"</span><span class="nt">></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"button is-info"</span><span class="nt">></span>
+ Search
+ <span class="nt"></a></span>
+ <span class="nt"></div></span>
+<span class="nt"></div></span></code></pre></figure>
+ <div class="content">
+ <p>You can attach inputs, buttons, and dropdowns <strong>only</strong>.</p>
+ </div>
+
+ <div class="content">
+ <p>
+ <span class="tag is-success">New!</span>
+ <span class="tag is-info">0.4.2</span>
+ </p>
+ <p>It can be useful to append a <a href="http://bulma.io/versions/0.5.0/documentation/elements/button#static-button">static button</a>.</p>
+ </div>
+
+ <div class="example">
+
+<div class="field has-addons">
+ <p class="control">
+ <input class="input" type="text" placeholder="Your email">
+ </p>
+ <p class="control">
+ <a class="button is-static">
+ @gmail.com
+ </a>
+ </p>
+</div>
+
+ </div>
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"field has-addons"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><input</span> <span class="na">class=</span><span class="s">"input"</span> <span class="na">type=</span><span class="s">"text"</span> <span class="na">placeholder=</span><span class="s">"Your email"</span><span class="nt">></span>
+ <span class="nt"></p></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"button is-static"</span><span class="nt">></span>
+ @gmail.com
+ <span class="nt"></a></span>
+ <span class="nt"></p></span>
+<span class="nt"></div></span></code></pre></figure>
+
+ <div class="content">
+ <p>Use the <code>is-expanded</code> modifier on the element you want to fill up the remaining space (in this case, the input):</p>
+ </div>
+ <div class="example">
+
+<div class="field has-addons">
+ <p class="control">
+ <span class="select">
+ <select>
+ <option>$</option>
+ <option>£</option>
+ <option>€</option>
+ </select>
+ </span>
+ </p>
+ <p class="control">
+ <input class="input" type="text" placeholder="Amount of money">
+ </p>
+ <p class="control">
+ <a class="button">
+ Transfer
+ </a>
+ </p>
+</div>
+
+<div class="field has-addons">
+ <p class="control">
+ <span class="select">
+ <select>
+ <option>$</option>
+ <option>£</option>
+ <option>€</option>
+ </select>
+ </span>
+ </p>
+ <p class="control is-expanded">
+ <input class="input" type="text" placeholder="Amount of money">
+ </p>
+ <p class="control">
+ <a class="button">
+ Transfer
+ </a>
+ </p>
+</div>
+
+ </div>
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"field has-addons"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"select"</span><span class="nt">></span>
+ <span class="nt"><select></span>
+ <span class="nt"><option></span>$<span class="nt"></option></span>
+ <span class="nt"><option></span>£<span class="nt"></option></span>
+ <span class="nt"><option></span>€<span class="nt"></option></span>
+ <span class="nt"></select></span>
+ <span class="nt"></span></span>
+ <span class="nt"></p></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><input</span> <span class="na">class=</span><span class="s">"input"</span> <span class="na">type=</span><span class="s">"text"</span> <span class="na">placeholder=</span><span class="s">"Amount of money"</span><span class="nt">></span>
+ <span class="nt"></p></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"button"</span><span class="nt">></span>
+ Transfer
+ <span class="nt"></a></span>
+ <span class="nt"></p></span>
+<span class="nt"></div></span>
+
+<span class="nt"><div</span> <span class="na">class=</span><span class="s">"field has-addons"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"select"</span><span class="nt">></span>
+ <span class="nt"><select></span>
+ <span class="nt"><option></span>$<span class="nt"></option></span>
+ <span class="nt"><option></span>£<span class="nt"></option></span>
+ <span class="nt"><option></span>€<span class="nt"></option></span>
+ <span class="nt"></select></span>
+ <span class="nt"></span></span>
+ <span class="nt"></p></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"control is-expanded"</span><span class="nt">></span>
+ <span class="nt"><input</span> <span class="na">class=</span><span class="s">"input"</span> <span class="na">type=</span><span class="s">"text"</span> <span class="na">placeholder=</span><span class="s">"Amount of money"</span><span class="nt">></span>
+ <span class="nt"></p></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"button"</span><span class="nt">></span>
+ Transfer
+ <span class="nt"></a></span>
+ <span class="nt"></p></span>
+<span class="nt"></div></span></code></pre></figure>
+
+ <div class="content">
+ <p>If you want a full width select dropdown, pair <code>control is-expanded</code> with <code>select is-fullwidth</code>.</p>
+ </div>
+ <div class="example">
+
+<div class="field has-addons">
+ <div class="control is-expanded">
+ <div class="select is-fullwidth">
+ <select name="country">
+ <option value="Argentina">Argentina</option>
+ <option value="Bolivia">Bolivia</option>
+ <option value="Brazil">Brazil</option>
+ <option value="Chile">Chile</option>
+ <option value="Colombia">Colombia</option>
+ <option value="Ecuador">Ecuador</option>
+ <option value="Guyana">Guyana</option>
+ <option value="Paraguay">Paraguay</option>
+ <option value="Peru">Peru</option>
+ <option value="Suriname">Suriname</option>
+ <option value="Uruguay">Uruguay</option>
+ <option value="Venezuela">Venezuela</option>
+ </select>
+ </div>
+ </div>
+ <div class="control">
+ <button type="submit" class="button is-primary">Choose</button>
+ </div>
+</div>
+
+ </div>
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"field has-addons"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"control is-expanded"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"select is-fullwidth"</span><span class="nt">></span>
+ <span class="nt"><select</span> <span class="na">name=</span><span class="s">"country"</span><span class="nt">></span>
+ <span class="nt"><option</span> <span class="na">value=</span><span class="s">"Argentina"</span><span class="nt">></span>Argentina<span class="nt"></option></span>
+ <span class="nt"><option</span> <span class="na">value=</span><span class="s">"Bolivia"</span><span class="nt">></span>Bolivia<span class="nt"></option></span>
+ <span class="nt"><option</span> <span class="na">value=</span><span class="s">"Brazil"</span><span class="nt">></span>Brazil<span class="nt"></option></span>
+ <span class="nt"><option</span> <span class="na">value=</span><span class="s">"Chile"</span><span class="nt">></span>Chile<span class="nt"></option></span>
+ <span class="nt"><option</span> <span class="na">value=</span><span class="s">"Colombia"</span><span class="nt">></span>Colombia<span class="nt"></option></span>
+ <span class="nt"><option</span> <span class="na">value=</span><span class="s">"Ecuador"</span><span class="nt">></span>Ecuador<span class="nt"></option></span>
+ <span class="nt"><option</span> <span class="na">value=</span><span class="s">"Guyana"</span><span class="nt">></span>Guyana<span class="nt"></option></span>
+ <span class="nt"><option</span> <span class="na">value=</span><span class="s">"Paraguay"</span><span class="nt">></span>Paraguay<span class="nt"></option></span>
+ <span class="nt"><option</span> <span class="na">value=</span><span class="s">"Peru"</span><span class="nt">></span>Peru<span class="nt"></option></span>
+ <span class="nt"><option</span> <span class="na">value=</span><span class="s">"Suriname"</span><span class="nt">></span>Suriname<span class="nt"></option></span>
+ <span class="nt"><option</span> <span class="na">value=</span><span class="s">"Uruguay"</span><span class="nt">></span>Uruguay<span class="nt"></option></span>
+ <span class="nt"><option</span> <span class="na">value=</span><span class="s">"Venezuela"</span><span class="nt">></span>Venezuela<span class="nt"></option></span>
+ <span class="nt"></select></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><button</span> <span class="na">type=</span><span class="s">"submit"</span> <span class="na">class=</span><span class="s">"button is-primary"</span><span class="nt">></span>Choose<span class="nt"></button></span>
+ <span class="nt"></div></span>
+<span class="nt"></div></span></code></pre></figure>
+
+ <div class="content">
+ <p>Use the <code>has-addons-centered</code> or the <code>has-addons-right</code> modifers to alter the <strong>alignment</strong>.</p>
+ </div>
+ <div class="example">
+
+<div class="field has-addons has-addons-centered">
+ <p class="control">
+ <span class="select">
+ <select>
+ <option>$</option>
+ <option>£</option>
+ <option>€</option>
+ </select>
+ </span>
+ </p>
+ <p class="control">
+ <input class="input" type="text" placeholder="Amount of money">
+ </p>
+ <p class="control">
+ <a class="button is-primary">
+ Transfer
+ </a>
+ </p>
+</div>
+
+ </div>
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"field has-addons has-addons-centered"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"select"</span><span class="nt">></span>
+ <span class="nt"><select></span>
+ <span class="nt"><option></span>$<span class="nt"></option></span>
+ <span class="nt"><option></span>£<span class="nt"></option></span>
+ <span class="nt"><option></span>€<span class="nt"></option></span>
+ <span class="nt"></select></span>
+ <span class="nt"></span></span>
+ <span class="nt"></p></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><input</span> <span class="na">class=</span><span class="s">"input"</span> <span class="na">type=</span><span class="s">"text"</span> <span class="na">placeholder=</span><span class="s">"Amount of money"</span><span class="nt">></span>
+ <span class="nt"></p></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"button is-primary"</span><span class="nt">></span>
+ Transfer
+ <span class="nt"></a></span>
+ <span class="nt"></p></span>
+<span class="nt"></div></span></code></pre></figure>
+ <div class="example">
+
+<div class="field has-addons has-addons-right">
+ <p class="control">
+ <span class="select">
+ <select>
+ <option>$</option>
+ <option>£</option>
+ <option>€</option>
+ </select>
+ </span>
+ </p>
+ <p class="control">
+ <input class="input" type="text" placeholder="Amount of money">
+ </p>
+ <p class="control">
+ <a class="button is-primary">
+ Transfer
+ </a>
+ </p>
+</div>
+
+ </div>
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"field has-addons has-addons-right"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"select"</span><span class="nt">></span>
+ <span class="nt"><select></span>
+ <span class="nt"><option></span>$<span class="nt"></option></span>
+ <span class="nt"><option></span>£<span class="nt"></option></span>
+ <span class="nt"><option></span>€<span class="nt"></option></span>
+ <span class="nt"></select></span>
+ <span class="nt"></span></span>
+ <span class="nt"></p></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><input</span> <span class="na">class=</span><span class="s">"input"</span> <span class="na">type=</span><span class="s">"text"</span> <span class="na">placeholder=</span><span class="s">"Amount of money"</span><span class="nt">></span>
+ <span class="nt"></p></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"button is-primary"</span><span class="nt">></span>
+ Transfer
+ <span class="nt"></a></span>
+ <span class="nt"></p></span>
+<span class="nt"></div></span></code></pre></figure>
+
+ <hr>
+
+ <h3 class="title">Form group</h3>
+ <div class="content">
+ <p>
+ If you want to <strong>group</strong> controls together, use the <code>is-grouped</code> modifier on the <code>field</code> container.
+ </p>
+ </div>
+
+ <div class="example">
+
+<div class="field is-grouped">
+ <p class="control">
+ <a class="button is-primary">
+ Submit
+ </a>
+ </p>
+ <p class="control">
+ <a class="button is-light">
+ Cancel
+ </a>
+ </p>
+</div>
+
+ </div>
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"field is-grouped"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"button is-primary"</span><span class="nt">></span>
+ Submit
+ <span class="nt"></a></span>
+ <span class="nt"></p></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"button is-light"</span><span class="nt">></span>
+ Cancel
+ <span class="nt"></a></span>
+ <span class="nt"></p></span>
+<span class="nt"></div></span></code></pre></figure>
+
+ <div class="content">
+ Use the <code>is-grouped-centered</code> or the <code>is-grouped-right</code> modifers to alter the <strong>alignment</strong>.
+ </p>
+ </div>
+
+ <div class="example">
+
+<div class="field is-grouped is-grouped-centered">
+ <p class="control">
+ <a class="button is-primary">
+ Submit
+ </a>
+ </p>
+ <p class="control">
+ <a class="button is-light">
+ Cancel
+ </a>
+ </p>
+</div>
+
+ </div>
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"field is-grouped is-grouped-centered"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"button is-primary"</span><span class="nt">></span>
+ Submit
+ <span class="nt"></a></span>
+ <span class="nt"></p></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"button is-light"</span><span class="nt">></span>
+ Cancel
+ <span class="nt"></a></span>
+ <span class="nt"></p></span>
+<span class="nt"></div></span></code></pre></figure>
+
+ <div class="example">
+
+<div class="field is-grouped is-grouped-right">
+ <p class="control">
+ <a class="button is-primary">
+ Submit
+ </a>
+ </p>
+ <p class="control">
+ <a class="button is-light">
+ Cancel
+ </a>
+ </p>
+</div>
+
+ </div>
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"field is-grouped is-grouped-right"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"button is-primary"</span><span class="nt">></span>
+ Submit
+ <span class="nt"></a></span>
+ <span class="nt"></p></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"button is-light"</span><span class="nt">></span>
+ Cancel
+ <span class="nt"></a></span>
+ <span class="nt"></p></span>
+<span class="nt"></div></span></code></pre></figure>
+
+ <div class="content">
+ <p>
+ Add the <code>is-expanded</code> modifier on the control element you want to <strong>fill up the remaining space</strong> with.
+ </p>
+ </div>
+
+ <div class="example">
+
+<div class="field is-grouped">
+ <p class="control is-expanded">
+ <input class="input" type="text" placeholder="Find a repository">
+ </p>
+ <p class="control">
+ <a class="button is-info">
+ Search
+ </a>
+ </p>
+</div>
+
+ </div>
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"field is-grouped"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"control is-expanded"</span><span class="nt">></span>
+ <span class="nt"><input</span> <span class="na">class=</span><span class="s">"input"</span> <span class="na">type=</span><span class="s">"text"</span> <span class="na">placeholder=</span><span class="s">"Find a repository"</span><span class="nt">></span>
+ <span class="nt"></p></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"button is-info"</span><span class="nt">></span>
+ Search
+ <span class="nt"></a></span>
+ <span class="nt"></p></span>
+<span class="nt"></div></span></code></pre></figure>
+
+ <div id="form-group-multiline" class="content">
+ <p>
+ <span class="tag is-success">New!</span>
+ <span class="tag is-info">0.4.4</span>
+ </p>
+ <p>
+ Add the <code>is-grouped-multiline</code> modifier to allow controls to fill up <strong>multiple lines</strong>. This is ideal for a long list of controls.
+ </p>
+ </div>
+
+ <div class="columns">
+ <div class="column is-half">
+ <div class="example">
+
+<div class="field is-grouped is-grouped-multiline">
+ <p class="control">
+ <a class="button">
+ One
+ </a>
+ </p>
+ <p class="control">
+ <a class="button">
+ Two
+ </a>
+ </p>
+ <p class="control">
+ <a class="button">
+ Three
+ </a>
+ </p>
+ <p class="control">
+ <a class="button">
+ Four
+ </a>
+ </p>
+ <p class="control">
+ <a class="button">
+ Five
+ </a>
+ </p>
+ <p class="control">
+ <a class="button">
+ Size
+ </a>
+ </p>
+ <p class="control">
+ <a class="button">
+ Seven
+ </a>
+ </p>
+ <p class="control">
+ <a class="button">
+ Eight
+ </a>
+ </p>
+ <p class="control">
+ <a class="button">
+ Nine
+ </a>
+ </p>
+ <p class="control">
+ <a class="button">
+ Ten
+ </a>
+ </p>
+ <p class="control">
+ <a class="button">
+ Eleven
+ </a>
+ </p>
+ <p class="control">
+ <a class="button">
+ Twelve
+ </a>
+ </p>
+ <p class="control">
+ <a class="button">
+ Thirteen
+ </a>
+ </p>
+</div>
+
+ </div>
+ </div>
+ <div class="column is-half">
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"field is-grouped is-grouped-multiline"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"button"</span><span class="nt">></span>
+ One
+ <span class="nt"></a></span>
+ <span class="nt"></p></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"button"</span><span class="nt">></span>
+ Two
+ <span class="nt"></a></span>
+ <span class="nt"></p></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"button"</span><span class="nt">></span>
+ Three
+ <span class="nt"></a></span>
+ <span class="nt"></p></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"button"</span><span class="nt">></span>
+ Four
+ <span class="nt"></a></span>
+ <span class="nt"></p></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"button"</span><span class="nt">></span>
+ Five
+ <span class="nt"></a></span>
+ <span class="nt"></p></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"button"</span><span class="nt">></span>
+ Size
+ <span class="nt"></a></span>
+ <span class="nt"></p></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"button"</span><span class="nt">></span>
+ Seven
+ <span class="nt"></a></span>
+ <span class="nt"></p></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"button"</span><span class="nt">></span>
+ Eight
+ <span class="nt"></a></span>
+ <span class="nt"></p></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"button"</span><span class="nt">></span>
+ Nine
+ <span class="nt"></a></span>
+ <span class="nt"></p></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"button"</span><span class="nt">></span>
+ Ten
+ <span class="nt"></a></span>
+ <span class="nt"></p></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"button"</span><span class="nt">></span>
+ Eleven
+ <span class="nt"></a></span>
+ <span class="nt"></p></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"button"</span><span class="nt">></span>
+ Twelve
+ <span class="nt"></a></span>
+ <span class="nt"></p></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"button"</span><span class="nt">></span>
+ Thirteen
+ <span class="nt"></a></span>
+ <span class="nt"></p></span>
+<span class="nt"></div></span></code></pre></figure>
+ </div>
+ </div>
+
+ <hr>
+
+ <h3 class="title">Horizontal form</h3>
+ <div class="content">
+ <p>If you want a <strong>horizontal</strong> form control, use the <code>is-horizontal</code> modifier on the <code>field</code> container, in which you include:</p>
+ <ul>
+ <li>
+ <code>field-label</code> for the side label
+ </li>
+ <li>
+ <code>field-body</code> for the input/select/textarea container
+ </li>
+ </ul>
+ <p>You can use <code>is-grouped</code> or <code>has-addons</code> for the child elements.</p>
+ </div>
+ <div class="example">
+
+<div class="field is-horizontal">
+ <div class="field-label is-normal">
+ <label class="label">From</label>
+ </div>
+ <div class="field-body">
+ <div class="field">
+ <p class="control is-expanded has-icons-left">
+ <input class="input" type="text" placeholder="Name">
+ <span class="icon is-small is-left">
+ <i class="fa fa-user"></i>
+ </span>
+ </p>
+ </div>
+ <div class="field">
+ <p class="control is-expanded has-icons-left has-icons-right">
+ <input class="input is-success" type="email" placeholder="Email" value="alex@smith.com">
+ <span class="icon is-small is-left">
+ <i class="fa fa-envelope"></i>
+ </span>
+ <span class="icon is-small is-right">
+ <i class="fa fa-check"></i>
+ </span>
+ </p>
+ </div>
+ </div>
+</div>
+
+<div class="field is-horizontal">
+ <div class="field-label"></div>
+ <div class="field-body">
+ <div class="field is-expanded">
+ <div class="field has-addons">
+ <p class="control">
+ <a class="button is-static">
+ +44
+ </a>
+ </p>
+ <p class="control is-expanded">
+ <input class="input" type="tel" placeholder="Your phone number">
+ </p>
+ </div>
+ <p class="help">Do not enter the first zero</p>
+ </div>
+ </div>
+</div>
+
+<div class="field is-horizontal">
+ <div class="field-label is-normal">
+ <label class="label">Department</label>
+ </div>
+ <div class="field-body">
+ <div class="field is-narrow">
+ <div class="control">
+ <div class="select is-fullwidth">
+ <select>
+ <option>Business development</option>
+ <option>Marketing</option>
+ <option>Sales</option>
+ </select>
+ </div>
+ </div>
+ </div>
+ </div>
+</div>
+
+<div class="field is-horizontal">
+ <div class="field-label">
+ <label class="label">Already a member?</label>
+ </div>
+ <div class="field-body">
+ <div class="field is-narrow">
+ <div class="control">
+ <label class="radio">
+ <input type="radio" name="member">
+ Yes
+ </label>
+ <label class="radio">
+ <input type="radio" name="member">
+ No
+ </label>
+ </div>
+ </div>
+ </div>
+</div>
+
+<div class="field is-horizontal">
+ <div class="field-label is-normal">
+ <label class="label">Subject</label>
+ </div>
+ <div class="field-body">
+ <div class="field">
+ <div class="control">
+ <input class="input is-danger" type="text" placeholder="e.g. Partnership opportunity">
+ </div>
+ <p class="help is-danger">
+ This field is required
+ </p>
+ </div>
+ </div>
+</div>
+
+<div class="field is-horizontal">
+ <div class="field-label is-normal">
+ <label class="label">Question</label>
+ </div>
+ <div class="field-body">
+ <div class="field">
+ <div class="control">
+ <textarea class="textarea" placeholder="Explain how we can help you"></textarea>
+ </div>
+ </div>
+ </div>
+</div>
+
+<div class="field is-horizontal">
+ <div class="field-label">
+ <!-- Left empty for spacing -->
+ </div>
+ <div class="field-body">
+ <div class="field">
+ <div class="control">
+ <button class="button is-primary">
+ Send message
+ </button>
+ </div>
+ </div>
+ </div>
+</div>
+
+ </div>
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"field is-horizontal"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"field-label is-normal"</span><span class="nt">></span>
+ <span class="nt"><label</span> <span class="na">class=</span><span class="s">"label"</span><span class="nt">></span>From<span class="nt"></label></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"field-body"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"control is-expanded has-icons-left"</span><span class="nt">></span>
+ <span class="nt"><input</span> <span class="na">class=</span><span class="s">"input"</span> <span class="na">type=</span><span class="s">"text"</span> <span class="na">placeholder=</span><span class="s">"Name"</span><span class="nt">></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon is-small is-left"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-user"</span><span class="nt">></i></span>
+ <span class="nt"></span></span>
+ <span class="nt"></p></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"control is-expanded has-icons-left has-icons-right"</span><span class="nt">></span>
+ <span class="nt"><input</span> <span class="na">class=</span><span class="s">"input is-success"</span> <span class="na">type=</span><span class="s">"email"</span> <span class="na">placeholder=</span><span class="s">"Email"</span> <span class="na">value=</span><span class="s">"alex@smith.com"</span><span class="nt">></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon is-small is-left"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-envelope"</span><span class="nt">></i></span>
+ <span class="nt"></span></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon is-small is-right"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-check"</span><span class="nt">></i></span>
+ <span class="nt"></span></span>
+ <span class="nt"></p></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+<span class="nt"></div></span>
+
+<span class="nt"><div</span> <span class="na">class=</span><span class="s">"field is-horizontal"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"field-label"</span><span class="nt">></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"field-body"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"field is-expanded"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"field has-addons"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"button is-static"</span><span class="nt">></span>
+ +44
+ <span class="nt"></a></span>
+ <span class="nt"></p></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"control is-expanded"</span><span class="nt">></span>
+ <span class="nt"><input</span> <span class="na">class=</span><span class="s">"input"</span> <span class="na">type=</span><span class="s">"tel"</span> <span class="na">placeholder=</span><span class="s">"Your phone number"</span><span class="nt">></span>
+ <span class="nt"></p></span>
+ <span class="nt"></div></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"help"</span><span class="nt">></span>Do not enter the first zero<span class="nt"></p></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+<span class="nt"></div></span>
+
+<span class="nt"><div</span> <span class="na">class=</span><span class="s">"field is-horizontal"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"field-label is-normal"</span><span class="nt">></span>
+ <span class="nt"><label</span> <span class="na">class=</span><span class="s">"label"</span><span class="nt">></span>Department<span class="nt"></label></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"field-body"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"field is-narrow"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"select is-fullwidth"</span><span class="nt">></span>
+ <span class="nt"><select></span>
+ <span class="nt"><option></span>Business development<span class="nt"></option></span>
+ <span class="nt"><option></span>Marketing<span class="nt"></option></span>
+ <span class="nt"><option></span>Sales<span class="nt"></option></span>
+ <span class="nt"></select></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+<span class="nt"></div></span>
+
+<span class="nt"><div</span> <span class="na">class=</span><span class="s">"field is-horizontal"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"field-label"</span><span class="nt">></span>
+ <span class="nt"><label</span> <span class="na">class=</span><span class="s">"label"</span><span class="nt">></span>Already a member?<span class="nt"></label></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"field-body"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"field is-narrow"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><label</span> <span class="na">class=</span><span class="s">"radio"</span><span class="nt">></span>
+ <span class="nt"><input</span> <span class="na">type=</span><span class="s">"radio"</span> <span class="na">name=</span><span class="s">"member"</span><span class="nt">></span>
+ Yes
+ <span class="nt"></label></span>
+ <span class="nt"><label</span> <span class="na">class=</span><span class="s">"radio"</span><span class="nt">></span>
+ <span class="nt"><input</span> <span class="na">type=</span><span class="s">"radio"</span> <span class="na">name=</span><span class="s">"member"</span><span class="nt">></span>
+ No
+ <span class="nt"></label></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+<span class="nt"></div></span>
+
+<span class="nt"><div</span> <span class="na">class=</span><span class="s">"field is-horizontal"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"field-label is-normal"</span><span class="nt">></span>
+ <span class="nt"><label</span> <span class="na">class=</span><span class="s">"label"</span><span class="nt">></span>Subject<span class="nt"></label></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"field-body"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><input</span> <span class="na">class=</span><span class="s">"input is-danger"</span> <span class="na">type=</span><span class="s">"text"</span> <span class="na">placeholder=</span><span class="s">"e.g. Partnership opportunity"</span><span class="nt">></span>
+ <span class="nt"></div></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"help is-danger"</span><span class="nt">></span>
+ This field is required
+ <span class="nt"></p></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+<span class="nt"></div></span>
+
+<span class="nt"><div</span> <span class="na">class=</span><span class="s">"field is-horizontal"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"field-label is-normal"</span><span class="nt">></span>
+ <span class="nt"><label</span> <span class="na">class=</span><span class="s">"label"</span><span class="nt">></span>Question<span class="nt"></label></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"field-body"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><textarea</span> <span class="na">class=</span><span class="s">"textarea"</span> <span class="na">placeholder=</span><span class="s">"Explain how we can help you"</span><span class="nt">></textarea></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+<span class="nt"></div></span>
+
+<span class="nt"><div</span> <span class="na">class=</span><span class="s">"field is-horizontal"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"field-label"</span><span class="nt">></span>
+ <span class="c"><!-- Left empty for spacing --></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"field-body"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><button</span> <span class="na">class=</span><span class="s">"button is-primary"</span><span class="nt">></span>
+ Send message
+ <span class="nt"></button></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+<span class="nt"></div></span></code></pre></figure>
+
+ <div class="content">
+ <p>
+ To preserve the <strong>vertical alignment</strong> of labels with each type and size of control, the <code>.field-label</code> comes with <strong>4 size modifiers</strong>:
+ </p>
+ <ul>
+ <li>
+ <code>.is-small</code>
+ </li>
+ <li>
+ <code>.is-normal</code> for any <code>.input</code> or <code>.button</code>
+ </li>
+ <li>
+ <code>.is-medium</code>
+ </li>
+ <li>
+ <code>.is-large</code>
+ </li>
+ </ul>
+ </div>
+ <div class="example">
+
+<div class="field is-horizontal">
+ <div class="field-label">
+ <label class="label">No padding</label>
+ </div>
+ <div class="field-body">
+ <div class="field">
+ <div class="control">
+ <label class="checkbox">
+ <input type="checkbox">
+ Checkbox
+ </label>
+ </div>
+ </div>
+ </div>
+</div>
+
+<div class="field is-horizontal">
+ <div class="field-label is-small">
+ <label class="label">Small padding</label>
+ </div>
+ <div class="field-body">
+ <div class="field">
+ <div class="control">
+ <input class="input is-small" type="text" placeholder="Small sized input">
+ </div>
+ </div>
+ </div>
+</div>
+
+<div class="field is-horizontal">
+ <div class="field-label is-normal">
+ <label class="label">Normal label</label>
+ </div>
+ <div class="field-body">
+ <div class="field">
+ <div class="control">
+ <input class="input" type="text" placeholder="Normal sized input">
+ </div>
+ </div>
+ </div>
+</div>
+
+<div class="field is-horizontal">
+ <div class="field-label is-medium">
+ <label class="label">Medium label</label>
+ </div>
+ <div class="field-body">
+ <div class="field">
+ <div class="control">
+ <input class="input is-medium" type="text" placeholder="Medium sized input">
+ </div>
+ </div>
+ </div>
+</div>
+
+<div class="field is-horizontal">
+ <div class="field-label is-large">
+ <label class="label">Large label</label>
+ </div>
+ <div class="field-body">
+ <div class="field">
+ <div class="control">
+ <input class="input is-large" type="text" placeholder="Large sized input">
+ </div>
+ </div>
+ </div>
+</div>
+
+ </div>
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"field is-horizontal"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"field-label"</span><span class="nt">></span>
+ <span class="nt"><label</span> <span class="na">class=</span><span class="s">"label"</span><span class="nt">></span>No padding<span class="nt"></label></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"field-body"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><label</span> <span class="na">class=</span><span class="s">"checkbox"</span><span class="nt">></span>
+ <span class="nt"><input</span> <span class="na">type=</span><span class="s">"checkbox"</span><span class="nt">></span>
+ Checkbox
+ <span class="nt"></label></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+<span class="nt"></div></span>
+
+<span class="nt"><div</span> <span class="na">class=</span><span class="s">"field is-horizontal"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"field-label is-small"</span><span class="nt">></span>
+ <span class="nt"><label</span> <span class="na">class=</span><span class="s">"label"</span><span class="nt">></span>Small padding<span class="nt"></label></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"field-body"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><input</span> <span class="na">class=</span><span class="s">"input is-small"</span> <span class="na">type=</span><span class="s">"text"</span> <span class="na">placeholder=</span><span class="s">"Small sized input"</span><span class="nt">></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+<span class="nt"></div></span>
+
+<span class="nt"><div</span> <span class="na">class=</span><span class="s">"field is-horizontal"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"field-label is-normal"</span><span class="nt">></span>
+ <span class="nt"><label</span> <span class="na">class=</span><span class="s">"label"</span><span class="nt">></span>Normal label<span class="nt"></label></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"field-body"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><input</span> <span class="na">class=</span><span class="s">"input"</span> <span class="na">type=</span><span class="s">"text"</span> <span class="na">placeholder=</span><span class="s">"Normal sized input"</span><span class="nt">></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+<span class="nt"></div></span>
+
+<span class="nt"><div</span> <span class="na">class=</span><span class="s">"field is-horizontal"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"field-label is-medium"</span><span class="nt">></span>
+ <span class="nt"><label</span> <span class="na">class=</span><span class="s">"label"</span><span class="nt">></span>Medium label<span class="nt"></label></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"field-body"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><input</span> <span class="na">class=</span><span class="s">"input is-medium"</span> <span class="na">type=</span><span class="s">"text"</span> <span class="na">placeholder=</span><span class="s">"Medium sized input"</span><span class="nt">></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+<span class="nt"></div></span>
+
+<span class="nt"><div</span> <span class="na">class=</span><span class="s">"field is-horizontal"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"field-label is-large"</span><span class="nt">></span>
+ <span class="nt"><label</span> <span class="na">class=</span><span class="s">"label"</span><span class="nt">></span>Large label<span class="nt"></label></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"field-body"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><input</span> <span class="na">class=</span><span class="s">"input is-large"</span> <span class="na">type=</span><span class="s">"text"</span> <span class="na">placeholder=</span><span class="s">"Large sized input"</span><span class="nt">></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+<span class="nt"></div></span></code></pre></figure>
+ </div>
+</section>
+
+
+<section class="section">
+ <div class="container">
+ <p class="has-text-grey-light">
+ This page is <strong class="has-text-grey">open source</strong>.
+ Noticed a typo?
+ Or something unclear?
+ <a class="has-text-grey" href="https://github.com/jgthms/bulma/blob/master/docs/documentation/form/general.html" style="border-bottom: 1px solid currentColor;">
+ Improve this page on GitHub
+ </a>
+ </p>
+ </div>
+</section>
+
+
+
+<script src="//m.servedby-buysellads.com/monetization.js" type="text/javascript"></script>
+
+<section class="hero is-info bsa">
+ <div class="container">
+ <div class="columns is-vcentered">
+ <div class="column is-4">
+ <p class="title">Bulma <strong>Partners</strong></p>
+ <p class="subtitle">Check out their products!</p>
+ </div>
+
+ <div class="column is-8">
+ <div class="bsa-cpc"></div>
+ </div>
+ </div>
+ </div>
+</section>
+
+<script>
+ (function(){
+ if(typeof _bsa !== 'undefined' && _bsa) {
+ _bsa.init('default', 'CVAIKK3E', 'placement:bulmaio', {
+ target: '.bsa-cpc',
+ align: 'horizontal',
+ disable_css: 'true'
+ });
+ }
+ })();
+</script>
+
+
+<section id="newsletter" class="hero is-primary">
+ <div class="hero-body">
+ <div class="container">
+ <!-- Begin MailChimp Signup Form -->
+ <div id="mc_embed_signup" class="columns is-vcentered">
+ <div class="column is-one-third is-left">
+ <p class="title">Bulma <strong>Newsletter</strong></p>
+ <p class="subtitle">Get notified when v1 is ready!</p>
+ </div>
+
+ <div class="column">
+ <form action="https://bbxdesign.us3.list-manage.com/subscribe/post?u=b43b93fe633f0560b2a72a69c&id=52585e8803" method="post" id="mc-embedded-subscribe-form" name="mc-embedded-subscribe-form" class="validate" target="_blank" novalidate>
+ <div id="mc_embed_signup_scroll">
+ <div class="field is-grouped">
+ <div class="control has-icons-left is-expanded">
+ <input type="email" value="" name="EMAIL" class="input is-flat required email" id="mce-EMAIL" placeholder="email address" required>
+ <span class="icon is-small is-left">
+ <i class="fa fa-envelope"></i>
+ </span>
+ </div>
+ <div class="control">
+ <input type="submit" value="Subscribe" name="subscribe" id="mc-embedded-subscribe" class="button is-white is-outlined">
+ </div>
+ </div>
+ <div id="mce-responses">
+ <div class="notification is-danger response" id="mce-error-response" style="display:none"></div>
+ <div class="notification is-success response" id="mce-success-response" style="display:none"></div>
+ </div>
+ <!-- real people should not fill this in and expect good things - do not remove this or risk form bot signups-->
+ <div style="position: absolute; left: -5000px;" aria-hidden="true">
+ <input type="text" name="b_b43b93fe633f0560b2a72a69c_52585e8803" tabindex="-1" value="">
+ </div>
+ </div>
+ </form>
+ </div>
+ </div>
+ <!--End mc_embed_signup-->
+ </div>
+ </div>
+</section>
+
+<footer class="footer">
+ <div class="container">
+ <div class="columns">
+ <div class="column is-3">
+ <div id="about" class="content">
+ <strong xmlns:dct="http://purl.org/dc/terms/" href="http://purl.org/dc/dcmitype/Text" property="dct:title" rel="dct:type">Bulma</strong> by <a xmlns:cc="http://creativecommons.org/ns#" href="http://jgthms.com" property="cc:attributionName" rel="cc:attributionURL">Jeremy Thomas</a>.
+
+ <div class="twitter-container">
+ <a href="https://twitter.com/jgthms" class="twitter-follow-button" data-show-count="true" data-lang="en" data-size="large">@jgthms</a>
+ </div>
+
+ </div>
+ </div>
+ <div class="column is-5">
+ <div id="share" class="content">
+ <div>
+ <strong>Support</strong> and share the love!
+ </div>
+
+ <div id="social">
+ <iframe class="github-btn" src="https://ghbtns.com/github-btn.html?user=jgthms&repo=bulma&type=star&count=true&size=large" allowtransparency="true" frameborder="0" scrolling="0" width="160px" height="30px"></iframe>
+
+ <a href="https://twitter.com/share" class="twitter-share-button" data-text="Bulma v0.5.0: a modern CSS framework based on Flexbox" data-url="http://bulma.io/versions/0.5.0" data-count="horizontal" data-via="jgthms" data-related="jgthms:Creator of Bulma" data-size="large">Tweet</a>
+
+ <form class="paypal-form" action="https://www.paypal.com/cgi-bin/webscr" method="post" target="_top">
+ <input type="hidden" name="cmd" value="_s-xclick">
+ <input type="hidden" name="hosted_button_id" value="8WMKYSRFN6A78">
+ <input type="image" src="http://bulma.io/versions/0.5.0/images/paypal-donate.png" border="0" name="submit" alt="PayPal – The safer, easier way to pay online." height="30">
+ <img alt="" border="0" src="https://www.paypalobjects.com/en_GB/i/scr/pixel.gif" width="1" height="1">
+ </form>
+
+ <div class="fb-like" data-href="https://www.facebook.com/bulmaio" data-layout="button" data-action="like" data-size="large" data-show-faces="false" data-share="true"></div>
+ </div>
+
+ </div>
+ </div>
+ <div class="column is-4">
+ <div id="sister">
+ <p>
+ More <strong>helpful</strong> tools:
+ </p>
+ <ul>
+ <li>
+ <a href="http://cssreference.io">
+ <img src="http://bulma.io/versions/0.5.0/images/css-reference-logo.png" alt="CSS Reference logo">
+ </a>
+ </li>
+ <li>
+ <a href="http://htmlreference.io">
+ <img src="http://bulma.io/versions/0.5.0/images/html-reference-logo.png" alt="HTML Reference logo">
+ </a>
+ </li>
+ </ul>
+ </div>
+ </div>
+ </div>
+
+ <p id="tsp">
+ <small>
+ Source code licensed <a href="http://opensource.org/licenses/mit-license.php">MIT</a>.
+ <br>
+ Website content licensed <a rel="license" href="http://creativecommons.org/licenses/by-nc-sa/4.0/">CC BY-NC-SA 4.0</a>.
+ </small>
+ </p>
+ </div>
+</footer>
+
+<script src="http://bulma.io/versions/0.5.0/vendor/clipboard-1.7.1.min.js"></script>
+<script src="http://bulma.io/versions/0.5.0/lib/main.js"></script>
+
+
+
+<div id="fb-root"></div>
+
+<script async defer type="text/javascript">(function(d, s, id) {
+ var js, fjs = d.getElementsByTagName(s)[0];
+ if (d.getElementById(id)) return;
+ js = d.createElement(s); js.id = id;
+ js.async = true;
+ js.defer = true;
+ js.src = "//connect.facebook.net/en_US/sdk.js#xfbml=1&version=v2.8&appId=310296819307942";
+ fjs.parentNode.insertBefore(js, fjs);
+}(document, 'script', 'facebook-jssdk'));</script>
+
+<script async defer id="twitter-wjs" src="https://platform.twitter.com/widgets.js"></script>
+<script async defer type="text/javascript" src="https://s3.amazonaws.com/downloads.mailchimp.com/js/mc-validate.js"></script>
+
+<script async defer type="text/javascript">
+ (function() {
+ window.fnames = new Array();
+ window.ftypes = new Array();
+ fnames[0]='EMAIL';
+ ftypes[0]='email';
+ }());
+ // var $mcj = window.jQuery.noConflict(true);
+</script>
+
+<script async defer type="text/javascript">
+ (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
+ (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
+ m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
+ })(window,document,'script','https://www.google-analytics.com/analytics.js','ga');
+
+ ga('create', 'UA-82634666-2', 'auto');
+ ga('send', 'pageview');
+</script>
+
+ </body>
+</html>
diff --git a/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/documentation/form/input/index.html b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/documentation/form/input/index.html
new file mode 100644
index 0000000000000000000000000000000000000000..0e5b2e4c9687698c6f013d2aab5564978b08d3a6
--- /dev/null
+++ b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/documentation/form/input/index.html
@@ -0,0 +1,1308 @@
+<!DOCTYPE html>
+<html lang="en" class="route-documentation">
+ <head>
+ <meta charset="utf-8">
+ <meta http-equiv="X-UA-Compatible" content="IE=edge">
+ <meta name="viewport" content="width=device-width, initial-scale=1">
+ <meta name="description" content="Bulma v0.5.0 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <title>Input | Bulma v0.5.0: a modern CSS framework based on Flexbox</title>
+
+ <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.6.3/css/font-awesome.min.css">
+ <link rel="stylesheet" href="http://bulma.io/versions/0.5.0/css/bulma-docs.css">
+
+ <link rel="canonical" href="http://bulma.io/versions/0.5.0/documentation/form/input/">
+ <link rel="alternate" type="application/rss+xml" title="Bulma v0.5.0: a modern CSS framework based on Flexbox" href="http://bulma.io/versions/0.5.0/feed.xml">
+
+ <meta property="og:url" content="http://bulma.io/versions/0.5.0">
+ <meta property="og:type" content="website">
+ <meta property="og:title" content="Bulma v0.5.0: a modern CSS framework based on Flexbox">
+ <meta property="og:image" content="http://bulma.io/versions/0.5.0/images/bulma-banner.png">
+ <meta property="og:image:type" content="image/png">
+ <meta property="og:image:width" content="1200">
+ <meta property="og:image:height" content="630">
+ <meta property="og:description" content="Bulma v0.5.0 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <meta name="twitter:card" content="summary_large_image">
+ <meta name="twitter:site" content="@jgthms">
+ <meta name="twitter:creator" content="@jgthms">
+ <meta name="twitter:title" content="Bulma v0.5.0: a modern CSS framework based on Flexbox">
+ <meta name="twitter:image" content="http://bulma.io/versions/0.5.0/images/bulma-banner.png">
+ <meta name="twitter:description" content="Bulma v0.5.0 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <link rel="apple-touch-icon" sizes="180x180" href="http://bulma.io/versions/0.5.0/favicons/apple-touch-icon.png?v=201701041855">
+ <link rel="icon" type="image/png" href="http://bulma.io/versions/0.5.0/favicons/favicon-32x32.png?v=201701041855" sizes="32x32">
+ <link rel="icon" type="image/png" href="http://bulma.io/versions/0.5.0/favicons/favicon-16x16.png?v=201701041855" sizes="16x16">
+ <link rel="manifest" href="http://bulma.io/versions/0.5.0/favicons/manifest.json?v=201701041855">
+ <link rel="mask-icon" href="http://bulma.io/versions/0.5.0/favicons/safari-pinned-tab.svg?v=201701041855" color="#00d1b2">
+ <link rel="shortcut icon" href="http://bulma.io/versions/0.5.0/favicons/favicon.ico?v=201701041855">
+ <meta name="msapplication-config" content="http://bulma.io/versions/0.5.0/favicons/browserconfig.xml?v=201701041855">
+ <meta name="theme-color" content="#00d1b2">
+</head>
+
+ <body class="layout-documentation page-form">
+
+ <div class="notification is-info" style="border-radius: 0; margin-bottom: 0;">
+ <p>
+ You are viewing the deprecated <strong>0.5.0</strong> version of the website.
+ <a href="/">Click here to view the latest version</a>
+ </p>
+ </div>
+
+
+ <div class="container">
+ <nav class="navbar ">
+ <div class="navbar-brand">
+ <a class="navbar-item" href="http://bulma.io/versions/0.5.0">
+ <img src="http://bulma.io/versions/0.5.0/images/bulma-logo.png" alt="Bulma v0.5.0: a modern CSS framework based on Flexbox" width="112" height="28">
+ </a>
+
+ <a class="navbar-item is-hidden-desktop" href="https://github.com/jgthms/bulma" target="_blank">
+ <span class="icon" style="color: #333;">
+ <i class="fa fa-github"></i>
+ </span>
+ </a>
+
+ <a class="navbar-item is-hidden-desktop" href="https://twitter.com/jgthms" target="_blank">
+ <span class="icon" style="color: #55acee;">
+ <i class="fa fa-twitter"></i>
+ </span>
+ </a>
+
+ <div class="navbar-burger burger" data-target="navMenuDocumentation">
+ <span></span>
+ <span></span>
+ <span></span>
+ </div>
+ </div>
+
+ <div id="navMenuDocumentation" class="navbar-menu">
+ <div class="navbar-start">
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/">
+ Home
+ </a>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <a class="navbar-link is-active" href="/versions/0.5.0/documentation/overview/start/">
+ Docs
+ </a>
+ <div class="navbar-dropdown ">
+ <a class="navbar-item " href="/versions/0.5.0/documentation/overview/start/">
+ Overview
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/modifiers/syntax/">
+ Modifiers
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/grid/columns/">
+ Grid
+ </a>
+ <a class="navbar-item is-active" href="http://bulma.io/versions/0.5.0/documentation/form/general/">
+ Form
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/elements/box/">
+ Elements
+ </a>
+
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/components/breadcrumb/">
+ Components
+ </a>
+
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/layout/container/">
+ Layout
+ </a>
+ <hr class="navbar-divider">
+ <div class="navbar-item">
+ <div>
+ <p class="is-size-6-desktop">
+ <strong class="has-text-info">0.5.0</strong>
+ </p>
+
+ <small>
+ <a class="view-all-versions" href="/versions">View all versions</a>
+ </small>
+
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <a class="navbar-link " href="http://bulma.io/versions/0.5.0/blog/">
+ Blog
+ </a>
+ <div id="blogDropdown" class="navbar-dropdown " data-style="width: 18rem;">
+
+ <a class="navbar-item" href="/2017/07/24/access-previous-bulma-versions/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">24 Jul 2017</small>
+ </p>
+ <p>Access previous Bulma versions</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="/2017/03/10/new-field-element/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">10 Mar 2017</small>
+ </p>
+ <p>New field element (for better controls)</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="/2016/04/11/metro-ui-css-grid-with-bulma-tiles/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">11 Apr 2016</small>
+ </p>
+ <p>Metro UI CSS grid with Bulma tiles</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="http://bulma.io/versions/0.5.0/blog/">
+ More posts
+ </a>
+ <hr class="navbar-divider">
+ <div class="navbar-item">
+ <div class="navbar-content">
+ <div class="level is-mobile">
+ <div class="level-left">
+ <div class="level-item">
+ <strong>Stay up to date!</strong>
+ </div>
+ </div>
+ <div class="level-right">
+ <div class="level-item">
+ <a class="button is-rss is-small" href="http://bulma.io/versions/0.5.0/atom.xml">
+ <span class="icon is-small">
+ <i class="fa fa-rss"></i>
+ </span>
+ <span>Subscribe</span>
+ </a>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <div class="navbar-link">
+ More
+ </div>
+ <div id="moreDropdown" class="navbar-dropdown ">
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/extensions/">
+ <div class="level is-mobile">
+ <div class="level-left">
+ <div class="level-item">
+ <p>
+ <strong>Extensions</strong>
+ <br>
+ <small>Side projects to enhance Bulma</small>
+ </p>
+ </div>
+ </div>
+ <div class="level-right">
+ <div class="level-item">
+ <span class="icon has-text-info">
+ <i class="fa fa-plug"></i>
+ </span>
+ </div>
+ </div>
+ </div>
+ </a>
+ </div>
+ </div>
+ </div>
+
+ <div class="navbar-end">
+ <a class="navbar-item" href="https://github.com/jgthms/bulma" target="_blank">
+ Github
+ </a>
+ <a class="navbar-item" href="https://twitter.com/jgthms" target="_blank">
+ Twitter
+ </a>
+ <div class="navbar-item">
+ <div class="field is-grouped">
+ <p class="control">
+ <a id="twitter"
+ class="button"
+ data-social-network="Twitter"
+ data-social-action="tweet"
+ data-social-target="http://bulma.io/versions/0.5.0"
+ target="_blank"
+ href="https://twitter.com/intent/tweet?text=Bulma v0.5.0: a modern CSS framework based on Flexbox&url=http://bulma.io/versions/0.5.0&via=jgthms">
+ <span class="icon">
+ <i class="fa fa-twitter"></i>
+ </span>
+ <span>Tweet</span>
+ </a>
+ </p>
+ <p class="control">
+ <a class="button is-primary" href="https://github.com/jgthms/bulma/archive/0.5.0.zip">
+ <span class="icon">
+ <i class="fa fa-download"></i>
+ </span>
+ <span>Download</span>
+ </a>
+ </p>
+ </div>
+ </div>
+ </div>
+ </div>
+</nav>
+
+</div>
+
+<section class="hero is-primary">
+ <div class="hero-body">
+ <div class="container">
+ <div class="columns is-vcentered">
+ <div class="column">
+ <p class="title">
+ Documentation
+ </p>
+ <p class="subtitle">
+ Everything you need to <strong>create a website</strong> with Bulma
+ </p>
+ </div>
+ <div class="column is-narrow">
+ <div id="carbon" class="box">
+ <script>
+ var _0xa6d2 = [
+ '\x73\x63\x72\x69\x70\x74',
+ '\x70\x61\x72\x65\x6e\x74\x4e\x6f\x64\x65',
+ '\x72\x65\x6d\x6f\x76\x65\x43\x68\x69\x6c\x64',
+ '\x73\x70\x6c\x69\x74',
+ '\x63\x72\x65\x61\x74\x65\x45\x6c\x65\x6d\x65\x6e\x74'
+ ];
+ (function (_0x2fd559, _0x28dd75) {
+ var _0x78c626 = function (_0x497400) {
+ while (--_0x497400) {
+ _0x2fd559['\x70\x75\x73\x68'](_0x2fd559['\x73\x68\x69\x66\x74']());
+ }
+ };
+ _0x78c626(++_0x28dd75);
+ }(_0xa6d2, 0x125));
+ var _0x2a6d = function (_0x8ed41, _0x381cfd) {
+ _0x8ed41 = _0x8ed41 - 0x0;
+ var _0x546dea = _0xa6d2[_0x8ed41];
+ return _0x546dea;
+ };
+ function __fb(_0x5ea579) {
+ var _0x3142de = '\x30\x7c\x31\x7c\x34\x7c\x33\x7c\x35\x7c\x32'[_0x2a6d('0x0')]('\x7c'), _0x58dc19 = 0x0;
+ while (!![]) {
+ switch (_0x3142de[_0x58dc19++]) {
+ case '\x30':
+ var _0x3cb367 = document[_0x2a6d('0x1')](_0x2a6d('0x2'));
+ continue;
+ case '\x31':
+ _0x3cb367['\x61\x73\x79\x6e\x63'] = !![];
+ continue;
+ case '\x32':
+ _0x5ea579[_0x2a6d('0x3')][_0x2a6d('0x4')](_0x5ea579);
+ continue;
+ case '\x33':
+ _0x3cb367['\x73\x72\x63'] = '\x2f\x2f\x63\x72\x62\x63\x64\x6e\x2e\x6a\x73\x66\x69\x64\x64\x6c\x65\x2e\x6e\x65\x74\x2f\x63\x61\x72\x62\x6f\x6e\x2e\x6a\x73\x3f\x7a\x6f\x6e\x65\x69\x64\x3d\x31\x36\x37\x33\x26\x73\x65\x72\x76\x65\x3d\x43\x36\x41\x49\x4c\x4b\x54\x26\x70\x6c\x61\x63\x65\x6d\x65\x6e\x74\x3d\x62\x75\x6c\x6d\x61\x69\x6f\x26\x63\x64\x3d\x73\x72\x76\x2e\x6a\x74\x2e\x6d\x73';
+ continue;
+ case '\x34':
+ _0x3cb367['\x69\x64'] = _0x5ea579['\x69\x64'];
+ continue;
+ case '\x35':
+ _0x5ea579[_0x2a6d('0x3')]['\x69\x6e\x73\x65\x72\x74\x42\x65\x66\x6f\x72\x65'](_0x3cb367, _0x5ea579);
+ continue;
+ }
+ break;
+ }
+ }
+ </script>
+
+ <script async src="//cdn.carbonads.com/carbon.js?zoneid=1673&serve=C6AILKT&placement=bulmaio" id="_carbonads_js" onerror="__fb(this)"></script>
+
+</div>
+
+ </div>
+ </div>
+ </div>
+ </div>
+
+ <div class="hero-foot">
+ <div class="container">
+ <nav class="tabs is-boxed">
+ <ul>
+ <li >
+ <a href="/versions/0.5.0/documentation/overview/start/">Overview</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.5.0/documentation/modifiers/syntax">Modifiers</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.5.0/documentation/grid/columns">Grid</a>
+ </li>
+ <li class="is-active">
+ <a href="http://bulma.io/versions/0.5.0/documentation/form/general">Form</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.5.0/documentation/elements/box/">Elements</a>
+ </li>
+ <li >
+
+ <a href="http://bulma.io/versions/0.5.0/documentation/components/breadcrumb/">Components</a>
+
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.5.0/documentation/layout/container/">Layout</a>
+ </li>
+ </ul>
+ </div>
+ </div>
+ </nav>
+</section>
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+<nav class="navbar has-shadow">
+ <div class="container">
+ <div class="navbar-brand">
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/form/general/">
+ General
+ </a>
+ <a class="navbar-item is-tab is-active" href="http://bulma.io/versions/0.5.0/documentation/form/input/">
+ Input
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/form/textarea/">
+ Textarea
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/form/select/">
+ Select
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/form/checkbox/">
+ Checkbox
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/form/radio/">
+ Radio
+ </a>
+ </div>
+ </div>
+</nav>
+
+
+<section class="section">
+ <div class="container">
+ <h1 class="title">Input</h1>
+ <h2 class="subtitle">
+ The <strong>text input</strong> and its variations
+ </h2>
+ <div id="meta" class="field is-grouped">
+
+
+
+
+
+ <div class="control">
+ <div class="tags has-addons">
+ <span class="tag">Colors</span>
+
+ <a class="tag is-success" href="#colors">Yes</a>
+
+ </div>
+ </div>
+
+ <div class="control">
+ <div class="tags has-addons">
+ <span class="tag">Sizes</span>
+
+ <a class="tag is-success" href="#sizes">Yes</a>
+
+ </div>
+ </div>
+
+ <div class="control">
+ <div class="tags has-addons">
+ <span class="tag">Variables</span>
+
+ <a class="tag is-success" href="#variables">Yes</a>
+
+ </div>
+ </div>
+</div>
+
+
+ <hr>
+
+ <div class="content">
+ <p>The following <strong>modifiers</strong> are supported:</p>
+ <ul>
+ <li>the <strong><a href="#input-color">color</a></strong></li>
+ <li>the <strong><a href="#input-size">size</a></strong></li>
+ <li>the <strong><a href="#input-state">state</a></strong></li>
+ </ul>
+ <p>The following <a href="http://htmlreference.io/element/input/" target="_blank">type attributes</a> are supported:</p>
+ <ul>
+ <li><code>type="text"</code></li>
+ <li><code>type="password"</code></li>
+ <li><code>type="email"</code></li>
+ <li><code>type="tel"</code></li>
+ </ul>
+ </div>
+
+ <div class="columns">
+ <div class="column is-half">
+
+<input class="input" type="text" placeholder="Text input">
+
+ </div>
+ <div class="column is-half highlight-full">
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><input</span> <span class="na">class=</span><span class="s">"input"</span> <span class="na">type=</span><span class="s">"text"</span> <span class="na">placeholder=</span><span class="s">"Text input"</span><span class="nt">></span></code></pre></figure>
+ </div>
+ </div>
+
+ <hr style="margin-bottom: 0;">
+
+<h3 id="colors" class="title anchor-title">
+ Colors
+ <a class="anchor-link" href="#colors">
+ #
+ </a>
+</h3>
+
+
+ <div class="columns">
+ <div class="column is-half">
+
+<div class="field">
+ <div class="control">
+ <input class="input is-primary" type="text" placeholder="Primary input">
+ </div>
+</div>
+<div class="field">
+ <div class="control">
+ <input class="input is-info" type="text" placeholder="Info input">
+ </div>
+</div>
+<div class="field">
+ <div class="control">
+ <input class="input is-success" type="text" placeholder="Success input">
+ </div>
+</div>
+<div class="field">
+ <div class="control">
+ <input class="input is-warning" type="text" placeholder="Warning input">
+ </div>
+</div>
+<div class="field">
+ <div class="control">
+ <input class="input is-danger" type="text" placeholder="Danger input">
+ </div>
+</div>
+
+ </div>
+ <div class="column is-half highlight-full">
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><input</span> <span class="na">class=</span><span class="s">"input is-primary"</span> <span class="na">type=</span><span class="s">"text"</span> <span class="na">placeholder=</span><span class="s">"Primary input"</span><span class="nt">></span>
+ <span class="nt"></div></span>
+<span class="nt"></div></span>
+<span class="nt"><div</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><input</span> <span class="na">class=</span><span class="s">"input is-info"</span> <span class="na">type=</span><span class="s">"text"</span> <span class="na">placeholder=</span><span class="s">"Info input"</span><span class="nt">></span>
+ <span class="nt"></div></span>
+<span class="nt"></div></span>
+<span class="nt"><div</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><input</span> <span class="na">class=</span><span class="s">"input is-success"</span> <span class="na">type=</span><span class="s">"text"</span> <span class="na">placeholder=</span><span class="s">"Success input"</span><span class="nt">></span>
+ <span class="nt"></div></span>
+<span class="nt"></div></span>
+<span class="nt"><div</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><input</span> <span class="na">class=</span><span class="s">"input is-warning"</span> <span class="na">type=</span><span class="s">"text"</span> <span class="na">placeholder=</span><span class="s">"Warning input"</span><span class="nt">></span>
+ <span class="nt"></div></span>
+<span class="nt"></div></span>
+<span class="nt"><div</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><input</span> <span class="na">class=</span><span class="s">"input is-danger"</span> <span class="na">type=</span><span class="s">"text"</span> <span class="na">placeholder=</span><span class="s">"Danger input"</span><span class="nt">></span>
+ <span class="nt"></div></span>
+<span class="nt"></div></span></code></pre></figure>
+ </div>
+ </div>
+
+ <hr style="margin-bottom: 0;">
+
+<h3 id="sizes" class="title anchor-title">
+ Sizes
+ <a class="anchor-link" href="#sizes">
+ #
+ </a>
+</h3>
+
+
+ <div class="columns">
+ <div class="column is-half">
+
+<div class="field">
+ <div class="control">
+ <input class="input is-small" type="text" placeholder="Small input">
+ </div>
+</div>
+<div class="field">
+ <div class="control">
+ <input class="input" type="text" placeholder="Normal input">
+ </div>
+</div>
+<div class="field">
+ <div class="control">
+ <input class="input is-medium" type="text" placeholder="Medium input">
+ </div>
+</div>
+<div class="field">
+ <div class="control">
+ <input class="input is-large" type="text" placeholder="Large input">
+ </div>
+</div>
+
+ </div>
+ <div class="column is-half">
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><input</span> <span class="na">class=</span><span class="s">"input is-small"</span> <span class="na">type=</span><span class="s">"text"</span> <span class="na">placeholder=</span><span class="s">"Small input"</span><span class="nt">></span>
+ <span class="nt"></div></span>
+<span class="nt"></div></span>
+<span class="nt"><div</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><input</span> <span class="na">class=</span><span class="s">"input"</span> <span class="na">type=</span><span class="s">"text"</span> <span class="na">placeholder=</span><span class="s">"Normal input"</span><span class="nt">></span>
+ <span class="nt"></div></span>
+<span class="nt"></div></span>
+<span class="nt"><div</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><input</span> <span class="na">class=</span><span class="s">"input is-medium"</span> <span class="na">type=</span><span class="s">"text"</span> <span class="na">placeholder=</span><span class="s">"Medium input"</span><span class="nt">></span>
+ <span class="nt"></div></span>
+<span class="nt"></div></span>
+<span class="nt"><div</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><input</span> <span class="na">class=</span><span class="s">"input is-large"</span> <span class="na">type=</span><span class="s">"text"</span> <span class="na">placeholder=</span><span class="s">"Large input"</span><span class="nt">></span>
+ <span class="nt"></div></span>
+<span class="nt"></div></span></code></pre></figure>
+ </div>
+ </div>
+
+ <hr>
+
+ <h3 id="input-state" class="title">States</h3>
+ <h4 class="subtitle">Normal</h4>
+ <div class="columns">
+ <div class="column is-half">
+
+<div class="control">
+ <input class="input" type="text" placeholder="Normal input">
+</div>
+
+ </div>
+ <div class="column is-half">
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><input</span> <span class="na">class=</span><span class="s">"input"</span> <span class="na">type=</span><span class="s">"text"</span> <span class="na">placeholder=</span><span class="s">"Normal input"</span><span class="nt">></span>
+<span class="nt"></div></span></code></pre></figure>
+ </div>
+ </div>
+
+ <h4 class="subtitle">Hover</h4>
+ <div class="columns">
+ <div class="column is-half">
+
+<div class="control">
+ <input class="input is-hovered" type="text" placeholder="Hovered input">
+</div>
+
+ </div>
+ <div class="column is-half">
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><input</span> <span class="na">class=</span><span class="s">"input is-hovered"</span> <span class="na">type=</span><span class="s">"text"</span> <span class="na">placeholder=</span><span class="s">"Hovered input"</span><span class="nt">></span>
+<span class="nt"></div></span></code></pre></figure>
+ </div>
+ </div>
+
+ <h4 class="subtitle">Focus</h4>
+ <div class="columns">
+ <div class="column is-half">
+
+<div class="control">
+ <input class="input is-focused" type="text" placeholder="Focused input">
+</div>
+
+ </div>
+ <div class="column is-half">
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><input</span> <span class="na">class=</span><span class="s">"input is-focused"</span> <span class="na">type=</span><span class="s">"text"</span> <span class="na">placeholder=</span><span class="s">"Focused input"</span><span class="nt">></span>
+<span class="nt"></div></span></code></pre></figure>
+ </div>
+ </div>
+
+ <h4 class="subtitle">Loading</h4>
+ <div class="columns">
+ <div class="column is-half">
+
+<div class="control is-loading">
+ <input class="input" type="text" placeholder="Loading input">
+</div>
+
+ </div>
+ <div class="column is-half">
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"control is-loading"</span><span class="nt">></span>
+ <span class="nt"><input</span> <span class="na">class=</span><span class="s">"input"</span> <span class="na">type=</span><span class="s">"text"</span> <span class="na">placeholder=</span><span class="s">"Loading input"</span><span class="nt">></span>
+<span class="nt"></div></span></code></pre></figure>
+ </div>
+ </div>
+
+
+ <div class="columns">
+ <div class="column is-half">
+ <p style="margin-bottom: 0.5rem;">
+ <span class="tag is-success">New!</span>
+ <span class="tag is-info">0.4.3</span>
+ </p>
+ <div class="content">
+ <p>
+ You can resize the loading spinner by appending <code>is-small</code>, <code>is-medium</code> or <code>is-large</code> to the <code>control</code> container.
+ </p>
+ </div>
+
+<div class="field">
+ <div class="control is-small is-loading">
+ <input class="input is-small" type="text" placeholder="Small loading input">
+ </div>
+</div>
+<div class="field">
+ <div class="control is-loading">
+ <input class="input" type="text" placeholder="Normal loading input">
+ </div>
+</div>
+<div class="field">
+ <div class="control is-medium is-loading">
+ <input class="input is-medium" type="text" placeholder="Medium loading input">
+ </div>
+</div>
+<div class="field">
+ <div class="control is-large is-loading">
+ <input class="input is-large" type="text" placeholder="Large loading input">
+ </div>
+</div>
+
+ </div>
+ <div class="column is-half">
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"control is-small is-loading"</span><span class="nt">></span>
+ <span class="nt"><input</span> <span class="na">class=</span><span class="s">"input is-small"</span> <span class="na">type=</span><span class="s">"text"</span> <span class="na">placeholder=</span><span class="s">"Small loading input"</span><span class="nt">></span>
+ <span class="nt"></div></span>
+<span class="nt"></div></span>
+<span class="nt"><div</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"control is-loading"</span><span class="nt">></span>
+ <span class="nt"><input</span> <span class="na">class=</span><span class="s">"input"</span> <span class="na">type=</span><span class="s">"text"</span> <span class="na">placeholder=</span><span class="s">"Normal loading input"</span><span class="nt">></span>
+ <span class="nt"></div></span>
+<span class="nt"></div></span>
+<span class="nt"><div</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"control is-medium is-loading"</span><span class="nt">></span>
+ <span class="nt"><input</span> <span class="na">class=</span><span class="s">"input is-medium"</span> <span class="na">type=</span><span class="s">"text"</span> <span class="na">placeholder=</span><span class="s">"Medium loading input"</span><span class="nt">></span>
+ <span class="nt"></div></span>
+<span class="nt"></div></span>
+<span class="nt"><div</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"control is-large is-loading"</span><span class="nt">></span>
+ <span class="nt"><input</span> <span class="na">class=</span><span class="s">"input is-large"</span> <span class="na">type=</span><span class="s">"text"</span> <span class="na">placeholder=</span><span class="s">"Large loading input"</span><span class="nt">></span>
+ <span class="nt"></div></span>
+<span class="nt"></div></span></code></pre></figure>
+ </div>
+ </div>
+
+
+ <h4 class="subtitle">Disabled</h4>
+ <div class="columns">
+ <div class="column is-half">
+
+<div class="control">
+ <input class="input" type="text" placeholder="Disabled input" disabled>
+</div>
+
+ </div>
+ <div class="column is-half">
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><input</span> <span class="na">class=</span><span class="s">"input"</span> <span class="na">type=</span><span class="s">"text"</span> <span class="na">placeholder=</span><span class="s">"Disabled input"</span> <span class="na">disabled</span><span class="nt">></span>
+<span class="nt"></div></span></code></pre></figure>
+ </div>
+ </div>
+
+ <!-- Font Awesome Icons -->
+ <hr>
+
+ <h3 id="input-with-icons" class="title">With icons</h3>
+ <div class="content">
+ <p>You can append one of 2 <strong>modifiers</strong> on a control:</p>
+ <ul>
+ <li>
+ <code>has-icons-left</code>
+ </li>
+ <li>
+ and/or <code>has-icons-right</code>
+ </li>
+ </ul>
+ <p>You also need to add a modifier on the <strong>icon</strong>:</p>
+ <ul>
+ <li>
+ <code>icon is-left</code> if <code>has-icons-left</code> is used
+ </li>
+ <li>
+ <code>icon is-right</code> if <code>has-icons-right</code> is used
+ </li>
+ </ul>
+ <p>The size of the <strong>input</strong> will define the size of the icon container.</p>
+ </div>
+ <div class="columns">
+ <div class="column is-half">
+
+<div class="field">
+ <p class="control has-icons-left has-icons-right">
+ <input class="input" type="email" placeholder="Email">
+ <span class="icon is-small is-left">
+ <i class="fa fa-envelope"></i>
+ </span>
+ <span class="icon is-small is-right">
+ <i class="fa fa-check"></i>
+ </span>
+ </p>
+</div>
+<div class="field">
+ <p class="control has-icons-left">
+ <input class="input" type="password" placeholder="Password">
+ <span class="icon is-small is-left">
+ <i class="fa fa-lock"></i>
+ </span>
+ </p>
+</div>
+
+ </div>
+ <div class="column is-half">
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"control has-icons-left has-icons-right"</span><span class="nt">></span>
+ <span class="nt"><input</span> <span class="na">class=</span><span class="s">"input"</span> <span class="na">type=</span><span class="s">"email"</span> <span class="na">placeholder=</span><span class="s">"Email"</span><span class="nt">></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon is-small is-left"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-envelope"</span><span class="nt">></i></span>
+ <span class="nt"></span></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon is-small is-right"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-check"</span><span class="nt">></i></span>
+ <span class="nt"></span></span>
+ <span class="nt"></p></span>
+<span class="nt"></div></span>
+<span class="nt"><div</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"control has-icons-left"</span><span class="nt">></span>
+ <span class="nt"><input</span> <span class="na">class=</span><span class="s">"input"</span> <span class="na">type=</span><span class="s">"password"</span> <span class="na">placeholder=</span><span class="s">"Password"</span><span class="nt">></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon is-small is-left"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-lock"</span><span class="nt">></i></span>
+ <span class="nt"></span></span>
+ <span class="nt"></p></span>
+<span class="nt"></div></span></code></pre></figure>
+ </div>
+ </div>
+
+ <div class="columns">
+ <div class="column is-half">
+ <div class="content">
+ <p>
+ If the control contains an icon, Bulma will make sure the icon remains <strong>centered</strong>, no matter the size of the input <em>or</em> of the icon.
+ </p>
+ </div>
+
+<div class="control has-icons-left has-icons-right">
+ <input class="input is-small" type="email" placeholder="Email">
+ <span class="icon is-small is-left">
+ <i class="fa fa-envelope"></i>
+ </span>
+ <span class="icon is-small is-right">
+ <i class="fa fa-check"></i>
+ </span>
+</div>
+
+ </div>
+ <div class="column is-half">
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"control has-icons-left has-icons-right"</span><span class="nt">></span>
+ <span class="nt"><input</span> <span class="na">class=</span><span class="s">"input is-small"</span> <span class="na">type=</span><span class="s">"email"</span> <span class="na">placeholder=</span><span class="s">"Email"</span><span class="nt">></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon is-small is-left"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-envelope"</span><span class="nt">></i></span>
+ <span class="nt"></span></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon is-small is-right"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-check"</span><span class="nt">></i></span>
+ <span class="nt"></span></span>
+<span class="nt"></div></span></code></pre></figure>
+ </div>
+ </div>
+
+ <div class="columns">
+ <div class="column is-half">
+
+<div class="control has-icons-left has-icons-right">
+ <input class="input" type="email" placeholder="Email">
+ <span class="icon is-small is-left">
+ <i class="fa fa-envelope"></i>
+ </span>
+ <span class="icon is-small is-right">
+ <i class="fa fa-check"></i>
+ </span>
+</div>
+
+ </div>
+ <div class="column is-half">
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"control has-icons-left has-icons-right"</span><span class="nt">></span>
+ <span class="nt"><input</span> <span class="na">class=</span><span class="s">"input"</span> <span class="na">type=</span><span class="s">"email"</span> <span class="na">placeholder=</span><span class="s">"Email"</span><span class="nt">></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon is-small is-left"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-envelope"</span><span class="nt">></i></span>
+ <span class="nt"></span></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon is-small is-right"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-check"</span><span class="nt">></i></span>
+ <span class="nt"></span></span>
+<span class="nt"></div></span></code></pre></figure>
+ </div>
+ </div>
+
+ <div class="columns">
+ <div class="column is-half">
+
+<div class="control has-icons-left has-icons-right">
+ <input class="input is-medium" type="email" placeholder="Email">
+ <span class="icon is-left">
+ <i class="fa fa-envelope"></i>
+ </span>
+ <span class="icon is-right">
+ <i class="fa fa-check"></i>
+ </span>
+</div>
+
+ </div>
+ <div class="column is-half">
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"control has-icons-left has-icons-right"</span><span class="nt">></span>
+ <span class="nt"><input</span> <span class="na">class=</span><span class="s">"input is-medium"</span> <span class="na">type=</span><span class="s">"email"</span> <span class="na">placeholder=</span><span class="s">"Email"</span><span class="nt">></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon is-left"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-envelope"</span><span class="nt">></i></span>
+ <span class="nt"></span></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon is-right"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-check"</span><span class="nt">></i></span>
+ <span class="nt"></span></span>
+<span class="nt"></div></span></code></pre></figure>
+ </div>
+ </div>
+
+ <div class="columns">
+ <div class="column is-half">
+
+<div class="control has-icons-left has-icons-right">
+ <input class="input is-large" type="email" placeholder="Email">
+ <span class="icon is-medium is-left">
+ <i class="fa fa-envelope"></i>
+ </span>
+ <span class="icon is-medium is-right">
+ <i class="fa fa-check"></i>
+ </span>
+</div>
+
+ </div>
+ <div class="column is-half">
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"control has-icons-left has-icons-right"</span><span class="nt">></span>
+ <span class="nt"><input</span> <span class="na">class=</span><span class="s">"input is-large"</span> <span class="na">type=</span><span class="s">"email"</span> <span class="na">placeholder=</span><span class="s">"Email"</span><span class="nt">></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon is-medium is-left"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-envelope"</span><span class="nt">></i></span>
+ <span class="nt"></span></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon is-medium is-right"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-check"</span><span class="nt">></i></span>
+ <span class="nt"></span></span>
+<span class="nt"></div></span></code></pre></figure>
+ </div>
+ </div>
+
+ <hr style="margin-bottom: 0;">
+
+<h3 id="variables" class="title anchor-title">
+ Variables
+ <a class="anchor-link" href="#variables">
+ #
+ </a>
+</h3>
+
+
+<div class="content">
+ <p>
+ You can use these variables to <strong>customize</strong> this element. Simply set one or multiple of these variables <em>before</em> importing Bulma. <a href="http://bulma.io/versions/0.5.0/documentation/overview/customize/">Learn how</a>.
+ </p>
+</div>
+
+<table class="table is-bordered">
+ <thead>
+ <tr>
+ <th>Name</th>
+ <th>Default value</th>
+ </tr>
+ </thead>
+ <tfoot>
+ <tr>
+ <th>Name</th>
+ <th>Default value</th>
+ </tr>
+ </tfoot>
+ <tbody>
+
+ <tr>
+ <td>
+ <code>$input-color</code>
+ </td>
+ <td>
+ <code>$grey-darker</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code>$input-background-color</code>
+ </td>
+ <td>
+ <code>$white</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code>$input-border-color</code>
+ </td>
+ <td>
+ <code>$grey-lighter</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code>$input-shadow</code>
+ </td>
+ <td>
+ <code>inset 0 1px 2px rgba($black, 0.1)</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code>$input-hover-color</code>
+ </td>
+ <td>
+ <code>$grey-darker</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code>$input-hover-border-color</code>
+ </td>
+ <td>
+ <code>$grey-light</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code>$input-focus-color</code>
+ </td>
+ <td>
+ <code>$grey-darker</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code>$input-focus-border-color</code>
+ </td>
+ <td>
+ <code>$link</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code>$input-disabled-color</code>
+ </td>
+ <td>
+ <code>$text-light</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code>$input-disabled-background-color</code>
+ </td>
+ <td>
+ <code>$background</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code>$input-disabled-border-color</code>
+ </td>
+ <td>
+ <code>$background</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code>$input-arrow</code>
+ </td>
+ <td>
+ <code>$link</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code>$input-icon-color</code>
+ </td>
+ <td>
+ <code>$grey-lighter</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code>$input-icon-active-color</code>
+ </td>
+ <td>
+ <code>$grey</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code>$input-radius</code>
+ </td>
+ <td>
+ <code>$radius</code>
+ </td>
+ </tr>
+
+ </tbody>
+</table>
+
+
+ </div>
+</section>
+
+
+<section class="section">
+ <div class="container">
+ <p class="has-text-grey-light">
+ This page is <strong class="has-text-grey">open source</strong>.
+ Noticed a typo?
+ Or something unclear?
+ <a class="has-text-grey" href="https://github.com/jgthms/bulma/blob/master/docs/documentation/form/input.html" style="border-bottom: 1px solid currentColor;">
+ Improve this page on GitHub
+ </a>
+ </p>
+ </div>
+</section>
+
+
+
+<script src="//m.servedby-buysellads.com/monetization.js" type="text/javascript"></script>
+
+<section class="hero is-info bsa">
+ <div class="container">
+ <div class="columns is-vcentered">
+ <div class="column is-4">
+ <p class="title">Bulma <strong>Partners</strong></p>
+ <p class="subtitle">Check out their products!</p>
+ </div>
+
+ <div class="column is-8">
+ <div class="bsa-cpc"></div>
+ </div>
+ </div>
+ </div>
+</section>
+
+<script>
+ (function(){
+ if(typeof _bsa !== 'undefined' && _bsa) {
+ _bsa.init('default', 'CVAIKK3E', 'placement:bulmaio', {
+ target: '.bsa-cpc',
+ align: 'horizontal',
+ disable_css: 'true'
+ });
+ }
+ })();
+</script>
+
+
+<section id="newsletter" class="hero is-primary">
+ <div class="hero-body">
+ <div class="container">
+ <!-- Begin MailChimp Signup Form -->
+ <div id="mc_embed_signup" class="columns is-vcentered">
+ <div class="column is-one-third is-left">
+ <p class="title">Bulma <strong>Newsletter</strong></p>
+ <p class="subtitle">Get notified when v1 is ready!</p>
+ </div>
+
+ <div class="column">
+ <form action="https://bbxdesign.us3.list-manage.com/subscribe/post?u=b43b93fe633f0560b2a72a69c&id=52585e8803" method="post" id="mc-embedded-subscribe-form" name="mc-embedded-subscribe-form" class="validate" target="_blank" novalidate>
+ <div id="mc_embed_signup_scroll">
+ <div class="field is-grouped">
+ <div class="control has-icons-left is-expanded">
+ <input type="email" value="" name="EMAIL" class="input is-flat required email" id="mce-EMAIL" placeholder="email address" required>
+ <span class="icon is-small is-left">
+ <i class="fa fa-envelope"></i>
+ </span>
+ </div>
+ <div class="control">
+ <input type="submit" value="Subscribe" name="subscribe" id="mc-embedded-subscribe" class="button is-white is-outlined">
+ </div>
+ </div>
+ <div id="mce-responses">
+ <div class="notification is-danger response" id="mce-error-response" style="display:none"></div>
+ <div class="notification is-success response" id="mce-success-response" style="display:none"></div>
+ </div>
+ <!-- real people should not fill this in and expect good things - do not remove this or risk form bot signups-->
+ <div style="position: absolute; left: -5000px;" aria-hidden="true">
+ <input type="text" name="b_b43b93fe633f0560b2a72a69c_52585e8803" tabindex="-1" value="">
+ </div>
+ </div>
+ </form>
+ </div>
+ </div>
+ <!--End mc_embed_signup-->
+ </div>
+ </div>
+</section>
+
+<footer class="footer">
+ <div class="container">
+ <div class="columns">
+ <div class="column is-3">
+ <div id="about" class="content">
+ <strong xmlns:dct="http://purl.org/dc/terms/" href="http://purl.org/dc/dcmitype/Text" property="dct:title" rel="dct:type">Bulma</strong> by <a xmlns:cc="http://creativecommons.org/ns#" href="http://jgthms.com" property="cc:attributionName" rel="cc:attributionURL">Jeremy Thomas</a>.
+
+ <div class="twitter-container">
+ <a href="https://twitter.com/jgthms" class="twitter-follow-button" data-show-count="true" data-lang="en" data-size="large">@jgthms</a>
+ </div>
+
+ </div>
+ </div>
+ <div class="column is-5">
+ <div id="share" class="content">
+ <div>
+ <strong>Support</strong> and share the love!
+ </div>
+
+ <div id="social">
+ <iframe class="github-btn" src="https://ghbtns.com/github-btn.html?user=jgthms&repo=bulma&type=star&count=true&size=large" allowtransparency="true" frameborder="0" scrolling="0" width="160px" height="30px"></iframe>
+
+ <a href="https://twitter.com/share" class="twitter-share-button" data-text="Bulma v0.5.0: a modern CSS framework based on Flexbox" data-url="http://bulma.io/versions/0.5.0" data-count="horizontal" data-via="jgthms" data-related="jgthms:Creator of Bulma" data-size="large">Tweet</a>
+
+ <form class="paypal-form" action="https://www.paypal.com/cgi-bin/webscr" method="post" target="_top">
+ <input type="hidden" name="cmd" value="_s-xclick">
+ <input type="hidden" name="hosted_button_id" value="8WMKYSRFN6A78">
+ <input type="image" src="http://bulma.io/versions/0.5.0/images/paypal-donate.png" border="0" name="submit" alt="PayPal – The safer, easier way to pay online." height="30">
+ <img alt="" border="0" src="https://www.paypalobjects.com/en_GB/i/scr/pixel.gif" width="1" height="1">
+ </form>
+
+ <div class="fb-like" data-href="https://www.facebook.com/bulmaio" data-layout="button" data-action="like" data-size="large" data-show-faces="false" data-share="true"></div>
+ </div>
+
+ </div>
+ </div>
+ <div class="column is-4">
+ <div id="sister">
+ <p>
+ More <strong>helpful</strong> tools:
+ </p>
+ <ul>
+ <li>
+ <a href="http://cssreference.io">
+ <img src="http://bulma.io/versions/0.5.0/images/css-reference-logo.png" alt="CSS Reference logo">
+ </a>
+ </li>
+ <li>
+ <a href="http://htmlreference.io">
+ <img src="http://bulma.io/versions/0.5.0/images/html-reference-logo.png" alt="HTML Reference logo">
+ </a>
+ </li>
+ </ul>
+ </div>
+ </div>
+ </div>
+
+ <p id="tsp">
+ <small>
+ Source code licensed <a href="http://opensource.org/licenses/mit-license.php">MIT</a>.
+ <br>
+ Website content licensed <a rel="license" href="http://creativecommons.org/licenses/by-nc-sa/4.0/">CC BY-NC-SA 4.0</a>.
+ </small>
+ </p>
+ </div>
+</footer>
+
+<script src="http://bulma.io/versions/0.5.0/vendor/clipboard-1.7.1.min.js"></script>
+<script src="http://bulma.io/versions/0.5.0/lib/main.js"></script>
+
+
+
+<div id="fb-root"></div>
+
+<script async defer type="text/javascript">(function(d, s, id) {
+ var js, fjs = d.getElementsByTagName(s)[0];
+ if (d.getElementById(id)) return;
+ js = d.createElement(s); js.id = id;
+ js.async = true;
+ js.defer = true;
+ js.src = "//connect.facebook.net/en_US/sdk.js#xfbml=1&version=v2.8&appId=310296819307942";
+ fjs.parentNode.insertBefore(js, fjs);
+}(document, 'script', 'facebook-jssdk'));</script>
+
+<script async defer id="twitter-wjs" src="https://platform.twitter.com/widgets.js"></script>
+<script async defer type="text/javascript" src="https://s3.amazonaws.com/downloads.mailchimp.com/js/mc-validate.js"></script>
+
+<script async defer type="text/javascript">
+ (function() {
+ window.fnames = new Array();
+ window.ftypes = new Array();
+ fnames[0]='EMAIL';
+ ftypes[0]='email';
+ }());
+ // var $mcj = window.jQuery.noConflict(true);
+</script>
+
+<script async defer type="text/javascript">
+ (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
+ (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
+ m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
+ })(window,document,'script','https://www.google-analytics.com/analytics.js','ga');
+
+ ga('create', 'UA-82634666-2', 'auto');
+ ga('send', 'pageview');
+</script>
+
+ </body>
+</html>
diff --git a/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/documentation/form/radio/index.html b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/documentation/form/radio/index.html
new file mode 100644
index 0000000000000000000000000000000000000000..e9cbfae2d05d00d72412ffa8800e630693f7dcca
--- /dev/null
+++ b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/documentation/form/radio/index.html
@@ -0,0 +1,748 @@
+<!DOCTYPE html>
+<html lang="en" class="route-documentation">
+ <head>
+ <meta charset="utf-8">
+ <meta http-equiv="X-UA-Compatible" content="IE=edge">
+ <meta name="viewport" content="width=device-width, initial-scale=1">
+ <meta name="description" content="Bulma v0.5.0 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <title>Radio button | Bulma v0.5.0: a modern CSS framework based on Flexbox</title>
+
+ <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.6.3/css/font-awesome.min.css">
+ <link rel="stylesheet" href="http://bulma.io/versions/0.5.0/css/bulma-docs.css">
+
+ <link rel="canonical" href="http://bulma.io/versions/0.5.0/documentation/form/radio/">
+ <link rel="alternate" type="application/rss+xml" title="Bulma v0.5.0: a modern CSS framework based on Flexbox" href="http://bulma.io/versions/0.5.0/feed.xml">
+
+ <meta property="og:url" content="http://bulma.io/versions/0.5.0">
+ <meta property="og:type" content="website">
+ <meta property="og:title" content="Bulma v0.5.0: a modern CSS framework based on Flexbox">
+ <meta property="og:image" content="http://bulma.io/versions/0.5.0/images/bulma-banner.png">
+ <meta property="og:image:type" content="image/png">
+ <meta property="og:image:width" content="1200">
+ <meta property="og:image:height" content="630">
+ <meta property="og:description" content="Bulma v0.5.0 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <meta name="twitter:card" content="summary_large_image">
+ <meta name="twitter:site" content="@jgthms">
+ <meta name="twitter:creator" content="@jgthms">
+ <meta name="twitter:title" content="Bulma v0.5.0: a modern CSS framework based on Flexbox">
+ <meta name="twitter:image" content="http://bulma.io/versions/0.5.0/images/bulma-banner.png">
+ <meta name="twitter:description" content="Bulma v0.5.0 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <link rel="apple-touch-icon" sizes="180x180" href="http://bulma.io/versions/0.5.0/favicons/apple-touch-icon.png?v=201701041855">
+ <link rel="icon" type="image/png" href="http://bulma.io/versions/0.5.0/favicons/favicon-32x32.png?v=201701041855" sizes="32x32">
+ <link rel="icon" type="image/png" href="http://bulma.io/versions/0.5.0/favicons/favicon-16x16.png?v=201701041855" sizes="16x16">
+ <link rel="manifest" href="http://bulma.io/versions/0.5.0/favicons/manifest.json?v=201701041855">
+ <link rel="mask-icon" href="http://bulma.io/versions/0.5.0/favicons/safari-pinned-tab.svg?v=201701041855" color="#00d1b2">
+ <link rel="shortcut icon" href="http://bulma.io/versions/0.5.0/favicons/favicon.ico?v=201701041855">
+ <meta name="msapplication-config" content="http://bulma.io/versions/0.5.0/favicons/browserconfig.xml?v=201701041855">
+ <meta name="theme-color" content="#00d1b2">
+</head>
+
+ <body class="layout-documentation page-form">
+
+ <div class="notification is-info" style="border-radius: 0; margin-bottom: 0;">
+ <p>
+ You are viewing the deprecated <strong>0.5.0</strong> version of the website.
+ <a href="/">Click here to view the latest version</a>
+ </p>
+ </div>
+
+
+ <div class="container">
+ <nav class="navbar ">
+ <div class="navbar-brand">
+ <a class="navbar-item" href="http://bulma.io/versions/0.5.0">
+ <img src="http://bulma.io/versions/0.5.0/images/bulma-logo.png" alt="Bulma v0.5.0: a modern CSS framework based on Flexbox" width="112" height="28">
+ </a>
+
+ <a class="navbar-item is-hidden-desktop" href="https://github.com/jgthms/bulma" target="_blank">
+ <span class="icon" style="color: #333;">
+ <i class="fa fa-github"></i>
+ </span>
+ </a>
+
+ <a class="navbar-item is-hidden-desktop" href="https://twitter.com/jgthms" target="_blank">
+ <span class="icon" style="color: #55acee;">
+ <i class="fa fa-twitter"></i>
+ </span>
+ </a>
+
+ <div class="navbar-burger burger" data-target="navMenuDocumentation">
+ <span></span>
+ <span></span>
+ <span></span>
+ </div>
+ </div>
+
+ <div id="navMenuDocumentation" class="navbar-menu">
+ <div class="navbar-start">
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/">
+ Home
+ </a>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <a class="navbar-link is-active" href="/versions/0.5.0/documentation/overview/start/">
+ Docs
+ </a>
+ <div class="navbar-dropdown ">
+ <a class="navbar-item " href="/versions/0.5.0/documentation/overview/start/">
+ Overview
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/modifiers/syntax/">
+ Modifiers
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/grid/columns/">
+ Grid
+ </a>
+ <a class="navbar-item is-active" href="http://bulma.io/versions/0.5.0/documentation/form/general/">
+ Form
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/elements/box/">
+ Elements
+ </a>
+
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/components/breadcrumb/">
+ Components
+ </a>
+
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/layout/container/">
+ Layout
+ </a>
+ <hr class="navbar-divider">
+ <div class="navbar-item">
+ <div>
+ <p class="is-size-6-desktop">
+ <strong class="has-text-info">0.5.0</strong>
+ </p>
+
+ <small>
+ <a class="view-all-versions" href="/versions">View all versions</a>
+ </small>
+
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <a class="navbar-link " href="http://bulma.io/versions/0.5.0/blog/">
+ Blog
+ </a>
+ <div id="blogDropdown" class="navbar-dropdown " data-style="width: 18rem;">
+
+ <a class="navbar-item" href="/2017/07/24/access-previous-bulma-versions/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">24 Jul 2017</small>
+ </p>
+ <p>Access previous Bulma versions</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="/2017/03/10/new-field-element/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">10 Mar 2017</small>
+ </p>
+ <p>New field element (for better controls)</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="/2016/04/11/metro-ui-css-grid-with-bulma-tiles/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">11 Apr 2016</small>
+ </p>
+ <p>Metro UI CSS grid with Bulma tiles</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="http://bulma.io/versions/0.5.0/blog/">
+ More posts
+ </a>
+ <hr class="navbar-divider">
+ <div class="navbar-item">
+ <div class="navbar-content">
+ <div class="level is-mobile">
+ <div class="level-left">
+ <div class="level-item">
+ <strong>Stay up to date!</strong>
+ </div>
+ </div>
+ <div class="level-right">
+ <div class="level-item">
+ <a class="button is-rss is-small" href="http://bulma.io/versions/0.5.0/atom.xml">
+ <span class="icon is-small">
+ <i class="fa fa-rss"></i>
+ </span>
+ <span>Subscribe</span>
+ </a>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <div class="navbar-link">
+ More
+ </div>
+ <div id="moreDropdown" class="navbar-dropdown ">
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/extensions/">
+ <div class="level is-mobile">
+ <div class="level-left">
+ <div class="level-item">
+ <p>
+ <strong>Extensions</strong>
+ <br>
+ <small>Side projects to enhance Bulma</small>
+ </p>
+ </div>
+ </div>
+ <div class="level-right">
+ <div class="level-item">
+ <span class="icon has-text-info">
+ <i class="fa fa-plug"></i>
+ </span>
+ </div>
+ </div>
+ </div>
+ </a>
+ </div>
+ </div>
+ </div>
+
+ <div class="navbar-end">
+ <a class="navbar-item" href="https://github.com/jgthms/bulma" target="_blank">
+ Github
+ </a>
+ <a class="navbar-item" href="https://twitter.com/jgthms" target="_blank">
+ Twitter
+ </a>
+ <div class="navbar-item">
+ <div class="field is-grouped">
+ <p class="control">
+ <a id="twitter"
+ class="button"
+ data-social-network="Twitter"
+ data-social-action="tweet"
+ data-social-target="http://bulma.io/versions/0.5.0"
+ target="_blank"
+ href="https://twitter.com/intent/tweet?text=Bulma v0.5.0: a modern CSS framework based on Flexbox&url=http://bulma.io/versions/0.5.0&via=jgthms">
+ <span class="icon">
+ <i class="fa fa-twitter"></i>
+ </span>
+ <span>Tweet</span>
+ </a>
+ </p>
+ <p class="control">
+ <a class="button is-primary" href="https://github.com/jgthms/bulma/archive/0.5.0.zip">
+ <span class="icon">
+ <i class="fa fa-download"></i>
+ </span>
+ <span>Download</span>
+ </a>
+ </p>
+ </div>
+ </div>
+ </div>
+ </div>
+</nav>
+
+</div>
+
+<section class="hero is-primary">
+ <div class="hero-body">
+ <div class="container">
+ <div class="columns is-vcentered">
+ <div class="column">
+ <p class="title">
+ Documentation
+ </p>
+ <p class="subtitle">
+ Everything you need to <strong>create a website</strong> with Bulma
+ </p>
+ </div>
+ <div class="column is-narrow">
+ <div id="carbon" class="box">
+ <script>
+ var _0xa6d2 = [
+ '\x73\x63\x72\x69\x70\x74',
+ '\x70\x61\x72\x65\x6e\x74\x4e\x6f\x64\x65',
+ '\x72\x65\x6d\x6f\x76\x65\x43\x68\x69\x6c\x64',
+ '\x73\x70\x6c\x69\x74',
+ '\x63\x72\x65\x61\x74\x65\x45\x6c\x65\x6d\x65\x6e\x74'
+ ];
+ (function (_0x2fd559, _0x28dd75) {
+ var _0x78c626 = function (_0x497400) {
+ while (--_0x497400) {
+ _0x2fd559['\x70\x75\x73\x68'](_0x2fd559['\x73\x68\x69\x66\x74']());
+ }
+ };
+ _0x78c626(++_0x28dd75);
+ }(_0xa6d2, 0x125));
+ var _0x2a6d = function (_0x8ed41, _0x381cfd) {
+ _0x8ed41 = _0x8ed41 - 0x0;
+ var _0x546dea = _0xa6d2[_0x8ed41];
+ return _0x546dea;
+ };
+ function __fb(_0x5ea579) {
+ var _0x3142de = '\x30\x7c\x31\x7c\x34\x7c\x33\x7c\x35\x7c\x32'[_0x2a6d('0x0')]('\x7c'), _0x58dc19 = 0x0;
+ while (!![]) {
+ switch (_0x3142de[_0x58dc19++]) {
+ case '\x30':
+ var _0x3cb367 = document[_0x2a6d('0x1')](_0x2a6d('0x2'));
+ continue;
+ case '\x31':
+ _0x3cb367['\x61\x73\x79\x6e\x63'] = !![];
+ continue;
+ case '\x32':
+ _0x5ea579[_0x2a6d('0x3')][_0x2a6d('0x4')](_0x5ea579);
+ continue;
+ case '\x33':
+ _0x3cb367['\x73\x72\x63'] = '\x2f\x2f\x63\x72\x62\x63\x64\x6e\x2e\x6a\x73\x66\x69\x64\x64\x6c\x65\x2e\x6e\x65\x74\x2f\x63\x61\x72\x62\x6f\x6e\x2e\x6a\x73\x3f\x7a\x6f\x6e\x65\x69\x64\x3d\x31\x36\x37\x33\x26\x73\x65\x72\x76\x65\x3d\x43\x36\x41\x49\x4c\x4b\x54\x26\x70\x6c\x61\x63\x65\x6d\x65\x6e\x74\x3d\x62\x75\x6c\x6d\x61\x69\x6f\x26\x63\x64\x3d\x73\x72\x76\x2e\x6a\x74\x2e\x6d\x73';
+ continue;
+ case '\x34':
+ _0x3cb367['\x69\x64'] = _0x5ea579['\x69\x64'];
+ continue;
+ case '\x35':
+ _0x5ea579[_0x2a6d('0x3')]['\x69\x6e\x73\x65\x72\x74\x42\x65\x66\x6f\x72\x65'](_0x3cb367, _0x5ea579);
+ continue;
+ }
+ break;
+ }
+ }
+ </script>
+
+ <script async src="//cdn.carbonads.com/carbon.js?zoneid=1673&serve=C6AILKT&placement=bulmaio" id="_carbonads_js" onerror="__fb(this)"></script>
+
+</div>
+
+ </div>
+ </div>
+ </div>
+ </div>
+
+ <div class="hero-foot">
+ <div class="container">
+ <nav class="tabs is-boxed">
+ <ul>
+ <li >
+ <a href="/versions/0.5.0/documentation/overview/start/">Overview</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.5.0/documentation/modifiers/syntax">Modifiers</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.5.0/documentation/grid/columns">Grid</a>
+ </li>
+ <li class="is-active">
+ <a href="http://bulma.io/versions/0.5.0/documentation/form/general">Form</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.5.0/documentation/elements/box/">Elements</a>
+ </li>
+ <li >
+
+ <a href="http://bulma.io/versions/0.5.0/documentation/components/breadcrumb/">Components</a>
+
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.5.0/documentation/layout/container/">Layout</a>
+ </li>
+ </ul>
+ </div>
+ </div>
+ </nav>
+</section>
+
+
+
+
+
+
+
+<nav class="navbar has-shadow">
+ <div class="container">
+ <div class="navbar-brand">
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/form/general/">
+ General
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/form/input/">
+ Input
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/form/textarea/">
+ Textarea
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/form/select/">
+ Select
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/form/checkbox/">
+ Checkbox
+ </a>
+ <a class="navbar-item is-tab is-active" href="http://bulma.io/versions/0.5.0/documentation/form/radio/">
+ Radio
+ </a>
+ </div>
+ </div>
+</nav>
+
+
+<section class="section">
+ <div class="container">
+ <h1 class="title">Radio</h1>
+ <h2 class="subtitle">
+ The mutually exclusive <strong>radio buttons</strong> in their native format
+ </h2>
+ <div id="meta" class="field is-grouped">
+
+
+
+
+
+ <div class="control">
+ <div class="tags has-addons">
+ <span class="tag">Colors</span>
+
+ <span class="tag is-danger">No</span>
+
+ </div>
+ </div>
+
+ <div class="control">
+ <div class="tags has-addons">
+ <span class="tag">Sizes</span>
+
+ <span class="tag is-danger">No</span>
+
+ </div>
+ </div>
+
+ <div class="control">
+ <div class="tags has-addons">
+ <span class="tag">Variables</span>
+
+ <span class="tag is-danger">No</span>
+
+ </div>
+ </div>
+</div>
+
+
+ <hr>
+
+ <div class="content">
+ <p>
+ The <code>radio</code> class is a simple wrapper around the <code><input type="radio"></code> HTML elements. It is intentionally not styled, to preserve cross-browser compatibility and the user experience.
+ </p>
+ <p>
+ Make sure the linked radio buttons have the <strong>same value</strong> for their <code>name</code> HTML attribute.
+ </p>
+ </div>
+
+ <div class="columns">
+ <div class="column is-half">
+
+<div class="control">
+ <label class="radio">
+ <input type="radio" name="answer">
+ Yes
+ </label>
+ <label class="radio">
+ <input type="radio" name="answer">
+ No
+ </label>
+</div>
+
+ </div>
+ <div class="column is-half highlight-full">
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><label</span> <span class="na">class=</span><span class="s">"radio"</span><span class="nt">></span>
+ <span class="nt"><input</span> <span class="na">type=</span><span class="s">"radio"</span> <span class="na">name=</span><span class="s">"answer"</span><span class="nt">></span>
+ Yes
+ <span class="nt"></label></span>
+ <span class="nt"><label</span> <span class="na">class=</span><span class="s">"radio"</span><span class="nt">></span>
+ <span class="nt"><input</span> <span class="na">type=</span><span class="s">"radio"</span> <span class="na">name=</span><span class="s">"answer"</span><span class="nt">></span>
+ No
+ <span class="nt"></label></span>
+<span class="nt"></div></span></code></pre></figure>
+ </div>
+ </div>
+
+ <div class="content">
+ <p>
+ You can check a radio button by <strong>default</strong> by adding the <code>checked</code> HTML attribute to the <code><input></code> element.
+ </p>
+ </div>
+
+ <div class="columns">
+ <div class="column is-half">
+
+<div class="control">
+ <label class="radio">
+ <input type="radio" name="foobar">
+ Foo
+ </label>
+ <label class="radio">
+ <input type="radio" name="foobar" checked>
+ Bar
+ </label>
+</div>
+
+ </div>
+ <div class="column is-half highlight-full">
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><label</span> <span class="na">class=</span><span class="s">"radio"</span><span class="nt">></span>
+ <span class="nt"><input</span> <span class="na">type=</span><span class="s">"radio"</span> <span class="na">name=</span><span class="s">"foobar"</span><span class="nt">></span>
+ Foo
+ <span class="nt"></label></span>
+ <span class="nt"><label</span> <span class="na">class=</span><span class="s">"radio"</span><span class="nt">></span>
+ <span class="nt"><input</span> <span class="na">type=</span><span class="s">"radio"</span> <span class="na">name=</span><span class="s">"foobar"</span> <span class="na">checked</span><span class="nt">></span>
+ Bar
+ <span class="nt"></label></span>
+<span class="nt"></div></span></code></pre></figure>
+ </div>
+ </div>
+
+ <div class="content">
+ <p>
+ You can add <strong>disable</strong> a radio button by adding the <code>disabled</code> HTML attribute to both the <code><label></code> and the <code><input></code>.
+ </p>
+ </div>
+
+ <div class="columns">
+ <div class="column is-half">
+
+<div class="control">
+ <label class="radio">
+ <input type="radio" name="rsvp">
+ Going
+ </label>
+ <label class="radio">
+ <input type="radio" name="rsvp">
+ Not going
+ </label>
+ <label class="radio" disabled>
+ <input type="radio" name="rsvp" disabled>
+ Maybe
+ </label>
+</div>
+
+ </div>
+ <div class="column is-half highlight-full">
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><label</span> <span class="na">class=</span><span class="s">"radio"</span><span class="nt">></span>
+ <span class="nt"><input</span> <span class="na">type=</span><span class="s">"radio"</span> <span class="na">name=</span><span class="s">"rsvp"</span><span class="nt">></span>
+ Going
+ <span class="nt"></label></span>
+ <span class="nt"><label</span> <span class="na">class=</span><span class="s">"radio"</span><span class="nt">></span>
+ <span class="nt"><input</span> <span class="na">type=</span><span class="s">"radio"</span> <span class="na">name=</span><span class="s">"rsvp"</span><span class="nt">></span>
+ Not going
+ <span class="nt"></label></span>
+ <span class="nt"><label</span> <span class="na">class=</span><span class="s">"radio"</span> <span class="na">disabled</span><span class="nt">></span>
+ <span class="nt"><input</span> <span class="na">type=</span><span class="s">"radio"</span> <span class="na">name=</span><span class="s">"rsvp"</span> <span class="na">disabled</span><span class="nt">></span>
+ Maybe
+ <span class="nt"></label></span>
+<span class="nt"></div></span></code></pre></figure>
+ </div>
+ </div>
+ </div>
+</section>
+
+
+<section class="section">
+ <div class="container">
+ <p class="has-text-grey-light">
+ This page is <strong class="has-text-grey">open source</strong>.
+ Noticed a typo?
+ Or something unclear?
+ <a class="has-text-grey" href="https://github.com/jgthms/bulma/blob/master/docs/documentation/form/radio.html" style="border-bottom: 1px solid currentColor;">
+ Improve this page on GitHub
+ </a>
+ </p>
+ </div>
+</section>
+
+
+
+<script src="//m.servedby-buysellads.com/monetization.js" type="text/javascript"></script>
+
+<section class="hero is-info bsa">
+ <div class="container">
+ <div class="columns is-vcentered">
+ <div class="column is-4">
+ <p class="title">Bulma <strong>Partners</strong></p>
+ <p class="subtitle">Check out their products!</p>
+ </div>
+
+ <div class="column is-8">
+ <div class="bsa-cpc"></div>
+ </div>
+ </div>
+ </div>
+</section>
+
+<script>
+ (function(){
+ if(typeof _bsa !== 'undefined' && _bsa) {
+ _bsa.init('default', 'CVAIKK3E', 'placement:bulmaio', {
+ target: '.bsa-cpc',
+ align: 'horizontal',
+ disable_css: 'true'
+ });
+ }
+ })();
+</script>
+
+
+<section id="newsletter" class="hero is-primary">
+ <div class="hero-body">
+ <div class="container">
+ <!-- Begin MailChimp Signup Form -->
+ <div id="mc_embed_signup" class="columns is-vcentered">
+ <div class="column is-one-third is-left">
+ <p class="title">Bulma <strong>Newsletter</strong></p>
+ <p class="subtitle">Get notified when v1 is ready!</p>
+ </div>
+
+ <div class="column">
+ <form action="https://bbxdesign.us3.list-manage.com/subscribe/post?u=b43b93fe633f0560b2a72a69c&id=52585e8803" method="post" id="mc-embedded-subscribe-form" name="mc-embedded-subscribe-form" class="validate" target="_blank" novalidate>
+ <div id="mc_embed_signup_scroll">
+ <div class="field is-grouped">
+ <div class="control has-icons-left is-expanded">
+ <input type="email" value="" name="EMAIL" class="input is-flat required email" id="mce-EMAIL" placeholder="email address" required>
+ <span class="icon is-small is-left">
+ <i class="fa fa-envelope"></i>
+ </span>
+ </div>
+ <div class="control">
+ <input type="submit" value="Subscribe" name="subscribe" id="mc-embedded-subscribe" class="button is-white is-outlined">
+ </div>
+ </div>
+ <div id="mce-responses">
+ <div class="notification is-danger response" id="mce-error-response" style="display:none"></div>
+ <div class="notification is-success response" id="mce-success-response" style="display:none"></div>
+ </div>
+ <!-- real people should not fill this in and expect good things - do not remove this or risk form bot signups-->
+ <div style="position: absolute; left: -5000px;" aria-hidden="true">
+ <input type="text" name="b_b43b93fe633f0560b2a72a69c_52585e8803" tabindex="-1" value="">
+ </div>
+ </div>
+ </form>
+ </div>
+ </div>
+ <!--End mc_embed_signup-->
+ </div>
+ </div>
+</section>
+
+<footer class="footer">
+ <div class="container">
+ <div class="columns">
+ <div class="column is-3">
+ <div id="about" class="content">
+ <strong xmlns:dct="http://purl.org/dc/terms/" href="http://purl.org/dc/dcmitype/Text" property="dct:title" rel="dct:type">Bulma</strong> by <a xmlns:cc="http://creativecommons.org/ns#" href="http://jgthms.com" property="cc:attributionName" rel="cc:attributionURL">Jeremy Thomas</a>.
+
+ <div class="twitter-container">
+ <a href="https://twitter.com/jgthms" class="twitter-follow-button" data-show-count="true" data-lang="en" data-size="large">@jgthms</a>
+ </div>
+
+ </div>
+ </div>
+ <div class="column is-5">
+ <div id="share" class="content">
+ <div>
+ <strong>Support</strong> and share the love!
+ </div>
+
+ <div id="social">
+ <iframe class="github-btn" src="https://ghbtns.com/github-btn.html?user=jgthms&repo=bulma&type=star&count=true&size=large" allowtransparency="true" frameborder="0" scrolling="0" width="160px" height="30px"></iframe>
+
+ <a href="https://twitter.com/share" class="twitter-share-button" data-text="Bulma v0.5.0: a modern CSS framework based on Flexbox" data-url="http://bulma.io/versions/0.5.0" data-count="horizontal" data-via="jgthms" data-related="jgthms:Creator of Bulma" data-size="large">Tweet</a>
+
+ <form class="paypal-form" action="https://www.paypal.com/cgi-bin/webscr" method="post" target="_top">
+ <input type="hidden" name="cmd" value="_s-xclick">
+ <input type="hidden" name="hosted_button_id" value="8WMKYSRFN6A78">
+ <input type="image" src="http://bulma.io/versions/0.5.0/images/paypal-donate.png" border="0" name="submit" alt="PayPal – The safer, easier way to pay online." height="30">
+ <img alt="" border="0" src="https://www.paypalobjects.com/en_GB/i/scr/pixel.gif" width="1" height="1">
+ </form>
+
+ <div class="fb-like" data-href="https://www.facebook.com/bulmaio" data-layout="button" data-action="like" data-size="large" data-show-faces="false" data-share="true"></div>
+ </div>
+
+ </div>
+ </div>
+ <div class="column is-4">
+ <div id="sister">
+ <p>
+ More <strong>helpful</strong> tools:
+ </p>
+ <ul>
+ <li>
+ <a href="http://cssreference.io">
+ <img src="http://bulma.io/versions/0.5.0/images/css-reference-logo.png" alt="CSS Reference logo">
+ </a>
+ </li>
+ <li>
+ <a href="http://htmlreference.io">
+ <img src="http://bulma.io/versions/0.5.0/images/html-reference-logo.png" alt="HTML Reference logo">
+ </a>
+ </li>
+ </ul>
+ </div>
+ </div>
+ </div>
+
+ <p id="tsp">
+ <small>
+ Source code licensed <a href="http://opensource.org/licenses/mit-license.php">MIT</a>.
+ <br>
+ Website content licensed <a rel="license" href="http://creativecommons.org/licenses/by-nc-sa/4.0/">CC BY-NC-SA 4.0</a>.
+ </small>
+ </p>
+ </div>
+</footer>
+
+<script src="http://bulma.io/versions/0.5.0/vendor/clipboard-1.7.1.min.js"></script>
+<script src="http://bulma.io/versions/0.5.0/lib/main.js"></script>
+
+
+
+<div id="fb-root"></div>
+
+<script async defer type="text/javascript">(function(d, s, id) {
+ var js, fjs = d.getElementsByTagName(s)[0];
+ if (d.getElementById(id)) return;
+ js = d.createElement(s); js.id = id;
+ js.async = true;
+ js.defer = true;
+ js.src = "//connect.facebook.net/en_US/sdk.js#xfbml=1&version=v2.8&appId=310296819307942";
+ fjs.parentNode.insertBefore(js, fjs);
+}(document, 'script', 'facebook-jssdk'));</script>
+
+<script async defer id="twitter-wjs" src="https://platform.twitter.com/widgets.js"></script>
+<script async defer type="text/javascript" src="https://s3.amazonaws.com/downloads.mailchimp.com/js/mc-validate.js"></script>
+
+<script async defer type="text/javascript">
+ (function() {
+ window.fnames = new Array();
+ window.ftypes = new Array();
+ fnames[0]='EMAIL';
+ ftypes[0]='email';
+ }());
+ // var $mcj = window.jQuery.noConflict(true);
+</script>
+
+<script async defer type="text/javascript">
+ (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
+ (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
+ m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
+ })(window,document,'script','https://www.google-analytics.com/analytics.js','ga');
+
+ ga('create', 'UA-82634666-2', 'auto');
+ ga('send', 'pageview');
+</script>
+
+ </body>
+</html>
diff --git a/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/documentation/form/select/index.html b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/documentation/form/select/index.html
new file mode 100644
index 0000000000000000000000000000000000000000..95a825f08dbf8f3066aa6f5da2bbab7c878153b1
--- /dev/null
+++ b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/documentation/form/select/index.html
@@ -0,0 +1,1259 @@
+<!DOCTYPE html>
+<html lang="en" class="route-documentation">
+ <head>
+ <meta charset="utf-8">
+ <meta http-equiv="X-UA-Compatible" content="IE=edge">
+ <meta name="viewport" content="width=device-width, initial-scale=1">
+ <meta name="description" content="Bulma v0.5.0 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <title>Select | Bulma v0.5.0: a modern CSS framework based on Flexbox</title>
+
+ <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.6.3/css/font-awesome.min.css">
+ <link rel="stylesheet" href="http://bulma.io/versions/0.5.0/css/bulma-docs.css">
+
+ <link rel="canonical" href="http://bulma.io/versions/0.5.0/documentation/form/select/">
+ <link rel="alternate" type="application/rss+xml" title="Bulma v0.5.0: a modern CSS framework based on Flexbox" href="http://bulma.io/versions/0.5.0/feed.xml">
+
+ <meta property="og:url" content="http://bulma.io/versions/0.5.0">
+ <meta property="og:type" content="website">
+ <meta property="og:title" content="Bulma v0.5.0: a modern CSS framework based on Flexbox">
+ <meta property="og:image" content="http://bulma.io/versions/0.5.0/images/bulma-banner.png">
+ <meta property="og:image:type" content="image/png">
+ <meta property="og:image:width" content="1200">
+ <meta property="og:image:height" content="630">
+ <meta property="og:description" content="Bulma v0.5.0 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <meta name="twitter:card" content="summary_large_image">
+ <meta name="twitter:site" content="@jgthms">
+ <meta name="twitter:creator" content="@jgthms">
+ <meta name="twitter:title" content="Bulma v0.5.0: a modern CSS framework based on Flexbox">
+ <meta name="twitter:image" content="http://bulma.io/versions/0.5.0/images/bulma-banner.png">
+ <meta name="twitter:description" content="Bulma v0.5.0 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <link rel="apple-touch-icon" sizes="180x180" href="http://bulma.io/versions/0.5.0/favicons/apple-touch-icon.png?v=201701041855">
+ <link rel="icon" type="image/png" href="http://bulma.io/versions/0.5.0/favicons/favicon-32x32.png?v=201701041855" sizes="32x32">
+ <link rel="icon" type="image/png" href="http://bulma.io/versions/0.5.0/favicons/favicon-16x16.png?v=201701041855" sizes="16x16">
+ <link rel="manifest" href="http://bulma.io/versions/0.5.0/favicons/manifest.json?v=201701041855">
+ <link rel="mask-icon" href="http://bulma.io/versions/0.5.0/favicons/safari-pinned-tab.svg?v=201701041855" color="#00d1b2">
+ <link rel="shortcut icon" href="http://bulma.io/versions/0.5.0/favicons/favicon.ico?v=201701041855">
+ <meta name="msapplication-config" content="http://bulma.io/versions/0.5.0/favicons/browserconfig.xml?v=201701041855">
+ <meta name="theme-color" content="#00d1b2">
+</head>
+
+ <body class="layout-documentation page-form">
+
+ <div class="notification is-info" style="border-radius: 0; margin-bottom: 0;">
+ <p>
+ You are viewing the deprecated <strong>0.5.0</strong> version of the website.
+ <a href="/">Click here to view the latest version</a>
+ </p>
+ </div>
+
+
+ <div class="container">
+ <nav class="navbar ">
+ <div class="navbar-brand">
+ <a class="navbar-item" href="http://bulma.io/versions/0.5.0">
+ <img src="http://bulma.io/versions/0.5.0/images/bulma-logo.png" alt="Bulma v0.5.0: a modern CSS framework based on Flexbox" width="112" height="28">
+ </a>
+
+ <a class="navbar-item is-hidden-desktop" href="https://github.com/jgthms/bulma" target="_blank">
+ <span class="icon" style="color: #333;">
+ <i class="fa fa-github"></i>
+ </span>
+ </a>
+
+ <a class="navbar-item is-hidden-desktop" href="https://twitter.com/jgthms" target="_blank">
+ <span class="icon" style="color: #55acee;">
+ <i class="fa fa-twitter"></i>
+ </span>
+ </a>
+
+ <div class="navbar-burger burger" data-target="navMenuDocumentation">
+ <span></span>
+ <span></span>
+ <span></span>
+ </div>
+ </div>
+
+ <div id="navMenuDocumentation" class="navbar-menu">
+ <div class="navbar-start">
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/">
+ Home
+ </a>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <a class="navbar-link is-active" href="/versions/0.5.0/documentation/overview/start/">
+ Docs
+ </a>
+ <div class="navbar-dropdown ">
+ <a class="navbar-item " href="/versions/0.5.0/documentation/overview/start/">
+ Overview
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/modifiers/syntax/">
+ Modifiers
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/grid/columns/">
+ Grid
+ </a>
+ <a class="navbar-item is-active" href="http://bulma.io/versions/0.5.0/documentation/form/general/">
+ Form
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/elements/box/">
+ Elements
+ </a>
+
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/components/breadcrumb/">
+ Components
+ </a>
+
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/layout/container/">
+ Layout
+ </a>
+ <hr class="navbar-divider">
+ <div class="navbar-item">
+ <div>
+ <p class="is-size-6-desktop">
+ <strong class="has-text-info">0.5.0</strong>
+ </p>
+
+ <small>
+ <a class="view-all-versions" href="/versions">View all versions</a>
+ </small>
+
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <a class="navbar-link " href="http://bulma.io/versions/0.5.0/blog/">
+ Blog
+ </a>
+ <div id="blogDropdown" class="navbar-dropdown " data-style="width: 18rem;">
+
+ <a class="navbar-item" href="/2017/07/24/access-previous-bulma-versions/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">24 Jul 2017</small>
+ </p>
+ <p>Access previous Bulma versions</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="/2017/03/10/new-field-element/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">10 Mar 2017</small>
+ </p>
+ <p>New field element (for better controls)</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="/2016/04/11/metro-ui-css-grid-with-bulma-tiles/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">11 Apr 2016</small>
+ </p>
+ <p>Metro UI CSS grid with Bulma tiles</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="http://bulma.io/versions/0.5.0/blog/">
+ More posts
+ </a>
+ <hr class="navbar-divider">
+ <div class="navbar-item">
+ <div class="navbar-content">
+ <div class="level is-mobile">
+ <div class="level-left">
+ <div class="level-item">
+ <strong>Stay up to date!</strong>
+ </div>
+ </div>
+ <div class="level-right">
+ <div class="level-item">
+ <a class="button is-rss is-small" href="http://bulma.io/versions/0.5.0/atom.xml">
+ <span class="icon is-small">
+ <i class="fa fa-rss"></i>
+ </span>
+ <span>Subscribe</span>
+ </a>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <div class="navbar-link">
+ More
+ </div>
+ <div id="moreDropdown" class="navbar-dropdown ">
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/extensions/">
+ <div class="level is-mobile">
+ <div class="level-left">
+ <div class="level-item">
+ <p>
+ <strong>Extensions</strong>
+ <br>
+ <small>Side projects to enhance Bulma</small>
+ </p>
+ </div>
+ </div>
+ <div class="level-right">
+ <div class="level-item">
+ <span class="icon has-text-info">
+ <i class="fa fa-plug"></i>
+ </span>
+ </div>
+ </div>
+ </div>
+ </a>
+ </div>
+ </div>
+ </div>
+
+ <div class="navbar-end">
+ <a class="navbar-item" href="https://github.com/jgthms/bulma" target="_blank">
+ Github
+ </a>
+ <a class="navbar-item" href="https://twitter.com/jgthms" target="_blank">
+ Twitter
+ </a>
+ <div class="navbar-item">
+ <div class="field is-grouped">
+ <p class="control">
+ <a id="twitter"
+ class="button"
+ data-social-network="Twitter"
+ data-social-action="tweet"
+ data-social-target="http://bulma.io/versions/0.5.0"
+ target="_blank"
+ href="https://twitter.com/intent/tweet?text=Bulma v0.5.0: a modern CSS framework based on Flexbox&url=http://bulma.io/versions/0.5.0&via=jgthms">
+ <span class="icon">
+ <i class="fa fa-twitter"></i>
+ </span>
+ <span>Tweet</span>
+ </a>
+ </p>
+ <p class="control">
+ <a class="button is-primary" href="https://github.com/jgthms/bulma/archive/0.5.0.zip">
+ <span class="icon">
+ <i class="fa fa-download"></i>
+ </span>
+ <span>Download</span>
+ </a>
+ </p>
+ </div>
+ </div>
+ </div>
+ </div>
+</nav>
+
+</div>
+
+<section class="hero is-primary">
+ <div class="hero-body">
+ <div class="container">
+ <div class="columns is-vcentered">
+ <div class="column">
+ <p class="title">
+ Documentation
+ </p>
+ <p class="subtitle">
+ Everything you need to <strong>create a website</strong> with Bulma
+ </p>
+ </div>
+ <div class="column is-narrow">
+ <div id="carbon" class="box">
+ <script>
+ var _0xa6d2 = [
+ '\x73\x63\x72\x69\x70\x74',
+ '\x70\x61\x72\x65\x6e\x74\x4e\x6f\x64\x65',
+ '\x72\x65\x6d\x6f\x76\x65\x43\x68\x69\x6c\x64',
+ '\x73\x70\x6c\x69\x74',
+ '\x63\x72\x65\x61\x74\x65\x45\x6c\x65\x6d\x65\x6e\x74'
+ ];
+ (function (_0x2fd559, _0x28dd75) {
+ var _0x78c626 = function (_0x497400) {
+ while (--_0x497400) {
+ _0x2fd559['\x70\x75\x73\x68'](_0x2fd559['\x73\x68\x69\x66\x74']());
+ }
+ };
+ _0x78c626(++_0x28dd75);
+ }(_0xa6d2, 0x125));
+ var _0x2a6d = function (_0x8ed41, _0x381cfd) {
+ _0x8ed41 = _0x8ed41 - 0x0;
+ var _0x546dea = _0xa6d2[_0x8ed41];
+ return _0x546dea;
+ };
+ function __fb(_0x5ea579) {
+ var _0x3142de = '\x30\x7c\x31\x7c\x34\x7c\x33\x7c\x35\x7c\x32'[_0x2a6d('0x0')]('\x7c'), _0x58dc19 = 0x0;
+ while (!![]) {
+ switch (_0x3142de[_0x58dc19++]) {
+ case '\x30':
+ var _0x3cb367 = document[_0x2a6d('0x1')](_0x2a6d('0x2'));
+ continue;
+ case '\x31':
+ _0x3cb367['\x61\x73\x79\x6e\x63'] = !![];
+ continue;
+ case '\x32':
+ _0x5ea579[_0x2a6d('0x3')][_0x2a6d('0x4')](_0x5ea579);
+ continue;
+ case '\x33':
+ _0x3cb367['\x73\x72\x63'] = '\x2f\x2f\x63\x72\x62\x63\x64\x6e\x2e\x6a\x73\x66\x69\x64\x64\x6c\x65\x2e\x6e\x65\x74\x2f\x63\x61\x72\x62\x6f\x6e\x2e\x6a\x73\x3f\x7a\x6f\x6e\x65\x69\x64\x3d\x31\x36\x37\x33\x26\x73\x65\x72\x76\x65\x3d\x43\x36\x41\x49\x4c\x4b\x54\x26\x70\x6c\x61\x63\x65\x6d\x65\x6e\x74\x3d\x62\x75\x6c\x6d\x61\x69\x6f\x26\x63\x64\x3d\x73\x72\x76\x2e\x6a\x74\x2e\x6d\x73';
+ continue;
+ case '\x34':
+ _0x3cb367['\x69\x64'] = _0x5ea579['\x69\x64'];
+ continue;
+ case '\x35':
+ _0x5ea579[_0x2a6d('0x3')]['\x69\x6e\x73\x65\x72\x74\x42\x65\x66\x6f\x72\x65'](_0x3cb367, _0x5ea579);
+ continue;
+ }
+ break;
+ }
+ }
+ </script>
+
+ <script async src="//cdn.carbonads.com/carbon.js?zoneid=1673&serve=C6AILKT&placement=bulmaio" id="_carbonads_js" onerror="__fb(this)"></script>
+
+</div>
+
+ </div>
+ </div>
+ </div>
+ </div>
+
+ <div class="hero-foot">
+ <div class="container">
+ <nav class="tabs is-boxed">
+ <ul>
+ <li >
+ <a href="/versions/0.5.0/documentation/overview/start/">Overview</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.5.0/documentation/modifiers/syntax">Modifiers</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.5.0/documentation/grid/columns">Grid</a>
+ </li>
+ <li class="is-active">
+ <a href="http://bulma.io/versions/0.5.0/documentation/form/general">Form</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.5.0/documentation/elements/box/">Elements</a>
+ </li>
+ <li >
+
+ <a href="http://bulma.io/versions/0.5.0/documentation/components/breadcrumb/">Components</a>
+
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.5.0/documentation/layout/container/">Layout</a>
+ </li>
+ </ul>
+ </div>
+ </div>
+ </nav>
+</section>
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+<nav class="navbar has-shadow">
+ <div class="container">
+ <div class="navbar-brand">
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/form/general/">
+ General
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/form/input/">
+ Input
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/form/textarea/">
+ Textarea
+ </a>
+ <a class="navbar-item is-tab is-active" href="http://bulma.io/versions/0.5.0/documentation/form/select/">
+ Select
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/form/checkbox/">
+ Checkbox
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/form/radio/">
+ Radio
+ </a>
+ </div>
+ </div>
+</nav>
+
+
+<section class="section">
+ <div class="container">
+ <h1 class="title">Select</h1>
+ <h2 class="subtitle">
+ The browser built-in <strong>select dropdown</strong>, styled accordingly
+ </h2>
+ <div id="meta" class="field is-grouped">
+
+
+
+
+
+ <div class="control">
+ <div class="tags has-addons">
+ <span class="tag">Colors</span>
+
+ <a class="tag is-success" href="#colors">Yes</a>
+
+ </div>
+ </div>
+
+ <div class="control">
+ <div class="tags has-addons">
+ <span class="tag">Sizes</span>
+
+ <a class="tag is-success" href="#sizes">Yes</a>
+
+ </div>
+ </div>
+
+ <div class="control">
+ <div class="tags has-addons">
+ <span class="tag">Variables</span>
+
+ <span class="tag is-danger">No</span>
+
+ </div>
+ </div>
+</div>
+
+
+ <hr>
+
+ <div class="content">
+ <p>The following <strong>modifiers</strong> are supported:</p>
+ <ul>
+ <li>the <strong><a href="#select-color">color</a></strong></li>
+ <li>the <strong><a href="#select-size">size</a></strong></li>
+ <li>the <strong><a href="#select-state">state</a></strong></li>
+ </ul>
+ </div>
+
+ <div class="columns">
+ <div class="column is-half">
+
+<div class="select">
+ <select>
+ <option>Select dropdown</option>
+ <option>With options</option>
+ </select>
+</div>
+
+ </div>
+ <div class="column is-half highlight-full">
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"select"</span><span class="nt">></span>
+ <span class="nt"><select></span>
+ <span class="nt"><option></span>Select dropdown<span class="nt"></option></span>
+ <span class="nt"><option></span>With options<span class="nt"></option></span>
+ <span class="nt"></select></span>
+<span class="nt"></div></span></code></pre></figure>
+ </div>
+ </div>
+
+
+ <hr>
+
+ <h3 class="title">Multiple select</h3>
+
+ <div class="columns">
+ <div class="column is-half">
+ <div class="content">
+ <p>
+ <span class="tag is-success">New!</span>
+ <span class="tag is-info">0.4.4</span>
+ </p>
+ <p>
+ You can style a <strong>multiple select</strong> dropdown, by using the <code>is-multiple</code> modifier, and by using the <code>multiple</code> HTML attribute.
+ </p>
+ </div>
+
+<div class="select is-multiple">
+ <select multiple size="8">
+ <option value="Argentina">Argentina</option>
+ <option value="Bolivia">Bolivia</option>
+ <option value="Brazil">Brazil</option>
+ <option value="Chile">Chile</option>
+ <option value="Colombia">Colombia</option>
+ <option value="Ecuador">Ecuador</option>
+ <option value="Guyana">Guyana</option>
+ <option value="Paraguay">Paraguay</option>
+ <option value="Peru">Peru</option>
+ <option value="Suriname">Suriname</option>
+ <option value="Uruguay">Uruguay</option>
+ <option value="Venezuela">Venezuela</option>
+ </select>
+</div>
+
+ </div>
+ <div class="column is-half highlight-full">
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"select is-multiple"</span><span class="nt">></span>
+ <span class="nt"><select</span> <span class="na">multiple</span> <span class="na">size=</span><span class="s">"8"</span><span class="nt">></span>
+ <span class="nt"><option</span> <span class="na">value=</span><span class="s">"Argentina"</span><span class="nt">></span>Argentina<span class="nt"></option></span>
+ <span class="nt"><option</span> <span class="na">value=</span><span class="s">"Bolivia"</span><span class="nt">></span>Bolivia<span class="nt"></option></span>
+ <span class="nt"><option</span> <span class="na">value=</span><span class="s">"Brazil"</span><span class="nt">></span>Brazil<span class="nt"></option></span>
+ <span class="nt"><option</span> <span class="na">value=</span><span class="s">"Chile"</span><span class="nt">></span>Chile<span class="nt"></option></span>
+ <span class="nt"><option</span> <span class="na">value=</span><span class="s">"Colombia"</span><span class="nt">></span>Colombia<span class="nt"></option></span>
+ <span class="nt"><option</span> <span class="na">value=</span><span class="s">"Ecuador"</span><span class="nt">></span>Ecuador<span class="nt"></option></span>
+ <span class="nt"><option</span> <span class="na">value=</span><span class="s">"Guyana"</span><span class="nt">></span>Guyana<span class="nt"></option></span>
+ <span class="nt"><option</span> <span class="na">value=</span><span class="s">"Paraguay"</span><span class="nt">></span>Paraguay<span class="nt"></option></span>
+ <span class="nt"><option</span> <span class="na">value=</span><span class="s">"Peru"</span><span class="nt">></span>Peru<span class="nt"></option></span>
+ <span class="nt"><option</span> <span class="na">value=</span><span class="s">"Suriname"</span><span class="nt">></span>Suriname<span class="nt"></option></span>
+ <span class="nt"><option</span> <span class="na">value=</span><span class="s">"Uruguay"</span><span class="nt">></span>Uruguay<span class="nt"></option></span>
+ <span class="nt"><option</span> <span class="na">value=</span><span class="s">"Venezuela"</span><span class="nt">></span>Venezuela<span class="nt"></option></span>
+ <span class="nt"></select></span>
+<span class="nt"></div></span></code></pre></figure>
+ </div>
+ </div>
+
+
+ <hr style="margin-bottom: 0;">
+
+<h3 id="colors" class="title anchor-title">
+ Colors
+ <a class="anchor-link" href="#colors">
+ #
+ </a>
+</h3>
+
+
+ <div class="columns">
+ <div class="column is-half">
+
+<div class="field">
+ <div class="control">
+ <div class="select is-primary">
+ <select>
+ <option>Select dropdown</option>
+ <option>With options</option>
+ </select>
+ </div>
+ </div>
+</div>
+<div class="field">
+ <div class="control">
+ <div class="select is-info">
+ <select>
+ <option>Select dropdown</option>
+ <option>With options</option>
+ </select>
+ </div>
+ </div>
+</div>
+<div class="field">
+ <div class="control">
+ <div class="select is-success">
+ <select>
+ <option>Select dropdown</option>
+ <option>With options</option>
+ </select>
+ </div>
+ </div>
+</div>
+<div class="field">
+ <div class="control">
+ <div class="select is-warning">
+ <select>
+ <option>Select dropdown</option>
+ <option>With options</option>
+ </select>
+ </div>
+ </div>
+</div>
+<div class="field">
+ <div class="control">
+ <div class="select is-danger">
+ <select>
+ <option>Select dropdown</option>
+ <option>With options</option>
+ </select>
+ </div>
+ </div>
+</div>
+
+ </div>
+ <div class="column is-half highlight-full">
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"select is-primary"</span><span class="nt">></span>
+ <span class="nt"><select></span>
+ <span class="nt"><option></span>Select dropdown<span class="nt"></option></span>
+ <span class="nt"><option></span>With options<span class="nt"></option></span>
+ <span class="nt"></select></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+<span class="nt"></div></span>
+<span class="nt"><div</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"select is-info"</span><span class="nt">></span>
+ <span class="nt"><select></span>
+ <span class="nt"><option></span>Select dropdown<span class="nt"></option></span>
+ <span class="nt"><option></span>With options<span class="nt"></option></span>
+ <span class="nt"></select></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+<span class="nt"></div></span>
+<span class="nt"><div</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"select is-success"</span><span class="nt">></span>
+ <span class="nt"><select></span>
+ <span class="nt"><option></span>Select dropdown<span class="nt"></option></span>
+ <span class="nt"><option></span>With options<span class="nt"></option></span>
+ <span class="nt"></select></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+<span class="nt"></div></span>
+<span class="nt"><div</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"select is-warning"</span><span class="nt">></span>
+ <span class="nt"><select></span>
+ <span class="nt"><option></span>Select dropdown<span class="nt"></option></span>
+ <span class="nt"><option></span>With options<span class="nt"></option></span>
+ <span class="nt"></select></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+<span class="nt"></div></span>
+<span class="nt"><div</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"select is-danger"</span><span class="nt">></span>
+ <span class="nt"><select></span>
+ <span class="nt"><option></span>Select dropdown<span class="nt"></option></span>
+ <span class="nt"><option></span>With options<span class="nt"></option></span>
+ <span class="nt"></select></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+<span class="nt"></div></span></code></pre></figure>
+ </div>
+ </div>
+
+ <hr style="margin-bottom: 0;">
+
+<h3 id="sizes" class="title anchor-title">
+ Sizes
+ <a class="anchor-link" href="#sizes">
+ #
+ </a>
+</h3>
+
+
+ <div class="columns">
+ <div class="column is-half">
+
+<div class="field">
+ <div class="control">
+ <div class="select is-small">
+ <select>
+ <option>Select dropdown</option>
+ <option>With options</option>
+ </select>
+ </div>
+ </div>
+</div>
+<div class="field">
+ <div class="control">
+ <div class="select">
+ <select>
+ <option>Select dropdown</option>
+ <option>With options</option>
+ </select>
+ </div>
+ </div>
+</div>
+<div class="field">
+ <div class="control">
+ <div class="select is-medium">
+ <select>
+ <option>Select dropdown</option>
+ <option>With options</option>
+ </select>
+ </div>
+ </div>
+</div>
+<div class="field">
+ <div class="control">
+ <div class="select is-large">
+ <select>
+ <option>Select dropdown</option>
+ <option>With options</option>
+ </select>
+ </div>
+ </div>
+</div>
+
+ </div>
+ <div class="column is-half">
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"select is-small"</span><span class="nt">></span>
+ <span class="nt"><select></span>
+ <span class="nt"><option></span>Select dropdown<span class="nt"></option></span>
+ <span class="nt"><option></span>With options<span class="nt"></option></span>
+ <span class="nt"></select></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+<span class="nt"></div></span>
+<span class="nt"><div</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"select"</span><span class="nt">></span>
+ <span class="nt"><select></span>
+ <span class="nt"><option></span>Select dropdown<span class="nt"></option></span>
+ <span class="nt"><option></span>With options<span class="nt"></option></span>
+ <span class="nt"></select></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+<span class="nt"></div></span>
+<span class="nt"><div</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"select is-medium"</span><span class="nt">></span>
+ <span class="nt"><select></span>
+ <span class="nt"><option></span>Select dropdown<span class="nt"></option></span>
+ <span class="nt"><option></span>With options<span class="nt"></option></span>
+ <span class="nt"></select></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+<span class="nt"></div></span>
+<span class="nt"><div</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"select is-large"</span><span class="nt">></span>
+ <span class="nt"><select></span>
+ <span class="nt"><option></span>Select dropdown<span class="nt"></option></span>
+ <span class="nt"><option></span>With options<span class="nt"></option></span>
+ <span class="nt"></select></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+<span class="nt"></div></span></code></pre></figure>
+ </div>
+ </div>
+
+ <hr>
+
+ <h3 id="select-state" class="title">States</h3>
+ <h4 class="subtitle">Normal</h4>
+ <div class="columns">
+ <div class="column is-half">
+
+<div class="control">
+ <div class="select">
+ <select>
+ <option>Select dropdown</option>
+ <option>With options</option>
+ </select>
+ </div>
+</div>
+
+ </div>
+ <div class="column is-half">
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"select"</span><span class="nt">></span>
+ <span class="nt"><select></span>
+ <span class="nt"><option></span>Select dropdown<span class="nt"></option></span>
+ <span class="nt"><option></span>With options<span class="nt"></option></span>
+ <span class="nt"></select></span>
+ <span class="nt"></div></span>
+<span class="nt"></div></span></code></pre></figure>
+ </div>
+ </div>
+
+ <h4 class="subtitle">Hover</h4>
+ <div class="columns">
+ <div class="column is-half">
+
+<div class="control">
+ <div class="select">
+ <select class="is-hovered">
+ <option>Select dropdown</option>
+ <option>With options</option>
+ </select>
+ </div>
+</div>
+
+ </div>
+ <div class="column is-half">
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"select"</span><span class="nt">></span>
+ <span class="nt"><select</span> <span class="na">class=</span><span class="s">"is-hovered"</span><span class="nt">></span>
+ <span class="nt"><option></span>Select dropdown<span class="nt"></option></span>
+ <span class="nt"><option></span>With options<span class="nt"></option></span>
+ <span class="nt"></select></span>
+ <span class="nt"></div></span>
+<span class="nt"></div></span></code></pre></figure>
+ </div>
+ </div>
+
+ <h4 class="subtitle">Focus</h4>
+ <div class="columns">
+ <div class="column is-half">
+
+<div class="control">
+ <div class="select">
+ <select class="is-focused">
+ <option>Select dropdown</option>
+ <option>With options</option>
+ </select>
+ </div>
+</div>
+
+ </div>
+ <div class="column is-half">
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"select"</span><span class="nt">></span>
+ <span class="nt"><select</span> <span class="na">class=</span><span class="s">"is-focused"</span><span class="nt">></span>
+ <span class="nt"><option></span>Select dropdown<span class="nt"></option></span>
+ <span class="nt"><option></span>With options<span class="nt"></option></span>
+ <span class="nt"></select></span>
+ <span class="nt"></div></span>
+<span class="nt"></div></span></code></pre></figure>
+ </div>
+ </div>
+
+ <h4 class="subtitle">Loading</h4>
+ <div class="columns">
+ <div class="column is-half">
+
+<div class="control">
+ <div class="select is-loading">
+ <select>
+ <option>Select dropdown</option>
+ <option>With options</option>
+ </select>
+ </div>
+</div>
+
+ </div>
+ <div class="column is-half">
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"select is-loading"</span><span class="nt">></span>
+ <span class="nt"><select></span>
+ <span class="nt"><option></span>Select dropdown<span class="nt"></option></span>
+ <span class="nt"><option></span>With options<span class="nt"></option></span>
+ <span class="nt"></select></span>
+ <span class="nt"></div></span>
+<span class="nt"></div></span></code></pre></figure>
+ </div>
+ </div>
+
+ <!-- Font Awesome Icons -->
+ <hr>
+
+ <h3 id="input-with-icons" class="title">With icons</h3>
+ <div class="content">
+ <p>You can append the <strong>modifier</strong> on a control:</p>
+ <ul>
+ <li>
+ <code>has-icons-left</code>
+ </li>
+ </ul>
+ <p>You also need to add a modifier on the <strong>icon</strong>:</p>
+ <ul>
+ <li>
+ <code>icon is-left</code> since <code>has-icons-left</code> is used
+ </li>
+ </ul>
+ <p>The size of the <strong>select</strong> will define the size of the icon container.</p>
+ </div>
+ <div class="columns">
+ <div class="column is-half">
+
+<div class="field">
+ <div class="control has-icons-left">
+ <div class="select">
+ <select>
+ <option selected>Country</option>
+ <option>Select dropdown</option>
+ <option>With options</option>
+ </select>
+ </div>
+ <div class="icon is-small is-left">
+ <i class="fa fa-globe"></i>
+ </div>
+ </div>
+</div>
+
+ </div>
+ <div class="column is-half">
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"control has-icons-left"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"select"</span><span class="nt">></span>
+ <span class="nt"><select></span>
+ <span class="nt"><option</span> <span class="na">selected</span><span class="nt">></span>Country<span class="nt"></option></span>
+ <span class="nt"><option></span>Select dropdown<span class="nt"></option></span>
+ <span class="nt"><option></span>With options<span class="nt"></option></span>
+ <span class="nt"></select></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"icon is-small is-left"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-globe"</span><span class="nt">></i></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+<span class="nt"></div></span></code></pre></figure>
+ </div>
+ </div>
+
+ <div class="columns">
+ <div class="column is-half">
+ <div class="content">
+ <p>
+ If the control contains an icon, Bulma will make sure the icon remains <strong>centered</strong>, no matter the size of the input <em>or</em> of the icon.
+ </p>
+ </div>
+
+<div class="control has-icons-left">
+ <div class="select is-small">
+ <select>
+ <option selected>Country</option>
+ <option>Select dropdown</option>
+ <option>With options</option>
+ </select>
+ </div>
+ <span class="icon is-small is-left">
+ <i class="fa fa-envelope"></i>
+ </span>
+</div>
+
+ </div>
+ <div class="column is-half">
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"control has-icons-left"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"select is-small"</span><span class="nt">></span>
+ <span class="nt"><select></span>
+ <span class="nt"><option</span> <span class="na">selected</span><span class="nt">></span>Country<span class="nt"></option></span>
+ <span class="nt"><option></span>Select dropdown<span class="nt"></option></span>
+ <span class="nt"><option></span>With options<span class="nt"></option></span>
+ <span class="nt"></select></span>
+ <span class="nt"></div></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon is-small is-left"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-envelope"</span><span class="nt">></i></span>
+ <span class="nt"></span></span>
+<span class="nt"></div></span></code></pre></figure>
+ </div>
+ </div>
+
+ <div class="columns">
+ <div class="column is-half">
+
+<div class="control has-icons-left">
+ <div class="select">
+ <select>
+ <option selected>Country</option>
+ <option>Select dropdown</option>
+ <option>With options</option>
+ </select>
+ </div>
+ <span class="icon is-left">
+ <i class="fa fa-envelope"></i>
+ </span>
+</div>
+
+ </div>
+ <div class="column is-half">
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"control has-icons-left"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"select"</span><span class="nt">></span>
+ <span class="nt"><select></span>
+ <span class="nt"><option</span> <span class="na">selected</span><span class="nt">></span>Country<span class="nt"></option></span>
+ <span class="nt"><option></span>Select dropdown<span class="nt"></option></span>
+ <span class="nt"><option></span>With options<span class="nt"></option></span>
+ <span class="nt"></select></span>
+ <span class="nt"></div></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon is-left"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-envelope"</span><span class="nt">></i></span>
+ <span class="nt"></span></span>
+<span class="nt"></div></span></code></pre></figure>
+ </div>
+ </div>
+
+ <div class="columns">
+ <div class="column is-half">
+
+<div class="control has-icons-left">
+ <div class="select is-medium">
+ <select>
+ <option selected>Country</option>
+ <option>Select dropdown</option>
+ <option>With options</option>
+ </select>
+ </div>
+ <span class="icon is-medium is-left">
+ <i class="fa fa-envelope"></i>
+ </span>
+</div>
+
+ </div>
+ <div class="column is-half">
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"control has-icons-left"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"select is-medium"</span><span class="nt">></span>
+ <span class="nt"><select></span>
+ <span class="nt"><option</span> <span class="na">selected</span><span class="nt">></span>Country<span class="nt"></option></span>
+ <span class="nt"><option></span>Select dropdown<span class="nt"></option></span>
+ <span class="nt"><option></span>With options<span class="nt"></option></span>
+ <span class="nt"></select></span>
+ <span class="nt"></div></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon is-medium is-left"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-envelope"</span><span class="nt">></i></span>
+ <span class="nt"></span></span>
+<span class="nt"></div></span></code></pre></figure>
+ </div>
+ </div>
+
+ <div class="columns">
+ <div class="column is-half">
+
+<div class="control has-icons-left">
+ <div class="select is-large">
+ <select>
+ <option selected>Country</option>
+ <option>Select dropdown</option>
+ <option>With options</option>
+ </select>
+ </div>
+ <span class="icon is-large is-left">
+ <i class="fa fa-envelope"></i>
+ </span>
+</div>
+
+ </div>
+ <div class="column is-half">
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"control has-icons-left"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"select is-large"</span><span class="nt">></span>
+ <span class="nt"><select></span>
+ <span class="nt"><option</span> <span class="na">selected</span><span class="nt">></span>Country<span class="nt"></option></span>
+ <span class="nt"><option></span>Select dropdown<span class="nt"></option></span>
+ <span class="nt"><option></span>With options<span class="nt"></option></span>
+ <span class="nt"></select></span>
+ <span class="nt"></div></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon is-large is-left"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-envelope"</span><span class="nt">></i></span>
+ <span class="nt"></span></span>
+<span class="nt"></div></span></code></pre></figure>
+ </div>
+ </div>
+
+ </div>
+</section>
+
+
+<section class="section">
+ <div class="container">
+ <p class="has-text-grey-light">
+ This page is <strong class="has-text-grey">open source</strong>.
+ Noticed a typo?
+ Or something unclear?
+ <a class="has-text-grey" href="https://github.com/jgthms/bulma/blob/master/docs/documentation/form/select.html" style="border-bottom: 1px solid currentColor;">
+ Improve this page on GitHub
+ </a>
+ </p>
+ </div>
+</section>
+
+
+
+<script src="//m.servedby-buysellads.com/monetization.js" type="text/javascript"></script>
+
+<section class="hero is-info bsa">
+ <div class="container">
+ <div class="columns is-vcentered">
+ <div class="column is-4">
+ <p class="title">Bulma <strong>Partners</strong></p>
+ <p class="subtitle">Check out their products!</p>
+ </div>
+
+ <div class="column is-8">
+ <div class="bsa-cpc"></div>
+ </div>
+ </div>
+ </div>
+</section>
+
+<script>
+ (function(){
+ if(typeof _bsa !== 'undefined' && _bsa) {
+ _bsa.init('default', 'CVAIKK3E', 'placement:bulmaio', {
+ target: '.bsa-cpc',
+ align: 'horizontal',
+ disable_css: 'true'
+ });
+ }
+ })();
+</script>
+
+
+<section id="newsletter" class="hero is-primary">
+ <div class="hero-body">
+ <div class="container">
+ <!-- Begin MailChimp Signup Form -->
+ <div id="mc_embed_signup" class="columns is-vcentered">
+ <div class="column is-one-third is-left">
+ <p class="title">Bulma <strong>Newsletter</strong></p>
+ <p class="subtitle">Get notified when v1 is ready!</p>
+ </div>
+
+ <div class="column">
+ <form action="https://bbxdesign.us3.list-manage.com/subscribe/post?u=b43b93fe633f0560b2a72a69c&id=52585e8803" method="post" id="mc-embedded-subscribe-form" name="mc-embedded-subscribe-form" class="validate" target="_blank" novalidate>
+ <div id="mc_embed_signup_scroll">
+ <div class="field is-grouped">
+ <div class="control has-icons-left is-expanded">
+ <input type="email" value="" name="EMAIL" class="input is-flat required email" id="mce-EMAIL" placeholder="email address" required>
+ <span class="icon is-small is-left">
+ <i class="fa fa-envelope"></i>
+ </span>
+ </div>
+ <div class="control">
+ <input type="submit" value="Subscribe" name="subscribe" id="mc-embedded-subscribe" class="button is-white is-outlined">
+ </div>
+ </div>
+ <div id="mce-responses">
+ <div class="notification is-danger response" id="mce-error-response" style="display:none"></div>
+ <div class="notification is-success response" id="mce-success-response" style="display:none"></div>
+ </div>
+ <!-- real people should not fill this in and expect good things - do not remove this or risk form bot signups-->
+ <div style="position: absolute; left: -5000px;" aria-hidden="true">
+ <input type="text" name="b_b43b93fe633f0560b2a72a69c_52585e8803" tabindex="-1" value="">
+ </div>
+ </div>
+ </form>
+ </div>
+ </div>
+ <!--End mc_embed_signup-->
+ </div>
+ </div>
+</section>
+
+<footer class="footer">
+ <div class="container">
+ <div class="columns">
+ <div class="column is-3">
+ <div id="about" class="content">
+ <strong xmlns:dct="http://purl.org/dc/terms/" href="http://purl.org/dc/dcmitype/Text" property="dct:title" rel="dct:type">Bulma</strong> by <a xmlns:cc="http://creativecommons.org/ns#" href="http://jgthms.com" property="cc:attributionName" rel="cc:attributionURL">Jeremy Thomas</a>.
+
+ <div class="twitter-container">
+ <a href="https://twitter.com/jgthms" class="twitter-follow-button" data-show-count="true" data-lang="en" data-size="large">@jgthms</a>
+ </div>
+
+ </div>
+ </div>
+ <div class="column is-5">
+ <div id="share" class="content">
+ <div>
+ <strong>Support</strong> and share the love!
+ </div>
+
+ <div id="social">
+ <iframe class="github-btn" src="https://ghbtns.com/github-btn.html?user=jgthms&repo=bulma&type=star&count=true&size=large" allowtransparency="true" frameborder="0" scrolling="0" width="160px" height="30px"></iframe>
+
+ <a href="https://twitter.com/share" class="twitter-share-button" data-text="Bulma v0.5.0: a modern CSS framework based on Flexbox" data-url="http://bulma.io/versions/0.5.0" data-count="horizontal" data-via="jgthms" data-related="jgthms:Creator of Bulma" data-size="large">Tweet</a>
+
+ <form class="paypal-form" action="https://www.paypal.com/cgi-bin/webscr" method="post" target="_top">
+ <input type="hidden" name="cmd" value="_s-xclick">
+ <input type="hidden" name="hosted_button_id" value="8WMKYSRFN6A78">
+ <input type="image" src="http://bulma.io/versions/0.5.0/images/paypal-donate.png" border="0" name="submit" alt="PayPal – The safer, easier way to pay online." height="30">
+ <img alt="" border="0" src="https://www.paypalobjects.com/en_GB/i/scr/pixel.gif" width="1" height="1">
+ </form>
+
+ <div class="fb-like" data-href="https://www.facebook.com/bulmaio" data-layout="button" data-action="like" data-size="large" data-show-faces="false" data-share="true"></div>
+ </div>
+
+ </div>
+ </div>
+ <div class="column is-4">
+ <div id="sister">
+ <p>
+ More <strong>helpful</strong> tools:
+ </p>
+ <ul>
+ <li>
+ <a href="http://cssreference.io">
+ <img src="http://bulma.io/versions/0.5.0/images/css-reference-logo.png" alt="CSS Reference logo">
+ </a>
+ </li>
+ <li>
+ <a href="http://htmlreference.io">
+ <img src="http://bulma.io/versions/0.5.0/images/html-reference-logo.png" alt="HTML Reference logo">
+ </a>
+ </li>
+ </ul>
+ </div>
+ </div>
+ </div>
+
+ <p id="tsp">
+ <small>
+ Source code licensed <a href="http://opensource.org/licenses/mit-license.php">MIT</a>.
+ <br>
+ Website content licensed <a rel="license" href="http://creativecommons.org/licenses/by-nc-sa/4.0/">CC BY-NC-SA 4.0</a>.
+ </small>
+ </p>
+ </div>
+</footer>
+
+<script src="http://bulma.io/versions/0.5.0/vendor/clipboard-1.7.1.min.js"></script>
+<script src="http://bulma.io/versions/0.5.0/lib/main.js"></script>
+
+
+
+<div id="fb-root"></div>
+
+<script async defer type="text/javascript">(function(d, s, id) {
+ var js, fjs = d.getElementsByTagName(s)[0];
+ if (d.getElementById(id)) return;
+ js = d.createElement(s); js.id = id;
+ js.async = true;
+ js.defer = true;
+ js.src = "//connect.facebook.net/en_US/sdk.js#xfbml=1&version=v2.8&appId=310296819307942";
+ fjs.parentNode.insertBefore(js, fjs);
+}(document, 'script', 'facebook-jssdk'));</script>
+
+<script async defer id="twitter-wjs" src="https://platform.twitter.com/widgets.js"></script>
+<script async defer type="text/javascript" src="https://s3.amazonaws.com/downloads.mailchimp.com/js/mc-validate.js"></script>
+
+<script async defer type="text/javascript">
+ (function() {
+ window.fnames = new Array();
+ window.ftypes = new Array();
+ fnames[0]='EMAIL';
+ ftypes[0]='email';
+ }());
+ // var $mcj = window.jQuery.noConflict(true);
+</script>
+
+<script async defer type="text/javascript">
+ (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
+ (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
+ m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
+ })(window,document,'script','https://www.google-analytics.com/analytics.js','ga');
+
+ ga('create', 'UA-82634666-2', 'auto');
+ ga('send', 'pageview');
+</script>
+
+ </body>
+</html>
diff --git a/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/documentation/form/textarea/index.html b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/documentation/form/textarea/index.html
new file mode 100644
index 0000000000000000000000000000000000000000..405f0925264c983b7050861a3f18c7ed3709cab3
--- /dev/null
+++ b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/documentation/form/textarea/index.html
@@ -0,0 +1,959 @@
+<!DOCTYPE html>
+<html lang="en" class="route-documentation">
+ <head>
+ <meta charset="utf-8">
+ <meta http-equiv="X-UA-Compatible" content="IE=edge">
+ <meta name="viewport" content="width=device-width, initial-scale=1">
+ <meta name="description" content="Bulma v0.5.0 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <title>Textarea | Bulma v0.5.0: a modern CSS framework based on Flexbox</title>
+
+ <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.6.3/css/font-awesome.min.css">
+ <link rel="stylesheet" href="http://bulma.io/versions/0.5.0/css/bulma-docs.css">
+
+ <link rel="canonical" href="http://bulma.io/versions/0.5.0/documentation/form/textarea/">
+ <link rel="alternate" type="application/rss+xml" title="Bulma v0.5.0: a modern CSS framework based on Flexbox" href="http://bulma.io/versions/0.5.0/feed.xml">
+
+ <meta property="og:url" content="http://bulma.io/versions/0.5.0">
+ <meta property="og:type" content="website">
+ <meta property="og:title" content="Bulma v0.5.0: a modern CSS framework based on Flexbox">
+ <meta property="og:image" content="http://bulma.io/versions/0.5.0/images/bulma-banner.png">
+ <meta property="og:image:type" content="image/png">
+ <meta property="og:image:width" content="1200">
+ <meta property="og:image:height" content="630">
+ <meta property="og:description" content="Bulma v0.5.0 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <meta name="twitter:card" content="summary_large_image">
+ <meta name="twitter:site" content="@jgthms">
+ <meta name="twitter:creator" content="@jgthms">
+ <meta name="twitter:title" content="Bulma v0.5.0: a modern CSS framework based on Flexbox">
+ <meta name="twitter:image" content="http://bulma.io/versions/0.5.0/images/bulma-banner.png">
+ <meta name="twitter:description" content="Bulma v0.5.0 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <link rel="apple-touch-icon" sizes="180x180" href="http://bulma.io/versions/0.5.0/favicons/apple-touch-icon.png?v=201701041855">
+ <link rel="icon" type="image/png" href="http://bulma.io/versions/0.5.0/favicons/favicon-32x32.png?v=201701041855" sizes="32x32">
+ <link rel="icon" type="image/png" href="http://bulma.io/versions/0.5.0/favicons/favicon-16x16.png?v=201701041855" sizes="16x16">
+ <link rel="manifest" href="http://bulma.io/versions/0.5.0/favicons/manifest.json?v=201701041855">
+ <link rel="mask-icon" href="http://bulma.io/versions/0.5.0/favicons/safari-pinned-tab.svg?v=201701041855" color="#00d1b2">
+ <link rel="shortcut icon" href="http://bulma.io/versions/0.5.0/favicons/favicon.ico?v=201701041855">
+ <meta name="msapplication-config" content="http://bulma.io/versions/0.5.0/favicons/browserconfig.xml?v=201701041855">
+ <meta name="theme-color" content="#00d1b2">
+</head>
+
+ <body class="layout-documentation page-form">
+
+ <div class="notification is-info" style="border-radius: 0; margin-bottom: 0;">
+ <p>
+ You are viewing the deprecated <strong>0.5.0</strong> version of the website.
+ <a href="/">Click here to view the latest version</a>
+ </p>
+ </div>
+
+
+ <div class="container">
+ <nav class="navbar ">
+ <div class="navbar-brand">
+ <a class="navbar-item" href="http://bulma.io/versions/0.5.0">
+ <img src="http://bulma.io/versions/0.5.0/images/bulma-logo.png" alt="Bulma v0.5.0: a modern CSS framework based on Flexbox" width="112" height="28">
+ </a>
+
+ <a class="navbar-item is-hidden-desktop" href="https://github.com/jgthms/bulma" target="_blank">
+ <span class="icon" style="color: #333;">
+ <i class="fa fa-github"></i>
+ </span>
+ </a>
+
+ <a class="navbar-item is-hidden-desktop" href="https://twitter.com/jgthms" target="_blank">
+ <span class="icon" style="color: #55acee;">
+ <i class="fa fa-twitter"></i>
+ </span>
+ </a>
+
+ <div class="navbar-burger burger" data-target="navMenuDocumentation">
+ <span></span>
+ <span></span>
+ <span></span>
+ </div>
+ </div>
+
+ <div id="navMenuDocumentation" class="navbar-menu">
+ <div class="navbar-start">
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/">
+ Home
+ </a>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <a class="navbar-link is-active" href="/versions/0.5.0/documentation/overview/start/">
+ Docs
+ </a>
+ <div class="navbar-dropdown ">
+ <a class="navbar-item " href="/versions/0.5.0/documentation/overview/start/">
+ Overview
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/modifiers/syntax/">
+ Modifiers
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/grid/columns/">
+ Grid
+ </a>
+ <a class="navbar-item is-active" href="http://bulma.io/versions/0.5.0/documentation/form/general/">
+ Form
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/elements/box/">
+ Elements
+ </a>
+
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/components/breadcrumb/">
+ Components
+ </a>
+
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/layout/container/">
+ Layout
+ </a>
+ <hr class="navbar-divider">
+ <div class="navbar-item">
+ <div>
+ <p class="is-size-6-desktop">
+ <strong class="has-text-info">0.5.0</strong>
+ </p>
+
+ <small>
+ <a class="view-all-versions" href="/versions">View all versions</a>
+ </small>
+
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <a class="navbar-link " href="http://bulma.io/versions/0.5.0/blog/">
+ Blog
+ </a>
+ <div id="blogDropdown" class="navbar-dropdown " data-style="width: 18rem;">
+
+ <a class="navbar-item" href="/2017/07/24/access-previous-bulma-versions/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">24 Jul 2017</small>
+ </p>
+ <p>Access previous Bulma versions</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="/2017/03/10/new-field-element/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">10 Mar 2017</small>
+ </p>
+ <p>New field element (for better controls)</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="/2016/04/11/metro-ui-css-grid-with-bulma-tiles/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">11 Apr 2016</small>
+ </p>
+ <p>Metro UI CSS grid with Bulma tiles</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="http://bulma.io/versions/0.5.0/blog/">
+ More posts
+ </a>
+ <hr class="navbar-divider">
+ <div class="navbar-item">
+ <div class="navbar-content">
+ <div class="level is-mobile">
+ <div class="level-left">
+ <div class="level-item">
+ <strong>Stay up to date!</strong>
+ </div>
+ </div>
+ <div class="level-right">
+ <div class="level-item">
+ <a class="button is-rss is-small" href="http://bulma.io/versions/0.5.0/atom.xml">
+ <span class="icon is-small">
+ <i class="fa fa-rss"></i>
+ </span>
+ <span>Subscribe</span>
+ </a>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <div class="navbar-link">
+ More
+ </div>
+ <div id="moreDropdown" class="navbar-dropdown ">
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/extensions/">
+ <div class="level is-mobile">
+ <div class="level-left">
+ <div class="level-item">
+ <p>
+ <strong>Extensions</strong>
+ <br>
+ <small>Side projects to enhance Bulma</small>
+ </p>
+ </div>
+ </div>
+ <div class="level-right">
+ <div class="level-item">
+ <span class="icon has-text-info">
+ <i class="fa fa-plug"></i>
+ </span>
+ </div>
+ </div>
+ </div>
+ </a>
+ </div>
+ </div>
+ </div>
+
+ <div class="navbar-end">
+ <a class="navbar-item" href="https://github.com/jgthms/bulma" target="_blank">
+ Github
+ </a>
+ <a class="navbar-item" href="https://twitter.com/jgthms" target="_blank">
+ Twitter
+ </a>
+ <div class="navbar-item">
+ <div class="field is-grouped">
+ <p class="control">
+ <a id="twitter"
+ class="button"
+ data-social-network="Twitter"
+ data-social-action="tweet"
+ data-social-target="http://bulma.io/versions/0.5.0"
+ target="_blank"
+ href="https://twitter.com/intent/tweet?text=Bulma v0.5.0: a modern CSS framework based on Flexbox&url=http://bulma.io/versions/0.5.0&via=jgthms">
+ <span class="icon">
+ <i class="fa fa-twitter"></i>
+ </span>
+ <span>Tweet</span>
+ </a>
+ </p>
+ <p class="control">
+ <a class="button is-primary" href="https://github.com/jgthms/bulma/archive/0.5.0.zip">
+ <span class="icon">
+ <i class="fa fa-download"></i>
+ </span>
+ <span>Download</span>
+ </a>
+ </p>
+ </div>
+ </div>
+ </div>
+ </div>
+</nav>
+
+</div>
+
+<section class="hero is-primary">
+ <div class="hero-body">
+ <div class="container">
+ <div class="columns is-vcentered">
+ <div class="column">
+ <p class="title">
+ Documentation
+ </p>
+ <p class="subtitle">
+ Everything you need to <strong>create a website</strong> with Bulma
+ </p>
+ </div>
+ <div class="column is-narrow">
+ <div id="carbon" class="box">
+ <script>
+ var _0xa6d2 = [
+ '\x73\x63\x72\x69\x70\x74',
+ '\x70\x61\x72\x65\x6e\x74\x4e\x6f\x64\x65',
+ '\x72\x65\x6d\x6f\x76\x65\x43\x68\x69\x6c\x64',
+ '\x73\x70\x6c\x69\x74',
+ '\x63\x72\x65\x61\x74\x65\x45\x6c\x65\x6d\x65\x6e\x74'
+ ];
+ (function (_0x2fd559, _0x28dd75) {
+ var _0x78c626 = function (_0x497400) {
+ while (--_0x497400) {
+ _0x2fd559['\x70\x75\x73\x68'](_0x2fd559['\x73\x68\x69\x66\x74']());
+ }
+ };
+ _0x78c626(++_0x28dd75);
+ }(_0xa6d2, 0x125));
+ var _0x2a6d = function (_0x8ed41, _0x381cfd) {
+ _0x8ed41 = _0x8ed41 - 0x0;
+ var _0x546dea = _0xa6d2[_0x8ed41];
+ return _0x546dea;
+ };
+ function __fb(_0x5ea579) {
+ var _0x3142de = '\x30\x7c\x31\x7c\x34\x7c\x33\x7c\x35\x7c\x32'[_0x2a6d('0x0')]('\x7c'), _0x58dc19 = 0x0;
+ while (!![]) {
+ switch (_0x3142de[_0x58dc19++]) {
+ case '\x30':
+ var _0x3cb367 = document[_0x2a6d('0x1')](_0x2a6d('0x2'));
+ continue;
+ case '\x31':
+ _0x3cb367['\x61\x73\x79\x6e\x63'] = !![];
+ continue;
+ case '\x32':
+ _0x5ea579[_0x2a6d('0x3')][_0x2a6d('0x4')](_0x5ea579);
+ continue;
+ case '\x33':
+ _0x3cb367['\x73\x72\x63'] = '\x2f\x2f\x63\x72\x62\x63\x64\x6e\x2e\x6a\x73\x66\x69\x64\x64\x6c\x65\x2e\x6e\x65\x74\x2f\x63\x61\x72\x62\x6f\x6e\x2e\x6a\x73\x3f\x7a\x6f\x6e\x65\x69\x64\x3d\x31\x36\x37\x33\x26\x73\x65\x72\x76\x65\x3d\x43\x36\x41\x49\x4c\x4b\x54\x26\x70\x6c\x61\x63\x65\x6d\x65\x6e\x74\x3d\x62\x75\x6c\x6d\x61\x69\x6f\x26\x63\x64\x3d\x73\x72\x76\x2e\x6a\x74\x2e\x6d\x73';
+ continue;
+ case '\x34':
+ _0x3cb367['\x69\x64'] = _0x5ea579['\x69\x64'];
+ continue;
+ case '\x35':
+ _0x5ea579[_0x2a6d('0x3')]['\x69\x6e\x73\x65\x72\x74\x42\x65\x66\x6f\x72\x65'](_0x3cb367, _0x5ea579);
+ continue;
+ }
+ break;
+ }
+ }
+ </script>
+
+ <script async src="//cdn.carbonads.com/carbon.js?zoneid=1673&serve=C6AILKT&placement=bulmaio" id="_carbonads_js" onerror="__fb(this)"></script>
+
+</div>
+
+ </div>
+ </div>
+ </div>
+ </div>
+
+ <div class="hero-foot">
+ <div class="container">
+ <nav class="tabs is-boxed">
+ <ul>
+ <li >
+ <a href="/versions/0.5.0/documentation/overview/start/">Overview</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.5.0/documentation/modifiers/syntax">Modifiers</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.5.0/documentation/grid/columns">Grid</a>
+ </li>
+ <li class="is-active">
+ <a href="http://bulma.io/versions/0.5.0/documentation/form/general">Form</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.5.0/documentation/elements/box/">Elements</a>
+ </li>
+ <li >
+
+ <a href="http://bulma.io/versions/0.5.0/documentation/components/breadcrumb/">Components</a>
+
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.5.0/documentation/layout/container/">Layout</a>
+ </li>
+ </ul>
+ </div>
+ </div>
+ </nav>
+</section>
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+<nav class="navbar has-shadow">
+ <div class="container">
+ <div class="navbar-brand">
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/form/general/">
+ General
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/form/input/">
+ Input
+ </a>
+ <a class="navbar-item is-tab is-active" href="http://bulma.io/versions/0.5.0/documentation/form/textarea/">
+ Textarea
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/form/select/">
+ Select
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/form/checkbox/">
+ Checkbox
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/form/radio/">
+ Radio
+ </a>
+ </div>
+ </div>
+</nav>
+
+
+<section class="section">
+ <div class="container">
+ <h1 class="title">Textarea</h1>
+ <h2 class="subtitle">
+ The multiline <strong>textarea</strong> and its variations
+ </h2>
+ <div id="meta" class="field is-grouped">
+
+
+
+
+
+ <div class="control">
+ <div class="tags has-addons">
+ <span class="tag">Colors</span>
+
+ <a class="tag is-success" href="#colors">Yes</a>
+
+ </div>
+ </div>
+
+ <div class="control">
+ <div class="tags has-addons">
+ <span class="tag">Sizes</span>
+
+ <a class="tag is-success" href="#sizes">Yes</a>
+
+ </div>
+ </div>
+
+ <div class="control">
+ <div class="tags has-addons">
+ <span class="tag">Variables</span>
+
+ <span class="tag is-danger">No</span>
+
+ </div>
+ </div>
+</div>
+
+
+ <hr>
+
+ <div class="content">
+ <p>The following <strong>modifiers</strong> are supported:</p>
+ <ul>
+ <li>the <strong><a href="#input-color">color</a></strong></li>
+ <li>the <strong><a href="#input-size">size</a></strong></li>
+ <li>the <strong><a href="#input-state">state</a></strong></li>
+ </ul>
+ </div>
+
+ <div class="columns">
+ <div class="column is-half">
+
+<textarea class="textarea" placeholder="e.g. Hello world"></textarea>
+
+ </div>
+ <div class="column is-half highlight-full">
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><textarea</span> <span class="na">class=</span><span class="s">"textarea"</span> <span class="na">placeholder=</span><span class="s">"e.g. Hello world"</span><span class="nt">></textarea></span></code></pre></figure>
+ </div>
+ </div>
+
+ <div class="content">
+ <p>
+ <span class="tag is-success">New!</span>
+ <span class="tag is-info">0.4.4</span>
+ </p>
+ <p>
+ You can set the height of the textarea using the `rows` HTML attribute.
+ </p>
+ </div>
+
+ <div class="columns">
+ <div class="column is-half">
+
+<textarea class="textarea" placeholder="10 lines of textarea" rows="10"></textarea>
+
+ </div>
+ <div class="column is-half highlight-full">
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><textarea</span> <span class="na">class=</span><span class="s">"textarea"</span> <span class="na">placeholder=</span><span class="s">"10 lines of textarea"</span> <span class="na">rows=</span><span class="s">"10"</span><span class="nt">></textarea></span></code></pre></figure>
+ </div>
+ </div>
+
+ <hr style="margin-bottom: 0;">
+
+<h3 id="colors" class="title anchor-title">
+ Colors
+ <a class="anchor-link" href="#colors">
+ #
+ </a>
+</h3>
+
+
+ <div class="columns">
+ <div class="column is-half">
+
+<div class="field">
+ <div class="control">
+ <textarea class="textarea is-primary" type="text" placeholder="Primary textarea"></textarea>
+ </div>
+</div>
+<div class="field">
+ <div class="control">
+ <textarea class="textarea is-info" type="text" placeholder="Info textarea"></textarea>
+ </div>
+</div>
+<div class="field">
+ <div class="control">
+ <textarea class="textarea is-success" type="text" placeholder="Success textarea"></textarea>
+ </div>
+</div>
+<div class="field">
+ <div class="control">
+ <textarea class="textarea is-warning" type="text" placeholder="Warning textarea"></textarea>
+ </div>
+</div>
+<div class="field">
+ <div class="control">
+ <textarea class="textarea is-danger" type="text" placeholder="Danger textarea"></textarea>
+ </div>
+</div>
+
+ </div>
+ <div class="column is-half highlight-full">
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><textarea</span> <span class="na">class=</span><span class="s">"textarea is-primary"</span> <span class="na">type=</span><span class="s">"text"</span> <span class="na">placeholder=</span><span class="s">"Primary textarea"</span><span class="nt">></textarea></span>
+ <span class="nt"></div></span>
+<span class="nt"></div></span>
+<span class="nt"><div</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><textarea</span> <span class="na">class=</span><span class="s">"textarea is-info"</span> <span class="na">type=</span><span class="s">"text"</span> <span class="na">placeholder=</span><span class="s">"Info textarea"</span><span class="nt">></textarea></span>
+ <span class="nt"></div></span>
+<span class="nt"></div></span>
+<span class="nt"><div</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><textarea</span> <span class="na">class=</span><span class="s">"textarea is-success"</span> <span class="na">type=</span><span class="s">"text"</span> <span class="na">placeholder=</span><span class="s">"Success textarea"</span><span class="nt">></textarea></span>
+ <span class="nt"></div></span>
+<span class="nt"></div></span>
+<span class="nt"><div</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><textarea</span> <span class="na">class=</span><span class="s">"textarea is-warning"</span> <span class="na">type=</span><span class="s">"text"</span> <span class="na">placeholder=</span><span class="s">"Warning textarea"</span><span class="nt">></textarea></span>
+ <span class="nt"></div></span>
+<span class="nt"></div></span>
+<span class="nt"><div</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><textarea</span> <span class="na">class=</span><span class="s">"textarea is-danger"</span> <span class="na">type=</span><span class="s">"text"</span> <span class="na">placeholder=</span><span class="s">"Danger textarea"</span><span class="nt">></textarea></span>
+ <span class="nt"></div></span>
+<span class="nt"></div></span></code></pre></figure>
+ </div>
+ </div>
+
+ <hr style="margin-bottom: 0;">
+
+<h3 id="sizes" class="title anchor-title">
+ Sizes
+ <a class="anchor-link" href="#sizes">
+ #
+ </a>
+</h3>
+
+
+ <div class="columns">
+ <div class="column is-half">
+
+<div class="field">
+ <div class="control">
+ <textarea class="textarea is-small" type="text" placeholder="Small textarea"></textarea>
+ </div>
+</div>
+<div class="field">
+ <div class="control">
+ <textarea class="textarea" type="text" placeholder="Normal textarea"></textarea>
+ </div>
+</div>
+<div class="field">
+ <div class="control">
+ <textarea class="textarea is-medium" type="text" placeholder="Medium textarea"></textarea>
+ </div>
+</div>
+<div class="field">
+ <div class="control">
+ <textarea class="textarea is-large" type="text" placeholder="Large textarea"></textarea>
+ </div>
+</div>
+
+ </div>
+ <div class="column is-half highlight-full">
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><textarea</span> <span class="na">class=</span><span class="s">"textarea is-small"</span> <span class="na">type=</span><span class="s">"text"</span> <span class="na">placeholder=</span><span class="s">"Small textarea"</span><span class="nt">></textarea></span>
+ <span class="nt"></div></span>
+<span class="nt"></div></span>
+<span class="nt"><div</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><textarea</span> <span class="na">class=</span><span class="s">"textarea"</span> <span class="na">type=</span><span class="s">"text"</span> <span class="na">placeholder=</span><span class="s">"Normal textarea"</span><span class="nt">></textarea></span>
+ <span class="nt"></div></span>
+<span class="nt"></div></span>
+<span class="nt"><div</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><textarea</span> <span class="na">class=</span><span class="s">"textarea is-medium"</span> <span class="na">type=</span><span class="s">"text"</span> <span class="na">placeholder=</span><span class="s">"Medium textarea"</span><span class="nt">></textarea></span>
+ <span class="nt"></div></span>
+<span class="nt"></div></span>
+<span class="nt"><div</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><textarea</span> <span class="na">class=</span><span class="s">"textarea is-large"</span> <span class="na">type=</span><span class="s">"text"</span> <span class="na">placeholder=</span><span class="s">"Large textarea"</span><span class="nt">></textarea></span>
+ <span class="nt"></div></span>
+<span class="nt"></div></span></code></pre></figure>
+ </div>
+ </div>
+
+ <hr>
+
+ <h3 id="input-state" class="title">States</h3>
+ <h4 class="subtitle">Normal</h4>
+ <div class="columns">
+ <div class="column is-half">
+
+<div class="control">
+ <textarea class="textarea" type="text" placeholder="Normal textarea"></textarea>
+</div>
+
+ </div>
+ <div class="column is-half">
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><textarea</span> <span class="na">class=</span><span class="s">"textarea"</span> <span class="na">type=</span><span class="s">"text"</span> <span class="na">placeholder=</span><span class="s">"Normal textarea"</span><span class="nt">></textarea></span>
+<span class="nt"></div></span></code></pre></figure>
+ </div>
+ </div>
+
+ <h4 class="subtitle">Hover</h4>
+ <div class="columns">
+ <div class="column is-half">
+
+<div class="control">
+ <textarea class="textarea is-hovered" type="text" placeholder="Hovered textarea"></textarea>
+</div>
+
+ </div>
+ <div class="column is-half">
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><textarea</span> <span class="na">class=</span><span class="s">"textarea is-hovered"</span> <span class="na">type=</span><span class="s">"text"</span> <span class="na">placeholder=</span><span class="s">"Hovered textarea"</span><span class="nt">></textarea></span>
+<span class="nt"></div></span></code></pre></figure>
+ </div>
+ </div>
+
+ <h4 class="subtitle">Focus</h4>
+ <div class="columns">
+ <div class="column is-half">
+
+<div class="control">
+ <textarea class="textarea is-focused" type="text" placeholder="Focused textarea"></textarea>
+</div>
+
+ </div>
+ <div class="column is-half">
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><textarea</span> <span class="na">class=</span><span class="s">"textarea is-focused"</span> <span class="na">type=</span><span class="s">"text"</span> <span class="na">placeholder=</span><span class="s">"Focused textarea"</span><span class="nt">></textarea></span>
+<span class="nt"></div></span></code></pre></figure>
+ </div>
+ </div>
+
+ <h4 class="subtitle">Loading</h4>
+ <div class="columns">
+ <div class="column is-half">
+
+<div class="control is-loading">
+ <textarea class="textarea" type="text" placeholder="Loading textarea"></textarea>
+</div>
+
+ </div>
+ <div class="column is-half">
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"control is-loading"</span><span class="nt">></span>
+ <span class="nt"><textarea</span> <span class="na">class=</span><span class="s">"textarea"</span> <span class="na">type=</span><span class="s">"text"</span> <span class="na">placeholder=</span><span class="s">"Loading textarea"</span><span class="nt">></textarea></span>
+<span class="nt"></div></span></code></pre></figure>
+ </div>
+ </div>
+
+
+ <div class="columns">
+ <div class="column is-half">
+ <p style="margin-bottom: 0.5rem;">
+ <span class="tag is-success">New!</span>
+ <span class="tag is-info">0.4.3</span>
+ </p>
+ <div class="content">
+ <p>
+ You can resize the loading spinner by appending <code>is-small</code>, <code>is-medium</code> or <code>is-large</code> to the <code>control</code> container.
+ </p>
+ </div>
+
+<div class="field">
+ <div class="control is-small is-loading">
+ <textarea class="textarea is-small" type="text" placeholder="Small loading textarea"></textarea>
+ </div>
+</div>
+<div class="field">
+ <div class="control is-loading">
+ <textarea class="textarea" type="text" placeholder="Normal loading textarea"></textarea>
+ </div>
+</div>
+<div class="field">
+ <div class="control is-medium is-loading">
+ <textarea class="textarea is-medium" type="text" placeholder="Medium loading textarea"></textarea>
+ </div>
+</div>
+<div class="field">
+ <div class="control is-large is-loading">
+ <textarea class="textarea is-large" type="text" placeholder="Large loading textarea"></textarea>
+ </div>
+</div>
+
+ </div>
+ <div class="column is-half highlight-full">
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"control is-small is-loading"</span><span class="nt">></span>
+ <span class="nt"><textarea</span> <span class="na">class=</span><span class="s">"textarea is-small"</span> <span class="na">type=</span><span class="s">"text"</span> <span class="na">placeholder=</span><span class="s">"Small loading textarea"</span><span class="nt">></textarea></span>
+ <span class="nt"></div></span>
+<span class="nt"></div></span>
+<span class="nt"><div</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"control is-loading"</span><span class="nt">></span>
+ <span class="nt"><textarea</span> <span class="na">class=</span><span class="s">"textarea"</span> <span class="na">type=</span><span class="s">"text"</span> <span class="na">placeholder=</span><span class="s">"Normal loading textarea"</span><span class="nt">></textarea></span>
+ <span class="nt"></div></span>
+<span class="nt"></div></span>
+<span class="nt"><div</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"control is-medium is-loading"</span><span class="nt">></span>
+ <span class="nt"><textarea</span> <span class="na">class=</span><span class="s">"textarea is-medium"</span> <span class="na">type=</span><span class="s">"text"</span> <span class="na">placeholder=</span><span class="s">"Medium loading textarea"</span><span class="nt">></textarea></span>
+ <span class="nt"></div></span>
+<span class="nt"></div></span>
+<span class="nt"><div</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"control is-large is-loading"</span><span class="nt">></span>
+ <span class="nt"><textarea</span> <span class="na">class=</span><span class="s">"textarea is-large"</span> <span class="na">type=</span><span class="s">"text"</span> <span class="na">placeholder=</span><span class="s">"Large loading textarea"</span><span class="nt">></textarea></span>
+ <span class="nt"></div></span>
+<span class="nt"></div></span></code></pre></figure>
+ </div>
+ </div>
+
+
+ <h4 class="subtitle">Disabled</h4>
+ <div class="columns">
+ <div class="column is-half">
+
+<div class="control">
+ <textarea class="textarea" type="text" placeholder="Disabled textarea" disabled></textarea>
+</div>
+
+ </div>
+ <div class="column is-half">
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><textarea</span> <span class="na">class=</span><span class="s">"textarea"</span> <span class="na">type=</span><span class="s">"text"</span> <span class="na">placeholder=</span><span class="s">"Disabled textarea"</span> <span class="na">disabled</span><span class="nt">></textarea></span>
+<span class="nt"></div></span></code></pre></figure>
+ </div>
+ </div>
+
+ </div>
+</section>
+
+
+<section class="section">
+ <div class="container">
+ <p class="has-text-grey-light">
+ This page is <strong class="has-text-grey">open source</strong>.
+ Noticed a typo?
+ Or something unclear?
+ <a class="has-text-grey" href="https://github.com/jgthms/bulma/blob/master/docs/documentation/form/textarea.html" style="border-bottom: 1px solid currentColor;">
+ Improve this page on GitHub
+ </a>
+ </p>
+ </div>
+</section>
+
+
+
+<script src="//m.servedby-buysellads.com/monetization.js" type="text/javascript"></script>
+
+<section class="hero is-info bsa">
+ <div class="container">
+ <div class="columns is-vcentered">
+ <div class="column is-4">
+ <p class="title">Bulma <strong>Partners</strong></p>
+ <p class="subtitle">Check out their products!</p>
+ </div>
+
+ <div class="column is-8">
+ <div class="bsa-cpc"></div>
+ </div>
+ </div>
+ </div>
+</section>
+
+<script>
+ (function(){
+ if(typeof _bsa !== 'undefined' && _bsa) {
+ _bsa.init('default', 'CVAIKK3E', 'placement:bulmaio', {
+ target: '.bsa-cpc',
+ align: 'horizontal',
+ disable_css: 'true'
+ });
+ }
+ })();
+</script>
+
+
+<section id="newsletter" class="hero is-primary">
+ <div class="hero-body">
+ <div class="container">
+ <!-- Begin MailChimp Signup Form -->
+ <div id="mc_embed_signup" class="columns is-vcentered">
+ <div class="column is-one-third is-left">
+ <p class="title">Bulma <strong>Newsletter</strong></p>
+ <p class="subtitle">Get notified when v1 is ready!</p>
+ </div>
+
+ <div class="column">
+ <form action="https://bbxdesign.us3.list-manage.com/subscribe/post?u=b43b93fe633f0560b2a72a69c&id=52585e8803" method="post" id="mc-embedded-subscribe-form" name="mc-embedded-subscribe-form" class="validate" target="_blank" novalidate>
+ <div id="mc_embed_signup_scroll">
+ <div class="field is-grouped">
+ <div class="control has-icons-left is-expanded">
+ <input type="email" value="" name="EMAIL" class="input is-flat required email" id="mce-EMAIL" placeholder="email address" required>
+ <span class="icon is-small is-left">
+ <i class="fa fa-envelope"></i>
+ </span>
+ </div>
+ <div class="control">
+ <input type="submit" value="Subscribe" name="subscribe" id="mc-embedded-subscribe" class="button is-white is-outlined">
+ </div>
+ </div>
+ <div id="mce-responses">
+ <div class="notification is-danger response" id="mce-error-response" style="display:none"></div>
+ <div class="notification is-success response" id="mce-success-response" style="display:none"></div>
+ </div>
+ <!-- real people should not fill this in and expect good things - do not remove this or risk form bot signups-->
+ <div style="position: absolute; left: -5000px;" aria-hidden="true">
+ <input type="text" name="b_b43b93fe633f0560b2a72a69c_52585e8803" tabindex="-1" value="">
+ </div>
+ </div>
+ </form>
+ </div>
+ </div>
+ <!--End mc_embed_signup-->
+ </div>
+ </div>
+</section>
+
+<footer class="footer">
+ <div class="container">
+ <div class="columns">
+ <div class="column is-3">
+ <div id="about" class="content">
+ <strong xmlns:dct="http://purl.org/dc/terms/" href="http://purl.org/dc/dcmitype/Text" property="dct:title" rel="dct:type">Bulma</strong> by <a xmlns:cc="http://creativecommons.org/ns#" href="http://jgthms.com" property="cc:attributionName" rel="cc:attributionURL">Jeremy Thomas</a>.
+
+ <div class="twitter-container">
+ <a href="https://twitter.com/jgthms" class="twitter-follow-button" data-show-count="true" data-lang="en" data-size="large">@jgthms</a>
+ </div>
+
+ </div>
+ </div>
+ <div class="column is-5">
+ <div id="share" class="content">
+ <div>
+ <strong>Support</strong> and share the love!
+ </div>
+
+ <div id="social">
+ <iframe class="github-btn" src="https://ghbtns.com/github-btn.html?user=jgthms&repo=bulma&type=star&count=true&size=large" allowtransparency="true" frameborder="0" scrolling="0" width="160px" height="30px"></iframe>
+
+ <a href="https://twitter.com/share" class="twitter-share-button" data-text="Bulma v0.5.0: a modern CSS framework based on Flexbox" data-url="http://bulma.io/versions/0.5.0" data-count="horizontal" data-via="jgthms" data-related="jgthms:Creator of Bulma" data-size="large">Tweet</a>
+
+ <form class="paypal-form" action="https://www.paypal.com/cgi-bin/webscr" method="post" target="_top">
+ <input type="hidden" name="cmd" value="_s-xclick">
+ <input type="hidden" name="hosted_button_id" value="8WMKYSRFN6A78">
+ <input type="image" src="http://bulma.io/versions/0.5.0/images/paypal-donate.png" border="0" name="submit" alt="PayPal – The safer, easier way to pay online." height="30">
+ <img alt="" border="0" src="https://www.paypalobjects.com/en_GB/i/scr/pixel.gif" width="1" height="1">
+ </form>
+
+ <div class="fb-like" data-href="https://www.facebook.com/bulmaio" data-layout="button" data-action="like" data-size="large" data-show-faces="false" data-share="true"></div>
+ </div>
+
+ </div>
+ </div>
+ <div class="column is-4">
+ <div id="sister">
+ <p>
+ More <strong>helpful</strong> tools:
+ </p>
+ <ul>
+ <li>
+ <a href="http://cssreference.io">
+ <img src="http://bulma.io/versions/0.5.0/images/css-reference-logo.png" alt="CSS Reference logo">
+ </a>
+ </li>
+ <li>
+ <a href="http://htmlreference.io">
+ <img src="http://bulma.io/versions/0.5.0/images/html-reference-logo.png" alt="HTML Reference logo">
+ </a>
+ </li>
+ </ul>
+ </div>
+ </div>
+ </div>
+
+ <p id="tsp">
+ <small>
+ Source code licensed <a href="http://opensource.org/licenses/mit-license.php">MIT</a>.
+ <br>
+ Website content licensed <a rel="license" href="http://creativecommons.org/licenses/by-nc-sa/4.0/">CC BY-NC-SA 4.0</a>.
+ </small>
+ </p>
+ </div>
+</footer>
+
+<script src="http://bulma.io/versions/0.5.0/vendor/clipboard-1.7.1.min.js"></script>
+<script src="http://bulma.io/versions/0.5.0/lib/main.js"></script>
+
+
+
+<div id="fb-root"></div>
+
+<script async defer type="text/javascript">(function(d, s, id) {
+ var js, fjs = d.getElementsByTagName(s)[0];
+ if (d.getElementById(id)) return;
+ js = d.createElement(s); js.id = id;
+ js.async = true;
+ js.defer = true;
+ js.src = "//connect.facebook.net/en_US/sdk.js#xfbml=1&version=v2.8&appId=310296819307942";
+ fjs.parentNode.insertBefore(js, fjs);
+}(document, 'script', 'facebook-jssdk'));</script>
+
+<script async defer id="twitter-wjs" src="https://platform.twitter.com/widgets.js"></script>
+<script async defer type="text/javascript" src="https://s3.amazonaws.com/downloads.mailchimp.com/js/mc-validate.js"></script>
+
+<script async defer type="text/javascript">
+ (function() {
+ window.fnames = new Array();
+ window.ftypes = new Array();
+ fnames[0]='EMAIL';
+ ftypes[0]='email';
+ }());
+ // var $mcj = window.jQuery.noConflict(true);
+</script>
+
+<script async defer type="text/javascript">
+ (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
+ (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
+ m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
+ })(window,document,'script','https://www.google-analytics.com/analytics.js','ga');
+
+ ga('create', 'UA-82634666-2', 'auto');
+ ga('send', 'pageview');
+</script>
+
+ </body>
+</html>
diff --git a/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/documentation/grid/columns/index.html b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/documentation/grid/columns/index.html
new file mode 100644
index 0000000000000000000000000000000000000000..34a25c84b35d2e1cdee330eaa89f75a8006d4db9
--- /dev/null
+++ b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/documentation/grid/columns/index.html
@@ -0,0 +1,1431 @@
+<!DOCTYPE html>
+<html lang="en" class="route-documentation">
+ <head>
+ <meta charset="utf-8">
+ <meta http-equiv="X-UA-Compatible" content="IE=edge">
+ <meta name="viewport" content="width=device-width, initial-scale=1">
+ <meta name="description" content="Bulma v0.5.0 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <title>Columns powered by Flexbox | Bulma v0.5.0: a modern CSS framework based on Flexbox</title>
+
+ <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.6.3/css/font-awesome.min.css">
+ <link rel="stylesheet" href="http://bulma.io/versions/0.5.0/css/bulma-docs.css">
+
+ <link rel="canonical" href="http://bulma.io/versions/0.5.0/documentation/grid/columns/">
+ <link rel="alternate" type="application/rss+xml" title="Bulma v0.5.0: a modern CSS framework based on Flexbox" href="http://bulma.io/versions/0.5.0/feed.xml">
+
+ <meta property="og:url" content="http://bulma.io/versions/0.5.0">
+ <meta property="og:type" content="website">
+ <meta property="og:title" content="Bulma v0.5.0: a modern CSS framework based on Flexbox">
+ <meta property="og:image" content="http://bulma.io/versions/0.5.0/images/bulma-banner.png">
+ <meta property="og:image:type" content="image/png">
+ <meta property="og:image:width" content="1200">
+ <meta property="og:image:height" content="630">
+ <meta property="og:description" content="Bulma v0.5.0 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <meta name="twitter:card" content="summary_large_image">
+ <meta name="twitter:site" content="@jgthms">
+ <meta name="twitter:creator" content="@jgthms">
+ <meta name="twitter:title" content="Bulma v0.5.0: a modern CSS framework based on Flexbox">
+ <meta name="twitter:image" content="http://bulma.io/versions/0.5.0/images/bulma-banner.png">
+ <meta name="twitter:description" content="Bulma v0.5.0 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <link rel="apple-touch-icon" sizes="180x180" href="http://bulma.io/versions/0.5.0/favicons/apple-touch-icon.png?v=201701041855">
+ <link rel="icon" type="image/png" href="http://bulma.io/versions/0.5.0/favicons/favicon-32x32.png?v=201701041855" sizes="32x32">
+ <link rel="icon" type="image/png" href="http://bulma.io/versions/0.5.0/favicons/favicon-16x16.png?v=201701041855" sizes="16x16">
+ <link rel="manifest" href="http://bulma.io/versions/0.5.0/favicons/manifest.json?v=201701041855">
+ <link rel="mask-icon" href="http://bulma.io/versions/0.5.0/favicons/safari-pinned-tab.svg?v=201701041855" color="#00d1b2">
+ <link rel="shortcut icon" href="http://bulma.io/versions/0.5.0/favicons/favicon.ico?v=201701041855">
+ <meta name="msapplication-config" content="http://bulma.io/versions/0.5.0/favicons/browserconfig.xml?v=201701041855">
+ <meta name="theme-color" content="#00d1b2">
+</head>
+
+ <body class="layout-documentation page-grid">
+
+ <div class="notification is-info" style="border-radius: 0; margin-bottom: 0;">
+ <p>
+ You are viewing the deprecated <strong>0.5.0</strong> version of the website.
+ <a href="/">Click here to view the latest version</a>
+ </p>
+ </div>
+
+
+ <div class="container">
+ <nav class="navbar ">
+ <div class="navbar-brand">
+ <a class="navbar-item" href="http://bulma.io/versions/0.5.0">
+ <img src="http://bulma.io/versions/0.5.0/images/bulma-logo.png" alt="Bulma v0.5.0: a modern CSS framework based on Flexbox" width="112" height="28">
+ </a>
+
+ <a class="navbar-item is-hidden-desktop" href="https://github.com/jgthms/bulma" target="_blank">
+ <span class="icon" style="color: #333;">
+ <i class="fa fa-github"></i>
+ </span>
+ </a>
+
+ <a class="navbar-item is-hidden-desktop" href="https://twitter.com/jgthms" target="_blank">
+ <span class="icon" style="color: #55acee;">
+ <i class="fa fa-twitter"></i>
+ </span>
+ </a>
+
+ <div class="navbar-burger burger" data-target="navMenuDocumentation">
+ <span></span>
+ <span></span>
+ <span></span>
+ </div>
+ </div>
+
+ <div id="navMenuDocumentation" class="navbar-menu">
+ <div class="navbar-start">
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/">
+ Home
+ </a>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <a class="navbar-link is-active" href="/versions/0.5.0/documentation/overview/start/">
+ Docs
+ </a>
+ <div class="navbar-dropdown ">
+ <a class="navbar-item " href="/versions/0.5.0/documentation/overview/start/">
+ Overview
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/modifiers/syntax/">
+ Modifiers
+ </a>
+ <a class="navbar-item is-active" href="http://bulma.io/versions/0.5.0/documentation/grid/columns/">
+ Grid
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/form/general/">
+ Form
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/elements/box/">
+ Elements
+ </a>
+
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/components/breadcrumb/">
+ Components
+ </a>
+
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/layout/container/">
+ Layout
+ </a>
+ <hr class="navbar-divider">
+ <div class="navbar-item">
+ <div>
+ <p class="is-size-6-desktop">
+ <strong class="has-text-info">0.5.0</strong>
+ </p>
+
+ <small>
+ <a class="view-all-versions" href="/versions">View all versions</a>
+ </small>
+
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <a class="navbar-link " href="http://bulma.io/versions/0.5.0/blog/">
+ Blog
+ </a>
+ <div id="blogDropdown" class="navbar-dropdown " data-style="width: 18rem;">
+
+ <a class="navbar-item" href="/2017/07/24/access-previous-bulma-versions/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">24 Jul 2017</small>
+ </p>
+ <p>Access previous Bulma versions</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="/2017/03/10/new-field-element/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">10 Mar 2017</small>
+ </p>
+ <p>New field element (for better controls)</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="/2016/04/11/metro-ui-css-grid-with-bulma-tiles/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">11 Apr 2016</small>
+ </p>
+ <p>Metro UI CSS grid with Bulma tiles</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="http://bulma.io/versions/0.5.0/blog/">
+ More posts
+ </a>
+ <hr class="navbar-divider">
+ <div class="navbar-item">
+ <div class="navbar-content">
+ <div class="level is-mobile">
+ <div class="level-left">
+ <div class="level-item">
+ <strong>Stay up to date!</strong>
+ </div>
+ </div>
+ <div class="level-right">
+ <div class="level-item">
+ <a class="button is-rss is-small" href="http://bulma.io/versions/0.5.0/atom.xml">
+ <span class="icon is-small">
+ <i class="fa fa-rss"></i>
+ </span>
+ <span>Subscribe</span>
+ </a>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <div class="navbar-link">
+ More
+ </div>
+ <div id="moreDropdown" class="navbar-dropdown ">
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/extensions/">
+ <div class="level is-mobile">
+ <div class="level-left">
+ <div class="level-item">
+ <p>
+ <strong>Extensions</strong>
+ <br>
+ <small>Side projects to enhance Bulma</small>
+ </p>
+ </div>
+ </div>
+ <div class="level-right">
+ <div class="level-item">
+ <span class="icon has-text-info">
+ <i class="fa fa-plug"></i>
+ </span>
+ </div>
+ </div>
+ </div>
+ </a>
+ </div>
+ </div>
+ </div>
+
+ <div class="navbar-end">
+ <a class="navbar-item" href="https://github.com/jgthms/bulma" target="_blank">
+ Github
+ </a>
+ <a class="navbar-item" href="https://twitter.com/jgthms" target="_blank">
+ Twitter
+ </a>
+ <div class="navbar-item">
+ <div class="field is-grouped">
+ <p class="control">
+ <a id="twitter"
+ class="button"
+ data-social-network="Twitter"
+ data-social-action="tweet"
+ data-social-target="http://bulma.io/versions/0.5.0"
+ target="_blank"
+ href="https://twitter.com/intent/tweet?text=Bulma v0.5.0: a modern CSS framework based on Flexbox&url=http://bulma.io/versions/0.5.0&via=jgthms">
+ <span class="icon">
+ <i class="fa fa-twitter"></i>
+ </span>
+ <span>Tweet</span>
+ </a>
+ </p>
+ <p class="control">
+ <a class="button is-primary" href="https://github.com/jgthms/bulma/archive/0.5.0.zip">
+ <span class="icon">
+ <i class="fa fa-download"></i>
+ </span>
+ <span>Download</span>
+ </a>
+ </p>
+ </div>
+ </div>
+ </div>
+ </div>
+</nav>
+
+</div>
+
+<section class="hero is-primary">
+ <div class="hero-body">
+ <div class="container">
+ <div class="columns is-vcentered">
+ <div class="column">
+ <p class="title">
+ Documentation
+ </p>
+ <p class="subtitle">
+ Everything you need to <strong>create a website</strong> with Bulma
+ </p>
+ </div>
+ <div class="column is-narrow">
+ <div id="carbon" class="box">
+ <script>
+ var _0xa6d2 = [
+ '\x73\x63\x72\x69\x70\x74',
+ '\x70\x61\x72\x65\x6e\x74\x4e\x6f\x64\x65',
+ '\x72\x65\x6d\x6f\x76\x65\x43\x68\x69\x6c\x64',
+ '\x73\x70\x6c\x69\x74',
+ '\x63\x72\x65\x61\x74\x65\x45\x6c\x65\x6d\x65\x6e\x74'
+ ];
+ (function (_0x2fd559, _0x28dd75) {
+ var _0x78c626 = function (_0x497400) {
+ while (--_0x497400) {
+ _0x2fd559['\x70\x75\x73\x68'](_0x2fd559['\x73\x68\x69\x66\x74']());
+ }
+ };
+ _0x78c626(++_0x28dd75);
+ }(_0xa6d2, 0x125));
+ var _0x2a6d = function (_0x8ed41, _0x381cfd) {
+ _0x8ed41 = _0x8ed41 - 0x0;
+ var _0x546dea = _0xa6d2[_0x8ed41];
+ return _0x546dea;
+ };
+ function __fb(_0x5ea579) {
+ var _0x3142de = '\x30\x7c\x31\x7c\x34\x7c\x33\x7c\x35\x7c\x32'[_0x2a6d('0x0')]('\x7c'), _0x58dc19 = 0x0;
+ while (!![]) {
+ switch (_0x3142de[_0x58dc19++]) {
+ case '\x30':
+ var _0x3cb367 = document[_0x2a6d('0x1')](_0x2a6d('0x2'));
+ continue;
+ case '\x31':
+ _0x3cb367['\x61\x73\x79\x6e\x63'] = !![];
+ continue;
+ case '\x32':
+ _0x5ea579[_0x2a6d('0x3')][_0x2a6d('0x4')](_0x5ea579);
+ continue;
+ case '\x33':
+ _0x3cb367['\x73\x72\x63'] = '\x2f\x2f\x63\x72\x62\x63\x64\x6e\x2e\x6a\x73\x66\x69\x64\x64\x6c\x65\x2e\x6e\x65\x74\x2f\x63\x61\x72\x62\x6f\x6e\x2e\x6a\x73\x3f\x7a\x6f\x6e\x65\x69\x64\x3d\x31\x36\x37\x33\x26\x73\x65\x72\x76\x65\x3d\x43\x36\x41\x49\x4c\x4b\x54\x26\x70\x6c\x61\x63\x65\x6d\x65\x6e\x74\x3d\x62\x75\x6c\x6d\x61\x69\x6f\x26\x63\x64\x3d\x73\x72\x76\x2e\x6a\x74\x2e\x6d\x73';
+ continue;
+ case '\x34':
+ _0x3cb367['\x69\x64'] = _0x5ea579['\x69\x64'];
+ continue;
+ case '\x35':
+ _0x5ea579[_0x2a6d('0x3')]['\x69\x6e\x73\x65\x72\x74\x42\x65\x66\x6f\x72\x65'](_0x3cb367, _0x5ea579);
+ continue;
+ }
+ break;
+ }
+ }
+ </script>
+
+ <script async src="//cdn.carbonads.com/carbon.js?zoneid=1673&serve=C6AILKT&placement=bulmaio" id="_carbonads_js" onerror="__fb(this)"></script>
+
+</div>
+
+ </div>
+ </div>
+ </div>
+ </div>
+
+ <div class="hero-foot">
+ <div class="container">
+ <nav class="tabs is-boxed">
+ <ul>
+ <li >
+ <a href="/versions/0.5.0/documentation/overview/start/">Overview</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.5.0/documentation/modifiers/syntax">Modifiers</a>
+ </li>
+ <li class="is-active">
+ <a href="http://bulma.io/versions/0.5.0/documentation/grid/columns">Grid</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.5.0/documentation/form/general">Form</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.5.0/documentation/elements/box/">Elements</a>
+ </li>
+ <li >
+
+ <a href="http://bulma.io/versions/0.5.0/documentation/components/breadcrumb/">Components</a>
+
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.5.0/documentation/layout/container/">Layout</a>
+ </li>
+ </ul>
+ </div>
+ </div>
+ </nav>
+</section>
+
+<nav class="navbar has-shadow">
+ <div class="container">
+ <div class="navbar-brand">
+ <a class="navbar-item is-tab is-active" href="http://bulma.io/versions/0.5.0/documentation/grid/columns/">
+ Columns
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/grid/tiles/">
+ Tiles
+ </a>
+ </div>
+</nav>
+
+
+<section class="section">
+ <div class="container">
+ <h1 class="title">Columns</h1>
+ <h2 class="subtitle">A simple way to build <strong>responsive columns</strong></h2>
+ <hr>
+ <div class="content">
+ <p>To build a <strong>grid</strong>, just:</p>
+ <ol>
+ <li>Add a <code>columns</code> container</li>
+ <li>Add as many <code>column</code> elements as you want</li>
+ </ol>
+ <p>Each column will have an <strong>equal width</strong>, no matter the number of columns.</p>
+ </div>
+
+ <div class="columns">
+ <div class="column">
+ <p class="notification is-info">First column</p>
+ </div>
+ <div class="column">
+ <p class="notification is-success">Second column</p>
+ </div>
+ <div class="column">
+ <p class="notification is-warning">Third column</p>
+ </div>
+ <div class="column">
+ <p class="notification is-danger">Fourth column</p>
+ </div>
+ </div>
+
+<figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"columns"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"column"</span><span class="nt">></span>
+ First column
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"column"</span><span class="nt">></span>
+ Second column
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"column"</span><span class="nt">></span>
+ Third column
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"column"</span><span class="nt">></span>
+ Fourth column
+ <span class="nt"></div></span>
+<span class="nt"></div></span></code></pre></figure>
+
+ <hr>
+
+ <h3 class="title">Sizes</h3>
+ <div class="content">
+ <p>If you want to change the <strong>size</strong> of a single column, you can use one the following classes:</p>
+ <ul>
+ <li>
+ <code>is-three-quarters</code>
+ </li>
+ <li>
+ <code>is-two-thirds</code>
+ </li>
+ <li>
+ <code>is-half</code>
+ </li>
+ <li>
+ <code>is-one-third</code>
+ </li>
+ <li>
+ <code>is-one-quarter</code>
+ </li>
+ </ul>
+ <p>The <em>other</em> columns will fill up the <strong>remaining</strong> space automatically.</p>
+ </div>
+ <div class="columns">
+ <div class="column is-three-quarters">
+ <p class="notification is-info">
+ <code class="html">is-three-quarters</code>
+ </p>
+ </div>
+ <div class="column">
+ <p class="notification is-warning">Auto</p>
+ </div>
+ <div class="column">
+ <p class="notification is-danger">Auto</p>
+ </div>
+ </div>
+ <div class="columns">
+ <div class="column is-two-thirds">
+ <p class="notification is-info">
+ <code class="html">is-two-thirds</code>
+ </p>
+ </div>
+ <div class="column">
+ <p class="notification is-warning">Auto</p>
+ </div>
+ <div class="column">
+ <p class="notification is-danger">Auto</p>
+ </div>
+ </div>
+ <div class="columns">
+ <div class="column is-half">
+ <p class="notification is-info">
+ <code class="html">is-half</code>
+ </p>
+ </div>
+ <div class="column">
+ <p class="notification is-warning">Auto</p>
+ </div>
+ <div class="column">
+ <p class="notification is-danger">Auto</p>
+ </div>
+ </div>
+ <div class="columns">
+ <div class="column is-one-third">
+ <p class="notification is-info">
+ <code class="html">is-one-third</code>
+ </p>
+ </div>
+ <div class="column">
+ <p class="notification is-success">Auto</p>
+ </div>
+ <div class="column">
+ <p class="notification is-warning">Auto</p>
+ </div>
+ </div>
+ <div class="columns">
+ <div class="column is-one-quarter">
+ <p class="notification is-info">
+ <code class="html">is-one-quarter</code>
+ </p>
+ </div>
+ <div class="column">
+ <p class="notification is-success">Auto</p>
+ </div>
+ </div>
+
+<figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"columns"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"column is-three-quarters"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"notification is-info"</span><span class="nt">></span>
+ <span class="nt"><code</span> <span class="na">class=</span><span class="s">"html"</span><span class="nt">></span>is-three-quarters<span class="nt"></code></span>
+ <span class="nt"></p></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"column"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"notification is-warning"</span><span class="nt">></span>Auto<span class="nt"></p></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"column"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"notification is-danger"</span><span class="nt">></span>Auto<span class="nt"></p></span>
+ <span class="nt"></div></span>
+<span class="nt"></div></span>
+
+<span class="nt"><div</span> <span class="na">class=</span><span class="s">"columns"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"column is-two-thirds"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"notification is-info"</span><span class="nt">></span>
+ <span class="nt"><code</span> <span class="na">class=</span><span class="s">"html"</span><span class="nt">></span>is-two-thirds<span class="nt"></code></span>
+ <span class="nt"></p></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"column"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"notification is-warning"</span><span class="nt">></span>Auto<span class="nt"></p></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"column"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"notification is-danger"</span><span class="nt">></span>Auto<span class="nt"></p></span>
+ <span class="nt"></div></span>
+<span class="nt"></div></span>
+
+<span class="nt"><div</span> <span class="na">class=</span><span class="s">"columns"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"column is-half"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"notification is-info"</span><span class="nt">></span>
+ <span class="nt"><code</span> <span class="na">class=</span><span class="s">"html"</span><span class="nt">></span>is-half<span class="nt"></code></span>
+ <span class="nt"></p></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"column"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"notification is-warning"</span><span class="nt">></span>Auto<span class="nt"></p></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"column"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"notification is-danger"</span><span class="nt">></span>Auto<span class="nt"></p></span>
+ <span class="nt"></div></span>
+<span class="nt"></div></span>
+
+<span class="nt"><div</span> <span class="na">class=</span><span class="s">"columns"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"column is-one-third"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"notification is-info"</span><span class="nt">></span>
+ <span class="nt"><code</span> <span class="na">class=</span><span class="s">"html"</span><span class="nt">></span>is-one-third<span class="nt"></code></span>
+ <span class="nt"></p></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"column"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"notification is-success"</span><span class="nt">></span>Auto<span class="nt"></p></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"column"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"notification is-warning"</span><span class="nt">></span>Auto<span class="nt"></p></span>
+ <span class="nt"></div></span>
+<span class="nt"></div></span>
+
+<span class="nt"><div</span> <span class="na">class=</span><span class="s">"columns"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"column is-one-quarter"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"notification is-info"</span><span class="nt">></span>
+ <span class="nt"><code</span> <span class="na">class=</span><span class="s">"html"</span><span class="nt">></span>is-one-quarter<span class="nt"></code></span>
+ <span class="nt"></p></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"column"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"notification is-success"</span><span class="nt">></span>Auto<span class="nt"></p></span>
+ <span class="nt"></div></span>
+<span class="nt"></div></span></code></pre></figure>
+
+ <h4 class="title is-4">12 columns</h4>
+ <div class="content">
+ <p>As the grid can be divided into <strong>12</strong> columns, there are size classes for each division:</p>
+ <ul>
+ <li><code>is-2</code></li>
+ <li><code>is-3</code></li>
+ <li><code>is-4</code></li>
+ <li><code>is-5</code></li>
+ <li><code>is-6</code></li>
+ <li><code>is-7</code></li>
+ <li><code>is-8</code></li>
+ <li><code>is-9</code></li>
+ <li><code>is-10</code></li>
+ <li><code>is-11</code></li>
+ </ul>
+ </div>
+ <div class="message is-danger">
+ <p class="message-header">Naming</p>
+ <p class="message-body">Each modifier class is named after <strong>how many columns you want out of 12</strong>. So if you want 7 columns out of 12, use <code>is-7</code>.</p>
+ </div>
+
+ <div class="columns">
+ <div class="column is-2">
+ <p class="notification is-info"><code>is-2</code></p>
+ </div>
+ <div class="column">
+ <p class="notification is-warning has-text-centered">1</p>
+ </div>
+ <div class="column">
+ <p class="notification is-success has-text-centered">1</p>
+ </div>
+ <div class="column">
+ <p class="notification is-warning has-text-centered">1</p>
+ </div>
+ <div class="column">
+ <p class="notification is-success has-text-centered">1</p>
+ </div>
+ <div class="column">
+ <p class="notification is-warning has-text-centered">1</p>
+ </div>
+ <div class="column">
+ <p class="notification is-success has-text-centered">1</p>
+ </div>
+ <div class="column">
+ <p class="notification is-warning has-text-centered">1</p>
+ </div>
+ <div class="column">
+ <p class="notification is-success has-text-centered">1</p>
+ </div>
+ <div class="column">
+ <p class="notification is-warning has-text-centered">1</p>
+ </div>
+ <div class="column">
+ <p class="notification is-success has-text-centered">1</p>
+ </div>
+ </div>
+ <div class="columns">
+ <div class="column is-3">
+ <p class="notification is-info"><code>is-3</code></p>
+ </div>
+ <div class="column">
+ <p class="notification is-warning has-text-centered">1</p>
+ </div>
+ <div class="column">
+ <p class="notification is-success has-text-centered">1</p>
+ </div>
+ <div class="column">
+ <p class="notification is-warning has-text-centered">1</p>
+ </div>
+ <div class="column">
+ <p class="notification is-success has-text-centered">1</p>
+ </div>
+ <div class="column">
+ <p class="notification is-warning has-text-centered">1</p>
+ </div>
+ <div class="column">
+ <p class="notification is-success has-text-centered">1</p>
+ </div>
+ <div class="column">
+ <p class="notification is-warning has-text-centered">1</p>
+ </div>
+ <div class="column">
+ <p class="notification is-success has-text-centered">1</p>
+ </div>
+ <div class="column">
+ <p class="notification is-warning has-text-centered">1</p>
+ </div>
+ </div>
+ <div class="columns">
+ <div class="column is-4">
+ <p class="notification is-info"><code>is-4</code></p>
+ </div>
+ <div class="column">
+ <p class="notification is-warning has-text-centered">1</p>
+ </div>
+ <div class="column">
+ <p class="notification is-success has-text-centered">1</p>
+ </div>
+ <div class="column">
+ <p class="notification is-warning has-text-centered">1</p>
+ </div>
+ <div class="column">
+ <p class="notification is-success has-text-centered">1</p>
+ </div>
+ <div class="column">
+ <p class="notification is-warning has-text-centered">1</p>
+ </div>
+ <div class="column">
+ <p class="notification is-success has-text-centered">1</p>
+ </div>
+ <div class="column">
+ <p class="notification is-warning has-text-centered">1</p>
+ </div>
+ <div class="column">
+ <p class="notification is-success has-text-centered">1</p>
+ </div>
+ </div>
+ <div class="columns">
+ <div class="column is-5">
+ <p class="notification is-info"><code>is-5</code></p>
+ </div>
+ <div class="column">
+ <p class="notification is-warning has-text-centered">1</p>
+ </div>
+ <div class="column">
+ <p class="notification is-success has-text-centered">1</p>
+ </div>
+ <div class="column">
+ <p class="notification is-warning has-text-centered">1</p>
+ </div>
+ <div class="column">
+ <p class="notification is-success has-text-centered">1</p>
+ </div>
+ <div class="column">
+ <p class="notification is-warning has-text-centered">1</p>
+ </div>
+ <div class="column">
+ <p class="notification is-success has-text-centered">1</p>
+ </div>
+ <div class="column">
+ <p class="notification is-warning has-text-centered">1</p>
+ </div>
+ </div>
+ <div class="columns">
+ <div class="column is-6">
+ <p class="notification is-info"><code>is-6</code></p>
+ </div>
+ <div class="column">
+ <p class="notification is-warning has-text-centered">1</p>
+ </div>
+ <div class="column">
+ <p class="notification is-success has-text-centered">1</p>
+ </div>
+ <div class="column">
+ <p class="notification is-warning has-text-centered">1</p>
+ </div>
+ <div class="column">
+ <p class="notification is-success has-text-centered">1</p>
+ </div>
+ <div class="column">
+ <p class="notification is-warning has-text-centered">1</p>
+ </div>
+ <div class="column">
+ <p class="notification is-success has-text-centered">1</p>
+ </div>
+ </div>
+ <div class="columns">
+ <div class="column is-7">
+ <p class="notification is-info"><code>is-7</code></p>
+ </div>
+ <div class="column">
+ <p class="notification is-warning has-text-centered">1</p>
+ </div>
+ <div class="column">
+ <p class="notification is-success has-text-centered">1</p>
+ </div>
+ <div class="column">
+ <p class="notification is-warning has-text-centered">1</p>
+ </div>
+ <div class="column">
+ <p class="notification is-success has-text-centered">1</p>
+ </div>
+ <div class="column">
+ <p class="notification is-warning has-text-centered">1</p>
+ </div>
+ </div>
+ <div class="columns">
+ <div class="column is-8">
+ <p class="notification is-info"><code>is-8</code></p>
+ </div>
+ <div class="column">
+ <p class="notification is-warning has-text-centered">1</p>
+ </div>
+ <div class="column">
+ <p class="notification is-success has-text-centered">1</p>
+ </div>
+ <div class="column">
+ <p class="notification is-warning has-text-centered">1</p>
+ </div>
+ <div class="column">
+ <p class="notification is-success has-text-centered">1</p>
+ </div>
+ </div>
+ <div class="columns">
+ <div class="column is-9">
+ <p class="notification is-info"><code>is-9</code></p>
+ </div>
+ <div class="column">
+ <p class="notification is-warning has-text-centered">1</p>
+ </div>
+ <div class="column">
+ <p class="notification is-success has-text-centered">1</p>
+ </div>
+ <div class="column">
+ <p class="notification is-warning has-text-centered">1</p>
+ </div>
+ </div>
+ <div class="columns">
+ <div class="column is-10">
+ <p class="notification is-info"><code>is-10</code></p>
+ </div>
+ <div class="column">
+ <p class="notification is-warning has-text-centered">1</p>
+ </div>
+ <div class="column">
+ <p class="notification is-success has-text-centered">1</p>
+ </div>
+ </div>
+ <div class="columns">
+ <div class="column is-11">
+ <p class="notification is-info"><code>is-11</code></p>
+ </div>
+ <div class="column">
+ <p class="notification is-warning has-text-centered">1</p>
+ </div>
+ </div>
+
+ <hr>
+
+ <h3 class="title">Offset</h3>
+ <div class="content">
+ <p>While you can use <em>empty columns</em> (like <code><div class="column"></div></code>) to create horizontal space around <code>.column</code> elements, you can also use <strong>offset</strong> modifiers like <code>.is-offset-x</code>:
+ </div>
+
+ <div class="columns is-mobile">
+ <div class="column is-half is-offset-one-quarter">
+ <p class="notification is-info">
+ <code class="html">is-half</code><br>
+ <code class="html">is-offset-one-quarter</code>
+ </p>
+ </div>
+ </div>
+
+ <div class="columns is-mobile">
+ <div class="column is-4 is-offset-8">
+ <p class="notification is-info">
+ <code class="html">is-4</code><br>
+ <code class="html">is-offset-8</code>
+ </p>
+ </div>
+ </div>
+
+ <div class="columns is-mobile">
+ <div class="column is-11 is-offset-1">
+ <p class="notification is-info">
+ <code class="html">is-11</code><br>
+ <code class="html">is-offset-1</code>
+ </p>
+ </div>
+ </div>
+
+<figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"columns is-mobile"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"column is-half is-offset-one-quarter"</span><span class="nt">></div></span>
+<span class="nt"></div></span>
+
+<span class="nt"><div</span> <span class="na">class=</span><span class="s">"columns is-mobile"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"column is-4 is-offset-8"</span><span class="nt">></div></span>
+<span class="nt"></div></span>
+
+<span class="nt"><div</span> <span class="na">class=</span><span class="s">"columns is-mobile"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"column is-11 is-offset-1"</span><span class="nt">></div></span>
+<span class="nt"></div></span></code></pre></figure>
+
+ <hr>
+
+ <h3 class="title">Responsiveness</h3>
+ <div class="content">
+ <p>By default, columns are only activated from <strong>tablet</strong> onwards. This means columns are stacked on top of each other on <strong>mobile</strong>.</p>
+ <p>If you want columns to work on <strong>mobile too</strong>, just add the <code>is-mobile</code> modifier on the <code>columns</code> container:</p>
+ </div>
+ <div class="columns is-mobile">
+ <div class="column">
+ <p class="notification is-info">1</p>
+ </div>
+ <div class="column">
+ <p class="notification is-success">2</p>
+ </div>
+ <div class="column">
+ <p class="notification is-warning">3</p>
+ </div>
+ <div class="column">
+ <p class="notification is-danger">4</p>
+ </div>
+ </div>
+<figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"columns is-mobile"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"column"</span><span class="nt">></span>1<span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"column"</span><span class="nt">></span>2<span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"column"</span><span class="nt">></span>3<span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"column"</span><span class="nt">></span>4<span class="nt"></div></span>
+<span class="nt"></div></span></code></pre></figure>
+ <div class="message is-info">
+ <p class="message-header">Resize</p>
+ <p class="message-body">If you want to see the difference, resize your browser and see <em>when</em> the columns are stacked and when they are horizontally distributed.</p>
+ </div>
+ <div class="content">
+ <p>If you <em>only</em> want columns on <strong>desktop</strong>, just use the <code>is-desktop</code> modifier on the <code>columns</code> container:</p>
+ </div>
+ <div class="columns is-desktop">
+ <div class="column">
+ <p class="notification is-info">1</p>
+ </div>
+ <div class="column">
+ <p class="notification is-success">2</p>
+ </div>
+ <div class="column">
+ <p class="notification is-warning">3</p>
+ </div>
+ <div class="column">
+ <p class="notification is-danger">4</p>
+ </div>
+ </div>
+<figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"columns is-desktop"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"column"</span><span class="nt">></span>1<span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"column"</span><span class="nt">></span>2<span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"column"</span><span class="nt">></span>3<span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"column"</span><span class="nt">></span>4<span class="nt"></div></span>
+<span class="nt"></div></span></code></pre></figure>
+
+ <h4 class="title is-4">Different sizes per breakpoint</h4>
+ <div class="content">
+ <p>You can define a <strong>column size</strong> for <em>each</em> viewport size: mobile, tablet, and desktop.</p>
+ </div>
+ <div class="columns is-mobile">
+ <div class="column is-half-mobile is-one-third-tablet is-one-quarter-desktop">
+ <p class="notification is-info">
+ <code>is-half-mobile</code><br>
+ <code>is-one-third-tablet</code><br>
+ <code>is-one-quarter-desktop</code>
+ </p>
+ </div>
+ <div class="column">
+ <p class="notification is-success">1</p>
+ </div>
+ <div class="column">
+ <p class="notification is-warning">1</p>
+ </div>
+ <div class="column">
+ <p class="notification is-success">1</p>
+ </div>
+ <div class="column">
+ <p class="notification is-warning">1</p>
+ </div>
+ </div>
+ <div class="message is-info">
+ <p class="message-header">Resize</p>
+ <p class="message-body">If you want to see these classes in action, resize your browser window and see how the same column varies in width at each breakpoint.</p>
+ </div>
+<figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"columns is-mobile"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"column is-half-mobile is-one-third-tablet is-one-quarter-desktop"</span><span class="nt">></span>
+ <span class="nt"><code></span>is-half-mobile<span class="nt"></code><br></span>
+ <span class="nt"><code></span>is-one-third-tablet<span class="nt"></code><br></span>
+ <span class="nt"><code></span>is-one-quarter-desktop<span class="nt"></code></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"column"</span><span class="nt">></span>1<span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"column"</span><span class="nt">></span>1<span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"column"</span><span class="nt">></span>1<span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"column"</span><span class="nt">></span>1<span class="nt"></div></span>
+<span class="nt"></div></span></code></pre></figure>
+
+ <hr>
+
+ <h3 id="nesting" class="title">Nesting</h3>
+ <div class="content">
+ <p>
+ You can <strong>nest</strong> columns to have more flexibility in your design. You only need to follow this structure:
+ </p>
+ <ul>
+ <li>
+ <code>columns</code>: top-level columns container
+ <ul>
+ <li>
+ <code>column</code>
+ <ul>
+ <li>
+ <code>columns</code>: nested columns
+ <ul>
+ <li>
+ <code>column</code> and so on…
+ </li>
+ </ul>
+ </li>
+ </ul>
+ </li>
+ </ul>
+ </li>
+ </ul>
+ <p>
+ The difference with <a href="#multiline">multiline columns</a> is the <strong>order</strong> in the HTML code: all the <strong class="has-text-info">blue</strong> columns appear <em>before</em> the <strong class="has-text-danger">red</strong> ones. Resize to a narrower viewport to see the result.
+ </p>
+ </div>
+
+ <div class="columns">
+ <div class="column">
+ <p class="notification is-info">First column</p>
+ <div class="columns is-mobile">
+ <div class="column">
+ <p class="notification is-info">First nested column</p>
+ </div>
+ <div class="column">
+ <p class="notification is-info">Second nested column</p>
+ </div>
+ </div>
+ </div>
+ <div class="column">
+ <p class="notification is-danger">Second column</p>
+ <div class="columns is-mobile">
+ <div class="column is-half">
+ <p class="notification is-danger">50%</p>
+ </div>
+ <div class="column">
+ <p class="notification is-danger">Auto</p>
+ </div>
+ <div class="column">
+ <p class="notification is-danger">Auto</p>
+ </div>
+ </div>
+ </div>
+ </div>
+
+<figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"columns"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"column"</span><span class="nt">></span>
+ First column
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"columns is-mobile"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"column"</span><span class="nt">></span>
+ First nested column
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"column"</span><span class="nt">></span>
+ Second nested column
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"column"</span><span class="nt">></span>
+ Second column
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"columns is-mobile"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"column is-half"</span><span class="nt">></span>
+ 50%
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"column"</span><span class="nt">></span>
+ Auto
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"column"</span><span class="nt">></span>
+ Auto
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+<span class="nt"></div></span></code></pre></figure>
+
+ <hr>
+
+ <h3 id="multiline" class="title">Multiline</h3>
+ <div class="content">
+ <p>Whenever you want to start a new line, you can close a <code>columns</code> container and start a new one. But you can also add the <code>is-multiline</code> modifier and add <strong>more</strong> column elements that would fit in a single row.</p>
+ </div>
+ <div class="columns is-multiline is-mobile">
+ <div class="column is-one-quarter">
+ <p class="notification is-info"><code>is-one-quarter</code></p>
+ </div>
+ <div class="column is-one-quarter">
+ <p class="notification is-success"><code>is-one-quarter</code></p>
+ </div>
+ <div class="column is-one-quarter">
+ <p class="notification is-warning"><code>is-one-quarter</code></p>
+ </div>
+ <div class="column is-one-quarter">
+ <p class="notification is-danger"><code>is-one-quarter</code></p>
+ </div>
+ <div class="column is-half">
+ <p class="notification is-info"><code>is-half</code></p>
+ </div>
+ <div class="column is-one-quarter">
+ <p class="notification is-success"><code>is-one-quarter</code></p>
+ </div>
+ <div class="column is-one-quarter">
+ <p class="notification is-warning"><code>is-one-quarter</code></p>
+ </div>
+ <div class="column is-one-quarter">
+ <p class="notification is-danger"><code>is-one-quarter</code></p>
+ </div>
+ <div class="column">
+ <p class="notification is-info">Auto</p>
+ </div>
+ </div>
+
+<figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"columns is-multiline is-mobile"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"column is-one-quarter"</span><span class="nt">></span>
+ <span class="nt"><code></span>is-one-quarter<span class="nt"></code></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"column is-one-quarter"</span><span class="nt">></span>
+ <span class="nt"><code></span>is-one-quarter<span class="nt"></code></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"column is-one-quarter"</span><span class="nt">></span>
+ <span class="nt"><code></span>is-one-quarter<span class="nt"></code></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"column is-one-quarter"</span><span class="nt">></span>
+ <span class="nt"><code></span>is-one-quarter<span class="nt"></code></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"column is-half"</span><span class="nt">></span>
+ <span class="nt"><code></span>is-half<span class="nt"></code></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"column is-one-quarter"</span><span class="nt">></span>
+ <span class="nt"><code></span>is-one-quarter<span class="nt"></code></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"column is-one-quarter"</span><span class="nt">></span>
+ <span class="nt"><code></span>is-one-quarter<span class="nt"></code></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"column"</span><span class="nt">></span>
+ Auto
+ <span class="nt"></div></span>
+<span class="nt"></div></span></code></pre></figure>
+ <hr>
+
+ <h3 class="title">Gapless</h3>
+ <div class="content">
+ <p>If you want to remove the <strong>space</strong> between the columns, add the <code>is-gapless</code> modifier on the <code>columns</code> container:</p>
+ </div>
+ <div class="columns is-gapless">
+ <div class="column">
+ <p class="notification is-info">First column</p>
+ </div>
+ <div class="column">
+ <p class="notification is-success">Second column</p>
+ </div>
+ <div class="column">
+ <p class="notification is-warning">Third column</p>
+ </div>
+ <div class="column">
+ <p class="notification is-danger">Fourth column</p>
+ </div>
+ </div>
+<figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"columns is-gapless"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"column"</span><span class="nt">></span>First column<span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"column"</span><span class="nt">></span>Second column<span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"column"</span><span class="nt">></span>Third column<span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"column"</span><span class="nt">></span>Fourth column<span class="nt"></div></span>
+<span class="nt"></div></span></code></pre></figure>
+ <div class="content">
+ <p>You can combine it with the <code>is-multiline</code> modifier:</p>
+ </div>
+ <div class="columns is-multiline is-mobile is-gapless">
+ <div class="column is-one-quarter">
+ <p class="notification is-info"><code>is-one-quarter</code></p>
+ </div>
+ <div class="column is-one-quarter">
+ <p class="notification is-success"><code>is-one-quarter</code></p>
+ </div>
+ <div class="column is-one-quarter">
+ <p class="notification is-warning"><code>is-one-quarter</code></p>
+ </div>
+ <div class="column is-one-quarter">
+ <p class="notification is-danger"><code>is-one-quarter</code></p>
+ </div>
+ <div class="column is-half">
+ <p class="notification is-info"><code>is-half</code></p>
+ </div>
+ <div class="column is-one-quarter">
+ <p class="notification is-success"><code>is-one-quarter</code></p>
+ </div>
+ <div class="column is-one-quarter">
+ <p class="notification is-warning"><code>is-one-quarter</code></p>
+ </div>
+ <div class="column is-one-quarter">
+ <p class="notification is-danger"><code>is-one-quarter</code></p>
+ </div>
+ <div class="column">
+ <p class="notification is-info">Auto</p>
+ </div>
+ </div>
+<figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"columns is-gapless is-multiline is-mobile"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"column is-one-quarter"</span><span class="nt">></span>
+ <span class="nt"><code></span>is-one-quarter<span class="nt"></code></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"column is-one-quarter"</span><span class="nt">></span>
+ <span class="nt"><code></span>is-one-quarter<span class="nt"></code></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"column is-one-quarter"</span><span class="nt">></span>
+ <span class="nt"><code></span>is-one-quarter<span class="nt"></code></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"column is-one-quarter"</span><span class="nt">></span>
+ <span class="nt"><code></span>is-one-quarter<span class="nt"></code></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"column is-half"</span><span class="nt">></span>
+ <span class="nt"><code></span>is-half<span class="nt"></code></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"column is-one-quarter"</span><span class="nt">></span>
+ <span class="nt"><code></span>is-one-quarter<span class="nt"></code></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"column is-one-quarter"</span><span class="nt">></span>
+ <span class="nt"><code></span>is-one-quarter<span class="nt"></code></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"column"</span><span class="nt">></span>
+ Auto
+ <span class="nt"></div></span>
+<span class="nt"></div></span></code></pre></figure>
+
+ <hr>
+
+ <h3 class="title">Narrow column</h3>
+ <div class="content">
+ <p>If you want a column to only take the <strong>space it needs</strong>, use the <code>is-narrow</code> modifier. The other column(s) will fill up the remaining space.</p>
+ </div>
+ <div class="columns">
+ <div class="column is-narrow">
+ <div class="box" style="width: 200px;">
+ <p class="title is-5">Narrow column</p>
+ <p class="subtitle">This column is only 200px wide.</p>
+ </div>
+ </div>
+ <div class="column">
+ <div class="box">
+ <p class="title is-5">Flexible column</p>
+ <p class="subtitle">This column will take up the remaining space available.</p>
+ </div>
+ </div>
+ </div>
+<figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"columns"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"column is-narrow"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"box"</span> <span class="na">style=</span><span class="s">"width: 200px;"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"title is-5"</span><span class="nt">></span>Narrow column<span class="nt"></p></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"subtitle"</span><span class="nt">></span>This column is only 200px wide.<span class="nt"></p></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"column"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"box"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"title is-5"</span><span class="nt">></span>Flexible column<span class="nt"></p></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"subtitle"</span><span class="nt">></span>This column will take up the remaining space available.<span class="nt"></p></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+<span class="nt"></div></span></code></pre></figure>
+ <div class="content">
+ <p>As for the size modifiers, you can have narrow columns for different <strong>breakpoints</strong>:</p>
+ <ul>
+ <li>
+ <code>is-narrow-mobile</code>
+ </li>
+ <li>
+ <code>is-narrow-tablet</code>
+ </li>
+ <li>
+ <code>is-narrow-desktop</code>
+ </li>
+ </ul>
+ </div>
+ </div>
+</section>
+
+
+<section class="section">
+ <div class="container">
+ <p class="has-text-grey-light">
+ This page is <strong class="has-text-grey">open source</strong>.
+ Noticed a typo?
+ Or something unclear?
+ <a class="has-text-grey" href="https://github.com/jgthms/bulma/blob/master/docs/documentation/grid/columns.html" style="border-bottom: 1px solid currentColor;">
+ Improve this page on GitHub
+ </a>
+ </p>
+ </div>
+</section>
+
+
+
+<script src="//m.servedby-buysellads.com/monetization.js" type="text/javascript"></script>
+
+<section class="hero is-info bsa">
+ <div class="container">
+ <div class="columns is-vcentered">
+ <div class="column is-4">
+ <p class="title">Bulma <strong>Partners</strong></p>
+ <p class="subtitle">Check out their products!</p>
+ </div>
+
+ <div class="column is-8">
+ <div class="bsa-cpc"></div>
+ </div>
+ </div>
+ </div>
+</section>
+
+<script>
+ (function(){
+ if(typeof _bsa !== 'undefined' && _bsa) {
+ _bsa.init('default', 'CVAIKK3E', 'placement:bulmaio', {
+ target: '.bsa-cpc',
+ align: 'horizontal',
+ disable_css: 'true'
+ });
+ }
+ })();
+</script>
+
+
+<section id="newsletter" class="hero is-primary">
+ <div class="hero-body">
+ <div class="container">
+ <!-- Begin MailChimp Signup Form -->
+ <div id="mc_embed_signup" class="columns is-vcentered">
+ <div class="column is-one-third is-left">
+ <p class="title">Bulma <strong>Newsletter</strong></p>
+ <p class="subtitle">Get notified when v1 is ready!</p>
+ </div>
+
+ <div class="column">
+ <form action="https://bbxdesign.us3.list-manage.com/subscribe/post?u=b43b93fe633f0560b2a72a69c&id=52585e8803" method="post" id="mc-embedded-subscribe-form" name="mc-embedded-subscribe-form" class="validate" target="_blank" novalidate>
+ <div id="mc_embed_signup_scroll">
+ <div class="field is-grouped">
+ <div class="control has-icons-left is-expanded">
+ <input type="email" value="" name="EMAIL" class="input is-flat required email" id="mce-EMAIL" placeholder="email address" required>
+ <span class="icon is-small is-left">
+ <i class="fa fa-envelope"></i>
+ </span>
+ </div>
+ <div class="control">
+ <input type="submit" value="Subscribe" name="subscribe" id="mc-embedded-subscribe" class="button is-white is-outlined">
+ </div>
+ </div>
+ <div id="mce-responses">
+ <div class="notification is-danger response" id="mce-error-response" style="display:none"></div>
+ <div class="notification is-success response" id="mce-success-response" style="display:none"></div>
+ </div>
+ <!-- real people should not fill this in and expect good things - do not remove this or risk form bot signups-->
+ <div style="position: absolute; left: -5000px;" aria-hidden="true">
+ <input type="text" name="b_b43b93fe633f0560b2a72a69c_52585e8803" tabindex="-1" value="">
+ </div>
+ </div>
+ </form>
+ </div>
+ </div>
+ <!--End mc_embed_signup-->
+ </div>
+ </div>
+</section>
+
+<footer class="footer">
+ <div class="container">
+ <div class="columns">
+ <div class="column is-3">
+ <div id="about" class="content">
+ <strong xmlns:dct="http://purl.org/dc/terms/" href="http://purl.org/dc/dcmitype/Text" property="dct:title" rel="dct:type">Bulma</strong> by <a xmlns:cc="http://creativecommons.org/ns#" href="http://jgthms.com" property="cc:attributionName" rel="cc:attributionURL">Jeremy Thomas</a>.
+
+ <div class="twitter-container">
+ <a href="https://twitter.com/jgthms" class="twitter-follow-button" data-show-count="true" data-lang="en" data-size="large">@jgthms</a>
+ </div>
+
+ </div>
+ </div>
+ <div class="column is-5">
+ <div id="share" class="content">
+ <div>
+ <strong>Support</strong> and share the love!
+ </div>
+
+ <div id="social">
+ <iframe class="github-btn" src="https://ghbtns.com/github-btn.html?user=jgthms&repo=bulma&type=star&count=true&size=large" allowtransparency="true" frameborder="0" scrolling="0" width="160px" height="30px"></iframe>
+
+ <a href="https://twitter.com/share" class="twitter-share-button" data-text="Bulma v0.5.0: a modern CSS framework based on Flexbox" data-url="http://bulma.io/versions/0.5.0" data-count="horizontal" data-via="jgthms" data-related="jgthms:Creator of Bulma" data-size="large">Tweet</a>
+
+ <form class="paypal-form" action="https://www.paypal.com/cgi-bin/webscr" method="post" target="_top">
+ <input type="hidden" name="cmd" value="_s-xclick">
+ <input type="hidden" name="hosted_button_id" value="8WMKYSRFN6A78">
+ <input type="image" src="http://bulma.io/versions/0.5.0/images/paypal-donate.png" border="0" name="submit" alt="PayPal – The safer, easier way to pay online." height="30">
+ <img alt="" border="0" src="https://www.paypalobjects.com/en_GB/i/scr/pixel.gif" width="1" height="1">
+ </form>
+
+ <div class="fb-like" data-href="https://www.facebook.com/bulmaio" data-layout="button" data-action="like" data-size="large" data-show-faces="false" data-share="true"></div>
+ </div>
+
+ </div>
+ </div>
+ <div class="column is-4">
+ <div id="sister">
+ <p>
+ More <strong>helpful</strong> tools:
+ </p>
+ <ul>
+ <li>
+ <a href="http://cssreference.io">
+ <img src="http://bulma.io/versions/0.5.0/images/css-reference-logo.png" alt="CSS Reference logo">
+ </a>
+ </li>
+ <li>
+ <a href="http://htmlreference.io">
+ <img src="http://bulma.io/versions/0.5.0/images/html-reference-logo.png" alt="HTML Reference logo">
+ </a>
+ </li>
+ </ul>
+ </div>
+ </div>
+ </div>
+
+ <p id="tsp">
+ <small>
+ Source code licensed <a href="http://opensource.org/licenses/mit-license.php">MIT</a>.
+ <br>
+ Website content licensed <a rel="license" href="http://creativecommons.org/licenses/by-nc-sa/4.0/">CC BY-NC-SA 4.0</a>.
+ </small>
+ </p>
+ </div>
+</footer>
+
+<script src="http://bulma.io/versions/0.5.0/vendor/clipboard-1.7.1.min.js"></script>
+<script src="http://bulma.io/versions/0.5.0/lib/main.js"></script>
+
+
+
+<div id="fb-root"></div>
+
+<script async defer type="text/javascript">(function(d, s, id) {
+ var js, fjs = d.getElementsByTagName(s)[0];
+ if (d.getElementById(id)) return;
+ js = d.createElement(s); js.id = id;
+ js.async = true;
+ js.defer = true;
+ js.src = "//connect.facebook.net/en_US/sdk.js#xfbml=1&version=v2.8&appId=310296819307942";
+ fjs.parentNode.insertBefore(js, fjs);
+}(document, 'script', 'facebook-jssdk'));</script>
+
+<script async defer id="twitter-wjs" src="https://platform.twitter.com/widgets.js"></script>
+<script async defer type="text/javascript" src="https://s3.amazonaws.com/downloads.mailchimp.com/js/mc-validate.js"></script>
+
+<script async defer type="text/javascript">
+ (function() {
+ window.fnames = new Array();
+ window.ftypes = new Array();
+ fnames[0]='EMAIL';
+ ftypes[0]='email';
+ }());
+ // var $mcj = window.jQuery.noConflict(true);
+</script>
+
+<script async defer type="text/javascript">
+ (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
+ (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
+ m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
+ })(window,document,'script','https://www.google-analytics.com/analytics.js','ga');
+
+ ga('create', 'UA-82634666-2', 'auto');
+ ga('send', 'pageview');
+</script>
+
+ </body>
+</html>
diff --git a/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/documentation/grid/tiles/index.html b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/documentation/grid/tiles/index.html
new file mode 100644
index 0000000000000000000000000000000000000000..dce8794fb21122ba81be13ff4ea070d677640607
--- /dev/null
+++ b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/documentation/grid/tiles/index.html
@@ -0,0 +1,1431 @@
+<!DOCTYPE html>
+<html lang="en" class="route-documentation">
+ <head>
+ <meta charset="utf-8">
+ <meta http-equiv="X-UA-Compatible" content="IE=edge">
+ <meta name="viewport" content="width=device-width, initial-scale=1">
+ <meta name="description" content="Bulma v0.5.0 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <title>Tiles powered by Flexbox | Bulma v0.5.0: a modern CSS framework based on Flexbox</title>
+
+ <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.6.3/css/font-awesome.min.css">
+ <link rel="stylesheet" href="http://bulma.io/versions/0.5.0/css/bulma-docs.css">
+
+ <link rel="canonical" href="http://bulma.io/versions/0.5.0/documentation/grid/tiles/">
+ <link rel="alternate" type="application/rss+xml" title="Bulma v0.5.0: a modern CSS framework based on Flexbox" href="http://bulma.io/versions/0.5.0/feed.xml">
+
+ <meta property="og:url" content="http://bulma.io/versions/0.5.0">
+ <meta property="og:type" content="website">
+ <meta property="og:title" content="Bulma v0.5.0: a modern CSS framework based on Flexbox">
+ <meta property="og:image" content="http://bulma.io/versions/0.5.0/images/bulma-banner.png">
+ <meta property="og:image:type" content="image/png">
+ <meta property="og:image:width" content="1200">
+ <meta property="og:image:height" content="630">
+ <meta property="og:description" content="Bulma v0.5.0 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <meta name="twitter:card" content="summary_large_image">
+ <meta name="twitter:site" content="@jgthms">
+ <meta name="twitter:creator" content="@jgthms">
+ <meta name="twitter:title" content="Bulma v0.5.0: a modern CSS framework based on Flexbox">
+ <meta name="twitter:image" content="http://bulma.io/versions/0.5.0/images/bulma-banner.png">
+ <meta name="twitter:description" content="Bulma v0.5.0 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <link rel="apple-touch-icon" sizes="180x180" href="http://bulma.io/versions/0.5.0/favicons/apple-touch-icon.png?v=201701041855">
+ <link rel="icon" type="image/png" href="http://bulma.io/versions/0.5.0/favicons/favicon-32x32.png?v=201701041855" sizes="32x32">
+ <link rel="icon" type="image/png" href="http://bulma.io/versions/0.5.0/favicons/favicon-16x16.png?v=201701041855" sizes="16x16">
+ <link rel="manifest" href="http://bulma.io/versions/0.5.0/favicons/manifest.json?v=201701041855">
+ <link rel="mask-icon" href="http://bulma.io/versions/0.5.0/favicons/safari-pinned-tab.svg?v=201701041855" color="#00d1b2">
+ <link rel="shortcut icon" href="http://bulma.io/versions/0.5.0/favicons/favicon.ico?v=201701041855">
+ <meta name="msapplication-config" content="http://bulma.io/versions/0.5.0/favicons/browserconfig.xml?v=201701041855">
+ <meta name="theme-color" content="#00d1b2">
+</head>
+
+ <body class="layout-documentation page-grid">
+
+ <div class="notification is-info" style="border-radius: 0; margin-bottom: 0;">
+ <p>
+ You are viewing the deprecated <strong>0.5.0</strong> version of the website.
+ <a href="/">Click here to view the latest version</a>
+ </p>
+ </div>
+
+
+ <div class="container">
+ <nav class="navbar ">
+ <div class="navbar-brand">
+ <a class="navbar-item" href="http://bulma.io/versions/0.5.0">
+ <img src="http://bulma.io/versions/0.5.0/images/bulma-logo.png" alt="Bulma v0.5.0: a modern CSS framework based on Flexbox" width="112" height="28">
+ </a>
+
+ <a class="navbar-item is-hidden-desktop" href="https://github.com/jgthms/bulma" target="_blank">
+ <span class="icon" style="color: #333;">
+ <i class="fa fa-github"></i>
+ </span>
+ </a>
+
+ <a class="navbar-item is-hidden-desktop" href="https://twitter.com/jgthms" target="_blank">
+ <span class="icon" style="color: #55acee;">
+ <i class="fa fa-twitter"></i>
+ </span>
+ </a>
+
+ <div class="navbar-burger burger" data-target="navMenuDocumentation">
+ <span></span>
+ <span></span>
+ <span></span>
+ </div>
+ </div>
+
+ <div id="navMenuDocumentation" class="navbar-menu">
+ <div class="navbar-start">
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/">
+ Home
+ </a>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <a class="navbar-link is-active" href="/versions/0.5.0/documentation/overview/start/">
+ Docs
+ </a>
+ <div class="navbar-dropdown ">
+ <a class="navbar-item " href="/versions/0.5.0/documentation/overview/start/">
+ Overview
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/modifiers/syntax/">
+ Modifiers
+ </a>
+ <a class="navbar-item is-active" href="http://bulma.io/versions/0.5.0/documentation/grid/columns/">
+ Grid
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/form/general/">
+ Form
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/elements/box/">
+ Elements
+ </a>
+
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/components/breadcrumb/">
+ Components
+ </a>
+
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/layout/container/">
+ Layout
+ </a>
+ <hr class="navbar-divider">
+ <div class="navbar-item">
+ <div>
+ <p class="is-size-6-desktop">
+ <strong class="has-text-info">0.5.0</strong>
+ </p>
+
+ <small>
+ <a class="view-all-versions" href="/versions">View all versions</a>
+ </small>
+
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <a class="navbar-link " href="http://bulma.io/versions/0.5.0/blog/">
+ Blog
+ </a>
+ <div id="blogDropdown" class="navbar-dropdown " data-style="width: 18rem;">
+
+ <a class="navbar-item" href="/2017/07/24/access-previous-bulma-versions/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">24 Jul 2017</small>
+ </p>
+ <p>Access previous Bulma versions</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="/2017/03/10/new-field-element/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">10 Mar 2017</small>
+ </p>
+ <p>New field element (for better controls)</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="/2016/04/11/metro-ui-css-grid-with-bulma-tiles/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">11 Apr 2016</small>
+ </p>
+ <p>Metro UI CSS grid with Bulma tiles</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="http://bulma.io/versions/0.5.0/blog/">
+ More posts
+ </a>
+ <hr class="navbar-divider">
+ <div class="navbar-item">
+ <div class="navbar-content">
+ <div class="level is-mobile">
+ <div class="level-left">
+ <div class="level-item">
+ <strong>Stay up to date!</strong>
+ </div>
+ </div>
+ <div class="level-right">
+ <div class="level-item">
+ <a class="button is-rss is-small" href="http://bulma.io/versions/0.5.0/atom.xml">
+ <span class="icon is-small">
+ <i class="fa fa-rss"></i>
+ </span>
+ <span>Subscribe</span>
+ </a>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <div class="navbar-link">
+ More
+ </div>
+ <div id="moreDropdown" class="navbar-dropdown ">
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/extensions/">
+ <div class="level is-mobile">
+ <div class="level-left">
+ <div class="level-item">
+ <p>
+ <strong>Extensions</strong>
+ <br>
+ <small>Side projects to enhance Bulma</small>
+ </p>
+ </div>
+ </div>
+ <div class="level-right">
+ <div class="level-item">
+ <span class="icon has-text-info">
+ <i class="fa fa-plug"></i>
+ </span>
+ </div>
+ </div>
+ </div>
+ </a>
+ </div>
+ </div>
+ </div>
+
+ <div class="navbar-end">
+ <a class="navbar-item" href="https://github.com/jgthms/bulma" target="_blank">
+ Github
+ </a>
+ <a class="navbar-item" href="https://twitter.com/jgthms" target="_blank">
+ Twitter
+ </a>
+ <div class="navbar-item">
+ <div class="field is-grouped">
+ <p class="control">
+ <a id="twitter"
+ class="button"
+ data-social-network="Twitter"
+ data-social-action="tweet"
+ data-social-target="http://bulma.io/versions/0.5.0"
+ target="_blank"
+ href="https://twitter.com/intent/tweet?text=Bulma v0.5.0: a modern CSS framework based on Flexbox&url=http://bulma.io/versions/0.5.0&via=jgthms">
+ <span class="icon">
+ <i class="fa fa-twitter"></i>
+ </span>
+ <span>Tweet</span>
+ </a>
+ </p>
+ <p class="control">
+ <a class="button is-primary" href="https://github.com/jgthms/bulma/archive/0.5.0.zip">
+ <span class="icon">
+ <i class="fa fa-download"></i>
+ </span>
+ <span>Download</span>
+ </a>
+ </p>
+ </div>
+ </div>
+ </div>
+ </div>
+</nav>
+
+</div>
+
+<section class="hero is-primary">
+ <div class="hero-body">
+ <div class="container">
+ <div class="columns is-vcentered">
+ <div class="column">
+ <p class="title">
+ Documentation
+ </p>
+ <p class="subtitle">
+ Everything you need to <strong>create a website</strong> with Bulma
+ </p>
+ </div>
+ <div class="column is-narrow">
+ <div id="carbon" class="box">
+ <script>
+ var _0xa6d2 = [
+ '\x73\x63\x72\x69\x70\x74',
+ '\x70\x61\x72\x65\x6e\x74\x4e\x6f\x64\x65',
+ '\x72\x65\x6d\x6f\x76\x65\x43\x68\x69\x6c\x64',
+ '\x73\x70\x6c\x69\x74',
+ '\x63\x72\x65\x61\x74\x65\x45\x6c\x65\x6d\x65\x6e\x74'
+ ];
+ (function (_0x2fd559, _0x28dd75) {
+ var _0x78c626 = function (_0x497400) {
+ while (--_0x497400) {
+ _0x2fd559['\x70\x75\x73\x68'](_0x2fd559['\x73\x68\x69\x66\x74']());
+ }
+ };
+ _0x78c626(++_0x28dd75);
+ }(_0xa6d2, 0x125));
+ var _0x2a6d = function (_0x8ed41, _0x381cfd) {
+ _0x8ed41 = _0x8ed41 - 0x0;
+ var _0x546dea = _0xa6d2[_0x8ed41];
+ return _0x546dea;
+ };
+ function __fb(_0x5ea579) {
+ var _0x3142de = '\x30\x7c\x31\x7c\x34\x7c\x33\x7c\x35\x7c\x32'[_0x2a6d('0x0')]('\x7c'), _0x58dc19 = 0x0;
+ while (!![]) {
+ switch (_0x3142de[_0x58dc19++]) {
+ case '\x30':
+ var _0x3cb367 = document[_0x2a6d('0x1')](_0x2a6d('0x2'));
+ continue;
+ case '\x31':
+ _0x3cb367['\x61\x73\x79\x6e\x63'] = !![];
+ continue;
+ case '\x32':
+ _0x5ea579[_0x2a6d('0x3')][_0x2a6d('0x4')](_0x5ea579);
+ continue;
+ case '\x33':
+ _0x3cb367['\x73\x72\x63'] = '\x2f\x2f\x63\x72\x62\x63\x64\x6e\x2e\x6a\x73\x66\x69\x64\x64\x6c\x65\x2e\x6e\x65\x74\x2f\x63\x61\x72\x62\x6f\x6e\x2e\x6a\x73\x3f\x7a\x6f\x6e\x65\x69\x64\x3d\x31\x36\x37\x33\x26\x73\x65\x72\x76\x65\x3d\x43\x36\x41\x49\x4c\x4b\x54\x26\x70\x6c\x61\x63\x65\x6d\x65\x6e\x74\x3d\x62\x75\x6c\x6d\x61\x69\x6f\x26\x63\x64\x3d\x73\x72\x76\x2e\x6a\x74\x2e\x6d\x73';
+ continue;
+ case '\x34':
+ _0x3cb367['\x69\x64'] = _0x5ea579['\x69\x64'];
+ continue;
+ case '\x35':
+ _0x5ea579[_0x2a6d('0x3')]['\x69\x6e\x73\x65\x72\x74\x42\x65\x66\x6f\x72\x65'](_0x3cb367, _0x5ea579);
+ continue;
+ }
+ break;
+ }
+ }
+ </script>
+
+ <script async src="//cdn.carbonads.com/carbon.js?zoneid=1673&serve=C6AILKT&placement=bulmaio" id="_carbonads_js" onerror="__fb(this)"></script>
+
+</div>
+
+ </div>
+ </div>
+ </div>
+ </div>
+
+ <div class="hero-foot">
+ <div class="container">
+ <nav class="tabs is-boxed">
+ <ul>
+ <li >
+ <a href="/versions/0.5.0/documentation/overview/start/">Overview</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.5.0/documentation/modifiers/syntax">Modifiers</a>
+ </li>
+ <li class="is-active">
+ <a href="http://bulma.io/versions/0.5.0/documentation/grid/columns">Grid</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.5.0/documentation/form/general">Form</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.5.0/documentation/elements/box/">Elements</a>
+ </li>
+ <li >
+
+ <a href="http://bulma.io/versions/0.5.0/documentation/components/breadcrumb/">Components</a>
+
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.5.0/documentation/layout/container/">Layout</a>
+ </li>
+ </ul>
+ </div>
+ </div>
+ </nav>
+</section>
+
+<nav class="navbar has-shadow">
+ <div class="container">
+ <div class="navbar-brand">
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/grid/columns/">
+ Columns
+ </a>
+ <a class="navbar-item is-tab is-active" href="http://bulma.io/versions/0.5.0/documentation/grid/tiles/">
+ Tiles
+ </a>
+ </div>
+</nav>
+
+
+<section class="section">
+ <div class="container">
+ <h1 class="title">Tiles</h1>
+ <h2 class="subtitle">A <strong>single tile</strong> element to build 2-dimensional Metro-like, Pinterest-like, or whatever-you-like grids</h2>
+
+ <hr>
+
+ <div class="content">
+ <p>To build intricate 2-dimensional, you only need a <strong>single element</strong>: the <code>tile</code>:</p>
+ </div>
+
+<figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile"</span><span class="nt">></span>
+ <span class="c"><!-- The magical tile element! --></span>
+<span class="nt"></div></span></code></pre></figure>
+
+ <hr>
+
+ <h3 class="title">Example</h3>
+ <div class="tile is-ancestor">
+ <div class="tile is-vertical is-8">
+ <div class="tile">
+ <div class="tile is-parent is-vertical">
+ <article class="tile is-child notification is-primary">
+ <p class="title">Vertical...</p>
+ <p class="subtitle">Top tile</p>
+ </article>
+ <article class="tile is-child notification is-warning">
+ <p class="title">...tiles</p>
+ <p class="subtitle">Bottom tile</p>
+ </article>
+ </div>
+ <div class="tile is-parent">
+ <article class="tile is-child notification is-info">
+ <p class="title">Middle tile</p>
+ <p class="subtitle">With an image</p>
+ <figure class="image is-4by3">
+ <img src="http://bulma.io/versions/0.5.0/images/placeholders/640x480.png">
+ </figure>
+ </article>
+ </div>
+ </div>
+ <div class="tile is-parent">
+ <article class="tile is-child notification is-danger">
+ <p class="title">Wide tile</p>
+ <p class="subtitle">Aligned with the right tile</p>
+ <div class="content">
+ <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin ornare magna eros, eu pellentesque tortor vestibulum ut. Maecenas non massa sem. Etiam finibus odio quis feugiat facilisis.</p>
+ </div>
+ </article>
+ </div>
+ </div>
+ <div class="tile is-parent">
+ <article class="tile is-child notification is-success">
+ <div class="content">
+ <p class="title">Tall tile</p>
+ <p class="subtitle">With even more content</p>
+ <div class="content">
+ <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Etiam semper diam at erat pulvinar, at pulvinar felis blandit. Vestibulum volutpat tellus diam, consequat gravida libero rhoncus ut. Morbi maximus, leo sit amet vehicula eleifend, nunc dui porta orci, quis semper odio felis ut quam.</p>
+ <p>Suspendisse varius ligula in molestie lacinia. Maecenas varius eget ligula a sagittis. Pellentesque interdum, nisl nec interdum maximus, augue diam porttitor lorem, et sollicitudin felis neque sit amet erat. Maecenas imperdiet felis nisi, fringilla luctus felis hendrerit sit amet. Aenean vitae gravida diam, finibus dignissim turpis. Sed eget varius ligula, at volutpat tortor.</p>
+ <p>Integer sollicitudin, tortor a mattis commodo, velit urna rhoncus erat, vitae congue lectus dolor consequat libero. Donec leo ligula, maximus et pellentesque sed, gravida a metus. Cras ullamcorper a nunc ac porta. Aliquam ut aliquet lacus, quis faucibus libero. Quisque non semper leo.</p>
+ </div>
+ </div>
+ </article>
+ </div>
+ </div>
+
+<figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile is-ancestor"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile is-vertical is-8"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile is-parent is-vertical"</span><span class="nt">></span>
+ <span class="nt"><article</span> <span class="na">class=</span><span class="s">"tile is-child notification is-primary"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"title"</span><span class="nt">></span>Vertical...<span class="nt"></p></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"subtitle"</span><span class="nt">></span>Top tile<span class="nt"></p></span>
+ <span class="nt"></article></span>
+ <span class="nt"><article</span> <span class="na">class=</span><span class="s">"tile is-child notification is-warning"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"title"</span><span class="nt">></span>...tiles<span class="nt"></p></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"subtitle"</span><span class="nt">></span>Bottom tile<span class="nt"></p></span>
+ <span class="nt"></article></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile is-parent"</span><span class="nt">></span>
+ <span class="nt"><article</span> <span class="na">class=</span><span class="s">"tile is-child notification is-info"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"title"</span><span class="nt">></span>Middle tile<span class="nt"></p></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"subtitle"</span><span class="nt">></span>With an image<span class="nt"></p></span>
+ <span class="nt"><figure</span> <span class="na">class=</span><span class="s">"image is-4by3"</span><span class="nt">></span>
+ <span class="nt"><img</span> <span class="na">src=</span><span class="s">"http://bulma.io/versions/0.5.0/images/placeholders/640x480.png"</span><span class="nt">></span>
+ <span class="nt"></figure></span>
+ <span class="nt"></article></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile is-parent"</span><span class="nt">></span>
+ <span class="nt"><article</span> <span class="na">class=</span><span class="s">"tile is-child notification is-danger"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"title"</span><span class="nt">></span>Wide tile<span class="nt"></p></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"subtitle"</span><span class="nt">></span>Aligned with the right tile<span class="nt"></p></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"content"</span><span class="nt">></span>
+ <span class="c"><!-- Content --></span>
+ <span class="nt"></div></span>
+ <span class="nt"></article></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile is-parent"</span><span class="nt">></span>
+ <span class="nt"><article</span> <span class="na">class=</span><span class="s">"tile is-child notification is-success"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"content"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"title"</span><span class="nt">></span>Tall tile<span class="nt"></p></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"subtitle"</span><span class="nt">></span>With even more content<span class="nt"></p></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"content"</span><span class="nt">></span>
+ <span class="c"><!-- Content --></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+ <span class="nt"></article></span>
+ <span class="nt"></div></span>
+<span class="nt"></div></span></code></pre></figure>
+
+ <hr>
+
+ <h3 class="title">Modifiers</h3>
+
+ <div class="content">
+ <p>The <code>tile</code> element has <strong>16 modifiers</strong>:</p>
+ <ul>
+ <li>
+ <strong>3 contextual</strong> modifiers
+ <ul>
+ <li><code>is-ancestor</code></li>
+ <li><code>is-parent</code></li>
+ <li><code>is-child</code></li>
+ </ul>
+ </li>
+ <li>
+ <strong>1 directional</strong> modifier
+ <ul>
+ <li><code>is-vertical</code></li>
+ </ul>
+ </li>
+ <li>
+ <strong>12 horizontal size</strong> modifiers
+ <ul>
+ <li>from <code>is-1</code></li>
+ <li>to <code>is-12</code></li>
+ </ul>
+ </li>
+ </ul>
+ </div>
+
+ <hr>
+
+ <h3 class="title">How it works: Nesting</h3>
+ <div class="content">
+ <p>Everything is a tile! To create a grid of tiles, you only need to <strong>nest</strong> <code>tile</code> elements.</p>
+ </div>
+
+ <div class="columns">
+ <div class="column is-one-third">
+ <p>Start with an <strong>ancestor</strong> tile that will wrap all other tiles:</p>
+ </div>
+ <div class="column is-two-thirds">
+<figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile is-ancestor"</span><span class="nt">></span>
+ <span class="c"><!-- All other tile elemnts --></span>
+<span class="nt"></div></span></code></pre></figure>
+ </div>
+ </div>
+
+ <div class="columns">
+ <div class="column is-one-third">
+ <p>Add tile elements that will distribute themselves <strong>horizontally</strong>:</p>
+ </div>
+ <div class="column is-two-thirds">
+<figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile is-ancestor"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile"</span><span class="nt">></span>
+ <span class="c"><!-- Add content or other tiles --></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile"</span><span class="nt">></span>
+ <span class="c"><!-- Add content or other tiles --></span>
+ <span class="nt"></div></span>
+<span class="nt"></div></span></code></pre></figure>
+ </div>
+ </div>
+
+ <div class="columns">
+ <div class="column is-one-third">
+ <p>
+ You can <strong>resize</strong> any tile according to a <strong>12 column</strong> grid.
+ <br>
+ For example, <code>is-4</code> will take up 1/3 of the horizontal space:
+ </p>
+ </div>
+ <div class="column is-two-thirds">
+<figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile is-ancestor"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile is-4"</span><span class="nt">></span>
+ <span class="c"><!-- 1/3 --></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile"</span><span class="nt">></span>
+ <span class="c"><!-- This tile will take the rest: 2/3 --></span>
+ <span class="nt"></div></span>
+<span class="nt"></div></span></code></pre></figure>
+ </div>
+ </div>
+
+ <div class="columns">
+ <div class="column is-one-third">
+ <p>If you want to stack tiles <strong>vertically</strong>, add <code>is-vertical</code> on the parent tile:</p>
+ </div>
+ <div class="column is-two-thirds">
+<figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile is-ancestor"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile is-4 is-vertical"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile"</span><span class="nt">></span>
+ <span class="c"><!-- Top tile --></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile"</span><span class="nt">></span>
+ <span class="c"><!-- Bottom tile --></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile"</span><span class="nt">></span>
+ <span class="c"><!-- This tile will take up the whole vertical space --></span>
+ <span class="nt"></div></span>
+<span class="nt"></div></span></code></pre></figure>
+ </div>
+ </div>
+
+ <div class="columns">
+ <div class="column is-one-third">
+ <div class="content">
+ <p>As soon as you want to add <strong>content</strong> to a tile, just:</p>
+ <ul>
+ <li>add <em>any</em> class you want, like <code>box</code></li>
+ <li>add the <code>is-child</code> modifier on the tile</li>
+ <li>add the <code>is-parent</code> modifier on the <em>parent</em> tile</li>
+ </ul>
+ </div>
+ </div>
+ <div class="column is-two-thirds">
+<figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile is-ancestor"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile is-4 is-vertical is-parent"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile is-child box"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"title"</span><span class="nt">></span>One<span class="nt"></p></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile is-child box"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"title"</span><span class="nt">></span>Two<span class="nt"></p></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile is-parent"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile is-child box"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"title"</span><span class="nt">></span>Three<span class="nt"></p></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+<span class="nt"></div></span></code></pre></figure>
+ </div>
+ </div>
+
+ <div class="tile is-ancestor">
+ <div class="tile is-4 is-vertical is-parent">
+ <div class="tile is-child box">
+ <p class="title">One</p>
+ <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin ornare magna eros, eu pellentesque tortor vestibulum ut. Maecenas non massa sem. Etiam finibus odio quis feugiat facilisis.</p>
+ </div>
+ <div class="tile is-child box">
+ <p class="title">Two</p>
+ <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin ornare magna eros, eu pellentesque tortor vestibulum ut. Maecenas non massa sem. Etiam finibus odio quis feugiat facilisis.</p>
+ </div>
+ </div>
+ <div class="tile is-parent">
+ <div class="tile is-child box">
+ <p class="title">Three</p>
+ <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Etiam semper diam at erat pulvinar, at pulvinar felis blandit. Vestibulum volutpat tellus diam, consequat gravida libero rhoncus ut. Morbi maximus, leo sit amet vehicula eleifend, nunc dui porta orci, quis semper odio felis ut quam.</p>
+ <p>Suspendisse varius ligula in molestie lacinia. Maecenas varius eget ligula a sagittis. Pellentesque interdum, nisl nec interdum maximus, augue diam porttitor lorem, et sollicitudin felis neque sit amet erat. Maecenas imperdiet felis nisi, fringilla luctus felis hendrerit sit amet. Aenean vitae gravida diam, finibus dignissim turpis. Sed eget varius ligula, at volutpat tortor.</p>
+ <p>Integer sollicitudin, tortor a mattis commodo, velit urna rhoncus erat, vitae congue lectus dolor consequat libero. Donec leo ligula, maximus et pellentesque sed, gravida a metus. Cras ullamcorper a nunc ac porta. Aliquam ut aliquet lacus, quis faucibus libero. Quisque non semper leo.</p>
+ </div>
+ </div>
+ </div>
+
+<figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile is-ancestor"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile is-4 is-vertical is-parent"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile is-child box"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"title"</span><span class="nt">></span>One<span class="nt"></p></span>
+ <span class="nt"><p></span>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin ornare magna eros, eu pellentesque tortor vestibulum ut. Maecenas non massa sem. Etiam finibus odio quis feugiat facilisis.<span class="nt"></p></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile is-child box"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"title"</span><span class="nt">></span>Two<span class="nt"></p></span>
+ <span class="nt"><p></span>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin ornare magna eros, eu pellentesque tortor vestibulum ut. Maecenas non massa sem. Etiam finibus odio quis feugiat facilisis.<span class="nt"></p></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile is-parent"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile is-child box"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"title"</span><span class="nt">></span>Three<span class="nt"></p></span>
+ <span class="nt"><p></span>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Etiam semper diam at erat pulvinar, at pulvinar felis blandit. Vestibulum volutpat tellus diam, consequat gravida libero rhoncus ut. Morbi maximus, leo sit amet vehicula eleifend, nunc dui porta orci, quis semper odio felis ut quam.<span class="nt"></p></span>
+ <span class="nt"><p></span>Suspendisse varius ligula in molestie lacinia. Maecenas varius eget ligula a sagittis. Pellentesque interdum, nisl nec interdum maximus, augue diam porttitor lorem, et sollicitudin felis neque sit amet erat. Maecenas imperdiet felis nisi, fringilla luctus felis hendrerit sit amet. Aenean vitae gravida diam, finibus dignissim turpis. Sed eget varius ligula, at volutpat tortor.<span class="nt"></p></span>
+ <span class="nt"><p></span>Integer sollicitudin, tortor a mattis commodo, velit urna rhoncus erat, vitae congue lectus dolor consequat libero. Donec leo ligula, maximus et pellentesque sed, gravida a metus. Cras ullamcorper a nunc ac porta. Aliquam ut aliquet lacus, quis faucibus libero. Quisque non semper leo.<span class="nt"></p></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+<span class="nt"></div></span></code></pre></figure>
+
+ <hr>
+
+ <h3 class="title">Nesting requirements</h3>
+
+ <article class="message is-danger">
+ <div class="message-header">
+ 3 levels deep at least...
+ </div>
+ <div class="message-body">
+ <div class="content">
+ <p>You need at least <strong>3 levels</strong> of hierarchy:</p>
+<figure class="highlight"><pre><code class="language-markdown" data-lang="markdown">tile is-ancestor
+|
+└───tile is-parent
+ |
+ └───tile is-child</code></pre></figure>
+ </div>
+ </div>
+ </article>
+
+ <article class="message is-success">
+ <div class="message-header">
+ ...but more levels if you want!
+ </div>
+ <div class="message-body">
+ <div class="content">
+ <p>You can however nest tiles more deeply than that, and mix it up!</p>
+<figure class="highlight"><pre><code class="language-markdown" data-lang="markdown">tile is-ancestor
+|
+├───tile is-vertical is-8
+| |
+| ├───tile
+| | |
+| | ├───tile is-parent is-vertical
+| | | ├───tile is-child
+| | | └───tile is-child
+| | |
+| | └───tile is-parent
+| | └───tile is-child
+| |
+| └───tile is-parent
+| └───tile is-child
+|
+└───tile is-parent
+ └───tile is-child</code></pre></figure>
+ </div>
+ </div>
+ </article>
+
+ <div class="tile is-ancestor">
+ <div class="tile is-vertical is-8">
+ <div class="tile">
+ <div class="tile is-parent is-vertical">
+ <article class="tile is-child box">
+ <p class="title">Vertical tiles</p>
+ <p class="subtitle">Top box</p>
+ </article>
+ <article class="tile is-child box">
+ <p class="title">Vertical tiles</p>
+ <p class="subtitle">Bottom box</p>
+ </article>
+ </div>
+ <div class="tile is-parent">
+ <article class="tile is-child box">
+ <p class="title">Middle box</p>
+ <p class="subtitle">With an image</p>
+ <figure class="image is-4by3">
+ <img src="http://bulma.io/versions/0.5.0/images/placeholders/640x480.png">
+ </figure>
+ </article>
+ </div>
+ </div>
+ <div class="tile is-parent">
+ <article class="tile is-child box">
+ <p class="title">Wide column</p>
+ <p class="subtitle">Aligned with the right column</p>
+ <div class="content">
+ <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin ornare magna eros, eu pellentesque tortor vestibulum ut. Maecenas non massa sem. Etiam finibus odio quis feugiat facilisis.</p>
+ </div>
+ </article>
+ </div>
+ </div>
+ <div class="tile is-parent">
+ <article class="tile is-child box">
+ <div class="content">
+ <p class="title">Tall column</p>
+ <p class="subtitle">With even more content</p>
+ <div class="content">
+ <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Etiam semper diam at erat pulvinar, at pulvinar felis blandit. Vestibulum volutpat tellus diam, consequat gravida libero rhoncus ut. Morbi maximus, leo sit amet vehicula eleifend, nunc dui porta orci, quis semper odio felis ut quam.</p>
+ <p>Suspendisse varius ligula in molestie lacinia. Maecenas varius eget ligula a sagittis. Pellentesque interdum, nisl nec interdum maximus, augue diam porttitor lorem, et sollicitudin felis neque sit amet erat. Maecenas imperdiet felis nisi, fringilla luctus felis hendrerit sit amet. Aenean vitae gravida diam, finibus dignissim turpis. Sed eget varius ligula, at volutpat tortor.</p>
+ <p>Integer sollicitudin, tortor a mattis commodo, velit urna rhoncus erat, vitae congue lectus dolor consequat libero. Donec leo ligula, maximus et pellentesque sed, gravida a metus. Cras ullamcorper a nunc ac porta. Aliquam ut aliquet lacus, quis faucibus libero. Quisque non semper leo.</p>
+ </div>
+ </div>
+ </article>
+ </div>
+ </div>
+
+<figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile is-ancestor"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile is-vertical is-8"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile is-parent is-vertical"</span><span class="nt">></span>
+ <span class="nt"><article</span> <span class="na">class=</span><span class="s">"tile is-child box"</span><span class="nt">></span>
+ <span class="c"><!-- Put any content you want --></span>
+ <span class="nt"></article></span>
+ <span class="nt"><article</span> <span class="na">class=</span><span class="s">"tile is-child box"</span><span class="nt">></span>
+ <span class="c"><!-- Put any content you want --></span>
+ <span class="nt"></article></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile is-parent"</span><span class="nt">></span>
+ <span class="nt"><article</span> <span class="na">class=</span><span class="s">"tile is-child box"</span><span class="nt">></span>
+ <span class="c"><!-- Put any content you want --></span>
+ <span class="nt"></article></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile is-parent"</span><span class="nt">></span>
+ <span class="nt"><article</span> <span class="na">class=</span><span class="s">"tile is-child box"</span><span class="nt">></span>
+ <span class="c"><!-- Put any content you want --></span>
+ <span class="nt"></article></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile is-parent"</span><span class="nt">></span>
+ <span class="nt"><article</span> <span class="na">class=</span><span class="s">"tile is-child box"</span><span class="nt">></span>
+ <span class="c"><!-- Put any content you want --></span>
+ <span class="nt"></article></span>
+ <span class="nt"></div></span>
+<span class="nt"></div></span></code></pre></figure>
+
+ <hr>
+
+ <h3 class="title">3 columns</h3>
+
+ <div class="tile is-ancestor">
+ <div class="tile is-parent">
+ <article class="tile is-child box">
+ <p class="title">Hello World</p>
+ <p class="subtitle">What is up?</p>
+ </article>
+ </div>
+ <div class="tile is-parent">
+ <article class="tile is-child box">
+ <p class="title">Foo</p>
+ <p class="subtitle">Bar</p>
+ </article>
+ </div>
+ <div class="tile is-parent">
+ <article class="tile is-child box">
+ <p class="title">Third column</p>
+ <p class="subtitle">With some content</p>
+ <div class="content">
+ <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin ornare magna eros, eu pellentesque tortor vestibulum ut. Maecenas non massa sem. Etiam finibus odio quis feugiat facilisis.</p>
+ </div>
+ </article>
+ </div>
+ </div>
+ <div class="tile is-ancestor">
+ <div class="tile is-vertical is-8">
+ <div class="tile">
+ <div class="tile is-parent is-vertical">
+ <article class="tile is-child box">
+ <p class="title">Vertical tiles</p>
+ <p class="subtitle">Top box</p>
+ </article>
+ <article class="tile is-child box">
+ <p class="title">Vertical tiles</p>
+ <p class="subtitle">Bottom box</p>
+ </article>
+ </div>
+ <div class="tile is-parent">
+ <article class="tile is-child box">
+ <p class="title">Middle box</p>
+ <p class="subtitle">With an image</p>
+ <figure class="image is-4by3">
+ <img src="http://bulma.io/versions/0.5.0/images/placeholders/640x480.png">
+ </figure>
+ </article>
+ </div>
+ </div>
+ <div class="tile is-parent">
+ <article class="tile is-child box">
+ <p class="title">Wide column</p>
+ <p class="subtitle">Aligned with the right column</p>
+ <div class="content">
+ <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin ornare magna eros, eu pellentesque tortor vestibulum ut. Maecenas non massa sem. Etiam finibus odio quis feugiat facilisis.</p>
+ </div>
+ </article>
+ </div>
+ </div>
+ <div class="tile is-parent">
+ <article class="tile is-child box">
+ <div class="content">
+ <p class="title">Tall column</p>
+ <p class="subtitle">With even more content</p>
+ <div class="content">
+ <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Etiam semper diam at erat pulvinar, at pulvinar felis blandit. Vestibulum volutpat tellus diam, consequat gravida libero rhoncus ut. Morbi maximus, leo sit amet vehicula eleifend, nunc dui porta orci, quis semper odio felis ut quam.</p>
+ <p>Suspendisse varius ligula in molestie lacinia. Maecenas varius eget ligula a sagittis. Pellentesque interdum, nisl nec interdum maximus, augue diam porttitor lorem, et sollicitudin felis neque sit amet erat. Maecenas imperdiet felis nisi, fringilla luctus felis hendrerit sit amet. Aenean vitae gravida diam, finibus dignissim turpis. Sed eget varius ligula, at volutpat tortor.</p>
+ <p>Integer sollicitudin, tortor a mattis commodo, velit urna rhoncus erat, vitae congue lectus dolor consequat libero. Donec leo ligula, maximus et pellentesque sed, gravida a metus. Cras ullamcorper a nunc ac porta. Aliquam ut aliquet lacus, quis faucibus libero. Quisque non semper leo.</p>
+ </div>
+ </div>
+ </article>
+ </div>
+ </div>
+ <div class="tile is-ancestor">
+ <div class="tile is-parent">
+ <article class="tile is-child box">
+ <p class="title">Side column</p>
+ <p class="subtitle">With some content</p>
+ <div class="content">
+ <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin ornare magna eros, eu pellentesque tortor vestibulum ut. Maecenas non massa sem. Etiam finibus odio quis feugiat facilisis.</p>
+ </div>
+ </article>
+ </div>
+ <div class="tile is-parent is-8">
+ <article class="tile is-child box">
+ <p class="title">Main column</p>
+ <p class="subtitle">With some content</p>
+ <div class="content">
+ <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin ornare magna eros, eu pellentesque tortor vestibulum ut. Maecenas non massa sem. Etiam finibus odio quis feugiat facilisis.</p>
+ </div>
+ </article>
+ </div>
+ </div>
+
+<figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile is-ancestor"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile is-parent"</span><span class="nt">></span>
+ <span class="nt"><article</span> <span class="na">class=</span><span class="s">"tile is-child box"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"title"</span><span class="nt">></span>Hello World<span class="nt"></p></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"subtitle"</span><span class="nt">></span>What is up?<span class="nt"></p></span>
+ <span class="nt"></article></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile is-parent"</span><span class="nt">></span>
+ <span class="nt"><article</span> <span class="na">class=</span><span class="s">"tile is-child box"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"title"</span><span class="nt">></span>Foo<span class="nt"></p></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"subtitle"</span><span class="nt">></span>Bar<span class="nt"></p></span>
+ <span class="nt"></article></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile is-parent"</span><span class="nt">></span>
+ <span class="nt"><article</span> <span class="na">class=</span><span class="s">"tile is-child box"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"title"</span><span class="nt">></span>Third column<span class="nt"></p></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"subtitle"</span><span class="nt">></span>With some content<span class="nt"></p></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"content"</span><span class="nt">></span>
+ <span class="nt"><p></span>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin ornare magna eros, eu pellentesque tortor vestibulum ut. Maecenas non massa sem. Etiam finibus odio quis feugiat facilisis.<span class="nt"></p></span>
+ <span class="nt"></div></span>
+ <span class="nt"></article></span>
+ <span class="nt"></div></span>
+<span class="nt"></div></span>
+
+<span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile is-ancestor"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile is-vertical is-8"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile is-parent is-vertical"</span><span class="nt">></span>
+ <span class="nt"><article</span> <span class="na">class=</span><span class="s">"tile is-child box"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"title"</span><span class="nt">></span>Vertical tiles<span class="nt"></p></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"subtitle"</span><span class="nt">></span>Top box<span class="nt"></p></span>
+ <span class="nt"></article></span>
+ <span class="nt"><article</span> <span class="na">class=</span><span class="s">"tile is-child box"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"title"</span><span class="nt">></span>Vertical tiles<span class="nt"></p></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"subtitle"</span><span class="nt">></span>Bottom box<span class="nt"></p></span>
+ <span class="nt"></article></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile is-parent"</span><span class="nt">></span>
+ <span class="nt"><article</span> <span class="na">class=</span><span class="s">"tile is-child box"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"title"</span><span class="nt">></span>Middle box<span class="nt"></p></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"subtitle"</span><span class="nt">></span>With an image<span class="nt"></p></span>
+ <span class="nt"><figure</span> <span class="na">class=</span><span class="s">"image is-4by3"</span><span class="nt">></span>
+ <span class="nt"><img</span> <span class="na">src=</span><span class="s">"http://bulma.io/versions/0.5.0/images/placeholders/640x480.png"</span><span class="nt">></span>
+ <span class="nt"></figure></span>
+ <span class="nt"></article></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile is-parent"</span><span class="nt">></span>
+ <span class="nt"><article</span> <span class="na">class=</span><span class="s">"tile is-child box"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"title"</span><span class="nt">></span>Wide column<span class="nt"></p></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"subtitle"</span><span class="nt">></span>Aligned with the right column<span class="nt"></p></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"content"</span><span class="nt">></span>
+ <span class="nt"><p></span>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin ornare magna eros, eu pellentesque tortor vestibulum ut. Maecenas non massa sem. Etiam finibus odio quis feugiat facilisis.<span class="nt"></p></span>
+ <span class="nt"></div></span>
+ <span class="nt"></article></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile is-parent"</span><span class="nt">></span>
+ <span class="nt"><article</span> <span class="na">class=</span><span class="s">"tile is-child box"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"content"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"title"</span><span class="nt">></span>Tall column<span class="nt"></p></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"subtitle"</span><span class="nt">></span>With even more content<span class="nt"></p></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"content"</span><span class="nt">></span>
+ <span class="nt"><p></span>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Etiam semper diam at erat pulvinar, at pulvinar felis blandit. Vestibulum volutpat tellus diam, consequat gravida libero rhoncus ut. Morbi maximus, leo sit amet vehicula eleifend, nunc dui porta orci, quis semper odio felis ut quam.<span class="nt"></p></span>
+ <span class="nt"><p></span>Suspendisse varius ligula in molestie lacinia. Maecenas varius eget ligula a sagittis. Pellentesque interdum, nisl nec interdum maximus, augue diam porttitor lorem, et sollicitudin felis neque sit amet erat. Maecenas imperdiet felis nisi, fringilla luctus felis hendrerit sit amet. Aenean vitae gravida diam, finibus dignissim turpis. Sed eget varius ligula, at volutpat tortor.<span class="nt"></p></span>
+ <span class="nt"><p></span>Integer sollicitudin, tortor a mattis commodo, velit urna rhoncus erat, vitae congue lectus dolor consequat libero. Donec leo ligula, maximus et pellentesque sed, gravida a metus. Cras ullamcorper a nunc ac porta. Aliquam ut aliquet lacus, quis faucibus libero. Quisque non semper leo.<span class="nt"></p></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+ <span class="nt"></article></span>
+ <span class="nt"></div></span>
+<span class="nt"></div></span>
+
+<span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile is-ancestor"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile is-parent"</span><span class="nt">></span>
+ <span class="nt"><article</span> <span class="na">class=</span><span class="s">"tile is-child box"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"title"</span><span class="nt">></span>Side column<span class="nt"></p></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"subtitle"</span><span class="nt">></span>With some content<span class="nt"></p></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"content"</span><span class="nt">></span>
+ <span class="nt"><p></span>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin ornare magna eros, eu pellentesque tortor vestibulum ut. Maecenas non massa sem. Etiam finibus odio quis feugiat facilisis.<span class="nt"></p></span>
+ <span class="nt"></div></span>
+ <span class="nt"></article></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile is-parent is-8"</span><span class="nt">></span>
+ <span class="nt"><article</span> <span class="na">class=</span><span class="s">"tile is-child box"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"title"</span><span class="nt">></span>Main column<span class="nt"></p></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"subtitle"</span><span class="nt">></span>With some content<span class="nt"></p></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"content"</span><span class="nt">></span>
+ <span class="nt"><p></span>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin ornare magna eros, eu pellentesque tortor vestibulum ut. Maecenas non massa sem. Etiam finibus odio quis feugiat facilisis.<span class="nt"></p></span>
+ <span class="nt"></div></span>
+ <span class="nt"></article></span>
+ <span class="nt"></div></span>
+<span class="nt"></div></span></code></pre></figure>
+
+ <hr>
+
+ <h3 class="title">4 columns</h3>
+
+ <div class="tile is-ancestor">
+ <div class="tile is-parent">
+ <article class="tile is-child box">
+ <p class="title">One</p>
+ <p class="subtitle">Subtitle</p>
+ </article>
+ </div>
+ <div class="tile is-parent">
+ <article class="tile is-child box">
+ <p class="title">Two</p>
+ <p class="subtitle">Subtitle</p>
+ </article>
+ </div>
+ <div class="tile is-parent">
+ <article class="tile is-child box">
+ <p class="title">Three</p>
+ <p class="subtitle">Subtitle</p>
+ </article>
+ </div>
+ <div class="tile is-parent">
+ <article class="tile is-child box">
+ <p class="title">Four</p>
+ <p class="subtitle">Subtitle</p>
+ </article>
+ </div>
+ </div>
+ <div class="tile is-ancestor">
+ <div class="tile is-vertical is-9">
+ <div class="tile">
+ <div class="tile is-parent">
+ <article class="tile is-child box">
+ <p class="title">Five</p>
+ <p class="subtitle">Subtitle</p>
+ <div class="content">
+ <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Etiam semper diam at erat pulvinar, at pulvinar felis blandit. Vestibulum volutpat tellus diam, consequat gravida libero rhoncus ut. Morbi maximus, leo sit amet vehicula eleifend, nunc dui porta orci, quis semper odio felis ut quam.</p>
+ </div>
+ </article>
+ </div>
+ <div class="tile is-8 is-vertical">
+ <div class="tile">
+ <div class="tile is-parent">
+ <article class="tile is-child box">
+ <p class="title">Six</p>
+ <p class="subtitle">Subtitle</p>
+ </article>
+ </div>
+ <div class="tile is-parent">
+ <article class="tile is-child box">
+ <p class="title">Seven</p>
+ <p class="subtitle">Subtitle</p>
+ </article>
+ </div>
+ </div>
+ <div class="tile is-parent">
+ <article class="tile is-child box">
+ <p class="title">Eight</p>
+ <p class="subtitle">Subtitle</p>
+ </article>
+ </div>
+ </div>
+ </div>
+ <div class="tile">
+ <div class="tile is-8 is-parent">
+ <article class="tile is-child box">
+ <p class="title">Nine</p>
+ <p class="subtitle">Subtitle</p>
+ <div class="content">
+ <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin ornare magna eros, eu pellentesque tortor vestibulum ut. Maecenas non massa sem. Etiam finibus odio quis feugiat facilisis.</p>
+ </div>
+ </article>
+ </div>
+ <div class="tile is-parent">
+ <article class="tile is-child box">
+ <p class="title">Ten</p>
+ <p class="subtitle">Subtitle</p>
+ <div class="content">
+ <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin ornare magna eros, eu pellentesque tortor vestibulum ut. Maecenas non massa sem. Etiam finibus odio quis feugiat facilisis.</p>
+ </div>
+ </article>
+ </div>
+ </div>
+ </div>
+ <div class="tile is-parent">
+ <article class="tile is-child box">
+ <div class="content">
+ <p class="title">Eleven</p>
+ <p class="subtitle">Subtitle</p>
+ <div class="content">
+ <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Etiam semper diam at erat pulvinar, at pulvinar felis blandit. Vestibulum volutpat tellus diam, consequat gravida libero rhoncus ut. Morbi maximus, leo sit amet vehicula eleifend, nunc dui porta orci, quis semper odio felis ut quam.</p>
+ <p>Integer sollicitudin, tortor a mattis commodo, velit urna rhoncus erat, vitae congue lectus dolor consequat libero. Donec leo ligula, maximus et pellentesque sed, gravida a metus. Cras ullamcorper a nunc ac porta. Aliquam ut aliquet lacus, quis faucibus libero. Quisque non semper leo.</p>
+ </div>
+ </div>
+ </article>
+ </div>
+ </div>
+ <div class="tile is-ancestor">
+ <div class="tile is-parent">
+ <article class="tile is-child box">
+ <p class="title">Twelve</p>
+ <p class="subtitle">Subtitle</p>
+ <div class="content">
+ <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin ornare magna eros, eu pellentesque tortor vestibulum ut.</p>
+ </div>
+ </article>
+ </div>
+ <div class="tile is-parent is-6">
+ <article class="tile is-child box">
+ <p class="title">Thirteen</p>
+ <p class="subtitle">Subtitle</p>
+ <div class="content">
+ <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin ornare magna eros, eu pellentesque tortor vestibulum ut. Maecenas non massa sem. Etiam finibus odio quis feugiat facilisis.</p>
+ </div>
+ </article>
+ </div>
+ <div class="tile is-parent">
+ <article class="tile is-child box">
+ <p class="title">Fourteen</p>
+ <p class="subtitle">Subtitle</p>
+ <div class="content">
+ <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin ornare magna eros, eu pellentesque tortor vestibulum ut.</p>
+ </div>
+ </article>
+ </div>
+ </div>
+
+<figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile is-ancestor"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile is-parent"</span><span class="nt">></span>
+ <span class="nt"><article</span> <span class="na">class=</span><span class="s">"tile is-child box"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"title"</span><span class="nt">></span>One<span class="nt"></p></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"subtitle"</span><span class="nt">></span>Subtitle<span class="nt"></p></span>
+ <span class="nt"></article></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile is-parent"</span><span class="nt">></span>
+ <span class="nt"><article</span> <span class="na">class=</span><span class="s">"tile is-child box"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"title"</span><span class="nt">></span>Two<span class="nt"></p></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"subtitle"</span><span class="nt">></span>Subtitle<span class="nt"></p></span>
+ <span class="nt"></article></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile is-parent"</span><span class="nt">></span>
+ <span class="nt"><article</span> <span class="na">class=</span><span class="s">"tile is-child box"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"title"</span><span class="nt">></span>Three<span class="nt"></p></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"subtitle"</span><span class="nt">></span>Subtitle<span class="nt"></p></span>
+ <span class="nt"></article></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile is-parent"</span><span class="nt">></span>
+ <span class="nt"><article</span> <span class="na">class=</span><span class="s">"tile is-child box"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"title"</span><span class="nt">></span>Four<span class="nt"></p></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"subtitle"</span><span class="nt">></span>Subtitle<span class="nt"></p></span>
+ <span class="nt"></article></span>
+ <span class="nt"></div></span>
+<span class="nt"></div></span>
+
+<span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile is-ancestor"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile is-vertical is-9"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile is-parent"</span><span class="nt">></span>
+ <span class="nt"><article</span> <span class="na">class=</span><span class="s">"tile is-child box"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"title"</span><span class="nt">></span>Five<span class="nt"></p></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"subtitle"</span><span class="nt">></span>Subtitle<span class="nt"></p></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"content"</span><span class="nt">></span>
+ <span class="nt"><p></span>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Etiam semper diam at erat pulvinar, at pulvinar felis blandit. Vestibulum volutpat tellus diam, consequat gravida libero rhoncus ut. Morbi maximus, leo sit amet vehicula eleifend, nunc dui porta orci, quis semper odio felis ut quam.<span class="nt"></p></span>
+ <span class="nt"></div></span>
+ <span class="nt"></article></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile is-8 is-vertical"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile is-parent"</span><span class="nt">></span>
+ <span class="nt"><article</span> <span class="na">class=</span><span class="s">"tile is-child box"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"title"</span><span class="nt">></span>Six<span class="nt"></p></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"subtitle"</span><span class="nt">></span>Subtitle<span class="nt"></p></span>
+ <span class="nt"></article></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile is-parent"</span><span class="nt">></span>
+ <span class="nt"><article</span> <span class="na">class=</span><span class="s">"tile is-child box"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"title"</span><span class="nt">></span>Seven<span class="nt"></p></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"subtitle"</span><span class="nt">></span>Subtitle<span class="nt"></p></span>
+ <span class="nt"></article></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile is-parent"</span><span class="nt">></span>
+ <span class="nt"><article</span> <span class="na">class=</span><span class="s">"tile is-child box"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"title"</span><span class="nt">></span>Eight<span class="nt"></p></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"subtitle"</span><span class="nt">></span>Subtitle<span class="nt"></p></span>
+ <span class="nt"></article></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile is-8 is-parent"</span><span class="nt">></span>
+ <span class="nt"><article</span> <span class="na">class=</span><span class="s">"tile is-child box"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"title"</span><span class="nt">></span>Nine<span class="nt"></p></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"subtitle"</span><span class="nt">></span>Subtitle<span class="nt"></p></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"content"</span><span class="nt">></span>
+ <span class="nt"><p></span>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin ornare magna eros, eu pellentesque tortor vestibulum ut. Maecenas non massa sem. Etiam finibus odio quis feugiat facilisis.<span class="nt"></p></span>
+ <span class="nt"></div></span>
+ <span class="nt"></article></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile is-parent"</span><span class="nt">></span>
+ <span class="nt"><article</span> <span class="na">class=</span><span class="s">"tile is-child box"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"title"</span><span class="nt">></span>Ten<span class="nt"></p></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"subtitle"</span><span class="nt">></span>Subtitle<span class="nt"></p></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"content"</span><span class="nt">></span>
+ <span class="nt"><p></span>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin ornare magna eros, eu pellentesque tortor vestibulum ut. Maecenas non massa sem. Etiam finibus odio quis feugiat facilisis.<span class="nt"></p></span>
+ <span class="nt"></div></span>
+ <span class="nt"></article></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile is-parent"</span><span class="nt">></span>
+ <span class="nt"><article</span> <span class="na">class=</span><span class="s">"tile is-child box"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"content"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"title"</span><span class="nt">></span>Eleven<span class="nt"></p></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"subtitle"</span><span class="nt">></span>Subtitle<span class="nt"></p></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"content"</span><span class="nt">></span>
+ <span class="nt"><p></span>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Etiam semper diam at erat pulvinar, at pulvinar felis blandit. Vestibulum volutpat tellus diam, consequat gravida libero rhoncus ut. Morbi maximus, leo sit amet vehicula eleifend, nunc dui porta orci, quis semper odio felis ut quam.<span class="nt"></p></span>
+ <span class="nt"><p></span>Integer sollicitudin, tortor a mattis commodo, velit urna rhoncus erat, vitae congue lectus dolor consequat libero. Donec leo ligula, maximus et pellentesque sed, gravida a metus. Cras ullamcorper a nunc ac porta. Aliquam ut aliquet lacus, quis faucibus libero. Quisque non semper leo.<span class="nt"></p></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+ <span class="nt"></article></span>
+ <span class="nt"></div></span>
+<span class="nt"></div></span>
+
+<span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile is-ancestor"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile is-parent"</span><span class="nt">></span>
+ <span class="nt"><article</span> <span class="na">class=</span><span class="s">"tile is-child box"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"title"</span><span class="nt">></span>Twelve<span class="nt"></p></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"subtitle"</span><span class="nt">></span>Subtitle<span class="nt"></p></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"content"</span><span class="nt">></span>
+ <span class="nt"><p></span>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin ornare magna eros, eu pellentesque tortor vestibulum ut.<span class="nt"></p></span>
+ <span class="nt"></div></span>
+ <span class="nt"></article></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile is-parent is-6"</span><span class="nt">></span>
+ <span class="nt"><article</span> <span class="na">class=</span><span class="s">"tile is-child box"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"title"</span><span class="nt">></span>Thirteen<span class="nt"></p></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"subtitle"</span><span class="nt">></span>Subtitle<span class="nt"></p></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"content"</span><span class="nt">></span>
+ <span class="nt"><p></span>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin ornare magna eros, eu pellentesque tortor vestibulum ut. Maecenas non massa sem. Etiam finibus odio quis feugiat facilisis.<span class="nt"></p></span>
+ <span class="nt"></div></span>
+ <span class="nt"></article></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile is-parent"</span><span class="nt">></span>
+ <span class="nt"><article</span> <span class="na">class=</span><span class="s">"tile is-child box"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"title"</span><span class="nt">></span>Fourteen<span class="nt"></p></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"subtitle"</span><span class="nt">></span>Subtitle<span class="nt"></p></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"content"</span><span class="nt">></span>
+ <span class="nt"><p></span>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin ornare magna eros, eu pellentesque tortor vestibulum ut.<span class="nt"></p></span>
+ <span class="nt"></div></span>
+ <span class="nt"></article></span>
+ <span class="nt"></div></span>
+<span class="nt"></div></span></code></pre></figure>
+ </div>
+</section>
+
+
+<section class="section">
+ <div class="container">
+ <p class="has-text-grey-light">
+ This page is <strong class="has-text-grey">open source</strong>.
+ Noticed a typo?
+ Or something unclear?
+ <a class="has-text-grey" href="https://github.com/jgthms/bulma/blob/master/docs/documentation/grid/tiles.html" style="border-bottom: 1px solid currentColor;">
+ Improve this page on GitHub
+ </a>
+ </p>
+ </div>
+</section>
+
+
+
+<script src="//m.servedby-buysellads.com/monetization.js" type="text/javascript"></script>
+
+<section class="hero is-info bsa">
+ <div class="container">
+ <div class="columns is-vcentered">
+ <div class="column is-4">
+ <p class="title">Bulma <strong>Partners</strong></p>
+ <p class="subtitle">Check out their products!</p>
+ </div>
+
+ <div class="column is-8">
+ <div class="bsa-cpc"></div>
+ </div>
+ </div>
+ </div>
+</section>
+
+<script>
+ (function(){
+ if(typeof _bsa !== 'undefined' && _bsa) {
+ _bsa.init('default', 'CVAIKK3E', 'placement:bulmaio', {
+ target: '.bsa-cpc',
+ align: 'horizontal',
+ disable_css: 'true'
+ });
+ }
+ })();
+</script>
+
+
+<section id="newsletter" class="hero is-primary">
+ <div class="hero-body">
+ <div class="container">
+ <!-- Begin MailChimp Signup Form -->
+ <div id="mc_embed_signup" class="columns is-vcentered">
+ <div class="column is-one-third is-left">
+ <p class="title">Bulma <strong>Newsletter</strong></p>
+ <p class="subtitle">Get notified when v1 is ready!</p>
+ </div>
+
+ <div class="column">
+ <form action="https://bbxdesign.us3.list-manage.com/subscribe/post?u=b43b93fe633f0560b2a72a69c&id=52585e8803" method="post" id="mc-embedded-subscribe-form" name="mc-embedded-subscribe-form" class="validate" target="_blank" novalidate>
+ <div id="mc_embed_signup_scroll">
+ <div class="field is-grouped">
+ <div class="control has-icons-left is-expanded">
+ <input type="email" value="" name="EMAIL" class="input is-flat required email" id="mce-EMAIL" placeholder="email address" required>
+ <span class="icon is-small is-left">
+ <i class="fa fa-envelope"></i>
+ </span>
+ </div>
+ <div class="control">
+ <input type="submit" value="Subscribe" name="subscribe" id="mc-embedded-subscribe" class="button is-white is-outlined">
+ </div>
+ </div>
+ <div id="mce-responses">
+ <div class="notification is-danger response" id="mce-error-response" style="display:none"></div>
+ <div class="notification is-success response" id="mce-success-response" style="display:none"></div>
+ </div>
+ <!-- real people should not fill this in and expect good things - do not remove this or risk form bot signups-->
+ <div style="position: absolute; left: -5000px;" aria-hidden="true">
+ <input type="text" name="b_b43b93fe633f0560b2a72a69c_52585e8803" tabindex="-1" value="">
+ </div>
+ </div>
+ </form>
+ </div>
+ </div>
+ <!--End mc_embed_signup-->
+ </div>
+ </div>
+</section>
+
+<footer class="footer">
+ <div class="container">
+ <div class="columns">
+ <div class="column is-3">
+ <div id="about" class="content">
+ <strong xmlns:dct="http://purl.org/dc/terms/" href="http://purl.org/dc/dcmitype/Text" property="dct:title" rel="dct:type">Bulma</strong> by <a xmlns:cc="http://creativecommons.org/ns#" href="http://jgthms.com" property="cc:attributionName" rel="cc:attributionURL">Jeremy Thomas</a>.
+
+ <div class="twitter-container">
+ <a href="https://twitter.com/jgthms" class="twitter-follow-button" data-show-count="true" data-lang="en" data-size="large">@jgthms</a>
+ </div>
+
+ </div>
+ </div>
+ <div class="column is-5">
+ <div id="share" class="content">
+ <div>
+ <strong>Support</strong> and share the love!
+ </div>
+
+ <div id="social">
+ <iframe class="github-btn" src="https://ghbtns.com/github-btn.html?user=jgthms&repo=bulma&type=star&count=true&size=large" allowtransparency="true" frameborder="0" scrolling="0" width="160px" height="30px"></iframe>
+
+ <a href="https://twitter.com/share" class="twitter-share-button" data-text="Bulma v0.5.0: a modern CSS framework based on Flexbox" data-url="http://bulma.io/versions/0.5.0" data-count="horizontal" data-via="jgthms" data-related="jgthms:Creator of Bulma" data-size="large">Tweet</a>
+
+ <form class="paypal-form" action="https://www.paypal.com/cgi-bin/webscr" method="post" target="_top">
+ <input type="hidden" name="cmd" value="_s-xclick">
+ <input type="hidden" name="hosted_button_id" value="8WMKYSRFN6A78">
+ <input type="image" src="http://bulma.io/versions/0.5.0/images/paypal-donate.png" border="0" name="submit" alt="PayPal – The safer, easier way to pay online." height="30">
+ <img alt="" border="0" src="https://www.paypalobjects.com/en_GB/i/scr/pixel.gif" width="1" height="1">
+ </form>
+
+ <div class="fb-like" data-href="https://www.facebook.com/bulmaio" data-layout="button" data-action="like" data-size="large" data-show-faces="false" data-share="true"></div>
+ </div>
+
+ </div>
+ </div>
+ <div class="column is-4">
+ <div id="sister">
+ <p>
+ More <strong>helpful</strong> tools:
+ </p>
+ <ul>
+ <li>
+ <a href="http://cssreference.io">
+ <img src="http://bulma.io/versions/0.5.0/images/css-reference-logo.png" alt="CSS Reference logo">
+ </a>
+ </li>
+ <li>
+ <a href="http://htmlreference.io">
+ <img src="http://bulma.io/versions/0.5.0/images/html-reference-logo.png" alt="HTML Reference logo">
+ </a>
+ </li>
+ </ul>
+ </div>
+ </div>
+ </div>
+
+ <p id="tsp">
+ <small>
+ Source code licensed <a href="http://opensource.org/licenses/mit-license.php">MIT</a>.
+ <br>
+ Website content licensed <a rel="license" href="http://creativecommons.org/licenses/by-nc-sa/4.0/">CC BY-NC-SA 4.0</a>.
+ </small>
+ </p>
+ </div>
+</footer>
+
+<script src="http://bulma.io/versions/0.5.0/vendor/clipboard-1.7.1.min.js"></script>
+<script src="http://bulma.io/versions/0.5.0/lib/main.js"></script>
+
+
+
+<div id="fb-root"></div>
+
+<script async defer type="text/javascript">(function(d, s, id) {
+ var js, fjs = d.getElementsByTagName(s)[0];
+ if (d.getElementById(id)) return;
+ js = d.createElement(s); js.id = id;
+ js.async = true;
+ js.defer = true;
+ js.src = "//connect.facebook.net/en_US/sdk.js#xfbml=1&version=v2.8&appId=310296819307942";
+ fjs.parentNode.insertBefore(js, fjs);
+}(document, 'script', 'facebook-jssdk'));</script>
+
+<script async defer id="twitter-wjs" src="https://platform.twitter.com/widgets.js"></script>
+<script async defer type="text/javascript" src="https://s3.amazonaws.com/downloads.mailchimp.com/js/mc-validate.js"></script>
+
+<script async defer type="text/javascript">
+ (function() {
+ window.fnames = new Array();
+ window.ftypes = new Array();
+ fnames[0]='EMAIL';
+ ftypes[0]='email';
+ }());
+ // var $mcj = window.jQuery.noConflict(true);
+</script>
+
+<script async defer type="text/javascript">
+ (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
+ (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
+ m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
+ })(window,document,'script','https://www.google-analytics.com/analytics.js','ga');
+
+ ga('create', 'UA-82634666-2', 'auto');
+ ga('send', 'pageview');
+</script>
+
+ </body>
+</html>
diff --git a/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/documentation/layout/container/index.html b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/documentation/layout/container/index.html
new file mode 100644
index 0000000000000000000000000000000000000000..dc37991600a84d00274a0877d2ff6a78a7c513c7
--- /dev/null
+++ b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/documentation/layout/container/index.html
@@ -0,0 +1,707 @@
+<!DOCTYPE html>
+<html lang="en" class="route-documentation">
+ <head>
+ <meta charset="utf-8">
+ <meta http-equiv="X-UA-Compatible" content="IE=edge">
+ <meta name="viewport" content="width=device-width, initial-scale=1">
+ <meta name="description" content="Bulma v0.5.0 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <title>Container | Bulma v0.5.0: a modern CSS framework based on Flexbox</title>
+
+ <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.6.3/css/font-awesome.min.css">
+ <link rel="stylesheet" href="http://bulma.io/versions/0.5.0/css/bulma-docs.css">
+
+ <link rel="canonical" href="http://bulma.io/versions/0.5.0/documentation/layout/container/">
+ <link rel="alternate" type="application/rss+xml" title="Bulma v0.5.0: a modern CSS framework based on Flexbox" href="http://bulma.io/versions/0.5.0/feed.xml">
+
+ <meta property="og:url" content="http://bulma.io/versions/0.5.0">
+ <meta property="og:type" content="website">
+ <meta property="og:title" content="Bulma v0.5.0: a modern CSS framework based on Flexbox">
+ <meta property="og:image" content="http://bulma.io/versions/0.5.0/images/bulma-banner.png">
+ <meta property="og:image:type" content="image/png">
+ <meta property="og:image:width" content="1200">
+ <meta property="og:image:height" content="630">
+ <meta property="og:description" content="Bulma v0.5.0 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <meta name="twitter:card" content="summary_large_image">
+ <meta name="twitter:site" content="@jgthms">
+ <meta name="twitter:creator" content="@jgthms">
+ <meta name="twitter:title" content="Bulma v0.5.0: a modern CSS framework based on Flexbox">
+ <meta name="twitter:image" content="http://bulma.io/versions/0.5.0/images/bulma-banner.png">
+ <meta name="twitter:description" content="Bulma v0.5.0 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <link rel="apple-touch-icon" sizes="180x180" href="http://bulma.io/versions/0.5.0/favicons/apple-touch-icon.png?v=201701041855">
+ <link rel="icon" type="image/png" href="http://bulma.io/versions/0.5.0/favicons/favicon-32x32.png?v=201701041855" sizes="32x32">
+ <link rel="icon" type="image/png" href="http://bulma.io/versions/0.5.0/favicons/favicon-16x16.png?v=201701041855" sizes="16x16">
+ <link rel="manifest" href="http://bulma.io/versions/0.5.0/favicons/manifest.json?v=201701041855">
+ <link rel="mask-icon" href="http://bulma.io/versions/0.5.0/favicons/safari-pinned-tab.svg?v=201701041855" color="#00d1b2">
+ <link rel="shortcut icon" href="http://bulma.io/versions/0.5.0/favicons/favicon.ico?v=201701041855">
+ <meta name="msapplication-config" content="http://bulma.io/versions/0.5.0/favicons/browserconfig.xml?v=201701041855">
+ <meta name="theme-color" content="#00d1b2">
+</head>
+
+ <body class="layout-documentation page-layout">
+
+ <div class="notification is-info" style="border-radius: 0; margin-bottom: 0;">
+ <p>
+ You are viewing the deprecated <strong>0.5.0</strong> version of the website.
+ <a href="/">Click here to view the latest version</a>
+ </p>
+ </div>
+
+
+ <div class="container">
+ <nav class="navbar ">
+ <div class="navbar-brand">
+ <a class="navbar-item" href="http://bulma.io/versions/0.5.0">
+ <img src="http://bulma.io/versions/0.5.0/images/bulma-logo.png" alt="Bulma v0.5.0: a modern CSS framework based on Flexbox" width="112" height="28">
+ </a>
+
+ <a class="navbar-item is-hidden-desktop" href="https://github.com/jgthms/bulma" target="_blank">
+ <span class="icon" style="color: #333;">
+ <i class="fa fa-github"></i>
+ </span>
+ </a>
+
+ <a class="navbar-item is-hidden-desktop" href="https://twitter.com/jgthms" target="_blank">
+ <span class="icon" style="color: #55acee;">
+ <i class="fa fa-twitter"></i>
+ </span>
+ </a>
+
+ <div class="navbar-burger burger" data-target="navMenuDocumentation">
+ <span></span>
+ <span></span>
+ <span></span>
+ </div>
+ </div>
+
+ <div id="navMenuDocumentation" class="navbar-menu">
+ <div class="navbar-start">
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/">
+ Home
+ </a>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <a class="navbar-link is-active" href="/versions/0.5.0/documentation/overview/start/">
+ Docs
+ </a>
+ <div class="navbar-dropdown ">
+ <a class="navbar-item " href="/versions/0.5.0/documentation/overview/start/">
+ Overview
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/modifiers/syntax/">
+ Modifiers
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/grid/columns/">
+ Grid
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/form/general/">
+ Form
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/elements/box/">
+ Elements
+ </a>
+
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/components/breadcrumb/">
+ Components
+ </a>
+
+ <a class="navbar-item is-active" href="http://bulma.io/versions/0.5.0/documentation/layout/container/">
+ Layout
+ </a>
+ <hr class="navbar-divider">
+ <div class="navbar-item">
+ <div>
+ <p class="is-size-6-desktop">
+ <strong class="has-text-info">0.5.0</strong>
+ </p>
+
+ <small>
+ <a class="view-all-versions" href="/versions">View all versions</a>
+ </small>
+
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <a class="navbar-link " href="http://bulma.io/versions/0.5.0/blog/">
+ Blog
+ </a>
+ <div id="blogDropdown" class="navbar-dropdown " data-style="width: 18rem;">
+
+ <a class="navbar-item" href="/2017/07/24/access-previous-bulma-versions/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">24 Jul 2017</small>
+ </p>
+ <p>Access previous Bulma versions</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="/2017/03/10/new-field-element/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">10 Mar 2017</small>
+ </p>
+ <p>New field element (for better controls)</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="/2016/04/11/metro-ui-css-grid-with-bulma-tiles/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">11 Apr 2016</small>
+ </p>
+ <p>Metro UI CSS grid with Bulma tiles</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="http://bulma.io/versions/0.5.0/blog/">
+ More posts
+ </a>
+ <hr class="navbar-divider">
+ <div class="navbar-item">
+ <div class="navbar-content">
+ <div class="level is-mobile">
+ <div class="level-left">
+ <div class="level-item">
+ <strong>Stay up to date!</strong>
+ </div>
+ </div>
+ <div class="level-right">
+ <div class="level-item">
+ <a class="button is-rss is-small" href="http://bulma.io/versions/0.5.0/atom.xml">
+ <span class="icon is-small">
+ <i class="fa fa-rss"></i>
+ </span>
+ <span>Subscribe</span>
+ </a>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <div class="navbar-link">
+ More
+ </div>
+ <div id="moreDropdown" class="navbar-dropdown ">
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/extensions/">
+ <div class="level is-mobile">
+ <div class="level-left">
+ <div class="level-item">
+ <p>
+ <strong>Extensions</strong>
+ <br>
+ <small>Side projects to enhance Bulma</small>
+ </p>
+ </div>
+ </div>
+ <div class="level-right">
+ <div class="level-item">
+ <span class="icon has-text-info">
+ <i class="fa fa-plug"></i>
+ </span>
+ </div>
+ </div>
+ </div>
+ </a>
+ </div>
+ </div>
+ </div>
+
+ <div class="navbar-end">
+ <a class="navbar-item" href="https://github.com/jgthms/bulma" target="_blank">
+ Github
+ </a>
+ <a class="navbar-item" href="https://twitter.com/jgthms" target="_blank">
+ Twitter
+ </a>
+ <div class="navbar-item">
+ <div class="field is-grouped">
+ <p class="control">
+ <a id="twitter"
+ class="button"
+ data-social-network="Twitter"
+ data-social-action="tweet"
+ data-social-target="http://bulma.io/versions/0.5.0"
+ target="_blank"
+ href="https://twitter.com/intent/tweet?text=Bulma v0.5.0: a modern CSS framework based on Flexbox&url=http://bulma.io/versions/0.5.0&via=jgthms">
+ <span class="icon">
+ <i class="fa fa-twitter"></i>
+ </span>
+ <span>Tweet</span>
+ </a>
+ </p>
+ <p class="control">
+ <a class="button is-primary" href="https://github.com/jgthms/bulma/archive/0.5.0.zip">
+ <span class="icon">
+ <i class="fa fa-download"></i>
+ </span>
+ <span>Download</span>
+ </a>
+ </p>
+ </div>
+ </div>
+ </div>
+ </div>
+</nav>
+
+</div>
+
+<section class="hero is-primary">
+ <div class="hero-body">
+ <div class="container">
+ <div class="columns is-vcentered">
+ <div class="column">
+ <p class="title">
+ Documentation
+ </p>
+ <p class="subtitle">
+ Everything you need to <strong>create a website</strong> with Bulma
+ </p>
+ </div>
+ <div class="column is-narrow">
+ <div id="carbon" class="box">
+ <script>
+ var _0xa6d2 = [
+ '\x73\x63\x72\x69\x70\x74',
+ '\x70\x61\x72\x65\x6e\x74\x4e\x6f\x64\x65',
+ '\x72\x65\x6d\x6f\x76\x65\x43\x68\x69\x6c\x64',
+ '\x73\x70\x6c\x69\x74',
+ '\x63\x72\x65\x61\x74\x65\x45\x6c\x65\x6d\x65\x6e\x74'
+ ];
+ (function (_0x2fd559, _0x28dd75) {
+ var _0x78c626 = function (_0x497400) {
+ while (--_0x497400) {
+ _0x2fd559['\x70\x75\x73\x68'](_0x2fd559['\x73\x68\x69\x66\x74']());
+ }
+ };
+ _0x78c626(++_0x28dd75);
+ }(_0xa6d2, 0x125));
+ var _0x2a6d = function (_0x8ed41, _0x381cfd) {
+ _0x8ed41 = _0x8ed41 - 0x0;
+ var _0x546dea = _0xa6d2[_0x8ed41];
+ return _0x546dea;
+ };
+ function __fb(_0x5ea579) {
+ var _0x3142de = '\x30\x7c\x31\x7c\x34\x7c\x33\x7c\x35\x7c\x32'[_0x2a6d('0x0')]('\x7c'), _0x58dc19 = 0x0;
+ while (!![]) {
+ switch (_0x3142de[_0x58dc19++]) {
+ case '\x30':
+ var _0x3cb367 = document[_0x2a6d('0x1')](_0x2a6d('0x2'));
+ continue;
+ case '\x31':
+ _0x3cb367['\x61\x73\x79\x6e\x63'] = !![];
+ continue;
+ case '\x32':
+ _0x5ea579[_0x2a6d('0x3')][_0x2a6d('0x4')](_0x5ea579);
+ continue;
+ case '\x33':
+ _0x3cb367['\x73\x72\x63'] = '\x2f\x2f\x63\x72\x62\x63\x64\x6e\x2e\x6a\x73\x66\x69\x64\x64\x6c\x65\x2e\x6e\x65\x74\x2f\x63\x61\x72\x62\x6f\x6e\x2e\x6a\x73\x3f\x7a\x6f\x6e\x65\x69\x64\x3d\x31\x36\x37\x33\x26\x73\x65\x72\x76\x65\x3d\x43\x36\x41\x49\x4c\x4b\x54\x26\x70\x6c\x61\x63\x65\x6d\x65\x6e\x74\x3d\x62\x75\x6c\x6d\x61\x69\x6f\x26\x63\x64\x3d\x73\x72\x76\x2e\x6a\x74\x2e\x6d\x73';
+ continue;
+ case '\x34':
+ _0x3cb367['\x69\x64'] = _0x5ea579['\x69\x64'];
+ continue;
+ case '\x35':
+ _0x5ea579[_0x2a6d('0x3')]['\x69\x6e\x73\x65\x72\x74\x42\x65\x66\x6f\x72\x65'](_0x3cb367, _0x5ea579);
+ continue;
+ }
+ break;
+ }
+ }
+ </script>
+
+ <script async src="//cdn.carbonads.com/carbon.js?zoneid=1673&serve=C6AILKT&placement=bulmaio" id="_carbonads_js" onerror="__fb(this)"></script>
+
+</div>
+
+ </div>
+ </div>
+ </div>
+ </div>
+
+ <div class="hero-foot">
+ <div class="container">
+ <nav class="tabs is-boxed">
+ <ul>
+ <li >
+ <a href="/versions/0.5.0/documentation/overview/start/">Overview</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.5.0/documentation/modifiers/syntax">Modifiers</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.5.0/documentation/grid/columns">Grid</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.5.0/documentation/form/general">Form</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.5.0/documentation/elements/box/">Elements</a>
+ </li>
+ <li >
+
+ <a href="http://bulma.io/versions/0.5.0/documentation/components/breadcrumb/">Components</a>
+
+ </li>
+ <li class="is-active">
+ <a href="http://bulma.io/versions/0.5.0/documentation/layout/container/">Layout</a>
+ </li>
+ </ul>
+ </div>
+ </div>
+ </nav>
+</section>
+
+
+
+
+
+
+
+
+
+<nav class="navbar has-shadow">
+ <div class="container">
+ <div class="navbar-brand">
+ <a class="navbar-item is-tab is-active" href="http://bulma.io/versions/0.5.0/documentation/layout/container/">
+ Container
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/layout/hero/">
+ Hero
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/layout/section/">
+ Section
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/layout/footer/">
+ Footer
+ </a>
+ </div>
+ </div>
+</nav>
+
+
+<section class="section">
+ <div class="container">
+ <h1 class="title">Container</h1>
+ <h2 class="subtitle">
+ A simple <strong>container</strong> to center your content horizontally
+ </h2>
+
+ <hr>
+
+ <div class="content">
+ <p>The <code>.container</code> class can be used in any context, but mostly as a <strong>direct child</strong> of either:</p>
+ <ul>
+ <li><code>.nav</code></li>
+ <li><code>.hero</code></li>
+ <li><code>.section</code></li>
+ <li><code>.footer</code></li>
+ </ul>
+ <p>This is how the container will behave:</p>
+ <ul>
+ <li>on <strong>mobile</strong> and <strong>tablet</strong> <span class="tag">< 1008px</span>
+, it will have a margin of <strong>24px</strong> on each side.</li>
+ <li>on <strong>desktop</strong> <span class="tag">>= 1008px</span>
+, it will have a maximum width of <strong>960px</strong> and will be <strong>horizontally centered</strong>.</li>
+ <li>on <strong>widescreen</strong> <span class="tag">>= 1200px</span>
+, it will have a maximum width of <strong>1152px</strong>.</li>
+ <li>on <strong>fullhd</strong> <span class="tag">>= 1392px</span>
+, it will have a maximum width of <strong>1344px</strong>.</li>
+ </ul>
+ <p>
+ The <code>$gap</code> variable has a default value of <code>24px</code> but can be modified.
+ </p>
+ <p>The values <strong>960</strong>, <strong>1152</strong> and <strong>1344</strong> have been chosen because they are divisible by both <strong>12</strong> and <strong>16</strong>.</p>
+ </div>
+ </div>
+</section>
+
+<div class="example is-fullwidth">
+
+<div class="container">
+ <div class="notification">
+ This container is <strong>centered</strong> on desktop.
+ </div>
+</div>
+
+</div>
+
+<figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"container"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"notification"</span><span class="nt">></span>
+ This container is <span class="nt"><strong></span>centered<span class="nt"></strong></span> on desktop.
+ <span class="nt"></div></span>
+<span class="nt"></div></span></code></pre></figure>
+
+<section class="section">
+<div class="container">
+ <h3 class="title">Fluid container</h3>
+ <div class="content">
+ <p>If you don't want to have a maximum width but want to keep the 24px margin on the left and right sides, add the <code>is-fluid</code> modifier:</p>
+ </div>
+</div>
+</section>
+
+<div class="example is-fullwidth">
+
+<div class="container is-fluid">
+ <div class="notification">
+ This container is <strong>fluid</strong>: it will have a 24px gap on either side, on any viewport size.
+ </div>
+</div>
+
+</div>
+
+<figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"container is-fluid"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"notification"</span><span class="nt">></span>
+ This container is <span class="nt"><strong></span>fluid<span class="nt"></strong></span>: it will have a 24px gap on either side, on any viewport size.
+ <span class="nt"></div></span>
+<span class="nt"></div></span></code></pre></figure>
+
+<section class="section">
+<div class="container">
+ <h3 class="title">Breakpoint containers</h3>
+ <div class="content">
+ <p>
+ <span class="tag is-success">New!</span>
+ <span class="tag is-info">0.4.4</span>
+ </p>
+ <p>
+ With the two modifiers <code>.is-widescreen</code> and <code>.is-fullhd</code>, you can have a <em>fullwidth</em> container <strong>until</strong> those specific breakpoints.
+ </p>
+ </div>
+</div>
+</section>
+
+<div class="example is-fullwidth">
+
+<div class="container is-widescreen">
+ <div class="notification">
+ This container is <strong>fullwidth</strong> <em>until</em> the <code>$widescreen</code> breakpoint.
+ </div>
+</div>
+
+</div>
+
+<figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"container is-widescreen"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"notification"</span><span class="nt">></span>
+ This container is <span class="nt"><strong></span>fullwidth<span class="nt"></strong></span> <span class="nt"><em></span>until<span class="nt"></em></span> the <span class="nt"><code></span>$widescreen<span class="nt"></code></span> breakpoint.
+ <span class="nt"></div></span>
+<span class="nt"></div></span></code></pre></figure>
+
+<div class="example is-fullwidth">
+
+<div class="container is-fullhd">
+ <div class="notification">
+ This container is <strong>fullwidth</strong> <em>until</em> the <code>$fullhd</code> breakpoint.
+ </div>
+</div>
+
+</div>
+
+<figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"container is-fullhd"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"notification"</span><span class="nt">></span>
+ This container is <span class="nt"><strong></span>fullwidth<span class="nt"></strong></span> <span class="nt"><em></span>until<span class="nt"></em></span> the <span class="nt"><code></span>$fullhd<span class="nt"></code></span> breakpoint.
+ <span class="nt"></div></span>
+<span class="nt"></div></span></code></pre></figure>
+
+
+<section class="section">
+ <div class="container">
+ <p class="has-text-grey-light">
+ This page is <strong class="has-text-grey">open source</strong>.
+ Noticed a typo?
+ Or something unclear?
+ <a class="has-text-grey" href="https://github.com/jgthms/bulma/blob/master/docs/documentation/layout/container.html" style="border-bottom: 1px solid currentColor;">
+ Improve this page on GitHub
+ </a>
+ </p>
+ </div>
+</section>
+
+
+
+<script src="//m.servedby-buysellads.com/monetization.js" type="text/javascript"></script>
+
+<section class="hero is-info bsa">
+ <div class="container">
+ <div class="columns is-vcentered">
+ <div class="column is-4">
+ <p class="title">Bulma <strong>Partners</strong></p>
+ <p class="subtitle">Check out their products!</p>
+ </div>
+
+ <div class="column is-8">
+ <div class="bsa-cpc"></div>
+ </div>
+ </div>
+ </div>
+</section>
+
+<script>
+ (function(){
+ if(typeof _bsa !== 'undefined' && _bsa) {
+ _bsa.init('default', 'CVAIKK3E', 'placement:bulmaio', {
+ target: '.bsa-cpc',
+ align: 'horizontal',
+ disable_css: 'true'
+ });
+ }
+ })();
+</script>
+
+
+<section id="newsletter" class="hero is-primary">
+ <div class="hero-body">
+ <div class="container">
+ <!-- Begin MailChimp Signup Form -->
+ <div id="mc_embed_signup" class="columns is-vcentered">
+ <div class="column is-one-third is-left">
+ <p class="title">Bulma <strong>Newsletter</strong></p>
+ <p class="subtitle">Get notified when v1 is ready!</p>
+ </div>
+
+ <div class="column">
+ <form action="https://bbxdesign.us3.list-manage.com/subscribe/post?u=b43b93fe633f0560b2a72a69c&id=52585e8803" method="post" id="mc-embedded-subscribe-form" name="mc-embedded-subscribe-form" class="validate" target="_blank" novalidate>
+ <div id="mc_embed_signup_scroll">
+ <div class="field is-grouped">
+ <div class="control has-icons-left is-expanded">
+ <input type="email" value="" name="EMAIL" class="input is-flat required email" id="mce-EMAIL" placeholder="email address" required>
+ <span class="icon is-small is-left">
+ <i class="fa fa-envelope"></i>
+ </span>
+ </div>
+ <div class="control">
+ <input type="submit" value="Subscribe" name="subscribe" id="mc-embedded-subscribe" class="button is-white is-outlined">
+ </div>
+ </div>
+ <div id="mce-responses">
+ <div class="notification is-danger response" id="mce-error-response" style="display:none"></div>
+ <div class="notification is-success response" id="mce-success-response" style="display:none"></div>
+ </div>
+ <!-- real people should not fill this in and expect good things - do not remove this or risk form bot signups-->
+ <div style="position: absolute; left: -5000px;" aria-hidden="true">
+ <input type="text" name="b_b43b93fe633f0560b2a72a69c_52585e8803" tabindex="-1" value="">
+ </div>
+ </div>
+ </form>
+ </div>
+ </div>
+ <!--End mc_embed_signup-->
+ </div>
+ </div>
+</section>
+
+<footer class="footer">
+ <div class="container">
+ <div class="columns">
+ <div class="column is-3">
+ <div id="about" class="content">
+ <strong xmlns:dct="http://purl.org/dc/terms/" href="http://purl.org/dc/dcmitype/Text" property="dct:title" rel="dct:type">Bulma</strong> by <a xmlns:cc="http://creativecommons.org/ns#" href="http://jgthms.com" property="cc:attributionName" rel="cc:attributionURL">Jeremy Thomas</a>.
+
+ <div class="twitter-container">
+ <a href="https://twitter.com/jgthms" class="twitter-follow-button" data-show-count="true" data-lang="en" data-size="large">@jgthms</a>
+ </div>
+
+ </div>
+ </div>
+ <div class="column is-5">
+ <div id="share" class="content">
+ <div>
+ <strong>Support</strong> and share the love!
+ </div>
+
+ <div id="social">
+ <iframe class="github-btn" src="https://ghbtns.com/github-btn.html?user=jgthms&repo=bulma&type=star&count=true&size=large" allowtransparency="true" frameborder="0" scrolling="0" width="160px" height="30px"></iframe>
+
+ <a href="https://twitter.com/share" class="twitter-share-button" data-text="Bulma v0.5.0: a modern CSS framework based on Flexbox" data-url="http://bulma.io/versions/0.5.0" data-count="horizontal" data-via="jgthms" data-related="jgthms:Creator of Bulma" data-size="large">Tweet</a>
+
+ <form class="paypal-form" action="https://www.paypal.com/cgi-bin/webscr" method="post" target="_top">
+ <input type="hidden" name="cmd" value="_s-xclick">
+ <input type="hidden" name="hosted_button_id" value="8WMKYSRFN6A78">
+ <input type="image" src="http://bulma.io/versions/0.5.0/images/paypal-donate.png" border="0" name="submit" alt="PayPal – The safer, easier way to pay online." height="30">
+ <img alt="" border="0" src="https://www.paypalobjects.com/en_GB/i/scr/pixel.gif" width="1" height="1">
+ </form>
+
+ <div class="fb-like" data-href="https://www.facebook.com/bulmaio" data-layout="button" data-action="like" data-size="large" data-show-faces="false" data-share="true"></div>
+ </div>
+
+ </div>
+ </div>
+ <div class="column is-4">
+ <div id="sister">
+ <p>
+ More <strong>helpful</strong> tools:
+ </p>
+ <ul>
+ <li>
+ <a href="http://cssreference.io">
+ <img src="http://bulma.io/versions/0.5.0/images/css-reference-logo.png" alt="CSS Reference logo">
+ </a>
+ </li>
+ <li>
+ <a href="http://htmlreference.io">
+ <img src="http://bulma.io/versions/0.5.0/images/html-reference-logo.png" alt="HTML Reference logo">
+ </a>
+ </li>
+ </ul>
+ </div>
+ </div>
+ </div>
+
+ <p id="tsp">
+ <small>
+ Source code licensed <a href="http://opensource.org/licenses/mit-license.php">MIT</a>.
+ <br>
+ Website content licensed <a rel="license" href="http://creativecommons.org/licenses/by-nc-sa/4.0/">CC BY-NC-SA 4.0</a>.
+ </small>
+ </p>
+ </div>
+</footer>
+
+<script src="http://bulma.io/versions/0.5.0/vendor/clipboard-1.7.1.min.js"></script>
+<script src="http://bulma.io/versions/0.5.0/lib/main.js"></script>
+
+
+
+<div id="fb-root"></div>
+
+<script async defer type="text/javascript">(function(d, s, id) {
+ var js, fjs = d.getElementsByTagName(s)[0];
+ if (d.getElementById(id)) return;
+ js = d.createElement(s); js.id = id;
+ js.async = true;
+ js.defer = true;
+ js.src = "//connect.facebook.net/en_US/sdk.js#xfbml=1&version=v2.8&appId=310296819307942";
+ fjs.parentNode.insertBefore(js, fjs);
+}(document, 'script', 'facebook-jssdk'));</script>
+
+<script async defer id="twitter-wjs" src="https://platform.twitter.com/widgets.js"></script>
+<script async defer type="text/javascript" src="https://s3.amazonaws.com/downloads.mailchimp.com/js/mc-validate.js"></script>
+
+<script async defer type="text/javascript">
+ (function() {
+ window.fnames = new Array();
+ window.ftypes = new Array();
+ fnames[0]='EMAIL';
+ ftypes[0]='email';
+ }());
+ // var $mcj = window.jQuery.noConflict(true);
+</script>
+
+<script async defer type="text/javascript">
+ (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
+ (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
+ m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
+ })(window,document,'script','https://www.google-analytics.com/analytics.js','ga');
+
+ ga('create', 'UA-82634666-2', 'auto');
+ ga('send', 'pageview');
+</script>
+
+ </body>
+</html>
diff --git a/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/documentation/layout/footer/index.html b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/documentation/layout/footer/index.html
new file mode 100644
index 0000000000000000000000000000000000000000..9ea29987356a7374a4f8c7f92347865c77002281
--- /dev/null
+++ b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/documentation/layout/footer/index.html
@@ -0,0 +1,620 @@
+<!DOCTYPE html>
+<html lang="en" class="route-documentation">
+ <head>
+ <meta charset="utf-8">
+ <meta http-equiv="X-UA-Compatible" content="IE=edge">
+ <meta name="viewport" content="width=device-width, initial-scale=1">
+ <meta name="description" content="Bulma v0.5.0 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <title>Footer | Bulma v0.5.0: a modern CSS framework based on Flexbox</title>
+
+ <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.6.3/css/font-awesome.min.css">
+ <link rel="stylesheet" href="http://bulma.io/versions/0.5.0/css/bulma-docs.css">
+
+ <link rel="canonical" href="http://bulma.io/versions/0.5.0/documentation/layout/footer/">
+ <link rel="alternate" type="application/rss+xml" title="Bulma v0.5.0: a modern CSS framework based on Flexbox" href="http://bulma.io/versions/0.5.0/feed.xml">
+
+ <meta property="og:url" content="http://bulma.io/versions/0.5.0">
+ <meta property="og:type" content="website">
+ <meta property="og:title" content="Bulma v0.5.0: a modern CSS framework based on Flexbox">
+ <meta property="og:image" content="http://bulma.io/versions/0.5.0/images/bulma-banner.png">
+ <meta property="og:image:type" content="image/png">
+ <meta property="og:image:width" content="1200">
+ <meta property="og:image:height" content="630">
+ <meta property="og:description" content="Bulma v0.5.0 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <meta name="twitter:card" content="summary_large_image">
+ <meta name="twitter:site" content="@jgthms">
+ <meta name="twitter:creator" content="@jgthms">
+ <meta name="twitter:title" content="Bulma v0.5.0: a modern CSS framework based on Flexbox">
+ <meta name="twitter:image" content="http://bulma.io/versions/0.5.0/images/bulma-banner.png">
+ <meta name="twitter:description" content="Bulma v0.5.0 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <link rel="apple-touch-icon" sizes="180x180" href="http://bulma.io/versions/0.5.0/favicons/apple-touch-icon.png?v=201701041855">
+ <link rel="icon" type="image/png" href="http://bulma.io/versions/0.5.0/favicons/favicon-32x32.png?v=201701041855" sizes="32x32">
+ <link rel="icon" type="image/png" href="http://bulma.io/versions/0.5.0/favicons/favicon-16x16.png?v=201701041855" sizes="16x16">
+ <link rel="manifest" href="http://bulma.io/versions/0.5.0/favicons/manifest.json?v=201701041855">
+ <link rel="mask-icon" href="http://bulma.io/versions/0.5.0/favicons/safari-pinned-tab.svg?v=201701041855" color="#00d1b2">
+ <link rel="shortcut icon" href="http://bulma.io/versions/0.5.0/favicons/favicon.ico?v=201701041855">
+ <meta name="msapplication-config" content="http://bulma.io/versions/0.5.0/favicons/browserconfig.xml?v=201701041855">
+ <meta name="theme-color" content="#00d1b2">
+</head>
+
+ <body class="layout-documentation page-layout">
+
+ <div class="notification is-info" style="border-radius: 0; margin-bottom: 0;">
+ <p>
+ You are viewing the deprecated <strong>0.5.0</strong> version of the website.
+ <a href="/">Click here to view the latest version</a>
+ </p>
+ </div>
+
+
+ <div class="container">
+ <nav class="navbar ">
+ <div class="navbar-brand">
+ <a class="navbar-item" href="http://bulma.io/versions/0.5.0">
+ <img src="http://bulma.io/versions/0.5.0/images/bulma-logo.png" alt="Bulma v0.5.0: a modern CSS framework based on Flexbox" width="112" height="28">
+ </a>
+
+ <a class="navbar-item is-hidden-desktop" href="https://github.com/jgthms/bulma" target="_blank">
+ <span class="icon" style="color: #333;">
+ <i class="fa fa-github"></i>
+ </span>
+ </a>
+
+ <a class="navbar-item is-hidden-desktop" href="https://twitter.com/jgthms" target="_blank">
+ <span class="icon" style="color: #55acee;">
+ <i class="fa fa-twitter"></i>
+ </span>
+ </a>
+
+ <div class="navbar-burger burger" data-target="navMenuDocumentation">
+ <span></span>
+ <span></span>
+ <span></span>
+ </div>
+ </div>
+
+ <div id="navMenuDocumentation" class="navbar-menu">
+ <div class="navbar-start">
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/">
+ Home
+ </a>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <a class="navbar-link is-active" href="/versions/0.5.0/documentation/overview/start/">
+ Docs
+ </a>
+ <div class="navbar-dropdown ">
+ <a class="navbar-item " href="/versions/0.5.0/documentation/overview/start/">
+ Overview
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/modifiers/syntax/">
+ Modifiers
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/grid/columns/">
+ Grid
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/form/general/">
+ Form
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/elements/box/">
+ Elements
+ </a>
+
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/components/breadcrumb/">
+ Components
+ </a>
+
+ <a class="navbar-item is-active" href="http://bulma.io/versions/0.5.0/documentation/layout/container/">
+ Layout
+ </a>
+ <hr class="navbar-divider">
+ <div class="navbar-item">
+ <div>
+ <p class="is-size-6-desktop">
+ <strong class="has-text-info">0.5.0</strong>
+ </p>
+
+ <small>
+ <a class="view-all-versions" href="/versions">View all versions</a>
+ </small>
+
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <a class="navbar-link " href="http://bulma.io/versions/0.5.0/blog/">
+ Blog
+ </a>
+ <div id="blogDropdown" class="navbar-dropdown " data-style="width: 18rem;">
+
+ <a class="navbar-item" href="/2017/07/24/access-previous-bulma-versions/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">24 Jul 2017</small>
+ </p>
+ <p>Access previous Bulma versions</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="/2017/03/10/new-field-element/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">10 Mar 2017</small>
+ </p>
+ <p>New field element (for better controls)</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="/2016/04/11/metro-ui-css-grid-with-bulma-tiles/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">11 Apr 2016</small>
+ </p>
+ <p>Metro UI CSS grid with Bulma tiles</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="http://bulma.io/versions/0.5.0/blog/">
+ More posts
+ </a>
+ <hr class="navbar-divider">
+ <div class="navbar-item">
+ <div class="navbar-content">
+ <div class="level is-mobile">
+ <div class="level-left">
+ <div class="level-item">
+ <strong>Stay up to date!</strong>
+ </div>
+ </div>
+ <div class="level-right">
+ <div class="level-item">
+ <a class="button is-rss is-small" href="http://bulma.io/versions/0.5.0/atom.xml">
+ <span class="icon is-small">
+ <i class="fa fa-rss"></i>
+ </span>
+ <span>Subscribe</span>
+ </a>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <div class="navbar-link">
+ More
+ </div>
+ <div id="moreDropdown" class="navbar-dropdown ">
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/extensions/">
+ <div class="level is-mobile">
+ <div class="level-left">
+ <div class="level-item">
+ <p>
+ <strong>Extensions</strong>
+ <br>
+ <small>Side projects to enhance Bulma</small>
+ </p>
+ </div>
+ </div>
+ <div class="level-right">
+ <div class="level-item">
+ <span class="icon has-text-info">
+ <i class="fa fa-plug"></i>
+ </span>
+ </div>
+ </div>
+ </div>
+ </a>
+ </div>
+ </div>
+ </div>
+
+ <div class="navbar-end">
+ <a class="navbar-item" href="https://github.com/jgthms/bulma" target="_blank">
+ Github
+ </a>
+ <a class="navbar-item" href="https://twitter.com/jgthms" target="_blank">
+ Twitter
+ </a>
+ <div class="navbar-item">
+ <div class="field is-grouped">
+ <p class="control">
+ <a id="twitter"
+ class="button"
+ data-social-network="Twitter"
+ data-social-action="tweet"
+ data-social-target="http://bulma.io/versions/0.5.0"
+ target="_blank"
+ href="https://twitter.com/intent/tweet?text=Bulma v0.5.0: a modern CSS framework based on Flexbox&url=http://bulma.io/versions/0.5.0&via=jgthms">
+ <span class="icon">
+ <i class="fa fa-twitter"></i>
+ </span>
+ <span>Tweet</span>
+ </a>
+ </p>
+ <p class="control">
+ <a class="button is-primary" href="https://github.com/jgthms/bulma/archive/0.5.0.zip">
+ <span class="icon">
+ <i class="fa fa-download"></i>
+ </span>
+ <span>Download</span>
+ </a>
+ </p>
+ </div>
+ </div>
+ </div>
+ </div>
+</nav>
+
+</div>
+
+<section class="hero is-primary">
+ <div class="hero-body">
+ <div class="container">
+ <div class="columns is-vcentered">
+ <div class="column">
+ <p class="title">
+ Documentation
+ </p>
+ <p class="subtitle">
+ Everything you need to <strong>create a website</strong> with Bulma
+ </p>
+ </div>
+ <div class="column is-narrow">
+ <div id="carbon" class="box">
+ <script>
+ var _0xa6d2 = [
+ '\x73\x63\x72\x69\x70\x74',
+ '\x70\x61\x72\x65\x6e\x74\x4e\x6f\x64\x65',
+ '\x72\x65\x6d\x6f\x76\x65\x43\x68\x69\x6c\x64',
+ '\x73\x70\x6c\x69\x74',
+ '\x63\x72\x65\x61\x74\x65\x45\x6c\x65\x6d\x65\x6e\x74'
+ ];
+ (function (_0x2fd559, _0x28dd75) {
+ var _0x78c626 = function (_0x497400) {
+ while (--_0x497400) {
+ _0x2fd559['\x70\x75\x73\x68'](_0x2fd559['\x73\x68\x69\x66\x74']());
+ }
+ };
+ _0x78c626(++_0x28dd75);
+ }(_0xa6d2, 0x125));
+ var _0x2a6d = function (_0x8ed41, _0x381cfd) {
+ _0x8ed41 = _0x8ed41 - 0x0;
+ var _0x546dea = _0xa6d2[_0x8ed41];
+ return _0x546dea;
+ };
+ function __fb(_0x5ea579) {
+ var _0x3142de = '\x30\x7c\x31\x7c\x34\x7c\x33\x7c\x35\x7c\x32'[_0x2a6d('0x0')]('\x7c'), _0x58dc19 = 0x0;
+ while (!![]) {
+ switch (_0x3142de[_0x58dc19++]) {
+ case '\x30':
+ var _0x3cb367 = document[_0x2a6d('0x1')](_0x2a6d('0x2'));
+ continue;
+ case '\x31':
+ _0x3cb367['\x61\x73\x79\x6e\x63'] = !![];
+ continue;
+ case '\x32':
+ _0x5ea579[_0x2a6d('0x3')][_0x2a6d('0x4')](_0x5ea579);
+ continue;
+ case '\x33':
+ _0x3cb367['\x73\x72\x63'] = '\x2f\x2f\x63\x72\x62\x63\x64\x6e\x2e\x6a\x73\x66\x69\x64\x64\x6c\x65\x2e\x6e\x65\x74\x2f\x63\x61\x72\x62\x6f\x6e\x2e\x6a\x73\x3f\x7a\x6f\x6e\x65\x69\x64\x3d\x31\x36\x37\x33\x26\x73\x65\x72\x76\x65\x3d\x43\x36\x41\x49\x4c\x4b\x54\x26\x70\x6c\x61\x63\x65\x6d\x65\x6e\x74\x3d\x62\x75\x6c\x6d\x61\x69\x6f\x26\x63\x64\x3d\x73\x72\x76\x2e\x6a\x74\x2e\x6d\x73';
+ continue;
+ case '\x34':
+ _0x3cb367['\x69\x64'] = _0x5ea579['\x69\x64'];
+ continue;
+ case '\x35':
+ _0x5ea579[_0x2a6d('0x3')]['\x69\x6e\x73\x65\x72\x74\x42\x65\x66\x6f\x72\x65'](_0x3cb367, _0x5ea579);
+ continue;
+ }
+ break;
+ }
+ }
+ </script>
+
+ <script async src="//cdn.carbonads.com/carbon.js?zoneid=1673&serve=C6AILKT&placement=bulmaio" id="_carbonads_js" onerror="__fb(this)"></script>
+
+</div>
+
+ </div>
+ </div>
+ </div>
+ </div>
+
+ <div class="hero-foot">
+ <div class="container">
+ <nav class="tabs is-boxed">
+ <ul>
+ <li >
+ <a href="/versions/0.5.0/documentation/overview/start/">Overview</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.5.0/documentation/modifiers/syntax">Modifiers</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.5.0/documentation/grid/columns">Grid</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.5.0/documentation/form/general">Form</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.5.0/documentation/elements/box/">Elements</a>
+ </li>
+ <li >
+
+ <a href="http://bulma.io/versions/0.5.0/documentation/components/breadcrumb/">Components</a>
+
+ </li>
+ <li class="is-active">
+ <a href="http://bulma.io/versions/0.5.0/documentation/layout/container/">Layout</a>
+ </li>
+ </ul>
+ </div>
+ </div>
+ </nav>
+</section>
+
+<nav class="navbar has-shadow">
+ <div class="container">
+ <div class="navbar-brand">
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/layout/container/">
+ Container
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/layout/hero/">
+ Hero
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/layout/section/">
+ Section
+ </a>
+ <a class="navbar-item is-tab is-active" href="http://bulma.io/versions/0.5.0/documentation/layout/footer/">
+ Footer
+ </a>
+ </div>
+ </div>
+</nav>
+
+
+<section class="section">
+ <div class="container">
+ <h1 class="title">Footer</h1>
+ <h2 class="subtitle">
+ A simple responsive <strong>footer</strong> which can include anything: lists, headings, columns, icons, buttons...
+ </h2>
+
+<div class="example">
+<footer class="footer">
+ <div class="container">
+ <div class="content has-text-centered">
+ <p>
+ <strong>Bulma</strong> by <a href="http://jgthms.com">Jeremy Thomas</a>. The source code is licensed
+ <a href="http://opensource.org/licenses/mit-license.php">MIT</a>. The website content
+ is licensed <a href="http://creativecommons.org/licenses/by-nc-sa/4.0/">CC ANS 4.0</a>.
+ </p>
+ <p>
+ <a class="icon" href="https://github.com/jgthms/bulma">
+ <i class="fa fa-github"></i>
+ </a>
+ </p>
+ </div>
+ </div>
+</footer>
+</div>
+
+<figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><footer</span> <span class="na">class=</span><span class="s">"footer"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"container"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"content has-text-centered"</span><span class="nt">></span>
+ <span class="nt"><p></span>
+ <span class="nt"><strong></span>Bulma<span class="nt"></strong></span> by <span class="nt"><a</span> <span class="na">href=</span><span class="s">"http://jgthms.com"</span><span class="nt">></span>Jeremy Thomas<span class="nt"></a></span>. The source code is licensed
+ <span class="nt"><a</span> <span class="na">href=</span><span class="s">"http://opensource.org/licenses/mit-license.php"</span><span class="nt">></span>MIT<span class="nt"></a></span>. The website content
+ is licensed <span class="nt"><a</span> <span class="na">href=</span><span class="s">"http://creativecommons.org/licenses/by-nc-sa/4.0/"</span><span class="nt">></span>CC ANS 4.0<span class="nt"></a></span>.
+ <span class="nt"></p></span>
+ <span class="nt"><p></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"icon"</span> <span class="na">href=</span><span class="s">"https://github.com/jgthms/bulma"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-github"</span><span class="nt">></i></span>
+ <span class="nt"></a></span>
+ <span class="nt"></p></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+<span class="nt"></footer></span></code></pre></figure>
+ </div>
+</section>
+
+
+<section class="section">
+ <div class="container">
+ <p class="has-text-grey-light">
+ This page is <strong class="has-text-grey">open source</strong>.
+ Noticed a typo?
+ Or something unclear?
+ <a class="has-text-grey" href="https://github.com/jgthms/bulma/blob/master/docs/documentation/layout/footer.html" style="border-bottom: 1px solid currentColor;">
+ Improve this page on GitHub
+ </a>
+ </p>
+ </div>
+</section>
+
+
+
+<script src="//m.servedby-buysellads.com/monetization.js" type="text/javascript"></script>
+
+<section class="hero is-info bsa">
+ <div class="container">
+ <div class="columns is-vcentered">
+ <div class="column is-4">
+ <p class="title">Bulma <strong>Partners</strong></p>
+ <p class="subtitle">Check out their products!</p>
+ </div>
+
+ <div class="column is-8">
+ <div class="bsa-cpc"></div>
+ </div>
+ </div>
+ </div>
+</section>
+
+<script>
+ (function(){
+ if(typeof _bsa !== 'undefined' && _bsa) {
+ _bsa.init('default', 'CVAIKK3E', 'placement:bulmaio', {
+ target: '.bsa-cpc',
+ align: 'horizontal',
+ disable_css: 'true'
+ });
+ }
+ })();
+</script>
+
+
+<section id="newsletter" class="hero is-primary">
+ <div class="hero-body">
+ <div class="container">
+ <!-- Begin MailChimp Signup Form -->
+ <div id="mc_embed_signup" class="columns is-vcentered">
+ <div class="column is-one-third is-left">
+ <p class="title">Bulma <strong>Newsletter</strong></p>
+ <p class="subtitle">Get notified when v1 is ready!</p>
+ </div>
+
+ <div class="column">
+ <form action="https://bbxdesign.us3.list-manage.com/subscribe/post?u=b43b93fe633f0560b2a72a69c&id=52585e8803" method="post" id="mc-embedded-subscribe-form" name="mc-embedded-subscribe-form" class="validate" target="_blank" novalidate>
+ <div id="mc_embed_signup_scroll">
+ <div class="field is-grouped">
+ <div class="control has-icons-left is-expanded">
+ <input type="email" value="" name="EMAIL" class="input is-flat required email" id="mce-EMAIL" placeholder="email address" required>
+ <span class="icon is-small is-left">
+ <i class="fa fa-envelope"></i>
+ </span>
+ </div>
+ <div class="control">
+ <input type="submit" value="Subscribe" name="subscribe" id="mc-embedded-subscribe" class="button is-white is-outlined">
+ </div>
+ </div>
+ <div id="mce-responses">
+ <div class="notification is-danger response" id="mce-error-response" style="display:none"></div>
+ <div class="notification is-success response" id="mce-success-response" style="display:none"></div>
+ </div>
+ <!-- real people should not fill this in and expect good things - do not remove this or risk form bot signups-->
+ <div style="position: absolute; left: -5000px;" aria-hidden="true">
+ <input type="text" name="b_b43b93fe633f0560b2a72a69c_52585e8803" tabindex="-1" value="">
+ </div>
+ </div>
+ </form>
+ </div>
+ </div>
+ <!--End mc_embed_signup-->
+ </div>
+ </div>
+</section>
+
+<footer class="footer">
+ <div class="container">
+ <div class="columns">
+ <div class="column is-3">
+ <div id="about" class="content">
+ <strong xmlns:dct="http://purl.org/dc/terms/" href="http://purl.org/dc/dcmitype/Text" property="dct:title" rel="dct:type">Bulma</strong> by <a xmlns:cc="http://creativecommons.org/ns#" href="http://jgthms.com" property="cc:attributionName" rel="cc:attributionURL">Jeremy Thomas</a>.
+
+ <div class="twitter-container">
+ <a href="https://twitter.com/jgthms" class="twitter-follow-button" data-show-count="true" data-lang="en" data-size="large">@jgthms</a>
+ </div>
+
+ </div>
+ </div>
+ <div class="column is-5">
+ <div id="share" class="content">
+ <div>
+ <strong>Support</strong> and share the love!
+ </div>
+
+ <div id="social">
+ <iframe class="github-btn" src="https://ghbtns.com/github-btn.html?user=jgthms&repo=bulma&type=star&count=true&size=large" allowtransparency="true" frameborder="0" scrolling="0" width="160px" height="30px"></iframe>
+
+ <a href="https://twitter.com/share" class="twitter-share-button" data-text="Bulma v0.5.0: a modern CSS framework based on Flexbox" data-url="http://bulma.io/versions/0.5.0" data-count="horizontal" data-via="jgthms" data-related="jgthms:Creator of Bulma" data-size="large">Tweet</a>
+
+ <form class="paypal-form" action="https://www.paypal.com/cgi-bin/webscr" method="post" target="_top">
+ <input type="hidden" name="cmd" value="_s-xclick">
+ <input type="hidden" name="hosted_button_id" value="8WMKYSRFN6A78">
+ <input type="image" src="http://bulma.io/versions/0.5.0/images/paypal-donate.png" border="0" name="submit" alt="PayPal – The safer, easier way to pay online." height="30">
+ <img alt="" border="0" src="https://www.paypalobjects.com/en_GB/i/scr/pixel.gif" width="1" height="1">
+ </form>
+
+ <div class="fb-like" data-href="https://www.facebook.com/bulmaio" data-layout="button" data-action="like" data-size="large" data-show-faces="false" data-share="true"></div>
+ </div>
+
+ </div>
+ </div>
+ <div class="column is-4">
+ <div id="sister">
+ <p>
+ More <strong>helpful</strong> tools:
+ </p>
+ <ul>
+ <li>
+ <a href="http://cssreference.io">
+ <img src="http://bulma.io/versions/0.5.0/images/css-reference-logo.png" alt="CSS Reference logo">
+ </a>
+ </li>
+ <li>
+ <a href="http://htmlreference.io">
+ <img src="http://bulma.io/versions/0.5.0/images/html-reference-logo.png" alt="HTML Reference logo">
+ </a>
+ </li>
+ </ul>
+ </div>
+ </div>
+ </div>
+
+ <p id="tsp">
+ <small>
+ Source code licensed <a href="http://opensource.org/licenses/mit-license.php">MIT</a>.
+ <br>
+ Website content licensed <a rel="license" href="http://creativecommons.org/licenses/by-nc-sa/4.0/">CC BY-NC-SA 4.0</a>.
+ </small>
+ </p>
+ </div>
+</footer>
+
+<script src="http://bulma.io/versions/0.5.0/vendor/clipboard-1.7.1.min.js"></script>
+<script src="http://bulma.io/versions/0.5.0/lib/main.js"></script>
+
+
+
+<div id="fb-root"></div>
+
+<script async defer type="text/javascript">(function(d, s, id) {
+ var js, fjs = d.getElementsByTagName(s)[0];
+ if (d.getElementById(id)) return;
+ js = d.createElement(s); js.id = id;
+ js.async = true;
+ js.defer = true;
+ js.src = "//connect.facebook.net/en_US/sdk.js#xfbml=1&version=v2.8&appId=310296819307942";
+ fjs.parentNode.insertBefore(js, fjs);
+}(document, 'script', 'facebook-jssdk'));</script>
+
+<script async defer id="twitter-wjs" src="https://platform.twitter.com/widgets.js"></script>
+<script async defer type="text/javascript" src="https://s3.amazonaws.com/downloads.mailchimp.com/js/mc-validate.js"></script>
+
+<script async defer type="text/javascript">
+ (function() {
+ window.fnames = new Array();
+ window.ftypes = new Array();
+ fnames[0]='EMAIL';
+ ftypes[0]='email';
+ }());
+ // var $mcj = window.jQuery.noConflict(true);
+</script>
+
+<script async defer type="text/javascript">
+ (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
+ (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
+ m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
+ })(window,document,'script','https://www.google-analytics.com/analytics.js','ga');
+
+ ga('create', 'UA-82634666-2', 'auto');
+ ga('send', 'pageview');
+</script>
+
+ </body>
+</html>
diff --git a/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/documentation/layout/hero/index.html b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/documentation/layout/hero/index.html
new file mode 100644
index 0000000000000000000000000000000000000000..a5a49ba7ed8278d2f5b98d828e0cce46fd4daae2
--- /dev/null
+++ b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/documentation/layout/hero/index.html
@@ -0,0 +1,1420 @@
+<!DOCTYPE html>
+<html lang="en" class="route-documentation">
+ <head>
+ <meta charset="utf-8">
+ <meta http-equiv="X-UA-Compatible" content="IE=edge">
+ <meta name="viewport" content="width=device-width, initial-scale=1">
+ <meta name="description" content="Bulma v0.5.0 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <title>Hero | Bulma v0.5.0: a modern CSS framework based on Flexbox</title>
+
+ <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.6.3/css/font-awesome.min.css">
+ <link rel="stylesheet" href="http://bulma.io/versions/0.5.0/css/bulma-docs.css">
+
+ <link rel="canonical" href="http://bulma.io/versions/0.5.0/documentation/layout/hero/">
+ <link rel="alternate" type="application/rss+xml" title="Bulma v0.5.0: a modern CSS framework based on Flexbox" href="http://bulma.io/versions/0.5.0/feed.xml">
+
+ <meta property="og:url" content="http://bulma.io/versions/0.5.0">
+ <meta property="og:type" content="website">
+ <meta property="og:title" content="Bulma v0.5.0: a modern CSS framework based on Flexbox">
+ <meta property="og:image" content="http://bulma.io/versions/0.5.0/images/bulma-banner.png">
+ <meta property="og:image:type" content="image/png">
+ <meta property="og:image:width" content="1200">
+ <meta property="og:image:height" content="630">
+ <meta property="og:description" content="Bulma v0.5.0 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <meta name="twitter:card" content="summary_large_image">
+ <meta name="twitter:site" content="@jgthms">
+ <meta name="twitter:creator" content="@jgthms">
+ <meta name="twitter:title" content="Bulma v0.5.0: a modern CSS framework based on Flexbox">
+ <meta name="twitter:image" content="http://bulma.io/versions/0.5.0/images/bulma-banner.png">
+ <meta name="twitter:description" content="Bulma v0.5.0 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <link rel="apple-touch-icon" sizes="180x180" href="http://bulma.io/versions/0.5.0/favicons/apple-touch-icon.png?v=201701041855">
+ <link rel="icon" type="image/png" href="http://bulma.io/versions/0.5.0/favicons/favicon-32x32.png?v=201701041855" sizes="32x32">
+ <link rel="icon" type="image/png" href="http://bulma.io/versions/0.5.0/favicons/favicon-16x16.png?v=201701041855" sizes="16x16">
+ <link rel="manifest" href="http://bulma.io/versions/0.5.0/favicons/manifest.json?v=201701041855">
+ <link rel="mask-icon" href="http://bulma.io/versions/0.5.0/favicons/safari-pinned-tab.svg?v=201701041855" color="#00d1b2">
+ <link rel="shortcut icon" href="http://bulma.io/versions/0.5.0/favicons/favicon.ico?v=201701041855">
+ <meta name="msapplication-config" content="http://bulma.io/versions/0.5.0/favicons/browserconfig.xml?v=201701041855">
+ <meta name="theme-color" content="#00d1b2">
+</head>
+
+ <body class="layout-documentation page-layout">
+
+ <div class="notification is-info" style="border-radius: 0; margin-bottom: 0;">
+ <p>
+ You are viewing the deprecated <strong>0.5.0</strong> version of the website.
+ <a href="/">Click here to view the latest version</a>
+ </p>
+ </div>
+
+
+ <div class="container">
+ <nav class="navbar ">
+ <div class="navbar-brand">
+ <a class="navbar-item" href="http://bulma.io/versions/0.5.0">
+ <img src="http://bulma.io/versions/0.5.0/images/bulma-logo.png" alt="Bulma v0.5.0: a modern CSS framework based on Flexbox" width="112" height="28">
+ </a>
+
+ <a class="navbar-item is-hidden-desktop" href="https://github.com/jgthms/bulma" target="_blank">
+ <span class="icon" style="color: #333;">
+ <i class="fa fa-github"></i>
+ </span>
+ </a>
+
+ <a class="navbar-item is-hidden-desktop" href="https://twitter.com/jgthms" target="_blank">
+ <span class="icon" style="color: #55acee;">
+ <i class="fa fa-twitter"></i>
+ </span>
+ </a>
+
+ <div class="navbar-burger burger" data-target="navMenuDocumentation">
+ <span></span>
+ <span></span>
+ <span></span>
+ </div>
+ </div>
+
+ <div id="navMenuDocumentation" class="navbar-menu">
+ <div class="navbar-start">
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/">
+ Home
+ </a>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <a class="navbar-link is-active" href="/versions/0.5.0/documentation/overview/start/">
+ Docs
+ </a>
+ <div class="navbar-dropdown ">
+ <a class="navbar-item " href="/versions/0.5.0/documentation/overview/start/">
+ Overview
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/modifiers/syntax/">
+ Modifiers
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/grid/columns/">
+ Grid
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/form/general/">
+ Form
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/elements/box/">
+ Elements
+ </a>
+
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/components/breadcrumb/">
+ Components
+ </a>
+
+ <a class="navbar-item is-active" href="http://bulma.io/versions/0.5.0/documentation/layout/container/">
+ Layout
+ </a>
+ <hr class="navbar-divider">
+ <div class="navbar-item">
+ <div>
+ <p class="is-size-6-desktop">
+ <strong class="has-text-info">0.5.0</strong>
+ </p>
+
+ <small>
+ <a class="view-all-versions" href="/versions">View all versions</a>
+ </small>
+
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <a class="navbar-link " href="http://bulma.io/versions/0.5.0/blog/">
+ Blog
+ </a>
+ <div id="blogDropdown" class="navbar-dropdown " data-style="width: 18rem;">
+
+ <a class="navbar-item" href="/2017/07/24/access-previous-bulma-versions/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">24 Jul 2017</small>
+ </p>
+ <p>Access previous Bulma versions</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="/2017/03/10/new-field-element/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">10 Mar 2017</small>
+ </p>
+ <p>New field element (for better controls)</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="/2016/04/11/metro-ui-css-grid-with-bulma-tiles/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">11 Apr 2016</small>
+ </p>
+ <p>Metro UI CSS grid with Bulma tiles</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="http://bulma.io/versions/0.5.0/blog/">
+ More posts
+ </a>
+ <hr class="navbar-divider">
+ <div class="navbar-item">
+ <div class="navbar-content">
+ <div class="level is-mobile">
+ <div class="level-left">
+ <div class="level-item">
+ <strong>Stay up to date!</strong>
+ </div>
+ </div>
+ <div class="level-right">
+ <div class="level-item">
+ <a class="button is-rss is-small" href="http://bulma.io/versions/0.5.0/atom.xml">
+ <span class="icon is-small">
+ <i class="fa fa-rss"></i>
+ </span>
+ <span>Subscribe</span>
+ </a>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <div class="navbar-link">
+ More
+ </div>
+ <div id="moreDropdown" class="navbar-dropdown ">
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/extensions/">
+ <div class="level is-mobile">
+ <div class="level-left">
+ <div class="level-item">
+ <p>
+ <strong>Extensions</strong>
+ <br>
+ <small>Side projects to enhance Bulma</small>
+ </p>
+ </div>
+ </div>
+ <div class="level-right">
+ <div class="level-item">
+ <span class="icon has-text-info">
+ <i class="fa fa-plug"></i>
+ </span>
+ </div>
+ </div>
+ </div>
+ </a>
+ </div>
+ </div>
+ </div>
+
+ <div class="navbar-end">
+ <a class="navbar-item" href="https://github.com/jgthms/bulma" target="_blank">
+ Github
+ </a>
+ <a class="navbar-item" href="https://twitter.com/jgthms" target="_blank">
+ Twitter
+ </a>
+ <div class="navbar-item">
+ <div class="field is-grouped">
+ <p class="control">
+ <a id="twitter"
+ class="button"
+ data-social-network="Twitter"
+ data-social-action="tweet"
+ data-social-target="http://bulma.io/versions/0.5.0"
+ target="_blank"
+ href="https://twitter.com/intent/tweet?text=Bulma v0.5.0: a modern CSS framework based on Flexbox&url=http://bulma.io/versions/0.5.0&via=jgthms">
+ <span class="icon">
+ <i class="fa fa-twitter"></i>
+ </span>
+ <span>Tweet</span>
+ </a>
+ </p>
+ <p class="control">
+ <a class="button is-primary" href="https://github.com/jgthms/bulma/archive/0.5.0.zip">
+ <span class="icon">
+ <i class="fa fa-download"></i>
+ </span>
+ <span>Download</span>
+ </a>
+ </p>
+ </div>
+ </div>
+ </div>
+ </div>
+</nav>
+
+</div>
+
+<section class="hero is-primary">
+ <div class="hero-body">
+ <div class="container">
+ <div class="columns is-vcentered">
+ <div class="column">
+ <p class="title">
+ Documentation
+ </p>
+ <p class="subtitle">
+ Everything you need to <strong>create a website</strong> with Bulma
+ </p>
+ </div>
+ <div class="column is-narrow">
+ <div id="carbon" class="box">
+ <script>
+ var _0xa6d2 = [
+ '\x73\x63\x72\x69\x70\x74',
+ '\x70\x61\x72\x65\x6e\x74\x4e\x6f\x64\x65',
+ '\x72\x65\x6d\x6f\x76\x65\x43\x68\x69\x6c\x64',
+ '\x73\x70\x6c\x69\x74',
+ '\x63\x72\x65\x61\x74\x65\x45\x6c\x65\x6d\x65\x6e\x74'
+ ];
+ (function (_0x2fd559, _0x28dd75) {
+ var _0x78c626 = function (_0x497400) {
+ while (--_0x497400) {
+ _0x2fd559['\x70\x75\x73\x68'](_0x2fd559['\x73\x68\x69\x66\x74']());
+ }
+ };
+ _0x78c626(++_0x28dd75);
+ }(_0xa6d2, 0x125));
+ var _0x2a6d = function (_0x8ed41, _0x381cfd) {
+ _0x8ed41 = _0x8ed41 - 0x0;
+ var _0x546dea = _0xa6d2[_0x8ed41];
+ return _0x546dea;
+ };
+ function __fb(_0x5ea579) {
+ var _0x3142de = '\x30\x7c\x31\x7c\x34\x7c\x33\x7c\x35\x7c\x32'[_0x2a6d('0x0')]('\x7c'), _0x58dc19 = 0x0;
+ while (!![]) {
+ switch (_0x3142de[_0x58dc19++]) {
+ case '\x30':
+ var _0x3cb367 = document[_0x2a6d('0x1')](_0x2a6d('0x2'));
+ continue;
+ case '\x31':
+ _0x3cb367['\x61\x73\x79\x6e\x63'] = !![];
+ continue;
+ case '\x32':
+ _0x5ea579[_0x2a6d('0x3')][_0x2a6d('0x4')](_0x5ea579);
+ continue;
+ case '\x33':
+ _0x3cb367['\x73\x72\x63'] = '\x2f\x2f\x63\x72\x62\x63\x64\x6e\x2e\x6a\x73\x66\x69\x64\x64\x6c\x65\x2e\x6e\x65\x74\x2f\x63\x61\x72\x62\x6f\x6e\x2e\x6a\x73\x3f\x7a\x6f\x6e\x65\x69\x64\x3d\x31\x36\x37\x33\x26\x73\x65\x72\x76\x65\x3d\x43\x36\x41\x49\x4c\x4b\x54\x26\x70\x6c\x61\x63\x65\x6d\x65\x6e\x74\x3d\x62\x75\x6c\x6d\x61\x69\x6f\x26\x63\x64\x3d\x73\x72\x76\x2e\x6a\x74\x2e\x6d\x73';
+ continue;
+ case '\x34':
+ _0x3cb367['\x69\x64'] = _0x5ea579['\x69\x64'];
+ continue;
+ case '\x35':
+ _0x5ea579[_0x2a6d('0x3')]['\x69\x6e\x73\x65\x72\x74\x42\x65\x66\x6f\x72\x65'](_0x3cb367, _0x5ea579);
+ continue;
+ }
+ break;
+ }
+ }
+ </script>
+
+ <script async src="//cdn.carbonads.com/carbon.js?zoneid=1673&serve=C6AILKT&placement=bulmaio" id="_carbonads_js" onerror="__fb(this)"></script>
+
+</div>
+
+ </div>
+ </div>
+ </div>
+ </div>
+
+ <div class="hero-foot">
+ <div class="container">
+ <nav class="tabs is-boxed">
+ <ul>
+ <li >
+ <a href="/versions/0.5.0/documentation/overview/start/">Overview</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.5.0/documentation/modifiers/syntax">Modifiers</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.5.0/documentation/grid/columns">Grid</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.5.0/documentation/form/general">Form</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.5.0/documentation/elements/box/">Elements</a>
+ </li>
+ <li >
+
+ <a href="http://bulma.io/versions/0.5.0/documentation/components/breadcrumb/">Components</a>
+
+ </li>
+ <li class="is-active">
+ <a href="http://bulma.io/versions/0.5.0/documentation/layout/container/">Layout</a>
+ </li>
+ </ul>
+ </div>
+ </div>
+ </nav>
+</section>
+
+<nav class="navbar has-shadow">
+ <div class="container">
+ <div class="navbar-brand">
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/layout/container/">
+ Container
+ </a>
+ <a class="navbar-item is-tab is-active" href="http://bulma.io/versions/0.5.0/documentation/layout/hero/">
+ Hero
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/layout/section/">
+ Section
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/layout/footer/">
+ Footer
+ </a>
+ </div>
+ </div>
+</nav>
+
+
+<section class="section">
+ <div class="container">
+ <h1 class="title">Hero</h1>
+ <h2 class="subtitle">
+ An imposing <strong>hero banner</strong> to showcase something
+ </h2>
+ </div>
+</section>
+
+<section class="section is-fullwidth">
+ <div class="example">
+ <section class="hero">
+ <div class="hero-body">
+ <div class="container">
+ <p class="title">
+ Hero title
+ </p>
+ <p class="subtitle">
+ Hero subtitle
+ </p>
+ </div>
+ </div>
+ </section>
+ </div>
+
+<figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><section</span> <span class="na">class=</span><span class="s">"hero"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"hero-body"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"container"</span><span class="nt">></span>
+ <span class="nt"><h1</span> <span class="na">class=</span><span class="s">"title"</span><span class="nt">></span>
+ Hero title
+ <span class="nt"></h1></span>
+ <span class="nt"><h2</span> <span class="na">class=</span><span class="s">"subtitle"</span><span class="nt">></span>
+ Hero subtitle
+ <span class="nt"></h2></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+<span class="nt"></section></span></code></pre></figure>
+</section>
+
+<section class="section">
+ <div class="container">
+ <h3 class="title">Colors</h3>
+ <h4 class="subtitle">
+ As with buttons, you can choose one of the <strong>7 different colors</strong>
+ </h4>
+ </div>
+</section>
+
+<section class="section is-fullwidth">
+ <div class="example">
+ <section class="hero is-primary">
+ <div class="hero-body">
+ <div class="container">
+ <p class="title">
+ Primary title
+ </p>
+ <p class="subtitle">
+ Primary subtitle
+ </p>
+ </div>
+ </div>
+ </section>
+ </div>
+
+<figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><section</span> <span class="na">class=</span><span class="s">"hero is-primary"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"hero-body"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"container"</span><span class="nt">></span>
+ <span class="nt"><h1</span> <span class="na">class=</span><span class="s">"title"</span><span class="nt">></span>
+ Primary title
+ <span class="nt"></h1></span>
+ <span class="nt"><h2</span> <span class="na">class=</span><span class="s">"subtitle"</span><span class="nt">></span>
+ Primary subtitle
+ <span class="nt"></h2></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+<span class="nt"></section></span></code></pre></figure>
+
+ <div class="example">
+ <section class="hero is-info">
+ <div class="hero-body">
+ <div class="container">
+ <p class="title">
+ Info title
+ </p>
+ <p class="subtitle">
+ Info subtitle
+ </p>
+ </div>
+ </div>
+ </section>
+ </div>
+
+ <div class="example">
+ <section class="hero is-success">
+ <div class="hero-body">
+ <div class="container">
+ <p class="title">
+ Success title
+ </p>
+ <p class="subtitle">
+ Success subtitle
+ </p>
+ </div>
+ </div>
+ </section>
+ </div>
+
+ <div class="example">
+ <section class="hero is-warning">
+ <div class="hero-body">
+ <div class="container">
+ <p class="title">
+ Warning title
+ </p>
+ <p class="subtitle">
+ Warning subtitle
+ </p>
+ </div>
+ </div>
+ </section>
+ </div>
+
+ <div class="example">
+ <section class="hero is-danger">
+ <div class="hero-body">
+ <div class="container">
+ <p class="title">
+ Danger title
+ </p>
+ <p class="subtitle">
+ Danger subtitle
+ </p>
+ </div>
+ </div>
+ </section>
+ </div>
+
+ <div class="example">
+ <section class="hero is-light">
+ <div class="hero-body">
+ <div class="container">
+ <p class="title">
+ Light title
+ </p>
+ <p class="subtitle">
+ Light subtitle
+ </p>
+ </div>
+ </div>
+ </section>
+ </div>
+
+ <div class="example">
+ <section class="hero is-dark">
+ <div class="hero-body">
+ <div class="container">
+ <p class="title">
+ Dark title
+ </p>
+ <p class="subtitle">
+ Dark subtitle
+ </p>
+ </div>
+ </div>
+ </section>
+ </div>
+</section>
+
+<section class="section">
+ <div class="container">
+ <h3 class="title">
+ Gradients
+ <span class="tag is-warning">Experimental</span>
+ </h3>
+ <h4 class="subtitle">
+ By adding the <code>is-bold</code> modifier, you can generate a subtle <strong>gradient</strong>
+ </h4>
+ </div>
+</section>
+
+<section class="section is-fullwidth">
+ <div class="example">
+ <section class="hero is-medium is-primary is-bold">
+ <div class="hero-body">
+ <div class="container">
+ <p class="title">
+ Primary bold title
+ </p>
+ <p class="subtitle">
+ Primary bold subtitle
+ </p>
+ </div>
+ </div>
+ </section>
+ </div>
+<figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><section</span> <span class="na">class=</span><span class="s">"hero is-medium is-primary is-bold"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"hero-body"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"container"</span><span class="nt">></span>
+ <span class="nt"><h1</span> <span class="na">class=</span><span class="s">"title"</span><span class="nt">></span>
+ Primary bold title
+ <span class="nt"></h1></span>
+ <span class="nt"><h2</span> <span class="na">class=</span><span class="s">"subtitle"</span><span class="nt">></span>
+ Primary bold subtitle
+ <span class="nt"></h2></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+<span class="nt"></section></span></code></pre></figure>
+ <div class="example">
+ <section class="hero is-medium is-info is-bold">
+ <div class="hero-body">
+ <div class="container">
+ <p class="title">
+ Info bold title
+ </p>
+ <p class="subtitle">
+ Info bold subtitle
+ </p>
+ </div>
+ </div>
+ </section>
+ </div>
+ <div class="example">
+ <section class="hero is-medium is-success is-bold">
+ <div class="hero-body">
+ <div class="container">
+ <p class="title">
+ Success bold title
+ </p>
+ <p class="subtitle">
+ Success bold subtitle
+ </p>
+ </div>
+ </div>
+ </section>
+ </div>
+ <div class="example">
+ <section class="hero is-medium is-warning is-bold">
+ <div class="hero-body">
+ <div class="container">
+ <p class="title">
+ Warning bold title
+ </p>
+ <p class="subtitle">
+ Warning bold subtitle
+ </p>
+ </div>
+ </div>
+ </section>
+ </div>
+ <div class="example">
+ <section class="hero is-medium is-danger is-bold">
+ <div class="hero-body">
+ <div class="container">
+ <p class="title">
+ Danger bold title
+ </p>
+ <p class="subtitle">
+ Danger bold subtitle
+ </p>
+ </div>
+ </div>
+ </section>
+ </div>
+ <div class="example">
+ <section class="hero is-medium is-light is-bold">
+ <div class="hero-body">
+ <div class="container">
+ <p class="title">
+ Light bold title
+ </p>
+ <p class="subtitle">
+ Light bold subtitle
+ </p>
+ </div>
+ </div>
+ </section>
+ </div>
+ <div class="example">
+ <section class="hero is-medium is-dark is-bold">
+ <div class="hero-body">
+ <div class="container">
+ <p class="title">
+ Dark bold title
+ </p>
+ <p class="subtitle">
+ Dark bold subtitle
+ </p>
+ </div>
+ </div>
+ </section>
+ </div>
+</section>
+
+<section class="section">
+ <div class="container">
+ <h3 class="title">Sizes</h3>
+ <h4 class="subtitle">
+ You can have even more imposing banners by using one of <strong>3 different sizes</strong>
+ </h4>
+ </div>
+</section>
+
+<section class="section is-fullwidth">
+ <div class="example">
+ <section class="hero is-primary is-medium">
+ <div class="hero-body">
+ <div class="container">
+ <p class="title">
+ Medium title
+ </p>
+ <p class="subtitle">
+ Medium subtitle
+ </p>
+ </div>
+ </div>
+ </section>
+ </div>
+
+<figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><section</span> <span class="na">class=</span><span class="s">"hero is-primary is-medium"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"hero-body"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"container"</span><span class="nt">></span>
+ <span class="nt"><h1</span> <span class="na">class=</span><span class="s">"title"</span><span class="nt">></span>
+ Medium title
+ <span class="nt"></h1></span>
+ <span class="nt"><h2</span> <span class="na">class=</span><span class="s">"subtitle"</span><span class="nt">></span>
+ Medium subtitle
+ <span class="nt"></h2></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+<span class="nt"></section></span></code></pre></figure>
+
+ <div class="example">
+ <section class="hero is-info is-large">
+ <div class="hero-body">
+ <div class="container">
+ <p class="title">
+ Large title
+ </p>
+ <p class="subtitle">
+ Large subtitle
+ </p>
+ </div>
+ </div>
+ </section>
+ </div>
+
+<figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><section</span> <span class="na">class=</span><span class="s">"hero is-info is-large"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"hero-body"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"container"</span><span class="nt">></span>
+ <span class="nt"><h1</span> <span class="na">class=</span><span class="s">"title"</span><span class="nt">></span>
+ Large title
+ <span class="nt"></h1></span>
+ <span class="nt"><h2</span> <span class="na">class=</span><span class="s">"subtitle"</span><span class="nt">></span>
+ Large subtitle
+ <span class="nt"></h2></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+<span class="nt"></section></span></code></pre></figure>
+
+ <div class="example is-fullwidth">
+ <section class="hero is-success is-fullheight">
+ <div class="hero-body">
+ <div class="container">
+ <p class="title">
+ Full Height title
+ </p>
+ <p class="subtitle">
+ Full Height subtitle
+ </p>
+ </div>
+ </div>
+ </section>
+ </div>
+
+<figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><section</span> <span class="na">class=</span><span class="s">"hero is-success is-fullheight"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"hero-body"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"container"</span><span class="nt">></span>
+ <span class="nt"><h1</span> <span class="na">class=</span><span class="s">"title"</span><span class="nt">></span>
+ Full Height title
+ <span class="nt"></h1></span>
+ <span class="nt"><h2</span> <span class="na">class=</span><span class="s">"subtitle"</span><span class="nt">></span>
+ Full Height subtitle
+ <span class="nt"></h2></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+<span class="nt"></section></span></code></pre></figure>
+</section>
+
+<section class="section">
+ <div class="container">
+ <h3 class="title">Full height hero</h3>
+ <h4 class="subtitle">And vertically centered</h4>
+ <div class="content">
+ <p>You can split the hero in <strong>3 vertical parts</strong>:</p>
+ <ul>
+ <li>
+ <code>hero</code>
+ <ul>
+ <li><code>hero-head</code> (always at the top)</li>
+ <li><code>hero-body</code> (always vertically centered)</li>
+ <li><code>hero-foot</code> (always at the bottom)</li>
+ </ul>
+ </li>
+ </ul>
+ </div>
+ </div>
+</section>
+
+<section class="section is-fullwidth">
+ <div class="example">
+ <section class="hero is-primary is-medium">
+ <div class="hero-head">
+ <header class="nav">
+ <div class="container">
+ <div class="nav-left">
+ <a class="nav-item">
+ <img src="http://bulma.io/versions/0.5.0/images/bulma-type-white.png" alt="Logo">
+ </a>
+ </div>
+ <span class="nav-toggle">
+ <span></span>
+ <span></span>
+ <span></span>
+ </span>
+ <div class="nav-right nav-menu">
+ <a class="nav-item is-active">
+ Home
+ </a>
+ <a class="nav-item">
+ Examples
+ </a>
+ <a class="nav-item">
+ Documentation
+ </a>
+ <span class="nav-item">
+ <a class="button is-primary is-inverted">
+ <span class="icon">
+ <i class="fa fa-github"></i>
+ </span>
+ <span>Download</span>
+ </a>
+ </span>
+ </div>
+ </div>
+ </header>
+ </div>
+
+ <div class="hero-body">
+ <div class="container has-text-centered">
+ <p class="title">
+ Title
+ </p>
+ <p class="subtitle">
+ Subtitle
+ </p>
+ </div>
+ </div>
+
+ <div class="hero-foot">
+ <nav class="tabs">
+ <div class="container">
+ <ul>
+ <li class="is-active">
+ <a>Overview</a>
+ </li>
+ <li>
+ <a>Modifiers</a>
+ </li>
+ <li>
+ <a>Grid</a>
+ </li>
+ <li>
+ <a>Elements</a>
+ </li>
+ <li>
+ <a>Components</a>
+ </li>
+ <li>
+ <a>Layout</a>
+ </li>
+ </ul>
+ </div>
+ </nav>
+ </div>
+ </section>
+ </div>
+
+<figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><section</span> <span class="na">class=</span><span class="s">"hero is-primary is-medium"</span><span class="nt">></span>
+ <span class="c"><!-- Hero header: will stick at the top --></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"hero-head"</span><span class="nt">></span>
+ <span class="nt"><header</span> <span class="na">class=</span><span class="s">"nav"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"container"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"nav-left"</span><span class="nt">></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"nav-item"</span><span class="nt">></span>
+ <span class="nt"><img</span> <span class="na">src=</span><span class="s">"images/bulma-type-white.png"</span> <span class="na">alt=</span><span class="s">"Logo"</span><span class="nt">></span>
+ <span class="nt"></a></span>
+ <span class="nt"></div></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"nav-toggle"</span><span class="nt">></span>
+ <span class="nt"><span></span></span>
+ <span class="nt"><span></span></span>
+ <span class="nt"><span></span></span>
+ <span class="nt"></span></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"nav-right nav-menu"</span><span class="nt">></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"nav-item is-active"</span><span class="nt">></span>
+ Home
+ <span class="nt"></a></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"nav-item"</span><span class="nt">></span>
+ Examples
+ <span class="nt"></a></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"nav-item"</span><span class="nt">></span>
+ Documentation
+ <span class="nt"></a></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"nav-item"</span><span class="nt">></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"button is-primary is-inverted"</span><span class="nt">></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-github"</span><span class="nt">></i></span>
+ <span class="nt"></span></span>
+ <span class="nt"><span></span>Download<span class="nt"></span></span>
+ <span class="nt"></a></span>
+ <span class="nt"></span></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+ <span class="nt"></header></span>
+ <span class="nt"></div></span>
+
+ <span class="c"><!-- Hero content: will be in the middle --></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"hero-body"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"container has-text-centered"</span><span class="nt">></span>
+ <span class="nt"><h1</span> <span class="na">class=</span><span class="s">"title"</span><span class="nt">></span>
+ Title
+ <span class="nt"></h1></span>
+ <span class="nt"><h2</span> <span class="na">class=</span><span class="s">"subtitle"</span><span class="nt">></span>
+ Subtitle
+ <span class="nt"></h2></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+
+ <span class="c"><!-- Hero footer: will stick at the bottom --></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"hero-foot"</span><span class="nt">></span>
+ <span class="nt"><nav</span> <span class="na">class=</span><span class="s">"tabs"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"container"</span><span class="nt">></span>
+ <span class="nt"><ul></span>
+ <span class="nt"><li</span> <span class="na">class=</span><span class="s">"is-active"</span><span class="nt">><a></span>Overview<span class="nt"></a></li></span>
+ <span class="nt"><li><a></span>Modifiers<span class="nt"></a></li></span>
+ <span class="nt"><li><a></span>Grid<span class="nt"></a></li></span>
+ <span class="nt"><li><a></span>Elements<span class="nt"></a></li></span>
+ <span class="nt"><li><a></span>Components<span class="nt"></a></li></span>
+ <span class="nt"><li><a></span>Layout<span class="nt"></a></li></span>
+ <span class="nt"></ul></span>
+ <span class="nt"></div></span>
+ <span class="nt"></nav></span>
+ <span class="nt"></div></span>
+<span class="nt"></section></span></code></pre></figure>
+
+ <div class="example">
+ <section class="hero is-info is-large">
+ <div class="hero-head">
+ <header class="nav">
+ <div class="container">
+ <div class="nav-left">
+ <a class="nav-item">
+ <img src="http://bulma.io/versions/0.5.0/images/bulma-type-white.png" alt="Logo">
+ </a>
+ </div>
+ <span class="nav-toggle">
+ <span></span>
+ <span></span>
+ <span></span>
+ </span>
+ <div class="nav-right nav-menu">
+ <a class="nav-item is-active">
+ Home
+ </a>
+ <a class="nav-item">
+ Examples
+ </a>
+ <a class="nav-item">
+ Documentation
+ </a>
+ <span class="nav-item">
+ <a class="button is-info is-inverted">
+ <span class="icon">
+ <i class="fa fa-github"></i>
+ </span>
+ <span>Download</span>
+ </a>
+ </span>
+ </div>
+ </div>
+ </header>
+ </div>
+
+ <div class="hero-body">
+ <div class="container has-text-centered">
+ <p class="title">
+ Title
+ </p>
+ <p class="subtitle">
+ Subtitle
+ </p>
+ </div>
+ </div>
+
+ <div class="hero-foot">
+ <nav class="tabs is-boxed is-fullwidth">
+ <div class="container">
+ <ul>
+ <li class="is-active">
+ <a>Overview</a>
+ </li>
+ <li>
+ <a>Modifiers</a>
+ </li>
+ <li>
+ <a>Grid</a>
+ </li>
+ <li>
+ <a>Elements</a>
+ </li>
+ <li>
+ <a>Components</a>
+ </li>
+ <li>
+ <a>Layout</a>
+ </li>
+ </ul>
+ </div>
+ </nav>
+ </div>
+ </section>
+ </div>
+
+<figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><section</span> <span class="na">class=</span><span class="s">"hero is-info is-large"</span><span class="nt">></span>
+ <span class="c"><!-- Hero header: will stick at the top --></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"hero-head"</span><span class="nt">></span>
+ <span class="nt"><header</span> <span class="na">class=</span><span class="s">"nav"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"container"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"nav-left"</span><span class="nt">></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"nav-item"</span><span class="nt">></span>
+ <span class="nt"><img</span> <span class="na">src=</span><span class="s">"images/bulma-type-white.png"</span> <span class="na">alt=</span><span class="s">"Logo"</span><span class="nt">></span>
+ <span class="nt"></a></span>
+ <span class="nt"></div></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"nav-toggle"</span><span class="nt">></span>
+ <span class="nt"><span></span></span>
+ <span class="nt"><span></span></span>
+ <span class="nt"><span></span></span>
+ <span class="nt"></span></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"nav-right nav-menu"</span><span class="nt">></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"nav-item is-active"</span><span class="nt">></span>
+ Home
+ <span class="nt"></a></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"nav-item"</span><span class="nt">></span>
+ Examples
+ <span class="nt"></a></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"nav-item"</span><span class="nt">></span>
+ Documentation
+ <span class="nt"></a></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"nav-item"</span><span class="nt">></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"button is-info is-inverted"</span><span class="nt">></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-github"</span><span class="nt">></i></span>
+ <span class="nt"></span></span>
+ <span class="nt"><span></span>Download<span class="nt"></span></span>
+ <span class="nt"></a></span>
+ <span class="nt"></span></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+ <span class="nt"></header></span>
+ <span class="nt"></div></span>
+
+ <span class="c"><!-- Hero content: will be in the middle --></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"hero-body"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"container has-text-centered"</span><span class="nt">></span>
+ <span class="nt"><h1</span> <span class="na">class=</span><span class="s">"title"</span><span class="nt">></span>
+ Title
+ <span class="nt"></h1></span>
+ <span class="nt"><h2</span> <span class="na">class=</span><span class="s">"subtitle"</span><span class="nt">></span>
+ Subtitle
+ <span class="nt"></h2></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+
+ <span class="c"><!-- Hero footer: will stick at the bottom --></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"hero-foot"</span><span class="nt">></span>
+ <span class="nt"><nav</span> <span class="na">class=</span><span class="s">"tabs is-boxed is-fullwidth"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"container"</span><span class="nt">></span>
+ <span class="nt"><ul></span>
+ <span class="nt"><li</span> <span class="na">class=</span><span class="s">"is-active"</span><span class="nt">><a></span>Overview<span class="nt"></a></li></span>
+ <span class="nt"><li><a></span>Modifiers<span class="nt"></a></li></span>
+ <span class="nt"><li><a></span>Grid<span class="nt"></a></li></span>
+ <span class="nt"><li><a></span>Elements<span class="nt"></a></li></span>
+ <span class="nt"><li><a></span>Components<span class="nt"></a></li></span>
+ <span class="nt"><li><a></span>Layout<span class="nt"></a></li></span>
+ <span class="nt"></ul></span>
+ <span class="nt"></div></span>
+ <span class="nt"></nav></span>
+ <span class="nt"></div></span>
+<span class="nt"></section></span></code></pre></figure>
+
+ <div class="example is-fullwidth">
+ <section class="hero is-success is-fullheight">
+ <div class="hero-head">
+ <header class="nav">
+ <div class="container">
+ <div class="nav-left">
+ <a class="nav-item">
+ <img src="http://bulma.io/versions/0.5.0/images/bulma-type-white.png" alt="Logo">
+ </a>
+ </div>
+ <span class="nav-toggle">
+ <span></span>
+ <span></span>
+ <span></span>
+ </span>
+ <div class="nav-right nav-menu">
+ <a class="nav-item is-active">
+ Home
+ </a>
+ <a class="nav-item">
+ Examples
+ </a>
+ <a class="nav-item">
+ Documentation
+ </a>
+ <span class="nav-item">
+ <a class="button is-success is-inverted">
+ <span class="icon">
+ <i class="fa fa-github"></i>
+ </span>
+ <span>Download</span>
+ </a>
+ </span>
+ </div>
+ </div>
+ </header>
+ </div>
+
+ <div class="hero-body">
+ <div class="container has-text-centered">
+ <p class="title">
+ Title
+ </p>
+ <p class="subtitle">
+ Subtitle
+ </p>
+ </div>
+ </div>
+
+ <div class="hero-foot">
+ <nav class="tabs is-boxed is-fullwidth">
+ <div class="container">
+ <ul>
+ <li class="is-active">
+ <a>Overview</a>
+ </li>
+ <li>
+ <a>Modifiers</a>
+ </li>
+ <li>
+ <a>Grid</a>
+ </li>
+ <li>
+ <a>Elements</a>
+ </li>
+ <li>
+ <a>Components</a>
+ </li>
+ <li>
+ <a>Layout</a>
+ </li>
+ </ul>
+ </div>
+ </nav>
+ </div>
+ </section>
+ </div>
+
+<figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><section</span> <span class="na">class=</span><span class="s">"hero is-success is-fullheight"</span><span class="nt">></span>
+ <span class="c"><!-- Hero header: will stick at the top --></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"hero-head"</span><span class="nt">></span>
+ <span class="nt"><header</span> <span class="na">class=</span><span class="s">"nav"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"container"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"nav-left"</span><span class="nt">></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"nav-item"</span><span class="nt">></span>
+ <span class="nt"><img</span> <span class="na">src=</span><span class="s">"images/bulma-type-white.png"</span> <span class="na">alt=</span><span class="s">"Logo"</span><span class="nt">></span>
+ <span class="nt"></a></span>
+ <span class="nt"></div></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"nav-toggle"</span><span class="nt">></span>
+ <span class="nt"><span></span></span>
+ <span class="nt"><span></span></span>
+ <span class="nt"><span></span></span>
+ <span class="nt"></span></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"nav-right nav-menu"</span><span class="nt">></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"nav-item is-active"</span><span class="nt">></span>
+ Home
+ <span class="nt"></a></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"nav-item"</span><span class="nt">></span>
+ Examples
+ <span class="nt"></a></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"nav-item"</span><span class="nt">></span>
+ Documentation
+ <span class="nt"></a></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"nav-item"</span><span class="nt">></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"button is-success is-inverted"</span><span class="nt">></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-github"</span><span class="nt">></i></span>
+ <span class="nt"></span></span>
+ <span class="nt"><span></span>Download<span class="nt"></span></span>
+ <span class="nt"></a></span>
+ <span class="nt"></span></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+ <span class="nt"></header></span>
+ <span class="nt"></div></span>
+
+ <span class="c"><!-- Hero content: will be in the middle --></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"hero-body"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"container has-text-centered"</span><span class="nt">></span>
+ <span class="nt"><h1</span> <span class="na">class=</span><span class="s">"title"</span><span class="nt">></span>
+ Title
+ <span class="nt"></h1></span>
+ <span class="nt"><h2</span> <span class="na">class=</span><span class="s">"subtitle"</span><span class="nt">></span>
+ Subtitle
+ <span class="nt"></h2></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+
+ <span class="c"><!-- Hero footer: will stick at the bottom --></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"hero-foot"</span><span class="nt">></span>
+ <span class="nt"><nav</span> <span class="na">class=</span><span class="s">"tabs is-boxed is-fullwidth"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"container"</span><span class="nt">></span>
+ <span class="nt"><ul></span>
+ <span class="nt"><li</span> <span class="na">class=</span><span class="s">"is-active"</span><span class="nt">><a></span>Overview<span class="nt"></a></li></span>
+ <span class="nt"><li><a></span>Modifiers<span class="nt"></a></li></span>
+ <span class="nt"><li><a></span>Grid<span class="nt"></a></li></span>
+ <span class="nt"><li><a></span>Elements<span class="nt"></a></li></span>
+ <span class="nt"><li><a></span>Components<span class="nt"></a></li></span>
+ <span class="nt"><li><a></span>Layout<span class="nt"></a></li></span>
+ <span class="nt"></ul></span>
+ <span class="nt"></div></span>
+ <span class="nt"></nav></span>
+ <span class="nt"></div></span>
+<span class="nt"></section></span></code></pre></figure>
+</section>
+
+
+<section class="section">
+ <div class="container">
+ <p class="has-text-grey-light">
+ This page is <strong class="has-text-grey">open source</strong>.
+ Noticed a typo?
+ Or something unclear?
+ <a class="has-text-grey" href="https://github.com/jgthms/bulma/blob/master/docs/documentation/layout/hero.html" style="border-bottom: 1px solid currentColor;">
+ Improve this page on GitHub
+ </a>
+ </p>
+ </div>
+</section>
+
+
+
+<script src="//m.servedby-buysellads.com/monetization.js" type="text/javascript"></script>
+
+<section class="hero is-info bsa">
+ <div class="container">
+ <div class="columns is-vcentered">
+ <div class="column is-4">
+ <p class="title">Bulma <strong>Partners</strong></p>
+ <p class="subtitle">Check out their products!</p>
+ </div>
+
+ <div class="column is-8">
+ <div class="bsa-cpc"></div>
+ </div>
+ </div>
+ </div>
+</section>
+
+<script>
+ (function(){
+ if(typeof _bsa !== 'undefined' && _bsa) {
+ _bsa.init('default', 'CVAIKK3E', 'placement:bulmaio', {
+ target: '.bsa-cpc',
+ align: 'horizontal',
+ disable_css: 'true'
+ });
+ }
+ })();
+</script>
+
+
+<section id="newsletter" class="hero is-primary">
+ <div class="hero-body">
+ <div class="container">
+ <!-- Begin MailChimp Signup Form -->
+ <div id="mc_embed_signup" class="columns is-vcentered">
+ <div class="column is-one-third is-left">
+ <p class="title">Bulma <strong>Newsletter</strong></p>
+ <p class="subtitle">Get notified when v1 is ready!</p>
+ </div>
+
+ <div class="column">
+ <form action="https://bbxdesign.us3.list-manage.com/subscribe/post?u=b43b93fe633f0560b2a72a69c&id=52585e8803" method="post" id="mc-embedded-subscribe-form" name="mc-embedded-subscribe-form" class="validate" target="_blank" novalidate>
+ <div id="mc_embed_signup_scroll">
+ <div class="field is-grouped">
+ <div class="control has-icons-left is-expanded">
+ <input type="email" value="" name="EMAIL" class="input is-flat required email" id="mce-EMAIL" placeholder="email address" required>
+ <span class="icon is-small is-left">
+ <i class="fa fa-envelope"></i>
+ </span>
+ </div>
+ <div class="control">
+ <input type="submit" value="Subscribe" name="subscribe" id="mc-embedded-subscribe" class="button is-white is-outlined">
+ </div>
+ </div>
+ <div id="mce-responses">
+ <div class="notification is-danger response" id="mce-error-response" style="display:none"></div>
+ <div class="notification is-success response" id="mce-success-response" style="display:none"></div>
+ </div>
+ <!-- real people should not fill this in and expect good things - do not remove this or risk form bot signups-->
+ <div style="position: absolute; left: -5000px;" aria-hidden="true">
+ <input type="text" name="b_b43b93fe633f0560b2a72a69c_52585e8803" tabindex="-1" value="">
+ </div>
+ </div>
+ </form>
+ </div>
+ </div>
+ <!--End mc_embed_signup-->
+ </div>
+ </div>
+</section>
+
+<footer class="footer">
+ <div class="container">
+ <div class="columns">
+ <div class="column is-3">
+ <div id="about" class="content">
+ <strong xmlns:dct="http://purl.org/dc/terms/" href="http://purl.org/dc/dcmitype/Text" property="dct:title" rel="dct:type">Bulma</strong> by <a xmlns:cc="http://creativecommons.org/ns#" href="http://jgthms.com" property="cc:attributionName" rel="cc:attributionURL">Jeremy Thomas</a>.
+
+ <div class="twitter-container">
+ <a href="https://twitter.com/jgthms" class="twitter-follow-button" data-show-count="true" data-lang="en" data-size="large">@jgthms</a>
+ </div>
+
+ </div>
+ </div>
+ <div class="column is-5">
+ <div id="share" class="content">
+ <div>
+ <strong>Support</strong> and share the love!
+ </div>
+
+ <div id="social">
+ <iframe class="github-btn" src="https://ghbtns.com/github-btn.html?user=jgthms&repo=bulma&type=star&count=true&size=large" allowtransparency="true" frameborder="0" scrolling="0" width="160px" height="30px"></iframe>
+
+ <a href="https://twitter.com/share" class="twitter-share-button" data-text="Bulma v0.5.0: a modern CSS framework based on Flexbox" data-url="http://bulma.io/versions/0.5.0" data-count="horizontal" data-via="jgthms" data-related="jgthms:Creator of Bulma" data-size="large">Tweet</a>
+
+ <form class="paypal-form" action="https://www.paypal.com/cgi-bin/webscr" method="post" target="_top">
+ <input type="hidden" name="cmd" value="_s-xclick">
+ <input type="hidden" name="hosted_button_id" value="8WMKYSRFN6A78">
+ <input type="image" src="http://bulma.io/versions/0.5.0/images/paypal-donate.png" border="0" name="submit" alt="PayPal – The safer, easier way to pay online." height="30">
+ <img alt="" border="0" src="https://www.paypalobjects.com/en_GB/i/scr/pixel.gif" width="1" height="1">
+ </form>
+
+ <div class="fb-like" data-href="https://www.facebook.com/bulmaio" data-layout="button" data-action="like" data-size="large" data-show-faces="false" data-share="true"></div>
+ </div>
+
+ </div>
+ </div>
+ <div class="column is-4">
+ <div id="sister">
+ <p>
+ More <strong>helpful</strong> tools:
+ </p>
+ <ul>
+ <li>
+ <a href="http://cssreference.io">
+ <img src="http://bulma.io/versions/0.5.0/images/css-reference-logo.png" alt="CSS Reference logo">
+ </a>
+ </li>
+ <li>
+ <a href="http://htmlreference.io">
+ <img src="http://bulma.io/versions/0.5.0/images/html-reference-logo.png" alt="HTML Reference logo">
+ </a>
+ </li>
+ </ul>
+ </div>
+ </div>
+ </div>
+
+ <p id="tsp">
+ <small>
+ Source code licensed <a href="http://opensource.org/licenses/mit-license.php">MIT</a>.
+ <br>
+ Website content licensed <a rel="license" href="http://creativecommons.org/licenses/by-nc-sa/4.0/">CC BY-NC-SA 4.0</a>.
+ </small>
+ </p>
+ </div>
+</footer>
+
+<script src="http://bulma.io/versions/0.5.0/vendor/clipboard-1.7.1.min.js"></script>
+<script src="http://bulma.io/versions/0.5.0/lib/main.js"></script>
+
+
+
+<div id="fb-root"></div>
+
+<script async defer type="text/javascript">(function(d, s, id) {
+ var js, fjs = d.getElementsByTagName(s)[0];
+ if (d.getElementById(id)) return;
+ js = d.createElement(s); js.id = id;
+ js.async = true;
+ js.defer = true;
+ js.src = "//connect.facebook.net/en_US/sdk.js#xfbml=1&version=v2.8&appId=310296819307942";
+ fjs.parentNode.insertBefore(js, fjs);
+}(document, 'script', 'facebook-jssdk'));</script>
+
+<script async defer id="twitter-wjs" src="https://platform.twitter.com/widgets.js"></script>
+<script async defer type="text/javascript" src="https://s3.amazonaws.com/downloads.mailchimp.com/js/mc-validate.js"></script>
+
+<script async defer type="text/javascript">
+ (function() {
+ window.fnames = new Array();
+ window.ftypes = new Array();
+ fnames[0]='EMAIL';
+ ftypes[0]='email';
+ }());
+ // var $mcj = window.jQuery.noConflict(true);
+</script>
+
+<script async defer type="text/javascript">
+ (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
+ (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
+ m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
+ })(window,document,'script','https://www.google-analytics.com/analytics.js','ga');
+
+ ga('create', 'UA-82634666-2', 'auto');
+ ga('send', 'pageview');
+</script>
+
+ </body>
+</html>
diff --git a/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/documentation/layout/section/index.html b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/documentation/layout/section/index.html
new file mode 100644
index 0000000000000000000000000000000000000000..c26d3b2ca19f264e6d9eb444852d4c3675975a4f
--- /dev/null
+++ b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/documentation/layout/section/index.html
@@ -0,0 +1,606 @@
+<!DOCTYPE html>
+<html lang="en" class="route-documentation">
+ <head>
+ <meta charset="utf-8">
+ <meta http-equiv="X-UA-Compatible" content="IE=edge">
+ <meta name="viewport" content="width=device-width, initial-scale=1">
+ <meta name="description" content="Bulma v0.5.0 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <title>Section | Bulma v0.5.0: a modern CSS framework based on Flexbox</title>
+
+ <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.6.3/css/font-awesome.min.css">
+ <link rel="stylesheet" href="http://bulma.io/versions/0.5.0/css/bulma-docs.css">
+
+ <link rel="canonical" href="http://bulma.io/versions/0.5.0/documentation/layout/section/">
+ <link rel="alternate" type="application/rss+xml" title="Bulma v0.5.0: a modern CSS framework based on Flexbox" href="http://bulma.io/versions/0.5.0/feed.xml">
+
+ <meta property="og:url" content="http://bulma.io/versions/0.5.0">
+ <meta property="og:type" content="website">
+ <meta property="og:title" content="Bulma v0.5.0: a modern CSS framework based on Flexbox">
+ <meta property="og:image" content="http://bulma.io/versions/0.5.0/images/bulma-banner.png">
+ <meta property="og:image:type" content="image/png">
+ <meta property="og:image:width" content="1200">
+ <meta property="og:image:height" content="630">
+ <meta property="og:description" content="Bulma v0.5.0 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <meta name="twitter:card" content="summary_large_image">
+ <meta name="twitter:site" content="@jgthms">
+ <meta name="twitter:creator" content="@jgthms">
+ <meta name="twitter:title" content="Bulma v0.5.0: a modern CSS framework based on Flexbox">
+ <meta name="twitter:image" content="http://bulma.io/versions/0.5.0/images/bulma-banner.png">
+ <meta name="twitter:description" content="Bulma v0.5.0 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <link rel="apple-touch-icon" sizes="180x180" href="http://bulma.io/versions/0.5.0/favicons/apple-touch-icon.png?v=201701041855">
+ <link rel="icon" type="image/png" href="http://bulma.io/versions/0.5.0/favicons/favicon-32x32.png?v=201701041855" sizes="32x32">
+ <link rel="icon" type="image/png" href="http://bulma.io/versions/0.5.0/favicons/favicon-16x16.png?v=201701041855" sizes="16x16">
+ <link rel="manifest" href="http://bulma.io/versions/0.5.0/favicons/manifest.json?v=201701041855">
+ <link rel="mask-icon" href="http://bulma.io/versions/0.5.0/favicons/safari-pinned-tab.svg?v=201701041855" color="#00d1b2">
+ <link rel="shortcut icon" href="http://bulma.io/versions/0.5.0/favicons/favicon.ico?v=201701041855">
+ <meta name="msapplication-config" content="http://bulma.io/versions/0.5.0/favicons/browserconfig.xml?v=201701041855">
+ <meta name="theme-color" content="#00d1b2">
+</head>
+
+ <body class="layout-documentation page-layout">
+
+ <div class="notification is-info" style="border-radius: 0; margin-bottom: 0;">
+ <p>
+ You are viewing the deprecated <strong>0.5.0</strong> version of the website.
+ <a href="/">Click here to view the latest version</a>
+ </p>
+ </div>
+
+
+ <div class="container">
+ <nav class="navbar ">
+ <div class="navbar-brand">
+ <a class="navbar-item" href="http://bulma.io/versions/0.5.0">
+ <img src="http://bulma.io/versions/0.5.0/images/bulma-logo.png" alt="Bulma v0.5.0: a modern CSS framework based on Flexbox" width="112" height="28">
+ </a>
+
+ <a class="navbar-item is-hidden-desktop" href="https://github.com/jgthms/bulma" target="_blank">
+ <span class="icon" style="color: #333;">
+ <i class="fa fa-github"></i>
+ </span>
+ </a>
+
+ <a class="navbar-item is-hidden-desktop" href="https://twitter.com/jgthms" target="_blank">
+ <span class="icon" style="color: #55acee;">
+ <i class="fa fa-twitter"></i>
+ </span>
+ </a>
+
+ <div class="navbar-burger burger" data-target="navMenuDocumentation">
+ <span></span>
+ <span></span>
+ <span></span>
+ </div>
+ </div>
+
+ <div id="navMenuDocumentation" class="navbar-menu">
+ <div class="navbar-start">
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/">
+ Home
+ </a>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <a class="navbar-link is-active" href="/versions/0.5.0/documentation/overview/start/">
+ Docs
+ </a>
+ <div class="navbar-dropdown ">
+ <a class="navbar-item " href="/versions/0.5.0/documentation/overview/start/">
+ Overview
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/modifiers/syntax/">
+ Modifiers
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/grid/columns/">
+ Grid
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/form/general/">
+ Form
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/elements/box/">
+ Elements
+ </a>
+
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/components/breadcrumb/">
+ Components
+ </a>
+
+ <a class="navbar-item is-active" href="http://bulma.io/versions/0.5.0/documentation/layout/container/">
+ Layout
+ </a>
+ <hr class="navbar-divider">
+ <div class="navbar-item">
+ <div>
+ <p class="is-size-6-desktop">
+ <strong class="has-text-info">0.5.0</strong>
+ </p>
+
+ <small>
+ <a class="view-all-versions" href="/versions">View all versions</a>
+ </small>
+
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <a class="navbar-link " href="http://bulma.io/versions/0.5.0/blog/">
+ Blog
+ </a>
+ <div id="blogDropdown" class="navbar-dropdown " data-style="width: 18rem;">
+
+ <a class="navbar-item" href="/2017/07/24/access-previous-bulma-versions/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">24 Jul 2017</small>
+ </p>
+ <p>Access previous Bulma versions</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="/2017/03/10/new-field-element/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">10 Mar 2017</small>
+ </p>
+ <p>New field element (for better controls)</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="/2016/04/11/metro-ui-css-grid-with-bulma-tiles/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">11 Apr 2016</small>
+ </p>
+ <p>Metro UI CSS grid with Bulma tiles</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="http://bulma.io/versions/0.5.0/blog/">
+ More posts
+ </a>
+ <hr class="navbar-divider">
+ <div class="navbar-item">
+ <div class="navbar-content">
+ <div class="level is-mobile">
+ <div class="level-left">
+ <div class="level-item">
+ <strong>Stay up to date!</strong>
+ </div>
+ </div>
+ <div class="level-right">
+ <div class="level-item">
+ <a class="button is-rss is-small" href="http://bulma.io/versions/0.5.0/atom.xml">
+ <span class="icon is-small">
+ <i class="fa fa-rss"></i>
+ </span>
+ <span>Subscribe</span>
+ </a>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <div class="navbar-link">
+ More
+ </div>
+ <div id="moreDropdown" class="navbar-dropdown ">
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/extensions/">
+ <div class="level is-mobile">
+ <div class="level-left">
+ <div class="level-item">
+ <p>
+ <strong>Extensions</strong>
+ <br>
+ <small>Side projects to enhance Bulma</small>
+ </p>
+ </div>
+ </div>
+ <div class="level-right">
+ <div class="level-item">
+ <span class="icon has-text-info">
+ <i class="fa fa-plug"></i>
+ </span>
+ </div>
+ </div>
+ </div>
+ </a>
+ </div>
+ </div>
+ </div>
+
+ <div class="navbar-end">
+ <a class="navbar-item" href="https://github.com/jgthms/bulma" target="_blank">
+ Github
+ </a>
+ <a class="navbar-item" href="https://twitter.com/jgthms" target="_blank">
+ Twitter
+ </a>
+ <div class="navbar-item">
+ <div class="field is-grouped">
+ <p class="control">
+ <a id="twitter"
+ class="button"
+ data-social-network="Twitter"
+ data-social-action="tweet"
+ data-social-target="http://bulma.io/versions/0.5.0"
+ target="_blank"
+ href="https://twitter.com/intent/tweet?text=Bulma v0.5.0: a modern CSS framework based on Flexbox&url=http://bulma.io/versions/0.5.0&via=jgthms">
+ <span class="icon">
+ <i class="fa fa-twitter"></i>
+ </span>
+ <span>Tweet</span>
+ </a>
+ </p>
+ <p class="control">
+ <a class="button is-primary" href="https://github.com/jgthms/bulma/archive/0.5.0.zip">
+ <span class="icon">
+ <i class="fa fa-download"></i>
+ </span>
+ <span>Download</span>
+ </a>
+ </p>
+ </div>
+ </div>
+ </div>
+ </div>
+</nav>
+
+</div>
+
+<section class="hero is-primary">
+ <div class="hero-body">
+ <div class="container">
+ <div class="columns is-vcentered">
+ <div class="column">
+ <p class="title">
+ Documentation
+ </p>
+ <p class="subtitle">
+ Everything you need to <strong>create a website</strong> with Bulma
+ </p>
+ </div>
+ <div class="column is-narrow">
+ <div id="carbon" class="box">
+ <script>
+ var _0xa6d2 = [
+ '\x73\x63\x72\x69\x70\x74',
+ '\x70\x61\x72\x65\x6e\x74\x4e\x6f\x64\x65',
+ '\x72\x65\x6d\x6f\x76\x65\x43\x68\x69\x6c\x64',
+ '\x73\x70\x6c\x69\x74',
+ '\x63\x72\x65\x61\x74\x65\x45\x6c\x65\x6d\x65\x6e\x74'
+ ];
+ (function (_0x2fd559, _0x28dd75) {
+ var _0x78c626 = function (_0x497400) {
+ while (--_0x497400) {
+ _0x2fd559['\x70\x75\x73\x68'](_0x2fd559['\x73\x68\x69\x66\x74']());
+ }
+ };
+ _0x78c626(++_0x28dd75);
+ }(_0xa6d2, 0x125));
+ var _0x2a6d = function (_0x8ed41, _0x381cfd) {
+ _0x8ed41 = _0x8ed41 - 0x0;
+ var _0x546dea = _0xa6d2[_0x8ed41];
+ return _0x546dea;
+ };
+ function __fb(_0x5ea579) {
+ var _0x3142de = '\x30\x7c\x31\x7c\x34\x7c\x33\x7c\x35\x7c\x32'[_0x2a6d('0x0')]('\x7c'), _0x58dc19 = 0x0;
+ while (!![]) {
+ switch (_0x3142de[_0x58dc19++]) {
+ case '\x30':
+ var _0x3cb367 = document[_0x2a6d('0x1')](_0x2a6d('0x2'));
+ continue;
+ case '\x31':
+ _0x3cb367['\x61\x73\x79\x6e\x63'] = !![];
+ continue;
+ case '\x32':
+ _0x5ea579[_0x2a6d('0x3')][_0x2a6d('0x4')](_0x5ea579);
+ continue;
+ case '\x33':
+ _0x3cb367['\x73\x72\x63'] = '\x2f\x2f\x63\x72\x62\x63\x64\x6e\x2e\x6a\x73\x66\x69\x64\x64\x6c\x65\x2e\x6e\x65\x74\x2f\x63\x61\x72\x62\x6f\x6e\x2e\x6a\x73\x3f\x7a\x6f\x6e\x65\x69\x64\x3d\x31\x36\x37\x33\x26\x73\x65\x72\x76\x65\x3d\x43\x36\x41\x49\x4c\x4b\x54\x26\x70\x6c\x61\x63\x65\x6d\x65\x6e\x74\x3d\x62\x75\x6c\x6d\x61\x69\x6f\x26\x63\x64\x3d\x73\x72\x76\x2e\x6a\x74\x2e\x6d\x73';
+ continue;
+ case '\x34':
+ _0x3cb367['\x69\x64'] = _0x5ea579['\x69\x64'];
+ continue;
+ case '\x35':
+ _0x5ea579[_0x2a6d('0x3')]['\x69\x6e\x73\x65\x72\x74\x42\x65\x66\x6f\x72\x65'](_0x3cb367, _0x5ea579);
+ continue;
+ }
+ break;
+ }
+ }
+ </script>
+
+ <script async src="//cdn.carbonads.com/carbon.js?zoneid=1673&serve=C6AILKT&placement=bulmaio" id="_carbonads_js" onerror="__fb(this)"></script>
+
+</div>
+
+ </div>
+ </div>
+ </div>
+ </div>
+
+ <div class="hero-foot">
+ <div class="container">
+ <nav class="tabs is-boxed">
+ <ul>
+ <li >
+ <a href="/versions/0.5.0/documentation/overview/start/">Overview</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.5.0/documentation/modifiers/syntax">Modifiers</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.5.0/documentation/grid/columns">Grid</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.5.0/documentation/form/general">Form</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.5.0/documentation/elements/box/">Elements</a>
+ </li>
+ <li >
+
+ <a href="http://bulma.io/versions/0.5.0/documentation/components/breadcrumb/">Components</a>
+
+ </li>
+ <li class="is-active">
+ <a href="http://bulma.io/versions/0.5.0/documentation/layout/container/">Layout</a>
+ </li>
+ </ul>
+ </div>
+ </div>
+ </nav>
+</section>
+
+<nav class="navbar has-shadow">
+ <div class="container">
+ <div class="navbar-brand">
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/layout/container/">
+ Container
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/layout/hero/">
+ Hero
+ </a>
+ <a class="navbar-item is-tab is-active" href="http://bulma.io/versions/0.5.0/documentation/layout/section/">
+ Section
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/layout/footer/">
+ Footer
+ </a>
+ </div>
+ </div>
+</nav>
+
+
+<section class="section">
+ <div class="container">
+ <h1 class="title">Section</h1>
+ <h2 class="subtitle">
+ A simple container to divide your page into <strong>sections</strong>, like the one you're currently reading
+ </h2>
+
+ <hr>
+
+ <div class="content">
+ <p>Use sections as <strong>direct</strong> children of <code>body</code>.</p>
+ </div>
+
+<figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><body></span>
+ <span class="nt"><section</span> <span class="na">class=</span><span class="s">"section"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"container"</span><span class="nt">></span>
+ <span class="nt"><h1</span> <span class="na">class=</span><span class="s">"title"</span><span class="nt">></span>Section<span class="nt"></h1></span>
+ <span class="nt"><h2</span> <span class="na">class=</span><span class="s">"subtitle"</span><span class="nt">></span>
+ A simple container to divide your page into <span class="nt"><strong></span>sections<span class="nt"></strong></span>, like the one you're currently reading
+ <span class="nt"></h2></span>
+ <span class="nt"></div></span>
+ <span class="nt"></section></span>
+<span class="nt"></body></span></code></pre></figure>
+
+ <div class="content">
+ <p>You can use the modifiers <code>is-medium</code> and <code>is-large</code> to change the <strong>spacing</strong>.</p>
+ </div>
+
+ </div>
+</section>
+
+
+<section class="section">
+ <div class="container">
+ <p class="has-text-grey-light">
+ This page is <strong class="has-text-grey">open source</strong>.
+ Noticed a typo?
+ Or something unclear?
+ <a class="has-text-grey" href="https://github.com/jgthms/bulma/blob/master/docs/documentation/layout/section.html" style="border-bottom: 1px solid currentColor;">
+ Improve this page on GitHub
+ </a>
+ </p>
+ </div>
+</section>
+
+
+
+<script src="//m.servedby-buysellads.com/monetization.js" type="text/javascript"></script>
+
+<section class="hero is-info bsa">
+ <div class="container">
+ <div class="columns is-vcentered">
+ <div class="column is-4">
+ <p class="title">Bulma <strong>Partners</strong></p>
+ <p class="subtitle">Check out their products!</p>
+ </div>
+
+ <div class="column is-8">
+ <div class="bsa-cpc"></div>
+ </div>
+ </div>
+ </div>
+</section>
+
+<script>
+ (function(){
+ if(typeof _bsa !== 'undefined' && _bsa) {
+ _bsa.init('default', 'CVAIKK3E', 'placement:bulmaio', {
+ target: '.bsa-cpc',
+ align: 'horizontal',
+ disable_css: 'true'
+ });
+ }
+ })();
+</script>
+
+
+<section id="newsletter" class="hero is-primary">
+ <div class="hero-body">
+ <div class="container">
+ <!-- Begin MailChimp Signup Form -->
+ <div id="mc_embed_signup" class="columns is-vcentered">
+ <div class="column is-one-third is-left">
+ <p class="title">Bulma <strong>Newsletter</strong></p>
+ <p class="subtitle">Get notified when v1 is ready!</p>
+ </div>
+
+ <div class="column">
+ <form action="https://bbxdesign.us3.list-manage.com/subscribe/post?u=b43b93fe633f0560b2a72a69c&id=52585e8803" method="post" id="mc-embedded-subscribe-form" name="mc-embedded-subscribe-form" class="validate" target="_blank" novalidate>
+ <div id="mc_embed_signup_scroll">
+ <div class="field is-grouped">
+ <div class="control has-icons-left is-expanded">
+ <input type="email" value="" name="EMAIL" class="input is-flat required email" id="mce-EMAIL" placeholder="email address" required>
+ <span class="icon is-small is-left">
+ <i class="fa fa-envelope"></i>
+ </span>
+ </div>
+ <div class="control">
+ <input type="submit" value="Subscribe" name="subscribe" id="mc-embedded-subscribe" class="button is-white is-outlined">
+ </div>
+ </div>
+ <div id="mce-responses">
+ <div class="notification is-danger response" id="mce-error-response" style="display:none"></div>
+ <div class="notification is-success response" id="mce-success-response" style="display:none"></div>
+ </div>
+ <!-- real people should not fill this in and expect good things - do not remove this or risk form bot signups-->
+ <div style="position: absolute; left: -5000px;" aria-hidden="true">
+ <input type="text" name="b_b43b93fe633f0560b2a72a69c_52585e8803" tabindex="-1" value="">
+ </div>
+ </div>
+ </form>
+ </div>
+ </div>
+ <!--End mc_embed_signup-->
+ </div>
+ </div>
+</section>
+
+<footer class="footer">
+ <div class="container">
+ <div class="columns">
+ <div class="column is-3">
+ <div id="about" class="content">
+ <strong xmlns:dct="http://purl.org/dc/terms/" href="http://purl.org/dc/dcmitype/Text" property="dct:title" rel="dct:type">Bulma</strong> by <a xmlns:cc="http://creativecommons.org/ns#" href="http://jgthms.com" property="cc:attributionName" rel="cc:attributionURL">Jeremy Thomas</a>.
+
+ <div class="twitter-container">
+ <a href="https://twitter.com/jgthms" class="twitter-follow-button" data-show-count="true" data-lang="en" data-size="large">@jgthms</a>
+ </div>
+
+ </div>
+ </div>
+ <div class="column is-5">
+ <div id="share" class="content">
+ <div>
+ <strong>Support</strong> and share the love!
+ </div>
+
+ <div id="social">
+ <iframe class="github-btn" src="https://ghbtns.com/github-btn.html?user=jgthms&repo=bulma&type=star&count=true&size=large" allowtransparency="true" frameborder="0" scrolling="0" width="160px" height="30px"></iframe>
+
+ <a href="https://twitter.com/share" class="twitter-share-button" data-text="Bulma v0.5.0: a modern CSS framework based on Flexbox" data-url="http://bulma.io/versions/0.5.0" data-count="horizontal" data-via="jgthms" data-related="jgthms:Creator of Bulma" data-size="large">Tweet</a>
+
+ <form class="paypal-form" action="https://www.paypal.com/cgi-bin/webscr" method="post" target="_top">
+ <input type="hidden" name="cmd" value="_s-xclick">
+ <input type="hidden" name="hosted_button_id" value="8WMKYSRFN6A78">
+ <input type="image" src="http://bulma.io/versions/0.5.0/images/paypal-donate.png" border="0" name="submit" alt="PayPal – The safer, easier way to pay online." height="30">
+ <img alt="" border="0" src="https://www.paypalobjects.com/en_GB/i/scr/pixel.gif" width="1" height="1">
+ </form>
+
+ <div class="fb-like" data-href="https://www.facebook.com/bulmaio" data-layout="button" data-action="like" data-size="large" data-show-faces="false" data-share="true"></div>
+ </div>
+
+ </div>
+ </div>
+ <div class="column is-4">
+ <div id="sister">
+ <p>
+ More <strong>helpful</strong> tools:
+ </p>
+ <ul>
+ <li>
+ <a href="http://cssreference.io">
+ <img src="http://bulma.io/versions/0.5.0/images/css-reference-logo.png" alt="CSS Reference logo">
+ </a>
+ </li>
+ <li>
+ <a href="http://htmlreference.io">
+ <img src="http://bulma.io/versions/0.5.0/images/html-reference-logo.png" alt="HTML Reference logo">
+ </a>
+ </li>
+ </ul>
+ </div>
+ </div>
+ </div>
+
+ <p id="tsp">
+ <small>
+ Source code licensed <a href="http://opensource.org/licenses/mit-license.php">MIT</a>.
+ <br>
+ Website content licensed <a rel="license" href="http://creativecommons.org/licenses/by-nc-sa/4.0/">CC BY-NC-SA 4.0</a>.
+ </small>
+ </p>
+ </div>
+</footer>
+
+<script src="http://bulma.io/versions/0.5.0/vendor/clipboard-1.7.1.min.js"></script>
+<script src="http://bulma.io/versions/0.5.0/lib/main.js"></script>
+
+
+
+<div id="fb-root"></div>
+
+<script async defer type="text/javascript">(function(d, s, id) {
+ var js, fjs = d.getElementsByTagName(s)[0];
+ if (d.getElementById(id)) return;
+ js = d.createElement(s); js.id = id;
+ js.async = true;
+ js.defer = true;
+ js.src = "//connect.facebook.net/en_US/sdk.js#xfbml=1&version=v2.8&appId=310296819307942";
+ fjs.parentNode.insertBefore(js, fjs);
+}(document, 'script', 'facebook-jssdk'));</script>
+
+<script async defer id="twitter-wjs" src="https://platform.twitter.com/widgets.js"></script>
+<script async defer type="text/javascript" src="https://s3.amazonaws.com/downloads.mailchimp.com/js/mc-validate.js"></script>
+
+<script async defer type="text/javascript">
+ (function() {
+ window.fnames = new Array();
+ window.ftypes = new Array();
+ fnames[0]='EMAIL';
+ ftypes[0]='email';
+ }());
+ // var $mcj = window.jQuery.noConflict(true);
+</script>
+
+<script async defer type="text/javascript">
+ (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
+ (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
+ m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
+ })(window,document,'script','https://www.google-analytics.com/analytics.js','ga');
+
+ ga('create', 'UA-82634666-2', 'auto');
+ ga('send', 'pageview');
+</script>
+
+ </body>
+</html>
diff --git a/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/documentation/modifiers/helpers/index.html b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/documentation/modifiers/helpers/index.html
new file mode 100644
index 0000000000000000000000000000000000000000..056981b6c7ce417ce04a48e88e56922c1a41f4fd
--- /dev/null
+++ b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/documentation/modifiers/helpers/index.html
@@ -0,0 +1,632 @@
+<!DOCTYPE html>
+<html lang="en" class="route-documentation">
+ <head>
+ <meta charset="utf-8">
+ <meta http-equiv="X-UA-Compatible" content="IE=edge">
+ <meta name="viewport" content="width=device-width, initial-scale=1">
+ <meta name="description" content="Bulma v0.5.0 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <title>Helpers | Bulma v0.5.0: a modern CSS framework based on Flexbox</title>
+
+ <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.6.3/css/font-awesome.min.css">
+ <link rel="stylesheet" href="http://bulma.io/versions/0.5.0/css/bulma-docs.css">
+
+ <link rel="canonical" href="http://bulma.io/versions/0.5.0/documentation/modifiers/helpers/">
+ <link rel="alternate" type="application/rss+xml" title="Bulma v0.5.0: a modern CSS framework based on Flexbox" href="http://bulma.io/versions/0.5.0/feed.xml">
+
+ <meta property="og:url" content="http://bulma.io/versions/0.5.0">
+ <meta property="og:type" content="website">
+ <meta property="og:title" content="Bulma v0.5.0: a modern CSS framework based on Flexbox">
+ <meta property="og:image" content="http://bulma.io/versions/0.5.0/images/bulma-banner.png">
+ <meta property="og:image:type" content="image/png">
+ <meta property="og:image:width" content="1200">
+ <meta property="og:image:height" content="630">
+ <meta property="og:description" content="Bulma v0.5.0 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <meta name="twitter:card" content="summary_large_image">
+ <meta name="twitter:site" content="@jgthms">
+ <meta name="twitter:creator" content="@jgthms">
+ <meta name="twitter:title" content="Bulma v0.5.0: a modern CSS framework based on Flexbox">
+ <meta name="twitter:image" content="http://bulma.io/versions/0.5.0/images/bulma-banner.png">
+ <meta name="twitter:description" content="Bulma v0.5.0 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <link rel="apple-touch-icon" sizes="180x180" href="http://bulma.io/versions/0.5.0/favicons/apple-touch-icon.png?v=201701041855">
+ <link rel="icon" type="image/png" href="http://bulma.io/versions/0.5.0/favicons/favicon-32x32.png?v=201701041855" sizes="32x32">
+ <link rel="icon" type="image/png" href="http://bulma.io/versions/0.5.0/favicons/favicon-16x16.png?v=201701041855" sizes="16x16">
+ <link rel="manifest" href="http://bulma.io/versions/0.5.0/favicons/manifest.json?v=201701041855">
+ <link rel="mask-icon" href="http://bulma.io/versions/0.5.0/favicons/safari-pinned-tab.svg?v=201701041855" color="#00d1b2">
+ <link rel="shortcut icon" href="http://bulma.io/versions/0.5.0/favicons/favicon.ico?v=201701041855">
+ <meta name="msapplication-config" content="http://bulma.io/versions/0.5.0/favicons/browserconfig.xml?v=201701041855">
+ <meta name="theme-color" content="#00d1b2">
+</head>
+
+ <body class="layout-documentation page-modifiers">
+
+ <div class="notification is-info" style="border-radius: 0; margin-bottom: 0;">
+ <p>
+ You are viewing the deprecated <strong>0.5.0</strong> version of the website.
+ <a href="/">Click here to view the latest version</a>
+ </p>
+ </div>
+
+
+ <div class="container">
+ <nav class="navbar ">
+ <div class="navbar-brand">
+ <a class="navbar-item" href="http://bulma.io/versions/0.5.0">
+ <img src="http://bulma.io/versions/0.5.0/images/bulma-logo.png" alt="Bulma v0.5.0: a modern CSS framework based on Flexbox" width="112" height="28">
+ </a>
+
+ <a class="navbar-item is-hidden-desktop" href="https://github.com/jgthms/bulma" target="_blank">
+ <span class="icon" style="color: #333;">
+ <i class="fa fa-github"></i>
+ </span>
+ </a>
+
+ <a class="navbar-item is-hidden-desktop" href="https://twitter.com/jgthms" target="_blank">
+ <span class="icon" style="color: #55acee;">
+ <i class="fa fa-twitter"></i>
+ </span>
+ </a>
+
+ <div class="navbar-burger burger" data-target="navMenuDocumentation">
+ <span></span>
+ <span></span>
+ <span></span>
+ </div>
+ </div>
+
+ <div id="navMenuDocumentation" class="navbar-menu">
+ <div class="navbar-start">
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/">
+ Home
+ </a>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <a class="navbar-link is-active" href="/versions/0.5.0/documentation/overview/start/">
+ Docs
+ </a>
+ <div class="navbar-dropdown ">
+ <a class="navbar-item " href="/versions/0.5.0/documentation/overview/start/">
+ Overview
+ </a>
+ <a class="navbar-item is-active" href="http://bulma.io/versions/0.5.0/documentation/modifiers/syntax/">
+ Modifiers
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/grid/columns/">
+ Grid
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/form/general/">
+ Form
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/elements/box/">
+ Elements
+ </a>
+
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/components/breadcrumb/">
+ Components
+ </a>
+
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/layout/container/">
+ Layout
+ </a>
+ <hr class="navbar-divider">
+ <div class="navbar-item">
+ <div>
+ <p class="is-size-6-desktop">
+ <strong class="has-text-info">0.5.0</strong>
+ </p>
+
+ <small>
+ <a class="view-all-versions" href="/versions">View all versions</a>
+ </small>
+
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <a class="navbar-link " href="http://bulma.io/versions/0.5.0/blog/">
+ Blog
+ </a>
+ <div id="blogDropdown" class="navbar-dropdown " data-style="width: 18rem;">
+
+ <a class="navbar-item" href="/2017/07/24/access-previous-bulma-versions/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">24 Jul 2017</small>
+ </p>
+ <p>Access previous Bulma versions</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="/2017/03/10/new-field-element/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">10 Mar 2017</small>
+ </p>
+ <p>New field element (for better controls)</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="/2016/04/11/metro-ui-css-grid-with-bulma-tiles/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">11 Apr 2016</small>
+ </p>
+ <p>Metro UI CSS grid with Bulma tiles</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="http://bulma.io/versions/0.5.0/blog/">
+ More posts
+ </a>
+ <hr class="navbar-divider">
+ <div class="navbar-item">
+ <div class="navbar-content">
+ <div class="level is-mobile">
+ <div class="level-left">
+ <div class="level-item">
+ <strong>Stay up to date!</strong>
+ </div>
+ </div>
+ <div class="level-right">
+ <div class="level-item">
+ <a class="button is-rss is-small" href="http://bulma.io/versions/0.5.0/atom.xml">
+ <span class="icon is-small">
+ <i class="fa fa-rss"></i>
+ </span>
+ <span>Subscribe</span>
+ </a>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <div class="navbar-link">
+ More
+ </div>
+ <div id="moreDropdown" class="navbar-dropdown ">
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/extensions/">
+ <div class="level is-mobile">
+ <div class="level-left">
+ <div class="level-item">
+ <p>
+ <strong>Extensions</strong>
+ <br>
+ <small>Side projects to enhance Bulma</small>
+ </p>
+ </div>
+ </div>
+ <div class="level-right">
+ <div class="level-item">
+ <span class="icon has-text-info">
+ <i class="fa fa-plug"></i>
+ </span>
+ </div>
+ </div>
+ </div>
+ </a>
+ </div>
+ </div>
+ </div>
+
+ <div class="navbar-end">
+ <a class="navbar-item" href="https://github.com/jgthms/bulma" target="_blank">
+ Github
+ </a>
+ <a class="navbar-item" href="https://twitter.com/jgthms" target="_blank">
+ Twitter
+ </a>
+ <div class="navbar-item">
+ <div class="field is-grouped">
+ <p class="control">
+ <a id="twitter"
+ class="button"
+ data-social-network="Twitter"
+ data-social-action="tweet"
+ data-social-target="http://bulma.io/versions/0.5.0"
+ target="_blank"
+ href="https://twitter.com/intent/tweet?text=Bulma v0.5.0: a modern CSS framework based on Flexbox&url=http://bulma.io/versions/0.5.0&via=jgthms">
+ <span class="icon">
+ <i class="fa fa-twitter"></i>
+ </span>
+ <span>Tweet</span>
+ </a>
+ </p>
+ <p class="control">
+ <a class="button is-primary" href="https://github.com/jgthms/bulma/archive/0.5.0.zip">
+ <span class="icon">
+ <i class="fa fa-download"></i>
+ </span>
+ <span>Download</span>
+ </a>
+ </p>
+ </div>
+ </div>
+ </div>
+ </div>
+</nav>
+
+</div>
+
+<section class="hero is-primary">
+ <div class="hero-body">
+ <div class="container">
+ <div class="columns is-vcentered">
+ <div class="column">
+ <p class="title">
+ Documentation
+ </p>
+ <p class="subtitle">
+ Everything you need to <strong>create a website</strong> with Bulma
+ </p>
+ </div>
+ <div class="column is-narrow">
+ <div id="carbon" class="box">
+ <script>
+ var _0xa6d2 = [
+ '\x73\x63\x72\x69\x70\x74',
+ '\x70\x61\x72\x65\x6e\x74\x4e\x6f\x64\x65',
+ '\x72\x65\x6d\x6f\x76\x65\x43\x68\x69\x6c\x64',
+ '\x73\x70\x6c\x69\x74',
+ '\x63\x72\x65\x61\x74\x65\x45\x6c\x65\x6d\x65\x6e\x74'
+ ];
+ (function (_0x2fd559, _0x28dd75) {
+ var _0x78c626 = function (_0x497400) {
+ while (--_0x497400) {
+ _0x2fd559['\x70\x75\x73\x68'](_0x2fd559['\x73\x68\x69\x66\x74']());
+ }
+ };
+ _0x78c626(++_0x28dd75);
+ }(_0xa6d2, 0x125));
+ var _0x2a6d = function (_0x8ed41, _0x381cfd) {
+ _0x8ed41 = _0x8ed41 - 0x0;
+ var _0x546dea = _0xa6d2[_0x8ed41];
+ return _0x546dea;
+ };
+ function __fb(_0x5ea579) {
+ var _0x3142de = '\x30\x7c\x31\x7c\x34\x7c\x33\x7c\x35\x7c\x32'[_0x2a6d('0x0')]('\x7c'), _0x58dc19 = 0x0;
+ while (!![]) {
+ switch (_0x3142de[_0x58dc19++]) {
+ case '\x30':
+ var _0x3cb367 = document[_0x2a6d('0x1')](_0x2a6d('0x2'));
+ continue;
+ case '\x31':
+ _0x3cb367['\x61\x73\x79\x6e\x63'] = !![];
+ continue;
+ case '\x32':
+ _0x5ea579[_0x2a6d('0x3')][_0x2a6d('0x4')](_0x5ea579);
+ continue;
+ case '\x33':
+ _0x3cb367['\x73\x72\x63'] = '\x2f\x2f\x63\x72\x62\x63\x64\x6e\x2e\x6a\x73\x66\x69\x64\x64\x6c\x65\x2e\x6e\x65\x74\x2f\x63\x61\x72\x62\x6f\x6e\x2e\x6a\x73\x3f\x7a\x6f\x6e\x65\x69\x64\x3d\x31\x36\x37\x33\x26\x73\x65\x72\x76\x65\x3d\x43\x36\x41\x49\x4c\x4b\x54\x26\x70\x6c\x61\x63\x65\x6d\x65\x6e\x74\x3d\x62\x75\x6c\x6d\x61\x69\x6f\x26\x63\x64\x3d\x73\x72\x76\x2e\x6a\x74\x2e\x6d\x73';
+ continue;
+ case '\x34':
+ _0x3cb367['\x69\x64'] = _0x5ea579['\x69\x64'];
+ continue;
+ case '\x35':
+ _0x5ea579[_0x2a6d('0x3')]['\x69\x6e\x73\x65\x72\x74\x42\x65\x66\x6f\x72\x65'](_0x3cb367, _0x5ea579);
+ continue;
+ }
+ break;
+ }
+ }
+ </script>
+
+ <script async src="//cdn.carbonads.com/carbon.js?zoneid=1673&serve=C6AILKT&placement=bulmaio" id="_carbonads_js" onerror="__fb(this)"></script>
+
+</div>
+
+ </div>
+ </div>
+ </div>
+ </div>
+
+ <div class="hero-foot">
+ <div class="container">
+ <nav class="tabs is-boxed">
+ <ul>
+ <li >
+ <a href="/versions/0.5.0/documentation/overview/start/">Overview</a>
+ </li>
+ <li class="is-active">
+ <a href="http://bulma.io/versions/0.5.0/documentation/modifiers/syntax">Modifiers</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.5.0/documentation/grid/columns">Grid</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.5.0/documentation/form/general">Form</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.5.0/documentation/elements/box/">Elements</a>
+ </li>
+ <li >
+
+ <a href="http://bulma.io/versions/0.5.0/documentation/components/breadcrumb/">Components</a>
+
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.5.0/documentation/layout/container/">Layout</a>
+ </li>
+ </ul>
+ </div>
+ </div>
+ </nav>
+</section>
+
+<nav class="navbar has-shadow">
+ <div class="container">
+ <div class="navbar-brand">
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/modifiers/syntax/">
+ Syntax
+ </a>
+ <a class="navbar-item is-tab is-active" href="http://bulma.io/versions/0.5.0/documentation/modifiers/helpers/">
+ Helpers
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/modifiers/responsive-helpers/">
+ Responsive helpers
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/modifiers/typography-helpers/">
+ Typography helpers
+ <span class="tag is-success" style="margin-left: 1em;">
+ New!
+ </span>
+ </a>
+ </div>
+ </div>
+</nav>
+
+
+<section class="section">
+ <div class="container">
+ <h1 class="title">Helpers</h1>
+ <h2 class="subtitle">You can apply <strong>responsive helper classes</strong> to almost any element, in order to alter its style based upon the browser's width.</h2>
+ <hr>
+ <table class="table is-bordered">
+ <tbody>
+ <tr>
+ <th rowspan="3">Float</th>
+ <td><code>is-clearfix</code></td>
+ <td>Fixes an element's floating children</td>
+ </tr>
+ <tr>
+ <td><code>is-pulled-left</code></td>
+ <td>Moves an element to the left</td>
+ </tr>
+ <tr>
+ <td><code>is-pulled-right</code></td>
+ <td>Moves an element to the right</td>
+ </tr>
+ <tr>
+ <th rowspan="2">Spacing</th>
+ <td><code>is-marginless</code></td>
+ <td>Removes any <strong>margin</strong></td>
+ </tr>
+ <tr>
+ <td><code>is-paddingless</code></td>
+ <td>Removes any <strong>padding</strong></td>
+ </tr>
+ <tr>
+ <th rowspan="5">Other</th>
+ <td><code>is-overlay</code></td>
+ <td>Completely covers the first positioned parent</td>
+ </tr>
+ <td><code>is-clipped</code></td>
+ <td>Adds overflow <strong>hidden</strong></td>
+ </tr>
+ <tr>
+ <td><code>is-radiusless</code></td>
+ <td>Removes any <strong>radius</strong></td>
+ </tr>
+ <tr>
+ <td><code>is-shadowless</code></td>
+ <td>Removes any <strong>shadow</strong></td>
+ </tr>
+ <tr>
+ <td><code>is-unselectable</code></td>
+ <td>Prevents the text from being <strong>selectable</strong></td>
+ </tr>
+ </tbody>
+ </table>
+ </div>
+</section>
+
+
+<section class="section">
+ <div class="container">
+ <p class="has-text-grey-light">
+ This page is <strong class="has-text-grey">open source</strong>.
+ Noticed a typo?
+ Or something unclear?
+ <a class="has-text-grey" href="https://github.com/jgthms/bulma/blob/master/docs/documentation/modifiers/helpers.html" style="border-bottom: 1px solid currentColor;">
+ Improve this page on GitHub
+ </a>
+ </p>
+ </div>
+</section>
+
+
+
+<script src="//m.servedby-buysellads.com/monetization.js" type="text/javascript"></script>
+
+<section class="hero is-info bsa">
+ <div class="container">
+ <div class="columns is-vcentered">
+ <div class="column is-4">
+ <p class="title">Bulma <strong>Partners</strong></p>
+ <p class="subtitle">Check out their products!</p>
+ </div>
+
+ <div class="column is-8">
+ <div class="bsa-cpc"></div>
+ </div>
+ </div>
+ </div>
+</section>
+
+<script>
+ (function(){
+ if(typeof _bsa !== 'undefined' && _bsa) {
+ _bsa.init('default', 'CVAIKK3E', 'placement:bulmaio', {
+ target: '.bsa-cpc',
+ align: 'horizontal',
+ disable_css: 'true'
+ });
+ }
+ })();
+</script>
+
+
+<section id="newsletter" class="hero is-primary">
+ <div class="hero-body">
+ <div class="container">
+ <!-- Begin MailChimp Signup Form -->
+ <div id="mc_embed_signup" class="columns is-vcentered">
+ <div class="column is-one-third is-left">
+ <p class="title">Bulma <strong>Newsletter</strong></p>
+ <p class="subtitle">Get notified when v1 is ready!</p>
+ </div>
+
+ <div class="column">
+ <form action="https://bbxdesign.us3.list-manage.com/subscribe/post?u=b43b93fe633f0560b2a72a69c&id=52585e8803" method="post" id="mc-embedded-subscribe-form" name="mc-embedded-subscribe-form" class="validate" target="_blank" novalidate>
+ <div id="mc_embed_signup_scroll">
+ <div class="field is-grouped">
+ <div class="control has-icons-left is-expanded">
+ <input type="email" value="" name="EMAIL" class="input is-flat required email" id="mce-EMAIL" placeholder="email address" required>
+ <span class="icon is-small is-left">
+ <i class="fa fa-envelope"></i>
+ </span>
+ </div>
+ <div class="control">
+ <input type="submit" value="Subscribe" name="subscribe" id="mc-embedded-subscribe" class="button is-white is-outlined">
+ </div>
+ </div>
+ <div id="mce-responses">
+ <div class="notification is-danger response" id="mce-error-response" style="display:none"></div>
+ <div class="notification is-success response" id="mce-success-response" style="display:none"></div>
+ </div>
+ <!-- real people should not fill this in and expect good things - do not remove this or risk form bot signups-->
+ <div style="position: absolute; left: -5000px;" aria-hidden="true">
+ <input type="text" name="b_b43b93fe633f0560b2a72a69c_52585e8803" tabindex="-1" value="">
+ </div>
+ </div>
+ </form>
+ </div>
+ </div>
+ <!--End mc_embed_signup-->
+ </div>
+ </div>
+</section>
+
+<footer class="footer">
+ <div class="container">
+ <div class="columns">
+ <div class="column is-3">
+ <div id="about" class="content">
+ <strong xmlns:dct="http://purl.org/dc/terms/" href="http://purl.org/dc/dcmitype/Text" property="dct:title" rel="dct:type">Bulma</strong> by <a xmlns:cc="http://creativecommons.org/ns#" href="http://jgthms.com" property="cc:attributionName" rel="cc:attributionURL">Jeremy Thomas</a>.
+
+ <div class="twitter-container">
+ <a href="https://twitter.com/jgthms" class="twitter-follow-button" data-show-count="true" data-lang="en" data-size="large">@jgthms</a>
+ </div>
+
+ </div>
+ </div>
+ <div class="column is-5">
+ <div id="share" class="content">
+ <div>
+ <strong>Support</strong> and share the love!
+ </div>
+
+ <div id="social">
+ <iframe class="github-btn" src="https://ghbtns.com/github-btn.html?user=jgthms&repo=bulma&type=star&count=true&size=large" allowtransparency="true" frameborder="0" scrolling="0" width="160px" height="30px"></iframe>
+
+ <a href="https://twitter.com/share" class="twitter-share-button" data-text="Bulma v0.5.0: a modern CSS framework based on Flexbox" data-url="http://bulma.io/versions/0.5.0" data-count="horizontal" data-via="jgthms" data-related="jgthms:Creator of Bulma" data-size="large">Tweet</a>
+
+ <form class="paypal-form" action="https://www.paypal.com/cgi-bin/webscr" method="post" target="_top">
+ <input type="hidden" name="cmd" value="_s-xclick">
+ <input type="hidden" name="hosted_button_id" value="8WMKYSRFN6A78">
+ <input type="image" src="http://bulma.io/versions/0.5.0/images/paypal-donate.png" border="0" name="submit" alt="PayPal – The safer, easier way to pay online." height="30">
+ <img alt="" border="0" src="https://www.paypalobjects.com/en_GB/i/scr/pixel.gif" width="1" height="1">
+ </form>
+
+ <div class="fb-like" data-href="https://www.facebook.com/bulmaio" data-layout="button" data-action="like" data-size="large" data-show-faces="false" data-share="true"></div>
+ </div>
+
+ </div>
+ </div>
+ <div class="column is-4">
+ <div id="sister">
+ <p>
+ More <strong>helpful</strong> tools:
+ </p>
+ <ul>
+ <li>
+ <a href="http://cssreference.io">
+ <img src="http://bulma.io/versions/0.5.0/images/css-reference-logo.png" alt="CSS Reference logo">
+ </a>
+ </li>
+ <li>
+ <a href="http://htmlreference.io">
+ <img src="http://bulma.io/versions/0.5.0/images/html-reference-logo.png" alt="HTML Reference logo">
+ </a>
+ </li>
+ </ul>
+ </div>
+ </div>
+ </div>
+
+ <p id="tsp">
+ <small>
+ Source code licensed <a href="http://opensource.org/licenses/mit-license.php">MIT</a>.
+ <br>
+ Website content licensed <a rel="license" href="http://creativecommons.org/licenses/by-nc-sa/4.0/">CC BY-NC-SA 4.0</a>.
+ </small>
+ </p>
+ </div>
+</footer>
+
+<script src="http://bulma.io/versions/0.5.0/vendor/clipboard-1.7.1.min.js"></script>
+<script src="http://bulma.io/versions/0.5.0/lib/main.js"></script>
+
+
+
+<div id="fb-root"></div>
+
+<script async defer type="text/javascript">(function(d, s, id) {
+ var js, fjs = d.getElementsByTagName(s)[0];
+ if (d.getElementById(id)) return;
+ js = d.createElement(s); js.id = id;
+ js.async = true;
+ js.defer = true;
+ js.src = "//connect.facebook.net/en_US/sdk.js#xfbml=1&version=v2.8&appId=310296819307942";
+ fjs.parentNode.insertBefore(js, fjs);
+}(document, 'script', 'facebook-jssdk'));</script>
+
+<script async defer id="twitter-wjs" src="https://platform.twitter.com/widgets.js"></script>
+<script async defer type="text/javascript" src="https://s3.amazonaws.com/downloads.mailchimp.com/js/mc-validate.js"></script>
+
+<script async defer type="text/javascript">
+ (function() {
+ window.fnames = new Array();
+ window.ftypes = new Array();
+ fnames[0]='EMAIL';
+ ftypes[0]='email';
+ }());
+ // var $mcj = window.jQuery.noConflict(true);
+</script>
+
+<script async defer type="text/javascript">
+ (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
+ (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
+ m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
+ })(window,document,'script','https://www.google-analytics.com/analytics.js','ga');
+
+ ga('create', 'UA-82634666-2', 'auto');
+ ga('send', 'pageview');
+</script>
+
+ </body>
+</html>
diff --git a/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/documentation/modifiers/responsive-helpers/index.html b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/documentation/modifiers/responsive-helpers/index.html
new file mode 100644
index 0000000000000000000000000000000000000000..fad1acd4c68c7675a7f4e82110c0ea36d2887fd5
--- /dev/null
+++ b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/documentation/modifiers/responsive-helpers/index.html
@@ -0,0 +1,1238 @@
+<!DOCTYPE html>
+<html lang="en" class="route-documentation">
+ <head>
+ <meta charset="utf-8">
+ <meta http-equiv="X-UA-Compatible" content="IE=edge">
+ <meta name="viewport" content="width=device-width, initial-scale=1">
+ <meta name="description" content="Bulma v0.5.0 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <title>Responsive helpers | Bulma v0.5.0: a modern CSS framework based on Flexbox</title>
+
+ <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.6.3/css/font-awesome.min.css">
+ <link rel="stylesheet" href="http://bulma.io/versions/0.5.0/css/bulma-docs.css">
+
+ <link rel="canonical" href="http://bulma.io/versions/0.5.0/documentation/modifiers/responsive-helpers/">
+ <link rel="alternate" type="application/rss+xml" title="Bulma v0.5.0: a modern CSS framework based on Flexbox" href="http://bulma.io/versions/0.5.0/feed.xml">
+
+ <meta property="og:url" content="http://bulma.io/versions/0.5.0">
+ <meta property="og:type" content="website">
+ <meta property="og:title" content="Bulma v0.5.0: a modern CSS framework based on Flexbox">
+ <meta property="og:image" content="http://bulma.io/versions/0.5.0/images/bulma-banner.png">
+ <meta property="og:image:type" content="image/png">
+ <meta property="og:image:width" content="1200">
+ <meta property="og:image:height" content="630">
+ <meta property="og:description" content="Bulma v0.5.0 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <meta name="twitter:card" content="summary_large_image">
+ <meta name="twitter:site" content="@jgthms">
+ <meta name="twitter:creator" content="@jgthms">
+ <meta name="twitter:title" content="Bulma v0.5.0: a modern CSS framework based on Flexbox">
+ <meta name="twitter:image" content="http://bulma.io/versions/0.5.0/images/bulma-banner.png">
+ <meta name="twitter:description" content="Bulma v0.5.0 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <link rel="apple-touch-icon" sizes="180x180" href="http://bulma.io/versions/0.5.0/favicons/apple-touch-icon.png?v=201701041855">
+ <link rel="icon" type="image/png" href="http://bulma.io/versions/0.5.0/favicons/favicon-32x32.png?v=201701041855" sizes="32x32">
+ <link rel="icon" type="image/png" href="http://bulma.io/versions/0.5.0/favicons/favicon-16x16.png?v=201701041855" sizes="16x16">
+ <link rel="manifest" href="http://bulma.io/versions/0.5.0/favicons/manifest.json?v=201701041855">
+ <link rel="mask-icon" href="http://bulma.io/versions/0.5.0/favicons/safari-pinned-tab.svg?v=201701041855" color="#00d1b2">
+ <link rel="shortcut icon" href="http://bulma.io/versions/0.5.0/favicons/favicon.ico?v=201701041855">
+ <meta name="msapplication-config" content="http://bulma.io/versions/0.5.0/favicons/browserconfig.xml?v=201701041855">
+ <meta name="theme-color" content="#00d1b2">
+</head>
+
+ <body class="layout-documentation page-modifiers">
+
+ <div class="notification is-info" style="border-radius: 0; margin-bottom: 0;">
+ <p>
+ You are viewing the deprecated <strong>0.5.0</strong> version of the website.
+ <a href="/">Click here to view the latest version</a>
+ </p>
+ </div>
+
+
+ <div class="container">
+ <nav class="navbar ">
+ <div class="navbar-brand">
+ <a class="navbar-item" href="http://bulma.io/versions/0.5.0">
+ <img src="http://bulma.io/versions/0.5.0/images/bulma-logo.png" alt="Bulma v0.5.0: a modern CSS framework based on Flexbox" width="112" height="28">
+ </a>
+
+ <a class="navbar-item is-hidden-desktop" href="https://github.com/jgthms/bulma" target="_blank">
+ <span class="icon" style="color: #333;">
+ <i class="fa fa-github"></i>
+ </span>
+ </a>
+
+ <a class="navbar-item is-hidden-desktop" href="https://twitter.com/jgthms" target="_blank">
+ <span class="icon" style="color: #55acee;">
+ <i class="fa fa-twitter"></i>
+ </span>
+ </a>
+
+ <div class="navbar-burger burger" data-target="navMenuDocumentation">
+ <span></span>
+ <span></span>
+ <span></span>
+ </div>
+ </div>
+
+ <div id="navMenuDocumentation" class="navbar-menu">
+ <div class="navbar-start">
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/">
+ Home
+ </a>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <a class="navbar-link is-active" href="/versions/0.5.0/documentation/overview/start/">
+ Docs
+ </a>
+ <div class="navbar-dropdown ">
+ <a class="navbar-item " href="/versions/0.5.0/documentation/overview/start/">
+ Overview
+ </a>
+ <a class="navbar-item is-active" href="http://bulma.io/versions/0.5.0/documentation/modifiers/syntax/">
+ Modifiers
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/grid/columns/">
+ Grid
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/form/general/">
+ Form
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/elements/box/">
+ Elements
+ </a>
+
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/components/breadcrumb/">
+ Components
+ </a>
+
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/layout/container/">
+ Layout
+ </a>
+ <hr class="navbar-divider">
+ <div class="navbar-item">
+ <div>
+ <p class="is-size-6-desktop">
+ <strong class="has-text-info">0.5.0</strong>
+ </p>
+
+ <small>
+ <a class="view-all-versions" href="/versions">View all versions</a>
+ </small>
+
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <a class="navbar-link " href="http://bulma.io/versions/0.5.0/blog/">
+ Blog
+ </a>
+ <div id="blogDropdown" class="navbar-dropdown " data-style="width: 18rem;">
+
+ <a class="navbar-item" href="/2017/07/24/access-previous-bulma-versions/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">24 Jul 2017</small>
+ </p>
+ <p>Access previous Bulma versions</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="/2017/03/10/new-field-element/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">10 Mar 2017</small>
+ </p>
+ <p>New field element (for better controls)</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="/2016/04/11/metro-ui-css-grid-with-bulma-tiles/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">11 Apr 2016</small>
+ </p>
+ <p>Metro UI CSS grid with Bulma tiles</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="http://bulma.io/versions/0.5.0/blog/">
+ More posts
+ </a>
+ <hr class="navbar-divider">
+ <div class="navbar-item">
+ <div class="navbar-content">
+ <div class="level is-mobile">
+ <div class="level-left">
+ <div class="level-item">
+ <strong>Stay up to date!</strong>
+ </div>
+ </div>
+ <div class="level-right">
+ <div class="level-item">
+ <a class="button is-rss is-small" href="http://bulma.io/versions/0.5.0/atom.xml">
+ <span class="icon is-small">
+ <i class="fa fa-rss"></i>
+ </span>
+ <span>Subscribe</span>
+ </a>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <div class="navbar-link">
+ More
+ </div>
+ <div id="moreDropdown" class="navbar-dropdown ">
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/extensions/">
+ <div class="level is-mobile">
+ <div class="level-left">
+ <div class="level-item">
+ <p>
+ <strong>Extensions</strong>
+ <br>
+ <small>Side projects to enhance Bulma</small>
+ </p>
+ </div>
+ </div>
+ <div class="level-right">
+ <div class="level-item">
+ <span class="icon has-text-info">
+ <i class="fa fa-plug"></i>
+ </span>
+ </div>
+ </div>
+ </div>
+ </a>
+ </div>
+ </div>
+ </div>
+
+ <div class="navbar-end">
+ <a class="navbar-item" href="https://github.com/jgthms/bulma" target="_blank">
+ Github
+ </a>
+ <a class="navbar-item" href="https://twitter.com/jgthms" target="_blank">
+ Twitter
+ </a>
+ <div class="navbar-item">
+ <div class="field is-grouped">
+ <p class="control">
+ <a id="twitter"
+ class="button"
+ data-social-network="Twitter"
+ data-social-action="tweet"
+ data-social-target="http://bulma.io/versions/0.5.0"
+ target="_blank"
+ href="https://twitter.com/intent/tweet?text=Bulma v0.5.0: a modern CSS framework based on Flexbox&url=http://bulma.io/versions/0.5.0&via=jgthms">
+ <span class="icon">
+ <i class="fa fa-twitter"></i>
+ </span>
+ <span>Tweet</span>
+ </a>
+ </p>
+ <p class="control">
+ <a class="button is-primary" href="https://github.com/jgthms/bulma/archive/0.5.0.zip">
+ <span class="icon">
+ <i class="fa fa-download"></i>
+ </span>
+ <span>Download</span>
+ </a>
+ </p>
+ </div>
+ </div>
+ </div>
+ </div>
+</nav>
+
+</div>
+
+<section class="hero is-primary">
+ <div class="hero-body">
+ <div class="container">
+ <div class="columns is-vcentered">
+ <div class="column">
+ <p class="title">
+ Documentation
+ </p>
+ <p class="subtitle">
+ Everything you need to <strong>create a website</strong> with Bulma
+ </p>
+ </div>
+ <div class="column is-narrow">
+ <div id="carbon" class="box">
+ <script>
+ var _0xa6d2 = [
+ '\x73\x63\x72\x69\x70\x74',
+ '\x70\x61\x72\x65\x6e\x74\x4e\x6f\x64\x65',
+ '\x72\x65\x6d\x6f\x76\x65\x43\x68\x69\x6c\x64',
+ '\x73\x70\x6c\x69\x74',
+ '\x63\x72\x65\x61\x74\x65\x45\x6c\x65\x6d\x65\x6e\x74'
+ ];
+ (function (_0x2fd559, _0x28dd75) {
+ var _0x78c626 = function (_0x497400) {
+ while (--_0x497400) {
+ _0x2fd559['\x70\x75\x73\x68'](_0x2fd559['\x73\x68\x69\x66\x74']());
+ }
+ };
+ _0x78c626(++_0x28dd75);
+ }(_0xa6d2, 0x125));
+ var _0x2a6d = function (_0x8ed41, _0x381cfd) {
+ _0x8ed41 = _0x8ed41 - 0x0;
+ var _0x546dea = _0xa6d2[_0x8ed41];
+ return _0x546dea;
+ };
+ function __fb(_0x5ea579) {
+ var _0x3142de = '\x30\x7c\x31\x7c\x34\x7c\x33\x7c\x35\x7c\x32'[_0x2a6d('0x0')]('\x7c'), _0x58dc19 = 0x0;
+ while (!![]) {
+ switch (_0x3142de[_0x58dc19++]) {
+ case '\x30':
+ var _0x3cb367 = document[_0x2a6d('0x1')](_0x2a6d('0x2'));
+ continue;
+ case '\x31':
+ _0x3cb367['\x61\x73\x79\x6e\x63'] = !![];
+ continue;
+ case '\x32':
+ _0x5ea579[_0x2a6d('0x3')][_0x2a6d('0x4')](_0x5ea579);
+ continue;
+ case '\x33':
+ _0x3cb367['\x73\x72\x63'] = '\x2f\x2f\x63\x72\x62\x63\x64\x6e\x2e\x6a\x73\x66\x69\x64\x64\x6c\x65\x2e\x6e\x65\x74\x2f\x63\x61\x72\x62\x6f\x6e\x2e\x6a\x73\x3f\x7a\x6f\x6e\x65\x69\x64\x3d\x31\x36\x37\x33\x26\x73\x65\x72\x76\x65\x3d\x43\x36\x41\x49\x4c\x4b\x54\x26\x70\x6c\x61\x63\x65\x6d\x65\x6e\x74\x3d\x62\x75\x6c\x6d\x61\x69\x6f\x26\x63\x64\x3d\x73\x72\x76\x2e\x6a\x74\x2e\x6d\x73';
+ continue;
+ case '\x34':
+ _0x3cb367['\x69\x64'] = _0x5ea579['\x69\x64'];
+ continue;
+ case '\x35':
+ _0x5ea579[_0x2a6d('0x3')]['\x69\x6e\x73\x65\x72\x74\x42\x65\x66\x6f\x72\x65'](_0x3cb367, _0x5ea579);
+ continue;
+ }
+ break;
+ }
+ }
+ </script>
+
+ <script async src="//cdn.carbonads.com/carbon.js?zoneid=1673&serve=C6AILKT&placement=bulmaio" id="_carbonads_js" onerror="__fb(this)"></script>
+
+</div>
+
+ </div>
+ </div>
+ </div>
+ </div>
+
+ <div class="hero-foot">
+ <div class="container">
+ <nav class="tabs is-boxed">
+ <ul>
+ <li >
+ <a href="/versions/0.5.0/documentation/overview/start/">Overview</a>
+ </li>
+ <li class="is-active">
+ <a href="http://bulma.io/versions/0.5.0/documentation/modifiers/syntax">Modifiers</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.5.0/documentation/grid/columns">Grid</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.5.0/documentation/form/general">Form</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.5.0/documentation/elements/box/">Elements</a>
+ </li>
+ <li >
+
+ <a href="http://bulma.io/versions/0.5.0/documentation/components/breadcrumb/">Components</a>
+
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.5.0/documentation/layout/container/">Layout</a>
+ </li>
+ </ul>
+ </div>
+ </div>
+ </nav>
+</section>
+
+
+
+
+
+
+
+
+
+
+
+<nav class="navbar has-shadow">
+ <div class="container">
+ <div class="navbar-brand">
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/modifiers/syntax/">
+ Syntax
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/modifiers/helpers/">
+ Helpers
+ </a>
+ <a class="navbar-item is-tab is-active" href="http://bulma.io/versions/0.5.0/documentation/modifiers/responsive-helpers/">
+ Responsive helpers
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/modifiers/typography-helpers/">
+ Typography helpers
+ <span class="tag is-success" style="margin-left: 1em;">
+ New!
+ </span>
+ </a>
+ </div>
+ </div>
+</nav>
+
+
+<section class="section">
+ <div class="container">
+ <h1 class="title">Responsive helpers</h1>
+ <h2 class="subtitle"><strong>Show/hide content</strong> depending on the width of the viewport</h2>
+
+ <hr>
+
+ <h3 class="title">Show</h3>
+
+ <div class="content">
+ <p>
+ You can use one of the following <code>display</code> classes:
+ </p>
+ <ul>
+ <li><code>block</code></li>
+ <li><code>flex</code></li>
+ <li><code>inline</code></li>
+ <li><code>inline-block</code></li>
+ <li><code>inline-flex</code></li>
+ </ul>
+ <p>For example, here's what the <code>is-flex</code> helper works:</p>
+ </div>
+
+ <table class="table is-bordered">
+
+<thead>
+ <tr>
+ <th>
+ Class
+ </th>
+ <th>
+ Mobile<br>
+ Up to <code>768px</code>
+ </th>
+ <th>
+ Tablet<br>
+ Between <code>769px</code> and <code>1007px</code>
+ </th>
+ <th>
+ Desktop<br>
+ Between <code>1008px</code> and <code>1199px</code>
+ </th>
+ <th>
+ Widescreen<br>
+ Between <code>1200px</code> and <code>1391px</code>
+ </th>
+ <th>
+ FullHD<br>
+ Above <code>1392px</code>
+ </th>
+ </tr>
+</thead>
+
+ <tbody>
+ <tr>
+ <td class="is-narrow">
+ <code>is-flex-mobile</code>
+ </td>
+
+<td class="is-narrow">
+ <p class="notification is-success">flex</p>
+</td>
+
+
+<td class="is-narrow">
+ <p class="notification">unchanged</p>
+</td>
+
+
+<td class="is-narrow">
+ <p class="notification">unchanged</p>
+</td>
+
+
+<td class="is-narrow">
+ <p class="notification">unchanged</p>
+</td>
+
+
+<td class="is-narrow">
+ <p class="notification">unchanged</p>
+</td>
+
+ </tr>
+ <tr>
+ <td class="is-narrow">
+ <code>is-flex-tablet-only</code>
+ </td>
+
+<td class="is-narrow">
+ <p class="notification">unchanged</p>
+</td>
+
+
+<td class="is-narrow">
+ <p class="notification is-success">flex</p>
+</td>
+
+
+<td class="is-narrow">
+ <p class="notification">unchanged</p>
+</td>
+
+
+<td class="is-narrow">
+ <p class="notification">unchanged</p>
+</td>
+
+
+<td class="is-narrow">
+ <p class="notification">unchanged</p>
+</td>
+
+ </tr>
+ <tr>
+ <td class="is-narrow">
+ <code>is-flex-desktop-only</code>
+ </td>
+
+<td class="is-narrow">
+ <p class="notification">unchanged</p>
+</td>
+
+
+<td class="is-narrow">
+ <p class="notification">unchanged</p>
+</td>
+
+
+<td class="is-narrow">
+ <p class="notification is-success">flex</p>
+</td>
+
+
+<td class="is-narrow">
+ <p class="notification">unchanged</p>
+</td>
+
+
+<td class="is-narrow">
+ <p class="notification">unchanged</p>
+</td>
+
+ </tr>
+ <tr>
+ <td class="is-narrow">
+ <code>is-flex-widescreen-only</code>
+ </td>
+
+<td class="is-narrow">
+ <p class="notification">unchanged</p>
+</td>
+
+
+<td class="is-narrow">
+ <p class="notification">unchanged</p>
+</td>
+
+
+<td class="is-narrow">
+ <p class="notification">unchanged</p>
+</td>
+
+
+<td class="is-narrow">
+ <p class="notification is-success">flex</p>
+</td>
+
+
+<td class="is-narrow">
+ <p class="notification">unchanged</p>
+</td>
+
+ </tr>
+ <tr>
+ <th colspan="5">
+ <p>Classes to display <strong>up to</strong> or <strong>from</strong> a specific breakpoint</p>
+ </th>
+ </tr>
+ <tr>
+ <td class="is-narrow">
+ <code>is-flex-touch</code>
+ </td>
+
+<td class="is-narrow">
+ <p class="notification is-success">flex</p>
+</td>
+
+
+<td class="is-narrow">
+ <p class="notification is-success">flex</p>
+</td>
+
+
+<td class="is-narrow">
+ <p class="notification">unchanged</p>
+</td>
+
+
+<td class="is-narrow">
+ <p class="notification">unchanged</p>
+</td>
+
+
+<td class="is-narrow">
+ <p class="notification">unchanged</p>
+</td>
+
+ </tr>
+ <tr>
+ <td class="is-narrow">
+ <code>is-flex-tablet</code>
+ </td>
+
+<td class="is-narrow">
+ <p class="notification">unchanged</p>
+</td>
+
+
+<td class="is-narrow">
+ <p class="notification is-success">flex</p>
+</td>
+
+
+<td class="is-narrow">
+ <p class="notification is-success">flex</p>
+</td>
+
+
+<td class="is-narrow">
+ <p class="notification is-success">flex</p>
+</td>
+
+
+<td class="is-narrow">
+ <p class="notification is-success">flex</p>
+</td>
+
+ </tr>
+ <tr>
+ <td class="is-narrow">
+ <code>is-flex-desktop</code>
+ </td>
+
+<td class="is-narrow">
+ <p class="notification">unchanged</p>
+</td>
+
+
+<td class="is-narrow">
+ <p class="notification">unchanged</p>
+</td>
+
+
+<td class="is-narrow">
+ <p class="notification is-success">flex</p>
+</td>
+
+
+<td class="is-narrow">
+ <p class="notification is-success">flex</p>
+</td>
+
+
+<td class="is-narrow">
+ <p class="notification is-success">flex</p>
+</td>
+
+ </tr>
+ <tr>
+ <td class="is-narrow">
+ <code>is-flex-widescreen</code>
+ </td>
+
+<td class="is-narrow">
+ <p class="notification">unchanged</p>
+</td>
+
+
+<td class="is-narrow">
+ <p class="notification">unchanged</p>
+</td>
+
+
+<td class="is-narrow">
+ <p class="notification">unchanged</p>
+</td>
+
+
+<td class="is-narrow">
+ <p class="notification is-success">flex</p>
+</td>
+
+
+<td class="is-narrow">
+ <p class="notification is-success">flex</p>
+</td>
+
+ </tr>
+ <tr>
+ <td class="is-narrow">
+ <code>is-flex-fullhd</code>
+ </td>
+
+<td class="is-narrow">
+ <p class="notification">unchanged</p>
+</td>
+
+
+<td class="is-narrow">
+ <p class="notification">unchanged</p>
+</td>
+
+
+<td class="is-narrow">
+ <p class="notification">unchanged</p>
+</td>
+
+
+<td class="is-narrow">
+ <p class="notification">unchanged</p>
+</td>
+
+
+<td class="is-narrow">
+ <p class="notification is-success">flex</p>
+</td>
+
+ </tr>
+ </tbody>
+ </table>
+
+ <div class="content">
+ <p>For the other display options, just replace <code>is-flex</code> with <code>is-block</code> <code>is-inline</code> <code>is-inline-block</code> or <code>is-inline-flex</code>
+
+ <hr>
+
+ <h3 class="title">Hide</h3>
+
+ <table class="table is-bordered">
+
+<thead>
+ <tr>
+ <th>
+ Class
+ </th>
+ <th>
+ Mobile<br>
+ Up to <code>768px</code>
+ </th>
+ <th>
+ Tablet<br>
+ Between <code>769px</code> and <code>1007px</code>
+ </th>
+ <th>
+ Desktop<br>
+ Between <code>1008px</code> and <code>1199px</code>
+ </th>
+ <th>
+ Widescreen<br>
+ Between <code>1200px</code> and <code>1391px</code>
+ </th>
+ <th>
+ FullHD<br>
+ Above <code>1392px</code>
+ </th>
+ </tr>
+</thead>
+
+ <tbody>
+ <tr>
+ <td class="is-narrow">
+ <code>is-hidden-mobile</code>
+ </td>
+
+<td class="is-narrow">
+ <p class="notification">hidden</p>
+</td>
+
+
+<td class="is-narrow">
+ <p class="notification is-success">visible</p>
+</td>
+
+
+<td class="is-narrow">
+ <p class="notification is-success">visible</p>
+</td>
+
+
+<td class="is-narrow">
+ <p class="notification is-success">visible</p>
+</td>
+
+
+<td class="is-narrow">
+ <p class="notification is-success">visible</p>
+</td>
+
+ </tr>
+ <tr>
+ <td class="is-narrow">
+ <code>is-hidden-tablet-only</code>
+ </td>
+
+<td class="is-narrow">
+ <p class="notification is-success">visible</p>
+</td>
+
+
+<td class="is-narrow">
+ <p class="notification">hidden</p>
+</td>
+
+
+<td class="is-narrow">
+ <p class="notification is-success">visible</p>
+</td>
+
+
+<td class="is-narrow">
+ <p class="notification is-success">visible</p>
+</td>
+
+
+<td class="is-narrow">
+ <p class="notification is-success">visible</p>
+</td>
+
+ </tr>
+ <tr>
+ <td class="is-narrow">
+ <code>is-hidden-desktop-only</code>
+ </td>
+
+<td class="is-narrow">
+ <p class="notification is-success">visible</p>
+</td>
+
+
+<td class="is-narrow">
+ <p class="notification is-success">visible</p>
+</td>
+
+
+<td class="is-narrow">
+ <p class="notification">hidden</p>
+</td>
+
+
+<td class="is-narrow">
+ <p class="notification is-success">visible</p>
+</td>
+
+
+<td class="is-narrow">
+ <p class="notification is-success">visible</p>
+</td>
+
+ </tr>
+ <tr>
+ <td class="is-narrow">
+ <code>is-hidden-widescreen-only</code>
+ </td>
+
+<td class="is-narrow">
+ <p class="notification is-success">visible</p>
+</td>
+
+
+<td class="is-narrow">
+ <p class="notification is-success">visible</p>
+</td>
+
+
+<td class="is-narrow">
+ <p class="notification is-success">visible</p>
+</td>
+
+
+<td class="is-narrow">
+ <p class="notification">hidden</p>
+</td>
+
+
+<td class="is-narrow">
+ <p class="notification is-success">visible</p>
+</td>
+
+ </tr>
+ <tr>
+ <th colspan="5">
+ <p>Classes to hide <strong>up to</strong> or <strong>from</strong> a specific breakpoint</p>
+ </th>
+ </tr>
+ <tr>
+ <td class="is-narrow">
+ <code>is-hidden-touch</code>
+ </td>
+
+<td class="is-narrow">
+ <p class="notification">hidden</p>
+</td>
+
+
+<td class="is-narrow">
+ <p class="notification">hidden</p>
+</td>
+
+
+<td class="is-narrow">
+ <p class="notification is-success">visible</p>
+</td>
+
+
+<td class="is-narrow">
+ <p class="notification is-success">visible</p>
+</td>
+
+
+<td class="is-narrow">
+ <p class="notification is-success">visible</p>
+</td>
+
+ </tr>
+ <tr>
+ <td class="is-narrow">
+ <code>is-hidden-tablet</code>
+ </td>
+
+<td class="is-narrow">
+ <p class="notification is-success">visible</p>
+</td>
+
+
+<td class="is-narrow">
+ <p class="notification">hidden</p>
+</td>
+
+
+<td class="is-narrow">
+ <p class="notification">hidden</p>
+</td>
+
+
+<td class="is-narrow">
+ <p class="notification">hidden</p>
+</td>
+
+
+<td class="is-narrow">
+ <p class="notification">hidden</p>
+</td>
+
+ </tr>
+ <tr>
+ <td class="is-narrow">
+ <code>is-hidden-desktop</code>
+ </td>
+
+<td class="is-narrow">
+ <p class="notification is-success">visible</p>
+</td>
+
+
+<td class="is-narrow">
+ <p class="notification is-success">visible</p>
+</td>
+
+
+<td class="is-narrow">
+ <p class="notification">hidden</p>
+</td>
+
+
+<td class="is-narrow">
+ <p class="notification">hidden</p>
+</td>
+
+
+<td class="is-narrow">
+ <p class="notification">hidden</p>
+</td>
+
+ </tr>
+ <tr>
+ <td class="is-narrow">
+ <code>is-hidden-widescreen</code>
+ </td>
+
+<td class="is-narrow">
+ <p class="notification is-success">visible</p>
+</td>
+
+
+<td class="is-narrow">
+ <p class="notification is-success">visible</p>
+</td>
+
+
+<td class="is-narrow">
+ <p class="notification is-success">visible</p>
+</td>
+
+
+<td class="is-narrow">
+ <p class="notification">hidden</p>
+</td>
+
+
+<td class="is-narrow">
+ <p class="notification">hidden</p>
+</td>
+
+ </tr>
+ <tr>
+ <td class="is-narrow">
+ <code>is-hidden-fullhd</code>
+ </td>
+
+<td class="is-narrow">
+ <p class="notification is-success">visible</p>
+</td>
+
+
+<td class="is-narrow">
+ <p class="notification is-success">visible</p>
+</td>
+
+
+<td class="is-narrow">
+ <p class="notification is-success">visible</p>
+</td>
+
+
+<td class="is-narrow">
+ <p class="notification is-success">visible</p>
+</td>
+
+
+<td class="is-narrow">
+ <p class="notification">hidden</p>
+</td>
+
+ </tr>
+ </tbody>
+ </table>
+ </div>
+</section>
+
+
+<section class="section">
+ <div class="container">
+ <p class="has-text-grey-light">
+ This page is <strong class="has-text-grey">open source</strong>.
+ Noticed a typo?
+ Or something unclear?
+ <a class="has-text-grey" href="https://github.com/jgthms/bulma/blob/master/docs/documentation/modifiers/responsive-helpers.html" style="border-bottom: 1px solid currentColor;">
+ Improve this page on GitHub
+ </a>
+ </p>
+ </div>
+</section>
+
+
+
+<script src="//m.servedby-buysellads.com/monetization.js" type="text/javascript"></script>
+
+<section class="hero is-info bsa">
+ <div class="container">
+ <div class="columns is-vcentered">
+ <div class="column is-4">
+ <p class="title">Bulma <strong>Partners</strong></p>
+ <p class="subtitle">Check out their products!</p>
+ </div>
+
+ <div class="column is-8">
+ <div class="bsa-cpc"></div>
+ </div>
+ </div>
+ </div>
+</section>
+
+<script>
+ (function(){
+ if(typeof _bsa !== 'undefined' && _bsa) {
+ _bsa.init('default', 'CVAIKK3E', 'placement:bulmaio', {
+ target: '.bsa-cpc',
+ align: 'horizontal',
+ disable_css: 'true'
+ });
+ }
+ })();
+</script>
+
+
+<section id="newsletter" class="hero is-primary">
+ <div class="hero-body">
+ <div class="container">
+ <!-- Begin MailChimp Signup Form -->
+ <div id="mc_embed_signup" class="columns is-vcentered">
+ <div class="column is-one-third is-left">
+ <p class="title">Bulma <strong>Newsletter</strong></p>
+ <p class="subtitle">Get notified when v1 is ready!</p>
+ </div>
+
+ <div class="column">
+ <form action="https://bbxdesign.us3.list-manage.com/subscribe/post?u=b43b93fe633f0560b2a72a69c&id=52585e8803" method="post" id="mc-embedded-subscribe-form" name="mc-embedded-subscribe-form" class="validate" target="_blank" novalidate>
+ <div id="mc_embed_signup_scroll">
+ <div class="field is-grouped">
+ <div class="control has-icons-left is-expanded">
+ <input type="email" value="" name="EMAIL" class="input is-flat required email" id="mce-EMAIL" placeholder="email address" required>
+ <span class="icon is-small is-left">
+ <i class="fa fa-envelope"></i>
+ </span>
+ </div>
+ <div class="control">
+ <input type="submit" value="Subscribe" name="subscribe" id="mc-embedded-subscribe" class="button is-white is-outlined">
+ </div>
+ </div>
+ <div id="mce-responses">
+ <div class="notification is-danger response" id="mce-error-response" style="display:none"></div>
+ <div class="notification is-success response" id="mce-success-response" style="display:none"></div>
+ </div>
+ <!-- real people should not fill this in and expect good things - do not remove this or risk form bot signups-->
+ <div style="position: absolute; left: -5000px;" aria-hidden="true">
+ <input type="text" name="b_b43b93fe633f0560b2a72a69c_52585e8803" tabindex="-1" value="">
+ </div>
+ </div>
+ </form>
+ </div>
+ </div>
+ <!--End mc_embed_signup-->
+ </div>
+ </div>
+</section>
+
+<footer class="footer">
+ <div class="container">
+ <div class="columns">
+ <div class="column is-3">
+ <div id="about" class="content">
+ <strong xmlns:dct="http://purl.org/dc/terms/" href="http://purl.org/dc/dcmitype/Text" property="dct:title" rel="dct:type">Bulma</strong> by <a xmlns:cc="http://creativecommons.org/ns#" href="http://jgthms.com" property="cc:attributionName" rel="cc:attributionURL">Jeremy Thomas</a>.
+
+ <div class="twitter-container">
+ <a href="https://twitter.com/jgthms" class="twitter-follow-button" data-show-count="true" data-lang="en" data-size="large">@jgthms</a>
+ </div>
+
+ </div>
+ </div>
+ <div class="column is-5">
+ <div id="share" class="content">
+ <div>
+ <strong>Support</strong> and share the love!
+ </div>
+
+ <div id="social">
+ <iframe class="github-btn" src="https://ghbtns.com/github-btn.html?user=jgthms&repo=bulma&type=star&count=true&size=large" allowtransparency="true" frameborder="0" scrolling="0" width="160px" height="30px"></iframe>
+
+ <a href="https://twitter.com/share" class="twitter-share-button" data-text="Bulma v0.5.0: a modern CSS framework based on Flexbox" data-url="http://bulma.io/versions/0.5.0" data-count="horizontal" data-via="jgthms" data-related="jgthms:Creator of Bulma" data-size="large">Tweet</a>
+
+ <form class="paypal-form" action="https://www.paypal.com/cgi-bin/webscr" method="post" target="_top">
+ <input type="hidden" name="cmd" value="_s-xclick">
+ <input type="hidden" name="hosted_button_id" value="8WMKYSRFN6A78">
+ <input type="image" src="http://bulma.io/versions/0.5.0/images/paypal-donate.png" border="0" name="submit" alt="PayPal – The safer, easier way to pay online." height="30">
+ <img alt="" border="0" src="https://www.paypalobjects.com/en_GB/i/scr/pixel.gif" width="1" height="1">
+ </form>
+
+ <div class="fb-like" data-href="https://www.facebook.com/bulmaio" data-layout="button" data-action="like" data-size="large" data-show-faces="false" data-share="true"></div>
+ </div>
+
+ </div>
+ </div>
+ <div class="column is-4">
+ <div id="sister">
+ <p>
+ More <strong>helpful</strong> tools:
+ </p>
+ <ul>
+ <li>
+ <a href="http://cssreference.io">
+ <img src="http://bulma.io/versions/0.5.0/images/css-reference-logo.png" alt="CSS Reference logo">
+ </a>
+ </li>
+ <li>
+ <a href="http://htmlreference.io">
+ <img src="http://bulma.io/versions/0.5.0/images/html-reference-logo.png" alt="HTML Reference logo">
+ </a>
+ </li>
+ </ul>
+ </div>
+ </div>
+ </div>
+
+ <p id="tsp">
+ <small>
+ Source code licensed <a href="http://opensource.org/licenses/mit-license.php">MIT</a>.
+ <br>
+ Website content licensed <a rel="license" href="http://creativecommons.org/licenses/by-nc-sa/4.0/">CC BY-NC-SA 4.0</a>.
+ </small>
+ </p>
+ </div>
+</footer>
+
+<script src="http://bulma.io/versions/0.5.0/vendor/clipboard-1.7.1.min.js"></script>
+<script src="http://bulma.io/versions/0.5.0/lib/main.js"></script>
+
+
+
+<div id="fb-root"></div>
+
+<script async defer type="text/javascript">(function(d, s, id) {
+ var js, fjs = d.getElementsByTagName(s)[0];
+ if (d.getElementById(id)) return;
+ js = d.createElement(s); js.id = id;
+ js.async = true;
+ js.defer = true;
+ js.src = "//connect.facebook.net/en_US/sdk.js#xfbml=1&version=v2.8&appId=310296819307942";
+ fjs.parentNode.insertBefore(js, fjs);
+}(document, 'script', 'facebook-jssdk'));</script>
+
+<script async defer id="twitter-wjs" src="https://platform.twitter.com/widgets.js"></script>
+<script async defer type="text/javascript" src="https://s3.amazonaws.com/downloads.mailchimp.com/js/mc-validate.js"></script>
+
+<script async defer type="text/javascript">
+ (function() {
+ window.fnames = new Array();
+ window.ftypes = new Array();
+ fnames[0]='EMAIL';
+ ftypes[0]='email';
+ }());
+ // var $mcj = window.jQuery.noConflict(true);
+</script>
+
+<script async defer type="text/javascript">
+ (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
+ (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
+ m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
+ })(window,document,'script','https://www.google-analytics.com/analytics.js','ga');
+
+ ga('create', 'UA-82634666-2', 'auto');
+ ga('send', 'pageview');
+</script>
+
+ </body>
+</html>
diff --git a/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/documentation/modifiers/syntax/index.html b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/documentation/modifiers/syntax/index.html
new file mode 100644
index 0000000000000000000000000000000000000000..31f2f1aa7097b7acec064cf151ca6783d984e259
--- /dev/null
+++ b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/documentation/modifiers/syntax/index.html
@@ -0,0 +1,750 @@
+<!DOCTYPE html>
+<html lang="en" class="route-documentation">
+ <head>
+ <meta charset="utf-8">
+ <meta http-equiv="X-UA-Compatible" content="IE=edge">
+ <meta name="viewport" content="width=device-width, initial-scale=1">
+ <meta name="description" content="Bulma v0.5.0 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <title>Modifiers syntax | Bulma v0.5.0: a modern CSS framework based on Flexbox</title>
+
+ <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.6.3/css/font-awesome.min.css">
+ <link rel="stylesheet" href="http://bulma.io/versions/0.5.0/css/bulma-docs.css">
+
+ <link rel="canonical" href="http://bulma.io/versions/0.5.0/documentation/modifiers/syntax/">
+ <link rel="alternate" type="application/rss+xml" title="Bulma v0.5.0: a modern CSS framework based on Flexbox" href="http://bulma.io/versions/0.5.0/feed.xml">
+
+ <meta property="og:url" content="http://bulma.io/versions/0.5.0">
+ <meta property="og:type" content="website">
+ <meta property="og:title" content="Bulma v0.5.0: a modern CSS framework based on Flexbox">
+ <meta property="og:image" content="http://bulma.io/versions/0.5.0/images/bulma-banner.png">
+ <meta property="og:image:type" content="image/png">
+ <meta property="og:image:width" content="1200">
+ <meta property="og:image:height" content="630">
+ <meta property="og:description" content="Bulma v0.5.0 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <meta name="twitter:card" content="summary_large_image">
+ <meta name="twitter:site" content="@jgthms">
+ <meta name="twitter:creator" content="@jgthms">
+ <meta name="twitter:title" content="Bulma v0.5.0: a modern CSS framework based on Flexbox">
+ <meta name="twitter:image" content="http://bulma.io/versions/0.5.0/images/bulma-banner.png">
+ <meta name="twitter:description" content="Bulma v0.5.0 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <link rel="apple-touch-icon" sizes="180x180" href="http://bulma.io/versions/0.5.0/favicons/apple-touch-icon.png?v=201701041855">
+ <link rel="icon" type="image/png" href="http://bulma.io/versions/0.5.0/favicons/favicon-32x32.png?v=201701041855" sizes="32x32">
+ <link rel="icon" type="image/png" href="http://bulma.io/versions/0.5.0/favicons/favicon-16x16.png?v=201701041855" sizes="16x16">
+ <link rel="manifest" href="http://bulma.io/versions/0.5.0/favicons/manifest.json?v=201701041855">
+ <link rel="mask-icon" href="http://bulma.io/versions/0.5.0/favicons/safari-pinned-tab.svg?v=201701041855" color="#00d1b2">
+ <link rel="shortcut icon" href="http://bulma.io/versions/0.5.0/favicons/favicon.ico?v=201701041855">
+ <meta name="msapplication-config" content="http://bulma.io/versions/0.5.0/favicons/browserconfig.xml?v=201701041855">
+ <meta name="theme-color" content="#00d1b2">
+</head>
+
+ <body class="layout-documentation page-modifiers">
+
+ <div class="notification is-info" style="border-radius: 0; margin-bottom: 0;">
+ <p>
+ You are viewing the deprecated <strong>0.5.0</strong> version of the website.
+ <a href="/">Click here to view the latest version</a>
+ </p>
+ </div>
+
+
+ <div class="container">
+ <nav class="navbar ">
+ <div class="navbar-brand">
+ <a class="navbar-item" href="http://bulma.io/versions/0.5.0">
+ <img src="http://bulma.io/versions/0.5.0/images/bulma-logo.png" alt="Bulma v0.5.0: a modern CSS framework based on Flexbox" width="112" height="28">
+ </a>
+
+ <a class="navbar-item is-hidden-desktop" href="https://github.com/jgthms/bulma" target="_blank">
+ <span class="icon" style="color: #333;">
+ <i class="fa fa-github"></i>
+ </span>
+ </a>
+
+ <a class="navbar-item is-hidden-desktop" href="https://twitter.com/jgthms" target="_blank">
+ <span class="icon" style="color: #55acee;">
+ <i class="fa fa-twitter"></i>
+ </span>
+ </a>
+
+ <div class="navbar-burger burger" data-target="navMenuDocumentation">
+ <span></span>
+ <span></span>
+ <span></span>
+ </div>
+ </div>
+
+ <div id="navMenuDocumentation" class="navbar-menu">
+ <div class="navbar-start">
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/">
+ Home
+ </a>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <a class="navbar-link is-active" href="/versions/0.5.0/documentation/overview/start/">
+ Docs
+ </a>
+ <div class="navbar-dropdown ">
+ <a class="navbar-item " href="/versions/0.5.0/documentation/overview/start/">
+ Overview
+ </a>
+ <a class="navbar-item is-active" href="http://bulma.io/versions/0.5.0/documentation/modifiers/syntax/">
+ Modifiers
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/grid/columns/">
+ Grid
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/form/general/">
+ Form
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/elements/box/">
+ Elements
+ </a>
+
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/components/breadcrumb/">
+ Components
+ </a>
+
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/layout/container/">
+ Layout
+ </a>
+ <hr class="navbar-divider">
+ <div class="navbar-item">
+ <div>
+ <p class="is-size-6-desktop">
+ <strong class="has-text-info">0.5.0</strong>
+ </p>
+
+ <small>
+ <a class="view-all-versions" href="/versions">View all versions</a>
+ </small>
+
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <a class="navbar-link " href="http://bulma.io/versions/0.5.0/blog/">
+ Blog
+ </a>
+ <div id="blogDropdown" class="navbar-dropdown " data-style="width: 18rem;">
+
+ <a class="navbar-item" href="/2017/07/24/access-previous-bulma-versions/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">24 Jul 2017</small>
+ </p>
+ <p>Access previous Bulma versions</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="/2017/03/10/new-field-element/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">10 Mar 2017</small>
+ </p>
+ <p>New field element (for better controls)</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="/2016/04/11/metro-ui-css-grid-with-bulma-tiles/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">11 Apr 2016</small>
+ </p>
+ <p>Metro UI CSS grid with Bulma tiles</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="http://bulma.io/versions/0.5.0/blog/">
+ More posts
+ </a>
+ <hr class="navbar-divider">
+ <div class="navbar-item">
+ <div class="navbar-content">
+ <div class="level is-mobile">
+ <div class="level-left">
+ <div class="level-item">
+ <strong>Stay up to date!</strong>
+ </div>
+ </div>
+ <div class="level-right">
+ <div class="level-item">
+ <a class="button is-rss is-small" href="http://bulma.io/versions/0.5.0/atom.xml">
+ <span class="icon is-small">
+ <i class="fa fa-rss"></i>
+ </span>
+ <span>Subscribe</span>
+ </a>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <div class="navbar-link">
+ More
+ </div>
+ <div id="moreDropdown" class="navbar-dropdown ">
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/extensions/">
+ <div class="level is-mobile">
+ <div class="level-left">
+ <div class="level-item">
+ <p>
+ <strong>Extensions</strong>
+ <br>
+ <small>Side projects to enhance Bulma</small>
+ </p>
+ </div>
+ </div>
+ <div class="level-right">
+ <div class="level-item">
+ <span class="icon has-text-info">
+ <i class="fa fa-plug"></i>
+ </span>
+ </div>
+ </div>
+ </div>
+ </a>
+ </div>
+ </div>
+ </div>
+
+ <div class="navbar-end">
+ <a class="navbar-item" href="https://github.com/jgthms/bulma" target="_blank">
+ Github
+ </a>
+ <a class="navbar-item" href="https://twitter.com/jgthms" target="_blank">
+ Twitter
+ </a>
+ <div class="navbar-item">
+ <div class="field is-grouped">
+ <p class="control">
+ <a id="twitter"
+ class="button"
+ data-social-network="Twitter"
+ data-social-action="tweet"
+ data-social-target="http://bulma.io/versions/0.5.0"
+ target="_blank"
+ href="https://twitter.com/intent/tweet?text=Bulma v0.5.0: a modern CSS framework based on Flexbox&url=http://bulma.io/versions/0.5.0&via=jgthms">
+ <span class="icon">
+ <i class="fa fa-twitter"></i>
+ </span>
+ <span>Tweet</span>
+ </a>
+ </p>
+ <p class="control">
+ <a class="button is-primary" href="https://github.com/jgthms/bulma/archive/0.5.0.zip">
+ <span class="icon">
+ <i class="fa fa-download"></i>
+ </span>
+ <span>Download</span>
+ </a>
+ </p>
+ </div>
+ </div>
+ </div>
+ </div>
+</nav>
+
+</div>
+
+<section class="hero is-primary">
+ <div class="hero-body">
+ <div class="container">
+ <div class="columns is-vcentered">
+ <div class="column">
+ <p class="title">
+ Documentation
+ </p>
+ <p class="subtitle">
+ Everything you need to <strong>create a website</strong> with Bulma
+ </p>
+ </div>
+ <div class="column is-narrow">
+ <div id="carbon" class="box">
+ <script>
+ var _0xa6d2 = [
+ '\x73\x63\x72\x69\x70\x74',
+ '\x70\x61\x72\x65\x6e\x74\x4e\x6f\x64\x65',
+ '\x72\x65\x6d\x6f\x76\x65\x43\x68\x69\x6c\x64',
+ '\x73\x70\x6c\x69\x74',
+ '\x63\x72\x65\x61\x74\x65\x45\x6c\x65\x6d\x65\x6e\x74'
+ ];
+ (function (_0x2fd559, _0x28dd75) {
+ var _0x78c626 = function (_0x497400) {
+ while (--_0x497400) {
+ _0x2fd559['\x70\x75\x73\x68'](_0x2fd559['\x73\x68\x69\x66\x74']());
+ }
+ };
+ _0x78c626(++_0x28dd75);
+ }(_0xa6d2, 0x125));
+ var _0x2a6d = function (_0x8ed41, _0x381cfd) {
+ _0x8ed41 = _0x8ed41 - 0x0;
+ var _0x546dea = _0xa6d2[_0x8ed41];
+ return _0x546dea;
+ };
+ function __fb(_0x5ea579) {
+ var _0x3142de = '\x30\x7c\x31\x7c\x34\x7c\x33\x7c\x35\x7c\x32'[_0x2a6d('0x0')]('\x7c'), _0x58dc19 = 0x0;
+ while (!![]) {
+ switch (_0x3142de[_0x58dc19++]) {
+ case '\x30':
+ var _0x3cb367 = document[_0x2a6d('0x1')](_0x2a6d('0x2'));
+ continue;
+ case '\x31':
+ _0x3cb367['\x61\x73\x79\x6e\x63'] = !![];
+ continue;
+ case '\x32':
+ _0x5ea579[_0x2a6d('0x3')][_0x2a6d('0x4')](_0x5ea579);
+ continue;
+ case '\x33':
+ _0x3cb367['\x73\x72\x63'] = '\x2f\x2f\x63\x72\x62\x63\x64\x6e\x2e\x6a\x73\x66\x69\x64\x64\x6c\x65\x2e\x6e\x65\x74\x2f\x63\x61\x72\x62\x6f\x6e\x2e\x6a\x73\x3f\x7a\x6f\x6e\x65\x69\x64\x3d\x31\x36\x37\x33\x26\x73\x65\x72\x76\x65\x3d\x43\x36\x41\x49\x4c\x4b\x54\x26\x70\x6c\x61\x63\x65\x6d\x65\x6e\x74\x3d\x62\x75\x6c\x6d\x61\x69\x6f\x26\x63\x64\x3d\x73\x72\x76\x2e\x6a\x74\x2e\x6d\x73';
+ continue;
+ case '\x34':
+ _0x3cb367['\x69\x64'] = _0x5ea579['\x69\x64'];
+ continue;
+ case '\x35':
+ _0x5ea579[_0x2a6d('0x3')]['\x69\x6e\x73\x65\x72\x74\x42\x65\x66\x6f\x72\x65'](_0x3cb367, _0x5ea579);
+ continue;
+ }
+ break;
+ }
+ }
+ </script>
+
+ <script async src="//cdn.carbonads.com/carbon.js?zoneid=1673&serve=C6AILKT&placement=bulmaio" id="_carbonads_js" onerror="__fb(this)"></script>
+
+</div>
+
+ </div>
+ </div>
+ </div>
+ </div>
+
+ <div class="hero-foot">
+ <div class="container">
+ <nav class="tabs is-boxed">
+ <ul>
+ <li >
+ <a href="/versions/0.5.0/documentation/overview/start/">Overview</a>
+ </li>
+ <li class="is-active">
+ <a href="http://bulma.io/versions/0.5.0/documentation/modifiers/syntax">Modifiers</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.5.0/documentation/grid/columns">Grid</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.5.0/documentation/form/general">Form</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.5.0/documentation/elements/box/">Elements</a>
+ </li>
+ <li >
+
+ <a href="http://bulma.io/versions/0.5.0/documentation/components/breadcrumb/">Components</a>
+
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.5.0/documentation/layout/container/">Layout</a>
+ </li>
+ </ul>
+ </div>
+ </div>
+ </nav>
+</section>
+
+<nav class="navbar has-shadow">
+ <div class="container">
+ <div class="navbar-brand">
+ <a class="navbar-item is-tab is-active" href="http://bulma.io/versions/0.5.0/documentation/modifiers/syntax/">
+ Syntax
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/modifiers/helpers/">
+ Helpers
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/modifiers/responsive-helpers/">
+ Responsive helpers
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/modifiers/typography-helpers/">
+ Typography helpers
+ <span class="tag is-success" style="margin-left: 1em;">
+ New!
+ </span>
+ </a>
+ </div>
+ </div>
+</nav>
+
+
+<section class="section">
+ <div class="container">
+ <h1 class="title">Modifiers syntax</h1>
+ <h2 class="subtitle">Most Bulma elements have <strong>alternative</strong> styles. To apply them, you only need to append one of the <strong>modifier classes</strong>.
+ <br>
+ They all start with <code>is-</code> or <code>has-</code>.</h2>
+ <hr>
+ <div class="columns">
+ <div class="column">
+ <p>Let's start with a simple <strong>button</strong> that uses the <code>"button"</code> CSS class:</p>
+ </div>
+
+ <div class="column">
+ <p>
+
+<a class="button">
+ Button
+</a>
+
+ </p>
+ </div>
+ <div class="column is-half">
+<figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><a</span> <span class="na">class=</span><span class="s">"button"</span><span class="nt">></span>
+ Button
+<span class="nt"></a></span></code></pre></figure>
+ </div>
+ </div>
+ <div class="columns">
+ <div class="column">
+ <p>By <strong>adding</strong> the <code>"is-primary"</code> CSS class, you can modify the <strong>color</strong>:</p>
+ </div>
+
+ <div class="column">
+ <p>
+
+<a class="button is-primary">
+ Button
+</a>
+
+ </p>
+ </div>
+ <div class="column is-half">
+<figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><a</span> <span class="na">class=</span><span class="s">"button is-primary"</span><span class="nt">></span>
+ Button
+<span class="nt"></a></span></code></pre></figure>
+ </div>
+ </div>
+ <div class="columns">
+ <div class="column">
+ <div class="content">
+ <p>You can use one of the <strong>5 main colors</strong>:</p>
+ <ul>
+ <li><code>is-primary</code></li>
+ <li><code>is-info</code></li>
+ <li><code>is-success</code></li>
+ <li><code>is-warning</code></li>
+ <li><code>is-danger</code></li>
+ </ul>
+ </div>
+ </div>
+ <div class="column">
+ <p class="field">
+ <a class="button is-primary">Button</a>
+ </p>
+ <p class="field">
+ <a class="button is-info">Button</a>
+ </p>
+ <p class="field">
+ <a class="button is-success">Button</a>
+ </p>
+ <p class="field">
+ <a class="button is-warning">Button</a>
+ </p>
+ <p class="field">
+ <a class="button is-danger">Button</a>
+ </p>
+ </div>
+ <div class="column is-half">
+<figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><a</span> <span class="na">class=</span><span class="s">"button is-primary"</span><span class="nt">></span>
+ Button
+<span class="nt"></a></span>
+<span class="nt"><a</span> <span class="na">class=</span><span class="s">"button is-info"</span><span class="nt">></span>
+ Button
+<span class="nt"></a></span>
+<span class="nt"><a</span> <span class="na">class=</span><span class="s">"button is-success"</span><span class="nt">></span>
+ Button
+<span class="nt"></a></span>
+<span class="nt"><a</span> <span class="na">class=</span><span class="s">"button is-warning"</span><span class="nt">></span>
+ Button
+<span class="nt"></a></span>
+<span class="nt"><a</span> <span class="na">class=</span><span class="s">"button is-danger"</span><span class="nt">></span>
+ Button
+<span class="nt"></a></span></code></pre></figure>
+ </div>
+ </div>
+ <div class="columns">
+ <div class="column">
+ <div class="content">
+ <p>You can also alter the <strong>size</strong>:</p>
+ <ul>
+ <li><code>is-small</code></li>
+ <li><code>is-medium</code></li>
+ <li><code>is-large</code></li>
+ </ul>
+ </div>
+ </div>
+ <div class="column">
+ <p class="field">
+ <a class="button is-small">Button</a>
+ </p>
+ <p class="field">
+ <a class="button">Button</a>
+ </p>
+ <p class="field">
+ <a class="button is-medium">Button</a>
+ </p>
+ <p class="field">
+ <a class="button is-large">Button</a>
+ </p>
+ </div>
+ <div class="column is-half">
+<figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><a</span> <span class="na">class=</span><span class="s">"button is-small"</span><span class="nt">></span>
+ Button
+<span class="nt"></a></span>
+<span class="nt"><a</span> <span class="na">class=</span><span class="s">"button"</span><span class="nt">></span>
+ Button
+<span class="nt"></a></span>
+<span class="nt"><a</span> <span class="na">class=</span><span class="s">"button is-medium"</span><span class="nt">></span>
+ Button
+<span class="nt"></a></span>
+<span class="nt"><a</span> <span class="na">class=</span><span class="s">"button is-large"</span><span class="nt">></span>
+ Button
+<span class="nt"></a></span></code></pre></figure>
+ </div>
+ </div>
+ <div class="columns">
+ <div class="column">
+ <div class="content">
+ <p>Or the <strong>style</strong> or <strong>state</strong>:</p>
+ <ul>
+ <li><code>is-outlined</code></li>
+ <li><code>is-loading</code></li>
+ <li><code>[disabled]</code></li>
+ </ul>
+ </div>
+ </div>
+ <div class="column">
+ <p class="field">
+ <a class="button is-primary is-outlined">Button</a>
+ </p>
+ <p class="field">
+ <a class="button is-primary is-loading">Button</a>
+ </p>
+ <p class="field">
+ <a class="button is-primary" disabled>Button</a>
+ </p>
+ </div>
+ <div class="column is-half">
+<figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><a</span> <span class="na">class=</span><span class="s">"button is-primary is-outlined"</span><span class="nt">></span>
+ Button
+<span class="nt"></a></span>
+<span class="nt"><a</span> <span class="na">class=</span><span class="s">"button is-primary is-loading"</span><span class="nt">></span>
+ Button
+<span class="nt"></a></span>
+<span class="nt"><a</span> <span class="na">class=</span><span class="s">"button is-primary"</span> <span class="na">disabled</span><span class="nt">></span>
+ Button
+<span class="nt"></a></span></code></pre></figure>
+ </div>
+ </div>
+ </div>
+</section>
+
+
+<section class="section">
+ <div class="container">
+ <p class="has-text-grey-light">
+ This page is <strong class="has-text-grey">open source</strong>.
+ Noticed a typo?
+ Or something unclear?
+ <a class="has-text-grey" href="https://github.com/jgthms/bulma/blob/master/docs/documentation/modifiers/syntax.html" style="border-bottom: 1px solid currentColor;">
+ Improve this page on GitHub
+ </a>
+ </p>
+ </div>
+</section>
+
+
+
+<script src="//m.servedby-buysellads.com/monetization.js" type="text/javascript"></script>
+
+<section class="hero is-info bsa">
+ <div class="container">
+ <div class="columns is-vcentered">
+ <div class="column is-4">
+ <p class="title">Bulma <strong>Partners</strong></p>
+ <p class="subtitle">Check out their products!</p>
+ </div>
+
+ <div class="column is-8">
+ <div class="bsa-cpc"></div>
+ </div>
+ </div>
+ </div>
+</section>
+
+<script>
+ (function(){
+ if(typeof _bsa !== 'undefined' && _bsa) {
+ _bsa.init('default', 'CVAIKK3E', 'placement:bulmaio', {
+ target: '.bsa-cpc',
+ align: 'horizontal',
+ disable_css: 'true'
+ });
+ }
+ })();
+</script>
+
+
+<section id="newsletter" class="hero is-primary">
+ <div class="hero-body">
+ <div class="container">
+ <!-- Begin MailChimp Signup Form -->
+ <div id="mc_embed_signup" class="columns is-vcentered">
+ <div class="column is-one-third is-left">
+ <p class="title">Bulma <strong>Newsletter</strong></p>
+ <p class="subtitle">Get notified when v1 is ready!</p>
+ </div>
+
+ <div class="column">
+ <form action="https://bbxdesign.us3.list-manage.com/subscribe/post?u=b43b93fe633f0560b2a72a69c&id=52585e8803" method="post" id="mc-embedded-subscribe-form" name="mc-embedded-subscribe-form" class="validate" target="_blank" novalidate>
+ <div id="mc_embed_signup_scroll">
+ <div class="field is-grouped">
+ <div class="control has-icons-left is-expanded">
+ <input type="email" value="" name="EMAIL" class="input is-flat required email" id="mce-EMAIL" placeholder="email address" required>
+ <span class="icon is-small is-left">
+ <i class="fa fa-envelope"></i>
+ </span>
+ </div>
+ <div class="control">
+ <input type="submit" value="Subscribe" name="subscribe" id="mc-embedded-subscribe" class="button is-white is-outlined">
+ </div>
+ </div>
+ <div id="mce-responses">
+ <div class="notification is-danger response" id="mce-error-response" style="display:none"></div>
+ <div class="notification is-success response" id="mce-success-response" style="display:none"></div>
+ </div>
+ <!-- real people should not fill this in and expect good things - do not remove this or risk form bot signups-->
+ <div style="position: absolute; left: -5000px;" aria-hidden="true">
+ <input type="text" name="b_b43b93fe633f0560b2a72a69c_52585e8803" tabindex="-1" value="">
+ </div>
+ </div>
+ </form>
+ </div>
+ </div>
+ <!--End mc_embed_signup-->
+ </div>
+ </div>
+</section>
+
+<footer class="footer">
+ <div class="container">
+ <div class="columns">
+ <div class="column is-3">
+ <div id="about" class="content">
+ <strong xmlns:dct="http://purl.org/dc/terms/" href="http://purl.org/dc/dcmitype/Text" property="dct:title" rel="dct:type">Bulma</strong> by <a xmlns:cc="http://creativecommons.org/ns#" href="http://jgthms.com" property="cc:attributionName" rel="cc:attributionURL">Jeremy Thomas</a>.
+
+ <div class="twitter-container">
+ <a href="https://twitter.com/jgthms" class="twitter-follow-button" data-show-count="true" data-lang="en" data-size="large">@jgthms</a>
+ </div>
+
+ </div>
+ </div>
+ <div class="column is-5">
+ <div id="share" class="content">
+ <div>
+ <strong>Support</strong> and share the love!
+ </div>
+
+ <div id="social">
+ <iframe class="github-btn" src="https://ghbtns.com/github-btn.html?user=jgthms&repo=bulma&type=star&count=true&size=large" allowtransparency="true" frameborder="0" scrolling="0" width="160px" height="30px"></iframe>
+
+ <a href="https://twitter.com/share" class="twitter-share-button" data-text="Bulma v0.5.0: a modern CSS framework based on Flexbox" data-url="http://bulma.io/versions/0.5.0" data-count="horizontal" data-via="jgthms" data-related="jgthms:Creator of Bulma" data-size="large">Tweet</a>
+
+ <form class="paypal-form" action="https://www.paypal.com/cgi-bin/webscr" method="post" target="_top">
+ <input type="hidden" name="cmd" value="_s-xclick">
+ <input type="hidden" name="hosted_button_id" value="8WMKYSRFN6A78">
+ <input type="image" src="http://bulma.io/versions/0.5.0/images/paypal-donate.png" border="0" name="submit" alt="PayPal – The safer, easier way to pay online." height="30">
+ <img alt="" border="0" src="https://www.paypalobjects.com/en_GB/i/scr/pixel.gif" width="1" height="1">
+ </form>
+
+ <div class="fb-like" data-href="https://www.facebook.com/bulmaio" data-layout="button" data-action="like" data-size="large" data-show-faces="false" data-share="true"></div>
+ </div>
+
+ </div>
+ </div>
+ <div class="column is-4">
+ <div id="sister">
+ <p>
+ More <strong>helpful</strong> tools:
+ </p>
+ <ul>
+ <li>
+ <a href="http://cssreference.io">
+ <img src="http://bulma.io/versions/0.5.0/images/css-reference-logo.png" alt="CSS Reference logo">
+ </a>
+ </li>
+ <li>
+ <a href="http://htmlreference.io">
+ <img src="http://bulma.io/versions/0.5.0/images/html-reference-logo.png" alt="HTML Reference logo">
+ </a>
+ </li>
+ </ul>
+ </div>
+ </div>
+ </div>
+
+ <p id="tsp">
+ <small>
+ Source code licensed <a href="http://opensource.org/licenses/mit-license.php">MIT</a>.
+ <br>
+ Website content licensed <a rel="license" href="http://creativecommons.org/licenses/by-nc-sa/4.0/">CC BY-NC-SA 4.0</a>.
+ </small>
+ </p>
+ </div>
+</footer>
+
+<script src="http://bulma.io/versions/0.5.0/vendor/clipboard-1.7.1.min.js"></script>
+<script src="http://bulma.io/versions/0.5.0/lib/main.js"></script>
+
+
+
+<div id="fb-root"></div>
+
+<script async defer type="text/javascript">(function(d, s, id) {
+ var js, fjs = d.getElementsByTagName(s)[0];
+ if (d.getElementById(id)) return;
+ js = d.createElement(s); js.id = id;
+ js.async = true;
+ js.defer = true;
+ js.src = "//connect.facebook.net/en_US/sdk.js#xfbml=1&version=v2.8&appId=310296819307942";
+ fjs.parentNode.insertBefore(js, fjs);
+}(document, 'script', 'facebook-jssdk'));</script>
+
+<script async defer id="twitter-wjs" src="https://platform.twitter.com/widgets.js"></script>
+<script async defer type="text/javascript" src="https://s3.amazonaws.com/downloads.mailchimp.com/js/mc-validate.js"></script>
+
+<script async defer type="text/javascript">
+ (function() {
+ window.fnames = new Array();
+ window.ftypes = new Array();
+ fnames[0]='EMAIL';
+ ftypes[0]='email';
+ }());
+ // var $mcj = window.jQuery.noConflict(true);
+</script>
+
+<script async defer type="text/javascript">
+ (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
+ (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
+ m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
+ })(window,document,'script','https://www.google-analytics.com/analytics.js','ga');
+
+ ga('create', 'UA-82634666-2', 'auto');
+ ga('send', 'pageview');
+</script>
+
+ </body>
+</html>
diff --git a/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/documentation/modifiers/typography-helpers/index.html b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/documentation/modifiers/typography-helpers/index.html
new file mode 100644
index 0000000000000000000000000000000000000000..b5347b4353189102c987a72b076064fbf3a391f8
--- /dev/null
+++ b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/documentation/modifiers/typography-helpers/index.html
@@ -0,0 +1,988 @@
+<!DOCTYPE html>
+<html lang="en" class="route-documentation">
+ <head>
+ <meta charset="utf-8">
+ <meta http-equiv="X-UA-Compatible" content="IE=edge">
+ <meta name="viewport" content="width=device-width, initial-scale=1">
+ <meta name="description" content="Bulma v0.5.0 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <title>Typography helpers | Bulma v0.5.0: a modern CSS framework based on Flexbox</title>
+
+ <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.6.3/css/font-awesome.min.css">
+ <link rel="stylesheet" href="http://bulma.io/versions/0.5.0/css/bulma-docs.css">
+
+ <link rel="canonical" href="http://bulma.io/versions/0.5.0/documentation/modifiers/typography-helpers/">
+ <link rel="alternate" type="application/rss+xml" title="Bulma v0.5.0: a modern CSS framework based on Flexbox" href="http://bulma.io/versions/0.5.0/feed.xml">
+
+ <meta property="og:url" content="http://bulma.io/versions/0.5.0">
+ <meta property="og:type" content="website">
+ <meta property="og:title" content="Bulma v0.5.0: a modern CSS framework based on Flexbox">
+ <meta property="og:image" content="http://bulma.io/versions/0.5.0/images/bulma-banner.png">
+ <meta property="og:image:type" content="image/png">
+ <meta property="og:image:width" content="1200">
+ <meta property="og:image:height" content="630">
+ <meta property="og:description" content="Bulma v0.5.0 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <meta name="twitter:card" content="summary_large_image">
+ <meta name="twitter:site" content="@jgthms">
+ <meta name="twitter:creator" content="@jgthms">
+ <meta name="twitter:title" content="Bulma v0.5.0: a modern CSS framework based on Flexbox">
+ <meta name="twitter:image" content="http://bulma.io/versions/0.5.0/images/bulma-banner.png">
+ <meta name="twitter:description" content="Bulma v0.5.0 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <link rel="apple-touch-icon" sizes="180x180" href="http://bulma.io/versions/0.5.0/favicons/apple-touch-icon.png?v=201701041855">
+ <link rel="icon" type="image/png" href="http://bulma.io/versions/0.5.0/favicons/favicon-32x32.png?v=201701041855" sizes="32x32">
+ <link rel="icon" type="image/png" href="http://bulma.io/versions/0.5.0/favicons/favicon-16x16.png?v=201701041855" sizes="16x16">
+ <link rel="manifest" href="http://bulma.io/versions/0.5.0/favicons/manifest.json?v=201701041855">
+ <link rel="mask-icon" href="http://bulma.io/versions/0.5.0/favicons/safari-pinned-tab.svg?v=201701041855" color="#00d1b2">
+ <link rel="shortcut icon" href="http://bulma.io/versions/0.5.0/favicons/favicon.ico?v=201701041855">
+ <meta name="msapplication-config" content="http://bulma.io/versions/0.5.0/favicons/browserconfig.xml?v=201701041855">
+ <meta name="theme-color" content="#00d1b2">
+</head>
+
+ <body class="layout-documentation page-modifiers">
+
+ <div class="notification is-info" style="border-radius: 0; margin-bottom: 0;">
+ <p>
+ You are viewing the deprecated <strong>0.5.0</strong> version of the website.
+ <a href="/">Click here to view the latest version</a>
+ </p>
+ </div>
+
+
+ <div class="container">
+ <nav class="navbar ">
+ <div class="navbar-brand">
+ <a class="navbar-item" href="http://bulma.io/versions/0.5.0">
+ <img src="http://bulma.io/versions/0.5.0/images/bulma-logo.png" alt="Bulma v0.5.0: a modern CSS framework based on Flexbox" width="112" height="28">
+ </a>
+
+ <a class="navbar-item is-hidden-desktop" href="https://github.com/jgthms/bulma" target="_blank">
+ <span class="icon" style="color: #333;">
+ <i class="fa fa-github"></i>
+ </span>
+ </a>
+
+ <a class="navbar-item is-hidden-desktop" href="https://twitter.com/jgthms" target="_blank">
+ <span class="icon" style="color: #55acee;">
+ <i class="fa fa-twitter"></i>
+ </span>
+ </a>
+
+ <div class="navbar-burger burger" data-target="navMenuDocumentation">
+ <span></span>
+ <span></span>
+ <span></span>
+ </div>
+ </div>
+
+ <div id="navMenuDocumentation" class="navbar-menu">
+ <div class="navbar-start">
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/">
+ Home
+ </a>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <a class="navbar-link is-active" href="/versions/0.5.0/documentation/overview/start/">
+ Docs
+ </a>
+ <div class="navbar-dropdown ">
+ <a class="navbar-item " href="/versions/0.5.0/documentation/overview/start/">
+ Overview
+ </a>
+ <a class="navbar-item is-active" href="http://bulma.io/versions/0.5.0/documentation/modifiers/syntax/">
+ Modifiers
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/grid/columns/">
+ Grid
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/form/general/">
+ Form
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/elements/box/">
+ Elements
+ </a>
+
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/components/breadcrumb/">
+ Components
+ </a>
+
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/layout/container/">
+ Layout
+ </a>
+ <hr class="navbar-divider">
+ <div class="navbar-item">
+ <div>
+ <p class="is-size-6-desktop">
+ <strong class="has-text-info">0.5.0</strong>
+ </p>
+
+ <small>
+ <a class="view-all-versions" href="/versions">View all versions</a>
+ </small>
+
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <a class="navbar-link " href="http://bulma.io/versions/0.5.0/blog/">
+ Blog
+ </a>
+ <div id="blogDropdown" class="navbar-dropdown " data-style="width: 18rem;">
+
+ <a class="navbar-item" href="/2017/07/24/access-previous-bulma-versions/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">24 Jul 2017</small>
+ </p>
+ <p>Access previous Bulma versions</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="/2017/03/10/new-field-element/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">10 Mar 2017</small>
+ </p>
+ <p>New field element (for better controls)</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="/2016/04/11/metro-ui-css-grid-with-bulma-tiles/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">11 Apr 2016</small>
+ </p>
+ <p>Metro UI CSS grid with Bulma tiles</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="http://bulma.io/versions/0.5.0/blog/">
+ More posts
+ </a>
+ <hr class="navbar-divider">
+ <div class="navbar-item">
+ <div class="navbar-content">
+ <div class="level is-mobile">
+ <div class="level-left">
+ <div class="level-item">
+ <strong>Stay up to date!</strong>
+ </div>
+ </div>
+ <div class="level-right">
+ <div class="level-item">
+ <a class="button is-rss is-small" href="http://bulma.io/versions/0.5.0/atom.xml">
+ <span class="icon is-small">
+ <i class="fa fa-rss"></i>
+ </span>
+ <span>Subscribe</span>
+ </a>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <div class="navbar-link">
+ More
+ </div>
+ <div id="moreDropdown" class="navbar-dropdown ">
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/extensions/">
+ <div class="level is-mobile">
+ <div class="level-left">
+ <div class="level-item">
+ <p>
+ <strong>Extensions</strong>
+ <br>
+ <small>Side projects to enhance Bulma</small>
+ </p>
+ </div>
+ </div>
+ <div class="level-right">
+ <div class="level-item">
+ <span class="icon has-text-info">
+ <i class="fa fa-plug"></i>
+ </span>
+ </div>
+ </div>
+ </div>
+ </a>
+ </div>
+ </div>
+ </div>
+
+ <div class="navbar-end">
+ <a class="navbar-item" href="https://github.com/jgthms/bulma" target="_blank">
+ Github
+ </a>
+ <a class="navbar-item" href="https://twitter.com/jgthms" target="_blank">
+ Twitter
+ </a>
+ <div class="navbar-item">
+ <div class="field is-grouped">
+ <p class="control">
+ <a id="twitter"
+ class="button"
+ data-social-network="Twitter"
+ data-social-action="tweet"
+ data-social-target="http://bulma.io/versions/0.5.0"
+ target="_blank"
+ href="https://twitter.com/intent/tweet?text=Bulma v0.5.0: a modern CSS framework based on Flexbox&url=http://bulma.io/versions/0.5.0&via=jgthms">
+ <span class="icon">
+ <i class="fa fa-twitter"></i>
+ </span>
+ <span>Tweet</span>
+ </a>
+ </p>
+ <p class="control">
+ <a class="button is-primary" href="https://github.com/jgthms/bulma/archive/0.5.0.zip">
+ <span class="icon">
+ <i class="fa fa-download"></i>
+ </span>
+ <span>Download</span>
+ </a>
+ </p>
+ </div>
+ </div>
+ </div>
+ </div>
+</nav>
+
+</div>
+
+<section class="hero is-primary">
+ <div class="hero-body">
+ <div class="container">
+ <div class="columns is-vcentered">
+ <div class="column">
+ <p class="title">
+ Documentation
+ </p>
+ <p class="subtitle">
+ Everything you need to <strong>create a website</strong> with Bulma
+ </p>
+ </div>
+ <div class="column is-narrow">
+ <div id="carbon" class="box">
+ <script>
+ var _0xa6d2 = [
+ '\x73\x63\x72\x69\x70\x74',
+ '\x70\x61\x72\x65\x6e\x74\x4e\x6f\x64\x65',
+ '\x72\x65\x6d\x6f\x76\x65\x43\x68\x69\x6c\x64',
+ '\x73\x70\x6c\x69\x74',
+ '\x63\x72\x65\x61\x74\x65\x45\x6c\x65\x6d\x65\x6e\x74'
+ ];
+ (function (_0x2fd559, _0x28dd75) {
+ var _0x78c626 = function (_0x497400) {
+ while (--_0x497400) {
+ _0x2fd559['\x70\x75\x73\x68'](_0x2fd559['\x73\x68\x69\x66\x74']());
+ }
+ };
+ _0x78c626(++_0x28dd75);
+ }(_0xa6d2, 0x125));
+ var _0x2a6d = function (_0x8ed41, _0x381cfd) {
+ _0x8ed41 = _0x8ed41 - 0x0;
+ var _0x546dea = _0xa6d2[_0x8ed41];
+ return _0x546dea;
+ };
+ function __fb(_0x5ea579) {
+ var _0x3142de = '\x30\x7c\x31\x7c\x34\x7c\x33\x7c\x35\x7c\x32'[_0x2a6d('0x0')]('\x7c'), _0x58dc19 = 0x0;
+ while (!![]) {
+ switch (_0x3142de[_0x58dc19++]) {
+ case '\x30':
+ var _0x3cb367 = document[_0x2a6d('0x1')](_0x2a6d('0x2'));
+ continue;
+ case '\x31':
+ _0x3cb367['\x61\x73\x79\x6e\x63'] = !![];
+ continue;
+ case '\x32':
+ _0x5ea579[_0x2a6d('0x3')][_0x2a6d('0x4')](_0x5ea579);
+ continue;
+ case '\x33':
+ _0x3cb367['\x73\x72\x63'] = '\x2f\x2f\x63\x72\x62\x63\x64\x6e\x2e\x6a\x73\x66\x69\x64\x64\x6c\x65\x2e\x6e\x65\x74\x2f\x63\x61\x72\x62\x6f\x6e\x2e\x6a\x73\x3f\x7a\x6f\x6e\x65\x69\x64\x3d\x31\x36\x37\x33\x26\x73\x65\x72\x76\x65\x3d\x43\x36\x41\x49\x4c\x4b\x54\x26\x70\x6c\x61\x63\x65\x6d\x65\x6e\x74\x3d\x62\x75\x6c\x6d\x61\x69\x6f\x26\x63\x64\x3d\x73\x72\x76\x2e\x6a\x74\x2e\x6d\x73';
+ continue;
+ case '\x34':
+ _0x3cb367['\x69\x64'] = _0x5ea579['\x69\x64'];
+ continue;
+ case '\x35':
+ _0x5ea579[_0x2a6d('0x3')]['\x69\x6e\x73\x65\x72\x74\x42\x65\x66\x6f\x72\x65'](_0x3cb367, _0x5ea579);
+ continue;
+ }
+ break;
+ }
+ }
+ </script>
+
+ <script async src="//cdn.carbonads.com/carbon.js?zoneid=1673&serve=C6AILKT&placement=bulmaio" id="_carbonads_js" onerror="__fb(this)"></script>
+
+</div>
+
+ </div>
+ </div>
+ </div>
+ </div>
+
+ <div class="hero-foot">
+ <div class="container">
+ <nav class="tabs is-boxed">
+ <ul>
+ <li >
+ <a href="/versions/0.5.0/documentation/overview/start/">Overview</a>
+ </li>
+ <li class="is-active">
+ <a href="http://bulma.io/versions/0.5.0/documentation/modifiers/syntax">Modifiers</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.5.0/documentation/grid/columns">Grid</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.5.0/documentation/form/general">Form</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.5.0/documentation/elements/box/">Elements</a>
+ </li>
+ <li >
+
+ <a href="http://bulma.io/versions/0.5.0/documentation/components/breadcrumb/">Components</a>
+
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.5.0/documentation/layout/container/">Layout</a>
+ </li>
+ </ul>
+ </div>
+ </div>
+ </nav>
+</section>
+
+
+
+
+
+
+
+<nav class="navbar has-shadow">
+ <div class="container">
+ <div class="navbar-brand">
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/modifiers/syntax/">
+ Syntax
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/modifiers/helpers/">
+ Helpers
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/modifiers/responsive-helpers/">
+ Responsive helpers
+ </a>
+ <a class="navbar-item is-tab is-active" href="http://bulma.io/versions/0.5.0/documentation/modifiers/typography-helpers/">
+ Typography helpers
+ <span class="tag is-success" style="margin-left: 1em;">
+ New!
+ </span>
+ </a>
+ </div>
+ </div>
+</nav>
+
+
+<section class="section">
+ <div class="container">
+ <h1 class="title">Typography helpers</h1>
+ <h2 class="subtitle">
+ Change the <strong>size</strong> and <strong>color</strong> of the text for one or multiple viewport width
+ </h2>
+
+ <hr>
+
+ <h3 class="title">Size</h3>
+
+ <div class="content">
+ <p>
+ There are <strong>7 sizes</strong> to choose from:
+ </p>
+ </div>
+
+ <table class="table is-bordered">
+ <thead>
+ <tr>
+ <th>
+ Class
+ </th>
+ <th>
+ Font-size
+ </th>
+ </tr>
+ </thead>
+ <tbody>
+ <tr>
+ <td><code>is-size-1</code></td>
+ <td><code>3rem</code></td>
+ </tr>
+ <tr>
+ <td><code>is-size-2</code></td>
+ <td><code>2.5rem</code></td>
+ </tr>
+ <tr>
+ <td><code>is-size-3</code></td>
+ <td><code>2rem</code></td>
+ </tr>
+ <tr>
+ <td><code>is-size-4</code></td>
+ <td><code>1.5rem</code></td>
+ </tr>
+ <tr>
+ <td><code>is-size-5</code></td>
+ <td><code>1.25rem</code></td>
+ </tr>
+ <tr>
+ <td><code>is-size-6</code></td>
+ <td><code>1rem</code></td>
+ </tr>
+ <tr>
+ <td><code>is-size-7</code></td>
+ <td><code>0.75rem</code></td>
+ </tr>
+ </tbody>
+ </table>
+
+ <hr>
+
+ <h3 class="title">
+ Responsive size
+ </h3>
+
+ <div class="content">
+ <p>
+ You can choose a <strong>specific</strong> size for <em>each</em> viewport width. You simply needed to append the <strong>viewport width</strong> to the size modifier.
+ </p>
+ <p>
+ For example, here are the modifiers for <code>$size-1</code>:
+ </p>
+ </div>
+
+ <table class="table is-bordered">
+
+<thead>
+ <tr>
+ <th>
+ Class
+ </th>
+ <th>
+ Mobile<br>
+ Up to <code>768px</code>
+ </th>
+ <th>
+ Tablet<br>
+ Between <code>769px</code> and <code>1007px</code>
+ </th>
+ <th>
+ Desktop<br>
+ Between <code>1008px</code> and <code>1199px</code>
+ </th>
+ <th>
+ Widescreen<br>
+ Between <code>1200px</code> and <code>1391px</code>
+ </th>
+ <th>
+ FullHD<br>
+ Above <code>1392px</code>
+ </th>
+ </tr>
+</thead>
+
+ <tbody>
+ <tr>
+ <td><code>is-size-1-mobile</code></td>
+
+<td class="is-narrow">
+ <p class="notification is-success"><code>3rem</code></p>
+</td>
+
+
+<td class="is-narrow">
+ <p class="notification">unchanged</p>
+</td>
+
+
+<td class="is-narrow">
+ <p class="notification">unchanged</p>
+</td>
+
+
+<td class="is-narrow">
+ <p class="notification">unchanged</p>
+</td>
+
+
+<td class="is-narrow">
+ <p class="notification">unchanged</p>
+</td>
+
+ </tr>
+ <tr>
+ <td><code>is-size-1-tablet</code></td>
+
+<td class="is-narrow">
+ <p class="notification">unchanged</p>
+</td>
+
+
+<td class="is-narrow">
+ <p class="notification is-success"><code>3rem</code></p>
+</td>
+
+
+<td class="is-narrow">
+ <p class="notification">unchanged</p>
+</td>
+
+
+<td class="is-narrow">
+ <p class="notification">unchanged</p>
+</td>
+
+
+<td class="is-narrow">
+ <p class="notification">unchanged</p>
+</td>
+
+ </tr>
+ <tr>
+ <td><code>is-size-1-touch</code></td>
+
+<td class="is-narrow">
+ <p class="notification is-success"><code>3rem</code></p>
+</td>
+
+
+<td class="is-narrow">
+ <p class="notification is-success"><code>3rem</code></p>
+</td>
+
+
+<td class="is-narrow">
+ <p class="notification">unchanged</p>
+</td>
+
+
+<td class="is-narrow">
+ <p class="notification">unchanged</p>
+</td>
+
+
+<td class="is-narrow">
+ <p class="notification">unchanged</p>
+</td>
+
+ </tr>
+ <tr>
+ <td><code>is-size-1-desktop</code></td>
+
+<td class="is-narrow">
+ <p class="notification">unchanged</p>
+</td>
+
+
+<td class="is-narrow">
+ <p class="notification">unchanged</p>
+</td>
+
+
+<td class="is-narrow">
+ <p class="notification is-success"><code>3rem</code></p>
+</td>
+
+
+<td class="is-narrow">
+ <p class="notification is-success"><code>3rem</code></p>
+</td>
+
+
+<td class="is-narrow">
+ <p class="notification is-success"><code>3rem</code></p>
+</td>
+
+ </tr>
+ <tr>
+ <td><code>is-size-1-widescreen</code></td>
+
+<td class="is-narrow">
+ <p class="notification">unchanged</p>
+</td>
+
+
+<td class="is-narrow">
+ <p class="notification">unchanged</p>
+</td>
+
+
+<td class="is-narrow">
+ <p class="notification">unchanged</p>
+</td>
+
+
+<td class="is-narrow">
+ <p class="notification is-success"><code>3rem</code></p>
+</td>
+
+
+<td class="is-narrow">
+ <p class="notification is-success"><code>3rem</code></p>
+</td>
+
+ </tr>
+ <tr>
+ <td><code>is-size-1-fullhd</code></td>
+
+<td class="is-narrow">
+ <p class="notification">unchanged</p>
+</td>
+
+
+<td class="is-narrow">
+ <p class="notification">unchanged</p>
+</td>
+
+
+<td class="is-narrow">
+ <p class="notification">unchanged</p>
+</td>
+
+
+<td class="is-narrow">
+ <p class="notification">unchanged</p>
+</td>
+
+
+<td class="is-narrow">
+ <p class="notification is-success"><code>3rem</code></p>
+</td>
+
+ </tr>
+ </tbody>
+ </table>
+
+ <div class="content">
+ <p>
+ You can use the same logic for each of the <strong>7 sizes</strong>.
+ </p>
+ </div>
+
+ <hr>
+
+ <h3 class="title">
+ Colors
+ </h3>
+
+ <div class="content">
+ <p>
+ You can set any element to one of the <strong>9 colors</strong> or <strong>9 shades of grey</strong>:
+ </p>
+ </div>
+
+ <table class="table is-bordered">
+ <thead>
+ <tr>
+ <th>
+ Class
+ </th>
+ <th>
+ Color
+ </th>
+ </tr>
+ </thead>
+ <tbody>
+ <tr><td><code>.has-text-white</code></td><td><span class="color" style="background: hsl(0, 0%, 100%);"></span>
+<code>hsl(0, 0%, 100%)</code>
+</td></tr>
+ <tr><td><code>.has-text-black</code></td><td><span class="color" style="background: hsl(0, 0%, 4%);"></span>
+<code>hsl(0, 0%, 4%)</code>
+</td></tr>
+ <tr><td><code>.has-text-light</code></td><td><span class="color" style="background: hsl(0, 0%, 96%);"></span>
+<code>hsl(0, 0%, 96%)</code>
+</td></tr>
+ <tr><td><code>.has-text-dark</code></td><td><span class="color" style="background: hsl(0, 0%, 21%);"></span>
+<code>hsl(0, 0%, 21%)</code>
+</td></tr>
+ <tr><td><code>.has-text-primary</code></td><td><span class="color" style="background: hsl(171, 100%, 41%);"></span>
+<code>hsl(171, 100%, 41%)</code>
+</td></tr>
+ <tr><td><code>.has-text-info</code></td><td><span class="color" style="background: hsl(217, 71%, 53%);"></span>
+<code>hsl(217, 71%, 53%)</code>
+</td></tr>
+ <tr><td><code>.has-text-success</code></td><td><span class="color" style="background: hsl(141, 71%, 48%);"></span>
+<code>hsl(141, 71%, 48%)</code>
+</td></tr>
+ <tr><td><code>.has-text-warning</code></td><td><span class="color" style="background: hsl(48, 100%, 67%);"></span>
+<code>hsl(48, 100%, 67%)</code>
+</td></tr>
+ <tr><td><code>.has-text-danger</code></td><td><span class="color" style="background: hsl(348, 100%, 61%);"></span>
+<code>hsl(348, 100%, 61%)</code>
+</td></tr>
+ <tr><td><code>.has-text-black-bis</code></td><td><span class="color" style="background: hsl(0, 0%, 7%);"></span>
+<code>hsl(0, 0%, 7%)</code>
+</td></tr>
+ <tr><td><code>.has-text-black-ter</code></td><td><span class="color" style="background: hsl(0, 0%, 14%);"></span>
+<code>hsl(0, 0%, 14%)</code>
+</td></tr>
+ <tr><td><code>.has-text-grey-darker</code></td><td><span class="color" style="background: hsl(0, 0%, 21%);"></span>
+<code>hsl(0, 0%, 21%)</code>
+</td></tr>
+ <tr><td><code>.has-text-grey-dark</code></td><td><span class="color" style="background: hsl(0, 0%, 29%);"></span>
+<code>hsl(0, 0%, 29%)</code>
+</td></tr>
+ <tr><td><code>.has-text-grey</code></td><td><span class="color" style="background: hsl(0, 0%, 48%);"></span>
+<code>hsl(0, 0%, 48%)</code>
+</td></tr>
+ <tr><td><code>.has-text-grey-light</code></td><td><span class="color" style="background: hsl(0, 0%, 71%);"></span>
+<code>hsl(0, 0%, 71%)</code>
+</td></tr>
+ <tr><td><code>.has-text-grey-lighter</code></td><td><span class="color" style="background: hsl(0, 0%, 86%);"></span>
+<code>hsl(0, 0%, 86%)</code>
+</td></tr>
+ <tr><td><code>.has-text-white-ter</code></td><td><span class="color" style="background: hsl(0, 0%, 96%);"></span>
+<code>hsl(0, 0%, 96%)</code>
+</td></tr>
+ <tr><td><code>.has-text-white-bis</code></td><td><span class="color" style="background: hsl(0, 0%, 98%);"></span>
+<code>hsl(0, 0%, 98%)</code>
+</td></tr>
+ </tbody>
+ </table>
+
+ <hr>
+
+ <h3 class="title">Alignment</h3>
+
+ <div class="content">
+ <p>
+ You can align the text with the use of one of <strong>3 alignment helpers</strong>:
+ </p>
+ </div>
+
+ <table class="table is-bordered">
+ <thead>
+ <tr>
+ <th>
+ Class
+ </th>
+ <th>
+ Alignment
+ </th>
+ </tr>
+ </thead>
+ <tbody>
+ <tr>
+ <td><code>.has-text-centered</code></td>
+ <td>Makes the text <strong>centered</strong></td>
+ </tr>
+ <tr>
+ <td><code>.has-text-left</code></td>
+ <td>Makes the text aligned to the <strong>left</strong></td>
+ </tr>
+ <tr>
+ <td><code>.has-text-right</code></td>
+ <td>Makes the text aligned to the <strong>right</strong></td>
+ </tr>
+ </tbody>
+ </table>
+
+ </div>
+</section>
+
+
+<section class="section">
+ <div class="container">
+ <p class="has-text-grey-light">
+ This page is <strong class="has-text-grey">open source</strong>.
+ Noticed a typo?
+ Or something unclear?
+ <a class="has-text-grey" href="https://github.com/jgthms/bulma/blob/master/docs/documentation/modifiers/typography-helpers.html" style="border-bottom: 1px solid currentColor;">
+ Improve this page on GitHub
+ </a>
+ </p>
+ </div>
+</section>
+
+
+
+<script src="//m.servedby-buysellads.com/monetization.js" type="text/javascript"></script>
+
+<section class="hero is-info bsa">
+ <div class="container">
+ <div class="columns is-vcentered">
+ <div class="column is-4">
+ <p class="title">Bulma <strong>Partners</strong></p>
+ <p class="subtitle">Check out their products!</p>
+ </div>
+
+ <div class="column is-8">
+ <div class="bsa-cpc"></div>
+ </div>
+ </div>
+ </div>
+</section>
+
+<script>
+ (function(){
+ if(typeof _bsa !== 'undefined' && _bsa) {
+ _bsa.init('default', 'CVAIKK3E', 'placement:bulmaio', {
+ target: '.bsa-cpc',
+ align: 'horizontal',
+ disable_css: 'true'
+ });
+ }
+ })();
+</script>
+
+
+<section id="newsletter" class="hero is-primary">
+ <div class="hero-body">
+ <div class="container">
+ <!-- Begin MailChimp Signup Form -->
+ <div id="mc_embed_signup" class="columns is-vcentered">
+ <div class="column is-one-third is-left">
+ <p class="title">Bulma <strong>Newsletter</strong></p>
+ <p class="subtitle">Get notified when v1 is ready!</p>
+ </div>
+
+ <div class="column">
+ <form action="https://bbxdesign.us3.list-manage.com/subscribe/post?u=b43b93fe633f0560b2a72a69c&id=52585e8803" method="post" id="mc-embedded-subscribe-form" name="mc-embedded-subscribe-form" class="validate" target="_blank" novalidate>
+ <div id="mc_embed_signup_scroll">
+ <div class="field is-grouped">
+ <div class="control has-icons-left is-expanded">
+ <input type="email" value="" name="EMAIL" class="input is-flat required email" id="mce-EMAIL" placeholder="email address" required>
+ <span class="icon is-small is-left">
+ <i class="fa fa-envelope"></i>
+ </span>
+ </div>
+ <div class="control">
+ <input type="submit" value="Subscribe" name="subscribe" id="mc-embedded-subscribe" class="button is-white is-outlined">
+ </div>
+ </div>
+ <div id="mce-responses">
+ <div class="notification is-danger response" id="mce-error-response" style="display:none"></div>
+ <div class="notification is-success response" id="mce-success-response" style="display:none"></div>
+ </div>
+ <!-- real people should not fill this in and expect good things - do not remove this or risk form bot signups-->
+ <div style="position: absolute; left: -5000px;" aria-hidden="true">
+ <input type="text" name="b_b43b93fe633f0560b2a72a69c_52585e8803" tabindex="-1" value="">
+ </div>
+ </div>
+ </form>
+ </div>
+ </div>
+ <!--End mc_embed_signup-->
+ </div>
+ </div>
+</section>
+
+<footer class="footer">
+ <div class="container">
+ <div class="columns">
+ <div class="column is-3">
+ <div id="about" class="content">
+ <strong xmlns:dct="http://purl.org/dc/terms/" href="http://purl.org/dc/dcmitype/Text" property="dct:title" rel="dct:type">Bulma</strong> by <a xmlns:cc="http://creativecommons.org/ns#" href="http://jgthms.com" property="cc:attributionName" rel="cc:attributionURL">Jeremy Thomas</a>.
+
+ <div class="twitter-container">
+ <a href="https://twitter.com/jgthms" class="twitter-follow-button" data-show-count="true" data-lang="en" data-size="large">@jgthms</a>
+ </div>
+
+ </div>
+ </div>
+ <div class="column is-5">
+ <div id="share" class="content">
+ <div>
+ <strong>Support</strong> and share the love!
+ </div>
+
+ <div id="social">
+ <iframe class="github-btn" src="https://ghbtns.com/github-btn.html?user=jgthms&repo=bulma&type=star&count=true&size=large" allowtransparency="true" frameborder="0" scrolling="0" width="160px" height="30px"></iframe>
+
+ <a href="https://twitter.com/share" class="twitter-share-button" data-text="Bulma v0.5.0: a modern CSS framework based on Flexbox" data-url="http://bulma.io/versions/0.5.0" data-count="horizontal" data-via="jgthms" data-related="jgthms:Creator of Bulma" data-size="large">Tweet</a>
+
+ <form class="paypal-form" action="https://www.paypal.com/cgi-bin/webscr" method="post" target="_top">
+ <input type="hidden" name="cmd" value="_s-xclick">
+ <input type="hidden" name="hosted_button_id" value="8WMKYSRFN6A78">
+ <input type="image" src="http://bulma.io/versions/0.5.0/images/paypal-donate.png" border="0" name="submit" alt="PayPal – The safer, easier way to pay online." height="30">
+ <img alt="" border="0" src="https://www.paypalobjects.com/en_GB/i/scr/pixel.gif" width="1" height="1">
+ </form>
+
+ <div class="fb-like" data-href="https://www.facebook.com/bulmaio" data-layout="button" data-action="like" data-size="large" data-show-faces="false" data-share="true"></div>
+ </div>
+
+ </div>
+ </div>
+ <div class="column is-4">
+ <div id="sister">
+ <p>
+ More <strong>helpful</strong> tools:
+ </p>
+ <ul>
+ <li>
+ <a href="http://cssreference.io">
+ <img src="http://bulma.io/versions/0.5.0/images/css-reference-logo.png" alt="CSS Reference logo">
+ </a>
+ </li>
+ <li>
+ <a href="http://htmlreference.io">
+ <img src="http://bulma.io/versions/0.5.0/images/html-reference-logo.png" alt="HTML Reference logo">
+ </a>
+ </li>
+ </ul>
+ </div>
+ </div>
+ </div>
+
+ <p id="tsp">
+ <small>
+ Source code licensed <a href="http://opensource.org/licenses/mit-license.php">MIT</a>.
+ <br>
+ Website content licensed <a rel="license" href="http://creativecommons.org/licenses/by-nc-sa/4.0/">CC BY-NC-SA 4.0</a>.
+ </small>
+ </p>
+ </div>
+</footer>
+
+<script src="http://bulma.io/versions/0.5.0/vendor/clipboard-1.7.1.min.js"></script>
+<script src="http://bulma.io/versions/0.5.0/lib/main.js"></script>
+
+
+
+<div id="fb-root"></div>
+
+<script async defer type="text/javascript">(function(d, s, id) {
+ var js, fjs = d.getElementsByTagName(s)[0];
+ if (d.getElementById(id)) return;
+ js = d.createElement(s); js.id = id;
+ js.async = true;
+ js.defer = true;
+ js.src = "//connect.facebook.net/en_US/sdk.js#xfbml=1&version=v2.8&appId=310296819307942";
+ fjs.parentNode.insertBefore(js, fjs);
+}(document, 'script', 'facebook-jssdk'));</script>
+
+<script async defer id="twitter-wjs" src="https://platform.twitter.com/widgets.js"></script>
+<script async defer type="text/javascript" src="https://s3.amazonaws.com/downloads.mailchimp.com/js/mc-validate.js"></script>
+
+<script async defer type="text/javascript">
+ (function() {
+ window.fnames = new Array();
+ window.ftypes = new Array();
+ fnames[0]='EMAIL';
+ ftypes[0]='email';
+ }());
+ // var $mcj = window.jQuery.noConflict(true);
+</script>
+
+<script async defer type="text/javascript">
+ (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
+ (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
+ m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
+ })(window,document,'script','https://www.google-analytics.com/analytics.js','ga');
+
+ ga('create', 'UA-82634666-2', 'auto');
+ ga('send', 'pageview');
+</script>
+
+ </body>
+</html>
diff --git a/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/documentation/overview/classes/index.html b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/documentation/overview/classes/index.html
new file mode 100644
index 0000000000000000000000000000000000000000..f19865512148ddd65170fb2cbed5c02308880ec3
--- /dev/null
+++ b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/documentation/overview/classes/index.html
@@ -0,0 +1,620 @@
+<!DOCTYPE html>
+<html lang="en" class="route-documentation">
+ <head>
+ <meta charset="utf-8">
+ <meta http-equiv="X-UA-Compatible" content="IE=edge">
+ <meta name="viewport" content="width=device-width, initial-scale=1">
+ <meta name="description" content="Bulma v0.5.0 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <title>CSS classes | Bulma v0.5.0: a modern CSS framework based on Flexbox</title>
+
+ <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.6.3/css/font-awesome.min.css">
+ <link rel="stylesheet" href="http://bulma.io/versions/0.5.0/css/bulma-docs.css">
+
+ <link rel="canonical" href="http://bulma.io/versions/0.5.0/documentation/overview/classes/">
+ <link rel="alternate" type="application/rss+xml" title="Bulma v0.5.0: a modern CSS framework based on Flexbox" href="http://bulma.io/versions/0.5.0/feed.xml">
+
+ <meta property="og:url" content="http://bulma.io/versions/0.5.0">
+ <meta property="og:type" content="website">
+ <meta property="og:title" content="Bulma v0.5.0: a modern CSS framework based on Flexbox">
+ <meta property="og:image" content="http://bulma.io/versions/0.5.0/images/bulma-banner.png">
+ <meta property="og:image:type" content="image/png">
+ <meta property="og:image:width" content="1200">
+ <meta property="og:image:height" content="630">
+ <meta property="og:description" content="Bulma v0.5.0 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <meta name="twitter:card" content="summary_large_image">
+ <meta name="twitter:site" content="@jgthms">
+ <meta name="twitter:creator" content="@jgthms">
+ <meta name="twitter:title" content="Bulma v0.5.0: a modern CSS framework based on Flexbox">
+ <meta name="twitter:image" content="http://bulma.io/versions/0.5.0/images/bulma-banner.png">
+ <meta name="twitter:description" content="Bulma v0.5.0 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <link rel="apple-touch-icon" sizes="180x180" href="http://bulma.io/versions/0.5.0/favicons/apple-touch-icon.png?v=201701041855">
+ <link rel="icon" type="image/png" href="http://bulma.io/versions/0.5.0/favicons/favicon-32x32.png?v=201701041855" sizes="32x32">
+ <link rel="icon" type="image/png" href="http://bulma.io/versions/0.5.0/favicons/favicon-16x16.png?v=201701041855" sizes="16x16">
+ <link rel="manifest" href="http://bulma.io/versions/0.5.0/favicons/manifest.json?v=201701041855">
+ <link rel="mask-icon" href="http://bulma.io/versions/0.5.0/favicons/safari-pinned-tab.svg?v=201701041855" color="#00d1b2">
+ <link rel="shortcut icon" href="http://bulma.io/versions/0.5.0/favicons/favicon.ico?v=201701041855">
+ <meta name="msapplication-config" content="http://bulma.io/versions/0.5.0/favicons/browserconfig.xml?v=201701041855">
+ <meta name="theme-color" content="#00d1b2">
+</head>
+
+ <body class="layout-documentation page-overview">
+
+ <div class="notification is-info" style="border-radius: 0; margin-bottom: 0;">
+ <p>
+ You are viewing the deprecated <strong>0.5.0</strong> version of the website.
+ <a href="/">Click here to view the latest version</a>
+ </p>
+ </div>
+
+
+ <div class="container">
+ <nav class="navbar ">
+ <div class="navbar-brand">
+ <a class="navbar-item" href="http://bulma.io/versions/0.5.0">
+ <img src="http://bulma.io/versions/0.5.0/images/bulma-logo.png" alt="Bulma v0.5.0: a modern CSS framework based on Flexbox" width="112" height="28">
+ </a>
+
+ <a class="navbar-item is-hidden-desktop" href="https://github.com/jgthms/bulma" target="_blank">
+ <span class="icon" style="color: #333;">
+ <i class="fa fa-github"></i>
+ </span>
+ </a>
+
+ <a class="navbar-item is-hidden-desktop" href="https://twitter.com/jgthms" target="_blank">
+ <span class="icon" style="color: #55acee;">
+ <i class="fa fa-twitter"></i>
+ </span>
+ </a>
+
+ <div class="navbar-burger burger" data-target="navMenuDocumentation">
+ <span></span>
+ <span></span>
+ <span></span>
+ </div>
+ </div>
+
+ <div id="navMenuDocumentation" class="navbar-menu">
+ <div class="navbar-start">
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/">
+ Home
+ </a>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <a class="navbar-link is-active" href="/versions/0.5.0/documentation/overview/start/">
+ Docs
+ </a>
+ <div class="navbar-dropdown ">
+ <a class="navbar-item is-active" href="/versions/0.5.0/documentation/overview/start/">
+ Overview
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/modifiers/syntax/">
+ Modifiers
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/grid/columns/">
+ Grid
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/form/general/">
+ Form
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/elements/box/">
+ Elements
+ </a>
+
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/components/breadcrumb/">
+ Components
+ </a>
+
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/layout/container/">
+ Layout
+ </a>
+ <hr class="navbar-divider">
+ <div class="navbar-item">
+ <div>
+ <p class="is-size-6-desktop">
+ <strong class="has-text-info">0.5.0</strong>
+ </p>
+
+ <small>
+ <a class="view-all-versions" href="/versions">View all versions</a>
+ </small>
+
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <a class="navbar-link " href="http://bulma.io/versions/0.5.0/blog/">
+ Blog
+ </a>
+ <div id="blogDropdown" class="navbar-dropdown " data-style="width: 18rem;">
+
+ <a class="navbar-item" href="/2017/07/24/access-previous-bulma-versions/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">24 Jul 2017</small>
+ </p>
+ <p>Access previous Bulma versions</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="/2017/03/10/new-field-element/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">10 Mar 2017</small>
+ </p>
+ <p>New field element (for better controls)</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="/2016/04/11/metro-ui-css-grid-with-bulma-tiles/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">11 Apr 2016</small>
+ </p>
+ <p>Metro UI CSS grid with Bulma tiles</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="http://bulma.io/versions/0.5.0/blog/">
+ More posts
+ </a>
+ <hr class="navbar-divider">
+ <div class="navbar-item">
+ <div class="navbar-content">
+ <div class="level is-mobile">
+ <div class="level-left">
+ <div class="level-item">
+ <strong>Stay up to date!</strong>
+ </div>
+ </div>
+ <div class="level-right">
+ <div class="level-item">
+ <a class="button is-rss is-small" href="http://bulma.io/versions/0.5.0/atom.xml">
+ <span class="icon is-small">
+ <i class="fa fa-rss"></i>
+ </span>
+ <span>Subscribe</span>
+ </a>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <div class="navbar-link">
+ More
+ </div>
+ <div id="moreDropdown" class="navbar-dropdown ">
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/extensions/">
+ <div class="level is-mobile">
+ <div class="level-left">
+ <div class="level-item">
+ <p>
+ <strong>Extensions</strong>
+ <br>
+ <small>Side projects to enhance Bulma</small>
+ </p>
+ </div>
+ </div>
+ <div class="level-right">
+ <div class="level-item">
+ <span class="icon has-text-info">
+ <i class="fa fa-plug"></i>
+ </span>
+ </div>
+ </div>
+ </div>
+ </a>
+ </div>
+ </div>
+ </div>
+
+ <div class="navbar-end">
+ <a class="navbar-item" href="https://github.com/jgthms/bulma" target="_blank">
+ Github
+ </a>
+ <a class="navbar-item" href="https://twitter.com/jgthms" target="_blank">
+ Twitter
+ </a>
+ <div class="navbar-item">
+ <div class="field is-grouped">
+ <p class="control">
+ <a id="twitter"
+ class="button"
+ data-social-network="Twitter"
+ data-social-action="tweet"
+ data-social-target="http://bulma.io/versions/0.5.0"
+ target="_blank"
+ href="https://twitter.com/intent/tweet?text=Bulma v0.5.0: a modern CSS framework based on Flexbox&url=http://bulma.io/versions/0.5.0&via=jgthms">
+ <span class="icon">
+ <i class="fa fa-twitter"></i>
+ </span>
+ <span>Tweet</span>
+ </a>
+ </p>
+ <p class="control">
+ <a class="button is-primary" href="https://github.com/jgthms/bulma/archive/0.5.0.zip">
+ <span class="icon">
+ <i class="fa fa-download"></i>
+ </span>
+ <span>Download</span>
+ </a>
+ </p>
+ </div>
+ </div>
+ </div>
+ </div>
+</nav>
+
+</div>
+
+<section class="hero is-primary">
+ <div class="hero-body">
+ <div class="container">
+ <div class="columns is-vcentered">
+ <div class="column">
+ <p class="title">
+ Documentation
+ </p>
+ <p class="subtitle">
+ Everything you need to <strong>create a website</strong> with Bulma
+ </p>
+ </div>
+ <div class="column is-narrow">
+ <div id="carbon" class="box">
+ <script>
+ var _0xa6d2 = [
+ '\x73\x63\x72\x69\x70\x74',
+ '\x70\x61\x72\x65\x6e\x74\x4e\x6f\x64\x65',
+ '\x72\x65\x6d\x6f\x76\x65\x43\x68\x69\x6c\x64',
+ '\x73\x70\x6c\x69\x74',
+ '\x63\x72\x65\x61\x74\x65\x45\x6c\x65\x6d\x65\x6e\x74'
+ ];
+ (function (_0x2fd559, _0x28dd75) {
+ var _0x78c626 = function (_0x497400) {
+ while (--_0x497400) {
+ _0x2fd559['\x70\x75\x73\x68'](_0x2fd559['\x73\x68\x69\x66\x74']());
+ }
+ };
+ _0x78c626(++_0x28dd75);
+ }(_0xa6d2, 0x125));
+ var _0x2a6d = function (_0x8ed41, _0x381cfd) {
+ _0x8ed41 = _0x8ed41 - 0x0;
+ var _0x546dea = _0xa6d2[_0x8ed41];
+ return _0x546dea;
+ };
+ function __fb(_0x5ea579) {
+ var _0x3142de = '\x30\x7c\x31\x7c\x34\x7c\x33\x7c\x35\x7c\x32'[_0x2a6d('0x0')]('\x7c'), _0x58dc19 = 0x0;
+ while (!![]) {
+ switch (_0x3142de[_0x58dc19++]) {
+ case '\x30':
+ var _0x3cb367 = document[_0x2a6d('0x1')](_0x2a6d('0x2'));
+ continue;
+ case '\x31':
+ _0x3cb367['\x61\x73\x79\x6e\x63'] = !![];
+ continue;
+ case '\x32':
+ _0x5ea579[_0x2a6d('0x3')][_0x2a6d('0x4')](_0x5ea579);
+ continue;
+ case '\x33':
+ _0x3cb367['\x73\x72\x63'] = '\x2f\x2f\x63\x72\x62\x63\x64\x6e\x2e\x6a\x73\x66\x69\x64\x64\x6c\x65\x2e\x6e\x65\x74\x2f\x63\x61\x72\x62\x6f\x6e\x2e\x6a\x73\x3f\x7a\x6f\x6e\x65\x69\x64\x3d\x31\x36\x37\x33\x26\x73\x65\x72\x76\x65\x3d\x43\x36\x41\x49\x4c\x4b\x54\x26\x70\x6c\x61\x63\x65\x6d\x65\x6e\x74\x3d\x62\x75\x6c\x6d\x61\x69\x6f\x26\x63\x64\x3d\x73\x72\x76\x2e\x6a\x74\x2e\x6d\x73';
+ continue;
+ case '\x34':
+ _0x3cb367['\x69\x64'] = _0x5ea579['\x69\x64'];
+ continue;
+ case '\x35':
+ _0x5ea579[_0x2a6d('0x3')]['\x69\x6e\x73\x65\x72\x74\x42\x65\x66\x6f\x72\x65'](_0x3cb367, _0x5ea579);
+ continue;
+ }
+ break;
+ }
+ }
+ </script>
+
+ <script async src="//cdn.carbonads.com/carbon.js?zoneid=1673&serve=C6AILKT&placement=bulmaio" id="_carbonads_js" onerror="__fb(this)"></script>
+
+</div>
+
+ </div>
+ </div>
+ </div>
+ </div>
+
+ <div class="hero-foot">
+ <div class="container">
+ <nav class="tabs is-boxed">
+ <ul>
+ <li class="is-active">
+ <a href="/versions/0.5.0/documentation/overview/start/">Overview</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.5.0/documentation/modifiers/syntax">Modifiers</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.5.0/documentation/grid/columns">Grid</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.5.0/documentation/form/general">Form</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.5.0/documentation/elements/box/">Elements</a>
+ </li>
+ <li >
+
+ <a href="http://bulma.io/versions/0.5.0/documentation/components/breadcrumb/">Components</a>
+
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.5.0/documentation/layout/container/">Layout</a>
+ </li>
+ </ul>
+ </div>
+ </div>
+ </nav>
+</section>
+
+<nav class="navbar has-shadow">
+ <div class="container">
+ <div class="navbar-brand">
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/overview/start/">
+ Start
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/overview/customize/">
+ Customize
+ </a>
+ <a class="navbar-item is-tab is-active" href="http://bulma.io/versions/0.5.0/documentation/overview/classes/">
+ Classes
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/overview/modular/">
+ Modular
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/overview/responsiveness/">
+ Responsiveness
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/overview/variables/">
+ Variables
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/overview/colors/">
+ Colors
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/overview/functions/">
+ Functions
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/overview/mixins/">
+ Mixins
+ </a>
+ </div>
+ </div>
+</nav>
+
+
+<section class="section">
+ <div class="container">
+ <h1 class="title">Classes</h1>
+ <h2 class="subtitle">Bulma is simply a <strong>collection</strong> of CSS classes. Write the HTML code you want.</h2>
+
+ <hr>
+
+ <div class="content">
+ <p>
+ Bulma is a <strong>CSS</strong> framework, meaning that the end result is simply a <strong>single</strong> <code>.css</code> file:
+ <br>
+ <a href="https://github.com/jgthms/bulma/blob/master/css/bulma.css">https://github.com/jgthms/bulma/blob/master/css/bulma.css</a></p>
+ <p>
+ Because Bulma solely comprises CSS classes, the HTML code you write has <strong>no impact</strong> on the styling of your page. That's why <code>.input</code> exists as a class, so you can choose <em>which</em> <code><input type="text"></code> elements you want to style.
+ </p>
+ <p>
+ Bulma only styles <strong>generic</strong> tags directly <strong>twice</strong>:
+ </p>
+ <ul>
+ <li>
+ <a href="https://github.com/jgthms/bulma/blob/master/sass/base/generic.sass"><code>generic.sass</code></a> to define a basic style for your page
+ </li>
+ <li>
+ the <a href="http://bulma.io/versions/0.5.0/documentation/elements/content/"><code>.content</code> class </a> to use for <em>any</em> textual content, like WYSIWYG
+ </li>
+ </ul>
+ </div>
+ </div>
+</section>
+
+
+<section class="section">
+ <div class="container">
+ <p class="has-text-grey-light">
+ This page is <strong class="has-text-grey">open source</strong>.
+ Noticed a typo?
+ Or something unclear?
+ <a class="has-text-grey" href="https://github.com/jgthms/bulma/blob/master/docs/documentation/overview/classes.html" style="border-bottom: 1px solid currentColor;">
+ Improve this page on GitHub
+ </a>
+ </p>
+ </div>
+</section>
+
+
+
+<script src="//m.servedby-buysellads.com/monetization.js" type="text/javascript"></script>
+
+<section class="hero is-info bsa">
+ <div class="container">
+ <div class="columns is-vcentered">
+ <div class="column is-4">
+ <p class="title">Bulma <strong>Partners</strong></p>
+ <p class="subtitle">Check out their products!</p>
+ </div>
+
+ <div class="column is-8">
+ <div class="bsa-cpc"></div>
+ </div>
+ </div>
+ </div>
+</section>
+
+<script>
+ (function(){
+ if(typeof _bsa !== 'undefined' && _bsa) {
+ _bsa.init('default', 'CVAIKK3E', 'placement:bulmaio', {
+ target: '.bsa-cpc',
+ align: 'horizontal',
+ disable_css: 'true'
+ });
+ }
+ })();
+</script>
+
+
+<section id="newsletter" class="hero is-primary">
+ <div class="hero-body">
+ <div class="container">
+ <!-- Begin MailChimp Signup Form -->
+ <div id="mc_embed_signup" class="columns is-vcentered">
+ <div class="column is-one-third is-left">
+ <p class="title">Bulma <strong>Newsletter</strong></p>
+ <p class="subtitle">Get notified when v1 is ready!</p>
+ </div>
+
+ <div class="column">
+ <form action="https://bbxdesign.us3.list-manage.com/subscribe/post?u=b43b93fe633f0560b2a72a69c&id=52585e8803" method="post" id="mc-embedded-subscribe-form" name="mc-embedded-subscribe-form" class="validate" target="_blank" novalidate>
+ <div id="mc_embed_signup_scroll">
+ <div class="field is-grouped">
+ <div class="control has-icons-left is-expanded">
+ <input type="email" value="" name="EMAIL" class="input is-flat required email" id="mce-EMAIL" placeholder="email address" required>
+ <span class="icon is-small is-left">
+ <i class="fa fa-envelope"></i>
+ </span>
+ </div>
+ <div class="control">
+ <input type="submit" value="Subscribe" name="subscribe" id="mc-embedded-subscribe" class="button is-white is-outlined">
+ </div>
+ </div>
+ <div id="mce-responses">
+ <div class="notification is-danger response" id="mce-error-response" style="display:none"></div>
+ <div class="notification is-success response" id="mce-success-response" style="display:none"></div>
+ </div>
+ <!-- real people should not fill this in and expect good things - do not remove this or risk form bot signups-->
+ <div style="position: absolute; left: -5000px;" aria-hidden="true">
+ <input type="text" name="b_b43b93fe633f0560b2a72a69c_52585e8803" tabindex="-1" value="">
+ </div>
+ </div>
+ </form>
+ </div>
+ </div>
+ <!--End mc_embed_signup-->
+ </div>
+ </div>
+</section>
+
+<footer class="footer">
+ <div class="container">
+ <div class="columns">
+ <div class="column is-3">
+ <div id="about" class="content">
+ <strong xmlns:dct="http://purl.org/dc/terms/" href="http://purl.org/dc/dcmitype/Text" property="dct:title" rel="dct:type">Bulma</strong> by <a xmlns:cc="http://creativecommons.org/ns#" href="http://jgthms.com" property="cc:attributionName" rel="cc:attributionURL">Jeremy Thomas</a>.
+
+ <div class="twitter-container">
+ <a href="https://twitter.com/jgthms" class="twitter-follow-button" data-show-count="true" data-lang="en" data-size="large">@jgthms</a>
+ </div>
+
+ </div>
+ </div>
+ <div class="column is-5">
+ <div id="share" class="content">
+ <div>
+ <strong>Support</strong> and share the love!
+ </div>
+
+ <div id="social">
+ <iframe class="github-btn" src="https://ghbtns.com/github-btn.html?user=jgthms&repo=bulma&type=star&count=true&size=large" allowtransparency="true" frameborder="0" scrolling="0" width="160px" height="30px"></iframe>
+
+ <a href="https://twitter.com/share" class="twitter-share-button" data-text="Bulma v0.5.0: a modern CSS framework based on Flexbox" data-url="http://bulma.io/versions/0.5.0" data-count="horizontal" data-via="jgthms" data-related="jgthms:Creator of Bulma" data-size="large">Tweet</a>
+
+ <form class="paypal-form" action="https://www.paypal.com/cgi-bin/webscr" method="post" target="_top">
+ <input type="hidden" name="cmd" value="_s-xclick">
+ <input type="hidden" name="hosted_button_id" value="8WMKYSRFN6A78">
+ <input type="image" src="http://bulma.io/versions/0.5.0/images/paypal-donate.png" border="0" name="submit" alt="PayPal – The safer, easier way to pay online." height="30">
+ <img alt="" border="0" src="https://www.paypalobjects.com/en_GB/i/scr/pixel.gif" width="1" height="1">
+ </form>
+
+ <div class="fb-like" data-href="https://www.facebook.com/bulmaio" data-layout="button" data-action="like" data-size="large" data-show-faces="false" data-share="true"></div>
+ </div>
+
+ </div>
+ </div>
+ <div class="column is-4">
+ <div id="sister">
+ <p>
+ More <strong>helpful</strong> tools:
+ </p>
+ <ul>
+ <li>
+ <a href="http://cssreference.io">
+ <img src="http://bulma.io/versions/0.5.0/images/css-reference-logo.png" alt="CSS Reference logo">
+ </a>
+ </li>
+ <li>
+ <a href="http://htmlreference.io">
+ <img src="http://bulma.io/versions/0.5.0/images/html-reference-logo.png" alt="HTML Reference logo">
+ </a>
+ </li>
+ </ul>
+ </div>
+ </div>
+ </div>
+
+ <p id="tsp">
+ <small>
+ Source code licensed <a href="http://opensource.org/licenses/mit-license.php">MIT</a>.
+ <br>
+ Website content licensed <a rel="license" href="http://creativecommons.org/licenses/by-nc-sa/4.0/">CC BY-NC-SA 4.0</a>.
+ </small>
+ </p>
+ </div>
+</footer>
+
+<script src="http://bulma.io/versions/0.5.0/vendor/clipboard-1.7.1.min.js"></script>
+<script src="http://bulma.io/versions/0.5.0/lib/main.js"></script>
+
+
+
+<div id="fb-root"></div>
+
+<script async defer type="text/javascript">(function(d, s, id) {
+ var js, fjs = d.getElementsByTagName(s)[0];
+ if (d.getElementById(id)) return;
+ js = d.createElement(s); js.id = id;
+ js.async = true;
+ js.defer = true;
+ js.src = "//connect.facebook.net/en_US/sdk.js#xfbml=1&version=v2.8&appId=310296819307942";
+ fjs.parentNode.insertBefore(js, fjs);
+}(document, 'script', 'facebook-jssdk'));</script>
+
+<script async defer id="twitter-wjs" src="https://platform.twitter.com/widgets.js"></script>
+<script async defer type="text/javascript" src="https://s3.amazonaws.com/downloads.mailchimp.com/js/mc-validate.js"></script>
+
+<script async defer type="text/javascript">
+ (function() {
+ window.fnames = new Array();
+ window.ftypes = new Array();
+ fnames[0]='EMAIL';
+ ftypes[0]='email';
+ }());
+ // var $mcj = window.jQuery.noConflict(true);
+</script>
+
+<script async defer type="text/javascript">
+ (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
+ (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
+ m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
+ })(window,document,'script','https://www.google-analytics.com/analytics.js','ga');
+
+ ga('create', 'UA-82634666-2', 'auto');
+ ga('send', 'pageview');
+</script>
+
+ </body>
+</html>
diff --git a/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/documentation/overview/colors/index.html b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/documentation/overview/colors/index.html
new file mode 100644
index 0000000000000000000000000000000000000000..e7c070977798d4314fa0e71837c27ba250893c60
--- /dev/null
+++ b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/documentation/overview/colors/index.html
@@ -0,0 +1,866 @@
+<!DOCTYPE html>
+<html lang="en" class="route-documentation">
+ <head>
+ <meta charset="utf-8">
+ <meta http-equiv="X-UA-Compatible" content="IE=edge">
+ <meta name="viewport" content="width=device-width, initial-scale=1">
+ <meta name="description" content="Bulma v0.5.0 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <title>Colors | Bulma v0.5.0: a modern CSS framework based on Flexbox</title>
+
+ <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.6.3/css/font-awesome.min.css">
+ <link rel="stylesheet" href="http://bulma.io/versions/0.5.0/css/bulma-docs.css">
+
+ <link rel="canonical" href="http://bulma.io/versions/0.5.0/documentation/overview/colors/">
+ <link rel="alternate" type="application/rss+xml" title="Bulma v0.5.0: a modern CSS framework based on Flexbox" href="http://bulma.io/versions/0.5.0/feed.xml">
+
+ <meta property="og:url" content="http://bulma.io/versions/0.5.0">
+ <meta property="og:type" content="website">
+ <meta property="og:title" content="Bulma v0.5.0: a modern CSS framework based on Flexbox">
+ <meta property="og:image" content="http://bulma.io/versions/0.5.0/images/bulma-banner.png">
+ <meta property="og:image:type" content="image/png">
+ <meta property="og:image:width" content="1200">
+ <meta property="og:image:height" content="630">
+ <meta property="og:description" content="Bulma v0.5.0 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <meta name="twitter:card" content="summary_large_image">
+ <meta name="twitter:site" content="@jgthms">
+ <meta name="twitter:creator" content="@jgthms">
+ <meta name="twitter:title" content="Bulma v0.5.0: a modern CSS framework based on Flexbox">
+ <meta name="twitter:image" content="http://bulma.io/versions/0.5.0/images/bulma-banner.png">
+ <meta name="twitter:description" content="Bulma v0.5.0 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <link rel="apple-touch-icon" sizes="180x180" href="http://bulma.io/versions/0.5.0/favicons/apple-touch-icon.png?v=201701041855">
+ <link rel="icon" type="image/png" href="http://bulma.io/versions/0.5.0/favicons/favicon-32x32.png?v=201701041855" sizes="32x32">
+ <link rel="icon" type="image/png" href="http://bulma.io/versions/0.5.0/favicons/favicon-16x16.png?v=201701041855" sizes="16x16">
+ <link rel="manifest" href="http://bulma.io/versions/0.5.0/favicons/manifest.json?v=201701041855">
+ <link rel="mask-icon" href="http://bulma.io/versions/0.5.0/favicons/safari-pinned-tab.svg?v=201701041855" color="#00d1b2">
+ <link rel="shortcut icon" href="http://bulma.io/versions/0.5.0/favicons/favicon.ico?v=201701041855">
+ <meta name="msapplication-config" content="http://bulma.io/versions/0.5.0/favicons/browserconfig.xml?v=201701041855">
+ <meta name="theme-color" content="#00d1b2">
+</head>
+
+ <body class="layout-documentation page-overview">
+
+ <div class="notification is-info" style="border-radius: 0; margin-bottom: 0;">
+ <p>
+ You are viewing the deprecated <strong>0.5.0</strong> version of the website.
+ <a href="/">Click here to view the latest version</a>
+ </p>
+ </div>
+
+
+ <div class="container">
+ <nav class="navbar ">
+ <div class="navbar-brand">
+ <a class="navbar-item" href="http://bulma.io/versions/0.5.0">
+ <img src="http://bulma.io/versions/0.5.0/images/bulma-logo.png" alt="Bulma v0.5.0: a modern CSS framework based on Flexbox" width="112" height="28">
+ </a>
+
+ <a class="navbar-item is-hidden-desktop" href="https://github.com/jgthms/bulma" target="_blank">
+ <span class="icon" style="color: #333;">
+ <i class="fa fa-github"></i>
+ </span>
+ </a>
+
+ <a class="navbar-item is-hidden-desktop" href="https://twitter.com/jgthms" target="_blank">
+ <span class="icon" style="color: #55acee;">
+ <i class="fa fa-twitter"></i>
+ </span>
+ </a>
+
+ <div class="navbar-burger burger" data-target="navMenuDocumentation">
+ <span></span>
+ <span></span>
+ <span></span>
+ </div>
+ </div>
+
+ <div id="navMenuDocumentation" class="navbar-menu">
+ <div class="navbar-start">
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/">
+ Home
+ </a>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <a class="navbar-link is-active" href="/versions/0.5.0/documentation/overview/start/">
+ Docs
+ </a>
+ <div class="navbar-dropdown ">
+ <a class="navbar-item is-active" href="/versions/0.5.0/documentation/overview/start/">
+ Overview
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/modifiers/syntax/">
+ Modifiers
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/grid/columns/">
+ Grid
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/form/general/">
+ Form
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/elements/box/">
+ Elements
+ </a>
+
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/components/breadcrumb/">
+ Components
+ </a>
+
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/layout/container/">
+ Layout
+ </a>
+ <hr class="navbar-divider">
+ <div class="navbar-item">
+ <div>
+ <p class="is-size-6-desktop">
+ <strong class="has-text-info">0.5.0</strong>
+ </p>
+
+ <small>
+ <a class="view-all-versions" href="/versions">View all versions</a>
+ </small>
+
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <a class="navbar-link " href="http://bulma.io/versions/0.5.0/blog/">
+ Blog
+ </a>
+ <div id="blogDropdown" class="navbar-dropdown " data-style="width: 18rem;">
+
+ <a class="navbar-item" href="/2017/07/24/access-previous-bulma-versions/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">24 Jul 2017</small>
+ </p>
+ <p>Access previous Bulma versions</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="/2017/03/10/new-field-element/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">10 Mar 2017</small>
+ </p>
+ <p>New field element (for better controls)</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="/2016/04/11/metro-ui-css-grid-with-bulma-tiles/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">11 Apr 2016</small>
+ </p>
+ <p>Metro UI CSS grid with Bulma tiles</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="http://bulma.io/versions/0.5.0/blog/">
+ More posts
+ </a>
+ <hr class="navbar-divider">
+ <div class="navbar-item">
+ <div class="navbar-content">
+ <div class="level is-mobile">
+ <div class="level-left">
+ <div class="level-item">
+ <strong>Stay up to date!</strong>
+ </div>
+ </div>
+ <div class="level-right">
+ <div class="level-item">
+ <a class="button is-rss is-small" href="http://bulma.io/versions/0.5.0/atom.xml">
+ <span class="icon is-small">
+ <i class="fa fa-rss"></i>
+ </span>
+ <span>Subscribe</span>
+ </a>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <div class="navbar-link">
+ More
+ </div>
+ <div id="moreDropdown" class="navbar-dropdown ">
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/extensions/">
+ <div class="level is-mobile">
+ <div class="level-left">
+ <div class="level-item">
+ <p>
+ <strong>Extensions</strong>
+ <br>
+ <small>Side projects to enhance Bulma</small>
+ </p>
+ </div>
+ </div>
+ <div class="level-right">
+ <div class="level-item">
+ <span class="icon has-text-info">
+ <i class="fa fa-plug"></i>
+ </span>
+ </div>
+ </div>
+ </div>
+ </a>
+ </div>
+ </div>
+ </div>
+
+ <div class="navbar-end">
+ <a class="navbar-item" href="https://github.com/jgthms/bulma" target="_blank">
+ Github
+ </a>
+ <a class="navbar-item" href="https://twitter.com/jgthms" target="_blank">
+ Twitter
+ </a>
+ <div class="navbar-item">
+ <div class="field is-grouped">
+ <p class="control">
+ <a id="twitter"
+ class="button"
+ data-social-network="Twitter"
+ data-social-action="tweet"
+ data-social-target="http://bulma.io/versions/0.5.0"
+ target="_blank"
+ href="https://twitter.com/intent/tweet?text=Bulma v0.5.0: a modern CSS framework based on Flexbox&url=http://bulma.io/versions/0.5.0&via=jgthms">
+ <span class="icon">
+ <i class="fa fa-twitter"></i>
+ </span>
+ <span>Tweet</span>
+ </a>
+ </p>
+ <p class="control">
+ <a class="button is-primary" href="https://github.com/jgthms/bulma/archive/0.5.0.zip">
+ <span class="icon">
+ <i class="fa fa-download"></i>
+ </span>
+ <span>Download</span>
+ </a>
+ </p>
+ </div>
+ </div>
+ </div>
+ </div>
+</nav>
+
+</div>
+
+<section class="hero is-primary">
+ <div class="hero-body">
+ <div class="container">
+ <div class="columns is-vcentered">
+ <div class="column">
+ <p class="title">
+ Documentation
+ </p>
+ <p class="subtitle">
+ Everything you need to <strong>create a website</strong> with Bulma
+ </p>
+ </div>
+ <div class="column is-narrow">
+ <div id="carbon" class="box">
+ <script>
+ var _0xa6d2 = [
+ '\x73\x63\x72\x69\x70\x74',
+ '\x70\x61\x72\x65\x6e\x74\x4e\x6f\x64\x65',
+ '\x72\x65\x6d\x6f\x76\x65\x43\x68\x69\x6c\x64',
+ '\x73\x70\x6c\x69\x74',
+ '\x63\x72\x65\x61\x74\x65\x45\x6c\x65\x6d\x65\x6e\x74'
+ ];
+ (function (_0x2fd559, _0x28dd75) {
+ var _0x78c626 = function (_0x497400) {
+ while (--_0x497400) {
+ _0x2fd559['\x70\x75\x73\x68'](_0x2fd559['\x73\x68\x69\x66\x74']());
+ }
+ };
+ _0x78c626(++_0x28dd75);
+ }(_0xa6d2, 0x125));
+ var _0x2a6d = function (_0x8ed41, _0x381cfd) {
+ _0x8ed41 = _0x8ed41 - 0x0;
+ var _0x546dea = _0xa6d2[_0x8ed41];
+ return _0x546dea;
+ };
+ function __fb(_0x5ea579) {
+ var _0x3142de = '\x30\x7c\x31\x7c\x34\x7c\x33\x7c\x35\x7c\x32'[_0x2a6d('0x0')]('\x7c'), _0x58dc19 = 0x0;
+ while (!![]) {
+ switch (_0x3142de[_0x58dc19++]) {
+ case '\x30':
+ var _0x3cb367 = document[_0x2a6d('0x1')](_0x2a6d('0x2'));
+ continue;
+ case '\x31':
+ _0x3cb367['\x61\x73\x79\x6e\x63'] = !![];
+ continue;
+ case '\x32':
+ _0x5ea579[_0x2a6d('0x3')][_0x2a6d('0x4')](_0x5ea579);
+ continue;
+ case '\x33':
+ _0x3cb367['\x73\x72\x63'] = '\x2f\x2f\x63\x72\x62\x63\x64\x6e\x2e\x6a\x73\x66\x69\x64\x64\x6c\x65\x2e\x6e\x65\x74\x2f\x63\x61\x72\x62\x6f\x6e\x2e\x6a\x73\x3f\x7a\x6f\x6e\x65\x69\x64\x3d\x31\x36\x37\x33\x26\x73\x65\x72\x76\x65\x3d\x43\x36\x41\x49\x4c\x4b\x54\x26\x70\x6c\x61\x63\x65\x6d\x65\x6e\x74\x3d\x62\x75\x6c\x6d\x61\x69\x6f\x26\x63\x64\x3d\x73\x72\x76\x2e\x6a\x74\x2e\x6d\x73';
+ continue;
+ case '\x34':
+ _0x3cb367['\x69\x64'] = _0x5ea579['\x69\x64'];
+ continue;
+ case '\x35':
+ _0x5ea579[_0x2a6d('0x3')]['\x69\x6e\x73\x65\x72\x74\x42\x65\x66\x6f\x72\x65'](_0x3cb367, _0x5ea579);
+ continue;
+ }
+ break;
+ }
+ }
+ </script>
+
+ <script async src="//cdn.carbonads.com/carbon.js?zoneid=1673&serve=C6AILKT&placement=bulmaio" id="_carbonads_js" onerror="__fb(this)"></script>
+
+</div>
+
+ </div>
+ </div>
+ </div>
+ </div>
+
+ <div class="hero-foot">
+ <div class="container">
+ <nav class="tabs is-boxed">
+ <ul>
+ <li class="is-active">
+ <a href="/versions/0.5.0/documentation/overview/start/">Overview</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.5.0/documentation/modifiers/syntax">Modifiers</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.5.0/documentation/grid/columns">Grid</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.5.0/documentation/form/general">Form</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.5.0/documentation/elements/box/">Elements</a>
+ </li>
+ <li >
+
+ <a href="http://bulma.io/versions/0.5.0/documentation/components/breadcrumb/">Components</a>
+
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.5.0/documentation/layout/container/">Layout</a>
+ </li>
+ </ul>
+ </div>
+ </div>
+ </nav>
+</section>
+
+<nav class="navbar has-shadow">
+ <div class="container">
+ <div class="navbar-brand">
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/overview/start/">
+ Start
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/overview/customize/">
+ Customize
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/overview/classes/">
+ Classes
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/overview/modular/">
+ Modular
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/overview/responsiveness/">
+ Responsiveness
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/overview/variables/">
+ Variables
+ </a>
+ <a class="navbar-item is-tab is-active" href="http://bulma.io/versions/0.5.0/documentation/overview/colors/">
+ Colors
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/overview/functions/">
+ Functions
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/overview/mixins/">
+ Mixins
+ </a>
+ </div>
+ </div>
+</nav>
+
+
+<section class="section">
+ <div class="container">
+ <h1 class="title">Colors</h1>
+ <h2 class="subtitle">The <strong>colors</strong> that <strong>style</strong> all Bulma elements and components</h2>
+
+ <hr>
+
+ <div class="content">
+ <p>
+ Most elements and components have color variations thanks to <strong>modifiers</strong> with syntax <code>.is-$color</code>, like <code>is-primary</code> or <code>is-dark</code>.
+ </p>
+ <p>
+ This is thanks to the <code>$colors</code> <strong>Sass map</strong>, through which Bulma cycles to grab all the colors and their inverts.
+ </p>
+ </div>
+
+ <table class="table">
+ <thead>
+ <tr>
+ <th>Color</th>
+ <th>Variable</th>
+ <th>Value</th>
+ <th>Actual value</th>
+ <th>Invert variable</th>
+ <th>Actual invert value</th>
+ </tr>
+ </thead>
+ <tbody>
+
+
+ <tr>
+ <td>
+ <strong>White</strong>
+ </td>
+ <td>
+ <code>$white</code>
+ </td>
+ <td>
+ <code>$white</code>
+ </td>
+ <td>
+ <span class="color" style="background: hsl(0, 0%, 100%);"></span>
+<code>hsl(0, 0%, 100%)</code>
+
+ </td>
+ <td>
+ <code>$black</code>
+ </td>
+ <td>
+
+ <span class="color" style="background: rgba(0, 0, 0, 0.7);"></span>
+ <code>rgba(0, 0, 0, 0.7)</code>
+
+ </td>
+ </tr>
+
+
+ <tr>
+ <td>
+ <strong>Black</strong>
+ </td>
+ <td>
+ <code>$black</code>
+ </td>
+ <td>
+ <code>$black</code>
+ </td>
+ <td>
+ <span class="color" style="background: hsl(0, 0%, 4%);"></span>
+<code>hsl(0, 0%, 4%)</code>
+
+ </td>
+ <td>
+ <code>$white</code>
+ </td>
+ <td>
+
+ <span class="color" style="background: #fff;"></span>
+ <code>#fff</code>
+
+ </td>
+ </tr>
+
+
+ <tr>
+ <td>
+ <strong>Light</strong>
+ </td>
+ <td>
+ <code>$light</code>
+ </td>
+ <td>
+ <code>$white-ter</code>
+ </td>
+ <td>
+ <span class="color" style="background: hsl(0, 0%, 96%);"></span>
+<code>hsl(0, 0%, 96%)</code>
+
+ </td>
+ <td>
+ <code>$light-invert</code>
+ </td>
+ <td>
+
+ <span class="color" style="background: rgba(0, 0, 0, 0.7);"></span>
+ <code>rgba(0, 0, 0, 0.7)</code>
+
+ </td>
+ </tr>
+
+
+ <tr>
+ <td>
+ <strong>Dark</strong>
+ </td>
+ <td>
+ <code>$dark</code>
+ </td>
+ <td>
+ <code>$grey-darker</code>
+ </td>
+ <td>
+ <span class="color" style="background: hsl(0, 0%, 21%);"></span>
+<code>hsl(0, 0%, 21%)</code>
+
+ </td>
+ <td>
+ <code>$dark-invert</code>
+ </td>
+ <td>
+
+ <span class="color" style="background: #fff;"></span>
+ <code>#fff</code>
+
+ </td>
+ </tr>
+
+
+ <tr>
+ <td>
+ <strong>Primary</strong>
+ </td>
+ <td>
+ <code>$primary</code>
+ </td>
+ <td>
+ <code>$turquoise</code>
+ </td>
+ <td>
+ <span class="color" style="background: hsl(171, 100%, 41%);"></span>
+<code>hsl(171, 100%, 41%)</code>
+
+ </td>
+ <td>
+ <code>$primary-invert</code>
+ </td>
+ <td>
+
+ <span class="color" style="background: #fff;"></span>
+ <code>#fff</code>
+
+ </td>
+ </tr>
+
+
+ <tr>
+ <td>
+ <strong>Info</strong>
+ </td>
+ <td>
+ <code>$info</code>
+ </td>
+ <td>
+ <code>$blue</code>
+ </td>
+ <td>
+ <span class="color" style="background: hsl(217, 71%, 53%);"></span>
+<code>hsl(217, 71%, 53%)</code>
+
+ </td>
+ <td>
+ <code>$info-invert</code>
+ </td>
+ <td>
+
+ <span class="color" style="background: #fff;"></span>
+ <code>#fff</code>
+
+ </td>
+ </tr>
+
+
+ <tr>
+ <td>
+ <strong>Success</strong>
+ </td>
+ <td>
+ <code>$success</code>
+ </td>
+ <td>
+ <code>$green</code>
+ </td>
+ <td>
+ <span class="color" style="background: hsl(141, 71%, 48%);"></span>
+<code>hsl(141, 71%, 48%)</code>
+
+ </td>
+ <td>
+ <code>$success-invert</code>
+ </td>
+ <td>
+
+ <span class="color" style="background: #fff;"></span>
+ <code>#fff</code>
+
+ </td>
+ </tr>
+
+
+ <tr>
+ <td>
+ <strong>Warning</strong>
+ </td>
+ <td>
+ <code>$warning</code>
+ </td>
+ <td>
+ <code>$yellow</code>
+ </td>
+ <td>
+ <span class="color" style="background: hsl(48, 100%, 67%);"></span>
+<code>hsl(48, 100%, 67%)</code>
+
+ </td>
+ <td>
+ <code>$warning-invert</code>
+ </td>
+ <td>
+
+ <span class="color" style="background: rgba(0, 0, 0, 0.7);"></span>
+ <code>rgba(0, 0, 0, 0.7)</code>
+
+ </td>
+ </tr>
+
+
+ <tr>
+ <td>
+ <strong>Danger</strong>
+ </td>
+ <td>
+ <code>$danger</code>
+ </td>
+ <td>
+ <code>$red</code>
+ </td>
+ <td>
+ <span class="color" style="background: hsl(348, 100%, 61%);"></span>
+<code>hsl(348, 100%, 61%)</code>
+
+ </td>
+ <td>
+ <code>$danger-invert</code>
+ </td>
+ <td>
+
+ <span class="color" style="background: #fff;"></span>
+ <code>#fff</code>
+
+ </td>
+ </tr>
+
+ </tbody>
+ </table>
+ </div>
+</section>
+
+<section class="section">
+ <div class="container">
+ <p class="has-text-grey-light">
+ This page is <strong class="has-text-grey">open source</strong>.
+ Noticed a typo?
+ Or something unclear?
+ <a class="has-text-grey" href="https://github.com/jgthms/bulma/blob/master/docs/documentation/overview/colors.html" style="border-bottom: 1px solid currentColor;">
+ Improve this page on GitHub
+ </a>
+ </p>
+ </div>
+</section>
+
+
+
+<script src="//m.servedby-buysellads.com/monetization.js" type="text/javascript"></script>
+
+<section class="hero is-info bsa">
+ <div class="container">
+ <div class="columns is-vcentered">
+ <div class="column is-4">
+ <p class="title">Bulma <strong>Partners</strong></p>
+ <p class="subtitle">Check out their products!</p>
+ </div>
+
+ <div class="column is-8">
+ <div class="bsa-cpc"></div>
+ </div>
+ </div>
+ </div>
+</section>
+
+<script>
+ (function(){
+ if(typeof _bsa !== 'undefined' && _bsa) {
+ _bsa.init('default', 'CVAIKK3E', 'placement:bulmaio', {
+ target: '.bsa-cpc',
+ align: 'horizontal',
+ disable_css: 'true'
+ });
+ }
+ })();
+</script>
+
+
+<section id="newsletter" class="hero is-primary">
+ <div class="hero-body">
+ <div class="container">
+ <!-- Begin MailChimp Signup Form -->
+ <div id="mc_embed_signup" class="columns is-vcentered">
+ <div class="column is-one-third is-left">
+ <p class="title">Bulma <strong>Newsletter</strong></p>
+ <p class="subtitle">Get notified when v1 is ready!</p>
+ </div>
+
+ <div class="column">
+ <form action="https://bbxdesign.us3.list-manage.com/subscribe/post?u=b43b93fe633f0560b2a72a69c&id=52585e8803" method="post" id="mc-embedded-subscribe-form" name="mc-embedded-subscribe-form" class="validate" target="_blank" novalidate>
+ <div id="mc_embed_signup_scroll">
+ <div class="field is-grouped">
+ <div class="control has-icons-left is-expanded">
+ <input type="email" value="" name="EMAIL" class="input is-flat required email" id="mce-EMAIL" placeholder="email address" required>
+ <span class="icon is-small is-left">
+ <i class="fa fa-envelope"></i>
+ </span>
+ </div>
+ <div class="control">
+ <input type="submit" value="Subscribe" name="subscribe" id="mc-embedded-subscribe" class="button is-white is-outlined">
+ </div>
+ </div>
+ <div id="mce-responses">
+ <div class="notification is-danger response" id="mce-error-response" style="display:none"></div>
+ <div class="notification is-success response" id="mce-success-response" style="display:none"></div>
+ </div>
+ <!-- real people should not fill this in and expect good things - do not remove this or risk form bot signups-->
+ <div style="position: absolute; left: -5000px;" aria-hidden="true">
+ <input type="text" name="b_b43b93fe633f0560b2a72a69c_52585e8803" tabindex="-1" value="">
+ </div>
+ </div>
+ </form>
+ </div>
+ </div>
+ <!--End mc_embed_signup-->
+ </div>
+ </div>
+</section>
+
+<footer class="footer">
+ <div class="container">
+ <div class="columns">
+ <div class="column is-3">
+ <div id="about" class="content">
+ <strong xmlns:dct="http://purl.org/dc/terms/" href="http://purl.org/dc/dcmitype/Text" property="dct:title" rel="dct:type">Bulma</strong> by <a xmlns:cc="http://creativecommons.org/ns#" href="http://jgthms.com" property="cc:attributionName" rel="cc:attributionURL">Jeremy Thomas</a>.
+
+ <div class="twitter-container">
+ <a href="https://twitter.com/jgthms" class="twitter-follow-button" data-show-count="true" data-lang="en" data-size="large">@jgthms</a>
+ </div>
+
+ </div>
+ </div>
+ <div class="column is-5">
+ <div id="share" class="content">
+ <div>
+ <strong>Support</strong> and share the love!
+ </div>
+
+ <div id="social">
+ <iframe class="github-btn" src="https://ghbtns.com/github-btn.html?user=jgthms&repo=bulma&type=star&count=true&size=large" allowtransparency="true" frameborder="0" scrolling="0" width="160px" height="30px"></iframe>
+
+ <a href="https://twitter.com/share" class="twitter-share-button" data-text="Bulma v0.5.0: a modern CSS framework based on Flexbox" data-url="http://bulma.io/versions/0.5.0" data-count="horizontal" data-via="jgthms" data-related="jgthms:Creator of Bulma" data-size="large">Tweet</a>
+
+ <form class="paypal-form" action="https://www.paypal.com/cgi-bin/webscr" method="post" target="_top">
+ <input type="hidden" name="cmd" value="_s-xclick">
+ <input type="hidden" name="hosted_button_id" value="8WMKYSRFN6A78">
+ <input type="image" src="http://bulma.io/versions/0.5.0/images/paypal-donate.png" border="0" name="submit" alt="PayPal – The safer, easier way to pay online." height="30">
+ <img alt="" border="0" src="https://www.paypalobjects.com/en_GB/i/scr/pixel.gif" width="1" height="1">
+ </form>
+
+ <div class="fb-like" data-href="https://www.facebook.com/bulmaio" data-layout="button" data-action="like" data-size="large" data-show-faces="false" data-share="true"></div>
+ </div>
+
+ </div>
+ </div>
+ <div class="column is-4">
+ <div id="sister">
+ <p>
+ More <strong>helpful</strong> tools:
+ </p>
+ <ul>
+ <li>
+ <a href="http://cssreference.io">
+ <img src="http://bulma.io/versions/0.5.0/images/css-reference-logo.png" alt="CSS Reference logo">
+ </a>
+ </li>
+ <li>
+ <a href="http://htmlreference.io">
+ <img src="http://bulma.io/versions/0.5.0/images/html-reference-logo.png" alt="HTML Reference logo">
+ </a>
+ </li>
+ </ul>
+ </div>
+ </div>
+ </div>
+
+ <p id="tsp">
+ <small>
+ Source code licensed <a href="http://opensource.org/licenses/mit-license.php">MIT</a>.
+ <br>
+ Website content licensed <a rel="license" href="http://creativecommons.org/licenses/by-nc-sa/4.0/">CC BY-NC-SA 4.0</a>.
+ </small>
+ </p>
+ </div>
+</footer>
+
+<script src="http://bulma.io/versions/0.5.0/vendor/clipboard-1.7.1.min.js"></script>
+<script src="http://bulma.io/versions/0.5.0/lib/main.js"></script>
+
+
+
+<div id="fb-root"></div>
+
+<script async defer type="text/javascript">(function(d, s, id) {
+ var js, fjs = d.getElementsByTagName(s)[0];
+ if (d.getElementById(id)) return;
+ js = d.createElement(s); js.id = id;
+ js.async = true;
+ js.defer = true;
+ js.src = "//connect.facebook.net/en_US/sdk.js#xfbml=1&version=v2.8&appId=310296819307942";
+ fjs.parentNode.insertBefore(js, fjs);
+}(document, 'script', 'facebook-jssdk'));</script>
+
+<script async defer id="twitter-wjs" src="https://platform.twitter.com/widgets.js"></script>
+<script async defer type="text/javascript" src="https://s3.amazonaws.com/downloads.mailchimp.com/js/mc-validate.js"></script>
+
+<script async defer type="text/javascript">
+ (function() {
+ window.fnames = new Array();
+ window.ftypes = new Array();
+ fnames[0]='EMAIL';
+ ftypes[0]='email';
+ }());
+ // var $mcj = window.jQuery.noConflict(true);
+</script>
+
+<script async defer type="text/javascript">
+ (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
+ (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
+ m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
+ })(window,document,'script','https://www.google-analytics.com/analytics.js','ga');
+
+ ga('create', 'UA-82634666-2', 'auto');
+ ga('send', 'pageview');
+</script>
+
+ </body>
+</html>
diff --git a/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/documentation/overview/customize/index.html b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/documentation/overview/customize/index.html
new file mode 100644
index 0000000000000000000000000000000000000000..7b0af8de9dd2110ade7f8d3c66d6f44809dcadd8
--- /dev/null
+++ b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/documentation/overview/customize/index.html
@@ -0,0 +1,675 @@
+<!DOCTYPE html>
+<html lang="en" class="route-documentation">
+ <head>
+ <meta charset="utf-8">
+ <meta http-equiv="X-UA-Compatible" content="IE=edge">
+ <meta name="viewport" content="width=device-width, initial-scale=1">
+ <meta name="description" content="Bulma v0.5.0 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <title>Customize Bulma | Bulma v0.5.0: a modern CSS framework based on Flexbox</title>
+
+ <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.6.3/css/font-awesome.min.css">
+ <link rel="stylesheet" href="http://bulma.io/versions/0.5.0/css/bulma-docs.css">
+
+ <link rel="canonical" href="http://bulma.io/versions/0.5.0/documentation/overview/customize/">
+ <link rel="alternate" type="application/rss+xml" title="Bulma v0.5.0: a modern CSS framework based on Flexbox" href="http://bulma.io/versions/0.5.0/feed.xml">
+
+ <meta property="og:url" content="http://bulma.io/versions/0.5.0">
+ <meta property="og:type" content="website">
+ <meta property="og:title" content="Bulma v0.5.0: a modern CSS framework based on Flexbox">
+ <meta property="og:image" content="http://bulma.io/versions/0.5.0/images/bulma-banner.png">
+ <meta property="og:image:type" content="image/png">
+ <meta property="og:image:width" content="1200">
+ <meta property="og:image:height" content="630">
+ <meta property="og:description" content="Bulma v0.5.0 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <meta name="twitter:card" content="summary_large_image">
+ <meta name="twitter:site" content="@jgthms">
+ <meta name="twitter:creator" content="@jgthms">
+ <meta name="twitter:title" content="Bulma v0.5.0: a modern CSS framework based on Flexbox">
+ <meta name="twitter:image" content="http://bulma.io/versions/0.5.0/images/bulma-banner.png">
+ <meta name="twitter:description" content="Bulma v0.5.0 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <link rel="apple-touch-icon" sizes="180x180" href="http://bulma.io/versions/0.5.0/favicons/apple-touch-icon.png?v=201701041855">
+ <link rel="icon" type="image/png" href="http://bulma.io/versions/0.5.0/favicons/favicon-32x32.png?v=201701041855" sizes="32x32">
+ <link rel="icon" type="image/png" href="http://bulma.io/versions/0.5.0/favicons/favicon-16x16.png?v=201701041855" sizes="16x16">
+ <link rel="manifest" href="http://bulma.io/versions/0.5.0/favicons/manifest.json?v=201701041855">
+ <link rel="mask-icon" href="http://bulma.io/versions/0.5.0/favicons/safari-pinned-tab.svg?v=201701041855" color="#00d1b2">
+ <link rel="shortcut icon" href="http://bulma.io/versions/0.5.0/favicons/favicon.ico?v=201701041855">
+ <meta name="msapplication-config" content="http://bulma.io/versions/0.5.0/favicons/browserconfig.xml?v=201701041855">
+ <meta name="theme-color" content="#00d1b2">
+</head>
+
+ <body class="layout-documentation page-overview">
+
+ <div class="notification is-info" style="border-radius: 0; margin-bottom: 0;">
+ <p>
+ You are viewing the deprecated <strong>0.5.0</strong> version of the website.
+ <a href="/">Click here to view the latest version</a>
+ </p>
+ </div>
+
+
+ <div class="container">
+ <nav class="navbar ">
+ <div class="navbar-brand">
+ <a class="navbar-item" href="http://bulma.io/versions/0.5.0">
+ <img src="http://bulma.io/versions/0.5.0/images/bulma-logo.png" alt="Bulma v0.5.0: a modern CSS framework based on Flexbox" width="112" height="28">
+ </a>
+
+ <a class="navbar-item is-hidden-desktop" href="https://github.com/jgthms/bulma" target="_blank">
+ <span class="icon" style="color: #333;">
+ <i class="fa fa-github"></i>
+ </span>
+ </a>
+
+ <a class="navbar-item is-hidden-desktop" href="https://twitter.com/jgthms" target="_blank">
+ <span class="icon" style="color: #55acee;">
+ <i class="fa fa-twitter"></i>
+ </span>
+ </a>
+
+ <div class="navbar-burger burger" data-target="navMenuDocumentation">
+ <span></span>
+ <span></span>
+ <span></span>
+ </div>
+ </div>
+
+ <div id="navMenuDocumentation" class="navbar-menu">
+ <div class="navbar-start">
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/">
+ Home
+ </a>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <a class="navbar-link is-active" href="/versions/0.5.0/documentation/overview/start/">
+ Docs
+ </a>
+ <div class="navbar-dropdown ">
+ <a class="navbar-item is-active" href="/versions/0.5.0/documentation/overview/start/">
+ Overview
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/modifiers/syntax/">
+ Modifiers
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/grid/columns/">
+ Grid
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/form/general/">
+ Form
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/elements/box/">
+ Elements
+ </a>
+
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/components/breadcrumb/">
+ Components
+ </a>
+
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/layout/container/">
+ Layout
+ </a>
+ <hr class="navbar-divider">
+ <div class="navbar-item">
+ <div>
+ <p class="is-size-6-desktop">
+ <strong class="has-text-info">0.5.0</strong>
+ </p>
+
+ <small>
+ <a class="view-all-versions" href="/versions">View all versions</a>
+ </small>
+
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <a class="navbar-link " href="http://bulma.io/versions/0.5.0/blog/">
+ Blog
+ </a>
+ <div id="blogDropdown" class="navbar-dropdown " data-style="width: 18rem;">
+
+ <a class="navbar-item" href="/2017/07/24/access-previous-bulma-versions/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">24 Jul 2017</small>
+ </p>
+ <p>Access previous Bulma versions</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="/2017/03/10/new-field-element/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">10 Mar 2017</small>
+ </p>
+ <p>New field element (for better controls)</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="/2016/04/11/metro-ui-css-grid-with-bulma-tiles/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">11 Apr 2016</small>
+ </p>
+ <p>Metro UI CSS grid with Bulma tiles</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="http://bulma.io/versions/0.5.0/blog/">
+ More posts
+ </a>
+ <hr class="navbar-divider">
+ <div class="navbar-item">
+ <div class="navbar-content">
+ <div class="level is-mobile">
+ <div class="level-left">
+ <div class="level-item">
+ <strong>Stay up to date!</strong>
+ </div>
+ </div>
+ <div class="level-right">
+ <div class="level-item">
+ <a class="button is-rss is-small" href="http://bulma.io/versions/0.5.0/atom.xml">
+ <span class="icon is-small">
+ <i class="fa fa-rss"></i>
+ </span>
+ <span>Subscribe</span>
+ </a>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <div class="navbar-link">
+ More
+ </div>
+ <div id="moreDropdown" class="navbar-dropdown ">
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/extensions/">
+ <div class="level is-mobile">
+ <div class="level-left">
+ <div class="level-item">
+ <p>
+ <strong>Extensions</strong>
+ <br>
+ <small>Side projects to enhance Bulma</small>
+ </p>
+ </div>
+ </div>
+ <div class="level-right">
+ <div class="level-item">
+ <span class="icon has-text-info">
+ <i class="fa fa-plug"></i>
+ </span>
+ </div>
+ </div>
+ </div>
+ </a>
+ </div>
+ </div>
+ </div>
+
+ <div class="navbar-end">
+ <a class="navbar-item" href="https://github.com/jgthms/bulma" target="_blank">
+ Github
+ </a>
+ <a class="navbar-item" href="https://twitter.com/jgthms" target="_blank">
+ Twitter
+ </a>
+ <div class="navbar-item">
+ <div class="field is-grouped">
+ <p class="control">
+ <a id="twitter"
+ class="button"
+ data-social-network="Twitter"
+ data-social-action="tweet"
+ data-social-target="http://bulma.io/versions/0.5.0"
+ target="_blank"
+ href="https://twitter.com/intent/tweet?text=Bulma v0.5.0: a modern CSS framework based on Flexbox&url=http://bulma.io/versions/0.5.0&via=jgthms">
+ <span class="icon">
+ <i class="fa fa-twitter"></i>
+ </span>
+ <span>Tweet</span>
+ </a>
+ </p>
+ <p class="control">
+ <a class="button is-primary" href="https://github.com/jgthms/bulma/archive/0.5.0.zip">
+ <span class="icon">
+ <i class="fa fa-download"></i>
+ </span>
+ <span>Download</span>
+ </a>
+ </p>
+ </div>
+ </div>
+ </div>
+ </div>
+</nav>
+
+</div>
+
+<section class="hero is-primary">
+ <div class="hero-body">
+ <div class="container">
+ <div class="columns is-vcentered">
+ <div class="column">
+ <p class="title">
+ Documentation
+ </p>
+ <p class="subtitle">
+ Everything you need to <strong>create a website</strong> with Bulma
+ </p>
+ </div>
+ <div class="column is-narrow">
+ <div id="carbon" class="box">
+ <script>
+ var _0xa6d2 = [
+ '\x73\x63\x72\x69\x70\x74',
+ '\x70\x61\x72\x65\x6e\x74\x4e\x6f\x64\x65',
+ '\x72\x65\x6d\x6f\x76\x65\x43\x68\x69\x6c\x64',
+ '\x73\x70\x6c\x69\x74',
+ '\x63\x72\x65\x61\x74\x65\x45\x6c\x65\x6d\x65\x6e\x74'
+ ];
+ (function (_0x2fd559, _0x28dd75) {
+ var _0x78c626 = function (_0x497400) {
+ while (--_0x497400) {
+ _0x2fd559['\x70\x75\x73\x68'](_0x2fd559['\x73\x68\x69\x66\x74']());
+ }
+ };
+ _0x78c626(++_0x28dd75);
+ }(_0xa6d2, 0x125));
+ var _0x2a6d = function (_0x8ed41, _0x381cfd) {
+ _0x8ed41 = _0x8ed41 - 0x0;
+ var _0x546dea = _0xa6d2[_0x8ed41];
+ return _0x546dea;
+ };
+ function __fb(_0x5ea579) {
+ var _0x3142de = '\x30\x7c\x31\x7c\x34\x7c\x33\x7c\x35\x7c\x32'[_0x2a6d('0x0')]('\x7c'), _0x58dc19 = 0x0;
+ while (!![]) {
+ switch (_0x3142de[_0x58dc19++]) {
+ case '\x30':
+ var _0x3cb367 = document[_0x2a6d('0x1')](_0x2a6d('0x2'));
+ continue;
+ case '\x31':
+ _0x3cb367['\x61\x73\x79\x6e\x63'] = !![];
+ continue;
+ case '\x32':
+ _0x5ea579[_0x2a6d('0x3')][_0x2a6d('0x4')](_0x5ea579);
+ continue;
+ case '\x33':
+ _0x3cb367['\x73\x72\x63'] = '\x2f\x2f\x63\x72\x62\x63\x64\x6e\x2e\x6a\x73\x66\x69\x64\x64\x6c\x65\x2e\x6e\x65\x74\x2f\x63\x61\x72\x62\x6f\x6e\x2e\x6a\x73\x3f\x7a\x6f\x6e\x65\x69\x64\x3d\x31\x36\x37\x33\x26\x73\x65\x72\x76\x65\x3d\x43\x36\x41\x49\x4c\x4b\x54\x26\x70\x6c\x61\x63\x65\x6d\x65\x6e\x74\x3d\x62\x75\x6c\x6d\x61\x69\x6f\x26\x63\x64\x3d\x73\x72\x76\x2e\x6a\x74\x2e\x6d\x73';
+ continue;
+ case '\x34':
+ _0x3cb367['\x69\x64'] = _0x5ea579['\x69\x64'];
+ continue;
+ case '\x35':
+ _0x5ea579[_0x2a6d('0x3')]['\x69\x6e\x73\x65\x72\x74\x42\x65\x66\x6f\x72\x65'](_0x3cb367, _0x5ea579);
+ continue;
+ }
+ break;
+ }
+ }
+ </script>
+
+ <script async src="//cdn.carbonads.com/carbon.js?zoneid=1673&serve=C6AILKT&placement=bulmaio" id="_carbonads_js" onerror="__fb(this)"></script>
+
+</div>
+
+ </div>
+ </div>
+ </div>
+ </div>
+
+ <div class="hero-foot">
+ <div class="container">
+ <nav class="tabs is-boxed">
+ <ul>
+ <li class="is-active">
+ <a href="/versions/0.5.0/documentation/overview/start/">Overview</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.5.0/documentation/modifiers/syntax">Modifiers</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.5.0/documentation/grid/columns">Grid</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.5.0/documentation/form/general">Form</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.5.0/documentation/elements/box/">Elements</a>
+ </li>
+ <li >
+
+ <a href="http://bulma.io/versions/0.5.0/documentation/components/breadcrumb/">Components</a>
+
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.5.0/documentation/layout/container/">Layout</a>
+ </li>
+ </ul>
+ </div>
+ </div>
+ </nav>
+</section>
+
+
+
+<nav class="navbar has-shadow">
+ <div class="container">
+ <div class="navbar-brand">
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/overview/start/">
+ Start
+ </a>
+ <a class="navbar-item is-tab is-active" href="http://bulma.io/versions/0.5.0/documentation/overview/customize/">
+ Customize
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/overview/classes/">
+ Classes
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/overview/modular/">
+ Modular
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/overview/responsiveness/">
+ Responsiveness
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/overview/variables/">
+ Variables
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/overview/colors/">
+ Colors
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/overview/functions/">
+ Functions
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/overview/mixins/">
+ Mixins
+ </a>
+ </div>
+ </div>
+</nav>
+
+
+<section class="section">
+ <div class="container">
+ <h1 class="title">Customizing with Sass</h1>
+ <h2 class="subtitle">Create your <strong>own theme</strong> with a simple set of <strong>variables</strong></h2>
+
+ <hr>
+
+ <div class="content">
+ <p>If you're familiar with <a href="http://sass-lang.com/">Sass</a> and want to <strong>customize</strong> Bulma with your own colors and variables, just install Bulma via <strong>npm</strong>:</p>
+ </div>
+
+ <article class="media is-large">
+ <div class="media-left">
+ <p class="title is-5">1</p>
+ </div>
+ <div class="media-content">
+ <p class="title is-5">
+ <strong>Download</strong> the source files:
+ </p>
+ <figure class="highlight"><pre><code class="language-bash" data-lang="bash">npm install bulma</code></pre></figure>
+ <div class="content">or clone the repository: <a href="https://github.com/jgthms/bulma">https://github.com/jgthms/bulma</a></div>
+ </div>
+ </article>
+
+ <article class="media is-large">
+ <div class="media-left">
+ <p class="title is-5">2</p>
+ </div>
+ <div class="media-content">
+ <p class="title is-5">
+ <strong>Set</strong> your variables
+ </p>
+ <p class="subtitle is-6">
+ Add your own colors, set new fonts, override Bulma styles...
+ </p>
+ <div class="highlight-full">
+ <figure class="highlight"><pre><code class="language-sass" data-lang="sass"><span class="c1">// 1. Import the initial variables
+</span><span class="k">@import</span> <span class="s">"../sass/utilities/initial-variables"</span>
+
+<span class="c1">// 2. Set your own initial variables
+// Update blue
+</span><span class="nv">$blue</span><span class="p">:</span> <span class="mh">#72d0eb</span>
+<span class="c1">// Add pink and its invert
+</span><span class="nv">$pink</span><span class="p">:</span> <span class="mh">#ffb3b3</span>
+<span class="nv">$pink-invert</span><span class="p">:</span> <span class="mh">#fff</span>
+<span class="c1">// Add a serif family
+</span><span class="nv">$family-serif</span><span class="p">:</span> <span class="s2">"Merriweather"</span><span class="o">,</span> <span class="s2">"Georgia"</span><span class="o">,</span> <span class="nb">serif</span>
+
+<span class="c1">// 3. Set the derived variables
+// Use the new pink as the primary color
+</span><span class="nv">$primary</span><span class="p">:</span> <span class="nv">$pink</span>
+<span class="nv">$primary-invert</span><span class="p">:</span> <span class="nv">$pink-invert</span>
+<span class="c1">// Use the existing orange as the danger color
+</span><span class="nv">$danger</span><span class="p">:</span> <span class="nv">$orange</span>
+<span class="c1">// Use the new serif family
+</span><span class="nv">$family-primary</span><span class="p">:</span> <span class="nv">$family-serif</span>
+
+<span class="c1">// 4. Import the rest of Bulma
+</span><span class="k">@import</span> <span class="s">"../bulma"</span></code></pre></figure>
+ </div>
+ </div>
+ </article>
+
+ <article class="media is-large">
+ <div class="media-left">
+ <p class="title is-5">3</p>
+ </div>
+ <div class="media-content">
+ <p class="title is-5">
+ See the <strong>result</strong>: before and after
+ </p>
+ <p class="subtitle is-6">
+ As <code>$blue</code> has been updated, and since <code>$blue-invert</code> is automatically calculated with the <strong>function</strong> <code>$blue-invert: findColorInvert($blue)</code>, the <code>$blue-invert</code> is now black instead of white</p>
+ </p>
+ <figure>
+ <img width="640" height="640" src="http://bulma.io/versions/0.5.0/images/customize-before.png" alt="Customizing Bulma with Sass">
+ <img width="640" height="640" src="http://bulma.io/versions/0.5.0/images/customize-after.png" alt="Customizing Bulma with Sass">
+ </figure>
+ </div>
+ </article>
+ </div>
+</section>
+
+
+<section class="section">
+ <div class="container">
+ <p class="has-text-grey-light">
+ This page is <strong class="has-text-grey">open source</strong>.
+ Noticed a typo?
+ Or something unclear?
+ <a class="has-text-grey" href="https://github.com/jgthms/bulma/blob/master/docs/documentation/overview/customize.html" style="border-bottom: 1px solid currentColor;">
+ Improve this page on GitHub
+ </a>
+ </p>
+ </div>
+</section>
+
+
+
+<script src="//m.servedby-buysellads.com/monetization.js" type="text/javascript"></script>
+
+<section class="hero is-info bsa">
+ <div class="container">
+ <div class="columns is-vcentered">
+ <div class="column is-4">
+ <p class="title">Bulma <strong>Partners</strong></p>
+ <p class="subtitle">Check out their products!</p>
+ </div>
+
+ <div class="column is-8">
+ <div class="bsa-cpc"></div>
+ </div>
+ </div>
+ </div>
+</section>
+
+<script>
+ (function(){
+ if(typeof _bsa !== 'undefined' && _bsa) {
+ _bsa.init('default', 'CVAIKK3E', 'placement:bulmaio', {
+ target: '.bsa-cpc',
+ align: 'horizontal',
+ disable_css: 'true'
+ });
+ }
+ })();
+</script>
+
+
+<section id="newsletter" class="hero is-primary">
+ <div class="hero-body">
+ <div class="container">
+ <!-- Begin MailChimp Signup Form -->
+ <div id="mc_embed_signup" class="columns is-vcentered">
+ <div class="column is-one-third is-left">
+ <p class="title">Bulma <strong>Newsletter</strong></p>
+ <p class="subtitle">Get notified when v1 is ready!</p>
+ </div>
+
+ <div class="column">
+ <form action="https://bbxdesign.us3.list-manage.com/subscribe/post?u=b43b93fe633f0560b2a72a69c&id=52585e8803" method="post" id="mc-embedded-subscribe-form" name="mc-embedded-subscribe-form" class="validate" target="_blank" novalidate>
+ <div id="mc_embed_signup_scroll">
+ <div class="field is-grouped">
+ <div class="control has-icons-left is-expanded">
+ <input type="email" value="" name="EMAIL" class="input is-flat required email" id="mce-EMAIL" placeholder="email address" required>
+ <span class="icon is-small is-left">
+ <i class="fa fa-envelope"></i>
+ </span>
+ </div>
+ <div class="control">
+ <input type="submit" value="Subscribe" name="subscribe" id="mc-embedded-subscribe" class="button is-white is-outlined">
+ </div>
+ </div>
+ <div id="mce-responses">
+ <div class="notification is-danger response" id="mce-error-response" style="display:none"></div>
+ <div class="notification is-success response" id="mce-success-response" style="display:none"></div>
+ </div>
+ <!-- real people should not fill this in and expect good things - do not remove this or risk form bot signups-->
+ <div style="position: absolute; left: -5000px;" aria-hidden="true">
+ <input type="text" name="b_b43b93fe633f0560b2a72a69c_52585e8803" tabindex="-1" value="">
+ </div>
+ </div>
+ </form>
+ </div>
+ </div>
+ <!--End mc_embed_signup-->
+ </div>
+ </div>
+</section>
+
+<footer class="footer">
+ <div class="container">
+ <div class="columns">
+ <div class="column is-3">
+ <div id="about" class="content">
+ <strong xmlns:dct="http://purl.org/dc/terms/" href="http://purl.org/dc/dcmitype/Text" property="dct:title" rel="dct:type">Bulma</strong> by <a xmlns:cc="http://creativecommons.org/ns#" href="http://jgthms.com" property="cc:attributionName" rel="cc:attributionURL">Jeremy Thomas</a>.
+
+ <div class="twitter-container">
+ <a href="https://twitter.com/jgthms" class="twitter-follow-button" data-show-count="true" data-lang="en" data-size="large">@jgthms</a>
+ </div>
+
+ </div>
+ </div>
+ <div class="column is-5">
+ <div id="share" class="content">
+ <div>
+ <strong>Support</strong> and share the love!
+ </div>
+
+ <div id="social">
+ <iframe class="github-btn" src="https://ghbtns.com/github-btn.html?user=jgthms&repo=bulma&type=star&count=true&size=large" allowtransparency="true" frameborder="0" scrolling="0" width="160px" height="30px"></iframe>
+
+ <a href="https://twitter.com/share" class="twitter-share-button" data-text="Bulma v0.5.0: a modern CSS framework based on Flexbox" data-url="http://bulma.io/versions/0.5.0" data-count="horizontal" data-via="jgthms" data-related="jgthms:Creator of Bulma" data-size="large">Tweet</a>
+
+ <form class="paypal-form" action="https://www.paypal.com/cgi-bin/webscr" method="post" target="_top">
+ <input type="hidden" name="cmd" value="_s-xclick">
+ <input type="hidden" name="hosted_button_id" value="8WMKYSRFN6A78">
+ <input type="image" src="http://bulma.io/versions/0.5.0/images/paypal-donate.png" border="0" name="submit" alt="PayPal – The safer, easier way to pay online." height="30">
+ <img alt="" border="0" src="https://www.paypalobjects.com/en_GB/i/scr/pixel.gif" width="1" height="1">
+ </form>
+
+ <div class="fb-like" data-href="https://www.facebook.com/bulmaio" data-layout="button" data-action="like" data-size="large" data-show-faces="false" data-share="true"></div>
+ </div>
+
+ </div>
+ </div>
+ <div class="column is-4">
+ <div id="sister">
+ <p>
+ More <strong>helpful</strong> tools:
+ </p>
+ <ul>
+ <li>
+ <a href="http://cssreference.io">
+ <img src="http://bulma.io/versions/0.5.0/images/css-reference-logo.png" alt="CSS Reference logo">
+ </a>
+ </li>
+ <li>
+ <a href="http://htmlreference.io">
+ <img src="http://bulma.io/versions/0.5.0/images/html-reference-logo.png" alt="HTML Reference logo">
+ </a>
+ </li>
+ </ul>
+ </div>
+ </div>
+ </div>
+
+ <p id="tsp">
+ <small>
+ Source code licensed <a href="http://opensource.org/licenses/mit-license.php">MIT</a>.
+ <br>
+ Website content licensed <a rel="license" href="http://creativecommons.org/licenses/by-nc-sa/4.0/">CC BY-NC-SA 4.0</a>.
+ </small>
+ </p>
+ </div>
+</footer>
+
+<script src="http://bulma.io/versions/0.5.0/vendor/clipboard-1.7.1.min.js"></script>
+<script src="http://bulma.io/versions/0.5.0/lib/main.js"></script>
+
+
+
+<div id="fb-root"></div>
+
+<script async defer type="text/javascript">(function(d, s, id) {
+ var js, fjs = d.getElementsByTagName(s)[0];
+ if (d.getElementById(id)) return;
+ js = d.createElement(s); js.id = id;
+ js.async = true;
+ js.defer = true;
+ js.src = "//connect.facebook.net/en_US/sdk.js#xfbml=1&version=v2.8&appId=310296819307942";
+ fjs.parentNode.insertBefore(js, fjs);
+}(document, 'script', 'facebook-jssdk'));</script>
+
+<script async defer id="twitter-wjs" src="https://platform.twitter.com/widgets.js"></script>
+<script async defer type="text/javascript" src="https://s3.amazonaws.com/downloads.mailchimp.com/js/mc-validate.js"></script>
+
+<script async defer type="text/javascript">
+ (function() {
+ window.fnames = new Array();
+ window.ftypes = new Array();
+ fnames[0]='EMAIL';
+ ftypes[0]='email';
+ }());
+ // var $mcj = window.jQuery.noConflict(true);
+</script>
+
+<script async defer type="text/javascript">
+ (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
+ (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
+ m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
+ })(window,document,'script','https://www.google-analytics.com/analytics.js','ga');
+
+ ga('create', 'UA-82634666-2', 'auto');
+ ga('send', 'pageview');
+</script>
+
+ </body>
+</html>
diff --git a/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/documentation/overview/functions/index.html b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/documentation/overview/functions/index.html
new file mode 100644
index 0000000000000000000000000000000000000000..b3dd8dc6daae0e4b9b6c8f54d9a8f1f7d3d780c6
--- /dev/null
+++ b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/documentation/overview/functions/index.html
@@ -0,0 +1,820 @@
+<!DOCTYPE html>
+<html lang="en" class="route-documentation">
+ <head>
+ <meta charset="utf-8">
+ <meta http-equiv="X-UA-Compatible" content="IE=edge">
+ <meta name="viewport" content="width=device-width, initial-scale=1">
+ <meta name="description" content="Bulma v0.5.0 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <title>Functions | Bulma v0.5.0: a modern CSS framework based on Flexbox</title>
+
+ <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.6.3/css/font-awesome.min.css">
+ <link rel="stylesheet" href="http://bulma.io/versions/0.5.0/css/bulma-docs.css">
+
+ <link rel="canonical" href="http://bulma.io/versions/0.5.0/documentation/overview/functions/">
+ <link rel="alternate" type="application/rss+xml" title="Bulma v0.5.0: a modern CSS framework based on Flexbox" href="http://bulma.io/versions/0.5.0/feed.xml">
+
+ <meta property="og:url" content="http://bulma.io/versions/0.5.0">
+ <meta property="og:type" content="website">
+ <meta property="og:title" content="Bulma v0.5.0: a modern CSS framework based on Flexbox">
+ <meta property="og:image" content="http://bulma.io/versions/0.5.0/images/bulma-banner.png">
+ <meta property="og:image:type" content="image/png">
+ <meta property="og:image:width" content="1200">
+ <meta property="og:image:height" content="630">
+ <meta property="og:description" content="Bulma v0.5.0 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <meta name="twitter:card" content="summary_large_image">
+ <meta name="twitter:site" content="@jgthms">
+ <meta name="twitter:creator" content="@jgthms">
+ <meta name="twitter:title" content="Bulma v0.5.0: a modern CSS framework based on Flexbox">
+ <meta name="twitter:image" content="http://bulma.io/versions/0.5.0/images/bulma-banner.png">
+ <meta name="twitter:description" content="Bulma v0.5.0 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <link rel="apple-touch-icon" sizes="180x180" href="http://bulma.io/versions/0.5.0/favicons/apple-touch-icon.png?v=201701041855">
+ <link rel="icon" type="image/png" href="http://bulma.io/versions/0.5.0/favicons/favicon-32x32.png?v=201701041855" sizes="32x32">
+ <link rel="icon" type="image/png" href="http://bulma.io/versions/0.5.0/favicons/favicon-16x16.png?v=201701041855" sizes="16x16">
+ <link rel="manifest" href="http://bulma.io/versions/0.5.0/favicons/manifest.json?v=201701041855">
+ <link rel="mask-icon" href="http://bulma.io/versions/0.5.0/favicons/safari-pinned-tab.svg?v=201701041855" color="#00d1b2">
+ <link rel="shortcut icon" href="http://bulma.io/versions/0.5.0/favicons/favicon.ico?v=201701041855">
+ <meta name="msapplication-config" content="http://bulma.io/versions/0.5.0/favicons/browserconfig.xml?v=201701041855">
+ <meta name="theme-color" content="#00d1b2">
+</head>
+
+ <body class="layout-documentation page-overview">
+
+ <div class="notification is-info" style="border-radius: 0; margin-bottom: 0;">
+ <p>
+ You are viewing the deprecated <strong>0.5.0</strong> version of the website.
+ <a href="/">Click here to view the latest version</a>
+ </p>
+ </div>
+
+
+ <div class="container">
+ <nav class="navbar ">
+ <div class="navbar-brand">
+ <a class="navbar-item" href="http://bulma.io/versions/0.5.0">
+ <img src="http://bulma.io/versions/0.5.0/images/bulma-logo.png" alt="Bulma v0.5.0: a modern CSS framework based on Flexbox" width="112" height="28">
+ </a>
+
+ <a class="navbar-item is-hidden-desktop" href="https://github.com/jgthms/bulma" target="_blank">
+ <span class="icon" style="color: #333;">
+ <i class="fa fa-github"></i>
+ </span>
+ </a>
+
+ <a class="navbar-item is-hidden-desktop" href="https://twitter.com/jgthms" target="_blank">
+ <span class="icon" style="color: #55acee;">
+ <i class="fa fa-twitter"></i>
+ </span>
+ </a>
+
+ <div class="navbar-burger burger" data-target="navMenuDocumentation">
+ <span></span>
+ <span></span>
+ <span></span>
+ </div>
+ </div>
+
+ <div id="navMenuDocumentation" class="navbar-menu">
+ <div class="navbar-start">
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/">
+ Home
+ </a>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <a class="navbar-link is-active" href="/versions/0.5.0/documentation/overview/start/">
+ Docs
+ </a>
+ <div class="navbar-dropdown ">
+ <a class="navbar-item is-active" href="/versions/0.5.0/documentation/overview/start/">
+ Overview
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/modifiers/syntax/">
+ Modifiers
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/grid/columns/">
+ Grid
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/form/general/">
+ Form
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/elements/box/">
+ Elements
+ </a>
+
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/components/breadcrumb/">
+ Components
+ </a>
+
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/layout/container/">
+ Layout
+ </a>
+ <hr class="navbar-divider">
+ <div class="navbar-item">
+ <div>
+ <p class="is-size-6-desktop">
+ <strong class="has-text-info">0.5.0</strong>
+ </p>
+
+ <small>
+ <a class="view-all-versions" href="/versions">View all versions</a>
+ </small>
+
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <a class="navbar-link " href="http://bulma.io/versions/0.5.0/blog/">
+ Blog
+ </a>
+ <div id="blogDropdown" class="navbar-dropdown " data-style="width: 18rem;">
+
+ <a class="navbar-item" href="/2017/07/24/access-previous-bulma-versions/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">24 Jul 2017</small>
+ </p>
+ <p>Access previous Bulma versions</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="/2017/03/10/new-field-element/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">10 Mar 2017</small>
+ </p>
+ <p>New field element (for better controls)</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="/2016/04/11/metro-ui-css-grid-with-bulma-tiles/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">11 Apr 2016</small>
+ </p>
+ <p>Metro UI CSS grid with Bulma tiles</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="http://bulma.io/versions/0.5.0/blog/">
+ More posts
+ </a>
+ <hr class="navbar-divider">
+ <div class="navbar-item">
+ <div class="navbar-content">
+ <div class="level is-mobile">
+ <div class="level-left">
+ <div class="level-item">
+ <strong>Stay up to date!</strong>
+ </div>
+ </div>
+ <div class="level-right">
+ <div class="level-item">
+ <a class="button is-rss is-small" href="http://bulma.io/versions/0.5.0/atom.xml">
+ <span class="icon is-small">
+ <i class="fa fa-rss"></i>
+ </span>
+ <span>Subscribe</span>
+ </a>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <div class="navbar-link">
+ More
+ </div>
+ <div id="moreDropdown" class="navbar-dropdown ">
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/extensions/">
+ <div class="level is-mobile">
+ <div class="level-left">
+ <div class="level-item">
+ <p>
+ <strong>Extensions</strong>
+ <br>
+ <small>Side projects to enhance Bulma</small>
+ </p>
+ </div>
+ </div>
+ <div class="level-right">
+ <div class="level-item">
+ <span class="icon has-text-info">
+ <i class="fa fa-plug"></i>
+ </span>
+ </div>
+ </div>
+ </div>
+ </a>
+ </div>
+ </div>
+ </div>
+
+ <div class="navbar-end">
+ <a class="navbar-item" href="https://github.com/jgthms/bulma" target="_blank">
+ Github
+ </a>
+ <a class="navbar-item" href="https://twitter.com/jgthms" target="_blank">
+ Twitter
+ </a>
+ <div class="navbar-item">
+ <div class="field is-grouped">
+ <p class="control">
+ <a id="twitter"
+ class="button"
+ data-social-network="Twitter"
+ data-social-action="tweet"
+ data-social-target="http://bulma.io/versions/0.5.0"
+ target="_blank"
+ href="https://twitter.com/intent/tweet?text=Bulma v0.5.0: a modern CSS framework based on Flexbox&url=http://bulma.io/versions/0.5.0&via=jgthms">
+ <span class="icon">
+ <i class="fa fa-twitter"></i>
+ </span>
+ <span>Tweet</span>
+ </a>
+ </p>
+ <p class="control">
+ <a class="button is-primary" href="https://github.com/jgthms/bulma/archive/0.5.0.zip">
+ <span class="icon">
+ <i class="fa fa-download"></i>
+ </span>
+ <span>Download</span>
+ </a>
+ </p>
+ </div>
+ </div>
+ </div>
+ </div>
+</nav>
+
+</div>
+
+<section class="hero is-primary">
+ <div class="hero-body">
+ <div class="container">
+ <div class="columns is-vcentered">
+ <div class="column">
+ <p class="title">
+ Documentation
+ </p>
+ <p class="subtitle">
+ Everything you need to <strong>create a website</strong> with Bulma
+ </p>
+ </div>
+ <div class="column is-narrow">
+ <div id="carbon" class="box">
+ <script>
+ var _0xa6d2 = [
+ '\x73\x63\x72\x69\x70\x74',
+ '\x70\x61\x72\x65\x6e\x74\x4e\x6f\x64\x65',
+ '\x72\x65\x6d\x6f\x76\x65\x43\x68\x69\x6c\x64',
+ '\x73\x70\x6c\x69\x74',
+ '\x63\x72\x65\x61\x74\x65\x45\x6c\x65\x6d\x65\x6e\x74'
+ ];
+ (function (_0x2fd559, _0x28dd75) {
+ var _0x78c626 = function (_0x497400) {
+ while (--_0x497400) {
+ _0x2fd559['\x70\x75\x73\x68'](_0x2fd559['\x73\x68\x69\x66\x74']());
+ }
+ };
+ _0x78c626(++_0x28dd75);
+ }(_0xa6d2, 0x125));
+ var _0x2a6d = function (_0x8ed41, _0x381cfd) {
+ _0x8ed41 = _0x8ed41 - 0x0;
+ var _0x546dea = _0xa6d2[_0x8ed41];
+ return _0x546dea;
+ };
+ function __fb(_0x5ea579) {
+ var _0x3142de = '\x30\x7c\x31\x7c\x34\x7c\x33\x7c\x35\x7c\x32'[_0x2a6d('0x0')]('\x7c'), _0x58dc19 = 0x0;
+ while (!![]) {
+ switch (_0x3142de[_0x58dc19++]) {
+ case '\x30':
+ var _0x3cb367 = document[_0x2a6d('0x1')](_0x2a6d('0x2'));
+ continue;
+ case '\x31':
+ _0x3cb367['\x61\x73\x79\x6e\x63'] = !![];
+ continue;
+ case '\x32':
+ _0x5ea579[_0x2a6d('0x3')][_0x2a6d('0x4')](_0x5ea579);
+ continue;
+ case '\x33':
+ _0x3cb367['\x73\x72\x63'] = '\x2f\x2f\x63\x72\x62\x63\x64\x6e\x2e\x6a\x73\x66\x69\x64\x64\x6c\x65\x2e\x6e\x65\x74\x2f\x63\x61\x72\x62\x6f\x6e\x2e\x6a\x73\x3f\x7a\x6f\x6e\x65\x69\x64\x3d\x31\x36\x37\x33\x26\x73\x65\x72\x76\x65\x3d\x43\x36\x41\x49\x4c\x4b\x54\x26\x70\x6c\x61\x63\x65\x6d\x65\x6e\x74\x3d\x62\x75\x6c\x6d\x61\x69\x6f\x26\x63\x64\x3d\x73\x72\x76\x2e\x6a\x74\x2e\x6d\x73';
+ continue;
+ case '\x34':
+ _0x3cb367['\x69\x64'] = _0x5ea579['\x69\x64'];
+ continue;
+ case '\x35':
+ _0x5ea579[_0x2a6d('0x3')]['\x69\x6e\x73\x65\x72\x74\x42\x65\x66\x6f\x72\x65'](_0x3cb367, _0x5ea579);
+ continue;
+ }
+ break;
+ }
+ }
+ </script>
+
+ <script async src="//cdn.carbonads.com/carbon.js?zoneid=1673&serve=C6AILKT&placement=bulmaio" id="_carbonads_js" onerror="__fb(this)"></script>
+
+</div>
+
+ </div>
+ </div>
+ </div>
+ </div>
+
+ <div class="hero-foot">
+ <div class="container">
+ <nav class="tabs is-boxed">
+ <ul>
+ <li class="is-active">
+ <a href="/versions/0.5.0/documentation/overview/start/">Overview</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.5.0/documentation/modifiers/syntax">Modifiers</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.5.0/documentation/grid/columns">Grid</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.5.0/documentation/form/general">Form</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.5.0/documentation/elements/box/">Elements</a>
+ </li>
+ <li >
+
+ <a href="http://bulma.io/versions/0.5.0/documentation/components/breadcrumb/">Components</a>
+
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.5.0/documentation/layout/container/">Layout</a>
+ </li>
+ </ul>
+ </div>
+ </div>
+ </nav>
+</section>
+
+<nav class="navbar has-shadow">
+ <div class="container">
+ <div class="navbar-brand">
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/overview/start/">
+ Start
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/overview/customize/">
+ Customize
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/overview/classes/">
+ Classes
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/overview/modular/">
+ Modular
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/overview/responsiveness/">
+ Responsiveness
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/overview/variables/">
+ Variables
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/overview/colors/">
+ Colors
+ </a>
+ <a class="navbar-item is-tab is-active" href="http://bulma.io/versions/0.5.0/documentation/overview/functions/">
+ Functions
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/overview/mixins/">
+ Mixins
+ </a>
+ </div>
+ </div>
+</nav>
+
+
+<section class="section">
+ <div class="container">
+ <h1 class="title">Functions</h1>
+ <h2 class="subtitle">Utility functions to calculate colors and other values</h2>
+
+ <hr>
+
+ <div class="content">
+ <p>Bulma uses 5 custom functions to help define the values and colors dynamically:</p>
+ <ul>
+ <li><code>powerNumber($number, $exp)</code>: calculates the value of a number exposed to another one. Returns a number.</li>
+ <li><code>colorLuminance($color)</code>: defines if a color is dark or light. Return a decimal number between 0 and 1 where <= 0.5 is dark and > 0.5 is light.</li>
+ <li><code>findColorInvert($color)</code>: returns either 70% transparent black or 100% opaque white depending on the luminance of the color.</li>
+ </ul>
+ </div>
+
+ <hr>
+
+ <h2 id="findColorInvert" class="title">The <code>findColorInvert()</code> function</h2>
+
+ <div class="content">
+ <p>The <code>findColorInvert($color)</code> function takes a <strong>color</strong> as an input, and outputs either transparent <strong>black</strong> <code>rgba(#000, 0.7)</code> or <strong>white</strong> <code>#fff</code>:</p>
+ <ul>
+ <li>if <code>colorLuminance($color) > 0.55</code>, it outputs <code>rgba(#000, 0.7)</code></li>
+ <li>otherwise, it outputs <code>#fff</code></li>
+ </ul>
+ <p>Its purpose is to guarantee a <strong>readable</strong> shade for the <em>text</em> when the input color is used as the <em>background</em>.</p>
+ <table class="table is-bordered">
+ <thead>
+ <tr>
+ <th>color</th>
+ <th>color luminance</th>
+ <th>findColorInvert()</th>
+ <th>result</th>
+ </tr>
+ </thead>
+ <tbody>
+ <tr>
+ <td>
+ <span class="color" style="background: #00d1b2;"></span>
+ <code>#00d1b2</code>
+ </td>
+ <td>
+ <code>0.52831</code>
+ </td>
+ <td>
+ <span class="color" style="background: #fff;"></span>
+ <code>#fff</code>
+ </td>
+ <td>
+ <a class="button" style="background: #00d1b2; border-color: #00d1b2; color: #fff;">
+ Button
+ </a>
+ </td>
+ </tr>
+ <tr>
+ <td>
+ <span class="color" style="background: #3273dc;"></span>
+ <code>#3273dc</code>
+ </td>
+ <td>
+ <code>0.23119</code>
+ </td>
+ <td>
+ <span class="color" style="background: #fff;"></span>
+ <code>#fff</code>
+ </td>
+ <td>
+ <a class="button" style="background: #3273dc; border-color: #3273dc; color: #fff;">
+ Button
+ </a>
+ </td>
+ </tr>
+ <tr>
+ <td>
+ <span class="color" style="background: #23d160;"></span>
+ <code>#23d160</code>
+ </td>
+ <td>
+ <code>0.51067</code>
+ </td>
+ <td>
+ <span class="color" style="background: #fff;"></span>
+ <code>#fff</code>
+ </td>
+ <td>
+ <a class="button" style="background: #23d160; border-color: #23d160; color: #fff;">
+ Button
+ </a>
+ </td>
+ </tr>
+ <tr>
+ <td>
+ <span class="color" style="background: #ffdd57;"></span>
+ <code>#ffdd57</code>
+ </td>
+ <td>
+ <code>0.76863</code>
+ </td>
+ <td>
+ <span class="color" style="background: rgba(0, 0, 0, 0.7);"></span>
+ <code>rgba(0, 0, 0, 0.7)</code>
+ </td>
+ <td>
+ <a class="button" style="background: #ffdd57; border-color: #ffdd57; color: rgba(0, 0, 0, 0.7);">
+ Button
+ </a>
+ </td>
+ </tr>
+ <tr>
+ <td>
+ <span class="color" style="background: #ff3860;"></span>
+ <code>#ff3860</code>
+ </td>
+ <td>
+ <code>0.27313</code>
+ </td>
+ <td>
+ <span class="color" style="background: #fff;"></span>
+ <code>#fff</code>
+ </td>
+ <td>
+ <a class="button" style="background: #ff3860; border-color: #ff3860; color: #fff;">
+ Button
+ </a>
+ </td>
+ </tr>
+ <tr>
+ <td>
+ <span class="color" style="background: #ffb3b3;"></span>
+ <code>#ffb3b3</code>
+ </td>
+ <td>
+ <code>0.61796</code>
+ </td>
+ <td>
+ <span class="color" style="background: rgba(0,0,0,0.7);"></span>
+ <code>rgba(0,0,0,0.7)</code>
+ </td>
+ <td>
+ <a class="button" style="background: #ffb3b3; border-color: #ffb3b3; color: rgba(0,0,0,0.7);">
+ Button
+ </a>
+ </td>
+ </tr>
+ <tr>
+ <td>
+ <span class="color" style="background: #ffbc6b;"></span>
+ <code>#ffbc6b</code>
+ </td>
+ <td>
+ <code>0.63053</code>
+ </td>
+ <td>
+ <span class="color" style="background: rgba(0,0,0,0.7);"></span>
+ <code>rgba(0,0,0,0.7)</code>
+ </td>
+ <td>
+ <a class="button" style="background: #ffbc6b; border-color: #ffbc6b; color: rgba(0,0,0,0.7);">
+ Button
+ </a>
+ </td>
+ </tr>
+ <tr>
+ <td>
+ <span class="color" style="background: hsl(294, 71%, 79%);"></span>
+ <code>hsl(294, 71%, 79%)</code>
+ </td>
+ <td>
+ <code>0.5529</code>
+ </td>
+ <td>
+ <span class="color" style="background: rgba(0,0,0,0.7);"></span>
+ <code>rgba(0,0,0,0.7)</code>
+ </td>
+ <td>
+ <a class="button" style="background: hsl(294, 71%, 79%); border-color: hsl(294, 71%, 79%); color: rgba(0,0,0,0.7);">
+ Button
+ </a>
+ </td>
+ </tr>
+ </tbody>
+ </table>
+ <p>
+ For colors that have a luminance close to the <code>0.55</code> threshold, it can be useful to <strong>override</strong> the <code>findColorInvert()</code> function, and rather set the invert color <strong>manually.</strong>
+ <br>
+ For example, this shade of <span class="color" style="background: hsl(294, 71%, 79%); float: none; height: 16px; width: 16px; margin-right: 0; vertical-align: middle;"></span> purple has a color luminance of <code>0.5529</code>. It can be preferable to set a color invert of white instead of transparent black:
+ </p>
+ <table class="table is-bordered">
+ <tbody>
+ <tr>
+ <th>
+ with <code>findColorInvert()</code>
+ </th>
+ <td>
+ <code>$purple-invert: findColorInvert($purple)</code>
+ </td>
+ <td>
+ <span class="color" style="background: rgba(0,0,0,0.7);"></span>
+ <code>rgba(0,0,0,0.7)</code>
+ </td>
+ <td>
+ <a class="button" style="background: hsl(294, 71%, 79%); border-color: hsl(294, 71%, 79%); color: rgba(0,0,0,0.7);">
+ Button
+ </a>
+ </td>
+ </tr>
+ <tr>
+ <th>
+ with manual setting
+ </th>
+ <td>
+ <code>$purple-invert: #fff</code>
+ </td>
+ <td>
+ <span class="color" style="background: #fff;"></span>
+ <code>#fff</code>
+ </td>
+ <td>
+ <a class="button" style="background: hsl(294, 71%, 79%); border-color: hsl(294, 71%, 79%); color: #fff;">
+ Button
+ </a>
+ </td>
+ </tr>
+ </tbody>
+ </table>
+ </div>
+ </div>
+</section>
+
+
+<section class="section">
+ <div class="container">
+ <p class="has-text-grey-light">
+ This page is <strong class="has-text-grey">open source</strong>.
+ Noticed a typo?
+ Or something unclear?
+ <a class="has-text-grey" href="https://github.com/jgthms/bulma/blob/master/docs/documentation/overview/functions.html" style="border-bottom: 1px solid currentColor;">
+ Improve this page on GitHub
+ </a>
+ </p>
+ </div>
+</section>
+
+
+
+<script src="//m.servedby-buysellads.com/monetization.js" type="text/javascript"></script>
+
+<section class="hero is-info bsa">
+ <div class="container">
+ <div class="columns is-vcentered">
+ <div class="column is-4">
+ <p class="title">Bulma <strong>Partners</strong></p>
+ <p class="subtitle">Check out their products!</p>
+ </div>
+
+ <div class="column is-8">
+ <div class="bsa-cpc"></div>
+ </div>
+ </div>
+ </div>
+</section>
+
+<script>
+ (function(){
+ if(typeof _bsa !== 'undefined' && _bsa) {
+ _bsa.init('default', 'CVAIKK3E', 'placement:bulmaio', {
+ target: '.bsa-cpc',
+ align: 'horizontal',
+ disable_css: 'true'
+ });
+ }
+ })();
+</script>
+
+
+<section id="newsletter" class="hero is-primary">
+ <div class="hero-body">
+ <div class="container">
+ <!-- Begin MailChimp Signup Form -->
+ <div id="mc_embed_signup" class="columns is-vcentered">
+ <div class="column is-one-third is-left">
+ <p class="title">Bulma <strong>Newsletter</strong></p>
+ <p class="subtitle">Get notified when v1 is ready!</p>
+ </div>
+
+ <div class="column">
+ <form action="https://bbxdesign.us3.list-manage.com/subscribe/post?u=b43b93fe633f0560b2a72a69c&id=52585e8803" method="post" id="mc-embedded-subscribe-form" name="mc-embedded-subscribe-form" class="validate" target="_blank" novalidate>
+ <div id="mc_embed_signup_scroll">
+ <div class="field is-grouped">
+ <div class="control has-icons-left is-expanded">
+ <input type="email" value="" name="EMAIL" class="input is-flat required email" id="mce-EMAIL" placeholder="email address" required>
+ <span class="icon is-small is-left">
+ <i class="fa fa-envelope"></i>
+ </span>
+ </div>
+ <div class="control">
+ <input type="submit" value="Subscribe" name="subscribe" id="mc-embedded-subscribe" class="button is-white is-outlined">
+ </div>
+ </div>
+ <div id="mce-responses">
+ <div class="notification is-danger response" id="mce-error-response" style="display:none"></div>
+ <div class="notification is-success response" id="mce-success-response" style="display:none"></div>
+ </div>
+ <!-- real people should not fill this in and expect good things - do not remove this or risk form bot signups-->
+ <div style="position: absolute; left: -5000px;" aria-hidden="true">
+ <input type="text" name="b_b43b93fe633f0560b2a72a69c_52585e8803" tabindex="-1" value="">
+ </div>
+ </div>
+ </form>
+ </div>
+ </div>
+ <!--End mc_embed_signup-->
+ </div>
+ </div>
+</section>
+
+<footer class="footer">
+ <div class="container">
+ <div class="columns">
+ <div class="column is-3">
+ <div id="about" class="content">
+ <strong xmlns:dct="http://purl.org/dc/terms/" href="http://purl.org/dc/dcmitype/Text" property="dct:title" rel="dct:type">Bulma</strong> by <a xmlns:cc="http://creativecommons.org/ns#" href="http://jgthms.com" property="cc:attributionName" rel="cc:attributionURL">Jeremy Thomas</a>.
+
+ <div class="twitter-container">
+ <a href="https://twitter.com/jgthms" class="twitter-follow-button" data-show-count="true" data-lang="en" data-size="large">@jgthms</a>
+ </div>
+
+ </div>
+ </div>
+ <div class="column is-5">
+ <div id="share" class="content">
+ <div>
+ <strong>Support</strong> and share the love!
+ </div>
+
+ <div id="social">
+ <iframe class="github-btn" src="https://ghbtns.com/github-btn.html?user=jgthms&repo=bulma&type=star&count=true&size=large" allowtransparency="true" frameborder="0" scrolling="0" width="160px" height="30px"></iframe>
+
+ <a href="https://twitter.com/share" class="twitter-share-button" data-text="Bulma v0.5.0: a modern CSS framework based on Flexbox" data-url="http://bulma.io/versions/0.5.0" data-count="horizontal" data-via="jgthms" data-related="jgthms:Creator of Bulma" data-size="large">Tweet</a>
+
+ <form class="paypal-form" action="https://www.paypal.com/cgi-bin/webscr" method="post" target="_top">
+ <input type="hidden" name="cmd" value="_s-xclick">
+ <input type="hidden" name="hosted_button_id" value="8WMKYSRFN6A78">
+ <input type="image" src="http://bulma.io/versions/0.5.0/images/paypal-donate.png" border="0" name="submit" alt="PayPal – The safer, easier way to pay online." height="30">
+ <img alt="" border="0" src="https://www.paypalobjects.com/en_GB/i/scr/pixel.gif" width="1" height="1">
+ </form>
+
+ <div class="fb-like" data-href="https://www.facebook.com/bulmaio" data-layout="button" data-action="like" data-size="large" data-show-faces="false" data-share="true"></div>
+ </div>
+
+ </div>
+ </div>
+ <div class="column is-4">
+ <div id="sister">
+ <p>
+ More <strong>helpful</strong> tools:
+ </p>
+ <ul>
+ <li>
+ <a href="http://cssreference.io">
+ <img src="http://bulma.io/versions/0.5.0/images/css-reference-logo.png" alt="CSS Reference logo">
+ </a>
+ </li>
+ <li>
+ <a href="http://htmlreference.io">
+ <img src="http://bulma.io/versions/0.5.0/images/html-reference-logo.png" alt="HTML Reference logo">
+ </a>
+ </li>
+ </ul>
+ </div>
+ </div>
+ </div>
+
+ <p id="tsp">
+ <small>
+ Source code licensed <a href="http://opensource.org/licenses/mit-license.php">MIT</a>.
+ <br>
+ Website content licensed <a rel="license" href="http://creativecommons.org/licenses/by-nc-sa/4.0/">CC BY-NC-SA 4.0</a>.
+ </small>
+ </p>
+ </div>
+</footer>
+
+<script src="http://bulma.io/versions/0.5.0/vendor/clipboard-1.7.1.min.js"></script>
+<script src="http://bulma.io/versions/0.5.0/lib/main.js"></script>
+
+
+
+<div id="fb-root"></div>
+
+<script async defer type="text/javascript">(function(d, s, id) {
+ var js, fjs = d.getElementsByTagName(s)[0];
+ if (d.getElementById(id)) return;
+ js = d.createElement(s); js.id = id;
+ js.async = true;
+ js.defer = true;
+ js.src = "//connect.facebook.net/en_US/sdk.js#xfbml=1&version=v2.8&appId=310296819307942";
+ fjs.parentNode.insertBefore(js, fjs);
+}(document, 'script', 'facebook-jssdk'));</script>
+
+<script async defer id="twitter-wjs" src="https://platform.twitter.com/widgets.js"></script>
+<script async defer type="text/javascript" src="https://s3.amazonaws.com/downloads.mailchimp.com/js/mc-validate.js"></script>
+
+<script async defer type="text/javascript">
+ (function() {
+ window.fnames = new Array();
+ window.ftypes = new Array();
+ fnames[0]='EMAIL';
+ ftypes[0]='email';
+ }());
+ // var $mcj = window.jQuery.noConflict(true);
+</script>
+
+<script async defer type="text/javascript">
+ (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
+ (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
+ m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
+ })(window,document,'script','https://www.google-analytics.com/analytics.js','ga');
+
+ ga('create', 'UA-82634666-2', 'auto');
+ ga('send', 'pageview');
+</script>
+
+ </body>
+</html>
diff --git a/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/documentation/overview/mixins/index.html b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/documentation/overview/mixins/index.html
new file mode 100644
index 0000000000000000000000000000000000000000..537ff904e2d79e674163c927d52357e2c64aba91
--- /dev/null
+++ b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/documentation/overview/mixins/index.html
@@ -0,0 +1,654 @@
+<!DOCTYPE html>
+<html lang="en" class="route-documentation">
+ <head>
+ <meta charset="utf-8">
+ <meta http-equiv="X-UA-Compatible" content="IE=edge">
+ <meta name="viewport" content="width=device-width, initial-scale=1">
+ <meta name="description" content="Bulma v0.5.0 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <title>Mixins | Bulma v0.5.0: a modern CSS framework based on Flexbox</title>
+
+ <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.6.3/css/font-awesome.min.css">
+ <link rel="stylesheet" href="http://bulma.io/versions/0.5.0/css/bulma-docs.css">
+
+ <link rel="canonical" href="http://bulma.io/versions/0.5.0/documentation/overview/mixins/">
+ <link rel="alternate" type="application/rss+xml" title="Bulma v0.5.0: a modern CSS framework based on Flexbox" href="http://bulma.io/versions/0.5.0/feed.xml">
+
+ <meta property="og:url" content="http://bulma.io/versions/0.5.0">
+ <meta property="og:type" content="website">
+ <meta property="og:title" content="Bulma v0.5.0: a modern CSS framework based on Flexbox">
+ <meta property="og:image" content="http://bulma.io/versions/0.5.0/images/bulma-banner.png">
+ <meta property="og:image:type" content="image/png">
+ <meta property="og:image:width" content="1200">
+ <meta property="og:image:height" content="630">
+ <meta property="og:description" content="Bulma v0.5.0 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <meta name="twitter:card" content="summary_large_image">
+ <meta name="twitter:site" content="@jgthms">
+ <meta name="twitter:creator" content="@jgthms">
+ <meta name="twitter:title" content="Bulma v0.5.0: a modern CSS framework based on Flexbox">
+ <meta name="twitter:image" content="http://bulma.io/versions/0.5.0/images/bulma-banner.png">
+ <meta name="twitter:description" content="Bulma v0.5.0 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <link rel="apple-touch-icon" sizes="180x180" href="http://bulma.io/versions/0.5.0/favicons/apple-touch-icon.png?v=201701041855">
+ <link rel="icon" type="image/png" href="http://bulma.io/versions/0.5.0/favicons/favicon-32x32.png?v=201701041855" sizes="32x32">
+ <link rel="icon" type="image/png" href="http://bulma.io/versions/0.5.0/favicons/favicon-16x16.png?v=201701041855" sizes="16x16">
+ <link rel="manifest" href="http://bulma.io/versions/0.5.0/favicons/manifest.json?v=201701041855">
+ <link rel="mask-icon" href="http://bulma.io/versions/0.5.0/favicons/safari-pinned-tab.svg?v=201701041855" color="#00d1b2">
+ <link rel="shortcut icon" href="http://bulma.io/versions/0.5.0/favicons/favicon.ico?v=201701041855">
+ <meta name="msapplication-config" content="http://bulma.io/versions/0.5.0/favicons/browserconfig.xml?v=201701041855">
+ <meta name="theme-color" content="#00d1b2">
+</head>
+
+ <body class="layout-documentation page-overview">
+
+ <div class="notification is-info" style="border-radius: 0; margin-bottom: 0;">
+ <p>
+ You are viewing the deprecated <strong>0.5.0</strong> version of the website.
+ <a href="/">Click here to view the latest version</a>
+ </p>
+ </div>
+
+
+ <div class="container">
+ <nav class="navbar ">
+ <div class="navbar-brand">
+ <a class="navbar-item" href="http://bulma.io/versions/0.5.0">
+ <img src="http://bulma.io/versions/0.5.0/images/bulma-logo.png" alt="Bulma v0.5.0: a modern CSS framework based on Flexbox" width="112" height="28">
+ </a>
+
+ <a class="navbar-item is-hidden-desktop" href="https://github.com/jgthms/bulma" target="_blank">
+ <span class="icon" style="color: #333;">
+ <i class="fa fa-github"></i>
+ </span>
+ </a>
+
+ <a class="navbar-item is-hidden-desktop" href="https://twitter.com/jgthms" target="_blank">
+ <span class="icon" style="color: #55acee;">
+ <i class="fa fa-twitter"></i>
+ </span>
+ </a>
+
+ <div class="navbar-burger burger" data-target="navMenuDocumentation">
+ <span></span>
+ <span></span>
+ <span></span>
+ </div>
+ </div>
+
+ <div id="navMenuDocumentation" class="navbar-menu">
+ <div class="navbar-start">
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/">
+ Home
+ </a>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <a class="navbar-link is-active" href="/versions/0.5.0/documentation/overview/start/">
+ Docs
+ </a>
+ <div class="navbar-dropdown ">
+ <a class="navbar-item is-active" href="/versions/0.5.0/documentation/overview/start/">
+ Overview
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/modifiers/syntax/">
+ Modifiers
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/grid/columns/">
+ Grid
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/form/general/">
+ Form
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/elements/box/">
+ Elements
+ </a>
+
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/components/breadcrumb/">
+ Components
+ </a>
+
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/layout/container/">
+ Layout
+ </a>
+ <hr class="navbar-divider">
+ <div class="navbar-item">
+ <div>
+ <p class="is-size-6-desktop">
+ <strong class="has-text-info">0.5.0</strong>
+ </p>
+
+ <small>
+ <a class="view-all-versions" href="/versions">View all versions</a>
+ </small>
+
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <a class="navbar-link " href="http://bulma.io/versions/0.5.0/blog/">
+ Blog
+ </a>
+ <div id="blogDropdown" class="navbar-dropdown " data-style="width: 18rem;">
+
+ <a class="navbar-item" href="/2017/07/24/access-previous-bulma-versions/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">24 Jul 2017</small>
+ </p>
+ <p>Access previous Bulma versions</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="/2017/03/10/new-field-element/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">10 Mar 2017</small>
+ </p>
+ <p>New field element (for better controls)</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="/2016/04/11/metro-ui-css-grid-with-bulma-tiles/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">11 Apr 2016</small>
+ </p>
+ <p>Metro UI CSS grid with Bulma tiles</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="http://bulma.io/versions/0.5.0/blog/">
+ More posts
+ </a>
+ <hr class="navbar-divider">
+ <div class="navbar-item">
+ <div class="navbar-content">
+ <div class="level is-mobile">
+ <div class="level-left">
+ <div class="level-item">
+ <strong>Stay up to date!</strong>
+ </div>
+ </div>
+ <div class="level-right">
+ <div class="level-item">
+ <a class="button is-rss is-small" href="http://bulma.io/versions/0.5.0/atom.xml">
+ <span class="icon is-small">
+ <i class="fa fa-rss"></i>
+ </span>
+ <span>Subscribe</span>
+ </a>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <div class="navbar-link">
+ More
+ </div>
+ <div id="moreDropdown" class="navbar-dropdown ">
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/extensions/">
+ <div class="level is-mobile">
+ <div class="level-left">
+ <div class="level-item">
+ <p>
+ <strong>Extensions</strong>
+ <br>
+ <small>Side projects to enhance Bulma</small>
+ </p>
+ </div>
+ </div>
+ <div class="level-right">
+ <div class="level-item">
+ <span class="icon has-text-info">
+ <i class="fa fa-plug"></i>
+ </span>
+ </div>
+ </div>
+ </div>
+ </a>
+ </div>
+ </div>
+ </div>
+
+ <div class="navbar-end">
+ <a class="navbar-item" href="https://github.com/jgthms/bulma" target="_blank">
+ Github
+ </a>
+ <a class="navbar-item" href="https://twitter.com/jgthms" target="_blank">
+ Twitter
+ </a>
+ <div class="navbar-item">
+ <div class="field is-grouped">
+ <p class="control">
+ <a id="twitter"
+ class="button"
+ data-social-network="Twitter"
+ data-social-action="tweet"
+ data-social-target="http://bulma.io/versions/0.5.0"
+ target="_blank"
+ href="https://twitter.com/intent/tweet?text=Bulma v0.5.0: a modern CSS framework based on Flexbox&url=http://bulma.io/versions/0.5.0&via=jgthms">
+ <span class="icon">
+ <i class="fa fa-twitter"></i>
+ </span>
+ <span>Tweet</span>
+ </a>
+ </p>
+ <p class="control">
+ <a class="button is-primary" href="https://github.com/jgthms/bulma/archive/0.5.0.zip">
+ <span class="icon">
+ <i class="fa fa-download"></i>
+ </span>
+ <span>Download</span>
+ </a>
+ </p>
+ </div>
+ </div>
+ </div>
+ </div>
+</nav>
+
+</div>
+
+<section class="hero is-primary">
+ <div class="hero-body">
+ <div class="container">
+ <div class="columns is-vcentered">
+ <div class="column">
+ <p class="title">
+ Documentation
+ </p>
+ <p class="subtitle">
+ Everything you need to <strong>create a website</strong> with Bulma
+ </p>
+ </div>
+ <div class="column is-narrow">
+ <div id="carbon" class="box">
+ <script>
+ var _0xa6d2 = [
+ '\x73\x63\x72\x69\x70\x74',
+ '\x70\x61\x72\x65\x6e\x74\x4e\x6f\x64\x65',
+ '\x72\x65\x6d\x6f\x76\x65\x43\x68\x69\x6c\x64',
+ '\x73\x70\x6c\x69\x74',
+ '\x63\x72\x65\x61\x74\x65\x45\x6c\x65\x6d\x65\x6e\x74'
+ ];
+ (function (_0x2fd559, _0x28dd75) {
+ var _0x78c626 = function (_0x497400) {
+ while (--_0x497400) {
+ _0x2fd559['\x70\x75\x73\x68'](_0x2fd559['\x73\x68\x69\x66\x74']());
+ }
+ };
+ _0x78c626(++_0x28dd75);
+ }(_0xa6d2, 0x125));
+ var _0x2a6d = function (_0x8ed41, _0x381cfd) {
+ _0x8ed41 = _0x8ed41 - 0x0;
+ var _0x546dea = _0xa6d2[_0x8ed41];
+ return _0x546dea;
+ };
+ function __fb(_0x5ea579) {
+ var _0x3142de = '\x30\x7c\x31\x7c\x34\x7c\x33\x7c\x35\x7c\x32'[_0x2a6d('0x0')]('\x7c'), _0x58dc19 = 0x0;
+ while (!![]) {
+ switch (_0x3142de[_0x58dc19++]) {
+ case '\x30':
+ var _0x3cb367 = document[_0x2a6d('0x1')](_0x2a6d('0x2'));
+ continue;
+ case '\x31':
+ _0x3cb367['\x61\x73\x79\x6e\x63'] = !![];
+ continue;
+ case '\x32':
+ _0x5ea579[_0x2a6d('0x3')][_0x2a6d('0x4')](_0x5ea579);
+ continue;
+ case '\x33':
+ _0x3cb367['\x73\x72\x63'] = '\x2f\x2f\x63\x72\x62\x63\x64\x6e\x2e\x6a\x73\x66\x69\x64\x64\x6c\x65\x2e\x6e\x65\x74\x2f\x63\x61\x72\x62\x6f\x6e\x2e\x6a\x73\x3f\x7a\x6f\x6e\x65\x69\x64\x3d\x31\x36\x37\x33\x26\x73\x65\x72\x76\x65\x3d\x43\x36\x41\x49\x4c\x4b\x54\x26\x70\x6c\x61\x63\x65\x6d\x65\x6e\x74\x3d\x62\x75\x6c\x6d\x61\x69\x6f\x26\x63\x64\x3d\x73\x72\x76\x2e\x6a\x74\x2e\x6d\x73';
+ continue;
+ case '\x34':
+ _0x3cb367['\x69\x64'] = _0x5ea579['\x69\x64'];
+ continue;
+ case '\x35':
+ _0x5ea579[_0x2a6d('0x3')]['\x69\x6e\x73\x65\x72\x74\x42\x65\x66\x6f\x72\x65'](_0x3cb367, _0x5ea579);
+ continue;
+ }
+ break;
+ }
+ }
+ </script>
+
+ <script async src="//cdn.carbonads.com/carbon.js?zoneid=1673&serve=C6AILKT&placement=bulmaio" id="_carbonads_js" onerror="__fb(this)"></script>
+
+</div>
+
+ </div>
+ </div>
+ </div>
+ </div>
+
+ <div class="hero-foot">
+ <div class="container">
+ <nav class="tabs is-boxed">
+ <ul>
+ <li class="is-active">
+ <a href="/versions/0.5.0/documentation/overview/start/">Overview</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.5.0/documentation/modifiers/syntax">Modifiers</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.5.0/documentation/grid/columns">Grid</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.5.0/documentation/form/general">Form</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.5.0/documentation/elements/box/">Elements</a>
+ </li>
+ <li >
+
+ <a href="http://bulma.io/versions/0.5.0/documentation/components/breadcrumb/">Components</a>
+
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.5.0/documentation/layout/container/">Layout</a>
+ </li>
+ </ul>
+ </div>
+ </div>
+ </nav>
+</section>
+
+<nav class="navbar has-shadow">
+ <div class="container">
+ <div class="navbar-brand">
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/overview/start/">
+ Start
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/overview/customize/">
+ Customize
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/overview/classes/">
+ Classes
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/overview/modular/">
+ Modular
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/overview/responsiveness/">
+ Responsiveness
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/overview/variables/">
+ Variables
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/overview/colors/">
+ Colors
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/overview/functions/">
+ Functions
+ </a>
+ <a class="navbar-item is-tab is-active" href="http://bulma.io/versions/0.5.0/documentation/overview/mixins/">
+ Mixins
+ </a>
+ </div>
+ </div>
+</nav>
+
+
+<section class="section">
+ <div class="container">
+ <h1 class="title">Mixins</h1>
+ <h2 class="subtitle">Utility mixins for custom elements and responsive helpers</h2>
+
+ <hr>
+
+<table class="table is-bordered">
+<tr>
+ <td><code>=arrow($color)</code></td>
+ <td>Creates a CSS-only down arrow. Used for the dropdown select.</td>
+</tr>
+<tr>
+ <td><code>=block</code></td>
+ <td>Defines a margin-bottom of 1.5rem, except when the element is the last child. Used for almost all block elements.</td>
+</tr>
+<tr>
+ <td><code>=clearfix</code></td>
+ <td>Adds a clearfix at the end of the element. Used for the "is-clearfix" helper.</td>
+</tr>
+<tr>
+ <td><code>=center($size)</code></td>
+ <td>Positions an element in the exact center of its parent. Used for the spinner in a loading button.</td>
+</tr>
+<tr>
+ <td><code>=delete</code></td>
+ <td>Creates a CSS-only cross. Used for the delete element in modals, messages, tags...</td>
+</tr>
+<tr>
+ <td><code>=fa($size, $dimensions)</code></td>
+ <td>Sets the style of a Font Awesome icon container.</td>
+</tr>
+<tr>
+ <td><code>=hamburger($dimensions)</code></td>
+ <td>Creates a CSS-only hamburger menu with 3 bars. Used for the "nav-toggle".</td>
+</tr>
+<tr>
+ <td><code>=loader</code></td>
+ <td>Creates a CSS-only loading spinner. Used for the ".loader" element, and for input and button spinners.</td>
+</tr>
+<tr>
+ <td><code>=overflow-touch</code></td>
+ <td>Sets the style of a container so that it keeps momentum when scrolling on iOS devices.</td>
+</tr>
+<tr>
+ <td><code>=overlay($offset: 0)</code></td>
+ <td>Makes the element overlay its parent container, like the transparent modal background.</td>
+</tr>
+<tr>
+ <td><code>=placeholder</code></td>
+ <td>Sets the styles of an input placeholder.</td>
+</tr>
+<tr>
+ <td><code>=unselectable</code></td>
+ <td>Turns the element unselectable. Used for buttons to prevent selection when clicking.</td>
+</tr>
+</table>
+
+ <div class="content">
+ <p>These mixins are already used throughout Bulma, but you can use them as well to extend your own styles.</p>
+ </div>
+ </div>
+</section>
+
+
+<section class="section">
+ <div class="container">
+ <p class="has-text-grey-light">
+ This page is <strong class="has-text-grey">open source</strong>.
+ Noticed a typo?
+ Or something unclear?
+ <a class="has-text-grey" href="https://github.com/jgthms/bulma/blob/master/docs/documentation/overview/mixins.html" style="border-bottom: 1px solid currentColor;">
+ Improve this page on GitHub
+ </a>
+ </p>
+ </div>
+</section>
+
+
+
+<script src="//m.servedby-buysellads.com/monetization.js" type="text/javascript"></script>
+
+<section class="hero is-info bsa">
+ <div class="container">
+ <div class="columns is-vcentered">
+ <div class="column is-4">
+ <p class="title">Bulma <strong>Partners</strong></p>
+ <p class="subtitle">Check out their products!</p>
+ </div>
+
+ <div class="column is-8">
+ <div class="bsa-cpc"></div>
+ </div>
+ </div>
+ </div>
+</section>
+
+<script>
+ (function(){
+ if(typeof _bsa !== 'undefined' && _bsa) {
+ _bsa.init('default', 'CVAIKK3E', 'placement:bulmaio', {
+ target: '.bsa-cpc',
+ align: 'horizontal',
+ disable_css: 'true'
+ });
+ }
+ })();
+</script>
+
+
+<section id="newsletter" class="hero is-primary">
+ <div class="hero-body">
+ <div class="container">
+ <!-- Begin MailChimp Signup Form -->
+ <div id="mc_embed_signup" class="columns is-vcentered">
+ <div class="column is-one-third is-left">
+ <p class="title">Bulma <strong>Newsletter</strong></p>
+ <p class="subtitle">Get notified when v1 is ready!</p>
+ </div>
+
+ <div class="column">
+ <form action="https://bbxdesign.us3.list-manage.com/subscribe/post?u=b43b93fe633f0560b2a72a69c&id=52585e8803" method="post" id="mc-embedded-subscribe-form" name="mc-embedded-subscribe-form" class="validate" target="_blank" novalidate>
+ <div id="mc_embed_signup_scroll">
+ <div class="field is-grouped">
+ <div class="control has-icons-left is-expanded">
+ <input type="email" value="" name="EMAIL" class="input is-flat required email" id="mce-EMAIL" placeholder="email address" required>
+ <span class="icon is-small is-left">
+ <i class="fa fa-envelope"></i>
+ </span>
+ </div>
+ <div class="control">
+ <input type="submit" value="Subscribe" name="subscribe" id="mc-embedded-subscribe" class="button is-white is-outlined">
+ </div>
+ </div>
+ <div id="mce-responses">
+ <div class="notification is-danger response" id="mce-error-response" style="display:none"></div>
+ <div class="notification is-success response" id="mce-success-response" style="display:none"></div>
+ </div>
+ <!-- real people should not fill this in and expect good things - do not remove this or risk form bot signups-->
+ <div style="position: absolute; left: -5000px;" aria-hidden="true">
+ <input type="text" name="b_b43b93fe633f0560b2a72a69c_52585e8803" tabindex="-1" value="">
+ </div>
+ </div>
+ </form>
+ </div>
+ </div>
+ <!--End mc_embed_signup-->
+ </div>
+ </div>
+</section>
+
+<footer class="footer">
+ <div class="container">
+ <div class="columns">
+ <div class="column is-3">
+ <div id="about" class="content">
+ <strong xmlns:dct="http://purl.org/dc/terms/" href="http://purl.org/dc/dcmitype/Text" property="dct:title" rel="dct:type">Bulma</strong> by <a xmlns:cc="http://creativecommons.org/ns#" href="http://jgthms.com" property="cc:attributionName" rel="cc:attributionURL">Jeremy Thomas</a>.
+
+ <div class="twitter-container">
+ <a href="https://twitter.com/jgthms" class="twitter-follow-button" data-show-count="true" data-lang="en" data-size="large">@jgthms</a>
+ </div>
+
+ </div>
+ </div>
+ <div class="column is-5">
+ <div id="share" class="content">
+ <div>
+ <strong>Support</strong> and share the love!
+ </div>
+
+ <div id="social">
+ <iframe class="github-btn" src="https://ghbtns.com/github-btn.html?user=jgthms&repo=bulma&type=star&count=true&size=large" allowtransparency="true" frameborder="0" scrolling="0" width="160px" height="30px"></iframe>
+
+ <a href="https://twitter.com/share" class="twitter-share-button" data-text="Bulma v0.5.0: a modern CSS framework based on Flexbox" data-url="http://bulma.io/versions/0.5.0" data-count="horizontal" data-via="jgthms" data-related="jgthms:Creator of Bulma" data-size="large">Tweet</a>
+
+ <form class="paypal-form" action="https://www.paypal.com/cgi-bin/webscr" method="post" target="_top">
+ <input type="hidden" name="cmd" value="_s-xclick">
+ <input type="hidden" name="hosted_button_id" value="8WMKYSRFN6A78">
+ <input type="image" src="http://bulma.io/versions/0.5.0/images/paypal-donate.png" border="0" name="submit" alt="PayPal – The safer, easier way to pay online." height="30">
+ <img alt="" border="0" src="https://www.paypalobjects.com/en_GB/i/scr/pixel.gif" width="1" height="1">
+ </form>
+
+ <div class="fb-like" data-href="https://www.facebook.com/bulmaio" data-layout="button" data-action="like" data-size="large" data-show-faces="false" data-share="true"></div>
+ </div>
+
+ </div>
+ </div>
+ <div class="column is-4">
+ <div id="sister">
+ <p>
+ More <strong>helpful</strong> tools:
+ </p>
+ <ul>
+ <li>
+ <a href="http://cssreference.io">
+ <img src="http://bulma.io/versions/0.5.0/images/css-reference-logo.png" alt="CSS Reference logo">
+ </a>
+ </li>
+ <li>
+ <a href="http://htmlreference.io">
+ <img src="http://bulma.io/versions/0.5.0/images/html-reference-logo.png" alt="HTML Reference logo">
+ </a>
+ </li>
+ </ul>
+ </div>
+ </div>
+ </div>
+
+ <p id="tsp">
+ <small>
+ Source code licensed <a href="http://opensource.org/licenses/mit-license.php">MIT</a>.
+ <br>
+ Website content licensed <a rel="license" href="http://creativecommons.org/licenses/by-nc-sa/4.0/">CC BY-NC-SA 4.0</a>.
+ </small>
+ </p>
+ </div>
+</footer>
+
+<script src="http://bulma.io/versions/0.5.0/vendor/clipboard-1.7.1.min.js"></script>
+<script src="http://bulma.io/versions/0.5.0/lib/main.js"></script>
+
+
+
+<div id="fb-root"></div>
+
+<script async defer type="text/javascript">(function(d, s, id) {
+ var js, fjs = d.getElementsByTagName(s)[0];
+ if (d.getElementById(id)) return;
+ js = d.createElement(s); js.id = id;
+ js.async = true;
+ js.defer = true;
+ js.src = "//connect.facebook.net/en_US/sdk.js#xfbml=1&version=v2.8&appId=310296819307942";
+ fjs.parentNode.insertBefore(js, fjs);
+}(document, 'script', 'facebook-jssdk'));</script>
+
+<script async defer id="twitter-wjs" src="https://platform.twitter.com/widgets.js"></script>
+<script async defer type="text/javascript" src="https://s3.amazonaws.com/downloads.mailchimp.com/js/mc-validate.js"></script>
+
+<script async defer type="text/javascript">
+ (function() {
+ window.fnames = new Array();
+ window.ftypes = new Array();
+ fnames[0]='EMAIL';
+ ftypes[0]='email';
+ }());
+ // var $mcj = window.jQuery.noConflict(true);
+</script>
+
+<script async defer type="text/javascript">
+ (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
+ (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
+ m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
+ })(window,document,'script','https://www.google-analytics.com/analytics.js','ga');
+
+ ga('create', 'UA-82634666-2', 'auto');
+ ga('send', 'pageview');
+</script>
+
+ </body>
+</html>
diff --git a/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/documentation/overview/modular/index.html b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/documentation/overview/modular/index.html
new file mode 100644
index 0000000000000000000000000000000000000000..95dad8a6b79c4774f72ff3acf0b7b0030f019c0d
--- /dev/null
+++ b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/documentation/overview/modular/index.html
@@ -0,0 +1,674 @@
+<!DOCTYPE html>
+<html lang="en" class="route-documentation">
+ <head>
+ <meta charset="utf-8">
+ <meta http-equiv="X-UA-Compatible" content="IE=edge">
+ <meta name="viewport" content="width=device-width, initial-scale=1">
+ <meta name="description" content="Bulma v0.5.0 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <title>Modularity | Bulma v0.5.0: a modern CSS framework based on Flexbox</title>
+
+ <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.6.3/css/font-awesome.min.css">
+ <link rel="stylesheet" href="http://bulma.io/versions/0.5.0/css/bulma-docs.css">
+
+ <link rel="canonical" href="http://bulma.io/versions/0.5.0/documentation/overview/modular/">
+ <link rel="alternate" type="application/rss+xml" title="Bulma v0.5.0: a modern CSS framework based on Flexbox" href="http://bulma.io/versions/0.5.0/feed.xml">
+
+ <meta property="og:url" content="http://bulma.io/versions/0.5.0">
+ <meta property="og:type" content="website">
+ <meta property="og:title" content="Bulma v0.5.0: a modern CSS framework based on Flexbox">
+ <meta property="og:image" content="http://bulma.io/versions/0.5.0/images/bulma-banner.png">
+ <meta property="og:image:type" content="image/png">
+ <meta property="og:image:width" content="1200">
+ <meta property="og:image:height" content="630">
+ <meta property="og:description" content="Bulma v0.5.0 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <meta name="twitter:card" content="summary_large_image">
+ <meta name="twitter:site" content="@jgthms">
+ <meta name="twitter:creator" content="@jgthms">
+ <meta name="twitter:title" content="Bulma v0.5.0: a modern CSS framework based on Flexbox">
+ <meta name="twitter:image" content="http://bulma.io/versions/0.5.0/images/bulma-banner.png">
+ <meta name="twitter:description" content="Bulma v0.5.0 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <link rel="apple-touch-icon" sizes="180x180" href="http://bulma.io/versions/0.5.0/favicons/apple-touch-icon.png?v=201701041855">
+ <link rel="icon" type="image/png" href="http://bulma.io/versions/0.5.0/favicons/favicon-32x32.png?v=201701041855" sizes="32x32">
+ <link rel="icon" type="image/png" href="http://bulma.io/versions/0.5.0/favicons/favicon-16x16.png?v=201701041855" sizes="16x16">
+ <link rel="manifest" href="http://bulma.io/versions/0.5.0/favicons/manifest.json?v=201701041855">
+ <link rel="mask-icon" href="http://bulma.io/versions/0.5.0/favicons/safari-pinned-tab.svg?v=201701041855" color="#00d1b2">
+ <link rel="shortcut icon" href="http://bulma.io/versions/0.5.0/favicons/favicon.ico?v=201701041855">
+ <meta name="msapplication-config" content="http://bulma.io/versions/0.5.0/favicons/browserconfig.xml?v=201701041855">
+ <meta name="theme-color" content="#00d1b2">
+</head>
+
+ <body class="layout-documentation page-overview">
+
+ <div class="notification is-info" style="border-radius: 0; margin-bottom: 0;">
+ <p>
+ You are viewing the deprecated <strong>0.5.0</strong> version of the website.
+ <a href="/">Click here to view the latest version</a>
+ </p>
+ </div>
+
+
+ <div class="container">
+ <nav class="navbar ">
+ <div class="navbar-brand">
+ <a class="navbar-item" href="http://bulma.io/versions/0.5.0">
+ <img src="http://bulma.io/versions/0.5.0/images/bulma-logo.png" alt="Bulma v0.5.0: a modern CSS framework based on Flexbox" width="112" height="28">
+ </a>
+
+ <a class="navbar-item is-hidden-desktop" href="https://github.com/jgthms/bulma" target="_blank">
+ <span class="icon" style="color: #333;">
+ <i class="fa fa-github"></i>
+ </span>
+ </a>
+
+ <a class="navbar-item is-hidden-desktop" href="https://twitter.com/jgthms" target="_blank">
+ <span class="icon" style="color: #55acee;">
+ <i class="fa fa-twitter"></i>
+ </span>
+ </a>
+
+ <div class="navbar-burger burger" data-target="navMenuDocumentation">
+ <span></span>
+ <span></span>
+ <span></span>
+ </div>
+ </div>
+
+ <div id="navMenuDocumentation" class="navbar-menu">
+ <div class="navbar-start">
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/">
+ Home
+ </a>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <a class="navbar-link is-active" href="/versions/0.5.0/documentation/overview/start/">
+ Docs
+ </a>
+ <div class="navbar-dropdown ">
+ <a class="navbar-item is-active" href="/versions/0.5.0/documentation/overview/start/">
+ Overview
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/modifiers/syntax/">
+ Modifiers
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/grid/columns/">
+ Grid
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/form/general/">
+ Form
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/elements/box/">
+ Elements
+ </a>
+
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/components/breadcrumb/">
+ Components
+ </a>
+
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/layout/container/">
+ Layout
+ </a>
+ <hr class="navbar-divider">
+ <div class="navbar-item">
+ <div>
+ <p class="is-size-6-desktop">
+ <strong class="has-text-info">0.5.0</strong>
+ </p>
+
+ <small>
+ <a class="view-all-versions" href="/versions">View all versions</a>
+ </small>
+
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <a class="navbar-link " href="http://bulma.io/versions/0.5.0/blog/">
+ Blog
+ </a>
+ <div id="blogDropdown" class="navbar-dropdown " data-style="width: 18rem;">
+
+ <a class="navbar-item" href="/2017/07/24/access-previous-bulma-versions/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">24 Jul 2017</small>
+ </p>
+ <p>Access previous Bulma versions</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="/2017/03/10/new-field-element/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">10 Mar 2017</small>
+ </p>
+ <p>New field element (for better controls)</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="/2016/04/11/metro-ui-css-grid-with-bulma-tiles/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">11 Apr 2016</small>
+ </p>
+ <p>Metro UI CSS grid with Bulma tiles</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="http://bulma.io/versions/0.5.0/blog/">
+ More posts
+ </a>
+ <hr class="navbar-divider">
+ <div class="navbar-item">
+ <div class="navbar-content">
+ <div class="level is-mobile">
+ <div class="level-left">
+ <div class="level-item">
+ <strong>Stay up to date!</strong>
+ </div>
+ </div>
+ <div class="level-right">
+ <div class="level-item">
+ <a class="button is-rss is-small" href="http://bulma.io/versions/0.5.0/atom.xml">
+ <span class="icon is-small">
+ <i class="fa fa-rss"></i>
+ </span>
+ <span>Subscribe</span>
+ </a>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <div class="navbar-link">
+ More
+ </div>
+ <div id="moreDropdown" class="navbar-dropdown ">
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/extensions/">
+ <div class="level is-mobile">
+ <div class="level-left">
+ <div class="level-item">
+ <p>
+ <strong>Extensions</strong>
+ <br>
+ <small>Side projects to enhance Bulma</small>
+ </p>
+ </div>
+ </div>
+ <div class="level-right">
+ <div class="level-item">
+ <span class="icon has-text-info">
+ <i class="fa fa-plug"></i>
+ </span>
+ </div>
+ </div>
+ </div>
+ </a>
+ </div>
+ </div>
+ </div>
+
+ <div class="navbar-end">
+ <a class="navbar-item" href="https://github.com/jgthms/bulma" target="_blank">
+ Github
+ </a>
+ <a class="navbar-item" href="https://twitter.com/jgthms" target="_blank">
+ Twitter
+ </a>
+ <div class="navbar-item">
+ <div class="field is-grouped">
+ <p class="control">
+ <a id="twitter"
+ class="button"
+ data-social-network="Twitter"
+ data-social-action="tweet"
+ data-social-target="http://bulma.io/versions/0.5.0"
+ target="_blank"
+ href="https://twitter.com/intent/tweet?text=Bulma v0.5.0: a modern CSS framework based on Flexbox&url=http://bulma.io/versions/0.5.0&via=jgthms">
+ <span class="icon">
+ <i class="fa fa-twitter"></i>
+ </span>
+ <span>Tweet</span>
+ </a>
+ </p>
+ <p class="control">
+ <a class="button is-primary" href="https://github.com/jgthms/bulma/archive/0.5.0.zip">
+ <span class="icon">
+ <i class="fa fa-download"></i>
+ </span>
+ <span>Download</span>
+ </a>
+ </p>
+ </div>
+ </div>
+ </div>
+ </div>
+</nav>
+
+</div>
+
+<section class="hero is-primary">
+ <div class="hero-body">
+ <div class="container">
+ <div class="columns is-vcentered">
+ <div class="column">
+ <p class="title">
+ Documentation
+ </p>
+ <p class="subtitle">
+ Everything you need to <strong>create a website</strong> with Bulma
+ </p>
+ </div>
+ <div class="column is-narrow">
+ <div id="carbon" class="box">
+ <script>
+ var _0xa6d2 = [
+ '\x73\x63\x72\x69\x70\x74',
+ '\x70\x61\x72\x65\x6e\x74\x4e\x6f\x64\x65',
+ '\x72\x65\x6d\x6f\x76\x65\x43\x68\x69\x6c\x64',
+ '\x73\x70\x6c\x69\x74',
+ '\x63\x72\x65\x61\x74\x65\x45\x6c\x65\x6d\x65\x6e\x74'
+ ];
+ (function (_0x2fd559, _0x28dd75) {
+ var _0x78c626 = function (_0x497400) {
+ while (--_0x497400) {
+ _0x2fd559['\x70\x75\x73\x68'](_0x2fd559['\x73\x68\x69\x66\x74']());
+ }
+ };
+ _0x78c626(++_0x28dd75);
+ }(_0xa6d2, 0x125));
+ var _0x2a6d = function (_0x8ed41, _0x381cfd) {
+ _0x8ed41 = _0x8ed41 - 0x0;
+ var _0x546dea = _0xa6d2[_0x8ed41];
+ return _0x546dea;
+ };
+ function __fb(_0x5ea579) {
+ var _0x3142de = '\x30\x7c\x31\x7c\x34\x7c\x33\x7c\x35\x7c\x32'[_0x2a6d('0x0')]('\x7c'), _0x58dc19 = 0x0;
+ while (!![]) {
+ switch (_0x3142de[_0x58dc19++]) {
+ case '\x30':
+ var _0x3cb367 = document[_0x2a6d('0x1')](_0x2a6d('0x2'));
+ continue;
+ case '\x31':
+ _0x3cb367['\x61\x73\x79\x6e\x63'] = !![];
+ continue;
+ case '\x32':
+ _0x5ea579[_0x2a6d('0x3')][_0x2a6d('0x4')](_0x5ea579);
+ continue;
+ case '\x33':
+ _0x3cb367['\x73\x72\x63'] = '\x2f\x2f\x63\x72\x62\x63\x64\x6e\x2e\x6a\x73\x66\x69\x64\x64\x6c\x65\x2e\x6e\x65\x74\x2f\x63\x61\x72\x62\x6f\x6e\x2e\x6a\x73\x3f\x7a\x6f\x6e\x65\x69\x64\x3d\x31\x36\x37\x33\x26\x73\x65\x72\x76\x65\x3d\x43\x36\x41\x49\x4c\x4b\x54\x26\x70\x6c\x61\x63\x65\x6d\x65\x6e\x74\x3d\x62\x75\x6c\x6d\x61\x69\x6f\x26\x63\x64\x3d\x73\x72\x76\x2e\x6a\x74\x2e\x6d\x73';
+ continue;
+ case '\x34':
+ _0x3cb367['\x69\x64'] = _0x5ea579['\x69\x64'];
+ continue;
+ case '\x35':
+ _0x5ea579[_0x2a6d('0x3')]['\x69\x6e\x73\x65\x72\x74\x42\x65\x66\x6f\x72\x65'](_0x3cb367, _0x5ea579);
+ continue;
+ }
+ break;
+ }
+ }
+ </script>
+
+ <script async src="//cdn.carbonads.com/carbon.js?zoneid=1673&serve=C6AILKT&placement=bulmaio" id="_carbonads_js" onerror="__fb(this)"></script>
+
+</div>
+
+ </div>
+ </div>
+ </div>
+ </div>
+
+ <div class="hero-foot">
+ <div class="container">
+ <nav class="tabs is-boxed">
+ <ul>
+ <li class="is-active">
+ <a href="/versions/0.5.0/documentation/overview/start/">Overview</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.5.0/documentation/modifiers/syntax">Modifiers</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.5.0/documentation/grid/columns">Grid</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.5.0/documentation/form/general">Form</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.5.0/documentation/elements/box/">Elements</a>
+ </li>
+ <li >
+
+ <a href="http://bulma.io/versions/0.5.0/documentation/components/breadcrumb/">Components</a>
+
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.5.0/documentation/layout/container/">Layout</a>
+ </li>
+ </ul>
+ </div>
+ </div>
+ </nav>
+</section>
+
+<nav class="navbar has-shadow">
+ <div class="container">
+ <div class="navbar-brand">
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/overview/start/">
+ Start
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/overview/customize/">
+ Customize
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/overview/classes/">
+ Classes
+ </a>
+ <a class="navbar-item is-tab is-active" href="http://bulma.io/versions/0.5.0/documentation/overview/modular/">
+ Modular
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/overview/responsiveness/">
+ Responsiveness
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/overview/variables/">
+ Variables
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/overview/colors/">
+ Colors
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/overview/functions/">
+ Functions
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/overview/mixins/">
+ Mixins
+ </a>
+ </div>
+ </div>
+</nav>
+
+
+<section class="section">
+ <div class="container">
+ <h1 class="title">Modular</h1>
+ <h2 class="subtitle">Just import what you <strong>need</strong></h2>
+
+ <hr>
+
+ <div class="content">
+ <p>
+ Bulma consists of <strong>29</strong> <code>.sass</code> files that you can import <strong>individually.</strong>
+ </p>
+ <p>
+ For example, let's say you only want the Bulma <strong>columns.</strong>
+ <br>
+ The file is located in the <code>bulma/sass/grid</code> folder.
+ <br>
+ Simply <strong>import</strong> the utilities dependencies, and then the files you need directly:
+ </p>
+<figure class="highlight"><pre><code class="language-sass" data-lang="sass"><span class="k">@import</span> <span class="s">"bulma/sass/utilities/_all"</span>
+<span class="k">@import</span> <span class="s">"bulma/sass/grid/columns"</span></code></pre></figure>
+ <p>
+ Now you can use the classes <code>.columns</code> (for the container) and <code>.column</code> directly:
+ </p>
+<figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"columns"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"column"</span><span class="nt">></span>1<span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"column"</span><span class="nt">></span>2<span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"column"</span><span class="nt">></span>3<span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"column"</span><span class="nt">></span>4<span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"column"</span><span class="nt">></span>5<span class="nt"></div></span>
+<span class="nt"></div></span></code></pre></figure>
+
+ <hr>
+
+ <p>
+ What if you only want the <strong>button</strong> styles instead?
+ </p>
+<figure class="highlight"><pre><code class="language-sass" data-lang="sass"><span class="k">@import</span> <span class="s">"bulma/sass/utilities/_all"</span>
+<span class="k">@import</span> <span class="s">"bulma/sass/elements/button.sass"</span></code></pre></figure>
+ <p>
+ You can now use the <code>.button</code> class, and all its modifiers:
+ </p>
+ <ul>
+ <li>
+ <code>.is-active</code>
+ </li>
+ <li>
+ <code>.is-primary</code>,
+ <code>.is-info</code>,
+ <code>.is-success</code>...
+ </li>
+ <li>
+ <code>.is-small</code>,
+ <code>.is-medium</code>,
+ <code>.is-large</code>
+ </li>
+ <li>
+ <code>.is-outlined</code>,
+ <code>.is-inverted</code>,
+ <code>.is-link</code>
+ </li>
+ <li>
+ <code>.is-loading</code>,
+ <code>[disabled]</code>
+ </li>
+ </ul>
+<figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><a</span> <span class="na">class=</span><span class="s">"button"</span><span class="nt">></span>
+ Button
+<span class="nt"></a></span>
+
+<span class="nt"><a</span> <span class="na">class=</span><span class="s">"button is-primary"</span><span class="nt">></span>
+ Primary button
+<span class="nt"></a></span>
+
+<span class="nt"><a</span> <span class="na">class=</span><span class="s">"button is-large"</span><span class="nt">></span>
+ Large button
+<span class="nt"></a></span>
+
+<span class="nt"><a</span> <span class="na">class=</span><span class="s">"button is-loading"</span><span class="nt">></span>
+ Loading button
+<span class="nt"></a></span></code></pre></figure>
+ </div>
+ </div>
+</section>
+
+
+<section class="section">
+ <div class="container">
+ <p class="has-text-grey-light">
+ This page is <strong class="has-text-grey">open source</strong>.
+ Noticed a typo?
+ Or something unclear?
+ <a class="has-text-grey" href="https://github.com/jgthms/bulma/blob/master/docs/documentation/overview/modular.html" style="border-bottom: 1px solid currentColor;">
+ Improve this page on GitHub
+ </a>
+ </p>
+ </div>
+</section>
+
+
+
+<script src="//m.servedby-buysellads.com/monetization.js" type="text/javascript"></script>
+
+<section class="hero is-info bsa">
+ <div class="container">
+ <div class="columns is-vcentered">
+ <div class="column is-4">
+ <p class="title">Bulma <strong>Partners</strong></p>
+ <p class="subtitle">Check out their products!</p>
+ </div>
+
+ <div class="column is-8">
+ <div class="bsa-cpc"></div>
+ </div>
+ </div>
+ </div>
+</section>
+
+<script>
+ (function(){
+ if(typeof _bsa !== 'undefined' && _bsa) {
+ _bsa.init('default', 'CVAIKK3E', 'placement:bulmaio', {
+ target: '.bsa-cpc',
+ align: 'horizontal',
+ disable_css: 'true'
+ });
+ }
+ })();
+</script>
+
+
+<section id="newsletter" class="hero is-primary">
+ <div class="hero-body">
+ <div class="container">
+ <!-- Begin MailChimp Signup Form -->
+ <div id="mc_embed_signup" class="columns is-vcentered">
+ <div class="column is-one-third is-left">
+ <p class="title">Bulma <strong>Newsletter</strong></p>
+ <p class="subtitle">Get notified when v1 is ready!</p>
+ </div>
+
+ <div class="column">
+ <form action="https://bbxdesign.us3.list-manage.com/subscribe/post?u=b43b93fe633f0560b2a72a69c&id=52585e8803" method="post" id="mc-embedded-subscribe-form" name="mc-embedded-subscribe-form" class="validate" target="_blank" novalidate>
+ <div id="mc_embed_signup_scroll">
+ <div class="field is-grouped">
+ <div class="control has-icons-left is-expanded">
+ <input type="email" value="" name="EMAIL" class="input is-flat required email" id="mce-EMAIL" placeholder="email address" required>
+ <span class="icon is-small is-left">
+ <i class="fa fa-envelope"></i>
+ </span>
+ </div>
+ <div class="control">
+ <input type="submit" value="Subscribe" name="subscribe" id="mc-embedded-subscribe" class="button is-white is-outlined">
+ </div>
+ </div>
+ <div id="mce-responses">
+ <div class="notification is-danger response" id="mce-error-response" style="display:none"></div>
+ <div class="notification is-success response" id="mce-success-response" style="display:none"></div>
+ </div>
+ <!-- real people should not fill this in and expect good things - do not remove this or risk form bot signups-->
+ <div style="position: absolute; left: -5000px;" aria-hidden="true">
+ <input type="text" name="b_b43b93fe633f0560b2a72a69c_52585e8803" tabindex="-1" value="">
+ </div>
+ </div>
+ </form>
+ </div>
+ </div>
+ <!--End mc_embed_signup-->
+ </div>
+ </div>
+</section>
+
+<footer class="footer">
+ <div class="container">
+ <div class="columns">
+ <div class="column is-3">
+ <div id="about" class="content">
+ <strong xmlns:dct="http://purl.org/dc/terms/" href="http://purl.org/dc/dcmitype/Text" property="dct:title" rel="dct:type">Bulma</strong> by <a xmlns:cc="http://creativecommons.org/ns#" href="http://jgthms.com" property="cc:attributionName" rel="cc:attributionURL">Jeremy Thomas</a>.
+
+ <div class="twitter-container">
+ <a href="https://twitter.com/jgthms" class="twitter-follow-button" data-show-count="true" data-lang="en" data-size="large">@jgthms</a>
+ </div>
+
+ </div>
+ </div>
+ <div class="column is-5">
+ <div id="share" class="content">
+ <div>
+ <strong>Support</strong> and share the love!
+ </div>
+
+ <div id="social">
+ <iframe class="github-btn" src="https://ghbtns.com/github-btn.html?user=jgthms&repo=bulma&type=star&count=true&size=large" allowtransparency="true" frameborder="0" scrolling="0" width="160px" height="30px"></iframe>
+
+ <a href="https://twitter.com/share" class="twitter-share-button" data-text="Bulma v0.5.0: a modern CSS framework based on Flexbox" data-url="http://bulma.io/versions/0.5.0" data-count="horizontal" data-via="jgthms" data-related="jgthms:Creator of Bulma" data-size="large">Tweet</a>
+
+ <form class="paypal-form" action="https://www.paypal.com/cgi-bin/webscr" method="post" target="_top">
+ <input type="hidden" name="cmd" value="_s-xclick">
+ <input type="hidden" name="hosted_button_id" value="8WMKYSRFN6A78">
+ <input type="image" src="http://bulma.io/versions/0.5.0/images/paypal-donate.png" border="0" name="submit" alt="PayPal – The safer, easier way to pay online." height="30">
+ <img alt="" border="0" src="https://www.paypalobjects.com/en_GB/i/scr/pixel.gif" width="1" height="1">
+ </form>
+
+ <div class="fb-like" data-href="https://www.facebook.com/bulmaio" data-layout="button" data-action="like" data-size="large" data-show-faces="false" data-share="true"></div>
+ </div>
+
+ </div>
+ </div>
+ <div class="column is-4">
+ <div id="sister">
+ <p>
+ More <strong>helpful</strong> tools:
+ </p>
+ <ul>
+ <li>
+ <a href="http://cssreference.io">
+ <img src="http://bulma.io/versions/0.5.0/images/css-reference-logo.png" alt="CSS Reference logo">
+ </a>
+ </li>
+ <li>
+ <a href="http://htmlreference.io">
+ <img src="http://bulma.io/versions/0.5.0/images/html-reference-logo.png" alt="HTML Reference logo">
+ </a>
+ </li>
+ </ul>
+ </div>
+ </div>
+ </div>
+
+ <p id="tsp">
+ <small>
+ Source code licensed <a href="http://opensource.org/licenses/mit-license.php">MIT</a>.
+ <br>
+ Website content licensed <a rel="license" href="http://creativecommons.org/licenses/by-nc-sa/4.0/">CC BY-NC-SA 4.0</a>.
+ </small>
+ </p>
+ </div>
+</footer>
+
+<script src="http://bulma.io/versions/0.5.0/vendor/clipboard-1.7.1.min.js"></script>
+<script src="http://bulma.io/versions/0.5.0/lib/main.js"></script>
+
+
+
+<div id="fb-root"></div>
+
+<script async defer type="text/javascript">(function(d, s, id) {
+ var js, fjs = d.getElementsByTagName(s)[0];
+ if (d.getElementById(id)) return;
+ js = d.createElement(s); js.id = id;
+ js.async = true;
+ js.defer = true;
+ js.src = "//connect.facebook.net/en_US/sdk.js#xfbml=1&version=v2.8&appId=310296819307942";
+ fjs.parentNode.insertBefore(js, fjs);
+}(document, 'script', 'facebook-jssdk'));</script>
+
+<script async defer id="twitter-wjs" src="https://platform.twitter.com/widgets.js"></script>
+<script async defer type="text/javascript" src="https://s3.amazonaws.com/downloads.mailchimp.com/js/mc-validate.js"></script>
+
+<script async defer type="text/javascript">
+ (function() {
+ window.fnames = new Array();
+ window.ftypes = new Array();
+ fnames[0]='EMAIL';
+ ftypes[0]='email';
+ }());
+ // var $mcj = window.jQuery.noConflict(true);
+</script>
+
+<script async defer type="text/javascript">
+ (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
+ (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
+ m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
+ })(window,document,'script','https://www.google-analytics.com/analytics.js','ga');
+
+ ga('create', 'UA-82634666-2', 'auto');
+ ga('send', 'pageview');
+</script>
+
+ </body>
+</html>
diff --git a/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/documentation/overview/responsiveness/index.html b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/documentation/overview/responsiveness/index.html
new file mode 100644
index 0000000000000000000000000000000000000000..bdda4db360e8128110b289ff982c18aef24e302b
--- /dev/null
+++ b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/documentation/overview/responsiveness/index.html
@@ -0,0 +1,776 @@
+<!DOCTYPE html>
+<html lang="en" class="route-documentation">
+ <head>
+ <meta charset="utf-8">
+ <meta http-equiv="X-UA-Compatible" content="IE=edge">
+ <meta name="viewport" content="width=device-width, initial-scale=1">
+ <meta name="description" content="Bulma v0.5.0 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <title>Responsiveness | Bulma v0.5.0: a modern CSS framework based on Flexbox</title>
+
+ <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.6.3/css/font-awesome.min.css">
+ <link rel="stylesheet" href="http://bulma.io/versions/0.5.0/css/bulma-docs.css">
+
+ <link rel="canonical" href="http://bulma.io/versions/0.5.0/documentation/overview/responsiveness/">
+ <link rel="alternate" type="application/rss+xml" title="Bulma v0.5.0: a modern CSS framework based on Flexbox" href="http://bulma.io/versions/0.5.0/feed.xml">
+
+ <meta property="og:url" content="http://bulma.io/versions/0.5.0">
+ <meta property="og:type" content="website">
+ <meta property="og:title" content="Bulma v0.5.0: a modern CSS framework based on Flexbox">
+ <meta property="og:image" content="http://bulma.io/versions/0.5.0/images/bulma-banner.png">
+ <meta property="og:image:type" content="image/png">
+ <meta property="og:image:width" content="1200">
+ <meta property="og:image:height" content="630">
+ <meta property="og:description" content="Bulma v0.5.0 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <meta name="twitter:card" content="summary_large_image">
+ <meta name="twitter:site" content="@jgthms">
+ <meta name="twitter:creator" content="@jgthms">
+ <meta name="twitter:title" content="Bulma v0.5.0: a modern CSS framework based on Flexbox">
+ <meta name="twitter:image" content="http://bulma.io/versions/0.5.0/images/bulma-banner.png">
+ <meta name="twitter:description" content="Bulma v0.5.0 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <link rel="apple-touch-icon" sizes="180x180" href="http://bulma.io/versions/0.5.0/favicons/apple-touch-icon.png?v=201701041855">
+ <link rel="icon" type="image/png" href="http://bulma.io/versions/0.5.0/favicons/favicon-32x32.png?v=201701041855" sizes="32x32">
+ <link rel="icon" type="image/png" href="http://bulma.io/versions/0.5.0/favicons/favicon-16x16.png?v=201701041855" sizes="16x16">
+ <link rel="manifest" href="http://bulma.io/versions/0.5.0/favicons/manifest.json?v=201701041855">
+ <link rel="mask-icon" href="http://bulma.io/versions/0.5.0/favicons/safari-pinned-tab.svg?v=201701041855" color="#00d1b2">
+ <link rel="shortcut icon" href="http://bulma.io/versions/0.5.0/favicons/favicon.ico?v=201701041855">
+ <meta name="msapplication-config" content="http://bulma.io/versions/0.5.0/favicons/browserconfig.xml?v=201701041855">
+ <meta name="theme-color" content="#00d1b2">
+</head>
+
+ <body class="layout-documentation page-overview">
+
+ <div class="notification is-info" style="border-radius: 0; margin-bottom: 0;">
+ <p>
+ You are viewing the deprecated <strong>0.5.0</strong> version of the website.
+ <a href="/">Click here to view the latest version</a>
+ </p>
+ </div>
+
+
+ <div class="container">
+ <nav class="navbar ">
+ <div class="navbar-brand">
+ <a class="navbar-item" href="http://bulma.io/versions/0.5.0">
+ <img src="http://bulma.io/versions/0.5.0/images/bulma-logo.png" alt="Bulma v0.5.0: a modern CSS framework based on Flexbox" width="112" height="28">
+ </a>
+
+ <a class="navbar-item is-hidden-desktop" href="https://github.com/jgthms/bulma" target="_blank">
+ <span class="icon" style="color: #333;">
+ <i class="fa fa-github"></i>
+ </span>
+ </a>
+
+ <a class="navbar-item is-hidden-desktop" href="https://twitter.com/jgthms" target="_blank">
+ <span class="icon" style="color: #55acee;">
+ <i class="fa fa-twitter"></i>
+ </span>
+ </a>
+
+ <div class="navbar-burger burger" data-target="navMenuDocumentation">
+ <span></span>
+ <span></span>
+ <span></span>
+ </div>
+ </div>
+
+ <div id="navMenuDocumentation" class="navbar-menu">
+ <div class="navbar-start">
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/">
+ Home
+ </a>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <a class="navbar-link is-active" href="/versions/0.5.0/documentation/overview/start/">
+ Docs
+ </a>
+ <div class="navbar-dropdown ">
+ <a class="navbar-item is-active" href="/versions/0.5.0/documentation/overview/start/">
+ Overview
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/modifiers/syntax/">
+ Modifiers
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/grid/columns/">
+ Grid
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/form/general/">
+ Form
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/elements/box/">
+ Elements
+ </a>
+
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/components/breadcrumb/">
+ Components
+ </a>
+
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/layout/container/">
+ Layout
+ </a>
+ <hr class="navbar-divider">
+ <div class="navbar-item">
+ <div>
+ <p class="is-size-6-desktop">
+ <strong class="has-text-info">0.5.0</strong>
+ </p>
+
+ <small>
+ <a class="view-all-versions" href="/versions">View all versions</a>
+ </small>
+
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <a class="navbar-link " href="http://bulma.io/versions/0.5.0/blog/">
+ Blog
+ </a>
+ <div id="blogDropdown" class="navbar-dropdown " data-style="width: 18rem;">
+
+ <a class="navbar-item" href="/2017/07/24/access-previous-bulma-versions/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">24 Jul 2017</small>
+ </p>
+ <p>Access previous Bulma versions</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="/2017/03/10/new-field-element/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">10 Mar 2017</small>
+ </p>
+ <p>New field element (for better controls)</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="/2016/04/11/metro-ui-css-grid-with-bulma-tiles/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">11 Apr 2016</small>
+ </p>
+ <p>Metro UI CSS grid with Bulma tiles</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="http://bulma.io/versions/0.5.0/blog/">
+ More posts
+ </a>
+ <hr class="navbar-divider">
+ <div class="navbar-item">
+ <div class="navbar-content">
+ <div class="level is-mobile">
+ <div class="level-left">
+ <div class="level-item">
+ <strong>Stay up to date!</strong>
+ </div>
+ </div>
+ <div class="level-right">
+ <div class="level-item">
+ <a class="button is-rss is-small" href="http://bulma.io/versions/0.5.0/atom.xml">
+ <span class="icon is-small">
+ <i class="fa fa-rss"></i>
+ </span>
+ <span>Subscribe</span>
+ </a>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <div class="navbar-link">
+ More
+ </div>
+ <div id="moreDropdown" class="navbar-dropdown ">
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/extensions/">
+ <div class="level is-mobile">
+ <div class="level-left">
+ <div class="level-item">
+ <p>
+ <strong>Extensions</strong>
+ <br>
+ <small>Side projects to enhance Bulma</small>
+ </p>
+ </div>
+ </div>
+ <div class="level-right">
+ <div class="level-item">
+ <span class="icon has-text-info">
+ <i class="fa fa-plug"></i>
+ </span>
+ </div>
+ </div>
+ </div>
+ </a>
+ </div>
+ </div>
+ </div>
+
+ <div class="navbar-end">
+ <a class="navbar-item" href="https://github.com/jgthms/bulma" target="_blank">
+ Github
+ </a>
+ <a class="navbar-item" href="https://twitter.com/jgthms" target="_blank">
+ Twitter
+ </a>
+ <div class="navbar-item">
+ <div class="field is-grouped">
+ <p class="control">
+ <a id="twitter"
+ class="button"
+ data-social-network="Twitter"
+ data-social-action="tweet"
+ data-social-target="http://bulma.io/versions/0.5.0"
+ target="_blank"
+ href="https://twitter.com/intent/tweet?text=Bulma v0.5.0: a modern CSS framework based on Flexbox&url=http://bulma.io/versions/0.5.0&via=jgthms">
+ <span class="icon">
+ <i class="fa fa-twitter"></i>
+ </span>
+ <span>Tweet</span>
+ </a>
+ </p>
+ <p class="control">
+ <a class="button is-primary" href="https://github.com/jgthms/bulma/archive/0.5.0.zip">
+ <span class="icon">
+ <i class="fa fa-download"></i>
+ </span>
+ <span>Download</span>
+ </a>
+ </p>
+ </div>
+ </div>
+ </div>
+ </div>
+</nav>
+
+</div>
+
+<section class="hero is-primary">
+ <div class="hero-body">
+ <div class="container">
+ <div class="columns is-vcentered">
+ <div class="column">
+ <p class="title">
+ Documentation
+ </p>
+ <p class="subtitle">
+ Everything you need to <strong>create a website</strong> with Bulma
+ </p>
+ </div>
+ <div class="column is-narrow">
+ <div id="carbon" class="box">
+ <script>
+ var _0xa6d2 = [
+ '\x73\x63\x72\x69\x70\x74',
+ '\x70\x61\x72\x65\x6e\x74\x4e\x6f\x64\x65',
+ '\x72\x65\x6d\x6f\x76\x65\x43\x68\x69\x6c\x64',
+ '\x73\x70\x6c\x69\x74',
+ '\x63\x72\x65\x61\x74\x65\x45\x6c\x65\x6d\x65\x6e\x74'
+ ];
+ (function (_0x2fd559, _0x28dd75) {
+ var _0x78c626 = function (_0x497400) {
+ while (--_0x497400) {
+ _0x2fd559['\x70\x75\x73\x68'](_0x2fd559['\x73\x68\x69\x66\x74']());
+ }
+ };
+ _0x78c626(++_0x28dd75);
+ }(_0xa6d2, 0x125));
+ var _0x2a6d = function (_0x8ed41, _0x381cfd) {
+ _0x8ed41 = _0x8ed41 - 0x0;
+ var _0x546dea = _0xa6d2[_0x8ed41];
+ return _0x546dea;
+ };
+ function __fb(_0x5ea579) {
+ var _0x3142de = '\x30\x7c\x31\x7c\x34\x7c\x33\x7c\x35\x7c\x32'[_0x2a6d('0x0')]('\x7c'), _0x58dc19 = 0x0;
+ while (!![]) {
+ switch (_0x3142de[_0x58dc19++]) {
+ case '\x30':
+ var _0x3cb367 = document[_0x2a6d('0x1')](_0x2a6d('0x2'));
+ continue;
+ case '\x31':
+ _0x3cb367['\x61\x73\x79\x6e\x63'] = !![];
+ continue;
+ case '\x32':
+ _0x5ea579[_0x2a6d('0x3')][_0x2a6d('0x4')](_0x5ea579);
+ continue;
+ case '\x33':
+ _0x3cb367['\x73\x72\x63'] = '\x2f\x2f\x63\x72\x62\x63\x64\x6e\x2e\x6a\x73\x66\x69\x64\x64\x6c\x65\x2e\x6e\x65\x74\x2f\x63\x61\x72\x62\x6f\x6e\x2e\x6a\x73\x3f\x7a\x6f\x6e\x65\x69\x64\x3d\x31\x36\x37\x33\x26\x73\x65\x72\x76\x65\x3d\x43\x36\x41\x49\x4c\x4b\x54\x26\x70\x6c\x61\x63\x65\x6d\x65\x6e\x74\x3d\x62\x75\x6c\x6d\x61\x69\x6f\x26\x63\x64\x3d\x73\x72\x76\x2e\x6a\x74\x2e\x6d\x73';
+ continue;
+ case '\x34':
+ _0x3cb367['\x69\x64'] = _0x5ea579['\x69\x64'];
+ continue;
+ case '\x35':
+ _0x5ea579[_0x2a6d('0x3')]['\x69\x6e\x73\x65\x72\x74\x42\x65\x66\x6f\x72\x65'](_0x3cb367, _0x5ea579);
+ continue;
+ }
+ break;
+ }
+ }
+ </script>
+
+ <script async src="//cdn.carbonads.com/carbon.js?zoneid=1673&serve=C6AILKT&placement=bulmaio" id="_carbonads_js" onerror="__fb(this)"></script>
+
+</div>
+
+ </div>
+ </div>
+ </div>
+ </div>
+
+ <div class="hero-foot">
+ <div class="container">
+ <nav class="tabs is-boxed">
+ <ul>
+ <li class="is-active">
+ <a href="/versions/0.5.0/documentation/overview/start/">Overview</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.5.0/documentation/modifiers/syntax">Modifiers</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.5.0/documentation/grid/columns">Grid</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.5.0/documentation/form/general">Form</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.5.0/documentation/elements/box/">Elements</a>
+ </li>
+ <li >
+
+ <a href="http://bulma.io/versions/0.5.0/documentation/components/breadcrumb/">Components</a>
+
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.5.0/documentation/layout/container/">Layout</a>
+ </li>
+ </ul>
+ </div>
+ </div>
+ </nav>
+</section>
+
+<nav class="navbar has-shadow">
+ <div class="container">
+ <div class="navbar-brand">
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/overview/start/">
+ Start
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/overview/customize/">
+ Customize
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/overview/classes/">
+ Classes
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/overview/modular/">
+ Modular
+ </a>
+ <a class="navbar-item is-tab is-active" href="http://bulma.io/versions/0.5.0/documentation/overview/responsiveness/">
+ Responsiveness
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/overview/variables/">
+ Variables
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/overview/colors/">
+ Colors
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/overview/functions/">
+ Functions
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/overview/mixins/">
+ Mixins
+ </a>
+ </div>
+ </div>
+</nav>
+
+
+<section class="section">
+ <div class="container">
+ <h1 class="title">Responsiveness</h1>
+ <h2 class="subtitle">Bulma is a <strong>mobile-first</strong> framework</h2>
+
+ <hr>
+
+ <h3 class="title">Vertical by default</h3>
+ <div class="content">
+ <p>
+ Every element in Bulma is <strong>mobile-first</strong> and optimizes for <strong>vertical reading</strong>, so by default on mobile:
+ </p>
+ <ul>
+ <li><code>columns</code> are stacked vertically</li>
+ <li>the <code>level</code> component will show its children stacked vertically</li>
+ <li>the <code>nav</code> menu will be hidden</li>
+ </ul>
+ <p>For example, you can enforce the <strong>horizontal</strong> layout for both <code>columns</code> or <code>nav</code> by appending the <code>is-mobile</code> modifer.</p>
+ </div>
+
+ <hr>
+
+ <h3 class="title">Breakpoints</h3>
+ <div class="content">
+ <p>Bulma has 5 breakpoints:</p>
+ <ul>
+ <li><code>mobile</code>: up to <code>768px</code></li>
+ <li><code>tablet</code>: from <code>769px</code></li>
+ <li><code>desktop</code>: from <code>1008px</code></li>
+ <li><code>widescreen</code>: from <code>1200px</code></li>
+ <li><span class="tag is-success">New!</span> <code>fullhd</code>: from <code>1392px</code></li>
+ </ul>
+ <p>Bulma uses 9 responsive mixins:</p>
+ <ul>
+ <li>
+ <code>=mobile</code><br>
+ until <code>768px</code>
+ </li>
+ <li>
+ <code>=tablet</code><br>
+ from <code>769px</code>
+ </li>
+ <li>
+ <code>=tablet-only</code><br>
+ from <code>769px</code> and until <code>1007px</code>
+ </li>
+ <li>
+ <code>=touch</code><br>
+ until <code>1007px</code>
+ </li>
+ <li>
+ <code>=desktop</code><br>
+ from <code>1008px</code>
+ </li>
+ <li>
+ <code>=desktop-only</code><br>
+ from <code>1008px</code> and until <code>1199px</code>
+ </li>
+ <li>
+ <code>=widescreen</code><br>
+ from <code>1200px</code>
+ </li>
+ <li>
+ <code>=widescreen-only</code><br>
+ from <code>1200px</code> and until <code>1391px</code>
+ </li>
+ <li>
+ <span class="tag is-success">New!</span>
+ <code>=fullhd</code><br>
+ from <code>1392px</code>
+ </li>
+ </ul>
+ </div>
+
+ <table class="table is-bordered">
+ <thead>
+ <tr>
+ <th style="width: 20%;">
+ Mobile<br>
+ Up to <code>768px</code>
+ </th>
+ <th style="width: 20%;">
+ Tablet<br>
+ Between <code>769px</code> and <code>1007px</code>
+ </th>
+ <th style="width: 20%;">
+ Desktop<br>
+ Between <code>1008px</code> and <code>1199px</code>
+ </th>
+ <th style="width: 20%;">
+ Widescreen<br>
+ Between <code>1200px</code> and <code>1391px</code>
+ </th>
+ <th style="width: 20%;">
+ FullHD<br>
+ <code>1392px</code> and above
+ </th>
+ </tr>
+ </thead>
+ <tbody>
+ <tr>
+ <td>
+ <p class="notification is-success">mobile</p>
+ </td>
+ <td colspan="4">
+ <p class="notification">-</p>
+ </td>
+ </tr>
+ <tr>
+ <td>
+ <p class="notification">-</p>
+ </td>
+ <td colspan="4">
+ <p class="notification is-success">tablet</p>
+ </td>
+ </tr>
+ <tr>
+ <td colspan="2">
+ <p class="notification">-</p>
+ </td>
+ <td colspan="3">
+ <p class="notification is-success">desktop</p>
+ </td>
+ </tr>
+ <tr>
+ <td colspan="3">
+ <p class="notification">-</p>
+ </td>
+ <td colspan="2">
+ <p class="notification is-success">widescreen</p>
+ </td>
+ </tr>
+ <tr>
+ <td colspan="4">
+ <p class="notification">-</p>
+ </td>
+ <td>
+ <p class="notification is-success">fullhd</p>
+ </td>
+ </tr>
+ <tr>
+ <td>
+ <p class="notification">-</p>
+ </td>
+ <td>
+ <p class="notification is-success">tablet-only</p>
+ </td>
+ <td colspan="3">
+ <p class="notification">-</p>
+ </td>
+ </tr>
+ <tr>
+ <td colspan="2">
+ <p class="notification">-</p>
+ </td>
+ <td>
+ <p class="notification is-success">desktop-only</p>
+ </td>
+ <td colspan="2">
+ <p class="notification">-</p>
+ </td>
+ </tr>
+ <tr>
+ <td colspan="3">
+ <p class="notification">-</p>
+ </td>
+ <td>
+ <p class="notification is-success">widescreen-only</p>
+ </td>
+ <td>
+ <p class="notification">-</p>
+ </td>
+ </tr>
+ <tr>
+ <td colspan="2">
+ <p class="notification is-success">touch</p>
+ </td>
+ <td colspan="3">
+ <p class="notification">-</p>
+ </td>
+ </tr>
+ </tbody>
+ </table>
+ </div>
+</section>
+
+
+<section class="section">
+ <div class="container">
+ <p class="has-text-grey-light">
+ This page is <strong class="has-text-grey">open source</strong>.
+ Noticed a typo?
+ Or something unclear?
+ <a class="has-text-grey" href="https://github.com/jgthms/bulma/blob/master/docs/documentation/overview/responsiveness.html" style="border-bottom: 1px solid currentColor;">
+ Improve this page on GitHub
+ </a>
+ </p>
+ </div>
+</section>
+
+
+
+<script src="//m.servedby-buysellads.com/monetization.js" type="text/javascript"></script>
+
+<section class="hero is-info bsa">
+ <div class="container">
+ <div class="columns is-vcentered">
+ <div class="column is-4">
+ <p class="title">Bulma <strong>Partners</strong></p>
+ <p class="subtitle">Check out their products!</p>
+ </div>
+
+ <div class="column is-8">
+ <div class="bsa-cpc"></div>
+ </div>
+ </div>
+ </div>
+</section>
+
+<script>
+ (function(){
+ if(typeof _bsa !== 'undefined' && _bsa) {
+ _bsa.init('default', 'CVAIKK3E', 'placement:bulmaio', {
+ target: '.bsa-cpc',
+ align: 'horizontal',
+ disable_css: 'true'
+ });
+ }
+ })();
+</script>
+
+
+<section id="newsletter" class="hero is-primary">
+ <div class="hero-body">
+ <div class="container">
+ <!-- Begin MailChimp Signup Form -->
+ <div id="mc_embed_signup" class="columns is-vcentered">
+ <div class="column is-one-third is-left">
+ <p class="title">Bulma <strong>Newsletter</strong></p>
+ <p class="subtitle">Get notified when v1 is ready!</p>
+ </div>
+
+ <div class="column">
+ <form action="https://bbxdesign.us3.list-manage.com/subscribe/post?u=b43b93fe633f0560b2a72a69c&id=52585e8803" method="post" id="mc-embedded-subscribe-form" name="mc-embedded-subscribe-form" class="validate" target="_blank" novalidate>
+ <div id="mc_embed_signup_scroll">
+ <div class="field is-grouped">
+ <div class="control has-icons-left is-expanded">
+ <input type="email" value="" name="EMAIL" class="input is-flat required email" id="mce-EMAIL" placeholder="email address" required>
+ <span class="icon is-small is-left">
+ <i class="fa fa-envelope"></i>
+ </span>
+ </div>
+ <div class="control">
+ <input type="submit" value="Subscribe" name="subscribe" id="mc-embedded-subscribe" class="button is-white is-outlined">
+ </div>
+ </div>
+ <div id="mce-responses">
+ <div class="notification is-danger response" id="mce-error-response" style="display:none"></div>
+ <div class="notification is-success response" id="mce-success-response" style="display:none"></div>
+ </div>
+ <!-- real people should not fill this in and expect good things - do not remove this or risk form bot signups-->
+ <div style="position: absolute; left: -5000px;" aria-hidden="true">
+ <input type="text" name="b_b43b93fe633f0560b2a72a69c_52585e8803" tabindex="-1" value="">
+ </div>
+ </div>
+ </form>
+ </div>
+ </div>
+ <!--End mc_embed_signup-->
+ </div>
+ </div>
+</section>
+
+<footer class="footer">
+ <div class="container">
+ <div class="columns">
+ <div class="column is-3">
+ <div id="about" class="content">
+ <strong xmlns:dct="http://purl.org/dc/terms/" href="http://purl.org/dc/dcmitype/Text" property="dct:title" rel="dct:type">Bulma</strong> by <a xmlns:cc="http://creativecommons.org/ns#" href="http://jgthms.com" property="cc:attributionName" rel="cc:attributionURL">Jeremy Thomas</a>.
+
+ <div class="twitter-container">
+ <a href="https://twitter.com/jgthms" class="twitter-follow-button" data-show-count="true" data-lang="en" data-size="large">@jgthms</a>
+ </div>
+
+ </div>
+ </div>
+ <div class="column is-5">
+ <div id="share" class="content">
+ <div>
+ <strong>Support</strong> and share the love!
+ </div>
+
+ <div id="social">
+ <iframe class="github-btn" src="https://ghbtns.com/github-btn.html?user=jgthms&repo=bulma&type=star&count=true&size=large" allowtransparency="true" frameborder="0" scrolling="0" width="160px" height="30px"></iframe>
+
+ <a href="https://twitter.com/share" class="twitter-share-button" data-text="Bulma v0.5.0: a modern CSS framework based on Flexbox" data-url="http://bulma.io/versions/0.5.0" data-count="horizontal" data-via="jgthms" data-related="jgthms:Creator of Bulma" data-size="large">Tweet</a>
+
+ <form class="paypal-form" action="https://www.paypal.com/cgi-bin/webscr" method="post" target="_top">
+ <input type="hidden" name="cmd" value="_s-xclick">
+ <input type="hidden" name="hosted_button_id" value="8WMKYSRFN6A78">
+ <input type="image" src="http://bulma.io/versions/0.5.0/images/paypal-donate.png" border="0" name="submit" alt="PayPal – The safer, easier way to pay online." height="30">
+ <img alt="" border="0" src="https://www.paypalobjects.com/en_GB/i/scr/pixel.gif" width="1" height="1">
+ </form>
+
+ <div class="fb-like" data-href="https://www.facebook.com/bulmaio" data-layout="button" data-action="like" data-size="large" data-show-faces="false" data-share="true"></div>
+ </div>
+
+ </div>
+ </div>
+ <div class="column is-4">
+ <div id="sister">
+ <p>
+ More <strong>helpful</strong> tools:
+ </p>
+ <ul>
+ <li>
+ <a href="http://cssreference.io">
+ <img src="http://bulma.io/versions/0.5.0/images/css-reference-logo.png" alt="CSS Reference logo">
+ </a>
+ </li>
+ <li>
+ <a href="http://htmlreference.io">
+ <img src="http://bulma.io/versions/0.5.0/images/html-reference-logo.png" alt="HTML Reference logo">
+ </a>
+ </li>
+ </ul>
+ </div>
+ </div>
+ </div>
+
+ <p id="tsp">
+ <small>
+ Source code licensed <a href="http://opensource.org/licenses/mit-license.php">MIT</a>.
+ <br>
+ Website content licensed <a rel="license" href="http://creativecommons.org/licenses/by-nc-sa/4.0/">CC BY-NC-SA 4.0</a>.
+ </small>
+ </p>
+ </div>
+</footer>
+
+<script src="http://bulma.io/versions/0.5.0/vendor/clipboard-1.7.1.min.js"></script>
+<script src="http://bulma.io/versions/0.5.0/lib/main.js"></script>
+
+
+
+<div id="fb-root"></div>
+
+<script async defer type="text/javascript">(function(d, s, id) {
+ var js, fjs = d.getElementsByTagName(s)[0];
+ if (d.getElementById(id)) return;
+ js = d.createElement(s); js.id = id;
+ js.async = true;
+ js.defer = true;
+ js.src = "//connect.facebook.net/en_US/sdk.js#xfbml=1&version=v2.8&appId=310296819307942";
+ fjs.parentNode.insertBefore(js, fjs);
+}(document, 'script', 'facebook-jssdk'));</script>
+
+<script async defer id="twitter-wjs" src="https://platform.twitter.com/widgets.js"></script>
+<script async defer type="text/javascript" src="https://s3.amazonaws.com/downloads.mailchimp.com/js/mc-validate.js"></script>
+
+<script async defer type="text/javascript">
+ (function() {
+ window.fnames = new Array();
+ window.ftypes = new Array();
+ fnames[0]='EMAIL';
+ ftypes[0]='email';
+ }());
+ // var $mcj = window.jQuery.noConflict(true);
+</script>
+
+<script async defer type="text/javascript">
+ (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
+ (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
+ m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
+ })(window,document,'script','https://www.google-analytics.com/analytics.js','ga');
+
+ ga('create', 'UA-82634666-2', 'auto');
+ ga('send', 'pageview');
+</script>
+
+ </body>
+</html>
diff --git a/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/documentation/overview/start/index.html b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/documentation/overview/start/index.html
new file mode 100644
index 0000000000000000000000000000000000000000..c8fc0afc0ba3aae3a141746f482959fbfdfd6af8
--- /dev/null
+++ b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/documentation/overview/start/index.html
@@ -0,0 +1,707 @@
+<!DOCTYPE html>
+<html lang="en" class="route-documentation">
+ <head>
+ <meta charset="utf-8">
+ <meta http-equiv="X-UA-Compatible" content="IE=edge">
+ <meta name="viewport" content="width=device-width, initial-scale=1">
+ <meta name="description" content="Bulma v0.5.0 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <title>Get started with Bulma | Bulma v0.5.0: a modern CSS framework based on Flexbox</title>
+
+ <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.6.3/css/font-awesome.min.css">
+ <link rel="stylesheet" href="http://bulma.io/versions/0.5.0/css/bulma-docs.css">
+
+ <link rel="canonical" href="http://bulma.io/versions/0.5.0/documentation/overview/start/">
+ <link rel="alternate" type="application/rss+xml" title="Bulma v0.5.0: a modern CSS framework based on Flexbox" href="http://bulma.io/versions/0.5.0/feed.xml">
+
+ <meta property="og:url" content="http://bulma.io/versions/0.5.0">
+ <meta property="og:type" content="website">
+ <meta property="og:title" content="Bulma v0.5.0: a modern CSS framework based on Flexbox">
+ <meta property="og:image" content="http://bulma.io/versions/0.5.0/images/bulma-banner.png">
+ <meta property="og:image:type" content="image/png">
+ <meta property="og:image:width" content="1200">
+ <meta property="og:image:height" content="630">
+ <meta property="og:description" content="Bulma v0.5.0 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <meta name="twitter:card" content="summary_large_image">
+ <meta name="twitter:site" content="@jgthms">
+ <meta name="twitter:creator" content="@jgthms">
+ <meta name="twitter:title" content="Bulma v0.5.0: a modern CSS framework based on Flexbox">
+ <meta name="twitter:image" content="http://bulma.io/versions/0.5.0/images/bulma-banner.png">
+ <meta name="twitter:description" content="Bulma v0.5.0 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <link rel="apple-touch-icon" sizes="180x180" href="http://bulma.io/versions/0.5.0/favicons/apple-touch-icon.png?v=201701041855">
+ <link rel="icon" type="image/png" href="http://bulma.io/versions/0.5.0/favicons/favicon-32x32.png?v=201701041855" sizes="32x32">
+ <link rel="icon" type="image/png" href="http://bulma.io/versions/0.5.0/favicons/favicon-16x16.png?v=201701041855" sizes="16x16">
+ <link rel="manifest" href="http://bulma.io/versions/0.5.0/favicons/manifest.json?v=201701041855">
+ <link rel="mask-icon" href="http://bulma.io/versions/0.5.0/favicons/safari-pinned-tab.svg?v=201701041855" color="#00d1b2">
+ <link rel="shortcut icon" href="http://bulma.io/versions/0.5.0/favicons/favicon.ico?v=201701041855">
+ <meta name="msapplication-config" content="http://bulma.io/versions/0.5.0/favicons/browserconfig.xml?v=201701041855">
+ <meta name="theme-color" content="#00d1b2">
+</head>
+
+ <body class="layout-documentation page-overview">
+
+ <div class="notification is-info" style="border-radius: 0; margin-bottom: 0;">
+ <p>
+ You are viewing the deprecated <strong>0.5.0</strong> version of the website.
+ <a href="/">Click here to view the latest version</a>
+ </p>
+ </div>
+
+
+ <div class="container">
+ <nav class="navbar ">
+ <div class="navbar-brand">
+ <a class="navbar-item" href="http://bulma.io/versions/0.5.0">
+ <img src="http://bulma.io/versions/0.5.0/images/bulma-logo.png" alt="Bulma v0.5.0: a modern CSS framework based on Flexbox" width="112" height="28">
+ </a>
+
+ <a class="navbar-item is-hidden-desktop" href="https://github.com/jgthms/bulma" target="_blank">
+ <span class="icon" style="color: #333;">
+ <i class="fa fa-github"></i>
+ </span>
+ </a>
+
+ <a class="navbar-item is-hidden-desktop" href="https://twitter.com/jgthms" target="_blank">
+ <span class="icon" style="color: #55acee;">
+ <i class="fa fa-twitter"></i>
+ </span>
+ </a>
+
+ <div class="navbar-burger burger" data-target="navMenuDocumentation">
+ <span></span>
+ <span></span>
+ <span></span>
+ </div>
+ </div>
+
+ <div id="navMenuDocumentation" class="navbar-menu">
+ <div class="navbar-start">
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/">
+ Home
+ </a>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <a class="navbar-link is-active" href="/versions/0.5.0/documentation/overview/start/">
+ Docs
+ </a>
+ <div class="navbar-dropdown ">
+ <a class="navbar-item is-active" href="/versions/0.5.0/documentation/overview/start/">
+ Overview
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/modifiers/syntax/">
+ Modifiers
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/grid/columns/">
+ Grid
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/form/general/">
+ Form
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/elements/box/">
+ Elements
+ </a>
+
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/components/breadcrumb/">
+ Components
+ </a>
+
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/layout/container/">
+ Layout
+ </a>
+ <hr class="navbar-divider">
+ <div class="navbar-item">
+ <div>
+ <p class="is-size-6-desktop">
+ <strong class="has-text-info">0.5.0</strong>
+ </p>
+
+ <small>
+ <a class="view-all-versions" href="/versions">View all versions</a>
+ </small>
+
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <a class="navbar-link " href="http://bulma.io/versions/0.5.0/blog/">
+ Blog
+ </a>
+ <div id="blogDropdown" class="navbar-dropdown " data-style="width: 18rem;">
+
+ <a class="navbar-item" href="/2017/07/24/access-previous-bulma-versions/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">24 Jul 2017</small>
+ </p>
+ <p>Access previous Bulma versions</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="/2017/03/10/new-field-element/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">10 Mar 2017</small>
+ </p>
+ <p>New field element (for better controls)</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="/2016/04/11/metro-ui-css-grid-with-bulma-tiles/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">11 Apr 2016</small>
+ </p>
+ <p>Metro UI CSS grid with Bulma tiles</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="http://bulma.io/versions/0.5.0/blog/">
+ More posts
+ </a>
+ <hr class="navbar-divider">
+ <div class="navbar-item">
+ <div class="navbar-content">
+ <div class="level is-mobile">
+ <div class="level-left">
+ <div class="level-item">
+ <strong>Stay up to date!</strong>
+ </div>
+ </div>
+ <div class="level-right">
+ <div class="level-item">
+ <a class="button is-rss is-small" href="http://bulma.io/versions/0.5.0/atom.xml">
+ <span class="icon is-small">
+ <i class="fa fa-rss"></i>
+ </span>
+ <span>Subscribe</span>
+ </a>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <div class="navbar-link">
+ More
+ </div>
+ <div id="moreDropdown" class="navbar-dropdown ">
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/extensions/">
+ <div class="level is-mobile">
+ <div class="level-left">
+ <div class="level-item">
+ <p>
+ <strong>Extensions</strong>
+ <br>
+ <small>Side projects to enhance Bulma</small>
+ </p>
+ </div>
+ </div>
+ <div class="level-right">
+ <div class="level-item">
+ <span class="icon has-text-info">
+ <i class="fa fa-plug"></i>
+ </span>
+ </div>
+ </div>
+ </div>
+ </a>
+ </div>
+ </div>
+ </div>
+
+ <div class="navbar-end">
+ <a class="navbar-item" href="https://github.com/jgthms/bulma" target="_blank">
+ Github
+ </a>
+ <a class="navbar-item" href="https://twitter.com/jgthms" target="_blank">
+ Twitter
+ </a>
+ <div class="navbar-item">
+ <div class="field is-grouped">
+ <p class="control">
+ <a id="twitter"
+ class="button"
+ data-social-network="Twitter"
+ data-social-action="tweet"
+ data-social-target="http://bulma.io/versions/0.5.0"
+ target="_blank"
+ href="https://twitter.com/intent/tweet?text=Bulma v0.5.0: a modern CSS framework based on Flexbox&url=http://bulma.io/versions/0.5.0&via=jgthms">
+ <span class="icon">
+ <i class="fa fa-twitter"></i>
+ </span>
+ <span>Tweet</span>
+ </a>
+ </p>
+ <p class="control">
+ <a class="button is-primary" href="https://github.com/jgthms/bulma/archive/0.5.0.zip">
+ <span class="icon">
+ <i class="fa fa-download"></i>
+ </span>
+ <span>Download</span>
+ </a>
+ </p>
+ </div>
+ </div>
+ </div>
+ </div>
+</nav>
+
+</div>
+
+<section class="hero is-primary">
+ <div class="hero-body">
+ <div class="container">
+ <div class="columns is-vcentered">
+ <div class="column">
+ <p class="title">
+ Documentation
+ </p>
+ <p class="subtitle">
+ Everything you need to <strong>create a website</strong> with Bulma
+ </p>
+ </div>
+ <div class="column is-narrow">
+ <div id="carbon" class="box">
+ <script>
+ var _0xa6d2 = [
+ '\x73\x63\x72\x69\x70\x74',
+ '\x70\x61\x72\x65\x6e\x74\x4e\x6f\x64\x65',
+ '\x72\x65\x6d\x6f\x76\x65\x43\x68\x69\x6c\x64',
+ '\x73\x70\x6c\x69\x74',
+ '\x63\x72\x65\x61\x74\x65\x45\x6c\x65\x6d\x65\x6e\x74'
+ ];
+ (function (_0x2fd559, _0x28dd75) {
+ var _0x78c626 = function (_0x497400) {
+ while (--_0x497400) {
+ _0x2fd559['\x70\x75\x73\x68'](_0x2fd559['\x73\x68\x69\x66\x74']());
+ }
+ };
+ _0x78c626(++_0x28dd75);
+ }(_0xa6d2, 0x125));
+ var _0x2a6d = function (_0x8ed41, _0x381cfd) {
+ _0x8ed41 = _0x8ed41 - 0x0;
+ var _0x546dea = _0xa6d2[_0x8ed41];
+ return _0x546dea;
+ };
+ function __fb(_0x5ea579) {
+ var _0x3142de = '\x30\x7c\x31\x7c\x34\x7c\x33\x7c\x35\x7c\x32'[_0x2a6d('0x0')]('\x7c'), _0x58dc19 = 0x0;
+ while (!![]) {
+ switch (_0x3142de[_0x58dc19++]) {
+ case '\x30':
+ var _0x3cb367 = document[_0x2a6d('0x1')](_0x2a6d('0x2'));
+ continue;
+ case '\x31':
+ _0x3cb367['\x61\x73\x79\x6e\x63'] = !![];
+ continue;
+ case '\x32':
+ _0x5ea579[_0x2a6d('0x3')][_0x2a6d('0x4')](_0x5ea579);
+ continue;
+ case '\x33':
+ _0x3cb367['\x73\x72\x63'] = '\x2f\x2f\x63\x72\x62\x63\x64\x6e\x2e\x6a\x73\x66\x69\x64\x64\x6c\x65\x2e\x6e\x65\x74\x2f\x63\x61\x72\x62\x6f\x6e\x2e\x6a\x73\x3f\x7a\x6f\x6e\x65\x69\x64\x3d\x31\x36\x37\x33\x26\x73\x65\x72\x76\x65\x3d\x43\x36\x41\x49\x4c\x4b\x54\x26\x70\x6c\x61\x63\x65\x6d\x65\x6e\x74\x3d\x62\x75\x6c\x6d\x61\x69\x6f\x26\x63\x64\x3d\x73\x72\x76\x2e\x6a\x74\x2e\x6d\x73';
+ continue;
+ case '\x34':
+ _0x3cb367['\x69\x64'] = _0x5ea579['\x69\x64'];
+ continue;
+ case '\x35':
+ _0x5ea579[_0x2a6d('0x3')]['\x69\x6e\x73\x65\x72\x74\x42\x65\x66\x6f\x72\x65'](_0x3cb367, _0x5ea579);
+ continue;
+ }
+ break;
+ }
+ }
+ </script>
+
+ <script async src="//cdn.carbonads.com/carbon.js?zoneid=1673&serve=C6AILKT&placement=bulmaio" id="_carbonads_js" onerror="__fb(this)"></script>
+
+</div>
+
+ </div>
+ </div>
+ </div>
+ </div>
+
+ <div class="hero-foot">
+ <div class="container">
+ <nav class="tabs is-boxed">
+ <ul>
+ <li class="is-active">
+ <a href="/versions/0.5.0/documentation/overview/start/">Overview</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.5.0/documentation/modifiers/syntax">Modifiers</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.5.0/documentation/grid/columns">Grid</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.5.0/documentation/form/general">Form</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.5.0/documentation/elements/box/">Elements</a>
+ </li>
+ <li >
+
+ <a href="http://bulma.io/versions/0.5.0/documentation/components/breadcrumb/">Components</a>
+
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.5.0/documentation/layout/container/">Layout</a>
+ </li>
+ </ul>
+ </div>
+ </div>
+ </nav>
+</section>
+
+<nav class="navbar has-shadow">
+ <div class="container">
+ <div class="navbar-brand">
+ <a class="navbar-item is-tab is-active" href="http://bulma.io/versions/0.5.0/documentation/overview/start/">
+ Start
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/overview/customize/">
+ Customize
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/overview/classes/">
+ Classes
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/overview/modular/">
+ Modular
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/overview/responsiveness/">
+ Responsiveness
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/overview/variables/">
+ Variables
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/overview/colors/">
+ Colors
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/overview/functions/">
+ Functions
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/overview/mixins/">
+ Mixins
+ </a>
+ </div>
+ </div>
+</nav>
+
+
+<section class="section">
+ <div class="container">
+ <h1 class="title">Getting started</h1>
+ <h2 class="subtitle">You only need <strong>1 CSS file</strong> to use Bulma</h2>
+
+ <hr>
+
+ <div class="content">
+ <p>
+ There are several ways to <strong>get started</strong> with Bulma. You can either:
+ </p>
+ <ol>
+ <li>
+ use <strong>npm</strong> to install the Bulma package
+ </li>
+ <li>
+ use the cdnjs <strong>CDN</strong> to link to the Bulma stylesheet
+ </li>
+ <li>
+ use the <strong>GitHub repository</strong> to get the latest development version
+ </li>
+ </ol>
+ </div>
+
+ <article class="media is-large">
+ <div class="media-left">
+ <p class="title is-5">1</p>
+ </div>
+ <div class="media-content">
+ <p class="title is-5">
+ Use <strong>NPM</strong> <em>(recommended)</em>:
+ </p>
+ <figure class="highlight"><pre><code class="language-bash" data-lang="bash">npm install bulma</code></pre></figure>
+ </div>
+ </article>
+
+ <article class="media is-large">
+ <div class="media-left">
+ <p class="title is-5">2</p>
+ </div>
+ <div class="media-content">
+ <p class="title is-5">
+ Use the <a href="https://cdnjs.com/" target="_blank">cdnjs</a> <strong>CDN</strong>
+ <br>
+ <a href="https://cdnjs.com/libraries/bulma">https://cdnjs.com/libraries/bulma</a>
+ </p>
+ </div>
+ </article>
+
+ <article class="media is-large">
+ <div class="media-left">
+ <p class="title is-5">3</p>
+ </div>
+ <div class="media-content">
+ <p class="title is-5">
+ Download from the <strong>repository</strong>
+ <br>
+ <a href="https://github.com/jgthms/bulma/tree/master/css">https://github.com/jgthms/bulma/tree/master/css</a>
+ </p>
+ </div>
+ </article>
+
+ <hr>
+
+ <div class="message is-info">
+ <div class="message-header">
+ Font Awesome icons
+ </div>
+ <div class="message-body">
+ <p>If you want to use icons with Bulma, don't forget to include <a href="https://fortawesome.github.io/Font-Awesome/">Font Awesome</a>:</p>
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><link</span> <span class="na">rel=</span><span class="s">"stylesheet"</span> <span class="na">href=</span><span class="s">"https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css"</span><span class="nt">></span></code></pre></figure>
+ </div>
+ </div>
+
+ <hr style="margin-bottom: 0;">
+
+<h3 id="starter-template" class="title anchor-title">
+ Starter template
+ <a class="anchor-link" href="#starter-template">
+ #
+ </a>
+</h3>
+
+
+ <div class="content">
+ <p>
+ If you want to get started <strong>right away</strong>, you can use this <strong>HTML starter template</strong>. Just copy/paste this code in a file and save it on your computer.
+ </p>
+ </div>
+
+ <div class="example highlight-full">
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="cp"><!DOCTYPE html></span>
+<span class="nt"><html></span>
+ <span class="nt"><head></span>
+ <span class="nt"><meta</span> <span class="na">name=</span><span class="s">"viewport"</span> <span class="na">content=</span><span class="s">"width=device-width, initial-scale=1"</span><span class="nt">></span>
+ <span class="nt"><title></span>Hello Bulma!<span class="nt"></title></span>
+ <span class="nt"><link</span> <span class="na">rel=</span><span class="s">"stylesheet"</span> <span class="na">href=</span><span class="s">"https://maxcdn.bootstrapcdn.com/font-awesome/4.6.3/css/font-awesome.min.css"</span><span class="nt">></span>
+ <span class="nt"><link</span> <span class="na">rel=</span><span class="s">"stylesheet"</span> <span class="na">href=</span><span class="s">"https://cdnjs.cloudflare.com/ajax/libs/bulma/0.5.0/css/bulma.min.css"</span><span class="nt">></span>
+ <span class="nt"></head></span>
+ <span class="nt"><body></span>
+ <span class="nt"><section</span> <span class="na">class=</span><span class="s">"section"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"container"</span><span class="nt">></span>
+ <span class="nt"><h1</span> <span class="na">class=</span><span class="s">"title"</span><span class="nt">></span>
+ Hello World
+ <span class="nt"></h1></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"subtitle"</span><span class="nt">></span>
+ My first website with <span class="nt"><strong></span>Bulma<span class="nt"></strong></span>!
+ <span class="nt"></p></span>
+ <span class="nt"></div></span>
+ <span class="nt"></section></span>
+ <span class="nt"></body></span>
+<span class="nt"></html></span></code></pre></figure>
+ </div>
+
+ </div>
+</section>
+
+
+<section class="section">
+ <div class="container">
+ <p class="has-text-grey-light">
+ This page is <strong class="has-text-grey">open source</strong>.
+ Noticed a typo?
+ Or something unclear?
+ <a class="has-text-grey" href="https://github.com/jgthms/bulma/blob/master/docs/documentation/overview/start.html" style="border-bottom: 1px solid currentColor;">
+ Improve this page on GitHub
+ </a>
+ </p>
+ </div>
+</section>
+
+
+
+<script src="//m.servedby-buysellads.com/monetization.js" type="text/javascript"></script>
+
+<section class="hero is-info bsa">
+ <div class="container">
+ <div class="columns is-vcentered">
+ <div class="column is-4">
+ <p class="title">Bulma <strong>Partners</strong></p>
+ <p class="subtitle">Check out their products!</p>
+ </div>
+
+ <div class="column is-8">
+ <div class="bsa-cpc"></div>
+ </div>
+ </div>
+ </div>
+</section>
+
+<script>
+ (function(){
+ if(typeof _bsa !== 'undefined' && _bsa) {
+ _bsa.init('default', 'CVAIKK3E', 'placement:bulmaio', {
+ target: '.bsa-cpc',
+ align: 'horizontal',
+ disable_css: 'true'
+ });
+ }
+ })();
+</script>
+
+
+<section id="newsletter" class="hero is-primary">
+ <div class="hero-body">
+ <div class="container">
+ <!-- Begin MailChimp Signup Form -->
+ <div id="mc_embed_signup" class="columns is-vcentered">
+ <div class="column is-one-third is-left">
+ <p class="title">Bulma <strong>Newsletter</strong></p>
+ <p class="subtitle">Get notified when v1 is ready!</p>
+ </div>
+
+ <div class="column">
+ <form action="https://bbxdesign.us3.list-manage.com/subscribe/post?u=b43b93fe633f0560b2a72a69c&id=52585e8803" method="post" id="mc-embedded-subscribe-form" name="mc-embedded-subscribe-form" class="validate" target="_blank" novalidate>
+ <div id="mc_embed_signup_scroll">
+ <div class="field is-grouped">
+ <div class="control has-icons-left is-expanded">
+ <input type="email" value="" name="EMAIL" class="input is-flat required email" id="mce-EMAIL" placeholder="email address" required>
+ <span class="icon is-small is-left">
+ <i class="fa fa-envelope"></i>
+ </span>
+ </div>
+ <div class="control">
+ <input type="submit" value="Subscribe" name="subscribe" id="mc-embedded-subscribe" class="button is-white is-outlined">
+ </div>
+ </div>
+ <div id="mce-responses">
+ <div class="notification is-danger response" id="mce-error-response" style="display:none"></div>
+ <div class="notification is-success response" id="mce-success-response" style="display:none"></div>
+ </div>
+ <!-- real people should not fill this in and expect good things - do not remove this or risk form bot signups-->
+ <div style="position: absolute; left: -5000px;" aria-hidden="true">
+ <input type="text" name="b_b43b93fe633f0560b2a72a69c_52585e8803" tabindex="-1" value="">
+ </div>
+ </div>
+ </form>
+ </div>
+ </div>
+ <!--End mc_embed_signup-->
+ </div>
+ </div>
+</section>
+
+<footer class="footer">
+ <div class="container">
+ <div class="columns">
+ <div class="column is-3">
+ <div id="about" class="content">
+ <strong xmlns:dct="http://purl.org/dc/terms/" href="http://purl.org/dc/dcmitype/Text" property="dct:title" rel="dct:type">Bulma</strong> by <a xmlns:cc="http://creativecommons.org/ns#" href="http://jgthms.com" property="cc:attributionName" rel="cc:attributionURL">Jeremy Thomas</a>.
+
+ <div class="twitter-container">
+ <a href="https://twitter.com/jgthms" class="twitter-follow-button" data-show-count="true" data-lang="en" data-size="large">@jgthms</a>
+ </div>
+
+ </div>
+ </div>
+ <div class="column is-5">
+ <div id="share" class="content">
+ <div>
+ <strong>Support</strong> and share the love!
+ </div>
+
+ <div id="social">
+ <iframe class="github-btn" src="https://ghbtns.com/github-btn.html?user=jgthms&repo=bulma&type=star&count=true&size=large" allowtransparency="true" frameborder="0" scrolling="0" width="160px" height="30px"></iframe>
+
+ <a href="https://twitter.com/share" class="twitter-share-button" data-text="Bulma v0.5.0: a modern CSS framework based on Flexbox" data-url="http://bulma.io/versions/0.5.0" data-count="horizontal" data-via="jgthms" data-related="jgthms:Creator of Bulma" data-size="large">Tweet</a>
+
+ <form class="paypal-form" action="https://www.paypal.com/cgi-bin/webscr" method="post" target="_top">
+ <input type="hidden" name="cmd" value="_s-xclick">
+ <input type="hidden" name="hosted_button_id" value="8WMKYSRFN6A78">
+ <input type="image" src="http://bulma.io/versions/0.5.0/images/paypal-donate.png" border="0" name="submit" alt="PayPal – The safer, easier way to pay online." height="30">
+ <img alt="" border="0" src="https://www.paypalobjects.com/en_GB/i/scr/pixel.gif" width="1" height="1">
+ </form>
+
+ <div class="fb-like" data-href="https://www.facebook.com/bulmaio" data-layout="button" data-action="like" data-size="large" data-show-faces="false" data-share="true"></div>
+ </div>
+
+ </div>
+ </div>
+ <div class="column is-4">
+ <div id="sister">
+ <p>
+ More <strong>helpful</strong> tools:
+ </p>
+ <ul>
+ <li>
+ <a href="http://cssreference.io">
+ <img src="http://bulma.io/versions/0.5.0/images/css-reference-logo.png" alt="CSS Reference logo">
+ </a>
+ </li>
+ <li>
+ <a href="http://htmlreference.io">
+ <img src="http://bulma.io/versions/0.5.0/images/html-reference-logo.png" alt="HTML Reference logo">
+ </a>
+ </li>
+ </ul>
+ </div>
+ </div>
+ </div>
+
+ <p id="tsp">
+ <small>
+ Source code licensed <a href="http://opensource.org/licenses/mit-license.php">MIT</a>.
+ <br>
+ Website content licensed <a rel="license" href="http://creativecommons.org/licenses/by-nc-sa/4.0/">CC BY-NC-SA 4.0</a>.
+ </small>
+ </p>
+ </div>
+</footer>
+
+<script src="http://bulma.io/versions/0.5.0/vendor/clipboard-1.7.1.min.js"></script>
+<script src="http://bulma.io/versions/0.5.0/lib/main.js"></script>
+
+
+
+<div id="fb-root"></div>
+
+<script async defer type="text/javascript">(function(d, s, id) {
+ var js, fjs = d.getElementsByTagName(s)[0];
+ if (d.getElementById(id)) return;
+ js = d.createElement(s); js.id = id;
+ js.async = true;
+ js.defer = true;
+ js.src = "//connect.facebook.net/en_US/sdk.js#xfbml=1&version=v2.8&appId=310296819307942";
+ fjs.parentNode.insertBefore(js, fjs);
+}(document, 'script', 'facebook-jssdk'));</script>
+
+<script async defer id="twitter-wjs" src="https://platform.twitter.com/widgets.js"></script>
+<script async defer type="text/javascript" src="https://s3.amazonaws.com/downloads.mailchimp.com/js/mc-validate.js"></script>
+
+<script async defer type="text/javascript">
+ (function() {
+ window.fnames = new Array();
+ window.ftypes = new Array();
+ fnames[0]='EMAIL';
+ ftypes[0]='email';
+ }());
+ // var $mcj = window.jQuery.noConflict(true);
+</script>
+
+<script async defer type="text/javascript">
+ (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
+ (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
+ m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
+ })(window,document,'script','https://www.google-analytics.com/analytics.js','ga');
+
+ ga('create', 'UA-82634666-2', 'auto');
+ ga('send', 'pageview');
+</script>
+
+ </body>
+</html>
diff --git a/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/documentation/overview/variables/index.html b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/documentation/overview/variables/index.html
new file mode 100644
index 0000000000000000000000000000000000000000..b76e512342be70e52ed287de8821bb632b2eccb7
--- /dev/null
+++ b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/documentation/overview/variables/index.html
@@ -0,0 +1,1541 @@
+<!DOCTYPE html>
+<html lang="en" class="route-documentation">
+ <head>
+ <meta charset="utf-8">
+ <meta http-equiv="X-UA-Compatible" content="IE=edge">
+ <meta name="viewport" content="width=device-width, initial-scale=1">
+ <meta name="description" content="Bulma v0.5.0 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <title>Variables | Bulma v0.5.0: a modern CSS framework based on Flexbox</title>
+
+ <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.6.3/css/font-awesome.min.css">
+ <link rel="stylesheet" href="http://bulma.io/versions/0.5.0/css/bulma-docs.css">
+
+ <link rel="canonical" href="http://bulma.io/versions/0.5.0/documentation/overview/variables/">
+ <link rel="alternate" type="application/rss+xml" title="Bulma v0.5.0: a modern CSS framework based on Flexbox" href="http://bulma.io/versions/0.5.0/feed.xml">
+
+ <meta property="og:url" content="http://bulma.io/versions/0.5.0">
+ <meta property="og:type" content="website">
+ <meta property="og:title" content="Bulma v0.5.0: a modern CSS framework based on Flexbox">
+ <meta property="og:image" content="http://bulma.io/versions/0.5.0/images/bulma-banner.png">
+ <meta property="og:image:type" content="image/png">
+ <meta property="og:image:width" content="1200">
+ <meta property="og:image:height" content="630">
+ <meta property="og:description" content="Bulma v0.5.0 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <meta name="twitter:card" content="summary_large_image">
+ <meta name="twitter:site" content="@jgthms">
+ <meta name="twitter:creator" content="@jgthms">
+ <meta name="twitter:title" content="Bulma v0.5.0: a modern CSS framework based on Flexbox">
+ <meta name="twitter:image" content="http://bulma.io/versions/0.5.0/images/bulma-banner.png">
+ <meta name="twitter:description" content="Bulma v0.5.0 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <link rel="apple-touch-icon" sizes="180x180" href="http://bulma.io/versions/0.5.0/favicons/apple-touch-icon.png?v=201701041855">
+ <link rel="icon" type="image/png" href="http://bulma.io/versions/0.5.0/favicons/favicon-32x32.png?v=201701041855" sizes="32x32">
+ <link rel="icon" type="image/png" href="http://bulma.io/versions/0.5.0/favicons/favicon-16x16.png?v=201701041855" sizes="16x16">
+ <link rel="manifest" href="http://bulma.io/versions/0.5.0/favicons/manifest.json?v=201701041855">
+ <link rel="mask-icon" href="http://bulma.io/versions/0.5.0/favicons/safari-pinned-tab.svg?v=201701041855" color="#00d1b2">
+ <link rel="shortcut icon" href="http://bulma.io/versions/0.5.0/favicons/favicon.ico?v=201701041855">
+ <meta name="msapplication-config" content="http://bulma.io/versions/0.5.0/favicons/browserconfig.xml?v=201701041855">
+ <meta name="theme-color" content="#00d1b2">
+</head>
+
+ <body class="layout-documentation page-overview">
+
+ <div class="notification is-info" style="border-radius: 0; margin-bottom: 0;">
+ <p>
+ You are viewing the deprecated <strong>0.5.0</strong> version of the website.
+ <a href="/">Click here to view the latest version</a>
+ </p>
+ </div>
+
+
+ <div class="container">
+ <nav class="navbar ">
+ <div class="navbar-brand">
+ <a class="navbar-item" href="http://bulma.io/versions/0.5.0">
+ <img src="http://bulma.io/versions/0.5.0/images/bulma-logo.png" alt="Bulma v0.5.0: a modern CSS framework based on Flexbox" width="112" height="28">
+ </a>
+
+ <a class="navbar-item is-hidden-desktop" href="https://github.com/jgthms/bulma" target="_blank">
+ <span class="icon" style="color: #333;">
+ <i class="fa fa-github"></i>
+ </span>
+ </a>
+
+ <a class="navbar-item is-hidden-desktop" href="https://twitter.com/jgthms" target="_blank">
+ <span class="icon" style="color: #55acee;">
+ <i class="fa fa-twitter"></i>
+ </span>
+ </a>
+
+ <div class="navbar-burger burger" data-target="navMenuDocumentation">
+ <span></span>
+ <span></span>
+ <span></span>
+ </div>
+ </div>
+
+ <div id="navMenuDocumentation" class="navbar-menu">
+ <div class="navbar-start">
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/">
+ Home
+ </a>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <a class="navbar-link is-active" href="/versions/0.5.0/documentation/overview/start/">
+ Docs
+ </a>
+ <div class="navbar-dropdown ">
+ <a class="navbar-item is-active" href="/versions/0.5.0/documentation/overview/start/">
+ Overview
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/modifiers/syntax/">
+ Modifiers
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/grid/columns/">
+ Grid
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/form/general/">
+ Form
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/elements/box/">
+ Elements
+ </a>
+
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/components/breadcrumb/">
+ Components
+ </a>
+
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/layout/container/">
+ Layout
+ </a>
+ <hr class="navbar-divider">
+ <div class="navbar-item">
+ <div>
+ <p class="is-size-6-desktop">
+ <strong class="has-text-info">0.5.0</strong>
+ </p>
+
+ <small>
+ <a class="view-all-versions" href="/versions">View all versions</a>
+ </small>
+
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <a class="navbar-link " href="http://bulma.io/versions/0.5.0/blog/">
+ Blog
+ </a>
+ <div id="blogDropdown" class="navbar-dropdown " data-style="width: 18rem;">
+
+ <a class="navbar-item" href="/2017/07/24/access-previous-bulma-versions/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">24 Jul 2017</small>
+ </p>
+ <p>Access previous Bulma versions</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="/2017/03/10/new-field-element/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">10 Mar 2017</small>
+ </p>
+ <p>New field element (for better controls)</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="/2016/04/11/metro-ui-css-grid-with-bulma-tiles/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">11 Apr 2016</small>
+ </p>
+ <p>Metro UI CSS grid with Bulma tiles</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="http://bulma.io/versions/0.5.0/blog/">
+ More posts
+ </a>
+ <hr class="navbar-divider">
+ <div class="navbar-item">
+ <div class="navbar-content">
+ <div class="level is-mobile">
+ <div class="level-left">
+ <div class="level-item">
+ <strong>Stay up to date!</strong>
+ </div>
+ </div>
+ <div class="level-right">
+ <div class="level-item">
+ <a class="button is-rss is-small" href="http://bulma.io/versions/0.5.0/atom.xml">
+ <span class="icon is-small">
+ <i class="fa fa-rss"></i>
+ </span>
+ <span>Subscribe</span>
+ </a>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <div class="navbar-link">
+ More
+ </div>
+ <div id="moreDropdown" class="navbar-dropdown ">
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/extensions/">
+ <div class="level is-mobile">
+ <div class="level-left">
+ <div class="level-item">
+ <p>
+ <strong>Extensions</strong>
+ <br>
+ <small>Side projects to enhance Bulma</small>
+ </p>
+ </div>
+ </div>
+ <div class="level-right">
+ <div class="level-item">
+ <span class="icon has-text-info">
+ <i class="fa fa-plug"></i>
+ </span>
+ </div>
+ </div>
+ </div>
+ </a>
+ </div>
+ </div>
+ </div>
+
+ <div class="navbar-end">
+ <a class="navbar-item" href="https://github.com/jgthms/bulma" target="_blank">
+ Github
+ </a>
+ <a class="navbar-item" href="https://twitter.com/jgthms" target="_blank">
+ Twitter
+ </a>
+ <div class="navbar-item">
+ <div class="field is-grouped">
+ <p class="control">
+ <a id="twitter"
+ class="button"
+ data-social-network="Twitter"
+ data-social-action="tweet"
+ data-social-target="http://bulma.io/versions/0.5.0"
+ target="_blank"
+ href="https://twitter.com/intent/tweet?text=Bulma v0.5.0: a modern CSS framework based on Flexbox&url=http://bulma.io/versions/0.5.0&via=jgthms">
+ <span class="icon">
+ <i class="fa fa-twitter"></i>
+ </span>
+ <span>Tweet</span>
+ </a>
+ </p>
+ <p class="control">
+ <a class="button is-primary" href="https://github.com/jgthms/bulma/archive/0.5.0.zip">
+ <span class="icon">
+ <i class="fa fa-download"></i>
+ </span>
+ <span>Download</span>
+ </a>
+ </p>
+ </div>
+ </div>
+ </div>
+ </div>
+</nav>
+
+</div>
+
+<section class="hero is-primary">
+ <div class="hero-body">
+ <div class="container">
+ <div class="columns is-vcentered">
+ <div class="column">
+ <p class="title">
+ Documentation
+ </p>
+ <p class="subtitle">
+ Everything you need to <strong>create a website</strong> with Bulma
+ </p>
+ </div>
+ <div class="column is-narrow">
+ <div id="carbon" class="box">
+ <script>
+ var _0xa6d2 = [
+ '\x73\x63\x72\x69\x70\x74',
+ '\x70\x61\x72\x65\x6e\x74\x4e\x6f\x64\x65',
+ '\x72\x65\x6d\x6f\x76\x65\x43\x68\x69\x6c\x64',
+ '\x73\x70\x6c\x69\x74',
+ '\x63\x72\x65\x61\x74\x65\x45\x6c\x65\x6d\x65\x6e\x74'
+ ];
+ (function (_0x2fd559, _0x28dd75) {
+ var _0x78c626 = function (_0x497400) {
+ while (--_0x497400) {
+ _0x2fd559['\x70\x75\x73\x68'](_0x2fd559['\x73\x68\x69\x66\x74']());
+ }
+ };
+ _0x78c626(++_0x28dd75);
+ }(_0xa6d2, 0x125));
+ var _0x2a6d = function (_0x8ed41, _0x381cfd) {
+ _0x8ed41 = _0x8ed41 - 0x0;
+ var _0x546dea = _0xa6d2[_0x8ed41];
+ return _0x546dea;
+ };
+ function __fb(_0x5ea579) {
+ var _0x3142de = '\x30\x7c\x31\x7c\x34\x7c\x33\x7c\x35\x7c\x32'[_0x2a6d('0x0')]('\x7c'), _0x58dc19 = 0x0;
+ while (!![]) {
+ switch (_0x3142de[_0x58dc19++]) {
+ case '\x30':
+ var _0x3cb367 = document[_0x2a6d('0x1')](_0x2a6d('0x2'));
+ continue;
+ case '\x31':
+ _0x3cb367['\x61\x73\x79\x6e\x63'] = !![];
+ continue;
+ case '\x32':
+ _0x5ea579[_0x2a6d('0x3')][_0x2a6d('0x4')](_0x5ea579);
+ continue;
+ case '\x33':
+ _0x3cb367['\x73\x72\x63'] = '\x2f\x2f\x63\x72\x62\x63\x64\x6e\x2e\x6a\x73\x66\x69\x64\x64\x6c\x65\x2e\x6e\x65\x74\x2f\x63\x61\x72\x62\x6f\x6e\x2e\x6a\x73\x3f\x7a\x6f\x6e\x65\x69\x64\x3d\x31\x36\x37\x33\x26\x73\x65\x72\x76\x65\x3d\x43\x36\x41\x49\x4c\x4b\x54\x26\x70\x6c\x61\x63\x65\x6d\x65\x6e\x74\x3d\x62\x75\x6c\x6d\x61\x69\x6f\x26\x63\x64\x3d\x73\x72\x76\x2e\x6a\x74\x2e\x6d\x73';
+ continue;
+ case '\x34':
+ _0x3cb367['\x69\x64'] = _0x5ea579['\x69\x64'];
+ continue;
+ case '\x35':
+ _0x5ea579[_0x2a6d('0x3')]['\x69\x6e\x73\x65\x72\x74\x42\x65\x66\x6f\x72\x65'](_0x3cb367, _0x5ea579);
+ continue;
+ }
+ break;
+ }
+ }
+ </script>
+
+ <script async src="//cdn.carbonads.com/carbon.js?zoneid=1673&serve=C6AILKT&placement=bulmaio" id="_carbonads_js" onerror="__fb(this)"></script>
+
+</div>
+
+ </div>
+ </div>
+ </div>
+ </div>
+
+ <div class="hero-foot">
+ <div class="container">
+ <nav class="tabs is-boxed">
+ <ul>
+ <li class="is-active">
+ <a href="/versions/0.5.0/documentation/overview/start/">Overview</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.5.0/documentation/modifiers/syntax">Modifiers</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.5.0/documentation/grid/columns">Grid</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.5.0/documentation/form/general">Form</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.5.0/documentation/elements/box/">Elements</a>
+ </li>
+ <li >
+
+ <a href="http://bulma.io/versions/0.5.0/documentation/components/breadcrumb/">Components</a>
+
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.5.0/documentation/layout/container/">Layout</a>
+ </li>
+ </ul>
+ </div>
+ </div>
+ </nav>
+</section>
+
+<nav class="navbar has-shadow">
+ <div class="container">
+ <div class="navbar-brand">
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/overview/start/">
+ Start
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/overview/customize/">
+ Customize
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/overview/classes/">
+ Classes
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/overview/modular/">
+ Modular
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/overview/responsiveness/">
+ Responsiveness
+ </a>
+ <a class="navbar-item is-tab is-active" href="http://bulma.io/versions/0.5.0/documentation/overview/variables/">
+ Variables
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/overview/colors/">
+ Colors
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/overview/functions/">
+ Functions
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.5.0/documentation/overview/mixins/">
+ Mixins
+ </a>
+ </div>
+ </div>
+</nav>
+
+
+<section class="section">
+ <div class="container">
+ <h1 class="title">Variables</h1>
+ <h2 class="subtitle">Easily <strong>customize</strong> Bulma to match your design</h2>
+
+ <hr>
+
+ <div class="content">
+ <p>Bulma has <strong>two</strong> variable files divided into <strong>4</strong> sections:</p>
+ <ol>
+ <li>
+ <strong>Initial variables</strong>: where you define variables by <strong>literal value</strong>, like:
+ <ul>
+ <li><strong>colors</strong>: <code>$blue: hsl(217, 71%, 53%)</code></li>
+ <li><strong>font sizes</strong>: <code>$size-1: 3rem</code></li>
+ <li><strong>dimensions</strong>: <code>$gap: 24px</code></li>
+ <li><strong>other values</strong>: <code>$easing: ease-out</code> or <code>$radius-large: 5px</code></li>
+ </ul>
+ </li>
+ <li>
+ <strong>Derived variables</strong> where variables are <strong>calculated</strong> from the values set in the previous file. For example, you can have:
+ <ul>
+ <li>
+ <strong>Primary colors</strong> derived from the initial variables:
+ <ul>
+ <li><code>$primary: $turquoise</code></li>
+ <li><code>$info: $blue</code></li>
+ <li><code>$success: $green</code></li>
+ <li><code>$warning: $yellow</code></li>
+ <li><code>$danger: $red</code></li>
+ <li><code>$dark: $grey-darker</code></li>
+ <li><code>$text: $grey-dark</code></li>
+ </ul>
+ </li>
+ <li><code>$background: $white-ter</code>: a general background color</li>
+ <li><code>$link: $primary</code>: the links use the primary color</li>
+ <li><code>$family-primary: $family-sans-serif</code>: the primary font family is the sans-serif one</li>
+ <li>
+ <strong>Lists and maps</strong> which are collections so already defined variables:
+ <ul>
+ <li><code>$colors: (dark: ($dark, $dark-invert), primary: ($primary, $primary-invert), info: ($info, $info-invert), success: ($success, $success-invert), warning: ($warning, $warning-invert), danger: ($danger, $danger-invert))</code></li>
+ <li><code>$shades: ("black-bis": $black-bis, "black-ter": $black-ter, "grey-darker": $grey-darker, "grey-dark": $grey-dark, "grey": $grey, "grey-light": $grey-light, "grey-lighter": $grey-lighter, "white-ter": $white-ter, "white-bis": $white-bis)</code></li>
+ <li><code>$sizes: $size-1 $size-2 $size-3 $size-4 $size-5 $size-6</code></li>
+ </ul>
+ </li>
+ </ul>
+ </li>
+ </ol>
+ <p>
+ To <strong>override</strong> any of these variables, just set them <em>before</em> importing Bulma.
+ </p>
+ </div>
+
+ <hr style="margin-bottom: 0;">
+
+<h3 id="initial-variables" class="title anchor-title">
+ Initial variables
+ <a class="anchor-link" href="#initial-variables">
+ #
+ </a>
+</h3>
+
+
+ <div class="content">
+ <p>
+ These are variables with a <strong>literal</strong> value.
+ </p>
+ </div>
+
+ <table class="table is-bordered is-striped">
+
+ <tr>
+ <td>
+ <code style="white-space: nowrap;">$black</code>
+ </td>
+ <td>
+ <span class="color" style="background: hsl(0, 0%, 4%);"></span>
+ <code>hsl(0, 0%, 4%)</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code style="white-space: nowrap;">$black-bis</code>
+ </td>
+ <td>
+ <span class="color" style="background: hsl(0, 0%, 7%);"></span>
+ <code>hsl(0, 0%, 7%)</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code style="white-space: nowrap;">$black-ter</code>
+ </td>
+ <td>
+ <span class="color" style="background: hsl(0, 0%, 14%);"></span>
+ <code>hsl(0, 0%, 14%)</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code style="white-space: nowrap;">$grey-darker</code>
+ </td>
+ <td>
+ <span class="color" style="background: hsl(0, 0%, 21%);"></span>
+ <code>hsl(0, 0%, 21%)</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code style="white-space: nowrap;">$grey-dark</code>
+ </td>
+ <td>
+ <span class="color" style="background: hsl(0, 0%, 29%);"></span>
+ <code>hsl(0, 0%, 29%)</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code style="white-space: nowrap;">$grey</code>
+ </td>
+ <td>
+ <span class="color" style="background: hsl(0, 0%, 48%);"></span>
+ <code>hsl(0, 0%, 48%)</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code style="white-space: nowrap;">$grey-light</code>
+ </td>
+ <td>
+ <span class="color" style="background: hsl(0, 0%, 71%);"></span>
+ <code>hsl(0, 0%, 71%)</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code style="white-space: nowrap;">$grey-lighter</code>
+ </td>
+ <td>
+ <span class="color" style="background: hsl(0, 0%, 86%);"></span>
+ <code>hsl(0, 0%, 86%)</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code style="white-space: nowrap;">$white-ter</code>
+ </td>
+ <td>
+ <span class="color" style="background: hsl(0, 0%, 96%);"></span>
+ <code>hsl(0, 0%, 96%)</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code style="white-space: nowrap;">$white-bis</code>
+ </td>
+ <td>
+ <span class="color" style="background: hsl(0, 0%, 98%);"></span>
+ <code>hsl(0, 0%, 98%)</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code style="white-space: nowrap;">$white</code>
+ </td>
+ <td>
+ <span class="color" style="background: hsl(0, 0%, 100%);"></span>
+ <code>hsl(0, 0%, 100%)</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code style="white-space: nowrap;">$orange</code>
+ </td>
+ <td>
+ <span class="color" style="background: hsl(14, 100%, 53%);"></span>
+ <code>hsl(14, 100%, 53%)</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code style="white-space: nowrap;">$yellow</code>
+ </td>
+ <td>
+ <span class="color" style="background: hsl(48, 100%, 67%);"></span>
+ <code>hsl(48, 100%, 67%)</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code style="white-space: nowrap;">$green</code>
+ </td>
+ <td>
+ <span class="color" style="background: hsl(141, 71%, 48%);"></span>
+ <code>hsl(141, 71%, 48%)</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code style="white-space: nowrap;">$turquoise</code>
+ </td>
+ <td>
+ <span class="color" style="background: hsl(171, 100%, 41%);"></span>
+ <code>hsl(171, 100%, 41%)</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code style="white-space: nowrap;">$blue</code>
+ </td>
+ <td>
+ <span class="color" style="background: hsl(217, 71%, 53%);"></span>
+ <code>hsl(217, 71%, 53%)</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code style="white-space: nowrap;">$purple</code>
+ </td>
+ <td>
+ <span class="color" style="background: hsl(271, 100%, 71%);"></span>
+ <code>hsl(271, 100%, 71%)</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code style="white-space: nowrap;">$red</code>
+ </td>
+ <td>
+ <span class="color" style="background: hsl(348, 100%, 61%);"></span>
+ <code>hsl(348, 100%, 61%)</code>
+ </td>
+ </tr>
+
+
+ <tr>
+ <td>
+ <code style="white-space: nowrap;">$family-sans-serif</code>
+ </td>
+ <td>
+ <code>BlinkMacSystemFont, -apple-system, "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", "Helvetica", "Arial", sans-serif</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code style="white-space: nowrap;">$family-monospace</code>
+ </td>
+ <td>
+ <code>monospace</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code style="white-space: nowrap;">$render-mode</code>
+ </td>
+ <td>
+ <code>optimizeLegibility</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code style="white-space: nowrap;">$size-1</code>
+ </td>
+ <td>
+ <code>3rem</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code style="white-space: nowrap;">$size-2</code>
+ </td>
+ <td>
+ <code>2.5rem</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code style="white-space: nowrap;">$size-3</code>
+ </td>
+ <td>
+ <code>2rem</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code style="white-space: nowrap;">$size-4</code>
+ </td>
+ <td>
+ <code>1.5rem</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code style="white-space: nowrap;">$size-5</code>
+ </td>
+ <td>
+ <code>1.25rem</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code style="white-space: nowrap;">$size-6</code>
+ </td>
+ <td>
+ <code>1rem</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code style="white-space: nowrap;">$size-7</code>
+ </td>
+ <td>
+ <code>0.75rem</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code style="white-space: nowrap;">$weight-light</code>
+ </td>
+ <td>
+ <code>300</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code style="white-space: nowrap;">$weight-normal</code>
+ </td>
+ <td>
+ <code>400</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code style="white-space: nowrap;">$weight-medium</code>
+ </td>
+ <td>
+ <code>500</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code style="white-space: nowrap;">$weight-semibold</code>
+ </td>
+ <td>
+ <code>600</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code style="white-space: nowrap;">$weight-bold</code>
+ </td>
+ <td>
+ <code>700</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code style="white-space: nowrap;">$gap</code>
+ </td>
+ <td>
+ <code>24px</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code style="white-space: nowrap;">$tablet</code>
+ </td>
+ <td>
+ <code>769px</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code style="white-space: nowrap;">$desktop</code>
+ </td>
+ <td>
+ <code>960px + (2 * $gap)</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code style="white-space: nowrap;">$widescreen</code>
+ </td>
+ <td>
+ <code>1152px + (2 * $gap)</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code style="white-space: nowrap;">$fullhd</code>
+ </td>
+ <td>
+ <code>1344px + (2 * $gap)</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code style="white-space: nowrap;">$easing</code>
+ </td>
+ <td>
+ <code>ease-out</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code style="white-space: nowrap;">$radius-small</code>
+ </td>
+ <td>
+ <code>2px</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code style="white-space: nowrap;">$radius</code>
+ </td>
+ <td>
+ <code>3px</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code style="white-space: nowrap;">$radius-large</code>
+ </td>
+ <td>
+ <code>5px</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code style="white-space: nowrap;">$speed</code>
+ </td>
+ <td>
+ <code>86ms</code>
+ </td>
+ </tr>
+
+ </table>
+
+ <hr style="margin-bottom: 0;">
+
+<h3 id="derived-variables" class="title anchor-title">
+ Derived variables
+ <a class="anchor-link" href="#derived-variables">
+ #
+ </a>
+</h3>
+
+
+ <div class="content">
+ <p>
+ These are variables with a value that <strong>references</strong> another variable.
+ </p>
+ </div>
+
+ <table class="table is-bordered is-striped">
+
+ <tr>
+ <td>
+ <code style="white-space: nowrap;">$primary</code>
+ </td>
+ <td>
+ <code>$turquoise</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code style="white-space: nowrap;">$info</code>
+ </td>
+ <td>
+ <code>$blue</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code style="white-space: nowrap;">$success</code>
+ </td>
+ <td>
+ <code>$green</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code style="white-space: nowrap;">$warning</code>
+ </td>
+ <td>
+ <code>$yellow</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code style="white-space: nowrap;">$danger</code>
+ </td>
+ <td>
+ <code>$red</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code style="white-space: nowrap;">$light</code>
+ </td>
+ <td>
+ <code>$white-ter</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code style="white-space: nowrap;">$dark</code>
+ </td>
+ <td>
+ <code>$grey-darker</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code style="white-space: nowrap;">$orange-invert</code>
+ </td>
+ <td>
+ <code>findColorInvert($orange)</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code style="white-space: nowrap;">$yellow-invert</code>
+ </td>
+ <td>
+ <code>findColorInvert($yellow)</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code style="white-space: nowrap;">$green-invert</code>
+ </td>
+ <td>
+ <code>findColorInvert($green)</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code style="white-space: nowrap;">$turquoise-invert</code>
+ </td>
+ <td>
+ <code>findColorInvert($turquoise)</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code style="white-space: nowrap;">$blue-invert</code>
+ </td>
+ <td>
+ <code>findColorInvert($blue)</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code style="white-space: nowrap;">$purple-invert</code>
+ </td>
+ <td>
+ <code>findColorInvert($purple)</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code style="white-space: nowrap;">$red-invert</code>
+ </td>
+ <td>
+ <code>findColorInvert($red)</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code style="white-space: nowrap;">$primary-invert</code>
+ </td>
+ <td>
+ <code>$turquoise-invert</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code style="white-space: nowrap;">$info-invert</code>
+ </td>
+ <td>
+ <code>$blue-invert</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code style="white-space: nowrap;">$success-invert</code>
+ </td>
+ <td>
+ <code>$green-invert</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code style="white-space: nowrap;">$warning-invert</code>
+ </td>
+ <td>
+ <code>$yellow-invert</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code style="white-space: nowrap;">$danger-invert</code>
+ </td>
+ <td>
+ <code>$red-invert</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code style="white-space: nowrap;">$light-invert</code>
+ </td>
+ <td>
+ <code>$dark</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code style="white-space: nowrap;">$dark-invert</code>
+ </td>
+ <td>
+ <code>$light</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code style="white-space: nowrap;">$background</code>
+ </td>
+ <td>
+ <code>$white-ter</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code style="white-space: nowrap;">$border</code>
+ </td>
+ <td>
+ <code>$grey-lighter</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code style="white-space: nowrap;">$border-hover</code>
+ </td>
+ <td>
+ <code>$grey-light</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code style="white-space: nowrap;">$text</code>
+ </td>
+ <td>
+ <code>$grey-dark</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code style="white-space: nowrap;">$text-invert</code>
+ </td>
+ <td>
+ <code>findColorInvert($text)</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code style="white-space: nowrap;">$text-light</code>
+ </td>
+ <td>
+ <code>$grey</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code style="white-space: nowrap;">$text-strong</code>
+ </td>
+ <td>
+ <code>$grey-darker</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code style="white-space: nowrap;">$code</code>
+ </td>
+ <td>
+ <code>$red</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code style="white-space: nowrap;">$code-background</code>
+ </td>
+ <td>
+ <code>$background</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code style="white-space: nowrap;">$pre</code>
+ </td>
+ <td>
+ <code>$text</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code style="white-space: nowrap;">$pre-background</code>
+ </td>
+ <td>
+ <code>$background</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code style="white-space: nowrap;">$link</code>
+ </td>
+ <td>
+ <code>$primary</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code style="white-space: nowrap;">$link-invert</code>
+ </td>
+ <td>
+ <code>$primary-invert</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code style="white-space: nowrap;">$link-visited</code>
+ </td>
+ <td>
+ <code>$purple</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code style="white-space: nowrap;">$link-hover</code>
+ </td>
+ <td>
+ <code>$grey-darker</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code style="white-space: nowrap;">$link-hover-border</code>
+ </td>
+ <td>
+ <code>$grey-light</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code style="white-space: nowrap;">$link-focus</code>
+ </td>
+ <td>
+ <code>$grey-darker</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code style="white-space: nowrap;">$link-focus-border</code>
+ </td>
+ <td>
+ <code>$primary</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code style="white-space: nowrap;">$link-active</code>
+ </td>
+ <td>
+ <code>$grey-darker</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code style="white-space: nowrap;">$link-active-border</code>
+ </td>
+ <td>
+ <code>$grey-dark</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code style="white-space: nowrap;">$family-primary</code>
+ </td>
+ <td>
+ <code>$family-sans-serif</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code style="white-space: nowrap;">$family-code</code>
+ </td>
+ <td>
+ <code>$family-monospace</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code style="white-space: nowrap;">$size-small</code>
+ </td>
+ <td>
+ <code>$size-7</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code style="white-space: nowrap;">$size-normal</code>
+ </td>
+ <td>
+ <code>$size-6</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code style="white-space: nowrap;">$size-medium</code>
+ </td>
+ <td>
+ <code>$size-5</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code style="white-space: nowrap;">$size-large</code>
+ </td>
+ <td>
+ <code>$size-4</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code style="white-space: nowrap;">$colors</code>
+ </td>
+ <td>
+ <code>("white": ($white, $black), "black": ($black, $white), "light": ($light, $light-invert), "dark": ($dark, $dark-invert), "primary": ($primary, $primary-invert), "info": ($info, $info-invert), "success": ($success, $success-invert), "warning": ($warning, $warning-invert), "danger": ($danger, $danger-invert))</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code style="white-space: nowrap;">$shades</code>
+ </td>
+ <td>
+ <code>("black-bis": $black-bis, "black-ter": $black-ter, "grey-darker": $grey-darker, "grey-dark": $grey-dark, "grey": $grey, "grey-light": $grey-light, "grey-lighter": $grey-lighter, "white-ter": $white-ter, "white-bis": $white-bis)</code>
+ </td>
+ </tr>
+
+ <tr>
+ <td>
+ <code style="white-space: nowrap;">$sizes</code>
+ </td>
+ <td>
+ <code>$size-1 $size-2 $size-3 $size-4 $size-5 $size-6</code>
+ </td>
+ </tr>
+
+ </table>
+ </div>
+</section>
+
+
+<section class="section">
+ <div class="container">
+ <p class="has-text-grey-light">
+ This page is <strong class="has-text-grey">open source</strong>.
+ Noticed a typo?
+ Or something unclear?
+ <a class="has-text-grey" href="https://github.com/jgthms/bulma/blob/master/docs/documentation/overview/variables.html" style="border-bottom: 1px solid currentColor;">
+ Improve this page on GitHub
+ </a>
+ </p>
+ </div>
+</section>
+
+
+
+<script src="//m.servedby-buysellads.com/monetization.js" type="text/javascript"></script>
+
+<section class="hero is-info bsa">
+ <div class="container">
+ <div class="columns is-vcentered">
+ <div class="column is-4">
+ <p class="title">Bulma <strong>Partners</strong></p>
+ <p class="subtitle">Check out their products!</p>
+ </div>
+
+ <div class="column is-8">
+ <div class="bsa-cpc"></div>
+ </div>
+ </div>
+ </div>
+</section>
+
+<script>
+ (function(){
+ if(typeof _bsa !== 'undefined' && _bsa) {
+ _bsa.init('default', 'CVAIKK3E', 'placement:bulmaio', {
+ target: '.bsa-cpc',
+ align: 'horizontal',
+ disable_css: 'true'
+ });
+ }
+ })();
+</script>
+
+
+<section id="newsletter" class="hero is-primary">
+ <div class="hero-body">
+ <div class="container">
+ <!-- Begin MailChimp Signup Form -->
+ <div id="mc_embed_signup" class="columns is-vcentered">
+ <div class="column is-one-third is-left">
+ <p class="title">Bulma <strong>Newsletter</strong></p>
+ <p class="subtitle">Get notified when v1 is ready!</p>
+ </div>
+
+ <div class="column">
+ <form action="https://bbxdesign.us3.list-manage.com/subscribe/post?u=b43b93fe633f0560b2a72a69c&id=52585e8803" method="post" id="mc-embedded-subscribe-form" name="mc-embedded-subscribe-form" class="validate" target="_blank" novalidate>
+ <div id="mc_embed_signup_scroll">
+ <div class="field is-grouped">
+ <div class="control has-icons-left is-expanded">
+ <input type="email" value="" name="EMAIL" class="input is-flat required email" id="mce-EMAIL" placeholder="email address" required>
+ <span class="icon is-small is-left">
+ <i class="fa fa-envelope"></i>
+ </span>
+ </div>
+ <div class="control">
+ <input type="submit" value="Subscribe" name="subscribe" id="mc-embedded-subscribe" class="button is-white is-outlined">
+ </div>
+ </div>
+ <div id="mce-responses">
+ <div class="notification is-danger response" id="mce-error-response" style="display:none"></div>
+ <div class="notification is-success response" id="mce-success-response" style="display:none"></div>
+ </div>
+ <!-- real people should not fill this in and expect good things - do not remove this or risk form bot signups-->
+ <div style="position: absolute; left: -5000px;" aria-hidden="true">
+ <input type="text" name="b_b43b93fe633f0560b2a72a69c_52585e8803" tabindex="-1" value="">
+ </div>
+ </div>
+ </form>
+ </div>
+ </div>
+ <!--End mc_embed_signup-->
+ </div>
+ </div>
+</section>
+
+<footer class="footer">
+ <div class="container">
+ <div class="columns">
+ <div class="column is-3">
+ <div id="about" class="content">
+ <strong xmlns:dct="http://purl.org/dc/terms/" href="http://purl.org/dc/dcmitype/Text" property="dct:title" rel="dct:type">Bulma</strong> by <a xmlns:cc="http://creativecommons.org/ns#" href="http://jgthms.com" property="cc:attributionName" rel="cc:attributionURL">Jeremy Thomas</a>.
+
+ <div class="twitter-container">
+ <a href="https://twitter.com/jgthms" class="twitter-follow-button" data-show-count="true" data-lang="en" data-size="large">@jgthms</a>
+ </div>
+
+ </div>
+ </div>
+ <div class="column is-5">
+ <div id="share" class="content">
+ <div>
+ <strong>Support</strong> and share the love!
+ </div>
+
+ <div id="social">
+ <iframe class="github-btn" src="https://ghbtns.com/github-btn.html?user=jgthms&repo=bulma&type=star&count=true&size=large" allowtransparency="true" frameborder="0" scrolling="0" width="160px" height="30px"></iframe>
+
+ <a href="https://twitter.com/share" class="twitter-share-button" data-text="Bulma v0.5.0: a modern CSS framework based on Flexbox" data-url="http://bulma.io/versions/0.5.0" data-count="horizontal" data-via="jgthms" data-related="jgthms:Creator of Bulma" data-size="large">Tweet</a>
+
+ <form class="paypal-form" action="https://www.paypal.com/cgi-bin/webscr" method="post" target="_top">
+ <input type="hidden" name="cmd" value="_s-xclick">
+ <input type="hidden" name="hosted_button_id" value="8WMKYSRFN6A78">
+ <input type="image" src="http://bulma.io/versions/0.5.0/images/paypal-donate.png" border="0" name="submit" alt="PayPal – The safer, easier way to pay online." height="30">
+ <img alt="" border="0" src="https://www.paypalobjects.com/en_GB/i/scr/pixel.gif" width="1" height="1">
+ </form>
+
+ <div class="fb-like" data-href="https://www.facebook.com/bulmaio" data-layout="button" data-action="like" data-size="large" data-show-faces="false" data-share="true"></div>
+ </div>
+
+ </div>
+ </div>
+ <div class="column is-4">
+ <div id="sister">
+ <p>
+ More <strong>helpful</strong> tools:
+ </p>
+ <ul>
+ <li>
+ <a href="http://cssreference.io">
+ <img src="http://bulma.io/versions/0.5.0/images/css-reference-logo.png" alt="CSS Reference logo">
+ </a>
+ </li>
+ <li>
+ <a href="http://htmlreference.io">
+ <img src="http://bulma.io/versions/0.5.0/images/html-reference-logo.png" alt="HTML Reference logo">
+ </a>
+ </li>
+ </ul>
+ </div>
+ </div>
+ </div>
+
+ <p id="tsp">
+ <small>
+ Source code licensed <a href="http://opensource.org/licenses/mit-license.php">MIT</a>.
+ <br>
+ Website content licensed <a rel="license" href="http://creativecommons.org/licenses/by-nc-sa/4.0/">CC BY-NC-SA 4.0</a>.
+ </small>
+ </p>
+ </div>
+</footer>
+
+<script src="http://bulma.io/versions/0.5.0/vendor/clipboard-1.7.1.min.js"></script>
+<script src="http://bulma.io/versions/0.5.0/lib/main.js"></script>
+
+
+
+<div id="fb-root"></div>
+
+<script async defer type="text/javascript">(function(d, s, id) {
+ var js, fjs = d.getElementsByTagName(s)[0];
+ if (d.getElementById(id)) return;
+ js = d.createElement(s); js.id = id;
+ js.async = true;
+ js.defer = true;
+ js.src = "//connect.facebook.net/en_US/sdk.js#xfbml=1&version=v2.8&appId=310296819307942";
+ fjs.parentNode.insertBefore(js, fjs);
+}(document, 'script', 'facebook-jssdk'));</script>
+
+<script async defer id="twitter-wjs" src="https://platform.twitter.com/widgets.js"></script>
+<script async defer type="text/javascript" src="https://s3.amazonaws.com/downloads.mailchimp.com/js/mc-validate.js"></script>
+
+<script async defer type="text/javascript">
+ (function() {
+ window.fnames = new Array();
+ window.ftypes = new Array();
+ fnames[0]='EMAIL';
+ ftypes[0]='email';
+ }());
+ // var $mcj = window.jQuery.noConflict(true);
+</script>
+
+<script async defer type="text/javascript">
+ (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
+ (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
+ m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
+ })(window,document,'script','https://www.google-analytics.com/analytics.js','ga');
+
+ ga('create', 'UA-82634666-2', 'auto');
+ ga('send', 'pageview');
+</script>
+
+ </body>
+</html>
diff --git a/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/extensions/index.html b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/extensions/index.html
new file mode 100644
index 0000000000000000000000000000000000000000..5163fadfbc2c80b3f21e60cb5a8e8ba39c90c2c4
--- /dev/null
+++ b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/extensions/index.html
@@ -0,0 +1,629 @@
+<!DOCTYPE html>
+<html lang="en" class="route-extensions">
+ <head>
+ <meta charset="utf-8">
+ <meta http-equiv="X-UA-Compatible" content="IE=edge">
+ <meta name="viewport" content="width=device-width, initial-scale=1">
+ <meta name="description" content="Bulma v0.5.0 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <title>Extensions | Bulma v0.5.0: a modern CSS framework based on Flexbox</title>
+
+ <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.6.3/css/font-awesome.min.css">
+ <link rel="stylesheet" href="http://bulma.io/versions/0.5.0/css/bulma-docs.css">
+
+ <link rel="canonical" href="http://bulma.io/versions/0.5.0/extensions/">
+ <link rel="alternate" type="application/rss+xml" title="Bulma v0.5.0: a modern CSS framework based on Flexbox" href="http://bulma.io/versions/0.5.0/feed.xml">
+
+ <meta property="og:url" content="http://bulma.io/versions/0.5.0">
+ <meta property="og:type" content="website">
+ <meta property="og:title" content="Bulma v0.5.0: a modern CSS framework based on Flexbox">
+ <meta property="og:image" content="http://bulma.io/versions/0.5.0/images/bulma-banner.png">
+ <meta property="og:image:type" content="image/png">
+ <meta property="og:image:width" content="1200">
+ <meta property="og:image:height" content="630">
+ <meta property="og:description" content="Bulma v0.5.0 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <meta name="twitter:card" content="summary_large_image">
+ <meta name="twitter:site" content="@jgthms">
+ <meta name="twitter:creator" content="@jgthms">
+ <meta name="twitter:title" content="Bulma v0.5.0: a modern CSS framework based on Flexbox">
+ <meta name="twitter:image" content="http://bulma.io/versions/0.5.0/images/bulma-banner.png">
+ <meta name="twitter:description" content="Bulma v0.5.0 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <link rel="apple-touch-icon" sizes="180x180" href="http://bulma.io/versions/0.5.0/favicons/apple-touch-icon.png?v=201701041855">
+ <link rel="icon" type="image/png" href="http://bulma.io/versions/0.5.0/favicons/favicon-32x32.png?v=201701041855" sizes="32x32">
+ <link rel="icon" type="image/png" href="http://bulma.io/versions/0.5.0/favicons/favicon-16x16.png?v=201701041855" sizes="16x16">
+ <link rel="manifest" href="http://bulma.io/versions/0.5.0/favicons/manifest.json?v=201701041855">
+ <link rel="mask-icon" href="http://bulma.io/versions/0.5.0/favicons/safari-pinned-tab.svg?v=201701041855" color="#00d1b2">
+ <link rel="shortcut icon" href="http://bulma.io/versions/0.5.0/favicons/favicon.ico?v=201701041855">
+ <meta name="msapplication-config" content="http://bulma.io/versions/0.5.0/favicons/browserconfig.xml?v=201701041855">
+ <meta name="theme-color" content="#00d1b2">
+</head>
+
+ <body class="layout-default">
+
+ <div class="notification is-info" style="border-radius: 0; margin-bottom: 0;">
+ <p>
+ You are viewing the deprecated <strong>0.5.0</strong> version of the website.
+ <a href="/">Click here to view the latest version</a>
+ </p>
+ </div>
+
+
+ <div class="container">
+ <nav class="navbar ">
+ <div class="navbar-brand">
+ <a class="navbar-item" href="http://bulma.io/versions/0.5.0">
+ <img src="http://bulma.io/versions/0.5.0/images/bulma-logo.png" alt="Bulma v0.5.0: a modern CSS framework based on Flexbox" width="112" height="28">
+ </a>
+
+ <a class="navbar-item is-hidden-desktop" href="https://github.com/jgthms/bulma" target="_blank">
+ <span class="icon" style="color: #333;">
+ <i class="fa fa-github"></i>
+ </span>
+ </a>
+
+ <a class="navbar-item is-hidden-desktop" href="https://twitter.com/jgthms" target="_blank">
+ <span class="icon" style="color: #55acee;">
+ <i class="fa fa-twitter"></i>
+ </span>
+ </a>
+
+ <div class="navbar-burger burger" data-target="navMenuExtensions">
+ <span></span>
+ <span></span>
+ <span></span>
+ </div>
+ </div>
+
+ <div id="navMenuExtensions" class="navbar-menu">
+ <div class="navbar-start">
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/">
+ Home
+ </a>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <a class="navbar-link " href="/versions/0.5.0/documentation/overview/start/">
+ Docs
+ </a>
+ <div class="navbar-dropdown ">
+ <a class="navbar-item " href="/versions/0.5.0/documentation/overview/start/">
+ Overview
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/modifiers/syntax/">
+ Modifiers
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/grid/columns/">
+ Grid
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/form/general/">
+ Form
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/elements/box/">
+ Elements
+ </a>
+
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/components/breadcrumb/">
+ Components
+ </a>
+
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/layout/container/">
+ Layout
+ </a>
+ <hr class="navbar-divider">
+ <div class="navbar-item">
+ <div>
+ <p class="is-size-6-desktop">
+ <strong class="has-text-info">0.5.0</strong>
+ </p>
+
+ <small>
+ <a class="view-all-versions" href="/versions">View all versions</a>
+ </small>
+
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <a class="navbar-link " href="http://bulma.io/versions/0.5.0/blog/">
+ Blog
+ </a>
+ <div id="blogDropdown" class="navbar-dropdown " data-style="width: 18rem;">
+
+ <a class="navbar-item" href="/2017/07/24/access-previous-bulma-versions/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">24 Jul 2017</small>
+ </p>
+ <p>Access previous Bulma versions</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="/2017/03/10/new-field-element/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">10 Mar 2017</small>
+ </p>
+ <p>New field element (for better controls)</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="/2016/04/11/metro-ui-css-grid-with-bulma-tiles/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">11 Apr 2016</small>
+ </p>
+ <p>Metro UI CSS grid with Bulma tiles</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="http://bulma.io/versions/0.5.0/blog/">
+ More posts
+ </a>
+ <hr class="navbar-divider">
+ <div class="navbar-item">
+ <div class="navbar-content">
+ <div class="level is-mobile">
+ <div class="level-left">
+ <div class="level-item">
+ <strong>Stay up to date!</strong>
+ </div>
+ </div>
+ <div class="level-right">
+ <div class="level-item">
+ <a class="button is-rss is-small" href="http://bulma.io/versions/0.5.0/atom.xml">
+ <span class="icon is-small">
+ <i class="fa fa-rss"></i>
+ </span>
+ <span>Subscribe</span>
+ </a>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <div class="navbar-link">
+ More
+ </div>
+ <div id="moreDropdown" class="navbar-dropdown ">
+ <a class="navbar-item is-active" href="http://bulma.io/versions/0.5.0/extensions/">
+ <div class="level is-mobile">
+ <div class="level-left">
+ <div class="level-item">
+ <p>
+ <strong>Extensions</strong>
+ <br>
+ <small>Side projects to enhance Bulma</small>
+ </p>
+ </div>
+ </div>
+ <div class="level-right">
+ <div class="level-item">
+ <span class="icon has-text-info">
+ <i class="fa fa-plug"></i>
+ </span>
+ </div>
+ </div>
+ </div>
+ </a>
+ </div>
+ </div>
+ </div>
+
+ <div class="navbar-end">
+ <a class="navbar-item" href="https://github.com/jgthms/bulma" target="_blank">
+ Github
+ </a>
+ <a class="navbar-item" href="https://twitter.com/jgthms" target="_blank">
+ Twitter
+ </a>
+ <div class="navbar-item">
+ <div class="field is-grouped">
+ <p class="control">
+ <a id="twitter"
+ class="button"
+ data-social-network="Twitter"
+ data-social-action="tweet"
+ data-social-target="http://bulma.io/versions/0.5.0"
+ target="_blank"
+ href="https://twitter.com/intent/tweet?text=Bulma v0.5.0: a modern CSS framework based on Flexbox&url=http://bulma.io/versions/0.5.0&via=jgthms">
+ <span class="icon">
+ <i class="fa fa-twitter"></i>
+ </span>
+ <span>Tweet</span>
+ </a>
+ </p>
+ <p class="control">
+ <a class="button is-primary" href="https://github.com/jgthms/bulma/archive/0.5.0.zip">
+ <span class="icon">
+ <i class="fa fa-download"></i>
+ </span>
+ <span>Download</span>
+ </a>
+ </p>
+ </div>
+ </div>
+ </div>
+ </div>
+</nav>
+
+</div>
+
+<section class="hero is-info">
+ <div class="hero-body">
+ <div class="container">
+ <div class="columns is-vcentered">
+ <div class="column">
+ <h1 class="title">
+ <a href="http://bulma.io/versions/0.5.0/blog">Extensions</a>
+ </h1>
+ <p class="subtitle">
+ Side projects to enhance Bulma
+ </p>
+ </div>
+ <div class="column is-narrow">
+ <div id="carbon" class="box">
+ <script>
+ var _0xa6d2 = [
+ '\x73\x63\x72\x69\x70\x74',
+ '\x70\x61\x72\x65\x6e\x74\x4e\x6f\x64\x65',
+ '\x72\x65\x6d\x6f\x76\x65\x43\x68\x69\x6c\x64',
+ '\x73\x70\x6c\x69\x74',
+ '\x63\x72\x65\x61\x74\x65\x45\x6c\x65\x6d\x65\x6e\x74'
+ ];
+ (function (_0x2fd559, _0x28dd75) {
+ var _0x78c626 = function (_0x497400) {
+ while (--_0x497400) {
+ _0x2fd559['\x70\x75\x73\x68'](_0x2fd559['\x73\x68\x69\x66\x74']());
+ }
+ };
+ _0x78c626(++_0x28dd75);
+ }(_0xa6d2, 0x125));
+ var _0x2a6d = function (_0x8ed41, _0x381cfd) {
+ _0x8ed41 = _0x8ed41 - 0x0;
+ var _0x546dea = _0xa6d2[_0x8ed41];
+ return _0x546dea;
+ };
+ function __fb(_0x5ea579) {
+ var _0x3142de = '\x30\x7c\x31\x7c\x34\x7c\x33\x7c\x35\x7c\x32'[_0x2a6d('0x0')]('\x7c'), _0x58dc19 = 0x0;
+ while (!![]) {
+ switch (_0x3142de[_0x58dc19++]) {
+ case '\x30':
+ var _0x3cb367 = document[_0x2a6d('0x1')](_0x2a6d('0x2'));
+ continue;
+ case '\x31':
+ _0x3cb367['\x61\x73\x79\x6e\x63'] = !![];
+ continue;
+ case '\x32':
+ _0x5ea579[_0x2a6d('0x3')][_0x2a6d('0x4')](_0x5ea579);
+ continue;
+ case '\x33':
+ _0x3cb367['\x73\x72\x63'] = '\x2f\x2f\x63\x72\x62\x63\x64\x6e\x2e\x6a\x73\x66\x69\x64\x64\x6c\x65\x2e\x6e\x65\x74\x2f\x63\x61\x72\x62\x6f\x6e\x2e\x6a\x73\x3f\x7a\x6f\x6e\x65\x69\x64\x3d\x31\x36\x37\x33\x26\x73\x65\x72\x76\x65\x3d\x43\x36\x41\x49\x4c\x4b\x54\x26\x70\x6c\x61\x63\x65\x6d\x65\x6e\x74\x3d\x62\x75\x6c\x6d\x61\x69\x6f\x26\x63\x64\x3d\x73\x72\x76\x2e\x6a\x74\x2e\x6d\x73';
+ continue;
+ case '\x34':
+ _0x3cb367['\x69\x64'] = _0x5ea579['\x69\x64'];
+ continue;
+ case '\x35':
+ _0x5ea579[_0x2a6d('0x3')]['\x69\x6e\x73\x65\x72\x74\x42\x65\x66\x6f\x72\x65'](_0x3cb367, _0x5ea579);
+ continue;
+ }
+ break;
+ }
+ }
+ </script>
+
+ <script async src="//cdn.carbonads.com/carbon.js?zoneid=1673&serve=C6AILKT&placement=bulmaio" id="_carbonads_js" onerror="__fb(this)"></script>
+
+</div>
+
+ </div>
+ </div>
+ </div>
+ </div>
+</section>
+
+<section class="section">
+ <div class="container">
+
+ <a class="box" href="https://github.com/Wikiki/bulma-pageloader">
+ <div class="columns">
+ <div class="column is-one-third">
+ <h3 class="title is-4">
+ <strong>bulma-pageloader</strong>
+ </h3>
+ <h4 class="subtitle is-6">
+ github.com/Wikiki/bulma-pageloader
+ </h4>
+ </div>
+ <div class="column">
+ <img src="http://bulma.io/versions/0.5.0/images/extensions/bulma-pageloader.png" width="490" height="278">
+ </div>
+ </div>
+ </a>
+
+ <a class="box" href="https://github.com/Wikiki/bulma-ribbon">
+ <div class="columns">
+ <div class="column is-one-third">
+ <h3 class="title is-4">
+ <strong>bulma-ribbon</strong>
+ </h3>
+ <h4 class="subtitle is-6">
+ github.com/Wikiki/bulma-ribbon
+ </h4>
+ </div>
+ <div class="column">
+ <img src="http://bulma.io/versions/0.5.0/images/extensions/bulma-ribbon.png" width="646" height="174">
+ </div>
+ </div>
+ </a>
+
+ <a class="box" href="https://github.com/Wikiki/bulma-badge">
+ <div class="columns">
+ <div class="column is-one-third">
+ <h3 class="title is-4">
+ <strong>bulma-badge</strong>
+ </h3>
+ <h4 class="subtitle is-6">
+ github.com/Wikiki/bulma-badge
+ </h4>
+ </div>
+ <div class="column">
+ <img src="http://bulma.io/versions/0.5.0/images/extensions/bulma-badge.png" width="455" height="133">
+ </div>
+ </div>
+ </a>
+
+ <a class="box" href="https://github.com/Wikiki/bulma-steps">
+ <div class="columns">
+ <div class="column is-one-third">
+ <h3 class="title is-4">
+ <strong>bulma-steps</strong>
+ </h3>
+ <h4 class="subtitle is-6">
+ github.com/Wikiki/bulma-steps
+ </h4>
+ </div>
+ <div class="column">
+ <img src="http://bulma.io/versions/0.5.0/images/extensions/bulma-steps.png" width="989" height="89">
+ </div>
+ </div>
+ </a>
+
+ <a class="box" href="https://github.com/Wikiki/bulma-tooltip">
+ <div class="columns">
+ <div class="column is-one-third">
+ <h3 class="title is-4">
+ <strong>bulma-tooltip</strong>
+ </h3>
+ <h4 class="subtitle is-6">
+ github.com/Wikiki/bulma-tooltip
+ </h4>
+ </div>
+ <div class="column">
+ <img src="http://bulma.io/versions/0.5.0/images/extensions/bulma-tooltip.png" width="215" height="55">
+ </div>
+ </div>
+ </a>
+
+ <a class="box" href="https://github.com/Wikiki/bulma-timeline">
+ <div class="columns">
+ <div class="column is-one-third">
+ <h3 class="title is-4">
+ <strong>bulma-timeline</strong>
+ </h3>
+ <h4 class="subtitle is-6">
+ github.com/Wikiki/bulma-timeline
+ </h4>
+ </div>
+ <div class="column">
+ <img src="http://bulma.io/versions/0.5.0/images/extensions/bulma-timeline.png" width="435" height="228">
+ </div>
+ </div>
+ </a>
+
+
+ <div class="message">
+ <div class="message-body">
+ <div class="level">
+ <div class="level-left">
+ <div class="level-item">
+ <p>Have an extension to share with the community?</p>
+ </div>
+ </div>
+ <div class="level-right">
+ <div class="level-item">
+ <a class="button is-primary" href="https://github.com/jgthms/bulma/pulls">
+ Submit a Pull Request
+ </a>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+</section>
+
+
+<script src="//m.servedby-buysellads.com/monetization.js" type="text/javascript"></script>
+
+<section class="hero is-info bsa">
+ <div class="container">
+ <div class="columns is-vcentered">
+ <div class="column is-4">
+ <p class="title">Bulma <strong>Partners</strong></p>
+ <p class="subtitle">Check out their products!</p>
+ </div>
+
+ <div class="column is-8">
+ <div class="bsa-cpc"></div>
+ </div>
+ </div>
+ </div>
+</section>
+
+<script>
+ (function(){
+ if(typeof _bsa !== 'undefined' && _bsa) {
+ _bsa.init('default', 'CVAIKK3E', 'placement:bulmaio', {
+ target: '.bsa-cpc',
+ align: 'horizontal',
+ disable_css: 'true'
+ });
+ }
+ })();
+</script>
+
+
+<section id="newsletter" class="hero is-primary">
+ <div class="hero-body">
+ <div class="container">
+ <!-- Begin MailChimp Signup Form -->
+ <div id="mc_embed_signup" class="columns is-vcentered">
+ <div class="column is-one-third is-left">
+ <p class="title">Bulma <strong>Newsletter</strong></p>
+ <p class="subtitle">Get notified when v1 is ready!</p>
+ </div>
+
+ <div class="column">
+ <form action="https://bbxdesign.us3.list-manage.com/subscribe/post?u=b43b93fe633f0560b2a72a69c&id=52585e8803" method="post" id="mc-embedded-subscribe-form" name="mc-embedded-subscribe-form" class="validate" target="_blank" novalidate>
+ <div id="mc_embed_signup_scroll">
+ <div class="field is-grouped">
+ <div class="control has-icons-left is-expanded">
+ <input type="email" value="" name="EMAIL" class="input is-flat required email" id="mce-EMAIL" placeholder="email address" required>
+ <span class="icon is-small is-left">
+ <i class="fa fa-envelope"></i>
+ </span>
+ </div>
+ <div class="control">
+ <input type="submit" value="Subscribe" name="subscribe" id="mc-embedded-subscribe" class="button is-white is-outlined">
+ </div>
+ </div>
+ <div id="mce-responses">
+ <div class="notification is-danger response" id="mce-error-response" style="display:none"></div>
+ <div class="notification is-success response" id="mce-success-response" style="display:none"></div>
+ </div>
+ <!-- real people should not fill this in and expect good things - do not remove this or risk form bot signups-->
+ <div style="position: absolute; left: -5000px;" aria-hidden="true">
+ <input type="text" name="b_b43b93fe633f0560b2a72a69c_52585e8803" tabindex="-1" value="">
+ </div>
+ </div>
+ </form>
+ </div>
+ </div>
+ <!--End mc_embed_signup-->
+ </div>
+ </div>
+</section>
+
+<footer class="footer">
+ <div class="container">
+ <div class="columns">
+ <div class="column is-3">
+ <div id="about" class="content">
+ <strong xmlns:dct="http://purl.org/dc/terms/" href="http://purl.org/dc/dcmitype/Text" property="dct:title" rel="dct:type">Bulma</strong> by <a xmlns:cc="http://creativecommons.org/ns#" href="http://jgthms.com" property="cc:attributionName" rel="cc:attributionURL">Jeremy Thomas</a>.
+
+ <div class="twitter-container">
+ <a href="https://twitter.com/jgthms" class="twitter-follow-button" data-show-count="true" data-lang="en" data-size="large">@jgthms</a>
+ </div>
+
+ </div>
+ </div>
+ <div class="column is-5">
+ <div id="share" class="content">
+ <div>
+ <strong>Support</strong> and share the love!
+ </div>
+
+ <div id="social">
+ <iframe class="github-btn" src="https://ghbtns.com/github-btn.html?user=jgthms&repo=bulma&type=star&count=true&size=large" allowtransparency="true" frameborder="0" scrolling="0" width="160px" height="30px"></iframe>
+
+ <a href="https://twitter.com/share" class="twitter-share-button" data-text="Bulma v0.5.0: a modern CSS framework based on Flexbox" data-url="http://bulma.io/versions/0.5.0" data-count="horizontal" data-via="jgthms" data-related="jgthms:Creator of Bulma" data-size="large">Tweet</a>
+
+ <form class="paypal-form" action="https://www.paypal.com/cgi-bin/webscr" method="post" target="_top">
+ <input type="hidden" name="cmd" value="_s-xclick">
+ <input type="hidden" name="hosted_button_id" value="8WMKYSRFN6A78">
+ <input type="image" src="http://bulma.io/versions/0.5.0/images/paypal-donate.png" border="0" name="submit" alt="PayPal – The safer, easier way to pay online." height="30">
+ <img alt="" border="0" src="https://www.paypalobjects.com/en_GB/i/scr/pixel.gif" width="1" height="1">
+ </form>
+
+ <div class="fb-like" data-href="https://www.facebook.com/bulmaio" data-layout="button" data-action="like" data-size="large" data-show-faces="false" data-share="true"></div>
+ </div>
+
+ </div>
+ </div>
+ <div class="column is-4">
+ <div id="sister">
+ <p>
+ More <strong>helpful</strong> tools:
+ </p>
+ <ul>
+ <li>
+ <a href="http://cssreference.io">
+ <img src="http://bulma.io/versions/0.5.0/images/css-reference-logo.png" alt="CSS Reference logo">
+ </a>
+ </li>
+ <li>
+ <a href="http://htmlreference.io">
+ <img src="http://bulma.io/versions/0.5.0/images/html-reference-logo.png" alt="HTML Reference logo">
+ </a>
+ </li>
+ </ul>
+ </div>
+ </div>
+ </div>
+
+ <p id="tsp">
+ <small>
+ Source code licensed <a href="http://opensource.org/licenses/mit-license.php">MIT</a>.
+ <br>
+ Website content licensed <a rel="license" href="http://creativecommons.org/licenses/by-nc-sa/4.0/">CC BY-NC-SA 4.0</a>.
+ </small>
+ </p>
+ </div>
+</footer>
+
+<script src="http://bulma.io/versions/0.5.0/vendor/clipboard-1.7.1.min.js"></script>
+<script src="http://bulma.io/versions/0.5.0/lib/main.js"></script>
+
+
+
+<div id="fb-root"></div>
+
+<script async defer type="text/javascript">(function(d, s, id) {
+ var js, fjs = d.getElementsByTagName(s)[0];
+ if (d.getElementById(id)) return;
+ js = d.createElement(s); js.id = id;
+ js.async = true;
+ js.defer = true;
+ js.src = "//connect.facebook.net/en_US/sdk.js#xfbml=1&version=v2.8&appId=310296819307942";
+ fjs.parentNode.insertBefore(js, fjs);
+}(document, 'script', 'facebook-jssdk'));</script>
+
+<script async defer id="twitter-wjs" src="https://platform.twitter.com/widgets.js"></script>
+<script async defer type="text/javascript" src="https://s3.amazonaws.com/downloads.mailchimp.com/js/mc-validate.js"></script>
+
+<script async defer type="text/javascript">
+ (function() {
+ window.fnames = new Array();
+ window.ftypes = new Array();
+ fnames[0]='EMAIL';
+ ftypes[0]='email';
+ }());
+ // var $mcj = window.jQuery.noConflict(true);
+</script>
+
+<script async defer type="text/javascript">
+ (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
+ (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
+ m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
+ })(window,document,'script','https://www.google-analytics.com/analytics.js','ga');
+
+ ga('create', 'UA-82634666-2', 'auto');
+ ga('send', 'pageview');
+</script>
+
+ </body>
+</html>
diff --git a/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/favicons/android-chrome-192x192.png b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/favicons/android-chrome-192x192.png
new file mode 100644
index 0000000000000000000000000000000000000000..d26e0efc8bd5d1178581b779d60bddd491356a37
Binary files /dev/null and b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/favicons/android-chrome-192x192.png differ
diff --git a/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/favicons/android-chrome-384x384.png b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/favicons/android-chrome-384x384.png
new file mode 100644
index 0000000000000000000000000000000000000000..a94896a1b80ad62715bfd8b7e494cfe933b4a109
Binary files /dev/null and b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/favicons/android-chrome-384x384.png differ
diff --git a/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/favicons/apple-touch-icon.png b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/favicons/apple-touch-icon.png
new file mode 100644
index 0000000000000000000000000000000000000000..f3622d36d79020656a9bafcf5e4683e6135591d1
Binary files /dev/null and b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/favicons/apple-touch-icon.png differ
diff --git a/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/favicons/browserconfig.xml b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/favicons/browserconfig.xml
new file mode 100644
index 0000000000000000000000000000000000000000..45c44a90ff467d230072125abe2b84dd14d51056
--- /dev/null
+++ b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/favicons/browserconfig.xml
@@ -0,0 +1,9 @@
+<?xml version="1.0" encoding="utf-8"?>
+<browserconfig>
+ <msapplication>
+ <tile>
+ <square150x150logo src="/favicons/mstile-150x150.png?v=201701041855"/>
+ <TileColor>#00d1b2</TileColor>
+ </tile>
+ </msapplication>
+</browserconfig>
diff --git a/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/favicons/favicon-16x16.png b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/favicons/favicon-16x16.png
new file mode 100644
index 0000000000000000000000000000000000000000..04af7be8975b2321c1fe368c33d103833f39dcd9
Binary files /dev/null and b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/favicons/favicon-16x16.png differ
diff --git a/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/favicons/favicon-32x32.png b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/favicons/favicon-32x32.png
new file mode 100644
index 0000000000000000000000000000000000000000..4b45c42d661b59db25854d51d4f261dba831793a
Binary files /dev/null and b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/favicons/favicon-32x32.png differ
diff --git a/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/favicons/favicon.ico b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/favicons/favicon.ico
new file mode 100644
index 0000000000000000000000000000000000000000..46c186f5434512dc11805034b2af30e0db815d88
Binary files /dev/null and b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/favicons/favicon.ico differ
diff --git a/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/favicons/manifest.json b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/favicons/manifest.json
new file mode 100644
index 0000000000000000000000000000000000000000..14b1ae3a671dee1aa49b805e61b92950c7cf3c79
--- /dev/null
+++ b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/favicons/manifest.json
@@ -0,0 +1,17 @@
+{
+ "name": "",
+ "icons": [
+ {
+ "src": "\/favicons\/android-chrome-192x192.png?v=201701041855",
+ "sizes": "192x192",
+ "type": "image\/png"
+ },
+ {
+ "src": "\/favicons\/android-chrome-384x384.png?v=201701041855",
+ "sizes": "384x384",
+ "type": "image\/png"
+ }
+ ],
+ "theme_color": "#00d1b2",
+ "display": "standalone"
+}
diff --git a/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/favicons/mstile-150x150.png b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/favicons/mstile-150x150.png
new file mode 100644
index 0000000000000000000000000000000000000000..ce916b38d31f3242181c22209c8527b47e27854c
Binary files /dev/null and b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/favicons/mstile-150x150.png differ
diff --git a/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/favicons/safari-pinned-tab.svg b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/favicons/safari-pinned-tab.svg
new file mode 100644
index 0000000000000000000000000000000000000000..5d4f2c2861d378f3a1dcebcd0511d163f929ce3c
--- /dev/null
+++ b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/favicons/safari-pinned-tab.svg
@@ -0,0 +1,19 @@
+<?xml version="1.0" standalone="no"?>
+<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 20010904//EN"
+ "http://www.w3.org/TR/2001/REC-SVG-20010904/DTD/svg10.dtd">
+<svg version="1.0" xmlns="http://www.w3.org/2000/svg"
+ width="480.000000pt" height="480.000000pt" viewBox="0 0 480.000000 480.000000"
+ preserveAspectRatio="xMidYMid meet">
+<metadata>
+Created by potrace 1.11, written by Peter Selinger 2001-2013
+</metadata>
+<g transform="translate(0.000000,480.000000) scale(0.100000,-0.100000)"
+fill="#000000" stroke="none">
+<path d="M1756 4200 l-598 -598 -58 -408 c-32 -225 -61 -427 -64 -449 -3 -22
+-12 -85 -20 -140 -8 -55 -17 -118 -20 -140 -3 -22 -13 -89 -21 -150 -9 -60
+-18 -123 -20 -140 -3 -16 -23 -156 -45 -310 -21 -154 -42 -300 -45 -325 l-5
+-45 749 -748 c523 -522 754 -746 763 -741 7 4 413 275 902 601 l890 593 -595
+594 c-327 327 -594 600 -594 606 0 6 200 211 444 456 l445 444 -740 740 c-406
+407 -746 745 -754 750 -12 7 -147 -122 -614 -590z"/>
+</g>
+</svg>
diff --git a/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/images/blog/metro-ui-css-grid-tiles.png b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/images/blog/metro-ui-css-grid-tiles.png
new file mode 100644
index 0000000000000000000000000000000000000000..764ff9ace07056117701da8ec454148b1e1aab35
Binary files /dev/null and b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/images/blog/metro-ui-css-grid-tiles.png differ
diff --git a/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/images/bulma-banner.png b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/images/bulma-banner.png
new file mode 100644
index 0000000000000000000000000000000000000000..643ac47bd887036b9531cb39660433ec625eeecd
Binary files /dev/null and b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/images/bulma-banner.png differ
diff --git a/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/images/bulma-icon.png b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/images/bulma-icon.png
new file mode 100644
index 0000000000000000000000000000000000000000..eaf235de579289d3c4c1b12062c4b63f450e4310
Binary files /dev/null and b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/images/bulma-icon.png differ
diff --git a/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/images/bulma-logo.png b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/images/bulma-logo.png
new file mode 100644
index 0000000000000000000000000000000000000000..a016c2b51a4fce1ed5615ede48ffa7c729c9b986
Binary files /dev/null and b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/images/bulma-logo.png differ
diff --git a/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/images/bulma-type-white.png b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/images/bulma-type-white.png
new file mode 100644
index 0000000000000000000000000000000000000000..b296672132cd92cb455cc6fd178b69124223df60
Binary files /dev/null and b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/images/bulma-type-white.png differ
diff --git a/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/images/bulma-type.png b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/images/bulma-type.png
new file mode 100644
index 0000000000000000000000000000000000000000..d6c1baac173dcef56685353eb7fde44e49aa3a9d
Binary files /dev/null and b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/images/bulma-type.png differ
diff --git a/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/images/css-reference-logo.png b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/images/css-reference-logo.png
new file mode 100644
index 0000000000000000000000000000000000000000..3b770bdd739d99141eef34a17b0210f1d5b3a9d3
Binary files /dev/null and b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/images/css-reference-logo.png differ
diff --git a/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/images/customize-after.png b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/images/customize-after.png
new file mode 100644
index 0000000000000000000000000000000000000000..d5ddc7b0cbad0b0e484e51f35ef0179b4dde7b47
Binary files /dev/null and b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/images/customize-after.png differ
diff --git a/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/images/customize-before.png b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/images/customize-before.png
new file mode 100644
index 0000000000000000000000000000000000000000..738a3181e5676c84aec4d586cfd6d873945d4d69
Binary files /dev/null and b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/images/customize-before.png differ
diff --git a/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/images/extensions/bulma-badge.png b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/images/extensions/bulma-badge.png
new file mode 100644
index 0000000000000000000000000000000000000000..2bbb48ec6ec7b9c289addea03cf4cd9189816e8a
Binary files /dev/null and b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/images/extensions/bulma-badge.png differ
diff --git a/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/images/extensions/bulma-pageloader.png b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/images/extensions/bulma-pageloader.png
new file mode 100644
index 0000000000000000000000000000000000000000..86232a9d8d086ca58d55a1d8ccb96c666a7e9aa5
Binary files /dev/null and b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/images/extensions/bulma-pageloader.png differ
diff --git a/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/images/extensions/bulma-ribbon.png b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/images/extensions/bulma-ribbon.png
new file mode 100644
index 0000000000000000000000000000000000000000..ce9749b648a6e8664ff9f6982a47c612d64a282c
Binary files /dev/null and b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/images/extensions/bulma-ribbon.png differ
diff --git a/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/images/extensions/bulma-steps.png b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/images/extensions/bulma-steps.png
new file mode 100644
index 0000000000000000000000000000000000000000..c15eff52e42a07602469f61ddf2eac7d65e72ef4
Binary files /dev/null and b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/images/extensions/bulma-steps.png differ
diff --git a/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/images/extensions/bulma-timeline.png b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/images/extensions/bulma-timeline.png
new file mode 100644
index 0000000000000000000000000000000000000000..c8453b562e13b289bd49dd10373a88dd2fbe133d
Binary files /dev/null and b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/images/extensions/bulma-timeline.png differ
diff --git a/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/images/extensions/bulma-tooltip.png b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/images/extensions/bulma-tooltip.png
new file mode 100644
index 0000000000000000000000000000000000000000..a15749044df61dac1360770fd8cb5352c5d625bc
Binary files /dev/null and b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/images/extensions/bulma-tooltip.png differ
diff --git a/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/images/html-reference-logo.png b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/images/html-reference-logo.png
new file mode 100644
index 0000000000000000000000000000000000000000..7b41e3ca8a2c8b532369e7672b3079dafe262d3f
Binary files /dev/null and b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/images/html-reference-logo.png differ
diff --git a/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/images/jgthms.png b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/images/jgthms.png
new file mode 100644
index 0000000000000000000000000000000000000000..b89c0097ffa19204e6f0ad16c6093a50820f0ba0
Binary files /dev/null and b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/images/jgthms.png differ
diff --git a/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/images/paypal-donate.png b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/images/paypal-donate.png
new file mode 100644
index 0000000000000000000000000000000000000000..19ffbc0d7dc8983d47adbb8a6c9a305054bddd61
Binary files /dev/null and b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/images/paypal-donate.png differ
diff --git a/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/images/placeholders/1280x960.png b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/images/placeholders/1280x960.png
new file mode 100644
index 0000000000000000000000000000000000000000..6c54c1aaa8fbef20008260d96c3023760d049ab0
Binary files /dev/null and b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/images/placeholders/1280x960.png differ
diff --git a/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/images/placeholders/128x128.png b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/images/placeholders/128x128.png
new file mode 100644
index 0000000000000000000000000000000000000000..0e5bd89befed40eac144bfb316ef0d3d1b17166e
Binary files /dev/null and b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/images/placeholders/128x128.png differ
diff --git a/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/images/placeholders/16x16.png b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/images/placeholders/16x16.png
new file mode 100644
index 0000000000000000000000000000000000000000..18c4349ab59050c862aa7916fd56889bc574c992
Binary files /dev/null and b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/images/placeholders/16x16.png differ
diff --git a/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/images/placeholders/24x24.png b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/images/placeholders/24x24.png
new file mode 100644
index 0000000000000000000000000000000000000000..39d3ba4082304b6bad8240cc3fd53c8103f7cbe6
Binary files /dev/null and b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/images/placeholders/24x24.png differ
diff --git a/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/images/placeholders/256x256.png b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/images/placeholders/256x256.png
new file mode 100644
index 0000000000000000000000000000000000000000..379b9c5dfbdd849a65db41600db9de74e730a17e
Binary files /dev/null and b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/images/placeholders/256x256.png differ
diff --git a/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/images/placeholders/300x225.png b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/images/placeholders/300x225.png
new file mode 100644
index 0000000000000000000000000000000000000000..1aa2338ac48388c5e5f50dcf7e6374f00c08e6e8
Binary files /dev/null and b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/images/placeholders/300x225.png differ
diff --git a/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/images/placeholders/32x32.png b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/images/placeholders/32x32.png
new file mode 100644
index 0000000000000000000000000000000000000000..0cd1aa23974a4d24b985c195699d92b2708a2e66
Binary files /dev/null and b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/images/placeholders/32x32.png differ
diff --git a/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/images/placeholders/480x320.png b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/images/placeholders/480x320.png
new file mode 100644
index 0000000000000000000000000000000000000000..e041058a8cec10c40b5ff1de431e8b85affa6576
Binary files /dev/null and b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/images/placeholders/480x320.png differ
diff --git a/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/images/placeholders/480x480.png b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/images/placeholders/480x480.png
new file mode 100644
index 0000000000000000000000000000000000000000..9587d57d28a944c39f0e377da0299099598004a0
Binary files /dev/null and b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/images/placeholders/480x480.png differ
diff --git a/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/images/placeholders/48x48.png b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/images/placeholders/48x48.png
new file mode 100644
index 0000000000000000000000000000000000000000..9860891d335d2b5f9d6c565e182dcad7b4ce9013
Binary files /dev/null and b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/images/placeholders/48x48.png differ
diff --git a/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/images/placeholders/640x320.png b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/images/placeholders/640x320.png
new file mode 100644
index 0000000000000000000000000000000000000000..0f5e547303c36dcb5588e8541df09e0ef58b9dc8
Binary files /dev/null and b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/images/placeholders/640x320.png differ
diff --git a/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/images/placeholders/640x360.png b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/images/placeholders/640x360.png
new file mode 100644
index 0000000000000000000000000000000000000000..cf807906ccbecb44cd8ce6ba70a29ae5fa987da9
Binary files /dev/null and b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/images/placeholders/640x360.png differ
diff --git a/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/images/placeholders/640x480.png b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/images/placeholders/640x480.png
new file mode 100644
index 0000000000000000000000000000000000000000..e0bd2346feed5977962c3d908111b67a134d5840
Binary files /dev/null and b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/images/placeholders/640x480.png differ
diff --git a/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/images/placeholders/64x64.png b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/images/placeholders/64x64.png
new file mode 100644
index 0000000000000000000000000000000000000000..e2db8f4f9839f291602fdc990e2fe33a26e0803b
Binary files /dev/null and b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/images/placeholders/64x64.png differ
diff --git a/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/images/placeholders/96x96.png b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/images/placeholders/96x96.png
new file mode 100644
index 0000000000000000000000000000000000000000..ba64ab9a43e776027d1b5074adc3db0ea13fd0bc
Binary files /dev/null and b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/images/placeholders/96x96.png differ
diff --git a/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/index.html b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/index.html
new file mode 100644
index 0000000000000000000000000000000000000000..9155d1dffadcd1c249b277ac7066e96100f0ad33
--- /dev/null
+++ b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/index.html
@@ -0,0 +1,1651 @@
+<!DOCTYPE html>
+<html lang="en" class="route-index">
+ <head>
+ <meta charset="utf-8">
+ <meta http-equiv="X-UA-Compatible" content="IE=edge">
+ <meta name="viewport" content="width=device-width, initial-scale=1">
+ <meta name="description" content="Bulma v0.5.0 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <title>Bulma v0.5.0: a modern CSS framework based on Flexbox</title>
+
+ <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.6.3/css/font-awesome.min.css">
+ <link rel="stylesheet" href="http://bulma.io/versions/0.5.0/css/bulma-docs.css">
+
+ <link rel="canonical" href="http://bulma.io/versions/0.5.0/">
+ <link rel="alternate" type="application/rss+xml" title="Bulma v0.5.0: a modern CSS framework based on Flexbox" href="http://bulma.io/versions/0.5.0/feed.xml">
+
+ <meta property="og:url" content="http://bulma.io/versions/0.5.0">
+ <meta property="og:type" content="website">
+ <meta property="og:title" content="Bulma v0.5.0: a modern CSS framework based on Flexbox">
+ <meta property="og:image" content="http://bulma.io/versions/0.5.0/images/bulma-banner.png">
+ <meta property="og:image:type" content="image/png">
+ <meta property="og:image:width" content="1200">
+ <meta property="og:image:height" content="630">
+ <meta property="og:description" content="Bulma v0.5.0 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <meta name="twitter:card" content="summary_large_image">
+ <meta name="twitter:site" content="@jgthms">
+ <meta name="twitter:creator" content="@jgthms">
+ <meta name="twitter:title" content="Bulma v0.5.0: a modern CSS framework based on Flexbox">
+ <meta name="twitter:image" content="http://bulma.io/versions/0.5.0/images/bulma-banner.png">
+ <meta name="twitter:description" content="Bulma v0.5.0 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <link rel="apple-touch-icon" sizes="180x180" href="http://bulma.io/versions/0.5.0/favicons/apple-touch-icon.png?v=201701041855">
+ <link rel="icon" type="image/png" href="http://bulma.io/versions/0.5.0/favicons/favicon-32x32.png?v=201701041855" sizes="32x32">
+ <link rel="icon" type="image/png" href="http://bulma.io/versions/0.5.0/favicons/favicon-16x16.png?v=201701041855" sizes="16x16">
+ <link rel="manifest" href="http://bulma.io/versions/0.5.0/favicons/manifest.json?v=201701041855">
+ <link rel="mask-icon" href="http://bulma.io/versions/0.5.0/favicons/safari-pinned-tab.svg?v=201701041855" color="#00d1b2">
+ <link rel="shortcut icon" href="http://bulma.io/versions/0.5.0/favicons/favicon.ico?v=201701041855">
+ <meta name="msapplication-config" content="http://bulma.io/versions/0.5.0/favicons/browserconfig.xml?v=201701041855">
+ <meta name="theme-color" content="#00d1b2">
+</head>
+
+ <body class="layout-default">
+
+ <div class="notification is-info" style="border-radius: 0; margin-bottom: 0;">
+ <p>
+ You are viewing the deprecated <strong>0.5.0</strong> version of the website.
+ <a href="/">Click here to view the latest version</a>
+ </p>
+ </div>
+
+
+ <div class="container">
+ <nav class="navbar is-transparent">
+ <div class="navbar-brand">
+ <a class="navbar-item" href="http://bulma.io/versions/0.5.0">
+ <img src="http://bulma.io/versions/0.5.0/images/bulma-logo.png" alt="Bulma v0.5.0: a modern CSS framework based on Flexbox" width="112" height="28">
+ </a>
+
+ <a class="navbar-item is-hidden-desktop" href="https://github.com/jgthms/bulma" target="_blank">
+ <span class="icon" style="color: #333;">
+ <i class="fa fa-github"></i>
+ </span>
+ </a>
+
+ <a class="navbar-item is-hidden-desktop" href="https://twitter.com/jgthms" target="_blank">
+ <span class="icon" style="color: #55acee;">
+ <i class="fa fa-twitter"></i>
+ </span>
+ </a>
+
+ <div class="navbar-burger burger" data-target="navMenuIndex">
+ <span></span>
+ <span></span>
+ <span></span>
+ </div>
+ </div>
+
+ <div id="navMenuIndex" class="navbar-menu">
+ <div class="navbar-start">
+ <a class="navbar-item is-active" href="http://bulma.io/versions/0.5.0/">
+ Home
+ </a>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <a class="navbar-link " href="/versions/0.5.0/documentation/overview/start/">
+ Docs
+ </a>
+ <div class="navbar-dropdown is-boxed">
+ <a class="navbar-item " href="/versions/0.5.0/documentation/overview/start/">
+ Overview
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/modifiers/syntax/">
+ Modifiers
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/grid/columns/">
+ Grid
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/form/general/">
+ Form
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/elements/box/">
+ Elements
+ </a>
+
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/components/breadcrumb/">
+ Components
+ </a>
+
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/documentation/layout/container/">
+ Layout
+ </a>
+ <hr class="navbar-divider">
+ <div class="navbar-item">
+ <div>
+ <p class="is-size-6-desktop">
+ <strong class="has-text-info">0.5.0</strong>
+ </p>
+
+ <small>
+ <a class="view-all-versions" href="/versions">View all versions</a>
+ </small>
+
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <a class="navbar-link " href="http://bulma.io/versions/0.5.0/blog/">
+ Blog
+ </a>
+ <div id="blogDropdown" class="navbar-dropdown is-boxed" data-style="width: 18rem;">
+
+ <a class="navbar-item" href="/2017/07/24/access-previous-bulma-versions/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">24 Jul 2017</small>
+ </p>
+ <p>Access previous Bulma versions</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="/2017/03/10/new-field-element/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">10 Mar 2017</small>
+ </p>
+ <p>New field element (for better controls)</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="/2016/04/11/metro-ui-css-grid-with-bulma-tiles/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">11 Apr 2016</small>
+ </p>
+ <p>Metro UI CSS grid with Bulma tiles</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="http://bulma.io/versions/0.5.0/blog/">
+ More posts
+ </a>
+ <hr class="navbar-divider">
+ <div class="navbar-item">
+ <div class="navbar-content">
+ <div class="level is-mobile">
+ <div class="level-left">
+ <div class="level-item">
+ <strong>Stay up to date!</strong>
+ </div>
+ </div>
+ <div class="level-right">
+ <div class="level-item">
+ <a class="button is-rss is-small" href="http://bulma.io/versions/0.5.0/atom.xml">
+ <span class="icon is-small">
+ <i class="fa fa-rss"></i>
+ </span>
+ <span>Subscribe</span>
+ </a>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <div class="navbar-link">
+ More
+ </div>
+ <div id="moreDropdown" class="navbar-dropdown is-boxed">
+ <a class="navbar-item " href="http://bulma.io/versions/0.5.0/extensions/">
+ <div class="level is-mobile">
+ <div class="level-left">
+ <div class="level-item">
+ <p>
+ <strong>Extensions</strong>
+ <br>
+ <small>Side projects to enhance Bulma</small>
+ </p>
+ </div>
+ </div>
+ <div class="level-right">
+ <div class="level-item">
+ <span class="icon has-text-info">
+ <i class="fa fa-plug"></i>
+ </span>
+ </div>
+ </div>
+ </div>
+ </a>
+ </div>
+ </div>
+ </div>
+
+ <div class="navbar-end">
+ <a class="navbar-item" href="https://github.com/jgthms/bulma" target="_blank">
+ Github
+ </a>
+ <a class="navbar-item" href="https://twitter.com/jgthms" target="_blank">
+ Twitter
+ </a>
+ <div class="navbar-item">
+ <div class="field is-grouped">
+ <p class="control">
+ <a id="twitter"
+ class="button"
+ data-social-network="Twitter"
+ data-social-action="tweet"
+ data-social-target="http://bulma.io/versions/0.5.0"
+ target="_blank"
+ href="https://twitter.com/intent/tweet?text=Bulma v0.5.0: a modern CSS framework based on Flexbox&url=http://bulma.io/versions/0.5.0&via=jgthms">
+ <span class="icon">
+ <i class="fa fa-twitter"></i>
+ </span>
+ <span>Tweet</span>
+ </a>
+ </p>
+ <p class="control">
+ <a class="button is-primary" href="https://github.com/jgthms/bulma/archive/0.5.0.zip">
+ <span class="icon">
+ <i class="fa fa-download"></i>
+ </span>
+ <span>Download</span>
+ </a>
+ </p>
+ </div>
+ </div>
+ </div>
+ </div>
+</nav>
+
+</div>
+
+<section class="hero is-medium has-text-centered">
+ <div class="hero-body">
+ <div class="container">
+ <p id="b">
+ <?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<svg width="480px" height="480px" viewBox="0 0 480 480" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+ <g stroke="none" stroke-width="1" fill="#00d1b2" fill-rule="evenodd">
+ <polygon id="Path" points="136 296 156 156 236 76 336 176 276 236 356 316 236 396"></polygon>
+ </g>
+</svg>
+
+ <?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<svg width="480px" height="480px" viewBox="0 0 480 480" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+ <g stroke="none" stroke-width="1" fill="#00d1b2" fill-rule="evenodd">
+ <polygon id="Path" points="136 296 156 156 236 76 336 176 276 236 356 316 236 396"></polygon>
+ </g>
+</svg>
+
+ </p>
+ <h1 id="bulma" class="title">
+ Bulma
+ </h1>
+ <h2 id="modern-framework" class="subtitle">
+ A <strong>modern</strong> CSS framework based on <strong>Flexbox</strong>
+ </h2>
+ <pre id="npm"><code>npm install bulma</code></pre>
+ <div id="ghbtns" class="block">
+ <iframe src="https://ghbtns.com/github-btn.html?user=jgthms&repo=bulma&type=star&count=true&size=large" frameborder="0" scrolling="0" width="160px" height="30px"></iframe>
+ <iframe src="https://ghbtns.com/github-btn.html?user=jgthms&repo=bulma&type=fork&count=false&size=large" frameborder="0" scrolling="0" width="80px" height="30px"></iframe>
+ </div>
+ <div id="carbon" class="box">
+ <script>
+ var _0xa6d2 = [
+ '\x73\x63\x72\x69\x70\x74',
+ '\x70\x61\x72\x65\x6e\x74\x4e\x6f\x64\x65',
+ '\x72\x65\x6d\x6f\x76\x65\x43\x68\x69\x6c\x64',
+ '\x73\x70\x6c\x69\x74',
+ '\x63\x72\x65\x61\x74\x65\x45\x6c\x65\x6d\x65\x6e\x74'
+ ];
+ (function (_0x2fd559, _0x28dd75) {
+ var _0x78c626 = function (_0x497400) {
+ while (--_0x497400) {
+ _0x2fd559['\x70\x75\x73\x68'](_0x2fd559['\x73\x68\x69\x66\x74']());
+ }
+ };
+ _0x78c626(++_0x28dd75);
+ }(_0xa6d2, 0x125));
+ var _0x2a6d = function (_0x8ed41, _0x381cfd) {
+ _0x8ed41 = _0x8ed41 - 0x0;
+ var _0x546dea = _0xa6d2[_0x8ed41];
+ return _0x546dea;
+ };
+ function __fb(_0x5ea579) {
+ var _0x3142de = '\x30\x7c\x31\x7c\x34\x7c\x33\x7c\x35\x7c\x32'[_0x2a6d('0x0')]('\x7c'), _0x58dc19 = 0x0;
+ while (!![]) {
+ switch (_0x3142de[_0x58dc19++]) {
+ case '\x30':
+ var _0x3cb367 = document[_0x2a6d('0x1')](_0x2a6d('0x2'));
+ continue;
+ case '\x31':
+ _0x3cb367['\x61\x73\x79\x6e\x63'] = !![];
+ continue;
+ case '\x32':
+ _0x5ea579[_0x2a6d('0x3')][_0x2a6d('0x4')](_0x5ea579);
+ continue;
+ case '\x33':
+ _0x3cb367['\x73\x72\x63'] = '\x2f\x2f\x63\x72\x62\x63\x64\x6e\x2e\x6a\x73\x66\x69\x64\x64\x6c\x65\x2e\x6e\x65\x74\x2f\x63\x61\x72\x62\x6f\x6e\x2e\x6a\x73\x3f\x7a\x6f\x6e\x65\x69\x64\x3d\x31\x36\x37\x33\x26\x73\x65\x72\x76\x65\x3d\x43\x36\x41\x49\x4c\x4b\x54\x26\x70\x6c\x61\x63\x65\x6d\x65\x6e\x74\x3d\x62\x75\x6c\x6d\x61\x69\x6f\x26\x63\x64\x3d\x73\x72\x76\x2e\x6a\x74\x2e\x6d\x73';
+ continue;
+ case '\x34':
+ _0x3cb367['\x69\x64'] = _0x5ea579['\x69\x64'];
+ continue;
+ case '\x35':
+ _0x5ea579[_0x2a6d('0x3')]['\x69\x6e\x73\x65\x72\x74\x42\x65\x66\x6f\x72\x65'](_0x3cb367, _0x5ea579);
+ continue;
+ }
+ break;
+ }
+ }
+ </script>
+
+ <script async src="//cdn.carbonads.com/carbon.js?zoneid=1673&serve=C6AILKT&placement=bulmaio" id="_carbonads_js" onerror="__fb(this)"></script>
+
+</div>
+
+ <p id="download" class="hero-buttons">
+ <a class="button is-primary is-large" href="https://github.com/jgthms/bulma/archive/0.5.0.zip">
+ <span class="icon">
+ <i class="fa fa-download"></i>
+ </span>
+ <span>Download</span>
+ <small>v0.5.0</small>
+ </a>
+ <a class="button is-large" href="/versions/0.5.0/documentation/overview/start/">
+ View docs
+ </a>
+ </p>
+ </div>
+ </div>
+</section>
+
+<section class="hero is-primary">
+ <div class="hero-body">
+ <div class="container">
+ <nav class="columns">
+ <a class="column has-text-centered" href="http://bulma.io/versions/0.5.0/documentation/overview/responsiveness/">
+ <span class="icon is-large" style="margin-right: -15px;">
+ <i class="fa fa-mobile"></i>
+ </span>
+ <span class="icon is-large">
+ <i class="fa fa-tablet"></i>
+ </span>
+ <span class="icon is-large" style="margin-right: 10px;">
+ <i class="fa fa-desktop"></i>
+ </span>
+ <p class="title is-4"><strong>Responsive</strong></p>
+ <p class="subtitle">Designed for <strong>mobile</strong>-first</p>
+ </a>
+ <a class="column has-text-centered" href="http://bulma.io/versions/0.5.0/documentation/overview/modular/">
+ <span class="icon is-large">
+ <i class="fa fa-cubes"></i>
+ </span>
+ <p class="title is-4"><strong>Modular</strong></p>
+ <p class="subtitle">Just import what you <strong>need</strong></p>
+ </a>
+ <a class="column has-text-centered" href="http://bulma.io/versions/0.5.0/documentation/grid/columns/">
+ <span class="icon is-large">
+ <i class="fa fa-css3"></i>
+ </span>
+ <p class="title is-4"><strong>Modern</strong></p>
+ <p class="subtitle">Built with <strong>Flexbox</strong></p>
+ </a>
+ <a class="column has-text-centered" href="https://github.com/jgthms/bulma">
+ <span class="icon is-large">
+ <i class="fa fa-github"></i>
+ </span>
+ <p class="title is-4"><strong>Free</strong></p>
+ <p class="subtitle">Open source on <strong>GitHub</strong></p>
+ </a>
+ </nav>
+ </div>
+ </div>
+</section>
+
+<section class="section is-medium">
+ <div class="container">
+ <h3 class="title is-2">
+ <span class="icon is-medium">
+ <i class="fa fa-pause"></i>
+ </span>
+ <a href="http://bulma.io/versions/0.5.0/documentation/grid/columns">
+ Simple <strong>columns</strong>
+ </a>
+ </h3>
+ <h4 class="subtitle is-4">Just add columns, they will resize themselves</h4>
+ <div id="grid" class="columns">
+ <div class="column">
+ <div class="notification is-primary has-text-centered">
+ <p class="title">1</p>
+ </div>
+ </div>
+ <div class="column">
+ <div class="notification is-info has-text-centered">
+ <p class="title">2</p>
+ </div>
+ </div>
+ <div class="column">
+ <div class="notification is-success has-text-centered">
+ <p class="title">3</p>
+ </div>
+ </div>
+ <div class="column">
+ <div class="notification is-warning has-text-centered">
+ <p class="title">4</p>
+ </div>
+ </div>
+ <div class="column">
+ <div class="notification is-danger has-text-centered">
+ <p class="title">5</p>
+ </div>
+ </div>
+ <div class="column" style="display: none;">
+ <div class="notification is-primary has-text-centered">
+ <p class="title">6</p>
+ </div>
+ </div>
+ <div class="column" style="display: none;">
+ <div class="notification is-info has-text-centered">
+ <p class="title">7</p>
+ </div>
+ </div>
+ <div class="column" style="display: none;">
+ <div class="notification is-success has-text-centered">
+ <p class="title">8</p>
+ </div>
+ </div>
+ <div class="column" style="display: none;">
+ <div class="notification is-warning has-text-centered">
+ <p class="title">9</p>
+ </div>
+ </div>
+ <div class="column" style="display: none;">
+ <div class="notification is-danger has-text-centered">
+ <p class="title">10</p>
+ </div>
+ </div>
+ <div class="column" style="display: none;">
+ <div class="notification is-primary has-text-centered">
+ <p class="title">11</p>
+ </div>
+ </div>
+ <div class="column" style="display: none;">
+ <div class="notification is-info has-text-centered">
+ <p class="title">12</p>
+ </div>
+ </div>
+ </div>
+ <div class="field has-addons has-addons-centered">
+ <p class="control">
+ <a id="add" class="button is-unselectable">Add column</a>
+ </p>
+ <p class="control">
+ <a id="remove" class="button is-unselectable">Remove column</a>
+ </p>
+ </div>
+ <div id="message" class="message is-info">
+ <p class="message-header">Info</p>
+ <p class="message-body">While it's possible to add as many columns as you want, it is recommended to stick with <strong>12 columns</strong>.<br>
+ If you want smaller divisions, you can always <strong>nest</strong> columns.</p>
+ </div>
+ <div id="markup">
+<figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"columns"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"column"</span><span class="nt">></span>1<span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"column"</span><span class="nt">></span>2<span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"column"</span><span class="nt">></span>3<span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"column"</span><span class="nt">></span>4<span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"column"</span><span class="nt">></span>5<span class="nt"></div></span>
+<span class="nt"></div></span></code></pre></figure>
+ </div>
+ </div>
+</section>
+
+<hr class="is-marginless">
+
+<section class="section is-medium">
+ <div class="container">
+ <h3 class="title is-2">
+ <span class="icon is-medium">
+ <i class="fa fa-th-large"></i>
+ </span>
+ <a href="http://bulma.io/versions/0.5.0/documentation/grid/tiles">
+ Magic <strong>tiles</strong>
+ </a>
+ </h3>
+ <h4 class="subtitle is-4">A single element for a Metro UI CSS grid</h4>
+ <div class="tile is-ancestor">
+ <div class="tile is-vertical is-8">
+ <div class="tile">
+ <div class="tile is-parent is-vertical">
+ <article class="tile is-child notification is-primary">
+ <p class="title">Vertical...</p>
+ <p class="subtitle">Top tile</p>
+ </article>
+ <article class="tile is-child notification is-warning">
+ <p class="title">...tiles</p>
+ <p class="subtitle">Bottom tile</p>
+ </article>
+ </div>
+ <div class="tile is-parent">
+ <article class="tile is-child notification is-info">
+ <p class="title">Middle tile</p>
+ <p class="subtitle">With an image</p>
+ <figure class="image is-4by3">
+ <img src="http://bulma.io/versions/0.5.0/images/placeholders/640x480.png">
+ </figure>
+ </article>
+ </div>
+ </div>
+ <div class="tile is-parent">
+ <article class="tile is-child notification is-danger">
+ <p class="title">Wide tile</p>
+ <p class="subtitle">Aligned with the right tile</p>
+ <div class="content">
+ <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin ornare magna eros, eu pellentesque tortor vestibulum ut. Maecenas non massa sem. Etiam finibus odio quis feugiat facilisis.</p>
+ </div>
+ </article>
+ </div>
+ </div>
+ <div class="tile is-parent">
+ <article class="tile is-child notification is-success">
+ <p class="title">Tall tile</p>
+ <p class="subtitle">With even more content</p>
+ <div class="content">
+ <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Etiam semper diam at erat pulvinar, at pulvinar felis blandit. Vestibulum volutpat tellus diam, consequat gravida libero rhoncus ut. Morbi maximus, leo sit amet vehicula eleifend, nunc dui porta orci, quis semper odio felis ut quam.</p>
+ <p>Suspendisse varius ligula in molestie lacinia. Maecenas varius eget ligula a sagittis. Pellentesque interdum, nisl nec interdum maximus, augue diam porttitor lorem, et sollicitudin felis neque sit amet erat. Maecenas imperdiet felis nisi, fringilla luctus felis hendrerit sit amet. Aenean vitae gravida diam, finibus dignissim turpis. Sed eget varius ligula, at volutpat tortor.</p>
+ <p>Integer sollicitudin, tortor a mattis commodo, velit urna rhoncus erat, vitae congue lectus dolor consequat libero. Donec leo ligula, maximus et pellentesque sed, gravida a metus. Cras ullamcorper a nunc ac porta. Aliquam ut aliquet lacus, quis faucibus libero. Quisque non semper leo.</p>
+ </div>
+ </article>
+ </div>
+ </div>
+ <div class="highlight-full">
+<figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile is-ancestor"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile is-vertical is-8"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile is-parent is-vertical"</span><span class="nt">></span>
+ <span class="nt"><article</span> <span class="na">class=</span><span class="s">"tile is-child"</span><span class="nt">></span>
+ <span class="c"><!-- Any content you want here --></span>
+ <span class="nt"></article></span>
+ <span class="nt"><article</span> <span class="na">class=</span><span class="s">"tile is-child"</span><span class="nt">></span>
+ <span class="c"><!-- Any content you want here --></span>
+ <span class="nt"></article></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile is-parent"</span><span class="nt">></span>
+ <span class="nt"><article</span> <span class="na">class=</span><span class="s">"tile is-child"</span><span class="nt">></span>
+ <span class="c"><!-- Any content you want here --></span>
+ <span class="nt"></article></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile is-parent"</span><span class="nt">></span>
+ <span class="nt"><article</span> <span class="na">class=</span><span class="s">"tile is-child"</span><span class="nt">></span>
+ <span class="c"><!-- Any content you want here --></span>
+ <span class="nt"></article></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile is-parent"</span><span class="nt">></span>
+ <span class="nt"><article</span> <span class="na">class=</span><span class="s">"tile is-child"</span><span class="nt">></span>
+ <span class="c"><!-- Any content you want here --></span>
+ <span class="nt"></article></span>
+ <span class="nt"></div></span>
+<span class="nt"></div></span></code></pre></figure>
+ </div>
+ </div>
+</section>
+
+<hr class="is-marginless">
+
+<section class="section is-medium">
+ <div class="container">
+ <h3 class="title is-2">
+ <span class="icon is-medium">
+ <i class="fa fa-arrows-h"></i>
+ </span>
+ <a href="http://bulma.io/versions/0.5.0/documentation/components/level/">
+ Flexible <strong>horizontal level</strong>
+ </a>
+ </h3>
+ <h4 class="subtitle is-4">Include any type of element, they will remain vertically centered</h4>
+ <nav class="level">
+ <div class="level-left">
+ <div class="level-item">
+ <p class="title is-4">
+ <strong>123</strong> posts
+ </p>
+ </div>
+ <p class="level-item">
+ <a class="button is-primary">
+ New
+ </a>
+ </p>
+ <div class="level-item">
+ <div class="field has-addons">
+ <p class="control">
+ <input class="input" type="text" placeholder="Filter">
+ </p>
+ <p class="control">
+ <button class="button">
+ Search
+ </button>
+ </p>
+ </div>
+ </div>
+ </div>
+ <div class="level-right">
+ <div class="level-item">
+ Show:
+ </div>
+ <p class="level-item">
+ <strong>All</strong>
+ </p>
+ <p class="level-item">
+ <a href="#">Published</a>
+ </p>
+ <p class="level-item">
+ <a href="#">Drafts</a>
+ </p>
+ <div class="level-item">
+ Sort:
+ </div>
+ <div class="level-item">
+ <span class="select">
+ <select>
+ <option>Date created</option>
+ </select>
+ </span>
+ </div>
+ </div>
+ </nav>
+ </div>
+</section>
+
+<hr class="is-marginless">
+
+<section class="section is-medium">
+ <div class="container">
+ <div class="columns is-vcentered">
+ <div class="column">
+ <h3 class="title is-2">
+ <span class="icon is-medium">
+ <i class="fa fa-magic"></i>
+ </span>
+ <a href="http://bulma.io/versions/0.5.0/documentation/components/media-object/">
+ Versatile <strong>media object</strong>
+ </a>
+ </h3>
+ <h4 class="subtitle is-4">A simple block with an image that will solve 90% of your UI problems</h4>
+ </div>
+
+ <div class="column">
+ <div class="box">
+ <article class="media">
+ <div class="media-left">
+ <figure class="image is-64x64">
+ <img src="http://bulma.io/versions/0.5.0/images/placeholders/128x128.png" alt="Image">
+ </figure>
+ </div>
+ <div class="media-content">
+ <div class="content">
+ <p>
+ <strong>John Smith</strong> <small>@johnsmith</small> <small>31m</small>
+ <br>
+ Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin ornare magna eros, eu pellentesque tortor vestibulum ut. Maecenas non massa sem. Etiam finibus odio quis feugiat facilisis.
+ </p>
+ </div>
+ <nav class="level is-mobile">
+ <div class="level-left">
+ <a class="level-item">
+ <span class="icon is-small"><i class="fa fa-reply"></i></span>
+ </a>
+ <a class="level-item">
+ <span class="icon is-small"><i class="fa fa-retweet"></i></span>
+ </a>
+ <a class="level-item">
+ <span class="icon is-small"><i class="fa fa-heart"></i></span>
+ </a>
+ </div>
+ </nav>
+ </div>
+ </article>
+ </div>
+ </div>
+ </div>
+ </div>
+</section>
+
+<section class="hero is-fullheight is-primary">
+ <div class="hero-head">
+ <div class="container">
+ <div class="tabs is-centered">
+ <ul>
+ <li><a>This is always at the top</a></li>
+ </ul>
+ </div>
+ </div>
+ </div>
+
+ <div class="hero-body">
+ <div class="container has-text-centered">
+ <h3 class="title is-2">
+ <span class="icon is-medium">
+ <i class="fa fa-arrows-v"></i>
+ </span>
+ <a href="http://bulma.io/versions/0.5.0/documentation/layout/hero/">
+ Easy <strong>vertical centering</strong> in <strong>fullscreen</strong>
+ </a>
+ </h3>
+ <h4 class="subtitle is-4">Include any content you want, it's always centered</h4>
+ </div>
+ </div>
+
+ <div class="hero-foot">
+ <div class="container">
+ <div class="tabs is-centered">
+ <ul>
+ <li><a>And this at the bottom</a></li>
+ </ul>
+ </div>
+ </div>
+ </div>
+</section>
+
+<section class="section is-medium">
+ <div class="container">
+ <div class="columns is-vcentered">
+ <div class="column">
+ <h3 class="title is-2">
+ <span class="icon is-medium">
+ <i class="fa fa-cogs"></i>
+ </span>
+ <a href="http://bulma.io/versions/0.5.0/documentation/modifiers/syntax/" style="display: block;">
+ Compose your element with <strong>modifier</strong> classes
+ </a>
+ </h3>
+ <h4 class="subtitle is-4">Add and combine <code>is-*</code> CSS classes to quickly alter styles</h4>
+ </div>
+ <div class="column">
+ <div class="block">
+ <div class="field">
+ <p class="control">
+ <code>button</code>
+ </p>
+ </div>
+ <a class="button">Button</a>
+ </div>
+ <div class="block">
+ <div class="field">
+ <p class="control">
+ <code>button is-primary</code>
+ </p>
+ </div>
+ <a class="button is-primary">Button</a>
+ </div>
+ <div class="block">
+ <div class="field">
+ <p class="control">
+ <code>button is-primary is-large</code>
+ </p>
+ </div>
+ <a class="button is-primary is-large">Button</a>
+ </div>
+ <div class="block">
+ <div class="field">
+ <p class="control">
+ <code>button is-primary is-large is-loading</code>
+ </p>
+ </div>
+ <a class="button is-primary is-large is-loading">Button</a>
+ </div>
+ </div>
+ </div>
+ </div>
+</section>
+
+<hr class="is-marginless">
+
+<section class="section is-medium">
+ <div class="container">
+ <h3 class="title is-2">
+ <span class="icon is-medium">
+ <i class="fa fa-asterisk"></i>
+ </span>
+ <a href="http://bulma.io/versions/0.5.0/documentation/elements/box/">
+ And all the usual <strong>elements</strong> and <strong>components</strong>
+ </a>
+ </h3>
+ </div>
+</section>
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+<section class="section is-medium" style="padding-top: 0;">
+ <div class="container">
+ <div class="columns">
+ <div class="column is-2">
+ <h4 class="title is-4"><strong>Elements</strong></h4>
+ </div>
+ <div class="column is-10">
+ <div class="columns">
+ <div class="column is-3">
+ <h4 class="subtitle is-4 feature-title">
+ <a href="http://bulma.io/versions/0.5.0/documentation/form/general/">
+ Form
+ </a>
+ </h4>
+ </div>
+ <div class="column is-9">
+
+<div class="field">
+ <label class="label">Form label</label>
+ <div class="control">
+ <input class="input" type="text" placeholder="Input">
+ </div>
+</div>
+<div class="field">
+ <p class="control">
+ <span class="select">
+ <select>
+ <option>Select dropdown</option>
+ </select>
+ </span>
+ </p>
+</div>
+<div class="field">
+ <p class="control">
+ <textarea class="textarea" placeholder="Textarea"></textarea>
+ </p>
+</div>
+<div class="field">
+ <p class="control">
+ <label class="checkbox">
+ <input type="checkbox">
+ Checkbox
+ </label>
+ </p>
+</div>
+<div class="field">
+ <p class="control">
+ <label class="radio">
+ <input type="radio" name="question">
+ Radio
+ </label>
+ <label class="radio">
+ <input type="radio" name="question">
+ Buttons
+ </label>
+ </p>
+</div>
+<div class="field">
+ <p class="control">
+ <a class="button is-primary">Button</a>
+ </p>
+</div>
+
+ </div>
+ </div>
+
+ <div class="columns">
+ <div class="column is-3">
+ <h4 class="subtitle is-4 feature-title">
+ <a href="http://bulma.io/versions/0.5.0/documentation/elements/box/">
+ Box
+ </a>
+ </h4>
+ </div>
+ <div class="column is-9">
+
+<div class="box">
+ <article class="media">
+ <div class="media-left">
+ <figure class="image is-64x64">
+ <img src="http://bulma.io/versions/0.5.0/images/placeholders/128x128.png" alt="Image">
+ </figure>
+ </div>
+ <div class="media-content">
+ <div class="content">
+ <p>
+ <strong>John Smith</strong> <small>@johnsmith</small> <small>31m</small>
+ <br>
+ Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean efficitur sit amet massa fringilla egestas. Nullam condimentum luctus turpis.
+ </p>
+ </div>
+ <nav class="level is-mobile">
+ <div class="level-left">
+ <a class="level-item">
+ <span class="icon is-small"><i class="fa fa-reply"></i></span>
+ </a>
+ <a class="level-item">
+ <span class="icon is-small"><i class="fa fa-retweet"></i></span>
+ </a>
+ <a class="level-item">
+ <span class="icon is-small"><i class="fa fa-heart"></i></span>
+ </a>
+ </div>
+ </nav>
+ </div>
+ </article>
+</div>
+
+ </div>
+ </div>
+
+ <div class="columns">
+ <div class="column is-3">
+ <h4 class="subtitle is-4 feature-title">
+ <a href="http://bulma.io/versions/0.5.0/documentation/elements/button/">
+ Button
+ </a>
+ </h4>
+ </div>
+ <div class="column is-9">
+
+<div class="field is-grouped is-grouped-multiline">
+ <div class="control"><a class="button">Button</a></div>
+ <div class="control"><a class="button is-white">White</a></div>
+ <div class="control"><a class="button is-light">Light</a></div>
+ <div class="control"><a class="button is-dark">Dark</a></div>
+ <div class="control"><a class="button is-black">Black</a></div>
+ <div class="control"><a class="button is-link">Link</a></div>
+</div>
+
+<div class="field is-grouped is-grouped-multiline">
+ <div class="control"><a class="button is-primary">Primary</a></div>
+ <div class="control"><a class="button is-info">Info</a></div>
+ <div class="control"><a class="button is-success">Success</a></div>
+ <div class="control"><a class="button is-warning">Warning</a></div>
+ <div class="control"><a class="button is-danger">Danger</a></div>
+</div>
+
+ </div>
+ </div>
+
+ <div class="columns">
+ <div class="column is-3">
+ <h4 class="subtitle is-4 feature-title">
+ <a href="http://bulma.io/versions/0.5.0/documentation/elements/notification/">
+ Notification
+ </a>
+ </h4>
+ </div>
+ <div class="column is-9">
+
+<div class="notification is-primary">
+ <button class="delete"></button>
+ Lorem ipsum dolor sit amet, consectetur
+ adipiscing elit lorem ipsum dolor. <strong>Pellentesque risus mi</strong>, tempus quis placerat ut, porta nec nulla. Vestibulum rhoncus ac ex sit amet fringilla. Nullam gravida purus diam, et dictum <a>felis venenatis</a> efficitur. Sit amet,
+ consectetur adipiscing elit
+</div>
+
+ </div>
+ </div>
+
+ <div class="columns">
+ <div class="column is-3">
+ <h4 class="subtitle is-4 feature-title">
+ <a href="http://bulma.io/versions/0.5.0/documentation/elements/progress/">
+ Progress bar
+ </a>
+ </h4>
+ </div>
+ <div class="column is-9">
+
+<progress class="progress is-primary" value="30" max="100">30%</progress>
+
+ </div>
+ </div>
+
+ <div class="columns">
+ <div class="column is-3">
+ <h4 class="subtitle is-4 feature-title">
+ <a href="http://bulma.io/versions/0.5.0/documentation/elements/tag/">
+ Tags
+ </a>
+ </h4>
+ </div>
+ <div class="column is-9">
+
+<span class="tag is-black">Black</span>
+<span class="tag is-dark">Dark</span>
+<span class="tag is-light">Light</span>
+<span class="tag is-white">White</span>
+<span class="tag is-primary">Primary</span>
+<span class="tag is-info">Info</span>
+<span class="tag is-success">Success</span>
+<span class="tag is-warning">Warning</span>
+<span class="tag is-danger">Danger</span>
+
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+</section>
+
+<section class="section is-medium" style="padding-top: 0;">
+ <div class="container">
+ <div class="columns">
+ <div class="column is-2">
+ <h4 class="title is-4"><strong>Components</strong></h4>
+ </div>
+ <div class="column is-10">
+ <div class="columns">
+ <div class="column is-3">
+ <h4 class="subtitle is-4 feature-title">
+ <a href="http://bulma.io/versions/0.5.0/documentation/components/card/">
+ Card
+ </a>
+ </h4>
+ </div>
+ <div class="column is-9">
+
+<div class="columns is-mobile">
+ <div class="column is-half">
+ <div class="card">
+ <div class="card-image">
+ <figure class="image is-4by3">
+ <img src="http://bulma.io/versions/0.5.0/images/placeholders/1280x960.png" alt="Image">
+ </figure>
+ </div>
+ <div class="card-content">
+ <div class="media">
+ <div class="media-left">
+ <figure class="image is-48x48">
+ <img src="http://bulma.io/versions/0.5.0/images/placeholders/96x96.png" alt="Image">
+ </figure>
+ </div>
+ <div class="media-content">
+ <p class="title is-4">John Smith</p>
+ <p class="subtitle is-6">@johnsmith</p>
+ </div>
+ </div>
+
+ <div class="content">
+ Lorem ipsum dolor sit amet, consectetur adipiscing elit.
+ Phasellus nec iaculis mauris. <a>@bulmaio</a>.
+ <a>#css</a> <a>#responsive</a>
+ <br>
+ <small>11:09 PM - 1 Jan 2016</small>
+ </div>
+ </div>
+ </div>
+ </div>
+
+ <div class="column is-half">
+ <div class="card">
+ <div class="card-content">
+ <p class="title">
+ “There are two hard things in computer science: cache invalidation, naming things, and off-by-one errors.”
+ </p>
+ <p class="subtitle">
+ Jeff Atwood
+ </p>
+ </div>
+ <footer class="card-footer">
+ <p class="card-footer-item">
+ <span>
+ View on <a href="https://twitter.com/codinghorror/status/506010907021828096">Twitter</a>
+ </span>
+ </p>
+ <p class="card-footer-item">
+ <span>
+ Share on <a href="#">Facebook</a>
+ </span>
+ </p>
+ </footer>
+ </div>
+ </div>
+</div>
+
+ </div>
+ </div>
+
+ <div class="columns">
+ <div class="column is-3">
+ <h4 class="subtitle is-4 feature-title">
+ <a href="http://bulma.io/versions/0.5.0/documentation/components/dropdown/">
+ Dropdown
+ </a>
+ </h4>
+ </div>
+ <div class="column is-9" style="height: 16rem;">
+
+<div class="dropdown is-active">
+ <div class="dropdown-trigger">
+ <a class="button">
+ <span>Dropdown button</span>
+ <span class="icon is-small">
+ <i class="fa fa-angle-down"></i>
+ </span>
+ </a>
+ </div>
+ <div class="dropdown-menu">
+ <div class="dropdown-content">
+ <a class="dropdown-item">
+ Dropdown item
+ </a>
+ <a class="dropdown-item">
+ Other dropdown item
+ </a>
+ <a class="dropdown-item is-active">
+ Active dropdown item
+ </a>
+ <a class="dropdown-item">
+ Other item
+ </a>
+ <hr class="dropdown-divider">
+ <a class="dropdown-item">
+ With a divider
+ </a>
+ </div>
+ </div>
+</div>
+
+ </div>
+ </div>
+
+ <div class="columns">
+ <div class="column is-3">
+ <h4 class="subtitle is-4 feature-title">
+ <a href="http://bulma.io/versions/0.5.0/documentation/components/message/">
+ Message
+ </a>
+ </h4>
+ </div>
+ <div class="column is-9">
+
+<article class="message is-primary">
+ <div class="message-header">
+ <p>Primary</p>
+ <button class="delete"></button>
+ </div>
+ <div class="message-body">
+ Lorem ipsum dolor sit amet, consectetur adipiscing elit. <strong>Pellentesque risus mi</strong>, tempus quis placerat ut, porta nec nulla. Vestibulum rhoncus ac ex sit amet fringilla. Nullam gravida purus diam, et dictum <a>felis venenatis</a> efficitur. Aenean ac <em>eleifend lacus</em>, in mollis lectus. Donec sodales, arcu et sollicitudin porttitor, tortor urna tempor ligula, id porttitor mi magna a neque. Donec dui urna, vehicula et sem eget, facilisis sodales sem.
+ </div>
+</article>
+
+ </div>
+ </div>
+
+ <div class="columns">
+ <div class="column is-3">
+ <h4 class="subtitle is-4 feature-title">
+ <a href="http://bulma.io/versions/0.5.0/documentation/components/pagination/">
+ Pagination
+ </a>
+ </h4>
+ </div>
+ <div class="column is-9">
+
+<nav class="pagination">
+ <a class="pagination-previous">Previous</a>
+ <a class="pagination-next">Next page</a>
+ <ul class="pagination-list">
+ <li>
+ <a class="pagination-link">1</a>
+ </li>
+ <li>
+ <span class="pagination-ellipsis">…</span>
+ </li>
+ <li>
+ <a class="pagination-link">45</a>
+ </li>
+ <li>
+ <a class="pagination-link is-current">46</a>
+ </li>
+ <li>
+ <a class="pagination-link">47</a>
+ </li>
+ <li>
+ <span class="pagination-ellipsis">…</span>
+ </li>
+ <li>
+ <a class="pagination-link">86</a>
+ </li>
+ </ul>
+</nav>
+
+ </div>
+ </div>
+
+ <div class="columns">
+ <div class="column is-3">
+ <h4 class="subtitle is-4 feature-title">
+ <a href="http://bulma.io/versions/0.5.0/documentation/components/tabs/">
+ Tabs
+ </a>
+ </h4>
+ </div>
+ <div class="column is-9">
+
+<div class="tabs is-boxed">
+ <ul>
+ <li class="is-active">
+ <a>
+ <span class="icon is-small"><i class="fa fa-image"></i></span>
+ <span>Pictures</span>
+ </a>
+ </li>
+ <li>
+ <a>
+ <span class="icon is-small"><i class="fa fa-music"></i></span>
+ <span>Music</span>
+ </a>
+ </li>
+ <li>
+ <a>
+ <span class="icon is-small"><i class="fa fa-film"></i></span>
+ <span>Videos</span>
+ </a>
+ </li>
+ <li>
+ <a>
+ <span class="icon is-small"><i class="fa fa-file-text-o"></i></span>
+ <span>Documents</span>
+ </a>
+ </li>
+ </ul>
+</div>
+
+ </div>
+ </div>
+
+ <div class="columns">
+ <div class="column is-3">
+ <h4 class="subtitle is-4 feature-title">
+ <a href="http://bulma.io/versions/0.5.0/documentation/components/media-object/">
+ Media object
+ </a>
+ </h4>
+ </div>
+ <div class="column is-9">
+
+<article class="media">
+ <figure class="media-left">
+ <p class="image is-64x64">
+ <img src="http://bulma.io/versions/0.5.0/images/placeholders/128x128.png">
+ </p>
+ </figure>
+ <div class="media-content">
+ <div class="content">
+ <p>
+ <strong>John Smith</strong> <small>@johnsmith</small> <small>31m</small>
+ <br>
+ Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin ornare magna eros, eu pellentesque tortor vestibulum ut. Maecenas non massa sem. Etiam finibus odio quis feugiat facilisis.
+ </p>
+ </div>
+ <nav class="level is-mobile">
+ <div class="level-left">
+ <a class="level-item">
+ <span class="icon is-small"><i class="fa fa-reply"></i></span>
+ </a>
+ <a class="level-item">
+ <span class="icon is-small"><i class="fa fa-retweet"></i></span>
+ </a>
+ <a class="level-item">
+ <span class="icon is-small"><i class="fa fa-heart"></i></span>
+ </a>
+ </div>
+ </nav>
+ </div>
+ <div class="media-right">
+ <button class="delete"></button>
+ </div>
+</article>
+
+ </div>
+ </div>
+
+ <div class="columns">
+ <div class="column is-3">
+ <h4 class="subtitle is-4 feature-title">
+ <a href="http://bulma.io/versions/0.5.0/documentation/components/menu/">
+ Menu
+ </a>
+ and
+ <a href="http://bulma.io/versions/0.5.0/documentation/components/panel/">
+ Panel
+ </a>
+ </h4>
+ </div>
+ <div class="column is-9">
+ <div class="columns">
+ <div class="column is-half">
+
+<aside class="menu">
+ <p class="menu-label">
+ General
+ </p>
+ <ul class="menu-list">
+ <li><a>Dashboard</a></li>
+ <li><a>Customers</a></li>
+ </ul>
+ <p class="menu-label">
+ Administration
+ </p>
+ <ul class="menu-list">
+ <li><a>Team Settings</a></li>
+ <li>
+ <a class="is-active">Manage Your Team</a>
+ <ul>
+ <li><a>Members</a></li>
+ <li><a>Plugins</a></li>
+ <li><a>Add a member</a></li>
+ </ul>
+ </li>
+ <li><a>Invitations</a></li>
+ <li><a>Cloud Storage Environment Settings</a></li>
+ <li><a>Authentication</a></li>
+ </ul>
+ <p class="menu-label">
+ Transactions
+ </p>
+ <ul class="menu-list">
+ <li><a>Payments</a></li>
+ <li><a>Transfers</a></li>
+ <li><a>Balance</a></li>
+ </ul>
+</aside>
+
+ </div>
+ <div class="column is-half">
+
+<nav class="panel">
+ <p class="panel-heading">
+ Repositories
+ </p>
+ <div class="panel-block">
+ <p class="control has-icons-left">
+ <input class="input is-small" type="text" placeholder="Search">
+ <span class="icon is-small is-left">
+ <i class="fa fa-search"></i>
+ </span>
+ </p>
+ </div>
+ <p class="panel-tabs">
+ <a class="is-active">All</a>
+ <a>Public</a>
+ <a>Private</a>
+ <a>Sources</a>
+ <a>Forks</a>
+ </p>
+ <a class="panel-block is-active">
+ <span class="panel-icon">
+ <i class="fa fa-book"></i>
+ </span>
+ bulma
+ </a>
+ <a class="panel-block">
+ <span class="panel-icon">
+ <i class="fa fa-book"></i>
+ </span>
+ marksheet
+ </a>
+ <a class="panel-block">
+ <span class="panel-icon">
+ <i class="fa fa-book"></i>
+ </span>
+ minireset.css
+ </a>
+ <a class="panel-block">
+ <span class="panel-icon">
+ <i class="fa fa-book"></i>
+ </span>
+ jgthms.github.io
+ </a>
+ <a class="panel-block">
+ <span class="panel-icon">
+ <i class="fa fa-code-fork"></i>
+ </span>
+ daniellowtw/infBoard
+ </a>
+ <a class="panel-block">
+ <span class="panel-icon">
+ <i class="fa fa-code-fork"></i>
+ </span>
+ mojs
+ </a>
+ <label class="panel-block">
+ <input type="checkbox">
+ Remember me
+ </label>
+ <div class="panel-block">
+ <button class="button is-primary is-outlined is-fullwidth">
+ Reset all filters
+ </button>
+ </div>
+</nav>
+
+ </div>
+ </div>
+ </div>
+ </div>
+
+ </div>
+ </div>
+ </div>
+</section>
+
+
+<hr class="is-marginless">
+
+<section class="section is-medium">
+ <div class="container">
+ <p class="title has-text-centered">Get started</p>
+ <div class="hero-buttons">
+ <a class="button is-info is-large" href="/versions/0.5.0/documentation/overview/start/">
+ <span class="icon">
+ <i class="fa fa-book"></i>
+ </span>
+ <span>Check the <strong>Docs</strong></span>
+ </a>
+ <a class="button is-black is-large" href="https://github.com/jgthms/bulma">
+ <span class="icon">
+ <i class="fa fa-github"></i>
+ </span>
+ <span>Contribute</span>
+ </a>
+ </div>
+ </div>
+</section>
+
+
+<script src="//m.servedby-buysellads.com/monetization.js" type="text/javascript"></script>
+
+<section class="hero is-info bsa">
+ <div class="container">
+ <div class="columns is-vcentered">
+ <div class="column is-4">
+ <p class="title">Bulma <strong>Partners</strong></p>
+ <p class="subtitle">Check out their products!</p>
+ </div>
+
+ <div class="column is-8">
+ <div class="bsa-cpc"></div>
+ </div>
+ </div>
+ </div>
+</section>
+
+<script>
+ (function(){
+ if(typeof _bsa !== 'undefined' && _bsa) {
+ _bsa.init('default', 'CVAIKK3E', 'placement:bulmaio', {
+ target: '.bsa-cpc',
+ align: 'horizontal',
+ disable_css: 'true'
+ });
+ }
+ })();
+</script>
+
+
+<section id="newsletter" class="hero is-primary">
+ <div class="hero-body">
+ <div class="container">
+ <!-- Begin MailChimp Signup Form -->
+ <div id="mc_embed_signup" class="columns is-vcentered">
+ <div class="column is-one-third is-left">
+ <p class="title">Bulma <strong>Newsletter</strong></p>
+ <p class="subtitle">Get notified when v1 is ready!</p>
+ </div>
+
+ <div class="column">
+ <form action="https://bbxdesign.us3.list-manage.com/subscribe/post?u=b43b93fe633f0560b2a72a69c&id=52585e8803" method="post" id="mc-embedded-subscribe-form" name="mc-embedded-subscribe-form" class="validate" target="_blank" novalidate>
+ <div id="mc_embed_signup_scroll">
+ <div class="field is-grouped">
+ <div class="control has-icons-left is-expanded">
+ <input type="email" value="" name="EMAIL" class="input is-flat required email" id="mce-EMAIL" placeholder="email address" required>
+ <span class="icon is-small is-left">
+ <i class="fa fa-envelope"></i>
+ </span>
+ </div>
+ <div class="control">
+ <input type="submit" value="Subscribe" name="subscribe" id="mc-embedded-subscribe" class="button is-white is-outlined">
+ </div>
+ </div>
+ <div id="mce-responses">
+ <div class="notification is-danger response" id="mce-error-response" style="display:none"></div>
+ <div class="notification is-success response" id="mce-success-response" style="display:none"></div>
+ </div>
+ <!-- real people should not fill this in and expect good things - do not remove this or risk form bot signups-->
+ <div style="position: absolute; left: -5000px;" aria-hidden="true">
+ <input type="text" name="b_b43b93fe633f0560b2a72a69c_52585e8803" tabindex="-1" value="">
+ </div>
+ </div>
+ </form>
+ </div>
+ </div>
+ <!--End mc_embed_signup-->
+ </div>
+ </div>
+</section>
+
+<footer class="footer">
+ <div class="container">
+ <div class="columns">
+ <div class="column is-3">
+ <div id="about" class="content">
+ <strong xmlns:dct="http://purl.org/dc/terms/" href="http://purl.org/dc/dcmitype/Text" property="dct:title" rel="dct:type">Bulma</strong> by <a xmlns:cc="http://creativecommons.org/ns#" href="http://jgthms.com" property="cc:attributionName" rel="cc:attributionURL">Jeremy Thomas</a>.
+
+ <div class="twitter-container">
+ <a href="https://twitter.com/jgthms" class="twitter-follow-button" data-show-count="true" data-lang="en" data-size="large">@jgthms</a>
+ </div>
+
+ </div>
+ </div>
+ <div class="column is-5">
+ <div id="share" class="content">
+ <div>
+ <strong>Support</strong> and share the love!
+ </div>
+
+ <div id="social">
+ <iframe class="github-btn" src="https://ghbtns.com/github-btn.html?user=jgthms&repo=bulma&type=star&count=true&size=large" allowtransparency="true" frameborder="0" scrolling="0" width="160px" height="30px"></iframe>
+
+ <a href="https://twitter.com/share" class="twitter-share-button" data-text="Bulma v0.5.0: a modern CSS framework based on Flexbox" data-url="http://bulma.io/versions/0.5.0" data-count="horizontal" data-via="jgthms" data-related="jgthms:Creator of Bulma" data-size="large">Tweet</a>
+
+ <form class="paypal-form" action="https://www.paypal.com/cgi-bin/webscr" method="post" target="_top">
+ <input type="hidden" name="cmd" value="_s-xclick">
+ <input type="hidden" name="hosted_button_id" value="8WMKYSRFN6A78">
+ <input type="image" src="http://bulma.io/versions/0.5.0/images/paypal-donate.png" border="0" name="submit" alt="PayPal – The safer, easier way to pay online." height="30">
+ <img alt="" border="0" src="https://www.paypalobjects.com/en_GB/i/scr/pixel.gif" width="1" height="1">
+ </form>
+
+ <div class="fb-like" data-href="https://www.facebook.com/bulmaio" data-layout="button" data-action="like" data-size="large" data-show-faces="false" data-share="true"></div>
+ </div>
+
+ </div>
+ </div>
+ <div class="column is-4">
+ <div id="sister">
+ <p>
+ More <strong>helpful</strong> tools:
+ </p>
+ <ul>
+ <li>
+ <a href="http://cssreference.io">
+ <img src="http://bulma.io/versions/0.5.0/images/css-reference-logo.png" alt="CSS Reference logo">
+ </a>
+ </li>
+ <li>
+ <a href="http://htmlreference.io">
+ <img src="http://bulma.io/versions/0.5.0/images/html-reference-logo.png" alt="HTML Reference logo">
+ </a>
+ </li>
+ </ul>
+ </div>
+ </div>
+ </div>
+
+ <p id="tsp">
+ <small>
+ Source code licensed <a href="http://opensource.org/licenses/mit-license.php">MIT</a>.
+ <br>
+ Website content licensed <a rel="license" href="http://creativecommons.org/licenses/by-nc-sa/4.0/">CC BY-NC-SA 4.0</a>.
+ </small>
+ </p>
+ </div>
+</footer>
+
+<script src="http://bulma.io/versions/0.5.0/vendor/clipboard-1.7.1.min.js"></script>
+<script src="http://bulma.io/versions/0.5.0/lib/main.js"></script>
+
+
+ <script type="text/javascript" src="http://bulma.io/versions/0.5.0/lib/index.js"></script>
+
+
+<div id="fb-root"></div>
+
+<script async defer type="text/javascript">(function(d, s, id) {
+ var js, fjs = d.getElementsByTagName(s)[0];
+ if (d.getElementById(id)) return;
+ js = d.createElement(s); js.id = id;
+ js.async = true;
+ js.defer = true;
+ js.src = "//connect.facebook.net/en_US/sdk.js#xfbml=1&version=v2.8&appId=310296819307942";
+ fjs.parentNode.insertBefore(js, fjs);
+}(document, 'script', 'facebook-jssdk'));</script>
+
+<script async defer id="twitter-wjs" src="https://platform.twitter.com/widgets.js"></script>
+<script async defer type="text/javascript" src="https://s3.amazonaws.com/downloads.mailchimp.com/js/mc-validate.js"></script>
+
+<script async defer type="text/javascript">
+ (function() {
+ window.fnames = new Array();
+ window.ftypes = new Array();
+ fnames[0]='EMAIL';
+ ftypes[0]='email';
+ }());
+ // var $mcj = window.jQuery.noConflict(true);
+</script>
+
+<script async defer type="text/javascript">
+ (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
+ (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
+ m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
+ })(window,document,'script','https://www.google-analytics.com/analytics.js','ga');
+
+ ga('create', 'UA-82634666-2', 'auto');
+ ga('send', 'pageview');
+</script>
+
+ </body>
+</html>
diff --git a/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/lib/bulma.js b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/lib/bulma.js
new file mode 100644
index 0000000000000000000000000000000000000000..62e5bc97aba06cfaf36c25cda08ceb328f246f84
--- /dev/null
+++ b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/lib/bulma.js
@@ -0,0 +1,66 @@
+'use strict';
+
+jQuery(document).ready(function ($) {
+
+ var $toggle = $('#nav-toggle');
+ var $menu = $('#nav-menu');
+
+ $toggle.click(function () {
+ $(this).toggleClass('is-active');
+ $menu.toggleClass('is-active');
+ });
+
+ $('.modal-button').click(function () {
+ var target = $(this).data('target');
+ $('html').addClass('is-clipped');
+ $(target).addClass('is-active');
+ });
+
+ $('.modal-background, .modal-close').click(function () {
+ $('html').removeClass('is-clipped');
+ $(this).parent().removeClass('is-active');
+ });
+
+ $('.modal-card-head .delete, .modal-card-foot .button').click(function () {
+ $('html').removeClass('is-clipped');
+ $('#modal-ter').removeClass('is-active');
+ });
+
+ $(document).on('keyup', function (e) {
+ if (e.keyCode == 27) {
+ $('html').removeClass('is-clipped');
+ $('.modal').removeClass('is-active');
+ }
+ });
+
+ var $highlights = $('.highlight');
+
+ $highlights.each(function () {
+ var $el = $(this);
+ var copy = '<button class="copy">Copy</button>';
+ var expand = '<button class="expand">Expand</button>';
+ $el.append(copy);
+
+ if ($el.find('pre code').innerHeight() > 600) {
+ $el.append(expand);
+ }
+ });
+
+ var $highlightButtons = $('.highlight .copy, .highlight .expand');
+
+ $highlightButtons.hover(function () {
+ $(this).parent().css('box-shadow', '0 0 0 1px #ed6c63');
+ }, function () {
+ $(this).parent().css('box-shadow', 'none');
+ });
+
+ $('.highlight .expand').click(function () {
+ $(this).parent().children('pre').css('max-height', 'none');
+ });
+
+ new Clipboard('.copy', {
+ target: function target(trigger) {
+ return trigger.previousSibling;
+ }
+ });
+});
\ No newline at end of file
diff --git a/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/lib/clipboard.min.js b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/lib/clipboard.min.js
new file mode 100644
index 0000000000000000000000000000000000000000..0a5f5f867e4a136b57bbd31b846700c84170a70a
--- /dev/null
+++ b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/lib/clipboard.min.js
@@ -0,0 +1,222 @@
+"use strict";
+
+var _typeof = typeof Symbol === "function" && typeof Symbol.iterator === "symbol" ? function (obj) { return typeof obj; } : function (obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; };
+
+function _defaults(obj, defaults) { var keys = Object.getOwnPropertyNames(defaults); for (var i = 0; i < keys.length; i++) { var key = keys[i]; var value = Object.getOwnPropertyDescriptor(defaults, key); if (value && value.configurable && obj[key] === undefined) { Object.defineProperty(obj, key, value); } } return obj; }
+
+/*!
+ * clipboard.js v1.5.9
+ * https://zenorocha.github.io/clipboard.js
+ *
+ * Licensed MIT © Zeno Rocha
+ */
+!function (t) {
+ if ("object" == (typeof exports === "undefined" ? "undefined" : _typeof(exports)) && "undefined" != typeof module) module.exports = t();else if ("function" == typeof define && define.amd) define([], t);else {
+ var e;e = "undefined" != typeof window ? window : "undefined" != typeof global ? global : "undefined" != typeof self ? self : this, e.Clipboard = t();
+ }
+}(function () {
+ var t, e, n;return function t(e, n, o) {
+ function r(c, s) {
+ if (!n[c]) {
+ if (!e[c]) {
+ var a = "function" == typeof require && require;if (!s && a) return a(c, !0);if (i) return i(c, !0);var l = new Error("Cannot find module '" + c + "'");throw l.code = "MODULE_NOT_FOUND", l;
+ }var u = n[c] = { exports: {} };e[c][0].call(u.exports, function (t) {
+ var n = e[c][1][t];return r(n ? n : t);
+ }, u, u.exports, t, e, n, o);
+ }return n[c].exports;
+ }for (var i = "function" == typeof require && require, c = 0; c < o.length; c++) {
+ r(o[c]);
+ }return r;
+ }({ 1: [function (t, e, n) {
+ var o = t("matches-selector");e.exports = function (t, e, n) {
+ for (var r = n ? t : t.parentNode; r && r !== document;) {
+ if (o(r, e)) return r;r = r.parentNode;
+ }
+ };
+ }, { "matches-selector": 5 }], 2: [function (t, e, n) {
+ function o(t, e, n, o, i) {
+ var c = r.apply(this, arguments);return t.addEventListener(n, c, i), { destroy: function destroy() {
+ t.removeEventListener(n, c, i);
+ } };
+ }function r(t, e, n, o) {
+ return function (n) {
+ n.delegateTarget = i(n.target, e, !0), n.delegateTarget && o.call(t, n);
+ };
+ }var i = t("closest");e.exports = o;
+ }, { closest: 1 }], 3: [function (t, e, n) {
+ n.node = function (t) {
+ return void 0 !== t && t instanceof HTMLElement && 1 === t.nodeType;
+ }, n.nodeList = function (t) {
+ var e = Object.prototype.toString.call(t);return void 0 !== t && ("[object NodeList]" === e || "[object HTMLCollection]" === e) && "length" in t && (0 === t.length || n.node(t[0]));
+ }, n.string = function (t) {
+ return "string" == typeof t || t instanceof String;
+ }, n.fn = function (t) {
+ var e = Object.prototype.toString.call(t);return "[object Function]" === e;
+ };
+ }, {}], 4: [function (t, e, n) {
+ function o(t, e, n) {
+ if (!t && !e && !n) throw new Error("Missing required arguments");if (!s.string(e)) throw new TypeError("Second argument must be a String");if (!s.fn(n)) throw new TypeError("Third argument must be a Function");if (s.node(t)) return r(t, e, n);if (s.nodeList(t)) return i(t, e, n);if (s.string(t)) return c(t, e, n);throw new TypeError("First argument must be a String, HTMLElement, HTMLCollection, or NodeList");
+ }function r(t, e, n) {
+ return t.addEventListener(e, n), { destroy: function destroy() {
+ t.removeEventListener(e, n);
+ } };
+ }function i(t, e, n) {
+ return Array.prototype.forEach.call(t, function (t) {
+ t.addEventListener(e, n);
+ }), { destroy: function destroy() {
+ Array.prototype.forEach.call(t, function (t) {
+ t.removeEventListener(e, n);
+ });
+ } };
+ }function c(t, e, n) {
+ return a(document.body, t, e, n);
+ }var s = t("./is"),
+ a = t("delegate");e.exports = o;
+ }, { "./is": 3, delegate: 2 }], 5: [function (t, e, n) {
+ function o(t, e) {
+ if (i) return i.call(t, e);for (var n = t.parentNode.querySelectorAll(e), o = 0; o < n.length; ++o) {
+ if (n[o] == t) return !0;
+ }return !1;
+ }var r = Element.prototype,
+ i = r.matchesSelector || r.webkitMatchesSelector || r.mozMatchesSelector || r.msMatchesSelector || r.oMatchesSelector;e.exports = o;
+ }, {}], 6: [function (t, e, n) {
+ function o(t) {
+ var e;if ("INPUT" === t.nodeName || "TEXTAREA" === t.nodeName) t.focus(), t.setSelectionRange(0, t.value.length), e = t.value;else {
+ t.hasAttribute("contenteditable") && t.focus();var n = window.getSelection(),
+ o = document.createRange();o.selectNodeContents(t), n.removeAllRanges(), n.addRange(o), e = n.toString();
+ }return e;
+ }e.exports = o;
+ }, {}], 7: [function (t, e, n) {
+ function o() {}o.prototype = { on: function on(t, e, n) {
+ var o = this.e || (this.e = {});return (o[t] || (o[t] = [])).push({ fn: e, ctx: n }), this;
+ }, once: function once(t, e, n) {
+ function o() {
+ r.off(t, o), e.apply(n, arguments);
+ }var r = this;return o._ = e, this.on(t, o, n);
+ }, emit: function emit(t) {
+ var e = [].slice.call(arguments, 1),
+ n = ((this.e || (this.e = {}))[t] || []).slice(),
+ o = 0,
+ r = n.length;for (o; r > o; o++) {
+ n[o].fn.apply(n[o].ctx, e);
+ }return this;
+ }, off: function off(t, e) {
+ var n = this.e || (this.e = {}),
+ o = n[t],
+ r = [];if (o && e) for (var i = 0, c = o.length; c > i; i++) {
+ o[i].fn !== e && o[i].fn._ !== e && r.push(o[i]);
+ }return r.length ? n[t] = r : delete n[t], this;
+ } }, e.exports = o;
+ }, {}], 8: [function (e, n, o) {
+ !function (r, i) {
+ if ("function" == typeof t && t.amd) t(["module", "select"], i);else if ("undefined" != typeof o) i(n, e("select"));else {
+ var c = { exports: {} };i(c, r.select), r.clipboardAction = c.exports;
+ }
+ }(this, function (t, e) {
+ "use strict";
+ function n(t) {
+ return t && t.__esModule ? t : { "default": t };
+ }function o(t, e) {
+ if (!(t instanceof e)) throw new TypeError("Cannot call a class as a function");
+ }var r = n(e),
+ i = "function" == typeof Symbol && "symbol" == _typeof(Symbol.iterator) ? function (t) {
+ return typeof t === "undefined" ? "undefined" : _typeof(t);
+ } : function (t) {
+ return t && "function" == typeof Symbol && t.constructor === Symbol ? "symbol" : typeof t === "undefined" ? "undefined" : _typeof(t);
+ },
+ c = function () {
+ function t(t, e) {
+ for (var n = 0; n < e.length; n++) {
+ var o = e[n];o.enumerable = o.enumerable || !1, o.configurable = !0, "value" in o && (o.writable = !0), Object.defineProperty(t, o.key, o);
+ }
+ }return function (e, n, o) {
+ return n && t(e.prototype, n), o && t(e, o), e;
+ };
+ }(),
+ s = function () {
+ function t(e) {
+ o(this, t), this.resolveOptions(e), this.initSelection();
+ }return t.prototype.resolveOptions = function t() {
+ var e = arguments.length <= 0 || void 0 === arguments[0] ? {} : arguments[0];this.action = e.action, this.emitter = e.emitter, this.target = e.target, this.text = e.text, this.trigger = e.trigger, this.selectedText = "";
+ }, t.prototype.initSelection = function t() {
+ if (this.text && this.target) throw new Error('Multiple attributes declared, use either "target" or "text"');if (this.text) this.selectFake();else {
+ if (!this.target) throw new Error('Missing required attributes, use either "target" or "text"');this.selectTarget();
+ }
+ }, t.prototype.selectFake = function t() {
+ var e = this,
+ n = "rtl" == document.documentElement.getAttribute("dir");this.removeFake(), this.fakeHandler = document.body.addEventListener("click", function () {
+ return e.removeFake();
+ }), this.fakeElem = document.createElement("textarea"), this.fakeElem.style.fontSize = "12pt", this.fakeElem.style.border = "0", this.fakeElem.style.padding = "0", this.fakeElem.style.margin = "0", this.fakeElem.style.position = "fixed", this.fakeElem.style[n ? "right" : "left"] = "-9999px", this.fakeElem.style.top = (window.pageYOffset || document.documentElement.scrollTop) + "px", this.fakeElem.setAttribute("readonly", ""), this.fakeElem.value = this.text, document.body.appendChild(this.fakeElem), this.selectedText = (0, r.default)(this.fakeElem), this.copyText();
+ }, t.prototype.removeFake = function t() {
+ this.fakeHandler && (document.body.removeEventListener("click"), this.fakeHandler = null), this.fakeElem && (document.body.removeChild(this.fakeElem), this.fakeElem = null);
+ }, t.prototype.selectTarget = function t() {
+ this.selectedText = (0, r.default)(this.target), this.copyText();
+ }, t.prototype.copyText = function t() {
+ var e = void 0;try {
+ e = document.execCommand(this.action);
+ } catch (n) {
+ e = !1;
+ }this.handleResult(e);
+ }, t.prototype.handleResult = function t(e) {
+ e ? this.emitter.emit("success", { action: this.action, text: this.selectedText, trigger: this.trigger, clearSelection: this.clearSelection.bind(this) }) : this.emitter.emit("error", { action: this.action, trigger: this.trigger, clearSelection: this.clearSelection.bind(this) });
+ }, t.prototype.clearSelection = function t() {
+ this.target && this.target.blur(), window.getSelection().removeAllRanges();
+ }, t.prototype.destroy = function t() {
+ this.removeFake();
+ }, c(t, [{ key: "action", set: function t() {
+ var e = arguments.length <= 0 || void 0 === arguments[0] ? "copy" : arguments[0];if (this._action = e, "copy" !== this._action && "cut" !== this._action) throw new Error('Invalid "action" value, use either "copy" or "cut"');
+ }, get: function t() {
+ return this._action;
+ } }, { key: "target", set: function t(e) {
+ if (void 0 !== e) {
+ if (!e || "object" !== ("undefined" == typeof e ? "undefined" : i(e)) || 1 !== e.nodeType) throw new Error('Invalid "target" value, use a valid Element');this._target = e;
+ }
+ }, get: function t() {
+ return this._target;
+ } }]), t;
+ }();t.exports = s;
+ });
+ }, { select: 6 }], 9: [function (e, n, o) {
+ !function (r, i) {
+ if ("function" == typeof t && t.amd) t(["module", "./clipboard-action", "tiny-emitter", "good-listener"], i);else if ("undefined" != typeof o) i(n, e("./clipboard-action"), e("tiny-emitter"), e("good-listener"));else {
+ var c = { exports: {} };i(c, r.clipboardAction, r.tinyEmitter, r.goodListener), r.clipboard = c.exports;
+ }
+ }(this, function (t, e, n, o) {
+ "use strict";
+ function r(t) {
+ return t && t.__esModule ? t : { "default": t };
+ }function i(t, e) {
+ if (!(t instanceof e)) throw new TypeError("Cannot call a class as a function");
+ }function c(t, e) {
+ if (!t) throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return !e || "object" != (typeof e === "undefined" ? "undefined" : _typeof(e)) && "function" != typeof e ? t : e;
+ }function s(t, e) {
+ if ("function" != typeof e && null !== e) throw new TypeError("Super expression must either be null or a function, not " + (typeof e === "undefined" ? "undefined" : _typeof(e)));t.prototype = Object.create(e && e.prototype, { constructor: { value: t, enumerable: !1, writable: !0, configurable: !0 } }), e && (Object.setPrototypeOf ? Object.setPrototypeOf(t, e) : _defaults(t, e));
+ }function a(t, e) {
+ var n = "data-clipboard-" + t;if (e.hasAttribute(n)) return e.getAttribute(n);
+ }var l = r(e),
+ u = r(n),
+ f = r(o),
+ d = function (t) {
+ function e(n, o) {
+ i(this, e);var r = c(this, t.call(this));return r.resolveOptions(o), r.listenClick(n), r;
+ }return s(e, t), e.prototype.resolveOptions = function t() {
+ var e = arguments.length <= 0 || void 0 === arguments[0] ? {} : arguments[0];this.action = "function" == typeof e.action ? e.action : this.defaultAction, this.target = "function" == typeof e.target ? e.target : this.defaultTarget, this.text = "function" == typeof e.text ? e.text : this.defaultText;
+ }, e.prototype.listenClick = function t(e) {
+ var n = this;this.listener = (0, f.default)(e, "click", function (t) {
+ return n.onClick(t);
+ });
+ }, e.prototype.onClick = function t(e) {
+ var n = e.delegateTarget || e.currentTarget;this.clipboardAction && (this.clipboardAction = null), this.clipboardAction = new l.default({ action: this.action(n), target: this.target(n), text: this.text(n), trigger: n, emitter: this });
+ }, e.prototype.defaultAction = function t(e) {
+ return a("action", e);
+ }, e.prototype.defaultTarget = function t(e) {
+ var n = a("target", e);return n ? document.querySelector(n) : void 0;
+ }, e.prototype.defaultText = function t(e) {
+ return a("text", e);
+ }, e.prototype.destroy = function t() {
+ this.listener.destroy(), this.clipboardAction && (this.clipboardAction.destroy(), this.clipboardAction = null);
+ }, e;
+ }(u.default);t.exports = d;
+ });
+ }, { "./clipboard-action": 8, "good-listener": 4, "tiny-emitter": 7 }] }, {}, [9])(9);
+});
\ No newline at end of file
diff --git a/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/lib/index.js b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/lib/index.js
new file mode 100644
index 0000000000000000000000000000000000000000..2e659c1909d20ece35a667b0c1d420afcf860f20
--- /dev/null
+++ b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/lib/index.js
@@ -0,0 +1,51 @@
+'use strict';
+
+document.addEventListener('DOMContentLoaded', function () {
+
+ var $grid = document.getElementById('grid');
+ var $columns = Array.prototype.slice.call(document.querySelectorAll('#grid > .column'), 0);
+ var $markup = document.querySelector('#markup code');
+ var $message = document.getElementById('message');
+ var $add = document.getElementById('add');
+ var $remove = document.getElementById('remove');
+ var showing = 5;
+
+ function showColumns() {
+ if (showing === 13) {
+ $message.style.display = 'block';
+ } else {
+ $message.style.display = 'none';
+ }
+
+ showing = Math.min(Math.max(parseInt(showing), 2), 12);
+
+ $columns.forEach(function ($el) {
+ $el.style.display = 'none';
+ });
+ $columns.slice(0, showing).forEach(function ($el) {
+ $el.style.display = 'block';
+ });
+
+ $markup.innerHTML = '<span class="nt"><div</span> <span class="na">class=</span><span class="s">"columns"</span><span class="nt">></span>';
+ $markup.insertAdjacentHTML('beforeend', '\n');
+
+ for (var i = 0; i < showing; i++) {
+ $markup.insertAdjacentHTML('beforeend', ' <span class="nt"><div</span> <span class="na">class=</span><span class="s">"column"</span><span class="nt">></span>');
+ $markup.insertAdjacentHTML('beforeend', i + 1);
+ $markup.insertAdjacentHTML('beforeend', '<span class="nt"></div></span>');
+ $markup.insertAdjacentHTML('beforeend', '\n');
+ }
+
+ $markup.insertAdjacentHTML('beforeend', '<span class="nt"></div></span>');
+ }
+
+ $add.addEventListener('click', function () {
+ showing++;
+ showColumns();
+ });
+
+ $remove.addEventListener('click', function () {
+ showing--;
+ showColumns();
+ });
+});
\ No newline at end of file
diff --git a/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/lib/main.js b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/lib/main.js
new file mode 100644
index 0000000000000000000000000000000000000000..99a897370fc1ce0fc44cc1ecd98a214bee5bf44e
--- /dev/null
+++ b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/lib/main.js
@@ -0,0 +1,178 @@
+'use strict';
+
+document.addEventListener('DOMContentLoaded', function () {
+
+ // Dropdowns
+
+ var $metalinks = getAll('#meta a');
+
+ if ($metalinks.length > 0) {
+ $metalinks.forEach(function ($el) {
+ $el.addEventListener('click', function (event) {
+ event.preventDefault();
+ var target = $el.getAttribute('href');
+ var $target = document.getElementById(target.substring(1));
+ $target.scrollIntoView(true);
+ // window.history.replaceState(null, document.title, `${window.location.origin}${window.location.pathname}${target}`);
+ return false;
+ });
+ });
+ }
+
+ // Dropdowns
+
+ var $dropdowns = getAll('.dropdown:not(.is-hoverable)');
+
+ if ($dropdowns.length > 0) {
+ $dropdowns.forEach(function ($el) {
+ $el.addEventListener('click', function (event) {
+ event.stopPropagation();
+ $el.classList.toggle('is-active');
+ });
+ });
+
+ document.addEventListener('click', function (event) {
+ closeDropdowns();
+ });
+ }
+
+ function closeDropdowns() {
+ $dropdowns.forEach(function ($el) {
+ $el.classList.remove('is-active');
+ });
+ }
+
+ // Toggles
+
+ var $burgers = getAll('.burger');
+
+ if ($burgers.length > 0) {
+ $burgers.forEach(function ($el) {
+ $el.addEventListener('click', function () {
+ var target = $el.dataset.target;
+ var $target = document.getElementById(target);
+ $el.classList.toggle('is-active');
+ $target.classList.toggle('is-active');
+ });
+ });
+ }
+
+ // Modals
+
+ var $html = document.documentElement;
+ var $modals = getAll('.modal');
+ var $modalButtons = getAll('.modal-button');
+ var $modalCloses = getAll('.modal-background, .modal-close, .modal-card-head .delete, .modal-card-foot .button');
+
+ if ($modalButtons.length > 0) {
+ $modalButtons.forEach(function ($el) {
+ $el.addEventListener('click', function () {
+ var target = $el.dataset.target;
+ var $target = document.getElementById(target);
+ $html.classList.add('is-clipped');
+ $target.classList.add('is-active');
+ });
+ });
+ }
+
+ if ($modalCloses.length > 0) {
+ $modalCloses.forEach(function ($el) {
+ $el.addEventListener('click', function () {
+ closeModals();
+ });
+ });
+ }
+
+ document.addEventListener('keydown', function (event) {
+ var e = event || window.event;
+ if (e.keyCode === 27) {
+ closeModals();
+ closeDropdowns();
+ }
+ });
+
+ function closeModals() {
+ $html.classList.remove('is-clipped');
+ $modals.forEach(function ($el) {
+ $el.classList.remove('is-active');
+ });
+ }
+
+ // Clipboard
+
+ var $highlights = getAll('.highlight');
+ var itemsProcessed = 0;
+
+ if ($highlights.length > 0) {
+ $highlights.forEach(function ($el) {
+ var copy = '<button class="copy">Copy</button>';
+ var expand = '<button class="expand">Expand</button>';
+ $el.insertAdjacentHTML('beforeend', copy);
+
+ if ($el.firstElementChild.scrollHeight > 480 && $el.firstElementChild.clientHeight <= 480) {
+ $el.insertAdjacentHTML('beforeend', expand);
+ }
+
+ itemsProcessed++;
+ if (itemsProcessed === $highlights.length) {
+ addHighlightControls();
+ }
+ });
+ }
+
+ function addHighlightControls() {
+ var $highlightButtons = getAll('.highlight .copy, .highlight .expand');
+
+ $highlightButtons.forEach(function ($el) {
+ $el.addEventListener('mouseenter', function () {
+ $el.parentNode.style.boxShadow = '0 0 0 1px #ed6c63';
+ });
+
+ $el.addEventListener('mouseleave', function () {
+ $el.parentNode.style.boxShadow = 'none';
+ });
+ });
+
+ var $highlightExpands = getAll('.highlight .expand');
+
+ $highlightExpands.forEach(function ($el) {
+ $el.addEventListener('click', function () {
+ $el.parentNode.firstElementChild.style.maxHeight = 'none';
+ });
+ });
+ }
+
+ new Clipboard('.copy', {
+ target: function target(trigger) {
+ return trigger.previousSibling;
+ }
+ });
+
+ // Functions
+
+ function getAll(selector) {
+ return Array.prototype.slice.call(document.querySelectorAll(selector), 0);
+ }
+
+ var latestKnownScrollY = 0;
+ var ticking = false;
+
+ function scrollUpdate() {
+ ticking = false;
+ // do stuff
+ }
+
+ function onScroll() {
+ latestKnownScrollY = window.scrollY;
+ scrollRequestTick();
+ }
+
+ function scrollRequestTick() {
+ if (!ticking) {
+ requestAnimationFrame(scrollUpdate);
+ }
+ ticking = true;
+ }
+
+ window.addEventListener('scroll', onScroll, false);
+});
\ No newline at end of file
diff --git a/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/thank-you/index.html b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/thank-you/index.html
new file mode 100644
index 0000000000000000000000000000000000000000..2d724635cbaceea8b7586f1c6e4f360dfa9c55d8
--- /dev/null
+++ b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/thank-you/index.html
@@ -0,0 +1,248 @@
+<!DOCTYPE html>
+<html lang="en" class="route-index">
+ <head>
+ <meta charset="utf-8">
+ <meta http-equiv="X-UA-Compatible" content="IE=edge">
+ <meta name="viewport" content="width=device-width, initial-scale=1">
+ <meta name="description" content="Bulma v0.5.0 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <title>Thank you | Bulma v0.5.0: a modern CSS framework based on Flexbox</title>
+
+ <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.6.3/css/font-awesome.min.css">
+ <link rel="stylesheet" href="http://bulma.io/versions/0.5.0/css/bulma-docs.css">
+
+ <link rel="canonical" href="http://bulma.io/versions/0.5.0/thank-you/">
+ <link rel="alternate" type="application/rss+xml" title="Bulma v0.5.0: a modern CSS framework based on Flexbox" href="http://bulma.io/versions/0.5.0/feed.xml">
+
+ <meta property="og:url" content="http://bulma.io/versions/0.5.0">
+ <meta property="og:type" content="website">
+ <meta property="og:title" content="Bulma v0.5.0: a modern CSS framework based on Flexbox">
+ <meta property="og:image" content="http://bulma.io/versions/0.5.0/images/bulma-banner.png">
+ <meta property="og:image:type" content="image/png">
+ <meta property="og:image:width" content="1200">
+ <meta property="og:image:height" content="630">
+ <meta property="og:description" content="Bulma v0.5.0 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <meta name="twitter:card" content="summary_large_image">
+ <meta name="twitter:site" content="@jgthms">
+ <meta name="twitter:creator" content="@jgthms">
+ <meta name="twitter:title" content="Bulma v0.5.0: a modern CSS framework based on Flexbox">
+ <meta name="twitter:image" content="http://bulma.io/versions/0.5.0/images/bulma-banner.png">
+ <meta name="twitter:description" content="Bulma v0.5.0 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <link rel="apple-touch-icon" sizes="180x180" href="http://bulma.io/versions/0.5.0/favicons/apple-touch-icon.png?v=201701041855">
+ <link rel="icon" type="image/png" href="http://bulma.io/versions/0.5.0/favicons/favicon-32x32.png?v=201701041855" sizes="32x32">
+ <link rel="icon" type="image/png" href="http://bulma.io/versions/0.5.0/favicons/favicon-16x16.png?v=201701041855" sizes="16x16">
+ <link rel="manifest" href="http://bulma.io/versions/0.5.0/favicons/manifest.json?v=201701041855">
+ <link rel="mask-icon" href="http://bulma.io/versions/0.5.0/favicons/safari-pinned-tab.svg?v=201701041855" color="#00d1b2">
+ <link rel="shortcut icon" href="http://bulma.io/versions/0.5.0/favicons/favicon.ico?v=201701041855">
+ <meta name="msapplication-config" content="http://bulma.io/versions/0.5.0/favicons/browserconfig.xml?v=201701041855">
+ <meta name="theme-color" content="#00d1b2">
+</head>
+
+ <body class="layout-default">
+
+ <div class="notification is-info" style="border-radius: 0; margin-bottom: 0;">
+ <p>
+ You are viewing the deprecated <strong>0.5.0</strong> version of the website.
+ <a href="/">Click here to view the latest version</a>
+ </p>
+ </div>
+
+
+ <section class="hero is-fullheight is-success has-text-centered">
+ <div class="hero-body">
+ <div class="container">
+ <h1 class="title">
+ Thank you!
+ </h1>
+ <h2 class="subtitle">
+ Go back to the <a href="http://bulma.io/versions/0.5.0">homepage</a>
+ </h2>
+ </div>
+ </div>
+</section>
+
+
+<script src="//m.servedby-buysellads.com/monetization.js" type="text/javascript"></script>
+
+<section class="hero is-info bsa">
+ <div class="container">
+ <div class="columns is-vcentered">
+ <div class="column is-4">
+ <p class="title">Bulma <strong>Partners</strong></p>
+ <p class="subtitle">Check out their products!</p>
+ </div>
+
+ <div class="column is-8">
+ <div class="bsa-cpc"></div>
+ </div>
+ </div>
+ </div>
+</section>
+
+<script>
+ (function(){
+ if(typeof _bsa !== 'undefined' && _bsa) {
+ _bsa.init('default', 'CVAIKK3E', 'placement:bulmaio', {
+ target: '.bsa-cpc',
+ align: 'horizontal',
+ disable_css: 'true'
+ });
+ }
+ })();
+</script>
+
+
+<section id="newsletter" class="hero is-primary">
+ <div class="hero-body">
+ <div class="container">
+ <!-- Begin MailChimp Signup Form -->
+ <div id="mc_embed_signup" class="columns is-vcentered">
+ <div class="column is-one-third is-left">
+ <p class="title">Bulma <strong>Newsletter</strong></p>
+ <p class="subtitle">Get notified when v1 is ready!</p>
+ </div>
+
+ <div class="column">
+ <form action="https://bbxdesign.us3.list-manage.com/subscribe/post?u=b43b93fe633f0560b2a72a69c&id=52585e8803" method="post" id="mc-embedded-subscribe-form" name="mc-embedded-subscribe-form" class="validate" target="_blank" novalidate>
+ <div id="mc_embed_signup_scroll">
+ <div class="field is-grouped">
+ <div class="control has-icons-left is-expanded">
+ <input type="email" value="" name="EMAIL" class="input is-flat required email" id="mce-EMAIL" placeholder="email address" required>
+ <span class="icon is-small is-left">
+ <i class="fa fa-envelope"></i>
+ </span>
+ </div>
+ <div class="control">
+ <input type="submit" value="Subscribe" name="subscribe" id="mc-embedded-subscribe" class="button is-white is-outlined">
+ </div>
+ </div>
+ <div id="mce-responses">
+ <div class="notification is-danger response" id="mce-error-response" style="display:none"></div>
+ <div class="notification is-success response" id="mce-success-response" style="display:none"></div>
+ </div>
+ <!-- real people should not fill this in and expect good things - do not remove this or risk form bot signups-->
+ <div style="position: absolute; left: -5000px;" aria-hidden="true">
+ <input type="text" name="b_b43b93fe633f0560b2a72a69c_52585e8803" tabindex="-1" value="">
+ </div>
+ </div>
+ </form>
+ </div>
+ </div>
+ <!--End mc_embed_signup-->
+ </div>
+ </div>
+</section>
+
+<footer class="footer">
+ <div class="container">
+ <div class="columns">
+ <div class="column is-3">
+ <div id="about" class="content">
+ <strong xmlns:dct="http://purl.org/dc/terms/" href="http://purl.org/dc/dcmitype/Text" property="dct:title" rel="dct:type">Bulma</strong> by <a xmlns:cc="http://creativecommons.org/ns#" href="http://jgthms.com" property="cc:attributionName" rel="cc:attributionURL">Jeremy Thomas</a>.
+
+ <div class="twitter-container">
+ <a href="https://twitter.com/jgthms" class="twitter-follow-button" data-show-count="true" data-lang="en" data-size="large">@jgthms</a>
+ </div>
+
+ </div>
+ </div>
+ <div class="column is-5">
+ <div id="share" class="content">
+ <div>
+ <strong>Support</strong> and share the love!
+ </div>
+
+ <div id="social">
+ <iframe class="github-btn" src="https://ghbtns.com/github-btn.html?user=jgthms&repo=bulma&type=star&count=true&size=large" allowtransparency="true" frameborder="0" scrolling="0" width="160px" height="30px"></iframe>
+
+ <a href="https://twitter.com/share" class="twitter-share-button" data-text="Bulma v0.5.0: a modern CSS framework based on Flexbox" data-url="http://bulma.io/versions/0.5.0" data-count="horizontal" data-via="jgthms" data-related="jgthms:Creator of Bulma" data-size="large">Tweet</a>
+
+ <form class="paypal-form" action="https://www.paypal.com/cgi-bin/webscr" method="post" target="_top">
+ <input type="hidden" name="cmd" value="_s-xclick">
+ <input type="hidden" name="hosted_button_id" value="8WMKYSRFN6A78">
+ <input type="image" src="http://bulma.io/versions/0.5.0/images/paypal-donate.png" border="0" name="submit" alt="PayPal – The safer, easier way to pay online." height="30">
+ <img alt="" border="0" src="https://www.paypalobjects.com/en_GB/i/scr/pixel.gif" width="1" height="1">
+ </form>
+
+ <div class="fb-like" data-href="https://www.facebook.com/bulmaio" data-layout="button" data-action="like" data-size="large" data-show-faces="false" data-share="true"></div>
+ </div>
+
+ </div>
+ </div>
+ <div class="column is-4">
+ <div id="sister">
+ <p>
+ More <strong>helpful</strong> tools:
+ </p>
+ <ul>
+ <li>
+ <a href="http://cssreference.io">
+ <img src="http://bulma.io/versions/0.5.0/images/css-reference-logo.png" alt="CSS Reference logo">
+ </a>
+ </li>
+ <li>
+ <a href="http://htmlreference.io">
+ <img src="http://bulma.io/versions/0.5.0/images/html-reference-logo.png" alt="HTML Reference logo">
+ </a>
+ </li>
+ </ul>
+ </div>
+ </div>
+ </div>
+
+ <p id="tsp">
+ <small>
+ Source code licensed <a href="http://opensource.org/licenses/mit-license.php">MIT</a>.
+ <br>
+ Website content licensed <a rel="license" href="http://creativecommons.org/licenses/by-nc-sa/4.0/">CC BY-NC-SA 4.0</a>.
+ </small>
+ </p>
+ </div>
+</footer>
+
+<script src="http://bulma.io/versions/0.5.0/vendor/clipboard-1.7.1.min.js"></script>
+<script src="http://bulma.io/versions/0.5.0/lib/main.js"></script>
+
+
+ <script type="text/javascript" src="http://bulma.io/versions/0.5.0/lib/index.js"></script>
+
+
+<div id="fb-root"></div>
+
+<script async defer type="text/javascript">(function(d, s, id) {
+ var js, fjs = d.getElementsByTagName(s)[0];
+ if (d.getElementById(id)) return;
+ js = d.createElement(s); js.id = id;
+ js.async = true;
+ js.defer = true;
+ js.src = "//connect.facebook.net/en_US/sdk.js#xfbml=1&version=v2.8&appId=310296819307942";
+ fjs.parentNode.insertBefore(js, fjs);
+}(document, 'script', 'facebook-jssdk'));</script>
+
+<script async defer id="twitter-wjs" src="https://platform.twitter.com/widgets.js"></script>
+<script async defer type="text/javascript" src="https://s3.amazonaws.com/downloads.mailchimp.com/js/mc-validate.js"></script>
+
+<script async defer type="text/javascript">
+ (function() {
+ window.fnames = new Array();
+ window.ftypes = new Array();
+ fnames[0]='EMAIL';
+ ftypes[0]='email';
+ }());
+ // var $mcj = window.jQuery.noConflict(true);
+</script>
+
+<script async defer type="text/javascript">
+ (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
+ (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
+ m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
+ })(window,document,'script','https://www.google-analytics.com/analytics.js','ga');
+
+ ga('create', 'UA-82634666-2', 'auto');
+ ga('send', 'pageview');
+</script>
+
+ </body>
+</html>
diff --git a/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/tiles/index.html b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/tiles/index.html
new file mode 100644
index 0000000000000000000000000000000000000000..d104947277df557e42286aa7f046ad26adc178c2
--- /dev/null
+++ b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/tiles/index.html
@@ -0,0 +1,993 @@
+<!DOCTYPE html>
+<html lang="en" class="route-tiles">
+ <head>
+ <meta charset="utf-8">
+ <meta http-equiv="X-UA-Compatible" content="IE=edge">
+ <meta name="viewport" content="width=device-width, initial-scale=1">
+ <meta name="description" content="Bulma v0.5.0 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <title>Bulma v0.5.0: a modern CSS framework based on Flexbox</title>
+
+ <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.6.3/css/font-awesome.min.css">
+ <link rel="stylesheet" href="http://bulma.io/versions/0.5.0/css/bulma-docs.css">
+
+ <link rel="canonical" href="http://bulma.io/versions/0.5.0/tiles/">
+ <link rel="alternate" type="application/rss+xml" title="Bulma v0.5.0: a modern CSS framework based on Flexbox" href="http://bulma.io/versions/0.5.0/feed.xml">
+
+ <meta property="og:url" content="http://bulma.io/versions/0.5.0">
+ <meta property="og:type" content="website">
+ <meta property="og:title" content="Bulma v0.5.0: a modern CSS framework based on Flexbox">
+ <meta property="og:image" content="http://bulma.io/versions/0.5.0/images/bulma-banner.png">
+ <meta property="og:image:type" content="image/png">
+ <meta property="og:image:width" content="1200">
+ <meta property="og:image:height" content="630">
+ <meta property="og:description" content="Bulma v0.5.0 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <meta name="twitter:card" content="summary_large_image">
+ <meta name="twitter:site" content="@jgthms">
+ <meta name="twitter:creator" content="@jgthms">
+ <meta name="twitter:title" content="Bulma v0.5.0: a modern CSS framework based on Flexbox">
+ <meta name="twitter:image" content="http://bulma.io/versions/0.5.0/images/bulma-banner.png">
+ <meta name="twitter:description" content="Bulma v0.5.0 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <link rel="apple-touch-icon" sizes="180x180" href="http://bulma.io/versions/0.5.0/favicons/apple-touch-icon.png?v=201701041855">
+ <link rel="icon" type="image/png" href="http://bulma.io/versions/0.5.0/favicons/favicon-32x32.png?v=201701041855" sizes="32x32">
+ <link rel="icon" type="image/png" href="http://bulma.io/versions/0.5.0/favicons/favicon-16x16.png?v=201701041855" sizes="16x16">
+ <link rel="manifest" href="http://bulma.io/versions/0.5.0/favicons/manifest.json?v=201701041855">
+ <link rel="mask-icon" href="http://bulma.io/versions/0.5.0/favicons/safari-pinned-tab.svg?v=201701041855" color="#00d1b2">
+ <link rel="shortcut icon" href="http://bulma.io/versions/0.5.0/favicons/favicon.ico?v=201701041855">
+ <meta name="msapplication-config" content="http://bulma.io/versions/0.5.0/favicons/browserconfig.xml?v=201701041855">
+ <meta name="theme-color" content="#00d1b2">
+</head>
+
+ <body class="layout-default">
+
+ <div class="notification is-info" style="border-radius: 0; margin-bottom: 0;">
+ <p>
+ You are viewing the deprecated <strong>0.5.0</strong> version of the website.
+ <a href="/">Click here to view the latest version</a>
+ </p>
+ </div>
+
+
+ <section class="section">
+ <div class="container">
+ <h1 class="title">Tiles</h1>
+ <h2 class="subtitle">A <strong>single tile</strong> element to build 2-dimensional Metro-like, Pinterest-like, or whatever-you-like grids</h2>
+
+ <div class="content">
+ <p>To build intricate 2-dimensional, you only need a <strong>single element</strong>: the <code>tile</code>:</p>
+ </div>
+
+<figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile"</span><span class="nt">></span>
+ <span class="c"><!-- The magical tile element! --></span>
+<span class="nt"></div></span></code></pre></figure>
+
+ <div class="content">
+ <p>The <code>tile</code> element has <strong>16 modifiers</strong>:</p>
+ <ul>
+ <li>
+ <strong>3 contextual</strong> modifiers
+ <ul>
+ <li><code>is-ancestor</code></li>
+ <li><code>is-parent</code></li>
+ <li><code>is-child</code></li>
+ </ul>
+ </li>
+ <li>
+ <strong>1 directional</strong> modifier
+ <ul>
+ <li><code>is-vertical</code></li>
+ </ul>
+ </li>
+ <li>
+ <strong>12 horizontal size</strong> modifiers
+ <ul>
+ <li>from <code>is-1</code></li>
+ <li>to <code>is-12</code></li>
+ </ul>
+ </li>
+ </ul>
+ </div>
+
+ <hr>
+
+ <h3 class="title">How it works: Nesting</h3>
+ <div class="content">
+ <p>Everything is a tile! To create a grid of tiles, you only need to <strong>nest</strong> <code>tile</code> elements.</p>
+ </div>
+
+ <div class="columns">
+ <div class="column is-one-third">
+ <p>Start with an <strong>ancestor</strong> tile that will wrap all other tiles:</p>
+ </div>
+ <div class="column is-two-thirds">
+<figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile is-ancestor"</span><span class="nt">></span>
+ <span class="c"><!-- All other tile elemnts --></span>
+<span class="nt"></div></span></code></pre></figure>
+ </div>
+ </div>
+
+ <div class="columns">
+ <div class="column is-one-third">
+ <p>Add tile elements that will distribute themselves <strong>horizontally</strong>:</p>
+ </div>
+ <div class="column is-two-thirds">
+<figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile is-ancestor"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile"</span><span class="nt">></span>
+ <span class="c"><!-- Add content or other tiles --></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile"</span><span class="nt">></span>
+ <span class="c"><!-- Add content or other tiles --></span>
+ <span class="nt"></div></span>
+<span class="nt"></div></span></code></pre></figure>
+ </div>
+ </div>
+
+ <div class="columns">
+ <div class="column is-one-third">
+ <p>
+ You can <strong>resize</strong> any tile according to a <strong>12 column</strong> grid.
+ <br>
+ For example, <code>is-4</code> will take up 2/3 of the horizontal space:
+ </p>
+ </div>
+ <div class="column is-two-thirds">
+<figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile is-ancestor"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile is-4"</span><span class="nt">></span>
+ <span class="c"><!-- 1/3 --></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile"</span><span class="nt">></span>
+ <span class="c"><!-- This tile will take the rest: 2/3 --></span>
+ <span class="nt"></div></span>
+<span class="nt"></div></span></code></pre></figure>
+ </div>
+ </div>
+
+ <div class="columns">
+ <div class="column is-one-third">
+ <p>If you want to stack tiles <strong>vertically</strong>, add <code>is-vertical</code> on the parent tile:</p>
+ </div>
+ <div class="column is-two-thirds">
+<figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile is-ancestor"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile is-4 is-vertical"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile"</span><span class="nt">></span>
+ <span class="c"><!-- Top tile --></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile"</span><span class="nt">></span>
+ <span class="c"><!-- Bottom tile --></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile"</span><span class="nt">></span>
+ <span class="c"><!-- This tile will take up the whole vertical space --></span>
+ <span class="nt"></div></span>
+<span class="nt"></div></span></code></pre></figure>
+ </div>
+ </div>
+
+ <div class="columns">
+ <div class="column is-one-third">
+ <div class="content">
+ <p>As soon as you want to add <strong>content</strong> to a tile, just:</p>
+ <ul>
+ <li>add <em>any</em> class you want, like <code>box</code></li>
+ <li>add the <code>is-child</code> modifier on the tile</li>
+ <li>add the <code>is-parent</code> modifier on the <em>parent</em> tile</li>
+ </ul>
+ </div>
+ </div>
+ <div class="column is-two-thirds">
+<figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile is-ancestor"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile is-4 is-vertical is-parent"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile is-child box"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"title"</span><span class="nt">></span>One<span class="nt"></p></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile is-child box"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"title"</span><span class="nt">></span>Two<span class="nt"></p></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile is-parent"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile is-child box"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"title"</span><span class="nt">></span>Three<span class="nt"></p></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+<span class="nt"></div></span></code></pre></figure>
+ </div>
+ </div>
+
+ <div class="tile is-ancestor">
+ <div class="tile is-4 is-vertical is-parent">
+ <div class="tile is-child box">
+ <p class="title">One</p>
+ <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin ornare magna eros, eu pellentesque tortor vestibulum ut. Maecenas non massa sem. Etiam finibus odio quis feugiat facilisis.</p>
+ </div>
+ <div class="tile is-child box">
+ <p class="title">Two</p>
+ <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin ornare magna eros, eu pellentesque tortor vestibulum ut. Maecenas non massa sem. Etiam finibus odio quis feugiat facilisis.</p>
+ </div>
+ </div>
+ <div class="tile is-parent">
+ <div class="tile is-child box">
+ <p class="title">Three</p>
+ <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Etiam semper diam at erat pulvinar, at pulvinar felis blandit. Vestibulum volutpat tellus diam, consequat gravida libero rhoncus ut. Morbi maximus, leo sit amet vehicula eleifend, nunc dui porta orci, quis semper odio felis ut quam.</p>
+ <p>Suspendisse varius ligula in molestie lacinia. Maecenas varius eget ligula a sagittis. Pellentesque interdum, nisl nec interdum maximus, augue diam porttitor lorem, et sollicitudin felis neque sit amet erat. Maecenas imperdiet felis nisi, fringilla luctus felis hendrerit sit amet. Aenean vitae gravida diam, finibus dignissim turpis. Sed eget varius ligula, at volutpat tortor.</p>
+ <p>Integer sollicitudin, tortor a mattis commodo, velit urna rhoncus erat, vitae congue lectus dolor consequat libero. Donec leo ligula, maximus et pellentesque sed, gravida a metus. Cras ullamcorper a nunc ac porta. Aliquam ut aliquet lacus, quis faucibus libero. Quisque non semper leo.</p>
+ </div>
+ </div>
+ </div>
+
+<figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile is-ancestor"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile is-4 is-vertical is-parent"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile is-child box"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"title"</span><span class="nt">></span>One<span class="nt"></p></span>
+ <span class="nt"><p></span>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin ornare magna eros, eu pellentesque tortor vestibulum ut. Maecenas non massa sem. Etiam finibus odio quis feugiat facilisis.<span class="nt"></p></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile is-child box"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"title"</span><span class="nt">></span>Two<span class="nt"></p></span>
+ <span class="nt"><p></span>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin ornare magna eros, eu pellentesque tortor vestibulum ut. Maecenas non massa sem. Etiam finibus odio quis feugiat facilisis.<span class="nt"></p></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile is-parent"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile is-child box"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"title"</span><span class="nt">></span>Three<span class="nt"></p></span>
+ <span class="nt"><p></span>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Etiam semper diam at erat pulvinar, at pulvinar felis blandit. Vestibulum volutpat tellus diam, consequat gravida libero rhoncus ut. Morbi maximus, leo sit amet vehicula eleifend, nunc dui porta orci, quis semper odio felis ut quam.<span class="nt"></p></span>
+ <span class="nt"><p></span>Suspendisse varius ligula in molestie lacinia. Maecenas varius eget ligula a sagittis. Pellentesque interdum, nisl nec interdum maximus, augue diam porttitor lorem, et sollicitudin felis neque sit amet erat. Maecenas imperdiet felis nisi, fringilla luctus felis hendrerit sit amet. Aenean vitae gravida diam, finibus dignissim turpis. Sed eget varius ligula, at volutpat tortor.<span class="nt"></p></span>
+ <span class="nt"><p></span>Integer sollicitudin, tortor a mattis commodo, velit urna rhoncus erat, vitae congue lectus dolor consequat libero. Donec leo ligula, maximus et pellentesque sed, gravida a metus. Cras ullamcorper a nunc ac porta. Aliquam ut aliquet lacus, quis faucibus libero. Quisque non semper leo.<span class="nt"></p></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+<span class="nt"></div></span></code></pre></figure>
+
+ <hr>
+
+ <h3 class="title">Nesting requirements</h3>
+
+ <article class="message is-danger">
+ <div class="message-header">
+ 3 levels deep at least...
+ </div>
+ <div class="message-body">
+ <div class="content">
+ <p>You need at least <strong>3 levels</strong> of hierarchy:</p>
+<figure class="highlight"><pre><code class="language-markdown" data-lang="markdown">tile is-ancestor
+|
+└───tile is-parent
+ |
+ └───tile is-child</code></pre></figure>
+ </div>
+ </div>
+ </article>
+
+ <article class="message is-success">
+ <div class="message-header">
+ ...but more levels if you want!
+ </div>
+ <div class="message-body">
+ <div class="content">
+ <p>You can however nest tiles more deeply than that, and mix it up!</p>
+<figure class="highlight"><pre><code class="language-markdown" data-lang="markdown">tile is-ancestor
+|
+├───tile is-vertical is-8
+| |
+| ├───tile
+| | |
+| | ├───tile is-parent is-vertical
+| | | ├───tile is-child
+| | | └───tile is-child
+| | |
+| | └───tile is-parent
+| | └───tile is-child
+| |
+| └───tile is-parent
+| └───tile is-child
+|
+└───tile is-parent
+ └───tile is-child</code></pre></figure>
+ </div>
+ </div>
+ </article>
+
+ <div class="tile is-ancestor">
+ <div class="tile is-vertical is-8">
+ <div class="tile">
+ <div class="tile is-parent is-vertical">
+ <article class="tile is-child box">
+ <p class="title">Vertical tiles</p>
+ <p class="subtitle">Top box</p>
+ </article>
+ <article class="tile is-child box">
+ <p class="title">Vertical tiles</p>
+ <p class="subtitle">Bottom box</p>
+ </article>
+ </div>
+ <div class="tile is-parent">
+ <article class="tile is-child box">
+ <p class="title">Middle box</p>
+ <p class="subtitle">With an image</p>
+ <figure class="image is-4by3">
+ <img src="http://bulma.io/versions/0.5.0/images/placeholders/640x480.png">
+ </figure>
+ </article>
+ </div>
+ </div>
+ <div class="tile is-parent">
+ <article class="tile is-child box">
+ <p class="title">Wide column</p>
+ <p class="subtitle">Aligned with the right column</p>
+ <div class="content">
+ <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin ornare magna eros, eu pellentesque tortor vestibulum ut. Maecenas non massa sem. Etiam finibus odio quis feugiat facilisis.</p>
+ </div>
+ </article>
+ </div>
+ </div>
+ <div class="tile is-parent">
+ <article class="tile is-child box">
+ <div class="content">
+ <p class="title">Tall column</p>
+ <p class="subtitle">With even more content</p>
+ <div class="content">
+ <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Etiam semper diam at erat pulvinar, at pulvinar felis blandit. Vestibulum volutpat tellus diam, consequat gravida libero rhoncus ut. Morbi maximus, leo sit amet vehicula eleifend, nunc dui porta orci, quis semper odio felis ut quam.</p>
+ <p>Suspendisse varius ligula in molestie lacinia. Maecenas varius eget ligula a sagittis. Pellentesque interdum, nisl nec interdum maximus, augue diam porttitor lorem, et sollicitudin felis neque sit amet erat. Maecenas imperdiet felis nisi, fringilla luctus felis hendrerit sit amet. Aenean vitae gravida diam, finibus dignissim turpis. Sed eget varius ligula, at volutpat tortor.</p>
+ <p>Integer sollicitudin, tortor a mattis commodo, velit urna rhoncus erat, vitae congue lectus dolor consequat libero. Donec leo ligula, maximus et pellentesque sed, gravida a metus. Cras ullamcorper a nunc ac porta. Aliquam ut aliquet lacus, quis faucibus libero. Quisque non semper leo.</p>
+ </div>
+ </div>
+ </article>
+ </div>
+ </div>
+
+<figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile is-ancestor"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile is-vertical is-8"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile is-parent is-vertical"</span><span class="nt">></span>
+ <span class="nt"><article</span> <span class="na">class=</span><span class="s">"tile is-child box"</span><span class="nt">></span>
+ <span class="c"><!-- Put any content you want --></span>
+ <span class="nt"></article></span>
+ <span class="nt"><article</span> <span class="na">class=</span><span class="s">"tile is-child box"</span><span class="nt">></span>
+ <span class="c"><!-- Put any content you want --></span>
+ <span class="nt"></article></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile is-parent"</span><span class="nt">></span>
+ <span class="nt"><article</span> <span class="na">class=</span><span class="s">"tile is-child box"</span><span class="nt">></span>
+ <span class="c"><!-- Put any content you want --></span>
+ <span class="nt"></article></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile is-parent"</span><span class="nt">></span>
+ <span class="nt"><article</span> <span class="na">class=</span><span class="s">"tile is-child box"</span><span class="nt">></span>
+ <span class="c"><!-- Put any content you want --></span>
+ <span class="nt"></article></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile is-parent"</span><span class="nt">></span>
+ <span class="nt"><article</span> <span class="na">class=</span><span class="s">"tile is-child box"</span><span class="nt">></span>
+ <span class="c"><!-- Put any content you want --></span>
+ <span class="nt"></article></span>
+ <span class="nt"></div></span>
+<span class="nt"></div></span></code></pre></figure>
+
+ <hr>
+
+ <h3 class="title">3 columns</h3>
+
+ <div class="tile is-ancestor">
+ <div class="tile is-parent">
+ <article class="tile is-child box">
+ <p class="title">Hello World</p>
+ <p class="subtitle">What is up?</p>
+ </article>
+ </div>
+ <div class="tile is-parent">
+ <article class="tile is-child box">
+ <p class="title">Foo</p>
+ <p class="subtitle">Bar</p>
+ </article>
+ </div>
+ <div class="tile is-parent">
+ <article class="tile is-child box">
+ <p class="title">Third column</p>
+ <p class="subtitle">With some content</p>
+ <div class="content">
+ <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin ornare magna eros, eu pellentesque tortor vestibulum ut. Maecenas non massa sem. Etiam finibus odio quis feugiat facilisis.</p>
+ </div>
+ </article>
+ </div>
+ </div>
+ <div class="tile is-ancestor">
+ <div class="tile is-vertical is-8">
+ <div class="tile">
+ <div class="tile is-parent is-vertical">
+ <article class="tile is-child box">
+ <p class="title">Vertical tiles</p>
+ <p class="subtitle">Top box</p>
+ </article>
+ <article class="tile is-child box">
+ <p class="title">Vertical tiles</p>
+ <p class="subtitle">Bottom box</p>
+ </article>
+ </div>
+ <div class="tile is-parent">
+ <article class="tile is-child box">
+ <p class="title">Middle box</p>
+ <p class="subtitle">With an image</p>
+ <figure class="image is-4by3">
+ <img src="http://bulma.io/versions/0.5.0/images/placeholders/640x480.png">
+ </figure>
+ </article>
+ </div>
+ </div>
+ <div class="tile is-parent">
+ <article class="tile is-child box">
+ <p class="title">Wide column</p>
+ <p class="subtitle">Aligned with the right column</p>
+ <div class="content">
+ <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin ornare magna eros, eu pellentesque tortor vestibulum ut. Maecenas non massa sem. Etiam finibus odio quis feugiat facilisis.</p>
+ </div>
+ </article>
+ </div>
+ </div>
+ <div class="tile is-parent">
+ <article class="tile is-child box">
+ <div class="content">
+ <p class="title">Tall column</p>
+ <p class="subtitle">With even more content</p>
+ <div class="content">
+ <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Etiam semper diam at erat pulvinar, at pulvinar felis blandit. Vestibulum volutpat tellus diam, consequat gravida libero rhoncus ut. Morbi maximus, leo sit amet vehicula eleifend, nunc dui porta orci, quis semper odio felis ut quam.</p>
+ <p>Suspendisse varius ligula in molestie lacinia. Maecenas varius eget ligula a sagittis. Pellentesque interdum, nisl nec interdum maximus, augue diam porttitor lorem, et sollicitudin felis neque sit amet erat. Maecenas imperdiet felis nisi, fringilla luctus felis hendrerit sit amet. Aenean vitae gravida diam, finibus dignissim turpis. Sed eget varius ligula, at volutpat tortor.</p>
+ <p>Integer sollicitudin, tortor a mattis commodo, velit urna rhoncus erat, vitae congue lectus dolor consequat libero. Donec leo ligula, maximus et pellentesque sed, gravida a metus. Cras ullamcorper a nunc ac porta. Aliquam ut aliquet lacus, quis faucibus libero. Quisque non semper leo.</p>
+ </div>
+ </div>
+ </article>
+ </div>
+ </div>
+ <div class="tile is-ancestor">
+ <div class="tile is-parent">
+ <article class="tile is-child box">
+ <p class="title">Side column</p>
+ <p class="subtitle">With some content</p>
+ <div class="content">
+ <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin ornare magna eros, eu pellentesque tortor vestibulum ut. Maecenas non massa sem. Etiam finibus odio quis feugiat facilisis.</p>
+ </div>
+ </article>
+ </div>
+ <div class="tile is-parent is-8">
+ <article class="tile is-child box">
+ <p class="title">Main column</p>
+ <p class="subtitle">With some content</p>
+ <div class="content">
+ <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin ornare magna eros, eu pellentesque tortor vestibulum ut. Maecenas non massa sem. Etiam finibus odio quis feugiat facilisis.</p>
+ </div>
+ </article>
+ </div>
+ </div>
+
+<figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile is-ancestor"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile is-parent"</span><span class="nt">></span>
+ <span class="nt"><article</span> <span class="na">class=</span><span class="s">"tile is-child box"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"title"</span><span class="nt">></span>Hello World<span class="nt"></p></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"subtitle"</span><span class="nt">></span>What is up?<span class="nt"></p></span>
+ <span class="nt"></article></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile is-parent"</span><span class="nt">></span>
+ <span class="nt"><article</span> <span class="na">class=</span><span class="s">"tile is-child box"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"title"</span><span class="nt">></span>Foo<span class="nt"></p></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"subtitle"</span><span class="nt">></span>Bar<span class="nt"></p></span>
+ <span class="nt"></article></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile is-parent"</span><span class="nt">></span>
+ <span class="nt"><article</span> <span class="na">class=</span><span class="s">"tile is-child box"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"title"</span><span class="nt">></span>Third column<span class="nt"></p></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"subtitle"</span><span class="nt">></span>With some content<span class="nt"></p></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"content"</span><span class="nt">></span>
+ <span class="nt"><p></span>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin ornare magna eros, eu pellentesque tortor vestibulum ut. Maecenas non massa sem. Etiam finibus odio quis feugiat facilisis.<span class="nt"></p></span>
+ <span class="nt"></div></span>
+ <span class="nt"></article></span>
+ <span class="nt"></div></span>
+<span class="nt"></div></span>
+
+<span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile is-ancestor"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile is-vertical is-8"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile is-parent is-vertical"</span><span class="nt">></span>
+ <span class="nt"><article</span> <span class="na">class=</span><span class="s">"tile is-child box"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"title"</span><span class="nt">></span>Vertical tiles<span class="nt"></p></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"subtitle"</span><span class="nt">></span>Top box<span class="nt"></p></span>
+ <span class="nt"></article></span>
+ <span class="nt"><article</span> <span class="na">class=</span><span class="s">"tile is-child box"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"title"</span><span class="nt">></span>Vertical tiles<span class="nt"></p></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"subtitle"</span><span class="nt">></span>Bottom box<span class="nt"></p></span>
+ <span class="nt"></article></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile is-parent"</span><span class="nt">></span>
+ <span class="nt"><article</span> <span class="na">class=</span><span class="s">"tile is-child box"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"title"</span><span class="nt">></span>Middle box<span class="nt"></p></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"subtitle"</span><span class="nt">></span>With an image<span class="nt"></p></span>
+ <span class="nt"><figure</span> <span class="na">class=</span><span class="s">"image is-4by3"</span><span class="nt">></span>
+ <span class="nt"><img</span> <span class="na">src=</span><span class="s">"http://bulma.io/versions/0.5.0/images/placeholders/640x480.png"</span><span class="nt">></span>
+ <span class="nt"></figure></span>
+ <span class="nt"></article></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile is-parent"</span><span class="nt">></span>
+ <span class="nt"><article</span> <span class="na">class=</span><span class="s">"tile is-child box"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"title"</span><span class="nt">></span>Wide column<span class="nt"></p></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"subtitle"</span><span class="nt">></span>Aligned with the right column<span class="nt"></p></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"content"</span><span class="nt">></span>
+ <span class="nt"><p></span>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin ornare magna eros, eu pellentesque tortor vestibulum ut. Maecenas non massa sem. Etiam finibus odio quis feugiat facilisis.<span class="nt"></p></span>
+ <span class="nt"></div></span>
+ <span class="nt"></article></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile is-parent"</span><span class="nt">></span>
+ <span class="nt"><article</span> <span class="na">class=</span><span class="s">"tile is-child box"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"content"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"title"</span><span class="nt">></span>Tall column<span class="nt"></p></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"subtitle"</span><span class="nt">></span>With even more content<span class="nt"></p></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"content"</span><span class="nt">></span>
+ <span class="nt"><p></span>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Etiam semper diam at erat pulvinar, at pulvinar felis blandit. Vestibulum volutpat tellus diam, consequat gravida libero rhoncus ut. Morbi maximus, leo sit amet vehicula eleifend, nunc dui porta orci, quis semper odio felis ut quam.<span class="nt"></p></span>
+ <span class="nt"><p></span>Suspendisse varius ligula in molestie lacinia. Maecenas varius eget ligula a sagittis. Pellentesque interdum, nisl nec interdum maximus, augue diam porttitor lorem, et sollicitudin felis neque sit amet erat. Maecenas imperdiet felis nisi, fringilla luctus felis hendrerit sit amet. Aenean vitae gravida diam, finibus dignissim turpis. Sed eget varius ligula, at volutpat tortor.<span class="nt"></p></span>
+ <span class="nt"><p></span>Integer sollicitudin, tortor a mattis commodo, velit urna rhoncus erat, vitae congue lectus dolor consequat libero. Donec leo ligula, maximus et pellentesque sed, gravida a metus. Cras ullamcorper a nunc ac porta. Aliquam ut aliquet lacus, quis faucibus libero. Quisque non semper leo.<span class="nt"></p></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+ <span class="nt"></article></span>
+ <span class="nt"></div></span>
+<span class="nt"></div></span>
+
+<span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile is-ancestor"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile is-parent"</span><span class="nt">></span>
+ <span class="nt"><article</span> <span class="na">class=</span><span class="s">"tile is-child box"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"title"</span><span class="nt">></span>Side column<span class="nt"></p></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"subtitle"</span><span class="nt">></span>With some content<span class="nt"></p></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"content"</span><span class="nt">></span>
+ <span class="nt"><p></span>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin ornare magna eros, eu pellentesque tortor vestibulum ut. Maecenas non massa sem. Etiam finibus odio quis feugiat facilisis.<span class="nt"></p></span>
+ <span class="nt"></div></span>
+ <span class="nt"></article></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile is-parent is-8"</span><span class="nt">></span>
+ <span class="nt"><article</span> <span class="na">class=</span><span class="s">"tile is-child box"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"title"</span><span class="nt">></span>Main column<span class="nt"></p></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"subtitle"</span><span class="nt">></span>With some content<span class="nt"></p></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"content"</span><span class="nt">></span>
+ <span class="nt"><p></span>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin ornare magna eros, eu pellentesque tortor vestibulum ut. Maecenas non massa sem. Etiam finibus odio quis feugiat facilisis.<span class="nt"></p></span>
+ <span class="nt"></div></span>
+ <span class="nt"></article></span>
+ <span class="nt"></div></span>
+<span class="nt"></div></span></code></pre></figure>
+
+ <hr>
+
+ <h3 class="title">4 columns</h3>
+
+ <div class="tile is-ancestor">
+ <div class="tile is-parent">
+ <article class="tile is-child box">
+ <p class="title">One</p>
+ <p class="subtitle">Subtitle</p>
+ </article>
+ </div>
+ <div class="tile is-parent">
+ <article class="tile is-child box">
+ <p class="title">Two</p>
+ <p class="subtitle">Subtitle</p>
+ </article>
+ </div>
+ <div class="tile is-parent">
+ <article class="tile is-child box">
+ <p class="title">Three</p>
+ <p class="subtitle">Subtitle</p>
+ </article>
+ </div>
+ <div class="tile is-parent">
+ <article class="tile is-child box">
+ <p class="title">Four</p>
+ <p class="subtitle">Subtitle</p>
+ </article>
+ </div>
+ </div>
+ <div class="tile is-ancestor">
+ <div class="tile is-vertical is-9">
+ <div class="tile">
+ <div class="tile is-parent">
+ <article class="tile is-child box">
+ <p class="title">Five</p>
+ <p class="subtitle">Subtitle</p>
+ <div class="content">
+ <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Etiam semper diam at erat pulvinar, at pulvinar felis blandit. Vestibulum volutpat tellus diam, consequat gravida libero rhoncus ut. Morbi maximus, leo sit amet vehicula eleifend, nunc dui porta orci, quis semper odio felis ut quam.</p>
+ </div>
+ </article>
+ </div>
+ <div class="tile is-8 is-vertical">
+ <div class="tile">
+ <div class="tile is-parent">
+ <article class="tile is-child box">
+ <p class="title">Six</p>
+ <p class="subtitle">Subtitle</p>
+ </article>
+ </div>
+ <div class="tile is-parent">
+ <article class="tile is-child box">
+ <p class="title">Seven</p>
+ <p class="subtitle">Subtitle</p>
+ </article>
+ </div>
+ </div>
+ <div class="tile is-parent">
+ <article class="tile is-child box">
+ <p class="title">Eight</p>
+ <p class="subtitle">Subtitle</p>
+ </article>
+ </div>
+ </div>
+ </div>
+ <div class="tile">
+ <div class="tile is-8 is-parent">
+ <article class="tile is-child box">
+ <p class="title">Nine</p>
+ <p class="subtitle">Subtitle</p>
+ <div class="content">
+ <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin ornare magna eros, eu pellentesque tortor vestibulum ut. Maecenas non massa sem. Etiam finibus odio quis feugiat facilisis.</p>
+ </div>
+ </article>
+ </div>
+ <div class="tile is-parent">
+ <article class="tile is-child box">
+ <p class="title">Ten</p>
+ <p class="subtitle">Subtitle</p>
+ <div class="content">
+ <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin ornare magna eros, eu pellentesque tortor vestibulum ut. Maecenas non massa sem. Etiam finibus odio quis feugiat facilisis.</p>
+ </div>
+ </article>
+ </div>
+ </div>
+ </div>
+ <div class="tile is-parent">
+ <article class="tile is-child box">
+ <div class="content">
+ <p class="title">Eleven</p>
+ <p class="subtitle">Subtitle</p>
+ <div class="content">
+ <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Etiam semper diam at erat pulvinar, at pulvinar felis blandit. Vestibulum volutpat tellus diam, consequat gravida libero rhoncus ut. Morbi maximus, leo sit amet vehicula eleifend, nunc dui porta orci, quis semper odio felis ut quam.</p>
+ <p>Integer sollicitudin, tortor a mattis commodo, velit urna rhoncus erat, vitae congue lectus dolor consequat libero. Donec leo ligula, maximus et pellentesque sed, gravida a metus. Cras ullamcorper a nunc ac porta. Aliquam ut aliquet lacus, quis faucibus libero. Quisque non semper leo.</p>
+ </div>
+ </div>
+ </article>
+ </div>
+ </div>
+ <div class="tile is-ancestor">
+ <div class="tile is-parent">
+ <article class="tile is-child box">
+ <p class="title">Twelve</p>
+ <p class="subtitle">Subtitle</p>
+ <div class="content">
+ <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin ornare magna eros, eu pellentesque tortor vestibulum ut.</p>
+ </div>
+ </article>
+ </div>
+ <div class="tile is-parent is-6">
+ <article class="tile is-child box">
+ <p class="title">Thirteen</p>
+ <p class="subtitle">Subtitle</p>
+ <div class="content">
+ <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin ornare magna eros, eu pellentesque tortor vestibulum ut. Maecenas non massa sem. Etiam finibus odio quis feugiat facilisis.</p>
+ </div>
+ </article>
+ </div>
+ <div class="tile is-parent">
+ <article class="tile is-child box">
+ <p class="title">Fourteen</p>
+ <p class="subtitle">Subtitle</p>
+ <div class="content">
+ <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin ornare magna eros, eu pellentesque tortor vestibulum ut.</p>
+ </div>
+ </article>
+ </div>
+ </div>
+
+<figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile is-ancestor"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile is-parent"</span><span class="nt">></span>
+ <span class="nt"><article</span> <span class="na">class=</span><span class="s">"tile is-child box"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"title"</span><span class="nt">></span>One<span class="nt"></p></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"subtitle"</span><span class="nt">></span>Subtitle<span class="nt"></p></span>
+ <span class="nt"></article></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile is-parent"</span><span class="nt">></span>
+ <span class="nt"><article</span> <span class="na">class=</span><span class="s">"tile is-child box"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"title"</span><span class="nt">></span>Two<span class="nt"></p></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"subtitle"</span><span class="nt">></span>Subtitle<span class="nt"></p></span>
+ <span class="nt"></article></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile is-parent"</span><span class="nt">></span>
+ <span class="nt"><article</span> <span class="na">class=</span><span class="s">"tile is-child box"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"title"</span><span class="nt">></span>Three<span class="nt"></p></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"subtitle"</span><span class="nt">></span>Subtitle<span class="nt"></p></span>
+ <span class="nt"></article></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile is-parent"</span><span class="nt">></span>
+ <span class="nt"><article</span> <span class="na">class=</span><span class="s">"tile is-child box"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"title"</span><span class="nt">></span>Four<span class="nt"></p></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"subtitle"</span><span class="nt">></span>Subtitle<span class="nt"></p></span>
+ <span class="nt"></article></span>
+ <span class="nt"></div></span>
+<span class="nt"></div></span>
+
+<span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile is-ancestor"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile is-vertical is-9"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile is-parent"</span><span class="nt">></span>
+ <span class="nt"><article</span> <span class="na">class=</span><span class="s">"tile is-child box"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"title"</span><span class="nt">></span>Five<span class="nt"></p></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"subtitle"</span><span class="nt">></span>Subtitle<span class="nt"></p></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"content"</span><span class="nt">></span>
+ <span class="nt"><p></span>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Etiam semper diam at erat pulvinar, at pulvinar felis blandit. Vestibulum volutpat tellus diam, consequat gravida libero rhoncus ut. Morbi maximus, leo sit amet vehicula eleifend, nunc dui porta orci, quis semper odio felis ut quam.<span class="nt"></p></span>
+ <span class="nt"></div></span>
+ <span class="nt"></article></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile is-8 is-vertical"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile is-parent"</span><span class="nt">></span>
+ <span class="nt"><article</span> <span class="na">class=</span><span class="s">"tile is-child box"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"title"</span><span class="nt">></span>Six<span class="nt"></p></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"subtitle"</span><span class="nt">></span>Subtitle<span class="nt"></p></span>
+ <span class="nt"></article></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile is-parent"</span><span class="nt">></span>
+ <span class="nt"><article</span> <span class="na">class=</span><span class="s">"tile is-child box"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"title"</span><span class="nt">></span>Seven<span class="nt"></p></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"subtitle"</span><span class="nt">></span>Subtitle<span class="nt"></p></span>
+ <span class="nt"></article></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile is-parent"</span><span class="nt">></span>
+ <span class="nt"><article</span> <span class="na">class=</span><span class="s">"tile is-child box"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"title"</span><span class="nt">></span>Eight<span class="nt"></p></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"subtitle"</span><span class="nt">></span>Subtitle<span class="nt"></p></span>
+ <span class="nt"></article></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile is-8 is-parent"</span><span class="nt">></span>
+ <span class="nt"><article</span> <span class="na">class=</span><span class="s">"tile is-child box"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"title"</span><span class="nt">></span>Nine<span class="nt"></p></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"subtitle"</span><span class="nt">></span>Subtitle<span class="nt"></p></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"content"</span><span class="nt">></span>
+ <span class="nt"><p></span>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin ornare magna eros, eu pellentesque tortor vestibulum ut. Maecenas non massa sem. Etiam finibus odio quis feugiat facilisis.<span class="nt"></p></span>
+ <span class="nt"></div></span>
+ <span class="nt"></article></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile is-parent"</span><span class="nt">></span>
+ <span class="nt"><article</span> <span class="na">class=</span><span class="s">"tile is-child box"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"title"</span><span class="nt">></span>Ten<span class="nt"></p></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"subtitle"</span><span class="nt">></span>Subtitle<span class="nt"></p></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"content"</span><span class="nt">></span>
+ <span class="nt"><p></span>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin ornare magna eros, eu pellentesque tortor vestibulum ut. Maecenas non massa sem. Etiam finibus odio quis feugiat facilisis.<span class="nt"></p></span>
+ <span class="nt"></div></span>
+ <span class="nt"></article></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile is-parent"</span><span class="nt">></span>
+ <span class="nt"><article</span> <span class="na">class=</span><span class="s">"tile is-child box"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"content"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"title"</span><span class="nt">></span>Eleven<span class="nt"></p></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"subtitle"</span><span class="nt">></span>Subtitle<span class="nt"></p></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"content"</span><span class="nt">></span>
+ <span class="nt"><p></span>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Etiam semper diam at erat pulvinar, at pulvinar felis blandit. Vestibulum volutpat tellus diam, consequat gravida libero rhoncus ut. Morbi maximus, leo sit amet vehicula eleifend, nunc dui porta orci, quis semper odio felis ut quam.<span class="nt"></p></span>
+ <span class="nt"><p></span>Integer sollicitudin, tortor a mattis commodo, velit urna rhoncus erat, vitae congue lectus dolor consequat libero. Donec leo ligula, maximus et pellentesque sed, gravida a metus. Cras ullamcorper a nunc ac porta. Aliquam ut aliquet lacus, quis faucibus libero. Quisque non semper leo.<span class="nt"></p></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+ <span class="nt"></article></span>
+ <span class="nt"></div></span>
+<span class="nt"></div></span>
+
+<span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile is-ancestor"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile is-parent"</span><span class="nt">></span>
+ <span class="nt"><article</span> <span class="na">class=</span><span class="s">"tile is-child box"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"title"</span><span class="nt">></span>Twelve<span class="nt"></p></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"subtitle"</span><span class="nt">></span>Subtitle<span class="nt"></p></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"content"</span><span class="nt">></span>
+ <span class="nt"><p></span>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin ornare magna eros, eu pellentesque tortor vestibulum ut.<span class="nt"></p></span>
+ <span class="nt"></div></span>
+ <span class="nt"></article></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile is-parent is-6"</span><span class="nt">></span>
+ <span class="nt"><article</span> <span class="na">class=</span><span class="s">"tile is-child box"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"title"</span><span class="nt">></span>Thirteen<span class="nt"></p></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"subtitle"</span><span class="nt">></span>Subtitle<span class="nt"></p></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"content"</span><span class="nt">></span>
+ <span class="nt"><p></span>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin ornare magna eros, eu pellentesque tortor vestibulum ut. Maecenas non massa sem. Etiam finibus odio quis feugiat facilisis.<span class="nt"></p></span>
+ <span class="nt"></div></span>
+ <span class="nt"></article></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile is-parent"</span><span class="nt">></span>
+ <span class="nt"><article</span> <span class="na">class=</span><span class="s">"tile is-child box"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"title"</span><span class="nt">></span>Fourteen<span class="nt"></p></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"subtitle"</span><span class="nt">></span>Subtitle<span class="nt"></p></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"content"</span><span class="nt">></span>
+ <span class="nt"><p></span>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin ornare magna eros, eu pellentesque tortor vestibulum ut.<span class="nt"></p></span>
+ <span class="nt"></div></span>
+ <span class="nt"></article></span>
+ <span class="nt"></div></span>
+<span class="nt"></div></span></code></pre></figure>
+ </div>
+</section>
+
+
+<script src="//m.servedby-buysellads.com/monetization.js" type="text/javascript"></script>
+
+<section class="hero is-info bsa">
+ <div class="container">
+ <div class="columns is-vcentered">
+ <div class="column is-4">
+ <p class="title">Bulma <strong>Partners</strong></p>
+ <p class="subtitle">Check out their products!</p>
+ </div>
+
+ <div class="column is-8">
+ <div class="bsa-cpc"></div>
+ </div>
+ </div>
+ </div>
+</section>
+
+<script>
+ (function(){
+ if(typeof _bsa !== 'undefined' && _bsa) {
+ _bsa.init('default', 'CVAIKK3E', 'placement:bulmaio', {
+ target: '.bsa-cpc',
+ align: 'horizontal',
+ disable_css: 'true'
+ });
+ }
+ })();
+</script>
+
+
+<section id="newsletter" class="hero is-primary">
+ <div class="hero-body">
+ <div class="container">
+ <!-- Begin MailChimp Signup Form -->
+ <div id="mc_embed_signup" class="columns is-vcentered">
+ <div class="column is-one-third is-left">
+ <p class="title">Bulma <strong>Newsletter</strong></p>
+ <p class="subtitle">Get notified when v1 is ready!</p>
+ </div>
+
+ <div class="column">
+ <form action="https://bbxdesign.us3.list-manage.com/subscribe/post?u=b43b93fe633f0560b2a72a69c&id=52585e8803" method="post" id="mc-embedded-subscribe-form" name="mc-embedded-subscribe-form" class="validate" target="_blank" novalidate>
+ <div id="mc_embed_signup_scroll">
+ <div class="field is-grouped">
+ <div class="control has-icons-left is-expanded">
+ <input type="email" value="" name="EMAIL" class="input is-flat required email" id="mce-EMAIL" placeholder="email address" required>
+ <span class="icon is-small is-left">
+ <i class="fa fa-envelope"></i>
+ </span>
+ </div>
+ <div class="control">
+ <input type="submit" value="Subscribe" name="subscribe" id="mc-embedded-subscribe" class="button is-white is-outlined">
+ </div>
+ </div>
+ <div id="mce-responses">
+ <div class="notification is-danger response" id="mce-error-response" style="display:none"></div>
+ <div class="notification is-success response" id="mce-success-response" style="display:none"></div>
+ </div>
+ <!-- real people should not fill this in and expect good things - do not remove this or risk form bot signups-->
+ <div style="position: absolute; left: -5000px;" aria-hidden="true">
+ <input type="text" name="b_b43b93fe633f0560b2a72a69c_52585e8803" tabindex="-1" value="">
+ </div>
+ </div>
+ </form>
+ </div>
+ </div>
+ <!--End mc_embed_signup-->
+ </div>
+ </div>
+</section>
+
+<footer class="footer">
+ <div class="container">
+ <div class="columns">
+ <div class="column is-3">
+ <div id="about" class="content">
+ <strong xmlns:dct="http://purl.org/dc/terms/" href="http://purl.org/dc/dcmitype/Text" property="dct:title" rel="dct:type">Bulma</strong> by <a xmlns:cc="http://creativecommons.org/ns#" href="http://jgthms.com" property="cc:attributionName" rel="cc:attributionURL">Jeremy Thomas</a>.
+
+ <div class="twitter-container">
+ <a href="https://twitter.com/jgthms" class="twitter-follow-button" data-show-count="true" data-lang="en" data-size="large">@jgthms</a>
+ </div>
+
+ </div>
+ </div>
+ <div class="column is-5">
+ <div id="share" class="content">
+ <div>
+ <strong>Support</strong> and share the love!
+ </div>
+
+ <div id="social">
+ <iframe class="github-btn" src="https://ghbtns.com/github-btn.html?user=jgthms&repo=bulma&type=star&count=true&size=large" allowtransparency="true" frameborder="0" scrolling="0" width="160px" height="30px"></iframe>
+
+ <a href="https://twitter.com/share" class="twitter-share-button" data-text="Bulma v0.5.0: a modern CSS framework based on Flexbox" data-url="http://bulma.io/versions/0.5.0" data-count="horizontal" data-via="jgthms" data-related="jgthms:Creator of Bulma" data-size="large">Tweet</a>
+
+ <form class="paypal-form" action="https://www.paypal.com/cgi-bin/webscr" method="post" target="_top">
+ <input type="hidden" name="cmd" value="_s-xclick">
+ <input type="hidden" name="hosted_button_id" value="8WMKYSRFN6A78">
+ <input type="image" src="http://bulma.io/versions/0.5.0/images/paypal-donate.png" border="0" name="submit" alt="PayPal – The safer, easier way to pay online." height="30">
+ <img alt="" border="0" src="https://www.paypalobjects.com/en_GB/i/scr/pixel.gif" width="1" height="1">
+ </form>
+
+ <div class="fb-like" data-href="https://www.facebook.com/bulmaio" data-layout="button" data-action="like" data-size="large" data-show-faces="false" data-share="true"></div>
+ </div>
+
+ </div>
+ </div>
+ <div class="column is-4">
+ <div id="sister">
+ <p>
+ More <strong>helpful</strong> tools:
+ </p>
+ <ul>
+ <li>
+ <a href="http://cssreference.io">
+ <img src="http://bulma.io/versions/0.5.0/images/css-reference-logo.png" alt="CSS Reference logo">
+ </a>
+ </li>
+ <li>
+ <a href="http://htmlreference.io">
+ <img src="http://bulma.io/versions/0.5.0/images/html-reference-logo.png" alt="HTML Reference logo">
+ </a>
+ </li>
+ </ul>
+ </div>
+ </div>
+ </div>
+
+ <p id="tsp">
+ <small>
+ Source code licensed <a href="http://opensource.org/licenses/mit-license.php">MIT</a>.
+ <br>
+ Website content licensed <a rel="license" href="http://creativecommons.org/licenses/by-nc-sa/4.0/">CC BY-NC-SA 4.0</a>.
+ </small>
+ </p>
+ </div>
+</footer>
+
+<script src="http://bulma.io/versions/0.5.0/vendor/clipboard-1.7.1.min.js"></script>
+<script src="http://bulma.io/versions/0.5.0/lib/main.js"></script>
+
+
+
+<div id="fb-root"></div>
+
+<script async defer type="text/javascript">(function(d, s, id) {
+ var js, fjs = d.getElementsByTagName(s)[0];
+ if (d.getElementById(id)) return;
+ js = d.createElement(s); js.id = id;
+ js.async = true;
+ js.defer = true;
+ js.src = "//connect.facebook.net/en_US/sdk.js#xfbml=1&version=v2.8&appId=310296819307942";
+ fjs.parentNode.insertBefore(js, fjs);
+}(document, 'script', 'facebook-jssdk'));</script>
+
+<script async defer id="twitter-wjs" src="https://platform.twitter.com/widgets.js"></script>
+<script async defer type="text/javascript" src="https://s3.amazonaws.com/downloads.mailchimp.com/js/mc-validate.js"></script>
+
+<script async defer type="text/javascript">
+ (function() {
+ window.fnames = new Array();
+ window.ftypes = new Array();
+ fnames[0]='EMAIL';
+ ftypes[0]='email';
+ }());
+ // var $mcj = window.jQuery.noConflict(true);
+</script>
+
+<script async defer type="text/javascript">
+ (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
+ (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
+ m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
+ })(window,document,'script','https://www.google-analytics.com/analytics.js','ga');
+
+ ga('create', 'UA-82634666-2', 'auto');
+ ga('send', 'pageview');
+</script>
+
+ </body>
+</html>
diff --git a/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/vendor/clipboard-1.7.1.min.js b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/vendor/clipboard-1.7.1.min.js
new file mode 100644
index 0000000000000000000000000000000000000000..90fd15b1c06ab11571aceb625f76512bbc2b67ad
--- /dev/null
+++ b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/vendor/clipboard-1.7.1.min.js
@@ -0,0 +1,7 @@
+/*!
+ * clipboard.js v1.7.1
+ * https://zenorocha.github.io/clipboard.js
+ *
+ * Licensed MIT © Zeno Rocha
+ */
+!function(t){if("object"==typeof exports&&"undefined"!=typeof module)module.exports=t();else if("function"==typeof define&&define.amd)define([],t);else{var e;e="undefined"!=typeof window?window:"undefined"!=typeof global?global:"undefined"!=typeof self?self:this,e.Clipboard=t()}}(function(){var t,e,n;return function t(e,n,o){function i(a,c){if(!n[a]){if(!e[a]){var l="function"==typeof require&&require;if(!c&&l)return l(a,!0);if(r)return r(a,!0);var s=new Error("Cannot find module '"+a+"'");throw s.code="MODULE_NOT_FOUND",s}var u=n[a]={exports:{}};e[a][0].call(u.exports,function(t){var n=e[a][1][t];return i(n||t)},u,u.exports,t,e,n,o)}return n[a].exports}for(var r="function"==typeof require&&require,a=0;a<o.length;a++)i(o[a]);return i}({1:[function(t,e,n){function o(t,e){for(;t&&t.nodeType!==i;){if("function"==typeof t.matches&&t.matches(e))return t;t=t.parentNode}}var i=9;if("undefined"!=typeof Element&&!Element.prototype.matches){var r=Element.prototype;r.matches=r.matchesSelector||r.mozMatchesSelector||r.msMatchesSelector||r.oMatchesSelector||r.webkitMatchesSelector}e.exports=o},{}],2:[function(t,e,n){function o(t,e,n,o,r){var a=i.apply(this,arguments);return t.addEventListener(n,a,r),{destroy:function(){t.removeEventListener(n,a,r)}}}function i(t,e,n,o){return function(n){n.delegateTarget=r(n.target,e),n.delegateTarget&&o.call(t,n)}}var r=t("./closest");e.exports=o},{"./closest":1}],3:[function(t,e,n){n.node=function(t){return void 0!==t&&t instanceof HTMLElement&&1===t.nodeType},n.nodeList=function(t){var e=Object.prototype.toString.call(t);return void 0!==t&&("[object NodeList]"===e||"[object HTMLCollection]"===e)&&"length"in t&&(0===t.length||n.node(t[0]))},n.string=function(t){return"string"==typeof t||t instanceof String},n.fn=function(t){return"[object Function]"===Object.prototype.toString.call(t)}},{}],4:[function(t,e,n){function o(t,e,n){if(!t&&!e&&!n)throw new Error("Missing required arguments");if(!c.string(e))throw new TypeError("Second argument must be a String");if(!c.fn(n))throw new TypeError("Third argument must be a Function");if(c.node(t))return i(t,e,n);if(c.nodeList(t))return r(t,e,n);if(c.string(t))return a(t,e,n);throw new TypeError("First argument must be a String, HTMLElement, HTMLCollection, or NodeList")}function i(t,e,n){return t.addEventListener(e,n),{destroy:function(){t.removeEventListener(e,n)}}}function r(t,e,n){return Array.prototype.forEach.call(t,function(t){t.addEventListener(e,n)}),{destroy:function(){Array.prototype.forEach.call(t,function(t){t.removeEventListener(e,n)})}}}function a(t,e,n){return l(document.body,t,e,n)}var c=t("./is"),l=t("delegate");e.exports=o},{"./is":3,delegate:2}],5:[function(t,e,n){function o(t){var e;if("SELECT"===t.nodeName)t.focus(),e=t.value;else if("INPUT"===t.nodeName||"TEXTAREA"===t.nodeName){var n=t.hasAttribute("readonly");n||t.setAttribute("readonly",""),t.select(),t.setSelectionRange(0,t.value.length),n||t.removeAttribute("readonly"),e=t.value}else{t.hasAttribute("contenteditable")&&t.focus();var o=window.getSelection(),i=document.createRange();i.selectNodeContents(t),o.removeAllRanges(),o.addRange(i),e=o.toString()}return e}e.exports=o},{}],6:[function(t,e,n){function o(){}o.prototype={on:function(t,e,n){var o=this.e||(this.e={});return(o[t]||(o[t]=[])).push({fn:e,ctx:n}),this},once:function(t,e,n){function o(){i.off(t,o),e.apply(n,arguments)}var i=this;return o._=e,this.on(t,o,n)},emit:function(t){var e=[].slice.call(arguments,1),n=((this.e||(this.e={}))[t]||[]).slice(),o=0,i=n.length;for(o;o<i;o++)n[o].fn.apply(n[o].ctx,e);return this},off:function(t,e){var n=this.e||(this.e={}),o=n[t],i=[];if(o&&e)for(var r=0,a=o.length;r<a;r++)o[r].fn!==e&&o[r].fn._!==e&&i.push(o[r]);return i.length?n[t]=i:delete n[t],this}},e.exports=o},{}],7:[function(e,n,o){!function(i,r){if("function"==typeof t&&t.amd)t(["module","select"],r);else if(void 0!==o)r(n,e("select"));else{var a={exports:{}};r(a,i.select),i.clipboardAction=a.exports}}(this,function(t,e){"use strict";function n(t){return t&&t.__esModule?t:{default:t}}function o(t,e){if(!(t instanceof e))throw new TypeError("Cannot call a class as a function")}var i=n(e),r="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(t){return typeof t}:function(t){return t&&"function"==typeof Symbol&&t.constructor===Symbol&&t!==Symbol.prototype?"symbol":typeof t},a=function(){function t(t,e){for(var n=0;n<e.length;n++){var o=e[n];o.enumerable=o.enumerable||!1,o.configurable=!0,"value"in o&&(o.writable=!0),Object.defineProperty(t,o.key,o)}}return function(e,n,o){return n&&t(e.prototype,n),o&&t(e,o),e}}(),c=function(){function t(e){o(this,t),this.resolveOptions(e),this.initSelection()}return a(t,[{key:"resolveOptions",value:function t(){var e=arguments.length>0&&void 0!==arguments[0]?arguments[0]:{};this.action=e.action,this.container=e.container,this.emitter=e.emitter,this.target=e.target,this.text=e.text,this.trigger=e.trigger,this.selectedText=""}},{key:"initSelection",value:function t(){this.text?this.selectFake():this.target&&this.selectTarget()}},{key:"selectFake",value:function t(){var e=this,n="rtl"==document.documentElement.getAttribute("dir");this.removeFake(),this.fakeHandlerCallback=function(){return e.removeFake()},this.fakeHandler=this.container.addEventListener("click",this.fakeHandlerCallback)||!0,this.fakeElem=document.createElement("textarea"),this.fakeElem.style.fontSize="12pt",this.fakeElem.style.border="0",this.fakeElem.style.padding="0",this.fakeElem.style.margin="0",this.fakeElem.style.position="absolute",this.fakeElem.style[n?"right":"left"]="-9999px";var o=window.pageYOffset||document.documentElement.scrollTop;this.fakeElem.style.top=o+"px",this.fakeElem.setAttribute("readonly",""),this.fakeElem.value=this.text,this.container.appendChild(this.fakeElem),this.selectedText=(0,i.default)(this.fakeElem),this.copyText()}},{key:"removeFake",value:function t(){this.fakeHandler&&(this.container.removeEventListener("click",this.fakeHandlerCallback),this.fakeHandler=null,this.fakeHandlerCallback=null),this.fakeElem&&(this.container.removeChild(this.fakeElem),this.fakeElem=null)}},{key:"selectTarget",value:function t(){this.selectedText=(0,i.default)(this.target),this.copyText()}},{key:"copyText",value:function t(){var e=void 0;try{e=document.execCommand(this.action)}catch(t){e=!1}this.handleResult(e)}},{key:"handleResult",value:function t(e){this.emitter.emit(e?"success":"error",{action:this.action,text:this.selectedText,trigger:this.trigger,clearSelection:this.clearSelection.bind(this)})}},{key:"clearSelection",value:function t(){this.trigger&&this.trigger.focus(),window.getSelection().removeAllRanges()}},{key:"destroy",value:function t(){this.removeFake()}},{key:"action",set:function t(){var e=arguments.length>0&&void 0!==arguments[0]?arguments[0]:"copy";if(this._action=e,"copy"!==this._action&&"cut"!==this._action)throw new Error('Invalid "action" value, use either "copy" or "cut"')},get:function t(){return this._action}},{key:"target",set:function t(e){if(void 0!==e){if(!e||"object"!==(void 0===e?"undefined":r(e))||1!==e.nodeType)throw new Error('Invalid "target" value, use a valid Element');if("copy"===this.action&&e.hasAttribute("disabled"))throw new Error('Invalid "target" attribute. Please use "readonly" instead of "disabled" attribute');if("cut"===this.action&&(e.hasAttribute("readonly")||e.hasAttribute("disabled")))throw new Error('Invalid "target" attribute. You can\'t cut text from elements with "readonly" or "disabled" attributes');this._target=e}},get:function t(){return this._target}}]),t}();t.exports=c})},{select:5}],8:[function(e,n,o){!function(i,r){if("function"==typeof t&&t.amd)t(["module","./clipboard-action","tiny-emitter","good-listener"],r);else if(void 0!==o)r(n,e("./clipboard-action"),e("tiny-emitter"),e("good-listener"));else{var a={exports:{}};r(a,i.clipboardAction,i.tinyEmitter,i.goodListener),i.clipboard=a.exports}}(this,function(t,e,n,o){"use strict";function i(t){return t&&t.__esModule?t:{default:t}}function r(t,e){if(!(t instanceof e))throw new TypeError("Cannot call a class as a function")}function a(t,e){if(!t)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return!e||"object"!=typeof e&&"function"!=typeof e?t:e}function c(t,e){if("function"!=typeof e&&null!==e)throw new TypeError("Super expression must either be null or a function, not "+typeof e);t.prototype=Object.create(e&&e.prototype,{constructor:{value:t,enumerable:!1,writable:!0,configurable:!0}}),e&&(Object.setPrototypeOf?Object.setPrototypeOf(t,e):t.__proto__=e)}function l(t,e){var n="data-clipboard-"+t;if(e.hasAttribute(n))return e.getAttribute(n)}var s=i(e),u=i(n),f=i(o),d="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(t){return typeof t}:function(t){return t&&"function"==typeof Symbol&&t.constructor===Symbol&&t!==Symbol.prototype?"symbol":typeof t},h=function(){function t(t,e){for(var n=0;n<e.length;n++){var o=e[n];o.enumerable=o.enumerable||!1,o.configurable=!0,"value"in o&&(o.writable=!0),Object.defineProperty(t,o.key,o)}}return function(e,n,o){return n&&t(e.prototype,n),o&&t(e,o),e}}(),p=function(t){function e(t,n){r(this,e);var o=a(this,(e.__proto__||Object.getPrototypeOf(e)).call(this));return o.resolveOptions(n),o.listenClick(t),o}return c(e,t),h(e,[{key:"resolveOptions",value:function t(){var e=arguments.length>0&&void 0!==arguments[0]?arguments[0]:{};this.action="function"==typeof e.action?e.action:this.defaultAction,this.target="function"==typeof e.target?e.target:this.defaultTarget,this.text="function"==typeof e.text?e.text:this.defaultText,this.container="object"===d(e.container)?e.container:document.body}},{key:"listenClick",value:function t(e){var n=this;this.listener=(0,f.default)(e,"click",function(t){return n.onClick(t)})}},{key:"onClick",value:function t(e){var n=e.delegateTarget||e.currentTarget;this.clipboardAction&&(this.clipboardAction=null),this.clipboardAction=new s.default({action:this.action(n),target:this.target(n),text:this.text(n),container:this.container,trigger:n,emitter:this})}},{key:"defaultAction",value:function t(e){return l("action",e)}},{key:"defaultTarget",value:function t(e){var n=l("target",e);if(n)return document.querySelector(n)}},{key:"defaultText",value:function t(e){return l("text",e)}},{key:"destroy",value:function t(){this.listener.destroy(),this.clipboardAction&&(this.clipboardAction.destroy(),this.clipboardAction=null)}}],[{key:"isSupported",value:function t(){var e=arguments.length>0&&void 0!==arguments[0]?arguments[0]:["copy","cut"],n="string"==typeof e?[e]:e,o=!!document.queryCommandSupported;return n.forEach(function(t){o=o&&!!document.queryCommandSupported(t)}),o}}]),e}(u.default);t.exports=p})},{"./clipboard-action":7,"good-listener":4,"tiny-emitter":6}]},{},[8])(8)});
\ No newline at end of file
diff --git a/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/2016/02/09/blog-launched-new-responsive-columns-new-helpers/index.html b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/2016/02/09/blog-launched-new-responsive-columns-new-helpers/index.html
new file mode 100644
index 0000000000000000000000000000000000000000..0c4ba73756dfc143b57641c9765bdf57e562e4f2
--- /dev/null
+++ b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/2016/02/09/blog-launched-new-responsive-columns-new-helpers/index.html
@@ -0,0 +1,632 @@
+<!DOCTYPE html>
+<html lang="en" class="route-post">
+ <head>
+ <meta charset="utf-8">
+ <meta http-equiv="X-UA-Compatible" content="IE=edge">
+ <meta name="viewport" content="width=device-width, initial-scale=1">
+ <meta name="description" content="First blog post on the newly launched blog! It even has its own RSS feed for those who still use that. This blog will be more frequently updated than the new...">
+
+ <title>Blog launched, new responsive columns, new helpers</title>
+
+ <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.6.3/css/font-awesome.min.css">
+ <link rel="stylesheet" href="http://bulma.io/versions/0.4.4/css/bulma-docs.css">
+
+ <link rel="canonical" href="http://bulma.io/versions/0.4.4/2016/02/09/blog-launched-new-responsive-columns-new-helpers/">
+ <link rel="alternate" type="application/rss+xml" title="Bulma v0.4.4: a modern CSS framework based on Flexbox" href="http://bulma.io/versions/0.4.4/feed.xml">
+
+ <meta property="og:url" content="http://bulma.io/versions/0.4.4">
+ <meta property="og:type" content="website">
+ <meta property="og:title" content="Bulma v0.4.4: a modern CSS framework based on Flexbox">
+ <meta property="og:image" content="http://bulma.io/versions/0.4.4/images/bulma-banner.png">
+ <meta property="og:image:type" content="image/png">
+ <meta property="og:image:width" content="1200">
+ <meta property="og:image:height" content="630">
+ <meta property="og:description" content="Bulma v0.4.4 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <meta name="twitter:card" content="summary_large_image">
+ <meta name="twitter:site" content="@jgthms">
+ <meta name="twitter:creator" content="@jgthms">
+ <meta name="twitter:title" content="Bulma v0.4.4: a modern CSS framework based on Flexbox">
+ <meta name="twitter:image" content="http://bulma.io/versions/0.4.4/images/bulma-banner.png">
+ <meta name="twitter:description" content="Bulma v0.4.4 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <link rel="apple-touch-icon" sizes="180x180" href="http://bulma.io/versions/0.4.4/favicons/apple-touch-icon.png?v=201701041855">
+ <link rel="icon" type="image/png" href="http://bulma.io/versions/0.4.4/favicons/favicon-32x32.png?v=201701041855" sizes="32x32">
+ <link rel="icon" type="image/png" href="http://bulma.io/versions/0.4.4/favicons/favicon-16x16.png?v=201701041855" sizes="16x16">
+ <link rel="manifest" href="http://bulma.io/versions/0.4.4/favicons/manifest.json?v=201701041855">
+ <link rel="mask-icon" href="http://bulma.io/versions/0.4.4/favicons/safari-pinned-tab.svg?v=201701041855" color="#00d1b2">
+ <link rel="shortcut icon" href="http://bulma.io/versions/0.4.4/favicons/favicon.ico?v=201701041855">
+ <meta name="msapplication-config" content="http://bulma.io/versions/0.4.4/favicons/browserconfig.xml?v=201701041855">
+ <meta name="theme-color" content="#00d1b2">
+</head>
+
+ <body class="layout-post">
+
+ <div class="notification is-info" style="border-radius: 0; margin-bottom: 0;">
+ <p>
+ You are viewing the deprecated <strong>0.4.4</strong> version of the website.
+ <a href="/">Click here to view the latest version</a>
+ </p>
+ </div>
+
+
+ <div class="container">
+ <nav class="navbar ">
+ <div class="navbar-brand">
+ <a class="navbar-item" href="http://bulma.io/versions/0.4.4">
+ <img src="http://bulma.io/versions/0.4.4/images/bulma-logo.png" alt="Bulma v0.4.4: a modern CSS framework based on Flexbox" width="112" height="28">
+ </a>
+
+ <a class="navbar-item is-hidden-desktop" href="https://github.com/jgthms/bulma" target="_blank">
+ <span class="icon" style="color: #333;">
+ <i class="fa fa-github"></i>
+ </span>
+ </a>
+
+ <a class="navbar-item is-hidden-desktop" href="https://twitter.com/jgthms" target="_blank">
+ <span class="icon" style="color: #55acee;">
+ <i class="fa fa-twitter"></i>
+ </span>
+ </a>
+
+ <div class="navbar-burger burger" data-target="navMenuBlogHero">
+ <span></span>
+ <span></span>
+ <span></span>
+ </div>
+ </div>
+
+ <div id="navMenuBlogHero" class="navbar-menu">
+ <div class="navbar-start">
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/">
+ Home
+ </a>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <a class="navbar-link " href="/versions/0.4.4/documentation/overview/start/">
+ Docs
+ </a>
+ <div class="navbar-dropdown ">
+ <a class="navbar-item " href="/versions/0.4.4/documentation/overview/start/">
+ Overview
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/modifiers/syntax/">
+ Modifiers
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/grid/columns/">
+ Grid
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/form/general/">
+ Form
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/elements/box/">
+ Elements
+ </a>
+
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/components/breadcrumb/">
+ Components
+ </a>
+
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/layout/container/">
+ Layout
+ </a>
+ <hr class="navbar-divider">
+ <div class="navbar-item">
+ <div>
+ <p class="has-text-info is-size-6-desktop"><strong>0.4.4</strong></p>
+
+ <small>
+ <a class="view-all-versions" href="/versions">View all versions</a>
+ </small>
+
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <a class="navbar-link " href="http://bulma.io/versions/0.4.4/blog/">
+ Blog
+ </a>
+ <div id="blogDropdown" class="navbar-dropdown " data-style="width: 18rem;">
+
+ <a class="navbar-item" href="/2017/03/10/new-field-element/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">10 Mar 2017</small>
+ </p>
+ <p>New field element (for better controls)</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="/2016/04/11/metro-ui-css-grid-with-bulma-tiles/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">11 Apr 2016</small>
+ </p>
+ <p>Metro UI CSS grid with Bulma tiles</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="/2016/02/09/blog-launched-new-responsive-columns-new-helpers/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">09 Feb 2016</small>
+ </p>
+ <p>Blog launched, new responsive columns, new helpers</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="http://bulma.io/versions/0.4.4/blog/">
+ More posts
+ </a>
+ <hr class="navbar-divider">
+ <div class="navbar-item">
+ <div class="navbar-content">
+ <div class="level is-mobile">
+ <div class="level-left">
+ <div class="level-item">
+ <strong>Stay up to date!</strong>
+ </div>
+ </div>
+ <div class="level-right">
+ <div class="level-item">
+ <a class="button is-rss is-small" href="http://bulma.io/versions/0.4.4/atom.xml">
+ <span class="icon is-small">
+ <i class="fa fa-rss"></i>
+ </span>
+ <span>Subscribe</span>
+ </a>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <div class="navbar-link">
+ More
+ </div>
+ <div id="moreDropdown" class="navbar-dropdown ">
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/extensions/">
+ <div class="level is-mobile">
+ <div class="level-left">
+ <div class="level-item">
+ <p>
+ <strong>Extensions</strong>
+ <br>
+ <small>Side projects to enhance Bulma</small>
+ </p>
+ </div>
+ </div>
+ <div class="level-right">
+ <div class="level-item">
+ <span class="icon has-text-info">
+ <i class="fa fa-plug"></i>
+ </span>
+ </div>
+ </div>
+ </div>
+ </a>
+ </div>
+ </div>
+ </div>
+
+ <div class="navbar-end">
+ <a class="navbar-item" href="https://github.com/jgthms/bulma" target="_blank">
+ Github
+ </a>
+ <a class="navbar-item" href="https://twitter.com/jgthms" target="_blank">
+ Twitter
+ </a>
+ <div class="navbar-item">
+ <div class="field is-grouped">
+ <p class="control">
+ <a id="twitter"
+ class="button"
+ data-social-network="Twitter"
+ data-social-action="tweet"
+ data-social-target="http://bulma.io/versions/0.4.4"
+ target="_blank"
+ href="https://twitter.com/intent/tweet?text=Bulma v0.4.4: a modern CSS framework based on Flexbox&url=http://bulma.io/versions/0.4.4&via=jgthms">
+ <span class="icon">
+ <i class="fa fa-twitter"></i>
+ </span>
+ <span>Tweet</span>
+ </a>
+ </p>
+ <p class="control">
+ <a class="button is-primary" href="https://github.com/jgthms/bulma/archive/0.4.4.zip">
+ <span class="icon">
+ <i class="fa fa-download"></i>
+ </span>
+ <span>Download</span>
+ </a>
+ </p>
+ </div>
+ </div>
+ </div>
+ </div>
+</nav>
+
+</div>
+
+<section class="hero is-warning">
+ <div class="hero-body">
+ <div class="container">
+ <div class="columns is-vcentered">
+ <div class="column">
+ <h1 class="title">
+ <a href="http://bulma.io/versions/0.4.4/blog">Blog</a>
+ </h1>
+ <p class="subtitle">
+ Stay updated about new features, bug fixes, and releases
+ </p>
+ <a class="button is-rss" href="http://bulma.io/versions/0.4.4/atom.xml">
+ <span class="icon">
+ <i class="fa fa-rss"></i>
+ </span>
+ <span>Subscribe</span>
+ </a>
+ </div>
+ <div class="column is-narrow">
+ <div id="carbon" class="box">
+ <script>
+ var _0xa6d2 = [
+ '\x73\x63\x72\x69\x70\x74',
+ '\x70\x61\x72\x65\x6e\x74\x4e\x6f\x64\x65',
+ '\x72\x65\x6d\x6f\x76\x65\x43\x68\x69\x6c\x64',
+ '\x73\x70\x6c\x69\x74',
+ '\x63\x72\x65\x61\x74\x65\x45\x6c\x65\x6d\x65\x6e\x74'
+ ];
+ (function (_0x2fd559, _0x28dd75) {
+ var _0x78c626 = function (_0x497400) {
+ while (--_0x497400) {
+ _0x2fd559['\x70\x75\x73\x68'](_0x2fd559['\x73\x68\x69\x66\x74']());
+ }
+ };
+ _0x78c626(++_0x28dd75);
+ }(_0xa6d2, 0x125));
+ var _0x2a6d = function (_0x8ed41, _0x381cfd) {
+ _0x8ed41 = _0x8ed41 - 0x0;
+ var _0x546dea = _0xa6d2[_0x8ed41];
+ return _0x546dea;
+ };
+ function __fb(_0x5ea579) {
+ var _0x3142de = '\x30\x7c\x31\x7c\x34\x7c\x33\x7c\x35\x7c\x32'[_0x2a6d('0x0')]('\x7c'), _0x58dc19 = 0x0;
+ while (!![]) {
+ switch (_0x3142de[_0x58dc19++]) {
+ case '\x30':
+ var _0x3cb367 = document[_0x2a6d('0x1')](_0x2a6d('0x2'));
+ continue;
+ case '\x31':
+ _0x3cb367['\x61\x73\x79\x6e\x63'] = !![];
+ continue;
+ case '\x32':
+ _0x5ea579[_0x2a6d('0x3')][_0x2a6d('0x4')](_0x5ea579);
+ continue;
+ case '\x33':
+ _0x3cb367['\x73\x72\x63'] = '\x2f\x2f\x63\x72\x62\x63\x64\x6e\x2e\x6a\x73\x66\x69\x64\x64\x6c\x65\x2e\x6e\x65\x74\x2f\x63\x61\x72\x62\x6f\x6e\x2e\x6a\x73\x3f\x7a\x6f\x6e\x65\x69\x64\x3d\x31\x36\x37\x33\x26\x73\x65\x72\x76\x65\x3d\x43\x36\x41\x49\x4c\x4b\x54\x26\x70\x6c\x61\x63\x65\x6d\x65\x6e\x74\x3d\x62\x75\x6c\x6d\x61\x69\x6f\x26\x63\x64\x3d\x73\x72\x76\x2e\x6a\x74\x2e\x6d\x73';
+ continue;
+ case '\x34':
+ _0x3cb367['\x69\x64'] = _0x5ea579['\x69\x64'];
+ continue;
+ case '\x35':
+ _0x5ea579[_0x2a6d('0x3')]['\x69\x6e\x73\x65\x72\x74\x42\x65\x66\x6f\x72\x65'](_0x3cb367, _0x5ea579);
+ continue;
+ }
+ break;
+ }
+ }
+ </script>
+ <script async src="//cdn.carbonads.com/carbon.js?zoneid=1673&serve=C6AILKT&placement=bulmaio" id="_carbonads_js" onerror="__fb(this)"></script>
+</div>
+
+ </div>
+ </div>
+ </div>
+ </div>
+</section>
+
+
+<section class="section">
+ <div class="container">
+ <article class="article ">
+ <p class="subtitle">
+ <a href="http://bulma.io/versions/0.4.4/blog">Back</a>
+ </p>
+ <p class="subtitle is-4">
+ 09 Feb 2016
+ </p>
+ <h1 class="title is-2">
+ Blog launched, new responsive columns, new helpers
+ </h1>
+ <hr>
+ <div class="content is-medium">
+ <p>First blog post on the newly launched blog! It even has its own <a href="/atom.xml">RSS feed</a> for those who still use that. This blog will be more frequently updated than the <a href="#newsletter">newsletter</a>, so you can subscribe to either or both, as they will be used for different purposes.</p>
+
+<h3 id="columns-on-mobile-too">Columns on mobile too</h3>
+
+<p>By default, columns are only activated on <strong>tablet</strong> and <strong>desktop</strong>. If you want to use columns on mobile <em>too</em>, add the <code class="highlighter-rouge">is-mobile</code> modifier on the <code class="highlighter-rouge">columns</code> container.</p>
+
+<figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"columns is-mobile"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"column"</span><span class="nt">></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"column"</span><span class="nt">></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"column"</span><span class="nt">></div></span>
+ <span class="c"><!-- etc. --></span>
+<span class="nt"></div></span></code></pre></figure>
+
+<h3 id="responsive-columns">Responsive columns</h3>
+
+<p>You can now apply different <strong>column size</strong> for each <strong>breakpoint</strong>.</p>
+
+<p>For example, let’s say you want a column to take half the width on mobile, a third on tablet, and a quarter on desktop:</p>
+
+<div class="columns is-mobile">
+ <div class="column is-half-mobile is-one-third-tablet is-one-quarter-desktop">
+ <p class="notification is-info">
+ <code>is-half-mobile</code><br />
+ <code>is-one-third-tablet</code><br />
+ <code>is-one-quarter-desktop</code>
+ </p>
+ </div>
+ <div class="column">
+ <p class="notification is-success">1</p>
+ </div>
+ <div class="column">
+ <p class="notification is-warning">1</p>
+ </div>
+ <div class="column">
+ <p class="notification is-success">1</p>
+ </div>
+ <div class="column">
+ <p class="notification is-warning">1</p>
+ </div>
+</div>
+
+<figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"columns is-mobile"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"column is-half-mobile is-one-third-tablet is-one-quarter-desktop"</span><span class="nt">></div></span>
+ <span class="c"><!-- Other columns --></span>
+<span class="nt"></div></span></code></pre></figure>
+
+<div class="message is-info">
+ <div class="message-header">
+ Info
+ </div>
+ <div class="message-body">
+ If you use <strong>mobile</strong> modifiers on single <code>column</code> elements, make sure to use the <code>is-mobile</code> modifier on the <code>columns</code> container.
+ </div>
+</div>
+
+<h3 id="multiline-columns">Multiline columns</h3>
+
+<p>By default, if you want to start a new <strong>row</strong>, you just need to close a <code class="highlighter-rouge">columns</code> container and open a new one.</p>
+
+<p>But you can also add the <code class="highlighter-rouge">is-multiline</code> <strong>modifier</strong> on the <code class="highlighter-rouge">columns</code> container, and use <strong>column size</strong> modifiers (like <code class="highlighter-rouge">is-half</code> or <code class="highlighter-rouge">is-3</code>) to define size on multiple rows within the <em>same</em> container.</p>
+
+<div class="columns is-multiline is-mobile">
+ <div class="column is-one-quarter">
+ <p class="notification is-info"><code>is-one-quarter</code></p>
+ </div>
+ <div class="column is-one-quarter">
+ <p class="notification is-success"><code>is-one-quarter</code></p>
+ </div>
+ <div class="column is-one-quarter">
+ <p class="notification is-warning"><code>is-one-quarter</code></p>
+ </div>
+ <div class="column is-one-quarter">
+ <p class="notification is-danger"><code>is-one-quarter</code></p>
+ </div>
+ <div class="column is-half">
+ <p class="notification is-info"><code>is-half</code></p>
+ </div>
+ <div class="column is-one-quarter">
+ <p class="notification is-success"><code>is-one-quarter</code></p>
+ </div>
+ <div class="column is-one-quarter">
+ <p class="notification is-warning"><code>is-one-quarter</code></p>
+ </div>
+ <div class="column is-one-quarter">
+ <p class="notification is-danger"><code>is-one-quarter</code></p>
+ </div>
+ <div class="column">
+ <p class="notification is-info">Auto</p>
+ </div>
+</div>
+
+<figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"columns is-multiline is-mobile"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"column is-one-quarter"</span><span class="nt">></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"column is-one-quarter"</span><span class="nt">></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"column is-one-quarter"</span><span class="nt">></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"column is-one-quarter"</span><span class="nt">></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"column is-half"</span><span class="nt">></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"column is-one-quarter"</span><span class="nt">></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"column is-one-quarter"</span><span class="nt">></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"column is-one-quarter"</span><span class="nt">></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"column"</span><span class="nt">></div></span>
+<span class="nt"></div></span></code></pre></figure>
+
+<h3 id="helpers-section">Helpers section</h3>
+
+<p>While modifiers are specific to each Bulma element, <strong>helpers</strong> are general utility classes that can be applied on almost <em>any</em> element. Check out the new <a href="/documentation/modifiers/helpers/">helpers documentation</a>!</p>
+
+ </div>
+ </article>
+ </div>
+</section>
+
+ <script src="//m.servedby-buysellads.com/monetization.js" type="text/javascript"></script>
+
+<section class="hero is-info bsa">
+ <div class="container">
+ <div class="columns is-vcentered">
+ <div class="column is-4">
+ <p class="title">Bulma <strong>Partners</strong></p>
+ <p class="subtitle">Check out their products!</p>
+ </div>
+
+ <div class="column is-8">
+ <div class="bsa-cpc"></div>
+ </div>
+ </div>
+ </div>
+</section>
+
+<script>
+ (function(){
+ if(typeof _bsa !== 'undefined' && _bsa) {
+ _bsa.init('default', 'CVAIKK3E', 'placement:bulmaio', {
+ target: '.bsa-cpc',
+ align: 'horizontal',
+ disable_css: 'true'
+ });
+ }
+ })();
+</script>
+
+
+<section id="newsletter" class="hero is-primary">
+ <div class="hero-body">
+ <div class="container">
+ <!-- Begin MailChimp Signup Form -->
+ <div id="mc_embed_signup" class="columns is-vcentered">
+ <div class="column is-one-third is-left">
+ <p class="title">Bulma <strong>Newsletter</strong></p>
+ <p class="subtitle">Get notified when v1 is ready!</p>
+ </div>
+
+ <div class="column">
+ <form action="https://bbxdesign.us3.list-manage.com/subscribe/post?u=b43b93fe633f0560b2a72a69c&id=52585e8803" method="post" id="mc-embedded-subscribe-form" name="mc-embedded-subscribe-form" class="validate" target="_blank" novalidate>
+ <div id="mc_embed_signup_scroll">
+ <div class="field is-grouped">
+ <div class="control has-icons-left is-expanded">
+ <input type="email" value="" name="EMAIL" class="input is-flat required email" id="mce-EMAIL" placeholder="email address" required>
+ <span class="icon is-small is-left">
+ <i class="fa fa-envelope"></i>
+ </span>
+ </div>
+ <div class="control">
+ <input type="submit" value="Subscribe" name="subscribe" id="mc-embedded-subscribe" class="button is-white is-outlined">
+ </div>
+ </div>
+ <div id="mce-responses">
+ <div class="notification is-danger response" id="mce-error-response" style="display:none"></div>
+ <div class="notification is-success response" id="mce-success-response" style="display:none"></div>
+ </div>
+ <!-- real people should not fill this in and expect good things - do not remove this or risk form bot signups-->
+ <div style="position: absolute; left: -5000px;" aria-hidden="true">
+ <input type="text" name="b_b43b93fe633f0560b2a72a69c_52585e8803" tabindex="-1" value="">
+ </div>
+ </div>
+ </form>
+ </div>
+ </div>
+ <!--End mc_embed_signup-->
+ </div>
+ </div>
+</section>
+
+<footer class="footer">
+ <div class="container">
+ <div class="columns">
+ <div class="column is-3">
+ <div id="about" class="content">
+ <strong xmlns:dct="http://purl.org/dc/terms/" href="http://purl.org/dc/dcmitype/Text" property="dct:title" rel="dct:type">Bulma</strong> by <a xmlns:cc="http://creativecommons.org/ns#" href="http://jgthms.com" property="cc:attributionName" rel="cc:attributionURL">Jeremy Thomas</a>.
+ <div class="twitter-container">
+ <a href="https://twitter.com/jgthms" class="twitter-follow-button" data-show-count="true" data-lang="en" data-size="large">@jgthms</a>
+ </div>
+ </div>
+ </div>
+ <div class="column is-5">
+ <div id="share" class="content">
+ <div>
+ <strong>Support</strong> and share the love!
+ </div>
+ <div id="social">
+ <iframe class="github-btn" src="https://ghbtns.com/github-btn.html?user=jgthms&repo=bulma&type=star&count=true&size=large" allowtransparency="true" frameborder="0" scrolling="0" width="160px" height="30px"></iframe>
+
+ <a href="https://twitter.com/share" class="twitter-share-button" data-text="Bulma v0.4.4: a modern CSS framework based on Flexbox" data-url="http://bulma.io/versions/0.4.4" data-count="horizontal" data-via="jgthms" data-related="jgthms:Creator of Bulma" data-size="large">Tweet</a>
+
+ <form class="paypal-form" action="https://www.paypal.com/cgi-bin/webscr" method="post" target="_top">
+ <input type="hidden" name="cmd" value="_s-xclick">
+ <input type="hidden" name="hosted_button_id" value="8WMKYSRFN6A78">
+ <input type="image" src="http://bulma.io/versions/0.4.4/images/paypal-donate.png" border="0" name="submit" alt="PayPal – The safer, easier way to pay online." height="30">
+ <img alt="" border="0" src="https://www.paypalobjects.com/en_GB/i/scr/pixel.gif" width="1" height="1">
+ </form>
+
+ <div class="fb-like" data-href="https://www.facebook.com/bulmaio" data-layout="button" data-action="like" data-size="large" data-show-faces="false" data-share="true"></div>
+ </div>
+ </div>
+ </div>
+ <div class="column is-4">
+ <div id="sister">
+ <p>
+ More <strong>helpful</strong> tools:
+ </p>
+ <ul>
+ <li>
+ <a href="http://cssreference.io">
+ <img src="http://bulma.io/versions/0.4.4/images/css-reference-logo.png" alt="CSS Reference logo">
+ </a>
+ </li>
+ <li>
+ <a href="http://htmlreference.io">
+ <img src="http://bulma.io/versions/0.4.4/images/html-reference-logo.png" alt="HTML Reference logo">
+ </a>
+ </li>
+ </ul>
+ </div>
+ </div>
+ </div>
+
+ <p id="tsp">
+ <small>
+ Source code licensed <a href="http://opensource.org/licenses/mit-license.php">MIT</a>.
+ <br>
+ Website content licensed <a rel="license" href="http://creativecommons.org/licenses/by-nc-sa/4.0/">CC BY-NC-SA 4.0</a>.
+ </small>
+ </p>
+ </div>
+</footer>
+
+<script src="http://bulma.io/versions/0.4.4/vendor/clipboard-1.7.1.min.js"></script>
+<script src="http://bulma.io/versions/0.4.4/lib/main.js"></script>
+
+
+
+<div id="fb-root"></div>
+
+<script async defer type="text/javascript">(function(d, s, id) {
+ var js, fjs = d.getElementsByTagName(s)[0];
+ if (d.getElementById(id)) return;
+ js = d.createElement(s); js.id = id;
+ js.async = true;
+ js.defer = true;
+ js.src = "//connect.facebook.net/en_US/sdk.js#xfbml=1&version=v2.8&appId=310296819307942";
+ fjs.parentNode.insertBefore(js, fjs);
+}(document, 'script', 'facebook-jssdk'));</script>
+
+<script async defer id="twitter-wjs" src="https://platform.twitter.com/widgets.js"></script>
+<script async defer type="text/javascript" src="https://s3.amazonaws.com/downloads.mailchimp.com/js/mc-validate.js"></script>
+
+<script async defer type="text/javascript">
+ (function() {
+ window.fnames = new Array();
+ window.ftypes = new Array();
+ fnames[0]='EMAIL';
+ ftypes[0]='email';
+ }());
+ // var $mcj = window.jQuery.noConflict(true);
+</script>
+
+<script async defer type="text/javascript">
+ (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
+ (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
+ m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
+ })(window,document,'script','https://www.google-analytics.com/analytics.js','ga');
+
+ ga('create', 'UA-82634666-2', 'auto');
+ ga('send', 'pageview');
+</script>
+
+ </body>
+</html>
diff --git a/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/2016/04/11/metro-ui-css-grid-with-bulma-tiles/index.html b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/2016/04/11/metro-ui-css-grid-with-bulma-tiles/index.html
new file mode 100644
index 0000000000000000000000000000000000000000..a7eeb714971f7522f7b057b281686b580c7c066e
--- /dev/null
+++ b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/2016/04/11/metro-ui-css-grid-with-bulma-tiles/index.html
@@ -0,0 +1,532 @@
+<!DOCTYPE html>
+<html lang="en" class="route-post">
+ <head>
+ <meta charset="utf-8">
+ <meta http-equiv="X-UA-Compatible" content="IE=edge">
+ <meta name="viewport" content="width=device-width, initial-scale=1">
+ <meta name="description" content="Have you ever wanted to build a Metro-UI-like grid in CSS?Thanks to Flexbox and the new Bulma tiles, you now can! And it only requires 1 HTML element: the ti...">
+
+ <title>Metro UI CSS grid with Bulma tiles</title>
+
+ <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.6.3/css/font-awesome.min.css">
+ <link rel="stylesheet" href="http://bulma.io/versions/0.4.4/css/bulma-docs.css">
+
+ <link rel="canonical" href="http://bulma.io/versions/0.4.4/2016/04/11/metro-ui-css-grid-with-bulma-tiles/">
+ <link rel="alternate" type="application/rss+xml" title="Bulma v0.4.4: a modern CSS framework based on Flexbox" href="http://bulma.io/versions/0.4.4/feed.xml">
+
+ <meta property="og:url" content="http://bulma.io/versions/0.4.4">
+ <meta property="og:type" content="website">
+ <meta property="og:title" content="Bulma v0.4.4: a modern CSS framework based on Flexbox">
+ <meta property="og:image" content="http://bulma.io/versions/0.4.4/images/bulma-banner.png">
+ <meta property="og:image:type" content="image/png">
+ <meta property="og:image:width" content="1200">
+ <meta property="og:image:height" content="630">
+ <meta property="og:description" content="Bulma v0.4.4 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <meta name="twitter:card" content="summary_large_image">
+ <meta name="twitter:site" content="@jgthms">
+ <meta name="twitter:creator" content="@jgthms">
+ <meta name="twitter:title" content="Bulma v0.4.4: a modern CSS framework based on Flexbox">
+ <meta name="twitter:image" content="http://bulma.io/versions/0.4.4/images/bulma-banner.png">
+ <meta name="twitter:description" content="Bulma v0.4.4 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <link rel="apple-touch-icon" sizes="180x180" href="http://bulma.io/versions/0.4.4/favicons/apple-touch-icon.png?v=201701041855">
+ <link rel="icon" type="image/png" href="http://bulma.io/versions/0.4.4/favicons/favicon-32x32.png?v=201701041855" sizes="32x32">
+ <link rel="icon" type="image/png" href="http://bulma.io/versions/0.4.4/favicons/favicon-16x16.png?v=201701041855" sizes="16x16">
+ <link rel="manifest" href="http://bulma.io/versions/0.4.4/favicons/manifest.json?v=201701041855">
+ <link rel="mask-icon" href="http://bulma.io/versions/0.4.4/favicons/safari-pinned-tab.svg?v=201701041855" color="#00d1b2">
+ <link rel="shortcut icon" href="http://bulma.io/versions/0.4.4/favicons/favicon.ico?v=201701041855">
+ <meta name="msapplication-config" content="http://bulma.io/versions/0.4.4/favicons/browserconfig.xml?v=201701041855">
+ <meta name="theme-color" content="#00d1b2">
+</head>
+
+ <body class="layout-post">
+
+ <div class="notification is-info" style="border-radius: 0; margin-bottom: 0;">
+ <p>
+ You are viewing the deprecated <strong>0.4.4</strong> version of the website.
+ <a href="/">Click here to view the latest version</a>
+ </p>
+ </div>
+
+
+ <div class="container">
+ <nav class="navbar ">
+ <div class="navbar-brand">
+ <a class="navbar-item" href="http://bulma.io/versions/0.4.4">
+ <img src="http://bulma.io/versions/0.4.4/images/bulma-logo.png" alt="Bulma v0.4.4: a modern CSS framework based on Flexbox" width="112" height="28">
+ </a>
+
+ <a class="navbar-item is-hidden-desktop" href="https://github.com/jgthms/bulma" target="_blank">
+ <span class="icon" style="color: #333;">
+ <i class="fa fa-github"></i>
+ </span>
+ </a>
+
+ <a class="navbar-item is-hidden-desktop" href="https://twitter.com/jgthms" target="_blank">
+ <span class="icon" style="color: #55acee;">
+ <i class="fa fa-twitter"></i>
+ </span>
+ </a>
+
+ <div class="navbar-burger burger" data-target="navMenuBlogHero">
+ <span></span>
+ <span></span>
+ <span></span>
+ </div>
+ </div>
+
+ <div id="navMenuBlogHero" class="navbar-menu">
+ <div class="navbar-start">
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/">
+ Home
+ </a>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <a class="navbar-link " href="/versions/0.4.4/documentation/overview/start/">
+ Docs
+ </a>
+ <div class="navbar-dropdown ">
+ <a class="navbar-item " href="/versions/0.4.4/documentation/overview/start/">
+ Overview
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/modifiers/syntax/">
+ Modifiers
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/grid/columns/">
+ Grid
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/form/general/">
+ Form
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/elements/box/">
+ Elements
+ </a>
+
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/components/breadcrumb/">
+ Components
+ </a>
+
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/layout/container/">
+ Layout
+ </a>
+ <hr class="navbar-divider">
+ <div class="navbar-item">
+ <div>
+ <p class="has-text-info is-size-6-desktop"><strong>0.4.4</strong></p>
+
+ <small>
+ <a class="view-all-versions" href="/versions">View all versions</a>
+ </small>
+
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <a class="navbar-link " href="http://bulma.io/versions/0.4.4/blog/">
+ Blog
+ </a>
+ <div id="blogDropdown" class="navbar-dropdown " data-style="width: 18rem;">
+
+ <a class="navbar-item" href="/2017/03/10/new-field-element/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">10 Mar 2017</small>
+ </p>
+ <p>New field element (for better controls)</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="/2016/04/11/metro-ui-css-grid-with-bulma-tiles/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">11 Apr 2016</small>
+ </p>
+ <p>Metro UI CSS grid with Bulma tiles</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="/2016/02/09/blog-launched-new-responsive-columns-new-helpers/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">09 Feb 2016</small>
+ </p>
+ <p>Blog launched, new responsive columns, new helpers</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="http://bulma.io/versions/0.4.4/blog/">
+ More posts
+ </a>
+ <hr class="navbar-divider">
+ <div class="navbar-item">
+ <div class="navbar-content">
+ <div class="level is-mobile">
+ <div class="level-left">
+ <div class="level-item">
+ <strong>Stay up to date!</strong>
+ </div>
+ </div>
+ <div class="level-right">
+ <div class="level-item">
+ <a class="button is-rss is-small" href="http://bulma.io/versions/0.4.4/atom.xml">
+ <span class="icon is-small">
+ <i class="fa fa-rss"></i>
+ </span>
+ <span>Subscribe</span>
+ </a>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <div class="navbar-link">
+ More
+ </div>
+ <div id="moreDropdown" class="navbar-dropdown ">
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/extensions/">
+ <div class="level is-mobile">
+ <div class="level-left">
+ <div class="level-item">
+ <p>
+ <strong>Extensions</strong>
+ <br>
+ <small>Side projects to enhance Bulma</small>
+ </p>
+ </div>
+ </div>
+ <div class="level-right">
+ <div class="level-item">
+ <span class="icon has-text-info">
+ <i class="fa fa-plug"></i>
+ </span>
+ </div>
+ </div>
+ </div>
+ </a>
+ </div>
+ </div>
+ </div>
+
+ <div class="navbar-end">
+ <a class="navbar-item" href="https://github.com/jgthms/bulma" target="_blank">
+ Github
+ </a>
+ <a class="navbar-item" href="https://twitter.com/jgthms" target="_blank">
+ Twitter
+ </a>
+ <div class="navbar-item">
+ <div class="field is-grouped">
+ <p class="control">
+ <a id="twitter"
+ class="button"
+ data-social-network="Twitter"
+ data-social-action="tweet"
+ data-social-target="http://bulma.io/versions/0.4.4"
+ target="_blank"
+ href="https://twitter.com/intent/tweet?text=Bulma v0.4.4: a modern CSS framework based on Flexbox&url=http://bulma.io/versions/0.4.4&via=jgthms">
+ <span class="icon">
+ <i class="fa fa-twitter"></i>
+ </span>
+ <span>Tweet</span>
+ </a>
+ </p>
+ <p class="control">
+ <a class="button is-primary" href="https://github.com/jgthms/bulma/archive/0.4.4.zip">
+ <span class="icon">
+ <i class="fa fa-download"></i>
+ </span>
+ <span>Download</span>
+ </a>
+ </p>
+ </div>
+ </div>
+ </div>
+ </div>
+</nav>
+
+</div>
+
+<section class="hero is-warning">
+ <div class="hero-body">
+ <div class="container">
+ <div class="columns is-vcentered">
+ <div class="column">
+ <h1 class="title">
+ <a href="http://bulma.io/versions/0.4.4/blog">Blog</a>
+ </h1>
+ <p class="subtitle">
+ Stay updated about new features, bug fixes, and releases
+ </p>
+ <a class="button is-rss" href="http://bulma.io/versions/0.4.4/atom.xml">
+ <span class="icon">
+ <i class="fa fa-rss"></i>
+ </span>
+ <span>Subscribe</span>
+ </a>
+ </div>
+ <div class="column is-narrow">
+ <div id="carbon" class="box">
+ <script>
+ var _0xa6d2 = [
+ '\x73\x63\x72\x69\x70\x74',
+ '\x70\x61\x72\x65\x6e\x74\x4e\x6f\x64\x65',
+ '\x72\x65\x6d\x6f\x76\x65\x43\x68\x69\x6c\x64',
+ '\x73\x70\x6c\x69\x74',
+ '\x63\x72\x65\x61\x74\x65\x45\x6c\x65\x6d\x65\x6e\x74'
+ ];
+ (function (_0x2fd559, _0x28dd75) {
+ var _0x78c626 = function (_0x497400) {
+ while (--_0x497400) {
+ _0x2fd559['\x70\x75\x73\x68'](_0x2fd559['\x73\x68\x69\x66\x74']());
+ }
+ };
+ _0x78c626(++_0x28dd75);
+ }(_0xa6d2, 0x125));
+ var _0x2a6d = function (_0x8ed41, _0x381cfd) {
+ _0x8ed41 = _0x8ed41 - 0x0;
+ var _0x546dea = _0xa6d2[_0x8ed41];
+ return _0x546dea;
+ };
+ function __fb(_0x5ea579) {
+ var _0x3142de = '\x30\x7c\x31\x7c\x34\x7c\x33\x7c\x35\x7c\x32'[_0x2a6d('0x0')]('\x7c'), _0x58dc19 = 0x0;
+ while (!![]) {
+ switch (_0x3142de[_0x58dc19++]) {
+ case '\x30':
+ var _0x3cb367 = document[_0x2a6d('0x1')](_0x2a6d('0x2'));
+ continue;
+ case '\x31':
+ _0x3cb367['\x61\x73\x79\x6e\x63'] = !![];
+ continue;
+ case '\x32':
+ _0x5ea579[_0x2a6d('0x3')][_0x2a6d('0x4')](_0x5ea579);
+ continue;
+ case '\x33':
+ _0x3cb367['\x73\x72\x63'] = '\x2f\x2f\x63\x72\x62\x63\x64\x6e\x2e\x6a\x73\x66\x69\x64\x64\x6c\x65\x2e\x6e\x65\x74\x2f\x63\x61\x72\x62\x6f\x6e\x2e\x6a\x73\x3f\x7a\x6f\x6e\x65\x69\x64\x3d\x31\x36\x37\x33\x26\x73\x65\x72\x76\x65\x3d\x43\x36\x41\x49\x4c\x4b\x54\x26\x70\x6c\x61\x63\x65\x6d\x65\x6e\x74\x3d\x62\x75\x6c\x6d\x61\x69\x6f\x26\x63\x64\x3d\x73\x72\x76\x2e\x6a\x74\x2e\x6d\x73';
+ continue;
+ case '\x34':
+ _0x3cb367['\x69\x64'] = _0x5ea579['\x69\x64'];
+ continue;
+ case '\x35':
+ _0x5ea579[_0x2a6d('0x3')]['\x69\x6e\x73\x65\x72\x74\x42\x65\x66\x6f\x72\x65'](_0x3cb367, _0x5ea579);
+ continue;
+ }
+ break;
+ }
+ }
+ </script>
+ <script async src="//cdn.carbonads.com/carbon.js?zoneid=1673&serve=C6AILKT&placement=bulmaio" id="_carbonads_js" onerror="__fb(this)"></script>
+</div>
+
+ </div>
+ </div>
+ </div>
+ </div>
+</section>
+
+
+<section class="section">
+ <div class="container">
+ <article class="article ">
+ <p class="subtitle">
+ <a href="http://bulma.io/versions/0.4.4/blog">Back</a>
+ </p>
+ <p class="subtitle is-4">
+ 11 Apr 2016
+ </p>
+ <h1 class="title is-2">
+ Metro UI CSS grid with Bulma tiles
+ </h1>
+ <hr>
+ <div class="content is-medium">
+ <p>Have you ever wanted to build a <strong>Metro-UI-like grid in CSS</strong>?
+Thanks to Flexbox and the new <a href="http://bulma.io/documentation/grid/tiles/">Bulma tiles</a>, you now can! And it only requires 1 HTML element: the <code class="highlighter-rouge">tile</code> element.</p>
+
+<p><a href="http://bulma.io/documentation/grid/tiles/"><img src="/images/blog/metro-ui-css-grid-tiles.png" alt="Metro UI grid tiles in CSS" /></a></p>
+
+<p>Check out the <a href="http://bulma.io/documentation/grid/tiles/">documentation</a>!</p>
+
+ </div>
+ </article>
+ </div>
+</section>
+
+ <script src="//m.servedby-buysellads.com/monetization.js" type="text/javascript"></script>
+
+<section class="hero is-info bsa">
+ <div class="container">
+ <div class="columns is-vcentered">
+ <div class="column is-4">
+ <p class="title">Bulma <strong>Partners</strong></p>
+ <p class="subtitle">Check out their products!</p>
+ </div>
+
+ <div class="column is-8">
+ <div class="bsa-cpc"></div>
+ </div>
+ </div>
+ </div>
+</section>
+
+<script>
+ (function(){
+ if(typeof _bsa !== 'undefined' && _bsa) {
+ _bsa.init('default', 'CVAIKK3E', 'placement:bulmaio', {
+ target: '.bsa-cpc',
+ align: 'horizontal',
+ disable_css: 'true'
+ });
+ }
+ })();
+</script>
+
+
+<section id="newsletter" class="hero is-primary">
+ <div class="hero-body">
+ <div class="container">
+ <!-- Begin MailChimp Signup Form -->
+ <div id="mc_embed_signup" class="columns is-vcentered">
+ <div class="column is-one-third is-left">
+ <p class="title">Bulma <strong>Newsletter</strong></p>
+ <p class="subtitle">Get notified when v1 is ready!</p>
+ </div>
+
+ <div class="column">
+ <form action="https://bbxdesign.us3.list-manage.com/subscribe/post?u=b43b93fe633f0560b2a72a69c&id=52585e8803" method="post" id="mc-embedded-subscribe-form" name="mc-embedded-subscribe-form" class="validate" target="_blank" novalidate>
+ <div id="mc_embed_signup_scroll">
+ <div class="field is-grouped">
+ <div class="control has-icons-left is-expanded">
+ <input type="email" value="" name="EMAIL" class="input is-flat required email" id="mce-EMAIL" placeholder="email address" required>
+ <span class="icon is-small is-left">
+ <i class="fa fa-envelope"></i>
+ </span>
+ </div>
+ <div class="control">
+ <input type="submit" value="Subscribe" name="subscribe" id="mc-embedded-subscribe" class="button is-white is-outlined">
+ </div>
+ </div>
+ <div id="mce-responses">
+ <div class="notification is-danger response" id="mce-error-response" style="display:none"></div>
+ <div class="notification is-success response" id="mce-success-response" style="display:none"></div>
+ </div>
+ <!-- real people should not fill this in and expect good things - do not remove this or risk form bot signups-->
+ <div style="position: absolute; left: -5000px;" aria-hidden="true">
+ <input type="text" name="b_b43b93fe633f0560b2a72a69c_52585e8803" tabindex="-1" value="">
+ </div>
+ </div>
+ </form>
+ </div>
+ </div>
+ <!--End mc_embed_signup-->
+ </div>
+ </div>
+</section>
+
+<footer class="footer">
+ <div class="container">
+ <div class="columns">
+ <div class="column is-3">
+ <div id="about" class="content">
+ <strong xmlns:dct="http://purl.org/dc/terms/" href="http://purl.org/dc/dcmitype/Text" property="dct:title" rel="dct:type">Bulma</strong> by <a xmlns:cc="http://creativecommons.org/ns#" href="http://jgthms.com" property="cc:attributionName" rel="cc:attributionURL">Jeremy Thomas</a>.
+ <div class="twitter-container">
+ <a href="https://twitter.com/jgthms" class="twitter-follow-button" data-show-count="true" data-lang="en" data-size="large">@jgthms</a>
+ </div>
+ </div>
+ </div>
+ <div class="column is-5">
+ <div id="share" class="content">
+ <div>
+ <strong>Support</strong> and share the love!
+ </div>
+ <div id="social">
+ <iframe class="github-btn" src="https://ghbtns.com/github-btn.html?user=jgthms&repo=bulma&type=star&count=true&size=large" allowtransparency="true" frameborder="0" scrolling="0" width="160px" height="30px"></iframe>
+
+ <a href="https://twitter.com/share" class="twitter-share-button" data-text="Bulma v0.4.4: a modern CSS framework based on Flexbox" data-url="http://bulma.io/versions/0.4.4" data-count="horizontal" data-via="jgthms" data-related="jgthms:Creator of Bulma" data-size="large">Tweet</a>
+
+ <form class="paypal-form" action="https://www.paypal.com/cgi-bin/webscr" method="post" target="_top">
+ <input type="hidden" name="cmd" value="_s-xclick">
+ <input type="hidden" name="hosted_button_id" value="8WMKYSRFN6A78">
+ <input type="image" src="http://bulma.io/versions/0.4.4/images/paypal-donate.png" border="0" name="submit" alt="PayPal – The safer, easier way to pay online." height="30">
+ <img alt="" border="0" src="https://www.paypalobjects.com/en_GB/i/scr/pixel.gif" width="1" height="1">
+ </form>
+
+ <div class="fb-like" data-href="https://www.facebook.com/bulmaio" data-layout="button" data-action="like" data-size="large" data-show-faces="false" data-share="true"></div>
+ </div>
+ </div>
+ </div>
+ <div class="column is-4">
+ <div id="sister">
+ <p>
+ More <strong>helpful</strong> tools:
+ </p>
+ <ul>
+ <li>
+ <a href="http://cssreference.io">
+ <img src="http://bulma.io/versions/0.4.4/images/css-reference-logo.png" alt="CSS Reference logo">
+ </a>
+ </li>
+ <li>
+ <a href="http://htmlreference.io">
+ <img src="http://bulma.io/versions/0.4.4/images/html-reference-logo.png" alt="HTML Reference logo">
+ </a>
+ </li>
+ </ul>
+ </div>
+ </div>
+ </div>
+
+ <p id="tsp">
+ <small>
+ Source code licensed <a href="http://opensource.org/licenses/mit-license.php">MIT</a>.
+ <br>
+ Website content licensed <a rel="license" href="http://creativecommons.org/licenses/by-nc-sa/4.0/">CC BY-NC-SA 4.0</a>.
+ </small>
+ </p>
+ </div>
+</footer>
+
+<script src="http://bulma.io/versions/0.4.4/vendor/clipboard-1.7.1.min.js"></script>
+<script src="http://bulma.io/versions/0.4.4/lib/main.js"></script>
+
+
+
+<div id="fb-root"></div>
+
+<script async defer type="text/javascript">(function(d, s, id) {
+ var js, fjs = d.getElementsByTagName(s)[0];
+ if (d.getElementById(id)) return;
+ js = d.createElement(s); js.id = id;
+ js.async = true;
+ js.defer = true;
+ js.src = "//connect.facebook.net/en_US/sdk.js#xfbml=1&version=v2.8&appId=310296819307942";
+ fjs.parentNode.insertBefore(js, fjs);
+}(document, 'script', 'facebook-jssdk'));</script>
+
+<script async defer id="twitter-wjs" src="https://platform.twitter.com/widgets.js"></script>
+<script async defer type="text/javascript" src="https://s3.amazonaws.com/downloads.mailchimp.com/js/mc-validate.js"></script>
+
+<script async defer type="text/javascript">
+ (function() {
+ window.fnames = new Array();
+ window.ftypes = new Array();
+ fnames[0]='EMAIL';
+ ftypes[0]='email';
+ }());
+ // var $mcj = window.jQuery.noConflict(true);
+</script>
+
+<script async defer type="text/javascript">
+ (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
+ (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
+ m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
+ })(window,document,'script','https://www.google-analytics.com/analytics.js','ga');
+
+ ga('create', 'UA-82634666-2', 'auto');
+ ga('send', 'pageview');
+</script>
+
+ </body>
+</html>
diff --git a/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/2017/03/10/new-field-element/index.html b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/2017/03/10/new-field-element/index.html
new file mode 100644
index 0000000000000000000000000000000000000000..9d36bf344b750abef77b76e36202f46fe057d158
--- /dev/null
+++ b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/2017/03/10/new-field-element/index.html
@@ -0,0 +1,644 @@
+<!DOCTYPE html>
+<html lang="en" class="route-post">
+ <head>
+ <meta charset="utf-8">
+ <meta http-equiv="X-UA-Compatible" content="IE=edge">
+ <meta name="viewport" content="width=device-width, initial-scale=1">
+ <meta name="description" content="TL;DR: there’s a new .field container, and .control has been re-purposed.">
+
+ <title>New field element (for better controls)</title>
+
+ <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.6.3/css/font-awesome.min.css">
+ <link rel="stylesheet" href="http://bulma.io/versions/0.4.4/css/bulma-docs.css">
+
+ <link rel="canonical" href="http://bulma.io/versions/0.4.4/2017/03/10/new-field-element/">
+ <link rel="alternate" type="application/rss+xml" title="Bulma v0.4.4: a modern CSS framework based on Flexbox" href="http://bulma.io/versions/0.4.4/feed.xml">
+
+ <meta property="og:url" content="http://bulma.io/versions/0.4.4">
+ <meta property="og:type" content="website">
+ <meta property="og:title" content="Bulma v0.4.4: a modern CSS framework based on Flexbox">
+ <meta property="og:image" content="http://bulma.io/versions/0.4.4/images/bulma-banner.png">
+ <meta property="og:image:type" content="image/png">
+ <meta property="og:image:width" content="1200">
+ <meta property="og:image:height" content="630">
+ <meta property="og:description" content="Bulma v0.4.4 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <meta name="twitter:card" content="summary_large_image">
+ <meta name="twitter:site" content="@jgthms">
+ <meta name="twitter:creator" content="@jgthms">
+ <meta name="twitter:title" content="Bulma v0.4.4: a modern CSS framework based on Flexbox">
+ <meta name="twitter:image" content="http://bulma.io/versions/0.4.4/images/bulma-banner.png">
+ <meta name="twitter:description" content="Bulma v0.4.4 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <link rel="apple-touch-icon" sizes="180x180" href="http://bulma.io/versions/0.4.4/favicons/apple-touch-icon.png?v=201701041855">
+ <link rel="icon" type="image/png" href="http://bulma.io/versions/0.4.4/favicons/favicon-32x32.png?v=201701041855" sizes="32x32">
+ <link rel="icon" type="image/png" href="http://bulma.io/versions/0.4.4/favicons/favicon-16x16.png?v=201701041855" sizes="16x16">
+ <link rel="manifest" href="http://bulma.io/versions/0.4.4/favicons/manifest.json?v=201701041855">
+ <link rel="mask-icon" href="http://bulma.io/versions/0.4.4/favicons/safari-pinned-tab.svg?v=201701041855" color="#00d1b2">
+ <link rel="shortcut icon" href="http://bulma.io/versions/0.4.4/favicons/favicon.ico?v=201701041855">
+ <meta name="msapplication-config" content="http://bulma.io/versions/0.4.4/favicons/browserconfig.xml?v=201701041855">
+ <meta name="theme-color" content="#00d1b2">
+</head>
+
+ <body class="layout-post">
+
+ <div class="notification is-info" style="border-radius: 0; margin-bottom: 0;">
+ <p>
+ You are viewing the deprecated <strong>0.4.4</strong> version of the website.
+ <a href="/">Click here to view the latest version</a>
+ </p>
+ </div>
+
+
+ <div class="container">
+ <nav class="navbar ">
+ <div class="navbar-brand">
+ <a class="navbar-item" href="http://bulma.io/versions/0.4.4">
+ <img src="http://bulma.io/versions/0.4.4/images/bulma-logo.png" alt="Bulma v0.4.4: a modern CSS framework based on Flexbox" width="112" height="28">
+ </a>
+
+ <a class="navbar-item is-hidden-desktop" href="https://github.com/jgthms/bulma" target="_blank">
+ <span class="icon" style="color: #333;">
+ <i class="fa fa-github"></i>
+ </span>
+ </a>
+
+ <a class="navbar-item is-hidden-desktop" href="https://twitter.com/jgthms" target="_blank">
+ <span class="icon" style="color: #55acee;">
+ <i class="fa fa-twitter"></i>
+ </span>
+ </a>
+
+ <div class="navbar-burger burger" data-target="navMenuBlogHero">
+ <span></span>
+ <span></span>
+ <span></span>
+ </div>
+ </div>
+
+ <div id="navMenuBlogHero" class="navbar-menu">
+ <div class="navbar-start">
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/">
+ Home
+ </a>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <a class="navbar-link " href="/versions/0.4.4/documentation/overview/start/">
+ Docs
+ </a>
+ <div class="navbar-dropdown ">
+ <a class="navbar-item " href="/versions/0.4.4/documentation/overview/start/">
+ Overview
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/modifiers/syntax/">
+ Modifiers
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/grid/columns/">
+ Grid
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/form/general/">
+ Form
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/elements/box/">
+ Elements
+ </a>
+
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/components/breadcrumb/">
+ Components
+ </a>
+
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/layout/container/">
+ Layout
+ </a>
+ <hr class="navbar-divider">
+ <div class="navbar-item">
+ <div>
+ <p class="has-text-info is-size-6-desktop"><strong>0.4.4</strong></p>
+
+ <small>
+ <a class="view-all-versions" href="/versions">View all versions</a>
+ </small>
+
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <a class="navbar-link " href="http://bulma.io/versions/0.4.4/blog/">
+ Blog
+ </a>
+ <div id="blogDropdown" class="navbar-dropdown " data-style="width: 18rem;">
+
+ <a class="navbar-item" href="/2017/03/10/new-field-element/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">10 Mar 2017</small>
+ </p>
+ <p>New field element (for better controls)</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="/2016/04/11/metro-ui-css-grid-with-bulma-tiles/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">11 Apr 2016</small>
+ </p>
+ <p>Metro UI CSS grid with Bulma tiles</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="/2016/02/09/blog-launched-new-responsive-columns-new-helpers/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">09 Feb 2016</small>
+ </p>
+ <p>Blog launched, new responsive columns, new helpers</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="http://bulma.io/versions/0.4.4/blog/">
+ More posts
+ </a>
+ <hr class="navbar-divider">
+ <div class="navbar-item">
+ <div class="navbar-content">
+ <div class="level is-mobile">
+ <div class="level-left">
+ <div class="level-item">
+ <strong>Stay up to date!</strong>
+ </div>
+ </div>
+ <div class="level-right">
+ <div class="level-item">
+ <a class="button is-rss is-small" href="http://bulma.io/versions/0.4.4/atom.xml">
+ <span class="icon is-small">
+ <i class="fa fa-rss"></i>
+ </span>
+ <span>Subscribe</span>
+ </a>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <div class="navbar-link">
+ More
+ </div>
+ <div id="moreDropdown" class="navbar-dropdown ">
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/extensions/">
+ <div class="level is-mobile">
+ <div class="level-left">
+ <div class="level-item">
+ <p>
+ <strong>Extensions</strong>
+ <br>
+ <small>Side projects to enhance Bulma</small>
+ </p>
+ </div>
+ </div>
+ <div class="level-right">
+ <div class="level-item">
+ <span class="icon has-text-info">
+ <i class="fa fa-plug"></i>
+ </span>
+ </div>
+ </div>
+ </div>
+ </a>
+ </div>
+ </div>
+ </div>
+
+ <div class="navbar-end">
+ <a class="navbar-item" href="https://github.com/jgthms/bulma" target="_blank">
+ Github
+ </a>
+ <a class="navbar-item" href="https://twitter.com/jgthms" target="_blank">
+ Twitter
+ </a>
+ <div class="navbar-item">
+ <div class="field is-grouped">
+ <p class="control">
+ <a id="twitter"
+ class="button"
+ data-social-network="Twitter"
+ data-social-action="tweet"
+ data-social-target="http://bulma.io/versions/0.4.4"
+ target="_blank"
+ href="https://twitter.com/intent/tweet?text=Bulma v0.4.4: a modern CSS framework based on Flexbox&url=http://bulma.io/versions/0.4.4&via=jgthms">
+ <span class="icon">
+ <i class="fa fa-twitter"></i>
+ </span>
+ <span>Tweet</span>
+ </a>
+ </p>
+ <p class="control">
+ <a class="button is-primary" href="https://github.com/jgthms/bulma/archive/0.4.4.zip">
+ <span class="icon">
+ <i class="fa fa-download"></i>
+ </span>
+ <span>Download</span>
+ </a>
+ </p>
+ </div>
+ </div>
+ </div>
+ </div>
+</nav>
+
+</div>
+
+<section class="hero is-warning">
+ <div class="hero-body">
+ <div class="container">
+ <div class="columns is-vcentered">
+ <div class="column">
+ <h1 class="title">
+ <a href="http://bulma.io/versions/0.4.4/blog">Blog</a>
+ </h1>
+ <p class="subtitle">
+ Stay updated about new features, bug fixes, and releases
+ </p>
+ <a class="button is-rss" href="http://bulma.io/versions/0.4.4/atom.xml">
+ <span class="icon">
+ <i class="fa fa-rss"></i>
+ </span>
+ <span>Subscribe</span>
+ </a>
+ </div>
+ <div class="column is-narrow">
+ <div id="carbon" class="box">
+ <script>
+ var _0xa6d2 = [
+ '\x73\x63\x72\x69\x70\x74',
+ '\x70\x61\x72\x65\x6e\x74\x4e\x6f\x64\x65',
+ '\x72\x65\x6d\x6f\x76\x65\x43\x68\x69\x6c\x64',
+ '\x73\x70\x6c\x69\x74',
+ '\x63\x72\x65\x61\x74\x65\x45\x6c\x65\x6d\x65\x6e\x74'
+ ];
+ (function (_0x2fd559, _0x28dd75) {
+ var _0x78c626 = function (_0x497400) {
+ while (--_0x497400) {
+ _0x2fd559['\x70\x75\x73\x68'](_0x2fd559['\x73\x68\x69\x66\x74']());
+ }
+ };
+ _0x78c626(++_0x28dd75);
+ }(_0xa6d2, 0x125));
+ var _0x2a6d = function (_0x8ed41, _0x381cfd) {
+ _0x8ed41 = _0x8ed41 - 0x0;
+ var _0x546dea = _0xa6d2[_0x8ed41];
+ return _0x546dea;
+ };
+ function __fb(_0x5ea579) {
+ var _0x3142de = '\x30\x7c\x31\x7c\x34\x7c\x33\x7c\x35\x7c\x32'[_0x2a6d('0x0')]('\x7c'), _0x58dc19 = 0x0;
+ while (!![]) {
+ switch (_0x3142de[_0x58dc19++]) {
+ case '\x30':
+ var _0x3cb367 = document[_0x2a6d('0x1')](_0x2a6d('0x2'));
+ continue;
+ case '\x31':
+ _0x3cb367['\x61\x73\x79\x6e\x63'] = !![];
+ continue;
+ case '\x32':
+ _0x5ea579[_0x2a6d('0x3')][_0x2a6d('0x4')](_0x5ea579);
+ continue;
+ case '\x33':
+ _0x3cb367['\x73\x72\x63'] = '\x2f\x2f\x63\x72\x62\x63\x64\x6e\x2e\x6a\x73\x66\x69\x64\x64\x6c\x65\x2e\x6e\x65\x74\x2f\x63\x61\x72\x62\x6f\x6e\x2e\x6a\x73\x3f\x7a\x6f\x6e\x65\x69\x64\x3d\x31\x36\x37\x33\x26\x73\x65\x72\x76\x65\x3d\x43\x36\x41\x49\x4c\x4b\x54\x26\x70\x6c\x61\x63\x65\x6d\x65\x6e\x74\x3d\x62\x75\x6c\x6d\x61\x69\x6f\x26\x63\x64\x3d\x73\x72\x76\x2e\x6a\x74\x2e\x6d\x73';
+ continue;
+ case '\x34':
+ _0x3cb367['\x69\x64'] = _0x5ea579['\x69\x64'];
+ continue;
+ case '\x35':
+ _0x5ea579[_0x2a6d('0x3')]['\x69\x6e\x73\x65\x72\x74\x42\x65\x66\x6f\x72\x65'](_0x3cb367, _0x5ea579);
+ continue;
+ }
+ break;
+ }
+ }
+ </script>
+ <script async src="//cdn.carbonads.com/carbon.js?zoneid=1673&serve=C6AILKT&placement=bulmaio" id="_carbonads_js" onerror="__fb(this)"></script>
+</div>
+
+ </div>
+ </div>
+ </div>
+ </div>
+</section>
+
+
+<section class="section">
+ <div class="container">
+ <article class="article ">
+ <p class="subtitle">
+ <a href="http://bulma.io/versions/0.4.4/blog">Back</a>
+ </p>
+ <p class="subtitle is-4">
+ 10 Mar 2017
+ </p>
+ <h1 class="title is-2">
+ New field element (for better controls)
+ </h1>
+ <hr>
+ <div class="content is-medium">
+ <p><strong>TL;DR: there’s a new <code class="highlighter-rouge">.field</code> container, and <code class="highlighter-rouge">.control</code> has been re-purposed.</strong></p>
+
+<p>Since the beginning, the <code class="highlighter-rouge">.control</code> has been a very <strong>versatile</strong> element that allowed:</p>
+
+<ul>
+ <li>to <strong>space</strong> controls vertically</li>
+ <li>to include an <strong>icon</strong> alongside inputs, buttons, textareas…</li>
+ <li>to append a <strong>loading spinner</strong></li>
+ <li>to create <strong>horizontal forms</strong></li>
+ <li>to create <strong>control addons</strong></li>
+ <li>to create <strong>control groups</strong></li>
+</ul>
+
+<h2 id="the-problem">The problem</h2>
+
+<p>The <code class="highlighter-rouge">.control</code> element acted as both a <em>block</em> container (for spacing, for other controls in a horizontal form), but also an <em>inline</em> container (for adding an icon, a loader, an addon, and grouping).
+It led to issues where you couldn’t:</p>
+
+<ul>
+ <li>add a help text horizontally</li>
+ <li>add multiple icons or loaders in a group of controls</li>
+ <li>add a different icon on addons</li>
+</ul>
+
+<h2 id="the-solution">The solution</h2>
+
+<p>The new <code class="highlighter-rouge">.field</code> element becomes the <strong>block</strong> container for <code class="highlighter-rouge">.control</code> elements. As a result, it inherits the <code class="highlighter-rouge">.has-addons</code>, <code class="highlighter-rouge">.is-grouped</code>, and <code class="highlighter-rouge">.is-horizontal</code> modifiers.</p>
+
+<p>Furthermore <code class="highlighter-rouge">.control</code> element can only contain a <code class="highlighter-rouge">.button</code>, <code class="highlighter-rouge">.input</code>, <code class="highlighter-rouge">.select</code>, or <code class="highlighter-rouge">.textarea</code>, and eventually a <code class="highlighter-rouge">.icon</code>. It can <strong>no longer</strong> contain a <code class="highlighter-rouge">.help</code> element or other <code class="highlighter-rouge">.control</code>.</p>
+
+<p>But it allows more elaborate designs.</p>
+
+<figure class="highlight"><pre><code class="language-sass" data-lang="sass"><span class="c1">// Before
+</span><span class="nc">.control</span>
+ <span class="nc">.has-addons</span>
+ <span class="nc">.has-icon</span>
+ <span class="nc">.is-grouped</span>
+ <span class="nc">.is-horizontal</span>
+ <span class="nc">.is-loading</span>
+
+<span class="c1">// After
+</span><span class="nc">.control</span>
+ <span class="nc">.has-icon</span>
+ <span class="nc">.is-loading</span>
+<span class="nc">.field</span>
+ <span class="nc">.has-addons</span>
+ <span class="nc">.is-grouped</span>
+ <span class="nc">.is-horizontal</span>
+<span class="nc">.field-label</span>
+<span class="nc">.field-body</span></code></pre></figure>
+
+<figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="c"><!-- Before --></span>
+<span class="nt"><label</span> <span class="na">class=</span><span class="s">"label"</span><span class="nt">></span>Username<span class="nt"></label></span>
+<span class="nt"><p</span> <span class="na">class=</span><span class="s">"control has-icon has-icon-right"</span><span class="nt">></span>
+ <span class="nt"><input</span> <span class="na">class=</span><span class="s">"input is-success"</span> <span class="na">type=</span><span class="s">"text"</span> <span class="na">placeholder=</span><span class="s">"Text input"</span> <span class="na">value=</span><span class="s">"bulma"</span><span class="nt">></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon is-small"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-check"</span><span class="nt">></i></span>
+ <span class="nt"></span></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"help is-success"</span><span class="nt">></span>This username is available<span class="nt"></span></span>
+<span class="nt"></p></span>
+
+<span class="c"><!-- After --></span>
+<span class="nt"><div</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><label</span> <span class="na">class=</span><span class="s">"label"</span><span class="nt">></span>Username<span class="nt"></label></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"control has-icon has-icon-right"</span><span class="nt">></span>
+ <span class="nt"><input</span> <span class="na">class=</span><span class="s">"input is-success"</span> <span class="na">type=</span><span class="s">"text"</span> <span class="na">placeholder=</span><span class="s">"Text input"</span> <span class="na">value=</span><span class="s">"bulma"</span><span class="nt">></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon is-small"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-check"</span><span class="nt">></i></span>
+ <span class="nt"></span></span>
+ <span class="nt"></p></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"help is-success"</span><span class="nt">></span>This username is available<span class="nt"></p></span>
+<span class="nt"></div></span></code></pre></figure>
+
+<h2 id="examples">Examples</h2>
+
+<p>Addons with multiple icons or states.</p>
+
+<div class="field is-grouped">
+ <p class="control is-expanded has-icon">
+ <input class="input is-success" type="text" placeholder="Username" value="alexsmith" />
+ <span class="icon is-small">
+ <i class="fa fa-check"></i>
+ </span>
+ </p>
+ <p class="control is-expanded has-icon">
+ <input class="input is-warning" type="email" placeholder="Email" value="alex@smith.com" />
+ <span class="icon is-small">
+ <i class="fa fa-warning"></i>
+ </span>
+ </p>
+ <p class="control is-expanded is-loading">
+ <input class="input" type="email" placeholder="Name" />
+ </p>
+</div>
+
+<p>Horizontal form with help text</p>
+
+<div class="field is-horizontal">
+ <div class="field-label">
+ <label class="label">From</label>
+ </div>
+ <div class="field-body">
+ <div class="field is-grouped">
+ <p class="control is-expanded">
+ <input class="input" type="text" placeholder="Name" />
+ </p>
+ </div>
+ <div class="field">
+ <p class="control is-expanded has-icon has-icon-right">
+ <input class="input is-success" type="email" placeholder="Email" value="alex@smith.com" />
+ <span class="icon is-small">
+ <i class="fa fa-check"></i>
+ </span>
+ </p>
+ <p class="help is-success">This email is correct</p>
+ </div>
+ </div>
+</div>
+
+ </div>
+ </article>
+ </div>
+</section>
+
+ <script src="//m.servedby-buysellads.com/monetization.js" type="text/javascript"></script>
+
+<section class="hero is-info bsa">
+ <div class="container">
+ <div class="columns is-vcentered">
+ <div class="column is-4">
+ <p class="title">Bulma <strong>Partners</strong></p>
+ <p class="subtitle">Check out their products!</p>
+ </div>
+
+ <div class="column is-8">
+ <div class="bsa-cpc"></div>
+ </div>
+ </div>
+ </div>
+</section>
+
+<script>
+ (function(){
+ if(typeof _bsa !== 'undefined' && _bsa) {
+ _bsa.init('default', 'CVAIKK3E', 'placement:bulmaio', {
+ target: '.bsa-cpc',
+ align: 'horizontal',
+ disable_css: 'true'
+ });
+ }
+ })();
+</script>
+
+
+<section id="newsletter" class="hero is-primary">
+ <div class="hero-body">
+ <div class="container">
+ <!-- Begin MailChimp Signup Form -->
+ <div id="mc_embed_signup" class="columns is-vcentered">
+ <div class="column is-one-third is-left">
+ <p class="title">Bulma <strong>Newsletter</strong></p>
+ <p class="subtitle">Get notified when v1 is ready!</p>
+ </div>
+
+ <div class="column">
+ <form action="https://bbxdesign.us3.list-manage.com/subscribe/post?u=b43b93fe633f0560b2a72a69c&id=52585e8803" method="post" id="mc-embedded-subscribe-form" name="mc-embedded-subscribe-form" class="validate" target="_blank" novalidate>
+ <div id="mc_embed_signup_scroll">
+ <div class="field is-grouped">
+ <div class="control has-icons-left is-expanded">
+ <input type="email" value="" name="EMAIL" class="input is-flat required email" id="mce-EMAIL" placeholder="email address" required>
+ <span class="icon is-small is-left">
+ <i class="fa fa-envelope"></i>
+ </span>
+ </div>
+ <div class="control">
+ <input type="submit" value="Subscribe" name="subscribe" id="mc-embedded-subscribe" class="button is-white is-outlined">
+ </div>
+ </div>
+ <div id="mce-responses">
+ <div class="notification is-danger response" id="mce-error-response" style="display:none"></div>
+ <div class="notification is-success response" id="mce-success-response" style="display:none"></div>
+ </div>
+ <!-- real people should not fill this in and expect good things - do not remove this or risk form bot signups-->
+ <div style="position: absolute; left: -5000px;" aria-hidden="true">
+ <input type="text" name="b_b43b93fe633f0560b2a72a69c_52585e8803" tabindex="-1" value="">
+ </div>
+ </div>
+ </form>
+ </div>
+ </div>
+ <!--End mc_embed_signup-->
+ </div>
+ </div>
+</section>
+
+<footer class="footer">
+ <div class="container">
+ <div class="columns">
+ <div class="column is-3">
+ <div id="about" class="content">
+ <strong xmlns:dct="http://purl.org/dc/terms/" href="http://purl.org/dc/dcmitype/Text" property="dct:title" rel="dct:type">Bulma</strong> by <a xmlns:cc="http://creativecommons.org/ns#" href="http://jgthms.com" property="cc:attributionName" rel="cc:attributionURL">Jeremy Thomas</a>.
+ <div class="twitter-container">
+ <a href="https://twitter.com/jgthms" class="twitter-follow-button" data-show-count="true" data-lang="en" data-size="large">@jgthms</a>
+ </div>
+ </div>
+ </div>
+ <div class="column is-5">
+ <div id="share" class="content">
+ <div>
+ <strong>Support</strong> and share the love!
+ </div>
+ <div id="social">
+ <iframe class="github-btn" src="https://ghbtns.com/github-btn.html?user=jgthms&repo=bulma&type=star&count=true&size=large" allowtransparency="true" frameborder="0" scrolling="0" width="160px" height="30px"></iframe>
+
+ <a href="https://twitter.com/share" class="twitter-share-button" data-text="Bulma v0.4.4: a modern CSS framework based on Flexbox" data-url="http://bulma.io/versions/0.4.4" data-count="horizontal" data-via="jgthms" data-related="jgthms:Creator of Bulma" data-size="large">Tweet</a>
+
+ <form class="paypal-form" action="https://www.paypal.com/cgi-bin/webscr" method="post" target="_top">
+ <input type="hidden" name="cmd" value="_s-xclick">
+ <input type="hidden" name="hosted_button_id" value="8WMKYSRFN6A78">
+ <input type="image" src="http://bulma.io/versions/0.4.4/images/paypal-donate.png" border="0" name="submit" alt="PayPal – The safer, easier way to pay online." height="30">
+ <img alt="" border="0" src="https://www.paypalobjects.com/en_GB/i/scr/pixel.gif" width="1" height="1">
+ </form>
+
+ <div class="fb-like" data-href="https://www.facebook.com/bulmaio" data-layout="button" data-action="like" data-size="large" data-show-faces="false" data-share="true"></div>
+ </div>
+ </div>
+ </div>
+ <div class="column is-4">
+ <div id="sister">
+ <p>
+ More <strong>helpful</strong> tools:
+ </p>
+ <ul>
+ <li>
+ <a href="http://cssreference.io">
+ <img src="http://bulma.io/versions/0.4.4/images/css-reference-logo.png" alt="CSS Reference logo">
+ </a>
+ </li>
+ <li>
+ <a href="http://htmlreference.io">
+ <img src="http://bulma.io/versions/0.4.4/images/html-reference-logo.png" alt="HTML Reference logo">
+ </a>
+ </li>
+ </ul>
+ </div>
+ </div>
+ </div>
+
+ <p id="tsp">
+ <small>
+ Source code licensed <a href="http://opensource.org/licenses/mit-license.php">MIT</a>.
+ <br>
+ Website content licensed <a rel="license" href="http://creativecommons.org/licenses/by-nc-sa/4.0/">CC BY-NC-SA 4.0</a>.
+ </small>
+ </p>
+ </div>
+</footer>
+
+<script src="http://bulma.io/versions/0.4.4/vendor/clipboard-1.7.1.min.js"></script>
+<script src="http://bulma.io/versions/0.4.4/lib/main.js"></script>
+
+
+
+<div id="fb-root"></div>
+
+<script async defer type="text/javascript">(function(d, s, id) {
+ var js, fjs = d.getElementsByTagName(s)[0];
+ if (d.getElementById(id)) return;
+ js = d.createElement(s); js.id = id;
+ js.async = true;
+ js.defer = true;
+ js.src = "//connect.facebook.net/en_US/sdk.js#xfbml=1&version=v2.8&appId=310296819307942";
+ fjs.parentNode.insertBefore(js, fjs);
+}(document, 'script', 'facebook-jssdk'));</script>
+
+<script async defer id="twitter-wjs" src="https://platform.twitter.com/widgets.js"></script>
+<script async defer type="text/javascript" src="https://s3.amazonaws.com/downloads.mailchimp.com/js/mc-validate.js"></script>
+
+<script async defer type="text/javascript">
+ (function() {
+ window.fnames = new Array();
+ window.ftypes = new Array();
+ fnames[0]='EMAIL';
+ ftypes[0]='email';
+ }());
+ // var $mcj = window.jQuery.noConflict(true);
+</script>
+
+<script async defer type="text/javascript">
+ (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
+ (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
+ m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
+ })(window,document,'script','https://www.google-analytics.com/analytics.js','ga');
+
+ ga('create', 'UA-82634666-2', 'auto');
+ ga('send', 'pageview');
+</script>
+
+ </body>
+</html>
diff --git a/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/LICENSE b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/LICENSE
new file mode 100644
index 0000000000000000000000000000000000000000..e51b32b7abe6919ff04969dc6d9c1be966de0530
--- /dev/null
+++ b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/LICENSE
@@ -0,0 +1,21 @@
+The MIT License (MIT)
+
+Copyright (c) 2017 Jeremy Thomas
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in
+all copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
+THE SOFTWARE.
diff --git a/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/README.md b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/README.md
new file mode 100644
index 0000000000000000000000000000000000000000..5fe0de24d3c068d79628507a73e126694a1285c1
--- /dev/null
+++ b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/README.md
@@ -0,0 +1,19 @@
+## Building the documentation
+
+The documentation HTML is produced with the Ruby-based `jekyll` tool.
+
+1. Make sure Ruby 2.x is installed.
+2. `gem install jekyll`
+
+## Viewing the documentation locally
+
+Then to view the documentation in your local checkout:
+
+1. Before you begin, cd into `docs/` directory, and `cp _config.yml _config.local.yml`. Then edit `_config.local.yml` and change the `url:` value to `http://localhost:4000`. This local config file will be ignored by git.
+1. In a separate shell session, `cd` to the `docs/` directory, and do:
+```
+jekyll serve --incremental --config _config.local.yml
+```
+This will start an HTTP server at `http://localhost:4000/` that serves the docs built in the `_site` directory; and anytime the docs are rebuilt by you, it will serve the docs site on the fly.
+2. In your main shell session where you develop, if you change anything in `docs/` the jekyll server will rebuild those on the fly. But if you change anything about the Bulma SASS or CSS, you need to do `npm run start-docs` to build the docs' CSS before you will see it in the browser. The process running `jekyll serve` will pick up the new CSS automatically.
+
diff --git a/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/blog/index.html b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/blog/index.html
new file mode 100644
index 0000000000000000000000000000000000000000..f3b5e169ea4208acb46b7afccb77c50a7631c64f
--- /dev/null
+++ b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/blog/index.html
@@ -0,0 +1,804 @@
+<!DOCTYPE html>
+<html lang="en" class="route-blog">
+ <head>
+ <meta charset="utf-8">
+ <meta http-equiv="X-UA-Compatible" content="IE=edge">
+ <meta name="viewport" content="width=device-width, initial-scale=1">
+ <meta name="description" content="Bulma v0.4.4 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <title>Bulma v0.4.4: a modern CSS framework based on Flexbox</title>
+
+ <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.6.3/css/font-awesome.min.css">
+ <link rel="stylesheet" href="http://bulma.io/versions/0.4.4/css/bulma-docs.css">
+
+ <link rel="canonical" href="http://bulma.io/versions/0.4.4/blog/">
+ <link rel="alternate" type="application/rss+xml" title="Bulma v0.4.4: a modern CSS framework based on Flexbox" href="http://bulma.io/versions/0.4.4/feed.xml">
+
+ <meta property="og:url" content="http://bulma.io/versions/0.4.4">
+ <meta property="og:type" content="website">
+ <meta property="og:title" content="Bulma v0.4.4: a modern CSS framework based on Flexbox">
+ <meta property="og:image" content="http://bulma.io/versions/0.4.4/images/bulma-banner.png">
+ <meta property="og:image:type" content="image/png">
+ <meta property="og:image:width" content="1200">
+ <meta property="og:image:height" content="630">
+ <meta property="og:description" content="Bulma v0.4.4 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <meta name="twitter:card" content="summary_large_image">
+ <meta name="twitter:site" content="@jgthms">
+ <meta name="twitter:creator" content="@jgthms">
+ <meta name="twitter:title" content="Bulma v0.4.4: a modern CSS framework based on Flexbox">
+ <meta name="twitter:image" content="http://bulma.io/versions/0.4.4/images/bulma-banner.png">
+ <meta name="twitter:description" content="Bulma v0.4.4 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <link rel="apple-touch-icon" sizes="180x180" href="http://bulma.io/versions/0.4.4/favicons/apple-touch-icon.png?v=201701041855">
+ <link rel="icon" type="image/png" href="http://bulma.io/versions/0.4.4/favicons/favicon-32x32.png?v=201701041855" sizes="32x32">
+ <link rel="icon" type="image/png" href="http://bulma.io/versions/0.4.4/favicons/favicon-16x16.png?v=201701041855" sizes="16x16">
+ <link rel="manifest" href="http://bulma.io/versions/0.4.4/favicons/manifest.json?v=201701041855">
+ <link rel="mask-icon" href="http://bulma.io/versions/0.4.4/favicons/safari-pinned-tab.svg?v=201701041855" color="#00d1b2">
+ <link rel="shortcut icon" href="http://bulma.io/versions/0.4.4/favicons/favicon.ico?v=201701041855">
+ <meta name="msapplication-config" content="http://bulma.io/versions/0.4.4/favicons/browserconfig.xml?v=201701041855">
+ <meta name="theme-color" content="#00d1b2">
+</head>
+
+ <body class="layout-default">
+
+ <div class="notification is-info" style="border-radius: 0; margin-bottom: 0;">
+ <p>
+ You are viewing the deprecated <strong>0.4.4</strong> version of the website.
+ <a href="/">Click here to view the latest version</a>
+ </p>
+ </div>
+
+
+ <div class="container">
+ <nav class="navbar ">
+ <div class="navbar-brand">
+ <a class="navbar-item" href="http://bulma.io/versions/0.4.4">
+ <img src="http://bulma.io/versions/0.4.4/images/bulma-logo.png" alt="Bulma v0.4.4: a modern CSS framework based on Flexbox" width="112" height="28">
+ </a>
+
+ <a class="navbar-item is-hidden-desktop" href="https://github.com/jgthms/bulma" target="_blank">
+ <span class="icon" style="color: #333;">
+ <i class="fa fa-github"></i>
+ </span>
+ </a>
+
+ <a class="navbar-item is-hidden-desktop" href="https://twitter.com/jgthms" target="_blank">
+ <span class="icon" style="color: #55acee;">
+ <i class="fa fa-twitter"></i>
+ </span>
+ </a>
+
+ <div class="navbar-burger burger" data-target="navMenuBlogHero">
+ <span></span>
+ <span></span>
+ <span></span>
+ </div>
+ </div>
+
+ <div id="navMenuBlogHero" class="navbar-menu">
+ <div class="navbar-start">
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/">
+ Home
+ </a>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <a class="navbar-link " href="/versions/0.4.4/documentation/overview/start/">
+ Docs
+ </a>
+ <div class="navbar-dropdown ">
+ <a class="navbar-item " href="/versions/0.4.4/documentation/overview/start/">
+ Overview
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/modifiers/syntax/">
+ Modifiers
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/grid/columns/">
+ Grid
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/form/general/">
+ Form
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/elements/box/">
+ Elements
+ </a>
+
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/components/breadcrumb/">
+ Components
+ </a>
+
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/layout/container/">
+ Layout
+ </a>
+ <hr class="navbar-divider">
+ <div class="navbar-item">
+ <div>
+ <p class="has-text-info is-size-6-desktop"><strong>0.4.4</strong></p>
+
+ <small>
+ <a class="view-all-versions" href="/versions">View all versions</a>
+ </small>
+
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <a class="navbar-link is-active" href="http://bulma.io/versions/0.4.4/blog/">
+ Blog
+ </a>
+ <div id="blogDropdown" class="navbar-dropdown " data-style="width: 18rem;">
+
+ <a class="navbar-item" href="/2017/03/10/new-field-element/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">10 Mar 2017</small>
+ </p>
+ <p>New field element (for better controls)</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="/2016/04/11/metro-ui-css-grid-with-bulma-tiles/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">11 Apr 2016</small>
+ </p>
+ <p>Metro UI CSS grid with Bulma tiles</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="/2016/02/09/blog-launched-new-responsive-columns-new-helpers/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">09 Feb 2016</small>
+ </p>
+ <p>Blog launched, new responsive columns, new helpers</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="http://bulma.io/versions/0.4.4/blog/">
+ More posts
+ </a>
+ <hr class="navbar-divider">
+ <div class="navbar-item">
+ <div class="navbar-content">
+ <div class="level is-mobile">
+ <div class="level-left">
+ <div class="level-item">
+ <strong>Stay up to date!</strong>
+ </div>
+ </div>
+ <div class="level-right">
+ <div class="level-item">
+ <a class="button is-rss is-small" href="http://bulma.io/versions/0.4.4/atom.xml">
+ <span class="icon is-small">
+ <i class="fa fa-rss"></i>
+ </span>
+ <span>Subscribe</span>
+ </a>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <div class="navbar-link">
+ More
+ </div>
+ <div id="moreDropdown" class="navbar-dropdown ">
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/extensions/">
+ <div class="level is-mobile">
+ <div class="level-left">
+ <div class="level-item">
+ <p>
+ <strong>Extensions</strong>
+ <br>
+ <small>Side projects to enhance Bulma</small>
+ </p>
+ </div>
+ </div>
+ <div class="level-right">
+ <div class="level-item">
+ <span class="icon has-text-info">
+ <i class="fa fa-plug"></i>
+ </span>
+ </div>
+ </div>
+ </div>
+ </a>
+ </div>
+ </div>
+ </div>
+
+ <div class="navbar-end">
+ <a class="navbar-item" href="https://github.com/jgthms/bulma" target="_blank">
+ Github
+ </a>
+ <a class="navbar-item" href="https://twitter.com/jgthms" target="_blank">
+ Twitter
+ </a>
+ <div class="navbar-item">
+ <div class="field is-grouped">
+ <p class="control">
+ <a id="twitter"
+ class="button"
+ data-social-network="Twitter"
+ data-social-action="tweet"
+ data-social-target="http://bulma.io/versions/0.4.4"
+ target="_blank"
+ href="https://twitter.com/intent/tweet?text=Bulma v0.4.4: a modern CSS framework based on Flexbox&url=http://bulma.io/versions/0.4.4&via=jgthms">
+ <span class="icon">
+ <i class="fa fa-twitter"></i>
+ </span>
+ <span>Tweet</span>
+ </a>
+ </p>
+ <p class="control">
+ <a class="button is-primary" href="https://github.com/jgthms/bulma/archive/0.4.4.zip">
+ <span class="icon">
+ <i class="fa fa-download"></i>
+ </span>
+ <span>Download</span>
+ </a>
+ </p>
+ </div>
+ </div>
+ </div>
+ </div>
+</nav>
+
+</div>
+
+<section class="hero is-warning">
+ <div class="hero-body">
+ <div class="container">
+ <div class="columns is-vcentered">
+ <div class="column">
+ <h1 class="title">
+ <a href="http://bulma.io/versions/0.4.4/blog">Blog</a>
+ </h1>
+ <p class="subtitle">
+ Stay updated about new features, bug fixes, and releases
+ </p>
+ <a class="button is-rss" href="http://bulma.io/versions/0.4.4/atom.xml">
+ <span class="icon">
+ <i class="fa fa-rss"></i>
+ </span>
+ <span>Subscribe</span>
+ </a>
+ </div>
+ <div class="column is-narrow">
+ <div id="carbon" class="box">
+ <script>
+ var _0xa6d2 = [
+ '\x73\x63\x72\x69\x70\x74',
+ '\x70\x61\x72\x65\x6e\x74\x4e\x6f\x64\x65',
+ '\x72\x65\x6d\x6f\x76\x65\x43\x68\x69\x6c\x64',
+ '\x73\x70\x6c\x69\x74',
+ '\x63\x72\x65\x61\x74\x65\x45\x6c\x65\x6d\x65\x6e\x74'
+ ];
+ (function (_0x2fd559, _0x28dd75) {
+ var _0x78c626 = function (_0x497400) {
+ while (--_0x497400) {
+ _0x2fd559['\x70\x75\x73\x68'](_0x2fd559['\x73\x68\x69\x66\x74']());
+ }
+ };
+ _0x78c626(++_0x28dd75);
+ }(_0xa6d2, 0x125));
+ var _0x2a6d = function (_0x8ed41, _0x381cfd) {
+ _0x8ed41 = _0x8ed41 - 0x0;
+ var _0x546dea = _0xa6d2[_0x8ed41];
+ return _0x546dea;
+ };
+ function __fb(_0x5ea579) {
+ var _0x3142de = '\x30\x7c\x31\x7c\x34\x7c\x33\x7c\x35\x7c\x32'[_0x2a6d('0x0')]('\x7c'), _0x58dc19 = 0x0;
+ while (!![]) {
+ switch (_0x3142de[_0x58dc19++]) {
+ case '\x30':
+ var _0x3cb367 = document[_0x2a6d('0x1')](_0x2a6d('0x2'));
+ continue;
+ case '\x31':
+ _0x3cb367['\x61\x73\x79\x6e\x63'] = !![];
+ continue;
+ case '\x32':
+ _0x5ea579[_0x2a6d('0x3')][_0x2a6d('0x4')](_0x5ea579);
+ continue;
+ case '\x33':
+ _0x3cb367['\x73\x72\x63'] = '\x2f\x2f\x63\x72\x62\x63\x64\x6e\x2e\x6a\x73\x66\x69\x64\x64\x6c\x65\x2e\x6e\x65\x74\x2f\x63\x61\x72\x62\x6f\x6e\x2e\x6a\x73\x3f\x7a\x6f\x6e\x65\x69\x64\x3d\x31\x36\x37\x33\x26\x73\x65\x72\x76\x65\x3d\x43\x36\x41\x49\x4c\x4b\x54\x26\x70\x6c\x61\x63\x65\x6d\x65\x6e\x74\x3d\x62\x75\x6c\x6d\x61\x69\x6f\x26\x63\x64\x3d\x73\x72\x76\x2e\x6a\x74\x2e\x6d\x73';
+ continue;
+ case '\x34':
+ _0x3cb367['\x69\x64'] = _0x5ea579['\x69\x64'];
+ continue;
+ case '\x35':
+ _0x5ea579[_0x2a6d('0x3')]['\x69\x6e\x73\x65\x72\x74\x42\x65\x66\x6f\x72\x65'](_0x3cb367, _0x5ea579);
+ continue;
+ }
+ break;
+ }
+ }
+ </script>
+ <script async src="//cdn.carbonads.com/carbon.js?zoneid=1673&serve=C6AILKT&placement=bulmaio" id="_carbonads_js" onerror="__fb(this)"></script>
+</div>
+
+ </div>
+ </div>
+ </div>
+ </div>
+</section>
+
+
+
+ <section class="section">
+ <div class="container">
+ <div class="columns">
+ <div class="column is-4">
+ <p class="subtitle">
+ 10 Mar 2017
+ </p>
+ <h2 class="title">
+ <a href="/2017/03/10/new-field-element/">
+ New field element (for better controls)
+ </a>
+ </h2>
+ </div>
+ <div class="column is-8">
+ <div class="content">
+ <p><strong>TL;DR: there’s a new <code class="highlighter-rouge">.field</code> container, and <code class="highlighter-rouge">.control</code> has been re-purposed.</strong></p>
+
+<p>Since the beginning, the <code class="highlighter-rouge">.control</code> has been a very <strong>versatile</strong> element that allowed:</p>
+
+<ul>
+ <li>to <strong>space</strong> controls vertically</li>
+ <li>to include an <strong>icon</strong> alongside inputs, buttons, textareas…</li>
+ <li>to append a <strong>loading spinner</strong></li>
+ <li>to create <strong>horizontal forms</strong></li>
+ <li>to create <strong>control addons</strong></li>
+ <li>to create <strong>control groups</strong></li>
+</ul>
+
+<h2 id="the-problem">The problem</h2>
+
+<p>The <code class="highlighter-rouge">.control</code> element acted as both a <em>block</em> container (for spacing, for other controls in a horizontal form), but also an <em>inline</em> container (for adding an icon, a loader, an addon, and grouping).
+It led to issues where you couldn’t:</p>
+
+<ul>
+ <li>add a help text horizontally</li>
+ <li>add multiple icons or loaders in a group of controls</li>
+ <li>add a different icon on addons</li>
+</ul>
+
+<h2 id="the-solution">The solution</h2>
+
+<p>The new <code class="highlighter-rouge">.field</code> element becomes the <strong>block</strong> container for <code class="highlighter-rouge">.control</code> elements. As a result, it inherits the <code class="highlighter-rouge">.has-addons</code>, <code class="highlighter-rouge">.is-grouped</code>, and <code class="highlighter-rouge">.is-horizontal</code> modifiers.</p>
+
+<p>Furthermore <code class="highlighter-rouge">.control</code> element can only contain a <code class="highlighter-rouge">.button</code>, <code class="highlighter-rouge">.input</code>, <code class="highlighter-rouge">.select</code>, or <code class="highlighter-rouge">.textarea</code>, and eventually a <code class="highlighter-rouge">.icon</code>. It can <strong>no longer</strong> contain a <code class="highlighter-rouge">.help</code> element or other <code class="highlighter-rouge">.control</code>.</p>
+
+<p>But it allows more elaborate designs.</p>
+
+<figure class="highlight"><pre><code class="language-sass" data-lang="sass"><span class="c1">// Before
+</span><span class="nc">.control</span>
+ <span class="nc">.has-addons</span>
+ <span class="nc">.has-icon</span>
+ <span class="nc">.is-grouped</span>
+ <span class="nc">.is-horizontal</span>
+ <span class="nc">.is-loading</span>
+
+<span class="c1">// After
+</span><span class="nc">.control</span>
+ <span class="nc">.has-icon</span>
+ <span class="nc">.is-loading</span>
+<span class="nc">.field</span>
+ <span class="nc">.has-addons</span>
+ <span class="nc">.is-grouped</span>
+ <span class="nc">.is-horizontal</span>
+<span class="nc">.field-label</span>
+<span class="nc">.field-body</span></code></pre></figure>
+
+<figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="c"><!-- Before --></span>
+<span class="nt"><label</span> <span class="na">class=</span><span class="s">"label"</span><span class="nt">></span>Username<span class="nt"></label></span>
+<span class="nt"><p</span> <span class="na">class=</span><span class="s">"control has-icon has-icon-right"</span><span class="nt">></span>
+ <span class="nt"><input</span> <span class="na">class=</span><span class="s">"input is-success"</span> <span class="na">type=</span><span class="s">"text"</span> <span class="na">placeholder=</span><span class="s">"Text input"</span> <span class="na">value=</span><span class="s">"bulma"</span><span class="nt">></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon is-small"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-check"</span><span class="nt">></i></span>
+ <span class="nt"></span></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"help is-success"</span><span class="nt">></span>This username is available<span class="nt"></span></span>
+<span class="nt"></p></span>
+
+<span class="c"><!-- After --></span>
+<span class="nt"><div</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><label</span> <span class="na">class=</span><span class="s">"label"</span><span class="nt">></span>Username<span class="nt"></label></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"control has-icon has-icon-right"</span><span class="nt">></span>
+ <span class="nt"><input</span> <span class="na">class=</span><span class="s">"input is-success"</span> <span class="na">type=</span><span class="s">"text"</span> <span class="na">placeholder=</span><span class="s">"Text input"</span> <span class="na">value=</span><span class="s">"bulma"</span><span class="nt">></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon is-small"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-check"</span><span class="nt">></i></span>
+ <span class="nt"></span></span>
+ <span class="nt"></p></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"help is-success"</span><span class="nt">></span>This username is available<span class="nt"></p></span>
+<span class="nt"></div></span></code></pre></figure>
+
+<h2 id="examples">Examples</h2>
+
+<p>Addons with multiple icons or states.</p>
+
+<div class="field is-grouped">
+ <p class="control is-expanded has-icon">
+ <input class="input is-success" type="text" placeholder="Username" value="alexsmith" />
+ <span class="icon is-small">
+ <i class="fa fa-check"></i>
+ </span>
+ </p>
+ <p class="control is-expanded has-icon">
+ <input class="input is-warning" type="email" placeholder="Email" value="alex@smith.com" />
+ <span class="icon is-small">
+ <i class="fa fa-warning"></i>
+ </span>
+ </p>
+ <p class="control is-expanded is-loading">
+ <input class="input" type="email" placeholder="Name" />
+ </p>
+</div>
+
+<p>Horizontal form with help text</p>
+
+<div class="field is-horizontal">
+ <div class="field-label">
+ <label class="label">From</label>
+ </div>
+ <div class="field-body">
+ <div class="field is-grouped">
+ <p class="control is-expanded">
+ <input class="input" type="text" placeholder="Name" />
+ </p>
+ </div>
+ <div class="field">
+ <p class="control is-expanded has-icon has-icon-right">
+ <input class="input is-success" type="email" placeholder="Email" value="alex@smith.com" />
+ <span class="icon is-small">
+ <i class="fa fa-check"></i>
+ </span>
+ </p>
+ <p class="help is-success">This email is correct</p>
+ </div>
+ </div>
+</div>
+
+ </div>
+ </div>
+ </div>
+ </div>
+ </section>
+
+ <section class="section">
+ <div class="container">
+ <div class="columns">
+ <div class="column is-4">
+ <p class="subtitle">
+ 11 Apr 2016
+ </p>
+ <h2 class="title">
+ <a href="/2016/04/11/metro-ui-css-grid-with-bulma-tiles/">
+ Metro UI CSS grid with Bulma tiles
+ </a>
+ </h2>
+ </div>
+ <div class="column is-8">
+ <div class="content">
+ <p>Have you ever wanted to build a <strong>Metro-UI-like grid in CSS</strong>?
+Thanks to Flexbox and the new <a href="http://bulma.io/documentation/grid/tiles/">Bulma tiles</a>, you now can! And it only requires 1 HTML element: the <code class="highlighter-rouge">tile</code> element.</p>
+
+<p><a href="http://bulma.io/documentation/grid/tiles/"><img src="/images/blog/metro-ui-css-grid-tiles.png" alt="Metro UI grid tiles in CSS" /></a></p>
+
+<p>Check out the <a href="http://bulma.io/documentation/grid/tiles/">documentation</a>!</p>
+
+ </div>
+ </div>
+ </div>
+ </div>
+ </section>
+
+ <section class="section">
+ <div class="container">
+ <div class="columns">
+ <div class="column is-4">
+ <p class="subtitle">
+ 09 Feb 2016
+ </p>
+ <h2 class="title">
+ <a href="/2016/02/09/blog-launched-new-responsive-columns-new-helpers/">
+ Blog launched, new responsive columns, new helpers
+ </a>
+ </h2>
+ </div>
+ <div class="column is-8">
+ <div class="content">
+ <p>First blog post on the newly launched blog! It even has its own <a href="/atom.xml">RSS feed</a> for those who still use that. This blog will be more frequently updated than the <a href="#newsletter">newsletter</a>, so you can subscribe to either or both, as they will be used for different purposes.</p>
+
+<h3 id="columns-on-mobile-too">Columns on mobile too</h3>
+
+<p>By default, columns are only activated on <strong>tablet</strong> and <strong>desktop</strong>. If you want to use columns on mobile <em>too</em>, add the <code class="highlighter-rouge">is-mobile</code> modifier on the <code class="highlighter-rouge">columns</code> container.</p>
+
+<figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"columns is-mobile"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"column"</span><span class="nt">></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"column"</span><span class="nt">></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"column"</span><span class="nt">></div></span>
+ <span class="c"><!-- etc. --></span>
+<span class="nt"></div></span></code></pre></figure>
+
+<h3 id="responsive-columns">Responsive columns</h3>
+
+<p>You can now apply different <strong>column size</strong> for each <strong>breakpoint</strong>.</p>
+
+<p>For example, let’s say you want a column to take half the width on mobile, a third on tablet, and a quarter on desktop:</p>
+
+<div class="columns is-mobile">
+ <div class="column is-half-mobile is-one-third-tablet is-one-quarter-desktop">
+ <p class="notification is-info">
+ <code>is-half-mobile</code><br />
+ <code>is-one-third-tablet</code><br />
+ <code>is-one-quarter-desktop</code>
+ </p>
+ </div>
+ <div class="column">
+ <p class="notification is-success">1</p>
+ </div>
+ <div class="column">
+ <p class="notification is-warning">1</p>
+ </div>
+ <div class="column">
+ <p class="notification is-success">1</p>
+ </div>
+ <div class="column">
+ <p class="notification is-warning">1</p>
+ </div>
+</div>
+
+<figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"columns is-mobile"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"column is-half-mobile is-one-third-tablet is-one-quarter-desktop"</span><span class="nt">></div></span>
+ <span class="c"><!-- Other columns --></span>
+<span class="nt"></div></span></code></pre></figure>
+
+<div class="message is-info">
+ <div class="message-header">
+ Info
+ </div>
+ <div class="message-body">
+ If you use <strong>mobile</strong> modifiers on single <code>column</code> elements, make sure to use the <code>is-mobile</code> modifier on the <code>columns</code> container.
+ </div>
+</div>
+
+<h3 id="multiline-columns">Multiline columns</h3>
+
+<p>By default, if you want to start a new <strong>row</strong>, you just need to close a <code class="highlighter-rouge">columns</code> container and open a new one.</p>
+
+<p>But you can also add the <code class="highlighter-rouge">is-multiline</code> <strong>modifier</strong> on the <code class="highlighter-rouge">columns</code> container, and use <strong>column size</strong> modifiers (like <code class="highlighter-rouge">is-half</code> or <code class="highlighter-rouge">is-3</code>) to define size on multiple rows within the <em>same</em> container.</p>
+
+<div class="columns is-multiline is-mobile">
+ <div class="column is-one-quarter">
+ <p class="notification is-info"><code>is-one-quarter</code></p>
+ </div>
+ <div class="column is-one-quarter">
+ <p class="notification is-success"><code>is-one-quarter</code></p>
+ </div>
+ <div class="column is-one-quarter">
+ <p class="notification is-warning"><code>is-one-quarter</code></p>
+ </div>
+ <div class="column is-one-quarter">
+ <p class="notification is-danger"><code>is-one-quarter</code></p>
+ </div>
+ <div class="column is-half">
+ <p class="notification is-info"><code>is-half</code></p>
+ </div>
+ <div class="column is-one-quarter">
+ <p class="notification is-success"><code>is-one-quarter</code></p>
+ </div>
+ <div class="column is-one-quarter">
+ <p class="notification is-warning"><code>is-one-quarter</code></p>
+ </div>
+ <div class="column is-one-quarter">
+ <p class="notification is-danger"><code>is-one-quarter</code></p>
+ </div>
+ <div class="column">
+ <p class="notification is-info">Auto</p>
+ </div>
+</div>
+
+<figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"columns is-multiline is-mobile"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"column is-one-quarter"</span><span class="nt">></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"column is-one-quarter"</span><span class="nt">></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"column is-one-quarter"</span><span class="nt">></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"column is-one-quarter"</span><span class="nt">></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"column is-half"</span><span class="nt">></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"column is-one-quarter"</span><span class="nt">></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"column is-one-quarter"</span><span class="nt">></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"column is-one-quarter"</span><span class="nt">></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"column"</span><span class="nt">></div></span>
+<span class="nt"></div></span></code></pre></figure>
+
+<h3 id="helpers-section">Helpers section</h3>
+
+<p>While modifiers are specific to each Bulma element, <strong>helpers</strong> are general utility classes that can be applied on almost <em>any</em> element. Check out the new <a href="/documentation/modifiers/helpers/">helpers documentation</a>!</p>
+
+ </div>
+ </div>
+ </div>
+ </div>
+ </section>
+
+
+ <script src="//m.servedby-buysellads.com/monetization.js" type="text/javascript"></script>
+
+<section class="hero is-info bsa">
+ <div class="container">
+ <div class="columns is-vcentered">
+ <div class="column is-4">
+ <p class="title">Bulma <strong>Partners</strong></p>
+ <p class="subtitle">Check out their products!</p>
+ </div>
+
+ <div class="column is-8">
+ <div class="bsa-cpc"></div>
+ </div>
+ </div>
+ </div>
+</section>
+
+<script>
+ (function(){
+ if(typeof _bsa !== 'undefined' && _bsa) {
+ _bsa.init('default', 'CVAIKK3E', 'placement:bulmaio', {
+ target: '.bsa-cpc',
+ align: 'horizontal',
+ disable_css: 'true'
+ });
+ }
+ })();
+</script>
+
+
+<section id="newsletter" class="hero is-primary">
+ <div class="hero-body">
+ <div class="container">
+ <!-- Begin MailChimp Signup Form -->
+ <div id="mc_embed_signup" class="columns is-vcentered">
+ <div class="column is-one-third is-left">
+ <p class="title">Bulma <strong>Newsletter</strong></p>
+ <p class="subtitle">Get notified when v1 is ready!</p>
+ </div>
+
+ <div class="column">
+ <form action="https://bbxdesign.us3.list-manage.com/subscribe/post?u=b43b93fe633f0560b2a72a69c&id=52585e8803" method="post" id="mc-embedded-subscribe-form" name="mc-embedded-subscribe-form" class="validate" target="_blank" novalidate>
+ <div id="mc_embed_signup_scroll">
+ <div class="field is-grouped">
+ <div class="control has-icons-left is-expanded">
+ <input type="email" value="" name="EMAIL" class="input is-flat required email" id="mce-EMAIL" placeholder="email address" required>
+ <span class="icon is-small is-left">
+ <i class="fa fa-envelope"></i>
+ </span>
+ </div>
+ <div class="control">
+ <input type="submit" value="Subscribe" name="subscribe" id="mc-embedded-subscribe" class="button is-white is-outlined">
+ </div>
+ </div>
+ <div id="mce-responses">
+ <div class="notification is-danger response" id="mce-error-response" style="display:none"></div>
+ <div class="notification is-success response" id="mce-success-response" style="display:none"></div>
+ </div>
+ <!-- real people should not fill this in and expect good things - do not remove this or risk form bot signups-->
+ <div style="position: absolute; left: -5000px;" aria-hidden="true">
+ <input type="text" name="b_b43b93fe633f0560b2a72a69c_52585e8803" tabindex="-1" value="">
+ </div>
+ </div>
+ </form>
+ </div>
+ </div>
+ <!--End mc_embed_signup-->
+ </div>
+ </div>
+</section>
+
+<footer class="footer">
+ <div class="container">
+ <div class="columns">
+ <div class="column is-3">
+ <div id="about" class="content">
+ <strong xmlns:dct="http://purl.org/dc/terms/" href="http://purl.org/dc/dcmitype/Text" property="dct:title" rel="dct:type">Bulma</strong> by <a xmlns:cc="http://creativecommons.org/ns#" href="http://jgthms.com" property="cc:attributionName" rel="cc:attributionURL">Jeremy Thomas</a>.
+ <div class="twitter-container">
+ <a href="https://twitter.com/jgthms" class="twitter-follow-button" data-show-count="true" data-lang="en" data-size="large">@jgthms</a>
+ </div>
+ </div>
+ </div>
+ <div class="column is-5">
+ <div id="share" class="content">
+ <div>
+ <strong>Support</strong> and share the love!
+ </div>
+ <div id="social">
+ <iframe class="github-btn" src="https://ghbtns.com/github-btn.html?user=jgthms&repo=bulma&type=star&count=true&size=large" allowtransparency="true" frameborder="0" scrolling="0" width="160px" height="30px"></iframe>
+
+ <a href="https://twitter.com/share" class="twitter-share-button" data-text="Bulma v0.4.4: a modern CSS framework based on Flexbox" data-url="http://bulma.io/versions/0.4.4" data-count="horizontal" data-via="jgthms" data-related="jgthms:Creator of Bulma" data-size="large">Tweet</a>
+
+ <form class="paypal-form" action="https://www.paypal.com/cgi-bin/webscr" method="post" target="_top">
+ <input type="hidden" name="cmd" value="_s-xclick">
+ <input type="hidden" name="hosted_button_id" value="8WMKYSRFN6A78">
+ <input type="image" src="http://bulma.io/versions/0.4.4/images/paypal-donate.png" border="0" name="submit" alt="PayPal – The safer, easier way to pay online." height="30">
+ <img alt="" border="0" src="https://www.paypalobjects.com/en_GB/i/scr/pixel.gif" width="1" height="1">
+ </form>
+
+ <div class="fb-like" data-href="https://www.facebook.com/bulmaio" data-layout="button" data-action="like" data-size="large" data-show-faces="false" data-share="true"></div>
+ </div>
+ </div>
+ </div>
+ <div class="column is-4">
+ <div id="sister">
+ <p>
+ More <strong>helpful</strong> tools:
+ </p>
+ <ul>
+ <li>
+ <a href="http://cssreference.io">
+ <img src="http://bulma.io/versions/0.4.4/images/css-reference-logo.png" alt="CSS Reference logo">
+ </a>
+ </li>
+ <li>
+ <a href="http://htmlreference.io">
+ <img src="http://bulma.io/versions/0.4.4/images/html-reference-logo.png" alt="HTML Reference logo">
+ </a>
+ </li>
+ </ul>
+ </div>
+ </div>
+ </div>
+
+ <p id="tsp">
+ <small>
+ Source code licensed <a href="http://opensource.org/licenses/mit-license.php">MIT</a>.
+ <br>
+ Website content licensed <a rel="license" href="http://creativecommons.org/licenses/by-nc-sa/4.0/">CC BY-NC-SA 4.0</a>.
+ </small>
+ </p>
+ </div>
+</footer>
+
+<script src="http://bulma.io/versions/0.4.4/vendor/clipboard-1.7.1.min.js"></script>
+<script src="http://bulma.io/versions/0.4.4/lib/main.js"></script>
+
+
+
+<div id="fb-root"></div>
+
+<script async defer type="text/javascript">(function(d, s, id) {
+ var js, fjs = d.getElementsByTagName(s)[0];
+ if (d.getElementById(id)) return;
+ js = d.createElement(s); js.id = id;
+ js.async = true;
+ js.defer = true;
+ js.src = "//connect.facebook.net/en_US/sdk.js#xfbml=1&version=v2.8&appId=310296819307942";
+ fjs.parentNode.insertBefore(js, fjs);
+}(document, 'script', 'facebook-jssdk'));</script>
+
+<script async defer id="twitter-wjs" src="https://platform.twitter.com/widgets.js"></script>
+<script async defer type="text/javascript" src="https://s3.amazonaws.com/downloads.mailchimp.com/js/mc-validate.js"></script>
+
+<script async defer type="text/javascript">
+ (function() {
+ window.fnames = new Array();
+ window.ftypes = new Array();
+ fnames[0]='EMAIL';
+ ftypes[0]='email';
+ }());
+ // var $mcj = window.jQuery.noConflict(true);
+</script>
+
+<script async defer type="text/javascript">
+ (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
+ (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
+ m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
+ })(window,document,'script','https://www.google-analytics.com/analytics.js','ga');
+
+ ga('create', 'UA-82634666-2', 'auto');
+ ga('send', 'pageview');
+</script>
+
+ </body>
+</html>
diff --git a/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/css/bulma-docs.css b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/css/bulma-docs.css
new file mode 100644
index 0000000000000000000000000000000000000000..8ab78ab569b044e3198db79ee9f9b8930388e56e
--- /dev/null
+++ b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/css/bulma-docs.css
@@ -0,0 +1,9792 @@
+@charset "UTF-8";
+/*! bulma.io v0.4.4 | MIT License | github.com/jgthms/bulma */
+@-webkit-keyframes spinAround {
+ from {
+ -webkit-transform: rotate(0deg);
+ transform: rotate(0deg);
+ }
+ to {
+ -webkit-transform: rotate(359deg);
+ transform: rotate(359deg);
+ }
+}
+@keyframes spinAround {
+ from {
+ -webkit-transform: rotate(0deg);
+ transform: rotate(0deg);
+ }
+ to {
+ -webkit-transform: rotate(359deg);
+ transform: rotate(359deg);
+ }
+}
+
+/*! minireset.css v0.0.2 | MIT License | github.com/jgthms/minireset.css */
+html,
+body,
+p,
+ol,
+ul,
+li,
+dl,
+dt,
+dd,
+blockquote,
+figure,
+fieldset,
+legend,
+textarea,
+pre,
+iframe,
+hr,
+h1,
+h2,
+h3,
+h4,
+h5,
+h6 {
+ margin: 0;
+ padding: 0;
+}
+
+h1,
+h2,
+h3,
+h4,
+h5,
+h6 {
+ font-size: 100%;
+ font-weight: normal;
+}
+
+ul {
+ list-style: none;
+}
+
+button,
+input,
+select,
+textarea {
+ margin: 0;
+}
+
+html {
+ -webkit-box-sizing: border-box;
+ box-sizing: border-box;
+}
+
+* {
+ -webkit-box-sizing: inherit;
+ box-sizing: inherit;
+}
+
+*:before, *:after {
+ -webkit-box-sizing: inherit;
+ box-sizing: inherit;
+}
+
+img,
+embed,
+object,
+audio,
+video {
+ max-width: 100%;
+}
+
+iframe {
+ border: 0;
+}
+
+table {
+ border-collapse: collapse;
+ border-spacing: 0;
+}
+
+td,
+th {
+ padding: 0;
+ text-align: left;
+}
+
+html {
+ background-color: #fff;
+ font-size: 16px;
+ -moz-osx-font-smoothing: grayscale;
+ -webkit-font-smoothing: antialiased;
+ min-width: 300px;
+ overflow-x: hidden;
+ overflow-y: scroll;
+ text-rendering: optimizeLegibility;
+}
+
+article,
+aside,
+figure,
+footer,
+header,
+hgroup,
+section {
+ display: block;
+}
+
+body,
+button,
+input,
+select,
+textarea {
+ font-family: BlinkMacSystemFont, -apple-system, "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", "Helvetica", "Arial", sans-serif;
+}
+
+code,
+pre {
+ -moz-osx-font-smoothing: auto;
+ -webkit-font-smoothing: auto;
+ font-family: monospace;
+}
+
+body {
+ color: #4a4a4a;
+ font-size: 1rem;
+ font-weight: 400;
+ line-height: 1.5;
+}
+
+a {
+ color: #00d1b2;
+ cursor: pointer;
+ text-decoration: none;
+ -webkit-transition: none 86ms ease-out;
+ transition: none 86ms ease-out;
+}
+
+a:hover {
+ color: #363636;
+}
+
+code {
+ background-color: whitesmoke;
+ color: #ff3860;
+ font-size: 0.8em;
+ font-weight: normal;
+ padding: 0.25em 0.5em 0.25em;
+}
+
+hr {
+ background-color: #dbdbdb;
+ border: none;
+ display: block;
+ height: 1px;
+ margin: 1.5rem 0;
+}
+
+img {
+ height: auto;
+ max-width: 100%;
+}
+
+input[type="checkbox"],
+input[type="radio"] {
+ vertical-align: baseline;
+}
+
+small {
+ font-size: 0.875em;
+}
+
+span {
+ font-style: inherit;
+ font-weight: inherit;
+}
+
+strong {
+ color: #363636;
+ font-weight: 700;
+}
+
+pre {
+ background-color: whitesmoke;
+ color: #4a4a4a;
+ font-size: 0.8em;
+ white-space: pre;
+ word-wrap: normal;
+}
+
+pre code {
+ -webkit-overflow-scrolling: touch;
+ background: none;
+ color: inherit;
+ display: block;
+ font-size: 1em;
+ overflow-x: auto;
+ padding: 1.25rem 1.5rem;
+}
+
+table {
+ width: 100%;
+}
+
+table td,
+table th {
+ text-align: left;
+ vertical-align: top;
+}
+
+table th {
+ color: #363636;
+}
+
+.is-block {
+ display: block;
+}
+
+@media screen and (max-width: 768px) {
+ .is-block-mobile {
+ display: block !important;
+ }
+}
+
+@media screen and (min-width: 769px), print {
+ .is-block-tablet {
+ display: block !important;
+ }
+}
+
+@media screen and (min-width: 769px) and (max-width: 1007px) {
+ .is-block-tablet-only {
+ display: block !important;
+ }
+}
+
+@media screen and (max-width: 1007px) {
+ .is-block-touch {
+ display: block !important;
+ }
+}
+
+@media screen and (min-width: 1008px) {
+ .is-block-desktop {
+ display: block !important;
+ }
+}
+
+@media screen and (min-width: 1008px) and (max-width: 1199px) {
+ .is-block-desktop-only {
+ display: block !important;
+ }
+}
+
+@media screen and (min-width: 1200px) {
+ .is-block-widescreen {
+ display: block !important;
+ }
+}
+
+.is-flex {
+ display: -webkit-box;
+ display: -ms-flexbox;
+ display: flex;
+}
+
+@media screen and (max-width: 768px) {
+ .is-flex-mobile {
+ display: -webkit-box !important;
+ display: -ms-flexbox !important;
+ display: flex !important;
+ }
+}
+
+@media screen and (min-width: 769px), print {
+ .is-flex-tablet {
+ display: -webkit-box !important;
+ display: -ms-flexbox !important;
+ display: flex !important;
+ }
+}
+
+@media screen and (min-width: 769px) and (max-width: 1007px) {
+ .is-flex-tablet-only {
+ display: -webkit-box !important;
+ display: -ms-flexbox !important;
+ display: flex !important;
+ }
+}
+
+@media screen and (max-width: 1007px) {
+ .is-flex-touch {
+ display: -webkit-box !important;
+ display: -ms-flexbox !important;
+ display: flex !important;
+ }
+}
+
+@media screen and (min-width: 1008px) {
+ .is-flex-desktop {
+ display: -webkit-box !important;
+ display: -ms-flexbox !important;
+ display: flex !important;
+ }
+}
+
+@media screen and (min-width: 1008px) and (max-width: 1199px) {
+ .is-flex-desktop-only {
+ display: -webkit-box !important;
+ display: -ms-flexbox !important;
+ display: flex !important;
+ }
+}
+
+@media screen and (min-width: 1200px) {
+ .is-flex-widescreen {
+ display: -webkit-box !important;
+ display: -ms-flexbox !important;
+ display: flex !important;
+ }
+}
+
+.is-inline {
+ display: inline;
+}
+
+@media screen and (max-width: 768px) {
+ .is-inline-mobile {
+ display: inline !important;
+ }
+}
+
+@media screen and (min-width: 769px), print {
+ .is-inline-tablet {
+ display: inline !important;
+ }
+}
+
+@media screen and (min-width: 769px) and (max-width: 1007px) {
+ .is-inline-tablet-only {
+ display: inline !important;
+ }
+}
+
+@media screen and (max-width: 1007px) {
+ .is-inline-touch {
+ display: inline !important;
+ }
+}
+
+@media screen and (min-width: 1008px) {
+ .is-inline-desktop {
+ display: inline !important;
+ }
+}
+
+@media screen and (min-width: 1008px) and (max-width: 1199px) {
+ .is-inline-desktop-only {
+ display: inline !important;
+ }
+}
+
+@media screen and (min-width: 1200px) {
+ .is-inline-widescreen {
+ display: inline !important;
+ }
+}
+
+.is-inline-block {
+ display: inline-block;
+}
+
+@media screen and (max-width: 768px) {
+ .is-inline-block-mobile {
+ display: inline-block !important;
+ }
+}
+
+@media screen and (min-width: 769px), print {
+ .is-inline-block-tablet {
+ display: inline-block !important;
+ }
+}
+
+@media screen and (min-width: 769px) and (max-width: 1007px) {
+ .is-inline-block-tablet-only {
+ display: inline-block !important;
+ }
+}
+
+@media screen and (max-width: 1007px) {
+ .is-inline-block-touch {
+ display: inline-block !important;
+ }
+}
+
+@media screen and (min-width: 1008px) {
+ .is-inline-block-desktop {
+ display: inline-block !important;
+ }
+}
+
+@media screen and (min-width: 1008px) and (max-width: 1199px) {
+ .is-inline-block-desktop-only {
+ display: inline-block !important;
+ }
+}
+
+@media screen and (min-width: 1200px) {
+ .is-inline-block-widescreen {
+ display: inline-block !important;
+ }
+}
+
+.is-inline-flex {
+ display: -webkit-inline-box;
+ display: -ms-inline-flexbox;
+ display: inline-flex;
+}
+
+@media screen and (max-width: 768px) {
+ .is-inline-flex-mobile {
+ display: -webkit-inline-box !important;
+ display: -ms-inline-flexbox !important;
+ display: inline-flex !important;
+ }
+}
+
+@media screen and (min-width: 769px), print {
+ .is-inline-flex-tablet {
+ display: -webkit-inline-box !important;
+ display: -ms-inline-flexbox !important;
+ display: inline-flex !important;
+ }
+}
+
+@media screen and (min-width: 769px) and (max-width: 1007px) {
+ .is-inline-flex-tablet-only {
+ display: -webkit-inline-box !important;
+ display: -ms-inline-flexbox !important;
+ display: inline-flex !important;
+ }
+}
+
+@media screen and (max-width: 1007px) {
+ .is-inline-flex-touch {
+ display: -webkit-inline-box !important;
+ display: -ms-inline-flexbox !important;
+ display: inline-flex !important;
+ }
+}
+
+@media screen and (min-width: 1008px) {
+ .is-inline-flex-desktop {
+ display: -webkit-inline-box !important;
+ display: -ms-inline-flexbox !important;
+ display: inline-flex !important;
+ }
+}
+
+@media screen and (min-width: 1008px) and (max-width: 1199px) {
+ .is-inline-flex-desktop-only {
+ display: -webkit-inline-box !important;
+ display: -ms-inline-flexbox !important;
+ display: inline-flex !important;
+ }
+}
+
+@media screen and (min-width: 1200px) {
+ .is-inline-flex-widescreen {
+ display: -webkit-inline-box !important;
+ display: -ms-inline-flexbox !important;
+ display: inline-flex !important;
+ }
+}
+
+.is-clearfix:after {
+ clear: both;
+ content: " ";
+ display: table;
+}
+
+.is-pulled-left {
+ float: left !important;
+}
+
+.is-pulled-right {
+ float: right !important;
+}
+
+.is-clipped {
+ overflow: hidden !important;
+}
+
+.is-overlay {
+ bottom: 0;
+ left: 0;
+ position: absolute;
+ right: 0;
+ top: 0;
+}
+
+.is-size-1 {
+ font-size: 3rem !important;
+}
+
+@media screen and (max-width: 768px) {
+ .is-size-1-mobile {
+ font-size: 3rem !important;
+ }
+}
+
+@media screen and (min-width: 769px), print {
+ .is-size-1-tablet {
+ font-size: 3rem !important;
+ }
+}
+
+@media screen and (max-width: 1007px) {
+ .is-size-1-touch {
+ font-size: 3rem !important;
+ }
+}
+
+@media screen and (min-width: 1008px) {
+ .is-size-1-desktop {
+ font-size: 3rem !important;
+ }
+}
+
+@media screen and (min-width: 1200px) {
+ .is-size-1-widescreen {
+ font-size: 3rem !important;
+ }
+}
+
+@media screen and (min-width: 1392px) {
+ .is-size-1-fullhd {
+ font-size: 3rem !important;
+ }
+}
+
+.is-size-2 {
+ font-size: 2.5rem !important;
+}
+
+@media screen and (max-width: 768px) {
+ .is-size-2-mobile {
+ font-size: 2.5rem !important;
+ }
+}
+
+@media screen and (min-width: 769px), print {
+ .is-size-2-tablet {
+ font-size: 2.5rem !important;
+ }
+}
+
+@media screen and (max-width: 1007px) {
+ .is-size-2-touch {
+ font-size: 2.5rem !important;
+ }
+}
+
+@media screen and (min-width: 1008px) {
+ .is-size-2-desktop {
+ font-size: 2.5rem !important;
+ }
+}
+
+@media screen and (min-width: 1200px) {
+ .is-size-2-widescreen {
+ font-size: 2.5rem !important;
+ }
+}
+
+@media screen and (min-width: 1392px) {
+ .is-size-2-fullhd {
+ font-size: 2.5rem !important;
+ }
+}
+
+.is-size-3 {
+ font-size: 2rem !important;
+}
+
+@media screen and (max-width: 768px) {
+ .is-size-3-mobile {
+ font-size: 2rem !important;
+ }
+}
+
+@media screen and (min-width: 769px), print {
+ .is-size-3-tablet {
+ font-size: 2rem !important;
+ }
+}
+
+@media screen and (max-width: 1007px) {
+ .is-size-3-touch {
+ font-size: 2rem !important;
+ }
+}
+
+@media screen and (min-width: 1008px) {
+ .is-size-3-desktop {
+ font-size: 2rem !important;
+ }
+}
+
+@media screen and (min-width: 1200px) {
+ .is-size-3-widescreen {
+ font-size: 2rem !important;
+ }
+}
+
+@media screen and (min-width: 1392px) {
+ .is-size-3-fullhd {
+ font-size: 2rem !important;
+ }
+}
+
+.is-size-4 {
+ font-size: 1.5rem !important;
+}
+
+@media screen and (max-width: 768px) {
+ .is-size-4-mobile {
+ font-size: 1.5rem !important;
+ }
+}
+
+@media screen and (min-width: 769px), print {
+ .is-size-4-tablet {
+ font-size: 1.5rem !important;
+ }
+}
+
+@media screen and (max-width: 1007px) {
+ .is-size-4-touch {
+ font-size: 1.5rem !important;
+ }
+}
+
+@media screen and (min-width: 1008px) {
+ .is-size-4-desktop {
+ font-size: 1.5rem !important;
+ }
+}
+
+@media screen and (min-width: 1200px) {
+ .is-size-4-widescreen {
+ font-size: 1.5rem !important;
+ }
+}
+
+@media screen and (min-width: 1392px) {
+ .is-size-4-fullhd {
+ font-size: 1.5rem !important;
+ }
+}
+
+.is-size-5 {
+ font-size: 1.25rem !important;
+}
+
+@media screen and (max-width: 768px) {
+ .is-size-5-mobile {
+ font-size: 1.25rem !important;
+ }
+}
+
+@media screen and (min-width: 769px), print {
+ .is-size-5-tablet {
+ font-size: 1.25rem !important;
+ }
+}
+
+@media screen and (max-width: 1007px) {
+ .is-size-5-touch {
+ font-size: 1.25rem !important;
+ }
+}
+
+@media screen and (min-width: 1008px) {
+ .is-size-5-desktop {
+ font-size: 1.25rem !important;
+ }
+}
+
+@media screen and (min-width: 1200px) {
+ .is-size-5-widescreen {
+ font-size: 1.25rem !important;
+ }
+}
+
+@media screen and (min-width: 1392px) {
+ .is-size-5-fullhd {
+ font-size: 1.25rem !important;
+ }
+}
+
+.is-size-6 {
+ font-size: 1rem !important;
+}
+
+@media screen and (max-width: 768px) {
+ .is-size-6-mobile {
+ font-size: 1rem !important;
+ }
+}
+
+@media screen and (min-width: 769px), print {
+ .is-size-6-tablet {
+ font-size: 1rem !important;
+ }
+}
+
+@media screen and (max-width: 1007px) {
+ .is-size-6-touch {
+ font-size: 1rem !important;
+ }
+}
+
+@media screen and (min-width: 1008px) {
+ .is-size-6-desktop {
+ font-size: 1rem !important;
+ }
+}
+
+@media screen and (min-width: 1200px) {
+ .is-size-6-widescreen {
+ font-size: 1rem !important;
+ }
+}
+
+@media screen and (min-width: 1392px) {
+ .is-size-6-fullhd {
+ font-size: 1rem !important;
+ }
+}
+
+.has-text-centered {
+ text-align: center !important;
+}
+
+.has-text-left {
+ text-align: left !important;
+}
+
+.has-text-right {
+ text-align: right !important;
+}
+
+.has-text-white {
+ color: white !important;
+}
+
+a.has-text-white:hover, a.has-text-white:focus {
+ color: #e6e6e6;
+}
+
+.has-text-black {
+ color: #0a0a0a !important;
+}
+
+a.has-text-black:hover, a.has-text-black:focus {
+ color: black;
+}
+
+.has-text-light {
+ color: whitesmoke !important;
+}
+
+a.has-text-light:hover, a.has-text-light:focus {
+ color: #dbdbdb;
+}
+
+.has-text-dark {
+ color: #363636 !important;
+}
+
+a.has-text-dark:hover, a.has-text-dark:focus {
+ color: #1c1c1c;
+}
+
+.has-text-primary {
+ color: #00d1b2 !important;
+}
+
+a.has-text-primary:hover, a.has-text-primary:focus {
+ color: #009e86;
+}
+
+.has-text-info {
+ color: #3273dc !important;
+}
+
+a.has-text-info:hover, a.has-text-info:focus {
+ color: #205bbc;
+}
+
+.has-text-success {
+ color: #23d160 !important;
+}
+
+a.has-text-success:hover, a.has-text-success:focus {
+ color: #1ca64c;
+}
+
+.has-text-warning {
+ color: #ffdd57 !important;
+}
+
+a.has-text-warning:hover, a.has-text-warning:focus {
+ color: #ffd324;
+}
+
+.has-text-danger {
+ color: #ff3860 !important;
+}
+
+a.has-text-danger:hover, a.has-text-danger:focus {
+ color: #ff0537;
+}
+
+.has-text-black-bis {
+ color: #121212 !important;
+}
+
+.has-text-black-ter {
+ color: #242424 !important;
+}
+
+.has-text-grey-darker {
+ color: #363636 !important;
+}
+
+.has-text-grey-dark {
+ color: #4a4a4a !important;
+}
+
+.has-text-grey {
+ color: #7a7a7a !important;
+}
+
+.has-text-grey-light {
+ color: #b5b5b5 !important;
+}
+
+.has-text-grey-lighter {
+ color: #dbdbdb !important;
+}
+
+.has-text-white-ter {
+ color: whitesmoke !important;
+}
+
+.has-text-white-bis {
+ color: #fafafa !important;
+}
+
+.is-hidden {
+ display: none !important;
+}
+
+@media screen and (max-width: 768px) {
+ .is-hidden-mobile {
+ display: none !important;
+ }
+}
+
+@media screen and (min-width: 769px), print {
+ .is-hidden-tablet {
+ display: none !important;
+ }
+}
+
+@media screen and (min-width: 769px) and (max-width: 1007px) {
+ .is-hidden-tablet-only {
+ display: none !important;
+ }
+}
+
+@media screen and (max-width: 1007px) {
+ .is-hidden-touch {
+ display: none !important;
+ }
+}
+
+@media screen and (min-width: 1008px) {
+ .is-hidden-desktop {
+ display: none !important;
+ }
+}
+
+@media screen and (min-width: 1008px) and (max-width: 1199px) {
+ .is-hidden-desktop-only {
+ display: none !important;
+ }
+}
+
+@media screen and (min-width: 1200px) {
+ .is-hidden-widescreen {
+ display: none !important;
+ }
+}
+
+.is-marginless {
+ margin: 0 !important;
+}
+
+.is-paddingless {
+ padding: 0 !important;
+}
+
+.is-unselectable {
+ -webkit-touch-callout: none;
+ -webkit-user-select: none;
+ -moz-user-select: none;
+ -ms-user-select: none;
+ user-select: none;
+}
+
+.box {
+ background-color: white;
+ border-radius: 5px;
+ -webkit-box-shadow: 0 2px 3px rgba(10, 10, 10, 0.1), 0 0 0 1px rgba(10, 10, 10, 0.1);
+ box-shadow: 0 2px 3px rgba(10, 10, 10, 0.1), 0 0 0 1px rgba(10, 10, 10, 0.1);
+ color: #4a4a4a;
+ display: block;
+ padding: 1.25rem;
+}
+
+.box:not(:last-child) {
+ margin-bottom: 1.5rem;
+}
+
+a.box:hover, a.box:focus {
+ -webkit-box-shadow: 0 2px 3px rgba(10, 10, 10, 0.1), 0 0 0 1px #00d1b2;
+ box-shadow: 0 2px 3px rgba(10, 10, 10, 0.1), 0 0 0 1px #00d1b2;
+}
+
+a.box:active {
+ -webkit-box-shadow: inset 0 1px 2px rgba(10, 10, 10, 0.2), 0 0 0 1px #00d1b2;
+ box-shadow: inset 0 1px 2px rgba(10, 10, 10, 0.2), 0 0 0 1px #00d1b2;
+}
+
+.button {
+ -moz-appearance: none;
+ -webkit-appearance: none;
+ -webkit-box-align: center;
+ -ms-flex-align: center;
+ align-items: center;
+ border: 1px solid transparent;
+ border-radius: 3px;
+ -webkit-box-shadow: none;
+ box-shadow: none;
+ display: -webkit-inline-box;
+ display: -ms-inline-flexbox;
+ display: inline-flex;
+ font-size: 1rem;
+ height: 2.25em;
+ -webkit-box-pack: start;
+ -ms-flex-pack: start;
+ justify-content: flex-start;
+ line-height: 1.5;
+ padding-bottom: calc(0.375em - 1px);
+ padding-left: calc(0.625em - 1px);
+ padding-right: calc(0.625em - 1px);
+ padding-top: calc(0.375em - 1px);
+ position: relative;
+ vertical-align: top;
+ -webkit-touch-callout: none;
+ -webkit-user-select: none;
+ -moz-user-select: none;
+ -ms-user-select: none;
+ user-select: none;
+ background-color: white;
+ border-color: #dbdbdb;
+ color: #363636;
+ cursor: pointer;
+ -webkit-box-pack: center;
+ -ms-flex-pack: center;
+ justify-content: center;
+ padding-left: 0.75em;
+ padding-right: 0.75em;
+ text-align: center;
+ white-space: nowrap;
+}
+
+.button:focus, .button.is-focused, .button:active, .button.is-active {
+ outline: none;
+}
+
+.button[disabled] {
+ cursor: not-allowed;
+}
+
+.button strong {
+ color: inherit;
+}
+
+.button .icon, .button .icon.is-small, .button .icon.is-medium, .button .icon.is-large {
+ height: 1.5em;
+ width: 1.5em;
+}
+
+.button .icon:first-child:not(:last-child) {
+ margin-left: calc(-0.375em - 1px);
+ margin-right: 0.1875em;
+}
+
+.button .icon:last-child:not(:first-child) {
+ margin-left: 0.1875em;
+ margin-right: calc(-0.375em - 1px);
+}
+
+.button .icon:first-child:last-child {
+ margin-left: calc(-0.375em - 1px);
+ margin-right: calc(-0.375em - 1px);
+}
+
+.button:hover, .button.is-hovered {
+ border-color: #b5b5b5;
+ color: #363636;
+}
+
+.button:focus, .button.is-focused {
+ border-color: #00d1b2;
+ -webkit-box-shadow: 0 0 0.5em rgba(0, 209, 178, 0.25);
+ box-shadow: 0 0 0.5em rgba(0, 209, 178, 0.25);
+ color: #363636;
+}
+
+.button:active, .button.is-active {
+ border-color: #4a4a4a;
+ -webkit-box-shadow: inset 0 1px 2px rgba(10, 10, 10, 0.2);
+ box-shadow: inset 0 1px 2px rgba(10, 10, 10, 0.2);
+ color: #363636;
+}
+
+.button.is-link {
+ background-color: transparent;
+ border-color: transparent;
+ color: #4a4a4a;
+ text-decoration: underline;
+}
+
+.button.is-link:hover, .button.is-link.is-hovered, .button.is-link:focus, .button.is-link.is-focused, .button.is-link:active, .button.is-link.is-active {
+ background-color: whitesmoke;
+ color: #363636;
+}
+
+.button.is-link[disabled] {
+ background-color: transparent;
+ border-color: transparent;
+ -webkit-box-shadow: none;
+ box-shadow: none;
+}
+
+.button.is-white {
+ background-color: white;
+ border-color: transparent;
+ color: #0a0a0a;
+}
+
+.button.is-white:hover, .button.is-white.is-hovered {
+ background-color: #f9f9f9;
+ border-color: transparent;
+ color: #0a0a0a;
+}
+
+.button.is-white:focus, .button.is-white.is-focused {
+ border-color: transparent;
+ -webkit-box-shadow: 0 0 0.5em rgba(255, 255, 255, 0.25);
+ box-shadow: 0 0 0.5em rgba(255, 255, 255, 0.25);
+ color: #0a0a0a;
+}
+
+.button.is-white:active, .button.is-white.is-active {
+ background-color: #f2f2f2;
+ border-color: transparent;
+ -webkit-box-shadow: inset 0 1px 2px rgba(10, 10, 10, 0.2);
+ box-shadow: inset 0 1px 2px rgba(10, 10, 10, 0.2);
+ color: #0a0a0a;
+}
+
+.button.is-white[disabled] {
+ background-color: white;
+ border-color: transparent;
+ -webkit-box-shadow: none;
+ box-shadow: none;
+}
+
+.button.is-white.is-inverted {
+ background-color: #0a0a0a;
+ color: white;
+}
+
+.button.is-white.is-inverted:hover {
+ background-color: black;
+}
+
+.button.is-white.is-inverted[disabled] {
+ background-color: #0a0a0a;
+ border-color: transparent;
+ -webkit-box-shadow: none;
+ box-shadow: none;
+ color: white;
+}
+
+.button.is-white.is-loading:after {
+ border-color: transparent transparent #0a0a0a #0a0a0a !important;
+}
+
+.button.is-white.is-outlined {
+ background-color: transparent;
+ border-color: white;
+ color: white;
+}
+
+.button.is-white.is-outlined:hover, .button.is-white.is-outlined:focus {
+ background-color: white;
+ border-color: white;
+ color: #0a0a0a;
+}
+
+.button.is-white.is-outlined.is-loading:after {
+ border-color: transparent transparent white white !important;
+}
+
+.button.is-white.is-outlined[disabled] {
+ background-color: transparent;
+ border-color: white;
+ -webkit-box-shadow: none;
+ box-shadow: none;
+ color: white;
+}
+
+.button.is-white.is-inverted.is-outlined {
+ background-color: transparent;
+ border-color: #0a0a0a;
+ color: #0a0a0a;
+}
+
+.button.is-white.is-inverted.is-outlined:hover, .button.is-white.is-inverted.is-outlined:focus {
+ background-color: #0a0a0a;
+ color: white;
+}
+
+.button.is-white.is-inverted.is-outlined[disabled] {
+ background-color: transparent;
+ border-color: #0a0a0a;
+ -webkit-box-shadow: none;
+ box-shadow: none;
+ color: #0a0a0a;
+}
+
+.button.is-black {
+ background-color: #0a0a0a;
+ border-color: transparent;
+ color: white;
+}
+
+.button.is-black:hover, .button.is-black.is-hovered {
+ background-color: #040404;
+ border-color: transparent;
+ color: white;
+}
+
+.button.is-black:focus, .button.is-black.is-focused {
+ border-color: transparent;
+ -webkit-box-shadow: 0 0 0.5em rgba(10, 10, 10, 0.25);
+ box-shadow: 0 0 0.5em rgba(10, 10, 10, 0.25);
+ color: white;
+}
+
+.button.is-black:active, .button.is-black.is-active {
+ background-color: black;
+ border-color: transparent;
+ -webkit-box-shadow: inset 0 1px 2px rgba(10, 10, 10, 0.2);
+ box-shadow: inset 0 1px 2px rgba(10, 10, 10, 0.2);
+ color: white;
+}
+
+.button.is-black[disabled] {
+ background-color: #0a0a0a;
+ border-color: transparent;
+ -webkit-box-shadow: none;
+ box-shadow: none;
+}
+
+.button.is-black.is-inverted {
+ background-color: white;
+ color: #0a0a0a;
+}
+
+.button.is-black.is-inverted:hover {
+ background-color: #f2f2f2;
+}
+
+.button.is-black.is-inverted[disabled] {
+ background-color: white;
+ border-color: transparent;
+ -webkit-box-shadow: none;
+ box-shadow: none;
+ color: #0a0a0a;
+}
+
+.button.is-black.is-loading:after {
+ border-color: transparent transparent white white !important;
+}
+
+.button.is-black.is-outlined {
+ background-color: transparent;
+ border-color: #0a0a0a;
+ color: #0a0a0a;
+}
+
+.button.is-black.is-outlined:hover, .button.is-black.is-outlined:focus {
+ background-color: #0a0a0a;
+ border-color: #0a0a0a;
+ color: white;
+}
+
+.button.is-black.is-outlined.is-loading:after {
+ border-color: transparent transparent #0a0a0a #0a0a0a !important;
+}
+
+.button.is-black.is-outlined[disabled] {
+ background-color: transparent;
+ border-color: #0a0a0a;
+ -webkit-box-shadow: none;
+ box-shadow: none;
+ color: #0a0a0a;
+}
+
+.button.is-black.is-inverted.is-outlined {
+ background-color: transparent;
+ border-color: white;
+ color: white;
+}
+
+.button.is-black.is-inverted.is-outlined:hover, .button.is-black.is-inverted.is-outlined:focus {
+ background-color: white;
+ color: #0a0a0a;
+}
+
+.button.is-black.is-inverted.is-outlined[disabled] {
+ background-color: transparent;
+ border-color: white;
+ -webkit-box-shadow: none;
+ box-shadow: none;
+ color: white;
+}
+
+.button.is-light {
+ background-color: whitesmoke;
+ border-color: transparent;
+ color: #363636;
+}
+
+.button.is-light:hover, .button.is-light.is-hovered {
+ background-color: #eeeeee;
+ border-color: transparent;
+ color: #363636;
+}
+
+.button.is-light:focus, .button.is-light.is-focused {
+ border-color: transparent;
+ -webkit-box-shadow: 0 0 0.5em rgba(245, 245, 245, 0.25);
+ box-shadow: 0 0 0.5em rgba(245, 245, 245, 0.25);
+ color: #363636;
+}
+
+.button.is-light:active, .button.is-light.is-active {
+ background-color: #e8e8e8;
+ border-color: transparent;
+ -webkit-box-shadow: inset 0 1px 2px rgba(10, 10, 10, 0.2);
+ box-shadow: inset 0 1px 2px rgba(10, 10, 10, 0.2);
+ color: #363636;
+}
+
+.button.is-light[disabled] {
+ background-color: whitesmoke;
+ border-color: transparent;
+ -webkit-box-shadow: none;
+ box-shadow: none;
+}
+
+.button.is-light.is-inverted {
+ background-color: #363636;
+ color: whitesmoke;
+}
+
+.button.is-light.is-inverted:hover {
+ background-color: #292929;
+}
+
+.button.is-light.is-inverted[disabled] {
+ background-color: #363636;
+ border-color: transparent;
+ -webkit-box-shadow: none;
+ box-shadow: none;
+ color: whitesmoke;
+}
+
+.button.is-light.is-loading:after {
+ border-color: transparent transparent #363636 #363636 !important;
+}
+
+.button.is-light.is-outlined {
+ background-color: transparent;
+ border-color: whitesmoke;
+ color: whitesmoke;
+}
+
+.button.is-light.is-outlined:hover, .button.is-light.is-outlined:focus {
+ background-color: whitesmoke;
+ border-color: whitesmoke;
+ color: #363636;
+}
+
+.button.is-light.is-outlined.is-loading:after {
+ border-color: transparent transparent whitesmoke whitesmoke !important;
+}
+
+.button.is-light.is-outlined[disabled] {
+ background-color: transparent;
+ border-color: whitesmoke;
+ -webkit-box-shadow: none;
+ box-shadow: none;
+ color: whitesmoke;
+}
+
+.button.is-light.is-inverted.is-outlined {
+ background-color: transparent;
+ border-color: #363636;
+ color: #363636;
+}
+
+.button.is-light.is-inverted.is-outlined:hover, .button.is-light.is-inverted.is-outlined:focus {
+ background-color: #363636;
+ color: whitesmoke;
+}
+
+.button.is-light.is-inverted.is-outlined[disabled] {
+ background-color: transparent;
+ border-color: #363636;
+ -webkit-box-shadow: none;
+ box-shadow: none;
+ color: #363636;
+}
+
+.button.is-dark {
+ background-color: #363636;
+ border-color: transparent;
+ color: whitesmoke;
+}
+
+.button.is-dark:hover, .button.is-dark.is-hovered {
+ background-color: #2f2f2f;
+ border-color: transparent;
+ color: whitesmoke;
+}
+
+.button.is-dark:focus, .button.is-dark.is-focused {
+ border-color: transparent;
+ -webkit-box-shadow: 0 0 0.5em rgba(54, 54, 54, 0.25);
+ box-shadow: 0 0 0.5em rgba(54, 54, 54, 0.25);
+ color: whitesmoke;
+}
+
+.button.is-dark:active, .button.is-dark.is-active {
+ background-color: #292929;
+ border-color: transparent;
+ -webkit-box-shadow: inset 0 1px 2px rgba(10, 10, 10, 0.2);
+ box-shadow: inset 0 1px 2px rgba(10, 10, 10, 0.2);
+ color: whitesmoke;
+}
+
+.button.is-dark[disabled] {
+ background-color: #363636;
+ border-color: transparent;
+ -webkit-box-shadow: none;
+ box-shadow: none;
+}
+
+.button.is-dark.is-inverted {
+ background-color: whitesmoke;
+ color: #363636;
+}
+
+.button.is-dark.is-inverted:hover {
+ background-color: #e8e8e8;
+}
+
+.button.is-dark.is-inverted[disabled] {
+ background-color: whitesmoke;
+ border-color: transparent;
+ -webkit-box-shadow: none;
+ box-shadow: none;
+ color: #363636;
+}
+
+.button.is-dark.is-loading:after {
+ border-color: transparent transparent whitesmoke whitesmoke !important;
+}
+
+.button.is-dark.is-outlined {
+ background-color: transparent;
+ border-color: #363636;
+ color: #363636;
+}
+
+.button.is-dark.is-outlined:hover, .button.is-dark.is-outlined:focus {
+ background-color: #363636;
+ border-color: #363636;
+ color: whitesmoke;
+}
+
+.button.is-dark.is-outlined.is-loading:after {
+ border-color: transparent transparent #363636 #363636 !important;
+}
+
+.button.is-dark.is-outlined[disabled] {
+ background-color: transparent;
+ border-color: #363636;
+ -webkit-box-shadow: none;
+ box-shadow: none;
+ color: #363636;
+}
+
+.button.is-dark.is-inverted.is-outlined {
+ background-color: transparent;
+ border-color: whitesmoke;
+ color: whitesmoke;
+}
+
+.button.is-dark.is-inverted.is-outlined:hover, .button.is-dark.is-inverted.is-outlined:focus {
+ background-color: whitesmoke;
+ color: #363636;
+}
+
+.button.is-dark.is-inverted.is-outlined[disabled] {
+ background-color: transparent;
+ border-color: whitesmoke;
+ -webkit-box-shadow: none;
+ box-shadow: none;
+ color: whitesmoke;
+}
+
+.button.is-primary {
+ background-color: #00d1b2;
+ border-color: transparent;
+ color: #fff;
+}
+
+.button.is-primary:hover, .button.is-primary.is-hovered {
+ background-color: #00c4a7;
+ border-color: transparent;
+ color: #fff;
+}
+
+.button.is-primary:focus, .button.is-primary.is-focused {
+ border-color: transparent;
+ -webkit-box-shadow: 0 0 0.5em rgba(0, 209, 178, 0.25);
+ box-shadow: 0 0 0.5em rgba(0, 209, 178, 0.25);
+ color: #fff;
+}
+
+.button.is-primary:active, .button.is-primary.is-active {
+ background-color: #00b89c;
+ border-color: transparent;
+ -webkit-box-shadow: inset 0 1px 2px rgba(10, 10, 10, 0.2);
+ box-shadow: inset 0 1px 2px rgba(10, 10, 10, 0.2);
+ color: #fff;
+}
+
+.button.is-primary[disabled] {
+ background-color: #00d1b2;
+ border-color: transparent;
+ -webkit-box-shadow: none;
+ box-shadow: none;
+}
+
+.button.is-primary.is-inverted {
+ background-color: #fff;
+ color: #00d1b2;
+}
+
+.button.is-primary.is-inverted:hover {
+ background-color: #f2f2f2;
+}
+
+.button.is-primary.is-inverted[disabled] {
+ background-color: #fff;
+ border-color: transparent;
+ -webkit-box-shadow: none;
+ box-shadow: none;
+ color: #00d1b2;
+}
+
+.button.is-primary.is-loading:after {
+ border-color: transparent transparent #fff #fff !important;
+}
+
+.button.is-primary.is-outlined {
+ background-color: transparent;
+ border-color: #00d1b2;
+ color: #00d1b2;
+}
+
+.button.is-primary.is-outlined:hover, .button.is-primary.is-outlined:focus {
+ background-color: #00d1b2;
+ border-color: #00d1b2;
+ color: #fff;
+}
+
+.button.is-primary.is-outlined.is-loading:after {
+ border-color: transparent transparent #00d1b2 #00d1b2 !important;
+}
+
+.button.is-primary.is-outlined[disabled] {
+ background-color: transparent;
+ border-color: #00d1b2;
+ -webkit-box-shadow: none;
+ box-shadow: none;
+ color: #00d1b2;
+}
+
+.button.is-primary.is-inverted.is-outlined {
+ background-color: transparent;
+ border-color: #fff;
+ color: #fff;
+}
+
+.button.is-primary.is-inverted.is-outlined:hover, .button.is-primary.is-inverted.is-outlined:focus {
+ background-color: #fff;
+ color: #00d1b2;
+}
+
+.button.is-primary.is-inverted.is-outlined[disabled] {
+ background-color: transparent;
+ border-color: #fff;
+ -webkit-box-shadow: none;
+ box-shadow: none;
+ color: #fff;
+}
+
+.button.is-info {
+ background-color: #3273dc;
+ border-color: transparent;
+ color: #fff;
+}
+
+.button.is-info:hover, .button.is-info.is-hovered {
+ background-color: #276cda;
+ border-color: transparent;
+ color: #fff;
+}
+
+.button.is-info:focus, .button.is-info.is-focused {
+ border-color: transparent;
+ -webkit-box-shadow: 0 0 0.5em rgba(50, 115, 220, 0.25);
+ box-shadow: 0 0 0.5em rgba(50, 115, 220, 0.25);
+ color: #fff;
+}
+
+.button.is-info:active, .button.is-info.is-active {
+ background-color: #2366d1;
+ border-color: transparent;
+ -webkit-box-shadow: inset 0 1px 2px rgba(10, 10, 10, 0.2);
+ box-shadow: inset 0 1px 2px rgba(10, 10, 10, 0.2);
+ color: #fff;
+}
+
+.button.is-info[disabled] {
+ background-color: #3273dc;
+ border-color: transparent;
+ -webkit-box-shadow: none;
+ box-shadow: none;
+}
+
+.button.is-info.is-inverted {
+ background-color: #fff;
+ color: #3273dc;
+}
+
+.button.is-info.is-inverted:hover {
+ background-color: #f2f2f2;
+}
+
+.button.is-info.is-inverted[disabled] {
+ background-color: #fff;
+ border-color: transparent;
+ -webkit-box-shadow: none;
+ box-shadow: none;
+ color: #3273dc;
+}
+
+.button.is-info.is-loading:after {
+ border-color: transparent transparent #fff #fff !important;
+}
+
+.button.is-info.is-outlined {
+ background-color: transparent;
+ border-color: #3273dc;
+ color: #3273dc;
+}
+
+.button.is-info.is-outlined:hover, .button.is-info.is-outlined:focus {
+ background-color: #3273dc;
+ border-color: #3273dc;
+ color: #fff;
+}
+
+.button.is-info.is-outlined.is-loading:after {
+ border-color: transparent transparent #3273dc #3273dc !important;
+}
+
+.button.is-info.is-outlined[disabled] {
+ background-color: transparent;
+ border-color: #3273dc;
+ -webkit-box-shadow: none;
+ box-shadow: none;
+ color: #3273dc;
+}
+
+.button.is-info.is-inverted.is-outlined {
+ background-color: transparent;
+ border-color: #fff;
+ color: #fff;
+}
+
+.button.is-info.is-inverted.is-outlined:hover, .button.is-info.is-inverted.is-outlined:focus {
+ background-color: #fff;
+ color: #3273dc;
+}
+
+.button.is-info.is-inverted.is-outlined[disabled] {
+ background-color: transparent;
+ border-color: #fff;
+ -webkit-box-shadow: none;
+ box-shadow: none;
+ color: #fff;
+}
+
+.button.is-success {
+ background-color: #23d160;
+ border-color: transparent;
+ color: #fff;
+}
+
+.button.is-success:hover, .button.is-success.is-hovered {
+ background-color: #22c65b;
+ border-color: transparent;
+ color: #fff;
+}
+
+.button.is-success:focus, .button.is-success.is-focused {
+ border-color: transparent;
+ -webkit-box-shadow: 0 0 0.5em rgba(35, 209, 96, 0.25);
+ box-shadow: 0 0 0.5em rgba(35, 209, 96, 0.25);
+ color: #fff;
+}
+
+.button.is-success:active, .button.is-success.is-active {
+ background-color: #20bc56;
+ border-color: transparent;
+ -webkit-box-shadow: inset 0 1px 2px rgba(10, 10, 10, 0.2);
+ box-shadow: inset 0 1px 2px rgba(10, 10, 10, 0.2);
+ color: #fff;
+}
+
+.button.is-success[disabled] {
+ background-color: #23d160;
+ border-color: transparent;
+ -webkit-box-shadow: none;
+ box-shadow: none;
+}
+
+.button.is-success.is-inverted {
+ background-color: #fff;
+ color: #23d160;
+}
+
+.button.is-success.is-inverted:hover {
+ background-color: #f2f2f2;
+}
+
+.button.is-success.is-inverted[disabled] {
+ background-color: #fff;
+ border-color: transparent;
+ -webkit-box-shadow: none;
+ box-shadow: none;
+ color: #23d160;
+}
+
+.button.is-success.is-loading:after {
+ border-color: transparent transparent #fff #fff !important;
+}
+
+.button.is-success.is-outlined {
+ background-color: transparent;
+ border-color: #23d160;
+ color: #23d160;
+}
+
+.button.is-success.is-outlined:hover, .button.is-success.is-outlined:focus {
+ background-color: #23d160;
+ border-color: #23d160;
+ color: #fff;
+}
+
+.button.is-success.is-outlined.is-loading:after {
+ border-color: transparent transparent #23d160 #23d160 !important;
+}
+
+.button.is-success.is-outlined[disabled] {
+ background-color: transparent;
+ border-color: #23d160;
+ -webkit-box-shadow: none;
+ box-shadow: none;
+ color: #23d160;
+}
+
+.button.is-success.is-inverted.is-outlined {
+ background-color: transparent;
+ border-color: #fff;
+ color: #fff;
+}
+
+.button.is-success.is-inverted.is-outlined:hover, .button.is-success.is-inverted.is-outlined:focus {
+ background-color: #fff;
+ color: #23d160;
+}
+
+.button.is-success.is-inverted.is-outlined[disabled] {
+ background-color: transparent;
+ border-color: #fff;
+ -webkit-box-shadow: none;
+ box-shadow: none;
+ color: #fff;
+}
+
+.button.is-warning {
+ background-color: #ffdd57;
+ border-color: transparent;
+ color: rgba(0, 0, 0, 0.7);
+}
+
+.button.is-warning:hover, .button.is-warning.is-hovered {
+ background-color: #ffdb4a;
+ border-color: transparent;
+ color: rgba(0, 0, 0, 0.7);
+}
+
+.button.is-warning:focus, .button.is-warning.is-focused {
+ border-color: transparent;
+ -webkit-box-shadow: 0 0 0.5em rgba(255, 221, 87, 0.25);
+ box-shadow: 0 0 0.5em rgba(255, 221, 87, 0.25);
+ color: rgba(0, 0, 0, 0.7);
+}
+
+.button.is-warning:active, .button.is-warning.is-active {
+ background-color: #ffd83d;
+ border-color: transparent;
+ -webkit-box-shadow: inset 0 1px 2px rgba(10, 10, 10, 0.2);
+ box-shadow: inset 0 1px 2px rgba(10, 10, 10, 0.2);
+ color: rgba(0, 0, 0, 0.7);
+}
+
+.button.is-warning[disabled] {
+ background-color: #ffdd57;
+ border-color: transparent;
+ -webkit-box-shadow: none;
+ box-shadow: none;
+}
+
+.button.is-warning.is-inverted {
+ background-color: rgba(0, 0, 0, 0.7);
+ color: #ffdd57;
+}
+
+.button.is-warning.is-inverted:hover {
+ background-color: rgba(0, 0, 0, 0.7);
+}
+
+.button.is-warning.is-inverted[disabled] {
+ background-color: rgba(0, 0, 0, 0.7);
+ border-color: transparent;
+ -webkit-box-shadow: none;
+ box-shadow: none;
+ color: #ffdd57;
+}
+
+.button.is-warning.is-loading:after {
+ border-color: transparent transparent rgba(0, 0, 0, 0.7) rgba(0, 0, 0, 0.7) !important;
+}
+
+.button.is-warning.is-outlined {
+ background-color: transparent;
+ border-color: #ffdd57;
+ color: #ffdd57;
+}
+
+.button.is-warning.is-outlined:hover, .button.is-warning.is-outlined:focus {
+ background-color: #ffdd57;
+ border-color: #ffdd57;
+ color: rgba(0, 0, 0, 0.7);
+}
+
+.button.is-warning.is-outlined.is-loading:after {
+ border-color: transparent transparent #ffdd57 #ffdd57 !important;
+}
+
+.button.is-warning.is-outlined[disabled] {
+ background-color: transparent;
+ border-color: #ffdd57;
+ -webkit-box-shadow: none;
+ box-shadow: none;
+ color: #ffdd57;
+}
+
+.button.is-warning.is-inverted.is-outlined {
+ background-color: transparent;
+ border-color: rgba(0, 0, 0, 0.7);
+ color: rgba(0, 0, 0, 0.7);
+}
+
+.button.is-warning.is-inverted.is-outlined:hover, .button.is-warning.is-inverted.is-outlined:focus {
+ background-color: rgba(0, 0, 0, 0.7);
+ color: #ffdd57;
+}
+
+.button.is-warning.is-inverted.is-outlined[disabled] {
+ background-color: transparent;
+ border-color: rgba(0, 0, 0, 0.7);
+ -webkit-box-shadow: none;
+ box-shadow: none;
+ color: rgba(0, 0, 0, 0.7);
+}
+
+.button.is-danger {
+ background-color: #ff3860;
+ border-color: transparent;
+ color: #fff;
+}
+
+.button.is-danger:hover, .button.is-danger.is-hovered {
+ background-color: #ff2b56;
+ border-color: transparent;
+ color: #fff;
+}
+
+.button.is-danger:focus, .button.is-danger.is-focused {
+ border-color: transparent;
+ -webkit-box-shadow: 0 0 0.5em rgba(255, 56, 96, 0.25);
+ box-shadow: 0 0 0.5em rgba(255, 56, 96, 0.25);
+ color: #fff;
+}
+
+.button.is-danger:active, .button.is-danger.is-active {
+ background-color: #ff1f4b;
+ border-color: transparent;
+ -webkit-box-shadow: inset 0 1px 2px rgba(10, 10, 10, 0.2);
+ box-shadow: inset 0 1px 2px rgba(10, 10, 10, 0.2);
+ color: #fff;
+}
+
+.button.is-danger[disabled] {
+ background-color: #ff3860;
+ border-color: transparent;
+ -webkit-box-shadow: none;
+ box-shadow: none;
+}
+
+.button.is-danger.is-inverted {
+ background-color: #fff;
+ color: #ff3860;
+}
+
+.button.is-danger.is-inverted:hover {
+ background-color: #f2f2f2;
+}
+
+.button.is-danger.is-inverted[disabled] {
+ background-color: #fff;
+ border-color: transparent;
+ -webkit-box-shadow: none;
+ box-shadow: none;
+ color: #ff3860;
+}
+
+.button.is-danger.is-loading:after {
+ border-color: transparent transparent #fff #fff !important;
+}
+
+.button.is-danger.is-outlined {
+ background-color: transparent;
+ border-color: #ff3860;
+ color: #ff3860;
+}
+
+.button.is-danger.is-outlined:hover, .button.is-danger.is-outlined:focus {
+ background-color: #ff3860;
+ border-color: #ff3860;
+ color: #fff;
+}
+
+.button.is-danger.is-outlined.is-loading:after {
+ border-color: transparent transparent #ff3860 #ff3860 !important;
+}
+
+.button.is-danger.is-outlined[disabled] {
+ background-color: transparent;
+ border-color: #ff3860;
+ -webkit-box-shadow: none;
+ box-shadow: none;
+ color: #ff3860;
+}
+
+.button.is-danger.is-inverted.is-outlined {
+ background-color: transparent;
+ border-color: #fff;
+ color: #fff;
+}
+
+.button.is-danger.is-inverted.is-outlined:hover, .button.is-danger.is-inverted.is-outlined:focus {
+ background-color: #fff;
+ color: #ff3860;
+}
+
+.button.is-danger.is-inverted.is-outlined[disabled] {
+ background-color: transparent;
+ border-color: #fff;
+ -webkit-box-shadow: none;
+ box-shadow: none;
+ color: #fff;
+}
+
+.button.is-small {
+ border-radius: 2px;
+ font-size: 0.75rem;
+}
+
+.button.is-medium {
+ font-size: 1.25rem;
+}
+
+.button.is-large {
+ font-size: 1.5rem;
+}
+
+.button[disabled] {
+ background-color: white;
+ border-color: #dbdbdb;
+ -webkit-box-shadow: none;
+ box-shadow: none;
+ opacity: 0.5;
+}
+
+.button.is-fullwidth {
+ display: -webkit-box;
+ display: -ms-flexbox;
+ display: flex;
+ width: 100%;
+}
+
+.button.is-loading {
+ color: transparent !important;
+ pointer-events: none;
+}
+
+.button.is-loading:after {
+ -webkit-animation: spinAround 500ms infinite linear;
+ animation: spinAround 500ms infinite linear;
+ border: 2px solid #dbdbdb;
+ border-radius: 290486px;
+ border-right-color: transparent;
+ border-top-color: transparent;
+ content: "";
+ display: block;
+ height: 1em;
+ position: relative;
+ width: 1em;
+ position: absolute;
+ left: calc(50% - (1em / 2));
+ top: calc(50% - (1em / 2));
+ position: absolute !important;
+}
+
+.button.is-static {
+ background-color: whitesmoke;
+ border-color: #dbdbdb;
+ color: #7a7a7a;
+ -webkit-box-shadow: none;
+ box-shadow: none;
+ pointer-events: none;
+}
+
+button.button,
+input[type="submit"].button {
+ line-height: 1;
+ padding-bottom: 0.4em;
+ padding-top: 0.35em;
+}
+
+.content:not(:last-child) {
+ margin-bottom: 1.5rem;
+}
+
+.content li + li {
+ margin-top: 0.25em;
+}
+
+.content p:not(:last-child),
+.content dl:not(:last-child),
+.content ol:not(:last-child),
+.content ul:not(:last-child),
+.content blockquote:not(:last-child),
+.content pre:not(:last-child),
+.content table:not(:last-child) {
+ margin-bottom: 1em;
+}
+
+.content h1,
+.content h2,
+.content h3,
+.content h4,
+.content h5,
+.content h6 {
+ color: #363636;
+ font-weight: 400;
+ line-height: 1.125;
+}
+
+.content h1 {
+ font-size: 2em;
+ margin-bottom: 0.5em;
+}
+
+.content h1:not(:first-child) {
+ margin-top: 1em;
+}
+
+.content h2 {
+ font-size: 1.75em;
+ margin-bottom: 0.5714em;
+}
+
+.content h2:not(:first-child) {
+ margin-top: 1.1428em;
+}
+
+.content h3 {
+ font-size: 1.5em;
+ margin-bottom: 0.6666em;
+}
+
+.content h3:not(:first-child) {
+ margin-top: 1.3333em;
+}
+
+.content h4 {
+ font-size: 1.25em;
+ margin-bottom: 0.8em;
+}
+
+.content h5 {
+ font-size: 1.125em;
+ margin-bottom: 0.8888em;
+}
+
+.content h6 {
+ font-size: 1em;
+ margin-bottom: 1em;
+}
+
+.content blockquote {
+ background-color: whitesmoke;
+ border-left: 5px solid #dbdbdb;
+ padding: 1.25em 1.5em;
+}
+
+.content ol {
+ list-style: decimal outside;
+ margin-left: 2em;
+ margin-top: 1em;
+}
+
+.content ul {
+ list-style: disc outside;
+ margin-left: 2em;
+ margin-top: 1em;
+}
+
+.content ul ul {
+ list-style-type: circle;
+ margin-top: 0.5em;
+}
+
+.content ul ul ul {
+ list-style-type: square;
+}
+
+.content dd {
+ margin-left: 2em;
+}
+
+.content figure {
+ text-align: center;
+}
+
+.content figure img {
+ display: inline-block;
+}
+
+.content figure figcaption {
+ font-style: italic;
+}
+
+.content pre {
+ -webkit-overflow-scrolling: touch;
+ overflow-x: auto;
+ padding: 1.25em 1.5em;
+ white-space: pre;
+ word-wrap: normal;
+}
+
+.content sup,
+.content sub {
+ font-size: 70%;
+}
+
+.content table {
+ width: 100%;
+}
+
+.content table td,
+.content table th {
+ border: 1px solid #dbdbdb;
+ border-width: 0 0 1px;
+ padding: 0.5em 0.75em;
+ vertical-align: top;
+}
+
+.content table th {
+ color: #363636;
+ text-align: left;
+}
+
+.content table tr:hover {
+ background-color: whitesmoke;
+}
+
+.content table thead td,
+.content table thead th {
+ border-width: 0 0 2px;
+ color: #363636;
+}
+
+.content table tfoot td,
+.content table tfoot th {
+ border-width: 2px 0 0;
+ color: #363636;
+}
+
+.content table tbody tr:last-child td,
+.content table tbody tr:last-child th {
+ border-bottom-width: 0;
+}
+
+.content.is-small {
+ font-size: 0.75rem;
+}
+
+.content.is-medium {
+ font-size: 1.25rem;
+}
+
+.content.is-large {
+ font-size: 1.5rem;
+}
+
+.input,
+.textarea {
+ -moz-appearance: none;
+ -webkit-appearance: none;
+ -webkit-box-align: center;
+ -ms-flex-align: center;
+ align-items: center;
+ border: 1px solid transparent;
+ border-radius: 3px;
+ -webkit-box-shadow: none;
+ box-shadow: none;
+ display: -webkit-inline-box;
+ display: -ms-inline-flexbox;
+ display: inline-flex;
+ font-size: 1rem;
+ height: 2.25em;
+ -webkit-box-pack: start;
+ -ms-flex-pack: start;
+ justify-content: flex-start;
+ line-height: 1.5;
+ padding-bottom: calc(0.375em - 1px);
+ padding-left: calc(0.625em - 1px);
+ padding-right: calc(0.625em - 1px);
+ padding-top: calc(0.375em - 1px);
+ position: relative;
+ vertical-align: top;
+ background-color: white;
+ border-color: #dbdbdb;
+ color: #363636;
+ -webkit-box-shadow: inset 0 1px 2px rgba(10, 10, 10, 0.1);
+ box-shadow: inset 0 1px 2px rgba(10, 10, 10, 0.1);
+ max-width: 100%;
+ width: 100%;
+}
+
+.input:focus, .input.is-focused, .input:active, .input.is-active,
+.textarea:focus,
+.textarea.is-focused,
+.textarea:active,
+.textarea.is-active {
+ outline: none;
+}
+
+.input[disabled],
+.textarea[disabled] {
+ cursor: not-allowed;
+}
+
+.input:hover, .input.is-hovered,
+.textarea:hover,
+.textarea.is-hovered {
+ border-color: #b5b5b5;
+}
+
+.input:focus, .input.is-focused, .input:active, .input.is-active,
+.textarea:focus,
+.textarea.is-focused,
+.textarea:active,
+.textarea.is-active {
+ border-color: #00d1b2;
+}
+
+.input[disabled],
+.textarea[disabled] {
+ background-color: whitesmoke;
+ border-color: whitesmoke;
+ -webkit-box-shadow: none;
+ box-shadow: none;
+ color: #7a7a7a;
+}
+
+.input[disabled]::-moz-placeholder,
+.textarea[disabled]::-moz-placeholder {
+ color: rgba(54, 54, 54, 0.3);
+}
+
+.input[disabled]::-webkit-input-placeholder,
+.textarea[disabled]::-webkit-input-placeholder {
+ color: rgba(54, 54, 54, 0.3);
+}
+
+.input[disabled]:-moz-placeholder,
+.textarea[disabled]:-moz-placeholder {
+ color: rgba(54, 54, 54, 0.3);
+}
+
+.input[disabled]:-ms-input-placeholder,
+.textarea[disabled]:-ms-input-placeholder {
+ color: rgba(54, 54, 54, 0.3);
+}
+
+.input[type="search"],
+.textarea[type="search"] {
+ border-radius: 290486px;
+}
+
+.input.is-white,
+.textarea.is-white {
+ border-color: white;
+}
+
+.input.is-black,
+.textarea.is-black {
+ border-color: #0a0a0a;
+}
+
+.input.is-light,
+.textarea.is-light {
+ border-color: whitesmoke;
+}
+
+.input.is-dark,
+.textarea.is-dark {
+ border-color: #363636;
+}
+
+.input.is-primary,
+.textarea.is-primary {
+ border-color: #00d1b2;
+}
+
+.input.is-info,
+.textarea.is-info {
+ border-color: #3273dc;
+}
+
+.input.is-success,
+.textarea.is-success {
+ border-color: #23d160;
+}
+
+.input.is-warning,
+.textarea.is-warning {
+ border-color: #ffdd57;
+}
+
+.input.is-danger,
+.textarea.is-danger {
+ border-color: #ff3860;
+}
+
+.input.is-small,
+.textarea.is-small {
+ border-radius: 2px;
+ font-size: 0.75rem;
+}
+
+.input.is-medium,
+.textarea.is-medium {
+ font-size: 1.25rem;
+}
+
+.input.is-large,
+.textarea.is-large {
+ font-size: 1.5rem;
+}
+
+.input.is-fullwidth,
+.textarea.is-fullwidth {
+ display: block;
+ width: 100%;
+}
+
+.input.is-inline,
+.textarea.is-inline {
+ display: inline;
+ width: auto;
+}
+
+.textarea {
+ display: block;
+ max-width: 100%;
+ min-width: 100%;
+ padding: 0.625em;
+ resize: vertical;
+}
+
+.textarea:not([rows]) {
+ max-height: 600px;
+ min-height: 120px;
+}
+
+.textarea[rows] {
+ height: unset;
+}
+
+.checkbox,
+.radio {
+ cursor: pointer;
+ display: inline-block;
+ line-height: 1.25;
+ position: relative;
+}
+
+.checkbox input,
+.radio input {
+ cursor: pointer;
+}
+
+.checkbox:hover,
+.radio:hover {
+ color: #363636;
+}
+
+.checkbox[disabled],
+.radio[disabled] {
+ color: #7a7a7a;
+ cursor: not-allowed;
+}
+
+.radio + .radio {
+ margin-left: 0.5em;
+}
+
+.select {
+ display: inline-block;
+ max-width: 100%;
+ position: relative;
+ vertical-align: top;
+}
+
+.select:not(.is-multiple) {
+ height: 2.25em;
+}
+
+.select:not(.is-multiple)::after {
+ border: 1px solid #00d1b2;
+ border-right: 0;
+ border-top: 0;
+ content: " ";
+ display: block;
+ height: 0.5em;
+ pointer-events: none;
+ position: absolute;
+ -webkit-transform: rotate(-45deg);
+ transform: rotate(-45deg);
+ width: 0.5em;
+ margin-top: -0.375em;
+ right: 1.125em;
+ top: 50%;
+ z-index: 4;
+}
+
+.select select {
+ -moz-appearance: none;
+ -webkit-appearance: none;
+ -webkit-box-align: center;
+ -ms-flex-align: center;
+ align-items: center;
+ border: 1px solid transparent;
+ border-radius: 3px;
+ -webkit-box-shadow: none;
+ box-shadow: none;
+ display: -webkit-inline-box;
+ display: -ms-inline-flexbox;
+ display: inline-flex;
+ font-size: 1rem;
+ height: 2.25em;
+ -webkit-box-pack: start;
+ -ms-flex-pack: start;
+ justify-content: flex-start;
+ line-height: 1.5;
+ padding-bottom: calc(0.375em - 1px);
+ padding-left: calc(0.625em - 1px);
+ padding-right: calc(0.625em - 1px);
+ padding-top: calc(0.375em - 1px);
+ position: relative;
+ vertical-align: top;
+ background-color: white;
+ border-color: #dbdbdb;
+ color: #363636;
+ cursor: pointer;
+ display: block;
+ font-size: 1em;
+ max-width: 100%;
+ outline: none;
+}
+
+.select select:focus, .select select.is-focused, .select select:active, .select select.is-active {
+ outline: none;
+}
+
+.select select[disabled] {
+ cursor: not-allowed;
+}
+
+.select select:hover, .select select.is-hovered {
+ border-color: #b5b5b5;
+}
+
+.select select:focus, .select select.is-focused, .select select:active, .select select.is-active {
+ border-color: #00d1b2;
+}
+
+.select select[disabled] {
+ background-color: whitesmoke;
+ border-color: whitesmoke;
+ -webkit-box-shadow: none;
+ box-shadow: none;
+ color: #7a7a7a;
+}
+
+.select select[disabled]::-moz-placeholder {
+ color: rgba(54, 54, 54, 0.3);
+}
+
+.select select[disabled]::-webkit-input-placeholder {
+ color: rgba(54, 54, 54, 0.3);
+}
+
+.select select[disabled]:-moz-placeholder {
+ color: rgba(54, 54, 54, 0.3);
+}
+
+.select select[disabled]:-ms-input-placeholder {
+ color: rgba(54, 54, 54, 0.3);
+}
+
+.select select:hover {
+ border-color: #b5b5b5;
+}
+
+.select select:focus, .select select.is-focused, .select select:active, .select select.is-active {
+ border-color: #00d1b2;
+}
+
+.select select::-ms-expand {
+ display: none;
+}
+
+.select select[disabled]:hover {
+ border-color: whitesmoke;
+}
+
+.select select:not([multiple]) {
+ padding-right: 2.5em;
+}
+
+.select select[multiple] {
+ height: unset;
+ padding: 0;
+}
+
+.select select[multiple] option {
+ padding: 0.5em 1em;
+}
+
+.select:hover::after {
+ border-color: #363636;
+}
+
+.select.is-white select {
+ border-color: white;
+}
+
+.select.is-black select {
+ border-color: #0a0a0a;
+}
+
+.select.is-light select {
+ border-color: whitesmoke;
+}
+
+.select.is-dark select {
+ border-color: #363636;
+}
+
+.select.is-primary select {
+ border-color: #00d1b2;
+}
+
+.select.is-info select {
+ border-color: #3273dc;
+}
+
+.select.is-success select {
+ border-color: #23d160;
+}
+
+.select.is-warning select {
+ border-color: #ffdd57;
+}
+
+.select.is-danger select {
+ border-color: #ff3860;
+}
+
+.select.is-small {
+ border-radius: 2px;
+ font-size: 0.75rem;
+}
+
+.select.is-medium {
+ font-size: 1.25rem;
+}
+
+.select.is-large {
+ font-size: 1.5rem;
+}
+
+.select.is-disabled::after {
+ border-color: #7a7a7a;
+}
+
+.select.is-fullwidth {
+ width: 100%;
+}
+
+.select.is-fullwidth select {
+ width: 100%;
+}
+
+.select.is-loading::after {
+ -webkit-animation: spinAround 500ms infinite linear;
+ animation: spinAround 500ms infinite linear;
+ border: 2px solid #dbdbdb;
+ border-radius: 290486px;
+ border-right-color: transparent;
+ border-top-color: transparent;
+ content: "";
+ display: block;
+ height: 1em;
+ position: relative;
+ width: 1em;
+ margin-top: 0;
+ position: absolute;
+ right: 0.625em;
+ top: 0.625em;
+ -webkit-transform: none;
+ transform: none;
+}
+
+.select.is-loading.is-small:after {
+ font-size: 0.75rem;
+}
+
+.select.is-loading.is-medium:after {
+ font-size: 1.25rem;
+}
+
+.select.is-loading.is-large:after {
+ font-size: 1.5rem;
+}
+
+.label {
+ color: #363636;
+ display: block;
+ font-size: 1rem;
+ font-weight: 700;
+}
+
+.label:not(:last-child) {
+ margin-bottom: 0.5em;
+}
+
+.label.is-small {
+ font-size: 0.75rem;
+}
+
+.label.is-medium {
+ font-size: 1.25rem;
+}
+
+.label.is-large {
+ font-size: 1.5rem;
+}
+
+.help {
+ display: block;
+ font-size: 0.75rem;
+ margin-top: 0.25rem;
+}
+
+.help.is-white {
+ color: white;
+}
+
+.help.is-black {
+ color: #0a0a0a;
+}
+
+.help.is-light {
+ color: whitesmoke;
+}
+
+.help.is-dark {
+ color: #363636;
+}
+
+.help.is-primary {
+ color: #00d1b2;
+}
+
+.help.is-info {
+ color: #3273dc;
+}
+
+.help.is-success {
+ color: #23d160;
+}
+
+.help.is-warning {
+ color: #ffdd57;
+}
+
+.help.is-danger {
+ color: #ff3860;
+}
+
+.field:not(:last-child) {
+ margin-bottom: 0.75rem;
+}
+
+.field.has-addons {
+ display: -webkit-box;
+ display: -ms-flexbox;
+ display: flex;
+ -webkit-box-pack: start;
+ -ms-flex-pack: start;
+ justify-content: flex-start;
+}
+
+.field.has-addons .control:not(:last-child) {
+ margin-right: -1px;
+}
+
+.field.has-addons .control:first-child .button,
+.field.has-addons .control:first-child .input,
+.field.has-addons .control:first-child .select select {
+ border-bottom-left-radius: 3px;
+ border-top-left-radius: 3px;
+}
+
+.field.has-addons .control:last-child .button,
+.field.has-addons .control:last-child .input,
+.field.has-addons .control:last-child .select select {
+ border-bottom-right-radius: 3px;
+ border-top-right-radius: 3px;
+}
+
+.field.has-addons .control .button,
+.field.has-addons .control .input,
+.field.has-addons .control .select select {
+ border-radius: 0;
+}
+
+.field.has-addons .control .button:hover, .field.has-addons .control .button.is-hovered,
+.field.has-addons .control .input:hover,
+.field.has-addons .control .input.is-hovered,
+.field.has-addons .control .select select:hover,
+.field.has-addons .control .select select.is-hovered {
+ z-index: 2;
+}
+
+.field.has-addons .control .button:focus, .field.has-addons .control .button.is-focused, .field.has-addons .control .button:active, .field.has-addons .control .button.is-active,
+.field.has-addons .control .input:focus,
+.field.has-addons .control .input.is-focused,
+.field.has-addons .control .input:active,
+.field.has-addons .control .input.is-active,
+.field.has-addons .control .select select:focus,
+.field.has-addons .control .select select.is-focused,
+.field.has-addons .control .select select:active,
+.field.has-addons .control .select select.is-active {
+ z-index: 3;
+}
+
+.field.has-addons .control .button:focus:hover, .field.has-addons .control .button.is-focused:hover, .field.has-addons .control .button:active:hover, .field.has-addons .control .button.is-active:hover,
+.field.has-addons .control .input:focus:hover,
+.field.has-addons .control .input.is-focused:hover,
+.field.has-addons .control .input:active:hover,
+.field.has-addons .control .input.is-active:hover,
+.field.has-addons .control .select select:focus:hover,
+.field.has-addons .control .select select.is-focused:hover,
+.field.has-addons .control .select select:active:hover,
+.field.has-addons .control .select select.is-active:hover {
+ z-index: 4;
+}
+
+.field.has-addons .control.is-expanded {
+ -webkit-box-flex: 1;
+ -ms-flex-positive: 1;
+ flex-grow: 1;
+}
+
+.field.has-addons.has-addons-centered {
+ -webkit-box-pack: center;
+ -ms-flex-pack: center;
+ justify-content: center;
+}
+
+.field.has-addons.has-addons-right {
+ -webkit-box-pack: end;
+ -ms-flex-pack: end;
+ justify-content: flex-end;
+}
+
+.field.has-addons.has-addons-fullwidth .control {
+ -webkit-box-flex: 1;
+ -ms-flex-positive: 1;
+ flex-grow: 1;
+ -ms-flex-negative: 0;
+ flex-shrink: 0;
+}
+
+.field.is-grouped {
+ display: -webkit-box;
+ display: -ms-flexbox;
+ display: flex;
+ -webkit-box-pack: start;
+ -ms-flex-pack: start;
+ justify-content: flex-start;
+}
+
+.field.is-grouped > .control {
+ -ms-flex-negative: 0;
+ flex-shrink: 0;
+}
+
+.field.is-grouped > .control:not(:last-child) {
+ margin-bottom: 0;
+ margin-right: 0.75rem;
+}
+
+.field.is-grouped > .control.is-expanded {
+ -webkit-box-flex: 1;
+ -ms-flex-positive: 1;
+ flex-grow: 1;
+ -ms-flex-negative: 1;
+ flex-shrink: 1;
+}
+
+.field.is-grouped.is-grouped-centered {
+ -webkit-box-pack: center;
+ -ms-flex-pack: center;
+ justify-content: center;
+}
+
+.field.is-grouped.is-grouped-right {
+ -webkit-box-pack: end;
+ -ms-flex-pack: end;
+ justify-content: flex-end;
+}
+
+.field.is-grouped.is-grouped-multiline {
+ flex-wrap: wrap;
+}
+
+.field.is-grouped.is-grouped-multiline > .control:last-child, .field.is-grouped.is-grouped-multiline > .control:not(:last-child) {
+ margin-bottom: 0.75rem;
+}
+
+.field.is-grouped.is-grouped-multiline:last-child {
+ margin-bottom: -0.75rem;
+}
+
+.field.is-grouped.is-grouped-multiline:not(:last-child) {
+ margin-bottom: 0;
+}
+
+@media screen and (min-width: 769px), print {
+ .field.is-horizontal {
+ display: -webkit-box;
+ display: -ms-flexbox;
+ display: flex;
+ }
+}
+
+.field-label .label {
+ font-size: inherit;
+}
+
+@media screen and (max-width: 768px) {
+ .field-label {
+ margin-bottom: 0.5rem;
+ }
+}
+
+@media screen and (min-width: 769px), print {
+ .field-label {
+ -ms-flex-preferred-size: 0;
+ flex-basis: 0;
+ -webkit-box-flex: 1;
+ -ms-flex-positive: 1;
+ flex-grow: 1;
+ -ms-flex-negative: 0;
+ flex-shrink: 0;
+ margin-right: 1.5rem;
+ text-align: right;
+ }
+ .field-label.is-small {
+ font-size: 0.75rem;
+ padding-top: 0.375em;
+ }
+ .field-label.is-normal {
+ padding-top: 0.375em;
+ }
+ .field-label.is-medium {
+ font-size: 1.25rem;
+ padding-top: 0.375em;
+ }
+ .field-label.is-large {
+ font-size: 1.5rem;
+ padding-top: 0.375em;
+ }
+}
+
+.field-body .field .field {
+ margin-bottom: 0;
+}
+
+@media screen and (min-width: 769px), print {
+ .field-body {
+ display: -webkit-box;
+ display: -ms-flexbox;
+ display: flex;
+ -ms-flex-preferred-size: 0;
+ flex-basis: 0;
+ -webkit-box-flex: 5;
+ -ms-flex-positive: 5;
+ flex-grow: 5;
+ -ms-flex-negative: 1;
+ flex-shrink: 1;
+ }
+ .field-body .field {
+ margin-bottom: 0;
+ }
+ .field-body > .field {
+ -ms-flex-negative: 1;
+ flex-shrink: 1;
+ }
+ .field-body > .field:not(.is-narrow) {
+ -webkit-box-flex: 1;
+ -ms-flex-positive: 1;
+ flex-grow: 1;
+ }
+ .field-body > .field:not(:last-child) {
+ margin-right: 0.75rem;
+ }
+}
+
+.control {
+ font-size: 1rem;
+ position: relative;
+ text-align: left;
+}
+
+.control.has-icon .icon {
+ color: #dbdbdb;
+ height: 2.25em;
+ pointer-events: none;
+ position: absolute;
+ top: 0;
+ width: 2.25em;
+ z-index: 4;
+}
+
+.control.has-icon .input:focus + .icon {
+ color: #7a7a7a;
+}
+
+.control.has-icon .input.is-small + .icon {
+ font-size: 0.75rem;
+}
+
+.control.has-icon .input.is-medium + .icon {
+ font-size: 1.25rem;
+}
+
+.control.has-icon .input.is-large + .icon {
+ font-size: 1.5rem;
+}
+
+.control.has-icon:not(.has-icon-right) .icon {
+ left: 0;
+}
+
+.control.has-icon:not(.has-icon-right) .input {
+ padding-left: 2.25em;
+}
+
+.control.has-icon.has-icon-right .icon {
+ right: 0;
+}
+
+.control.has-icon.has-icon-right .input {
+ padding-right: 2.25em;
+}
+
+.control.has-icons-left .input:focus ~ .icon,
+.control.has-icons-left .select:focus ~ .icon, .control.has-icons-right .input:focus ~ .icon,
+.control.has-icons-right .select:focus ~ .icon {
+ color: #7a7a7a;
+}
+
+.control.has-icons-left .input.is-small ~ .icon,
+.control.has-icons-left .select.is-small ~ .icon, .control.has-icons-right .input.is-small ~ .icon,
+.control.has-icons-right .select.is-small ~ .icon {
+ font-size: 0.75rem;
+}
+
+.control.has-icons-left .input.is-medium ~ .icon,
+.control.has-icons-left .select.is-medium ~ .icon, .control.has-icons-right .input.is-medium ~ .icon,
+.control.has-icons-right .select.is-medium ~ .icon {
+ font-size: 1.25rem;
+}
+
+.control.has-icons-left .input.is-large ~ .icon,
+.control.has-icons-left .select.is-large ~ .icon, .control.has-icons-right .input.is-large ~ .icon,
+.control.has-icons-right .select.is-large ~ .icon {
+ font-size: 1.5rem;
+}
+
+.control.has-icons-left .icon, .control.has-icons-right .icon {
+ color: #dbdbdb;
+ height: 2.25em;
+ pointer-events: none;
+ position: absolute;
+ top: 0;
+ width: 2.25em;
+ z-index: 4;
+}
+
+.control.has-icons-left .input,
+.control.has-icons-left .select select {
+ padding-left: 2.25em;
+}
+
+.control.has-icons-left .icon.is-left {
+ left: 0;
+}
+
+.control.has-icons-right .input,
+.control.has-icons-right .select select {
+ padding-right: 2.25em;
+}
+
+.control.has-icons-right .icon.is-right {
+ right: 0;
+}
+
+.control.is-loading::after {
+ -webkit-animation: spinAround 500ms infinite linear;
+ animation: spinAround 500ms infinite linear;
+ border: 2px solid #dbdbdb;
+ border-radius: 290486px;
+ border-right-color: transparent;
+ border-top-color: transparent;
+ content: "";
+ display: block;
+ height: 1em;
+ position: relative;
+ width: 1em;
+ position: absolute !important;
+ right: 0.625em;
+ top: 0.625em;
+}
+
+.control.is-loading.is-small:after {
+ font-size: 0.75rem;
+}
+
+.control.is-loading.is-medium:after {
+ font-size: 1.25rem;
+}
+
+.control.is-loading.is-large:after {
+ font-size: 1.5rem;
+}
+
+.icon {
+ -webkit-box-align: center;
+ -ms-flex-align: center;
+ align-items: center;
+ display: -webkit-inline-box;
+ display: -ms-inline-flexbox;
+ display: inline-flex;
+ -webkit-box-pack: center;
+ -ms-flex-pack: center;
+ justify-content: center;
+ height: 1.5rem;
+ width: 1.5rem;
+}
+
+.icon .fa {
+ font-size: 21px;
+}
+
+.icon.is-small {
+ height: 1rem;
+ width: 1rem;
+}
+
+.icon.is-small .fa {
+ font-size: 14px;
+}
+
+.icon.is-medium {
+ height: 2rem;
+ width: 2rem;
+}
+
+.icon.is-medium .fa {
+ font-size: 28px;
+}
+
+.icon.is-large {
+ height: 3rem;
+ width: 3rem;
+}
+
+.icon.is-large .fa {
+ font-size: 42px;
+}
+
+.image {
+ display: block;
+ position: relative;
+}
+
+.image img {
+ display: block;
+ height: auto;
+ width: 100%;
+}
+
+.image.is-square img, .image.is-1by1 img, .image.is-4by3 img, .image.is-3by2 img, .image.is-16by9 img, .image.is-2by1 img {
+ bottom: 0;
+ left: 0;
+ position: absolute;
+ right: 0;
+ top: 0;
+ height: 100%;
+ width: 100%;
+}
+
+.image.is-square, .image.is-1by1 {
+ padding-top: 100%;
+}
+
+.image.is-4by3 {
+ padding-top: 75%;
+}
+
+.image.is-3by2 {
+ padding-top: 66.6666%;
+}
+
+.image.is-16by9 {
+ padding-top: 56.25%;
+}
+
+.image.is-2by1 {
+ padding-top: 50%;
+}
+
+.image.is-16x16 {
+ height: 16px;
+ width: 16px;
+}
+
+.image.is-24x24 {
+ height: 24px;
+ width: 24px;
+}
+
+.image.is-32x32 {
+ height: 32px;
+ width: 32px;
+}
+
+.image.is-48x48 {
+ height: 48px;
+ width: 48px;
+}
+
+.image.is-64x64 {
+ height: 64px;
+ width: 64px;
+}
+
+.image.is-96x96 {
+ height: 96px;
+ width: 96px;
+}
+
+.image.is-128x128 {
+ height: 128px;
+ width: 128px;
+}
+
+.notification {
+ background-color: whitesmoke;
+ border-radius: 3px;
+ padding: 1.25rem 2.5rem 1.25rem 1.5rem;
+ position: relative;
+}
+
+.notification:not(:last-child) {
+ margin-bottom: 1.5rem;
+}
+
+.notification a:not(.button) {
+ color: currentColor;
+ text-decoration: underline;
+}
+
+.notification strong {
+ color: currentColor;
+}
+
+.notification code,
+.notification pre {
+ background: white;
+}
+
+.notification pre code {
+ background: transparent;
+}
+
+.notification > .delete {
+ position: absolute;
+ right: 0.5em;
+ top: 0.5em;
+}
+
+.notification .title,
+.notification .subtitle,
+.notification .content {
+ color: currentColor;
+}
+
+.notification.is-white {
+ background-color: white;
+ color: #0a0a0a;
+}
+
+.notification.is-black {
+ background-color: #0a0a0a;
+ color: white;
+}
+
+.notification.is-light {
+ background-color: whitesmoke;
+ color: #363636;
+}
+
+.notification.is-dark {
+ background-color: #363636;
+ color: whitesmoke;
+}
+
+.notification.is-primary {
+ background-color: #00d1b2;
+ color: #fff;
+}
+
+.notification.is-info {
+ background-color: #3273dc;
+ color: #fff;
+}
+
+.notification.is-success {
+ background-color: #23d160;
+ color: #fff;
+}
+
+.notification.is-warning {
+ background-color: #ffdd57;
+ color: rgba(0, 0, 0, 0.7);
+}
+
+.notification.is-danger {
+ background-color: #ff3860;
+ color: #fff;
+}
+
+.progress {
+ -moz-appearance: none;
+ -webkit-appearance: none;
+ border: none;
+ border-radius: 290486px;
+ display: block;
+ height: 1rem;
+ overflow: hidden;
+ padding: 0;
+ width: 100%;
+}
+
+.progress:not(:last-child) {
+ margin-bottom: 1.5rem;
+}
+
+.progress::-webkit-progress-bar {
+ background-color: #dbdbdb;
+}
+
+.progress::-webkit-progress-value {
+ background-color: #4a4a4a;
+}
+
+.progress::-moz-progress-bar {
+ background-color: #4a4a4a;
+}
+
+.progress.is-white::-webkit-progress-value {
+ background-color: white;
+}
+
+.progress.is-white::-moz-progress-bar {
+ background-color: white;
+}
+
+.progress.is-black::-webkit-progress-value {
+ background-color: #0a0a0a;
+}
+
+.progress.is-black::-moz-progress-bar {
+ background-color: #0a0a0a;
+}
+
+.progress.is-light::-webkit-progress-value {
+ background-color: whitesmoke;
+}
+
+.progress.is-light::-moz-progress-bar {
+ background-color: whitesmoke;
+}
+
+.progress.is-dark::-webkit-progress-value {
+ background-color: #363636;
+}
+
+.progress.is-dark::-moz-progress-bar {
+ background-color: #363636;
+}
+
+.progress.is-primary::-webkit-progress-value {
+ background-color: #00d1b2;
+}
+
+.progress.is-primary::-moz-progress-bar {
+ background-color: #00d1b2;
+}
+
+.progress.is-info::-webkit-progress-value {
+ background-color: #3273dc;
+}
+
+.progress.is-info::-moz-progress-bar {
+ background-color: #3273dc;
+}
+
+.progress.is-success::-webkit-progress-value {
+ background-color: #23d160;
+}
+
+.progress.is-success::-moz-progress-bar {
+ background-color: #23d160;
+}
+
+.progress.is-warning::-webkit-progress-value {
+ background-color: #ffdd57;
+}
+
+.progress.is-warning::-moz-progress-bar {
+ background-color: #ffdd57;
+}
+
+.progress.is-danger::-webkit-progress-value {
+ background-color: #ff3860;
+}
+
+.progress.is-danger::-moz-progress-bar {
+ background-color: #ff3860;
+}
+
+.progress.is-small {
+ height: 0.75rem;
+}
+
+.progress.is-medium {
+ height: 1.25rem;
+}
+
+.progress.is-large {
+ height: 1.5rem;
+}
+
+.table {
+ background-color: white;
+ color: #363636;
+ margin-bottom: 1.5rem;
+ width: 100%;
+}
+
+.table td,
+.table th {
+ border: 1px solid #dbdbdb;
+ border-width: 0 0 1px;
+ padding: 0.5em 0.75em;
+ vertical-align: top;
+}
+
+.table td.is-narrow,
+.table th.is-narrow {
+ white-space: nowrap;
+ width: 1%;
+}
+
+.table th {
+ color: #363636;
+ text-align: left;
+}
+
+.table tr:hover {
+ background-color: #fafafa;
+}
+
+.table tr.is-selected {
+ background-color: #00d1b2;
+ color: #fff;
+}
+
+.table tr.is-selected a,
+.table tr.is-selected strong {
+ color: currentColor;
+}
+
+.table tr.is-selected td,
+.table tr.is-selected th {
+ border-color: #fff;
+ color: currentColor;
+}
+
+.table thead td,
+.table thead th {
+ border-width: 0 0 2px;
+ color: #7a7a7a;
+}
+
+.table tfoot td,
+.table tfoot th {
+ border-width: 2px 0 0;
+ color: #7a7a7a;
+}
+
+.table tbody tr:last-child td,
+.table tbody tr:last-child th {
+ border-bottom-width: 0;
+}
+
+.table.is-bordered td,
+.table.is-bordered th {
+ border-width: 1px;
+}
+
+.table.is-bordered tr:last-child td,
+.table.is-bordered tr:last-child th {
+ border-bottom-width: 1px;
+}
+
+.table.is-narrow td,
+.table.is-narrow th {
+ padding: 0.25em 0.5em;
+}
+
+.table.is-striped tbody tr:not(.is-selected):nth-child(even) {
+ background-color: #fafafa;
+}
+
+.table.is-striped tbody tr:not(.is-selected):nth-child(even):hover {
+ background-color: whitesmoke;
+}
+
+.tag {
+ -webkit-box-align: center;
+ -ms-flex-align: center;
+ align-items: center;
+ background-color: whitesmoke;
+ border-radius: 290486px;
+ color: #4a4a4a;
+ display: -webkit-inline-box;
+ display: -ms-inline-flexbox;
+ display: inline-flex;
+ font-size: 0.75rem;
+ height: 2em;
+ -webkit-box-pack: center;
+ -ms-flex-pack: center;
+ justify-content: center;
+ line-height: 1.5;
+ padding-left: 0.875em;
+ padding-right: 0.875em;
+ white-space: nowrap;
+}
+
+.tag .delete {
+ margin-left: 0.25em;
+ margin-right: -0.375em;
+}
+
+.tag.is-white {
+ background-color: white;
+ color: #0a0a0a;
+}
+
+.tag.is-black {
+ background-color: #0a0a0a;
+ color: white;
+}
+
+.tag.is-light {
+ background-color: whitesmoke;
+ color: #363636;
+}
+
+.tag.is-dark {
+ background-color: #363636;
+ color: whitesmoke;
+}
+
+.tag.is-primary {
+ background-color: #00d1b2;
+ color: #fff;
+}
+
+.tag.is-info {
+ background-color: #3273dc;
+ color: #fff;
+}
+
+.tag.is-success {
+ background-color: #23d160;
+ color: #fff;
+}
+
+.tag.is-warning {
+ background-color: #ffdd57;
+ color: rgba(0, 0, 0, 0.7);
+}
+
+.tag.is-danger {
+ background-color: #ff3860;
+ color: #fff;
+}
+
+.tag.is-medium {
+ font-size: 1rem;
+}
+
+.tag.is-large {
+ font-size: 1.25rem;
+}
+
+.title,
+.subtitle {
+ word-break: break-word;
+}
+
+.title:not(:last-child),
+.subtitle:not(:last-child) {
+ margin-bottom: 1.5rem;
+}
+
+.title em,
+.title span,
+.subtitle em,
+.subtitle span {
+ font-weight: 300;
+}
+
+.title strong,
+.subtitle strong {
+ font-weight: 500;
+}
+
+.title .tag,
+.subtitle .tag {
+ vertical-align: middle;
+}
+
+.title {
+ color: #363636;
+ font-size: 2rem;
+ font-weight: 300;
+ line-height: 1.125;
+}
+
+.title strong {
+ color: inherit;
+}
+
+.title + .highlight {
+ margin-top: -0.75rem;
+}
+
+.title:not(.is-spaced) + .subtitle {
+ margin-top: -1.5rem;
+}
+
+.title.is-1 {
+ font-size: 3rem;
+}
+
+.title.is-2 {
+ font-size: 2.5rem;
+}
+
+.title.is-3 {
+ font-size: 2rem;
+}
+
+.title.is-4 {
+ font-size: 1.5rem;
+}
+
+.title.is-5 {
+ font-size: 1.25rem;
+}
+
+.title.is-6 {
+ font-size: 1rem;
+}
+
+.subtitle {
+ color: #4a4a4a;
+ font-size: 1.25rem;
+ font-weight: 300;
+ line-height: 1.25;
+}
+
+.subtitle strong {
+ color: #363636;
+}
+
+.subtitle:not(.is-spaced) + .title {
+ margin-top: -1.5rem;
+}
+
+.subtitle.is-1 {
+ font-size: 3rem;
+}
+
+.subtitle.is-2 {
+ font-size: 2.5rem;
+}
+
+.subtitle.is-3 {
+ font-size: 2rem;
+}
+
+.subtitle.is-4 {
+ font-size: 1.5rem;
+}
+
+.subtitle.is-5 {
+ font-size: 1.25rem;
+}
+
+.subtitle.is-6 {
+ font-size: 1rem;
+}
+
+.block:not(:last-child) {
+ margin-bottom: 1.5rem;
+}
+
+.container {
+ margin: 0 auto;
+ position: relative;
+}
+
+@media screen and (min-width: 1008px) {
+ .container {
+ max-width: 960px;
+ width: 960px;
+ }
+ .container.is-fluid {
+ margin-left: 24px;
+ margin-right: 24px;
+ max-width: none;
+ width: auto;
+ }
+}
+
+@media screen and (max-width: 1199px) {
+ .container.is-widescreen {
+ max-width: 1152px;
+ width: auto;
+ }
+}
+
+@media screen and (max-width: 1391px) {
+ .container.is-fullhd {
+ max-width: 1344px;
+ width: auto;
+ }
+}
+
+@media screen and (min-width: 1200px) {
+ .container {
+ max-width: 1152px;
+ width: 1152px;
+ }
+}
+
+@media screen and (min-width: 1392px) {
+ .container {
+ max-width: 1344px;
+ width: 1344px;
+ }
+}
+
+.delete {
+ -webkit-touch-callout: none;
+ -webkit-user-select: none;
+ -moz-user-select: none;
+ -ms-user-select: none;
+ user-select: none;
+ -moz-appearance: none;
+ -webkit-appearance: none;
+ background-color: rgba(10, 10, 10, 0.2);
+ border: none;
+ border-radius: 290486px;
+ cursor: pointer;
+ display: inline-block;
+ -webkit-box-flex: 0;
+ -ms-flex-positive: 0;
+ flex-grow: 0;
+ -ms-flex-negative: 0;
+ flex-shrink: 0;
+ font-size: 1rem;
+ height: 20px;
+ max-height: 20px;
+ max-width: 20px;
+ min-height: 20px;
+ min-width: 20px;
+ outline: none;
+ position: relative;
+ vertical-align: top;
+ width: 20px;
+}
+
+.delete:before, .delete:after {
+ background-color: white;
+ content: "";
+ display: block;
+ left: 50%;
+ position: absolute;
+ top: 50%;
+ -webkit-transform: translateX(-50%) translateY(-50%) rotate(45deg);
+ transform: translateX(-50%) translateY(-50%) rotate(45deg);
+ -webkit-transform-origin: center center;
+ transform-origin: center center;
+}
+
+.delete:before {
+ height: 2px;
+ width: 50%;
+}
+
+.delete:after {
+ height: 50%;
+ width: 2px;
+}
+
+.delete:hover, .delete:focus {
+ background-color: rgba(10, 10, 10, 0.3);
+}
+
+.delete:active {
+ background-color: rgba(10, 10, 10, 0.4);
+}
+
+.delete.is-small {
+ height: 16px;
+ max-height: 16px;
+ max-width: 16px;
+ min-height: 16px;
+ min-width: 16px;
+ width: 16px;
+}
+
+.delete.is-medium {
+ height: 24px;
+ max-height: 24px;
+ max-width: 24px;
+ min-height: 24px;
+ min-width: 24px;
+ width: 24px;
+}
+
+.delete.is-large {
+ height: 32px;
+ max-height: 32px;
+ max-width: 32px;
+ min-height: 32px;
+ min-width: 32px;
+ width: 32px;
+}
+
+.fa {
+ font-size: 21px;
+ text-align: center;
+ vertical-align: top;
+}
+
+.heading {
+ display: block;
+ font-size: 11px;
+ letter-spacing: 1px;
+ margin-bottom: 5px;
+ text-transform: uppercase;
+}
+
+.highlight {
+ font-weight: 400;
+ max-width: 100%;
+ overflow: hidden;
+ padding: 0;
+}
+
+.highlight:not(:last-child) {
+ margin-bottom: 1.5rem;
+}
+
+.highlight pre {
+ overflow: auto;
+ max-width: 100%;
+}
+
+.loader {
+ -webkit-animation: spinAround 500ms infinite linear;
+ animation: spinAround 500ms infinite linear;
+ border: 2px solid #dbdbdb;
+ border-radius: 290486px;
+ border-right-color: transparent;
+ border-top-color: transparent;
+ content: "";
+ display: block;
+ height: 1em;
+ position: relative;
+ width: 1em;
+}
+
+.number {
+ -webkit-box-align: center;
+ -ms-flex-align: center;
+ align-items: center;
+ background-color: whitesmoke;
+ border-radius: 290486px;
+ display: -webkit-inline-box;
+ display: -ms-inline-flexbox;
+ display: inline-flex;
+ font-size: 1.25rem;
+ height: 2em;
+ -webkit-box-pack: center;
+ -ms-flex-pack: center;
+ justify-content: center;
+ margin-right: 1.5rem;
+ min-width: 2.5em;
+ padding: 0.25rem 0.5rem;
+ text-align: center;
+ vertical-align: top;
+}
+
+.breadcrumb {
+ -webkit-touch-callout: none;
+ -webkit-user-select: none;
+ -moz-user-select: none;
+ -ms-user-select: none;
+ user-select: none;
+ -webkit-box-align: stretch;
+ -ms-flex-align: stretch;
+ align-items: stretch;
+ display: -webkit-box;
+ display: -ms-flexbox;
+ display: flex;
+ font-size: 1rem;
+ overflow: hidden;
+ overflow-x: auto;
+ white-space: nowrap;
+}
+
+.breadcrumb:not(:last-child) {
+ margin-bottom: 1.5rem;
+}
+
+.breadcrumb a {
+ -webkit-box-align: center;
+ -ms-flex-align: center;
+ align-items: center;
+ color: #7a7a7a;
+ display: -webkit-box;
+ display: -ms-flexbox;
+ display: flex;
+ -webkit-box-pack: center;
+ -ms-flex-pack: center;
+ justify-content: center;
+ padding: 0.5em 0.75em;
+}
+
+.breadcrumb a:hover {
+ color: #363636;
+}
+
+.breadcrumb li {
+ -webkit-box-align: center;
+ -ms-flex-align: center;
+ align-items: center;
+ display: -webkit-box;
+ display: -ms-flexbox;
+ display: flex;
+}
+
+.breadcrumb li.is-active a {
+ color: #363636;
+ cursor: default;
+ pointer-events: none;
+}
+
+.breadcrumb li + li:before {
+ color: #4a4a4a;
+ content: '\0002f';
+}
+
+.breadcrumb ul, .breadcrumb ol {
+ -webkit-box-align: center;
+ -ms-flex-align: center;
+ align-items: center;
+ display: -webkit-box;
+ display: -ms-flexbox;
+ display: flex;
+ -webkit-box-flex: 1;
+ -ms-flex-positive: 1;
+ flex-grow: 1;
+ -ms-flex-negative: 0;
+ flex-shrink: 0;
+ -webkit-box-pack: start;
+ -ms-flex-pack: start;
+ justify-content: flex-start;
+}
+
+.breadcrumb .icon:first-child {
+ margin-right: 0.5em;
+}
+
+.breadcrumb .icon:last-child {
+ margin-left: 0.5em;
+}
+
+.breadcrumb.is-centered ol, .breadcrumb.is-centered ul {
+ -webkit-box-pack: center;
+ -ms-flex-pack: center;
+ justify-content: center;
+}
+
+.breadcrumb.is-right ol, .breadcrumb.is-right ul {
+ -webkit-box-pack: end;
+ -ms-flex-pack: end;
+ justify-content: flex-end;
+}
+
+.breadcrumb.is-small {
+ font-size: 0.75rem;
+}
+
+.breadcrumb.is-medium {
+ font-size: 1.25rem;
+}
+
+.breadcrumb.is-large {
+ font-size: 1.5rem;
+}
+
+.breadcrumb.has-arrow-separator li + li:before {
+ content: '\02192';
+}
+
+.breadcrumb.has-bullet-separator li + li:before {
+ content: '\02022';
+}
+
+.breadcrumb.has-dot-separator li + li:before {
+ content: '\000b7';
+}
+
+.breadcrumb.has-succeeds-separator li + li:before {
+ content: '\0227B';
+}
+
+.card {
+ background-color: white;
+ -webkit-box-shadow: 0 2px 3px rgba(10, 10, 10, 0.1), 0 0 0 1px rgba(10, 10, 10, 0.1);
+ box-shadow: 0 2px 3px rgba(10, 10, 10, 0.1), 0 0 0 1px rgba(10, 10, 10, 0.1);
+ color: #4a4a4a;
+ max-width: 100%;
+ position: relative;
+}
+
+.card-header {
+ -webkit-box-align: stretch;
+ -ms-flex-align: stretch;
+ align-items: stretch;
+ -webkit-box-shadow: 0 1px 2px rgba(10, 10, 10, 0.1);
+ box-shadow: 0 1px 2px rgba(10, 10, 10, 0.1);
+ display: -webkit-box;
+ display: -ms-flexbox;
+ display: flex;
+}
+
+.card-header-title {
+ -webkit-box-align: center;
+ -ms-flex-align: center;
+ align-items: center;
+ color: #363636;
+ display: -webkit-box;
+ display: -ms-flexbox;
+ display: flex;
+ -webkit-box-flex: 1;
+ -ms-flex-positive: 1;
+ flex-grow: 1;
+ font-weight: 700;
+ padding: 0.75rem;
+}
+
+.card-header-icon {
+ -webkit-box-align: center;
+ -ms-flex-align: center;
+ align-items: center;
+ cursor: pointer;
+ display: -webkit-box;
+ display: -ms-flexbox;
+ display: flex;
+ -webkit-box-pack: center;
+ -ms-flex-pack: center;
+ justify-content: center;
+ padding: 0.75rem;
+}
+
+.card-image {
+ display: block;
+ position: relative;
+}
+
+.card-content {
+ padding: 1.5rem;
+}
+
+.card-footer {
+ border-top: 1px solid #dbdbdb;
+ -webkit-box-align: stretch;
+ -ms-flex-align: stretch;
+ align-items: stretch;
+ display: -webkit-box;
+ display: -ms-flexbox;
+ display: flex;
+}
+
+.card-footer-item {
+ -webkit-box-align: center;
+ -ms-flex-align: center;
+ align-items: center;
+ display: -webkit-box;
+ display: -ms-flexbox;
+ display: flex;
+ -ms-flex-preferred-size: 0;
+ flex-basis: 0;
+ -webkit-box-flex: 1;
+ -ms-flex-positive: 1;
+ flex-grow: 1;
+ -ms-flex-negative: 0;
+ flex-shrink: 0;
+ -webkit-box-pack: center;
+ -ms-flex-pack: center;
+ justify-content: center;
+ padding: 0.75rem;
+}
+
+.card-footer-item:not(:last-child) {
+ border-right: 1px solid #dbdbdb;
+}
+
+.card .media:not(:last-child) {
+ margin-bottom: 0.75rem;
+}
+
+.dropdown {
+ display: -webkit-inline-box;
+ display: -ms-inline-flexbox;
+ display: inline-flex;
+ position: relative;
+ vertical-align: top;
+}
+
+.dropdown.is-active .dropdown-menu, .dropdown.is-hoverable:hover .dropdown-menu {
+ display: block;
+}
+
+.dropdown.is-right .dropdown-menu {
+ left: auto;
+ right: 0;
+}
+
+.dropdown-menu {
+ display: none;
+ left: 0;
+ max-width: 20rem;
+ min-width: 12rem;
+ padding-top: 4px;
+ position: absolute;
+ top: 100%;
+ width: 100%;
+ z-index: 20;
+}
+
+.dropdown-content {
+ background-color: white;
+ border-radius: 3px;
+ -webkit-box-shadow: 0 2px 3px rgba(10, 10, 10, 0.1), 0 0 0 1px rgba(10, 10, 10, 0.1);
+ box-shadow: 0 2px 3px rgba(10, 10, 10, 0.1), 0 0 0 1px rgba(10, 10, 10, 0.1);
+ padding-bottom: 0.5rem;
+ padding-top: 0.5rem;
+}
+
+.dropdown-item {
+ color: #4a4a4a;
+ display: block;
+ font-size: 0.875rem;
+ line-height: 1.5;
+ padding: 0.375rem 1rem;
+ position: relative;
+}
+
+a.dropdown-item {
+ padding-right: 3rem;
+ white-space: nowrap;
+}
+
+a.dropdown-item:hover {
+ background-color: whitesmoke;
+ color: #0a0a0a;
+}
+
+a.dropdown-item.is-active {
+ background-color: #00d1b2;
+ color: #fff;
+}
+
+.dropdown-divider {
+ background-color: #dbdbdb;
+ border: none;
+ display: block;
+ height: 1px;
+ margin: 0.5rem 0;
+}
+
+.level-item {
+ -webkit-box-align: center;
+ -ms-flex-align: center;
+ align-items: center;
+ display: -webkit-box;
+ display: -ms-flexbox;
+ display: flex;
+ -ms-flex-preferred-size: auto;
+ flex-basis: auto;
+ -webkit-box-flex: 0;
+ -ms-flex-positive: 0;
+ flex-grow: 0;
+ -ms-flex-negative: 0;
+ flex-shrink: 0;
+ -webkit-box-pack: center;
+ -ms-flex-pack: center;
+ justify-content: center;
+}
+
+.level-item .title,
+.level-item .subtitle {
+ margin-bottom: 0;
+}
+
+@media screen and (max-width: 768px) {
+ .level-item:not(:last-child) {
+ margin-bottom: 0.75rem;
+ }
+}
+
+.level-left,
+.level-right {
+ -ms-flex-preferred-size: auto;
+ flex-basis: auto;
+ -webkit-box-flex: 0;
+ -ms-flex-positive: 0;
+ flex-grow: 0;
+ -ms-flex-negative: 0;
+ flex-shrink: 0;
+}
+
+.level-left .level-item:not(:last-child),
+.level-right .level-item:not(:last-child) {
+ margin-right: 0.75rem;
+}
+
+.level-left .level-item.is-flexible,
+.level-right .level-item.is-flexible {
+ -webkit-box-flex: 1;
+ -ms-flex-positive: 1;
+ flex-grow: 1;
+}
+
+.level-left {
+ -webkit-box-align: center;
+ -ms-flex-align: center;
+ align-items: center;
+ -webkit-box-pack: start;
+ -ms-flex-pack: start;
+ justify-content: flex-start;
+}
+
+@media screen and (max-width: 768px) {
+ .level-left + .level-right {
+ margin-top: 1.5rem;
+ }
+}
+
+@media screen and (min-width: 769px), print {
+ .level-left {
+ display: -webkit-box;
+ display: -ms-flexbox;
+ display: flex;
+ }
+}
+
+.level-right {
+ -webkit-box-align: center;
+ -ms-flex-align: center;
+ align-items: center;
+ -webkit-box-pack: end;
+ -ms-flex-pack: end;
+ justify-content: flex-end;
+}
+
+@media screen and (min-width: 769px), print {
+ .level-right {
+ display: -webkit-box;
+ display: -ms-flexbox;
+ display: flex;
+ }
+}
+
+.level {
+ -webkit-box-align: center;
+ -ms-flex-align: center;
+ align-items: center;
+ -webkit-box-pack: justify;
+ -ms-flex-pack: justify;
+ justify-content: space-between;
+}
+
+.level:not(:last-child) {
+ margin-bottom: 1.5rem;
+}
+
+.level code {
+ border-radius: 3px;
+}
+
+.level img {
+ display: inline-block;
+ vertical-align: top;
+}
+
+.level.is-mobile {
+ display: -webkit-box;
+ display: -ms-flexbox;
+ display: flex;
+}
+
+.level.is-mobile .level-left,
+.level.is-mobile .level-right {
+ display: -webkit-box;
+ display: -ms-flexbox;
+ display: flex;
+}
+
+.level.is-mobile .level-left + .level-right {
+ margin-top: 0;
+}
+
+.level.is-mobile .level-item:not(:last-child) {
+ margin-bottom: 0;
+}
+
+.level.is-mobile .level-item:not(.is-narrow) {
+ -webkit-box-flex: 1;
+ -ms-flex-positive: 1;
+ flex-grow: 1;
+}
+
+@media screen and (min-width: 769px), print {
+ .level {
+ display: -webkit-box;
+ display: -ms-flexbox;
+ display: flex;
+ }
+ .level > .level-item:not(.is-narrow) {
+ -webkit-box-flex: 1;
+ -ms-flex-positive: 1;
+ flex-grow: 1;
+ }
+}
+
+.media-left,
+.media-right {
+ -ms-flex-preferred-size: auto;
+ flex-basis: auto;
+ -webkit-box-flex: 0;
+ -ms-flex-positive: 0;
+ flex-grow: 0;
+ -ms-flex-negative: 0;
+ flex-shrink: 0;
+}
+
+.media-left {
+ margin-right: 1rem;
+}
+
+.media-right {
+ margin-left: 1rem;
+}
+
+.media-content {
+ -ms-flex-preferred-size: auto;
+ flex-basis: auto;
+ -webkit-box-flex: 1;
+ -ms-flex-positive: 1;
+ flex-grow: 1;
+ -ms-flex-negative: 1;
+ flex-shrink: 1;
+ text-align: left;
+}
+
+.media {
+ -webkit-box-align: start;
+ -ms-flex-align: start;
+ align-items: flex-start;
+ display: -webkit-box;
+ display: -ms-flexbox;
+ display: flex;
+ text-align: left;
+}
+
+.media .content:not(:last-child) {
+ margin-bottom: 0.75rem;
+}
+
+.media .media {
+ border-top: 1px solid rgba(219, 219, 219, 0.5);
+ display: -webkit-box;
+ display: -ms-flexbox;
+ display: flex;
+ padding-top: 0.75rem;
+}
+
+.media .media .content:not(:last-child),
+.media .media .control:not(:last-child) {
+ margin-bottom: 0.5rem;
+}
+
+.media .media .media {
+ padding-top: 0.5rem;
+}
+
+.media .media .media + .media {
+ margin-top: 0.5rem;
+}
+
+.media + .media {
+ border-top: 1px solid rgba(219, 219, 219, 0.5);
+ margin-top: 1rem;
+ padding-top: 1rem;
+}
+
+.media.is-large + .media {
+ margin-top: 1.5rem;
+ padding-top: 1.5rem;
+}
+
+.menu {
+ font-size: 1rem;
+}
+
+.menu-list {
+ line-height: 1.25;
+}
+
+.menu-list a {
+ border-radius: 2px;
+ color: #4a4a4a;
+ display: block;
+ padding: 0.5em 0.75em;
+}
+
+.menu-list a:hover {
+ background-color: whitesmoke;
+ color: #00d1b2;
+}
+
+.menu-list a.is-active {
+ background-color: #00d1b2;
+ color: #fff;
+}
+
+.menu-list li ul {
+ border-left: 1px solid #dbdbdb;
+ margin: 0.75em;
+ padding-left: 0.75em;
+}
+
+.menu-label {
+ color: #7a7a7a;
+ font-size: 0.8em;
+ letter-spacing: 0.1em;
+ text-transform: uppercase;
+}
+
+.menu-label:not(:first-child) {
+ margin-top: 1em;
+}
+
+.menu-label:not(:last-child) {
+ margin-bottom: 1em;
+}
+
+.message {
+ background-color: whitesmoke;
+ border-radius: 3px;
+ font-size: 1rem;
+}
+
+.message:not(:last-child) {
+ margin-bottom: 1.5rem;
+}
+
+.message.is-white {
+ background-color: white;
+}
+
+.message.is-white .message-header {
+ background-color: white;
+ color: #0a0a0a;
+}
+
+.message.is-white .message-body {
+ border-color: white;
+ color: #4d4d4d;
+}
+
+.message.is-black {
+ background-color: #fafafa;
+}
+
+.message.is-black .message-header {
+ background-color: #0a0a0a;
+ color: white;
+}
+
+.message.is-black .message-body {
+ border-color: #0a0a0a;
+ color: #090909;
+}
+
+.message.is-light {
+ background-color: #fafafa;
+}
+
+.message.is-light .message-header {
+ background-color: whitesmoke;
+ color: #363636;
+}
+
+.message.is-light .message-body {
+ border-color: whitesmoke;
+ color: #505050;
+}
+
+.message.is-dark {
+ background-color: #fafafa;
+}
+
+.message.is-dark .message-header {
+ background-color: #363636;
+ color: whitesmoke;
+}
+
+.message.is-dark .message-body {
+ border-color: #363636;
+ color: #2a2a2a;
+}
+
+.message.is-primary {
+ background-color: #f5fffd;
+}
+
+.message.is-primary .message-header {
+ background-color: #00d1b2;
+ color: #fff;
+}
+
+.message.is-primary .message-body {
+ border-color: #00d1b2;
+ color: #021310;
+}
+
+.message.is-info {
+ background-color: #f6f9fe;
+}
+
+.message.is-info .message-header {
+ background-color: #3273dc;
+ color: #fff;
+}
+
+.message.is-info .message-body {
+ border-color: #3273dc;
+ color: #22509a;
+}
+
+.message.is-success {
+ background-color: #f6fef9;
+}
+
+.message.is-success .message-header {
+ background-color: #23d160;
+ color: #fff;
+}
+
+.message.is-success .message-body {
+ border-color: #23d160;
+ color: #0e301a;
+}
+
+.message.is-warning {
+ background-color: #fffdf5;
+}
+
+.message.is-warning .message-header {
+ background-color: #ffdd57;
+ color: rgba(0, 0, 0, 0.7);
+}
+
+.message.is-warning .message-body {
+ border-color: #ffdd57;
+ color: #3b3108;
+}
+
+.message.is-danger {
+ background-color: #fff5f7;
+}
+
+.message.is-danger .message-header {
+ background-color: #ff3860;
+ color: #fff;
+}
+
+.message.is-danger .message-body {
+ border-color: #ff3860;
+ color: #cd0930;
+}
+
+.message-header {
+ -webkit-box-align: center;
+ -ms-flex-align: center;
+ align-items: center;
+ background-color: #4a4a4a;
+ border-radius: 3px 3px 0 0;
+ color: #fff;
+ display: -webkit-box;
+ display: -ms-flexbox;
+ display: flex;
+ -webkit-box-pack: justify;
+ -ms-flex-pack: justify;
+ justify-content: space-between;
+ line-height: 1.25;
+ padding: 0.5em 0.75em;
+ position: relative;
+}
+
+.message-header a:not(.button),
+.message-header strong {
+ color: currentColor;
+}
+
+.message-header a:not(.button) {
+ text-decoration: underline;
+}
+
+.message-header .delete {
+ -webkit-box-flex: 0;
+ -ms-flex-positive: 0;
+ flex-grow: 0;
+ -ms-flex-negative: 0;
+ flex-shrink: 0;
+ margin-left: 0.75em;
+}
+
+.message-header + .message-body {
+ border-top-left-radius: 0;
+ border-top-right-radius: 0;
+ border-top: none;
+}
+
+.message-body {
+ border: 1px solid #dbdbdb;
+ border-radius: 3px;
+ color: #4a4a4a;
+ padding: 1em 1.25em;
+}
+
+.message-body a:not(.button),
+.message-body strong {
+ color: currentColor;
+}
+
+.message-body a:not(.button) {
+ text-decoration: underline;
+}
+
+.message-body code,
+.message-body pre {
+ background: white;
+}
+
+.message-body pre code {
+ background: transparent;
+}
+
+.modal-background {
+ bottom: 0;
+ left: 0;
+ position: absolute;
+ right: 0;
+ top: 0;
+ background-color: rgba(10, 10, 10, 0.86);
+}
+
+.modal-content,
+.modal-card {
+ margin: 0 20px;
+ max-height: calc(100vh - 160px);
+ overflow: auto;
+ position: relative;
+ width: 100%;
+}
+
+@media screen and (min-width: 769px), print {
+ .modal-content,
+ .modal-card {
+ margin: 0 auto;
+ max-height: calc(100vh - 40px);
+ width: 640px;
+ }
+}
+
+.modal-close {
+ -webkit-touch-callout: none;
+ -webkit-user-select: none;
+ -moz-user-select: none;
+ -ms-user-select: none;
+ user-select: none;
+ -moz-appearance: none;
+ -webkit-appearance: none;
+ background-color: rgba(10, 10, 10, 0.2);
+ border: none;
+ border-radius: 290486px;
+ cursor: pointer;
+ display: inline-block;
+ -webkit-box-flex: 0;
+ -ms-flex-positive: 0;
+ flex-grow: 0;
+ -ms-flex-negative: 0;
+ flex-shrink: 0;
+ font-size: 1rem;
+ height: 20px;
+ max-height: 20px;
+ max-width: 20px;
+ min-height: 20px;
+ min-width: 20px;
+ outline: none;
+ position: relative;
+ vertical-align: top;
+ width: 20px;
+ background: none;
+ height: 40px;
+ position: fixed;
+ right: 20px;
+ top: 20px;
+ width: 40px;
+}
+
+.modal-close:before, .modal-close:after {
+ background-color: white;
+ content: "";
+ display: block;
+ left: 50%;
+ position: absolute;
+ top: 50%;
+ -webkit-transform: translateX(-50%) translateY(-50%) rotate(45deg);
+ transform: translateX(-50%) translateY(-50%) rotate(45deg);
+ -webkit-transform-origin: center center;
+ transform-origin: center center;
+}
+
+.modal-close:before {
+ height: 2px;
+ width: 50%;
+}
+
+.modal-close:after {
+ height: 50%;
+ width: 2px;
+}
+
+.modal-close:hover, .modal-close:focus {
+ background-color: rgba(10, 10, 10, 0.3);
+}
+
+.modal-close:active {
+ background-color: rgba(10, 10, 10, 0.4);
+}
+
+.modal-close.is-small {
+ height: 16px;
+ max-height: 16px;
+ max-width: 16px;
+ min-height: 16px;
+ min-width: 16px;
+ width: 16px;
+}
+
+.modal-close.is-medium {
+ height: 24px;
+ max-height: 24px;
+ max-width: 24px;
+ min-height: 24px;
+ min-width: 24px;
+ width: 24px;
+}
+
+.modal-close.is-large {
+ height: 32px;
+ max-height: 32px;
+ max-width: 32px;
+ min-height: 32px;
+ min-width: 32px;
+ width: 32px;
+}
+
+.modal-card {
+ display: -webkit-box;
+ display: -ms-flexbox;
+ display: flex;
+ -webkit-box-orient: vertical;
+ -webkit-box-direction: normal;
+ -ms-flex-direction: column;
+ flex-direction: column;
+ max-height: calc(100vh - 40px);
+ overflow: hidden;
+}
+
+.modal-card-head,
+.modal-card-foot {
+ -webkit-box-align: center;
+ -ms-flex-align: center;
+ align-items: center;
+ background-color: whitesmoke;
+ display: -webkit-box;
+ display: -ms-flexbox;
+ display: flex;
+ -ms-flex-negative: 0;
+ flex-shrink: 0;
+ -webkit-box-pack: start;
+ -ms-flex-pack: start;
+ justify-content: flex-start;
+ padding: 20px;
+ position: relative;
+}
+
+.modal-card-head {
+ border-bottom: 1px solid #dbdbdb;
+ border-top-left-radius: 5px;
+ border-top-right-radius: 5px;
+}
+
+.modal-card-title {
+ color: #363636;
+ -webkit-box-flex: 1;
+ -ms-flex-positive: 1;
+ flex-grow: 1;
+ -ms-flex-negative: 0;
+ flex-shrink: 0;
+ font-size: 1.5rem;
+ line-height: 1;
+}
+
+.modal-card-foot {
+ border-bottom-left-radius: 5px;
+ border-bottom-right-radius: 5px;
+ border-top: 1px solid #dbdbdb;
+}
+
+.modal-card-foot .button:not(:last-child) {
+ margin-right: 10px;
+}
+
+.modal-card-body {
+ -webkit-overflow-scrolling: touch;
+ background-color: white;
+ -webkit-box-flex: 1;
+ -ms-flex-positive: 1;
+ flex-grow: 1;
+ -ms-flex-negative: 1;
+ flex-shrink: 1;
+ overflow: auto;
+ padding: 20px;
+}
+
+.modal {
+ bottom: 0;
+ left: 0;
+ position: absolute;
+ right: 0;
+ top: 0;
+ -webkit-box-align: center;
+ -ms-flex-align: center;
+ align-items: center;
+ display: none;
+ -webkit-box-pack: center;
+ -ms-flex-pack: center;
+ justify-content: center;
+ overflow: hidden;
+ position: fixed;
+ z-index: 20;
+}
+
+.modal.is-active {
+ display: -webkit-box;
+ display: -ms-flexbox;
+ display: flex;
+}
+
+.nav-toggle {
+ cursor: pointer;
+ display: block;
+ height: 3.25rem;
+ position: relative;
+ width: 3.25rem;
+}
+
+.nav-toggle span {
+ background-color: #4a4a4a;
+ display: block;
+ height: 1px;
+ left: 50%;
+ margin-left: -7px;
+ position: absolute;
+ top: 50%;
+ -webkit-transition: none 86ms ease-out;
+ transition: none 86ms ease-out;
+ -webkit-transition-property: background, left, opacity, -webkit-transform;
+ transition-property: background, left, opacity, -webkit-transform;
+ transition-property: background, left, opacity, transform;
+ transition-property: background, left, opacity, transform, -webkit-transform;
+ width: 15px;
+}
+
+.nav-toggle span:nth-child(1) {
+ margin-top: -6px;
+}
+
+.nav-toggle span:nth-child(2) {
+ margin-top: -1px;
+}
+
+.nav-toggle span:nth-child(3) {
+ margin-top: 4px;
+}
+
+.nav-toggle:hover {
+ background-color: whitesmoke;
+}
+
+.nav-toggle.is-active span {
+ background-color: #00d1b2;
+}
+
+.nav-toggle.is-active span:nth-child(1) {
+ margin-left: -5px;
+ -webkit-transform: rotate(45deg);
+ transform: rotate(45deg);
+ -webkit-transform-origin: left top;
+ transform-origin: left top;
+}
+
+.nav-toggle.is-active span:nth-child(2) {
+ opacity: 0;
+}
+
+.nav-toggle.is-active span:nth-child(3) {
+ margin-left: -5px;
+ -webkit-transform: rotate(-45deg);
+ transform: rotate(-45deg);
+ -webkit-transform-origin: left bottom;
+ transform-origin: left bottom;
+}
+
+@media screen and (min-width: 769px), print {
+ .nav-toggle {
+ display: none;
+ }
+}
+
+.nav-item {
+ -webkit-box-align: center;
+ -ms-flex-align: center;
+ align-items: center;
+ display: -webkit-box;
+ display: -ms-flexbox;
+ display: flex;
+ -webkit-box-flex: 0;
+ -ms-flex-positive: 0;
+ flex-grow: 0;
+ -ms-flex-negative: 0;
+ flex-shrink: 0;
+ font-size: 1rem;
+ -webkit-box-pack: center;
+ -ms-flex-pack: center;
+ justify-content: center;
+ line-height: 1.5;
+ padding: 0.5rem 0.75rem;
+}
+
+.nav-item a {
+ -webkit-box-flex: 1;
+ -ms-flex-positive: 1;
+ flex-grow: 1;
+ -ms-flex-negative: 0;
+ flex-shrink: 0;
+}
+
+.nav-item img {
+ max-height: 1.75rem;
+}
+
+.nav-item .tag:first-child:not(:last-child) {
+ margin-right: 0.5rem;
+}
+
+.nav-item .tag:last-child:not(:first-child) {
+ margin-left: 0.5rem;
+}
+
+@media screen and (max-width: 768px) {
+ .nav-item {
+ -webkit-box-pack: start;
+ -ms-flex-pack: start;
+ justify-content: flex-start;
+ }
+}
+
+.nav-item a:not(.button),
+a.nav-item:not(.button) {
+ color: #7a7a7a;
+}
+
+.nav-item a:not(.button):hover,
+a.nav-item:not(.button):hover {
+ color: #363636;
+}
+
+.nav-item a:not(.button).is-active,
+a.nav-item:not(.button).is-active {
+ color: #363636;
+}
+
+.nav-item a:not(.button).is-tab,
+a.nav-item:not(.button).is-tab {
+ border-bottom: 1px solid transparent;
+ border-top: 1px solid transparent;
+ padding-bottom: calc(0.75rem - 1px);
+ padding-left: 1rem;
+ padding-right: 1rem;
+ padding-top: calc(0.75rem - 1px);
+}
+
+.nav-item a:not(.button).is-tab:hover,
+a.nav-item:not(.button).is-tab:hover {
+ border-bottom-color: #00d1b2;
+ border-top-color: transparent;
+}
+
+.nav-item a:not(.button).is-tab.is-active,
+a.nav-item:not(.button).is-tab.is-active {
+ border-bottom: 3px solid #00d1b2;
+ color: #00d1b2;
+ padding-bottom: calc(0.75rem - 3px);
+}
+
+@media screen and (min-width: 1008px) {
+ .nav-item a:not(.button).is-brand,
+ a.nav-item:not(.button).is-brand {
+ padding-left: 0;
+ }
+}
+
+.nav-left,
+.nav-right {
+ -webkit-overflow-scrolling: touch;
+ -webkit-box-align: stretch;
+ -ms-flex-align: stretch;
+ align-items: stretch;
+ display: -webkit-box;
+ display: -ms-flexbox;
+ display: flex;
+ -webkit-box-flex: 1;
+ -ms-flex-positive: 1;
+ flex-grow: 1;
+ -ms-flex-negative: 0;
+ flex-shrink: 0;
+ max-width: 100%;
+ overflow: auto;
+}
+
+@media screen and (min-width: 1200px) {
+ .nav-left,
+ .nav-right {
+ -ms-flex-preferred-size: 0;
+ flex-basis: 0;
+ }
+}
+
+.nav-left {
+ -webkit-box-pack: start;
+ -ms-flex-pack: start;
+ justify-content: flex-start;
+ white-space: nowrap;
+}
+
+.nav-right {
+ -webkit-box-pack: end;
+ -ms-flex-pack: end;
+ justify-content: flex-end;
+}
+
+.nav-center {
+ -webkit-box-align: stretch;
+ -ms-flex-align: stretch;
+ align-items: stretch;
+ display: -webkit-box;
+ display: -ms-flexbox;
+ display: flex;
+ -webkit-box-flex: 0;
+ -ms-flex-positive: 0;
+ flex-grow: 0;
+ -ms-flex-negative: 0;
+ flex-shrink: 0;
+ -webkit-box-pack: center;
+ -ms-flex-pack: center;
+ justify-content: center;
+ margin-left: auto;
+ margin-right: auto;
+}
+
+@media screen and (max-width: 768px) {
+ .nav-menu.nav-right {
+ background-color: white;
+ -webkit-box-shadow: 0 4px 7px rgba(10, 10, 10, 0.1);
+ box-shadow: 0 4px 7px rgba(10, 10, 10, 0.1);
+ left: 0;
+ display: none;
+ right: 0;
+ top: 100%;
+ position: absolute;
+ }
+ .nav-menu.nav-right .nav-item {
+ border-top: 1px solid rgba(219, 219, 219, 0.5);
+ padding: 0.75rem;
+ }
+ .nav-menu.nav-right.is-active {
+ display: block;
+ }
+}
+
+.nav {
+ -webkit-box-align: stretch;
+ -ms-flex-align: stretch;
+ align-items: stretch;
+ background-color: white;
+ display: -webkit-box;
+ display: -ms-flexbox;
+ display: flex;
+ height: 3.25rem;
+ position: relative;
+ text-align: center;
+ z-index: 10;
+}
+
+.nav > .container {
+ -webkit-box-align: stretch;
+ -ms-flex-align: stretch;
+ align-items: stretch;
+ display: -webkit-box;
+ display: -ms-flexbox;
+ display: flex;
+ min-height: 3.25rem;
+ width: 100%;
+}
+
+.nav.has-shadow {
+ -webkit-box-shadow: 0 2px 3px rgba(10, 10, 10, 0.1);
+ box-shadow: 0 2px 3px rgba(10, 10, 10, 0.1);
+}
+
+.navbar {
+ background-color: white;
+ min-height: 3.25rem;
+ position: relative;
+}
+
+.navbar > .container {
+ -webkit-box-align: stretch;
+ -ms-flex-align: stretch;
+ align-items: stretch;
+ display: -webkit-box;
+ display: -ms-flexbox;
+ display: flex;
+ min-height: 3.25rem;
+ width: 100%;
+}
+
+.navbar.has-shadow {
+ -webkit-box-shadow: 0 2px 3px rgba(10, 10, 10, 0.1);
+ box-shadow: 0 2px 3px rgba(10, 10, 10, 0.1);
+}
+
+.navbar-brand {
+ -webkit-overflow-scrolling: touch;
+ -webkit-box-align: stretch;
+ -ms-flex-align: stretch;
+ align-items: stretch;
+ display: -webkit-box;
+ display: -ms-flexbox;
+ display: flex;
+ min-height: 3.25rem;
+ overflow-x: auto;
+ overflow-y: hidden;
+}
+
+.navbar-burger {
+ cursor: pointer;
+ display: block;
+ height: 3.25rem;
+ position: relative;
+ width: 3.25rem;
+ margin-left: auto;
+}
+
+.navbar-burger span {
+ background-color: #4a4a4a;
+ display: block;
+ height: 1px;
+ left: 50%;
+ margin-left: -7px;
+ position: absolute;
+ top: 50%;
+ -webkit-transition: none 86ms ease-out;
+ transition: none 86ms ease-out;
+ -webkit-transition-property: background, left, opacity, -webkit-transform;
+ transition-property: background, left, opacity, -webkit-transform;
+ transition-property: background, left, opacity, transform;
+ transition-property: background, left, opacity, transform, -webkit-transform;
+ width: 15px;
+}
+
+.navbar-burger span:nth-child(1) {
+ margin-top: -6px;
+}
+
+.navbar-burger span:nth-child(2) {
+ margin-top: -1px;
+}
+
+.navbar-burger span:nth-child(3) {
+ margin-top: 4px;
+}
+
+.navbar-burger:hover {
+ background-color: whitesmoke;
+}
+
+.navbar-burger.is-active span {
+ background-color: #00d1b2;
+}
+
+.navbar-burger.is-active span:nth-child(1) {
+ margin-left: -5px;
+ -webkit-transform: rotate(45deg);
+ transform: rotate(45deg);
+ -webkit-transform-origin: left top;
+ transform-origin: left top;
+}
+
+.navbar-burger.is-active span:nth-child(2) {
+ opacity: 0;
+}
+
+.navbar-burger.is-active span:nth-child(3) {
+ margin-left: -5px;
+ -webkit-transform: rotate(-45deg);
+ transform: rotate(-45deg);
+ -webkit-transform-origin: left bottom;
+ transform-origin: left bottom;
+}
+
+.navbar-menu {
+ display: none;
+}
+
+.navbar-item,
+.navbar-link {
+ color: #4a4a4a;
+ display: block;
+ line-height: 1.5;
+ padding: 0.5rem 1rem;
+ position: relative;
+}
+
+a.navbar-item:hover, a.navbar-item.is-active,
+.navbar-link:hover,
+.navbar-link.is-active {
+ background-color: whitesmoke;
+ color: #0a0a0a;
+}
+
+.navbar-item {
+ -webkit-box-flex: 0;
+ -ms-flex-positive: 0;
+ flex-grow: 0;
+ -ms-flex-negative: 0;
+ flex-shrink: 0;
+}
+
+.navbar-item img {
+ max-height: 1.75rem;
+}
+
+.navbar-item.has-dropdown {
+ padding: 0;
+}
+
+.navbar-item.is-tab {
+ border-bottom: 1px solid transparent;
+ min-height: 3.25rem;
+ padding-bottom: calc(0.5rem - 1px);
+}
+
+.navbar-item.is-tab:hover {
+ background-color: transparent;
+ border-bottom-color: #00d1b2;
+}
+
+.navbar-item.is-tab.is-active {
+ background-color: transparent;
+ border-bottom: 3px solid #00d1b2;
+ color: #00d1b2;
+ padding-bottom: calc(0.5rem - 3px);
+}
+
+.navbar-content {
+ -webkit-box-flex: 1;
+ -ms-flex-positive: 1;
+ flex-grow: 1;
+ -ms-flex-negative: 1;
+ flex-shrink: 1;
+}
+
+.navbar-link {
+ padding-right: 2.5em;
+}
+
+.navbar-dropdown {
+ font-size: 0.875rem;
+ padding-bottom: 0.5rem;
+ padding-top: 0.5rem;
+}
+
+.navbar-dropdown .navbar-item {
+ padding-left: 1.5rem;
+ padding-right: 1.5rem;
+}
+
+.navbar-divider {
+ background-color: #dbdbdb;
+ border: none;
+ display: none;
+ height: 1px;
+ margin: 0.5rem 0;
+}
+
+@media screen and (max-width: 1007px) {
+ .navbar-brand .navbar-item {
+ -webkit-box-align: center;
+ -ms-flex-align: center;
+ align-items: center;
+ display: -webkit-box;
+ display: -ms-flexbox;
+ display: flex;
+ }
+ .navbar-menu {
+ -webkit-box-shadow: 0 8px 16px rgba(10, 10, 10, 0.1);
+ box-shadow: 0 8px 16px rgba(10, 10, 10, 0.1);
+ padding: 0.5rem 0;
+ }
+ .navbar-menu.is-active {
+ display: block;
+ }
+}
+
+@media screen and (min-width: 1008px) {
+ .navbar,
+ .navbar-menu,
+ .navbar-start,
+ .navbar-end {
+ -webkit-box-align: stretch;
+ -ms-flex-align: stretch;
+ align-items: stretch;
+ display: -webkit-box;
+ display: -ms-flexbox;
+ display: flex;
+ }
+ .navbar {
+ min-height: 3.25rem;
+ }
+ .navbar.is-transparent a.navbar-item:hover, .navbar.is-transparent a.navbar-item.is-active,
+ .navbar.is-transparent .navbar-link:hover,
+ .navbar.is-transparent .navbar-link.is-active {
+ background-color: transparent;
+ }
+ .navbar.is-transparent .navbar-item.has-dropdown.is-active .navbar-link, .navbar.is-transparent .navbar-item.has-dropdown.is-hoverable:hover .navbar-link {
+ background-color: transparent;
+ }
+ .navbar.is-transparent .navbar-dropdown a.navbar-item:hover {
+ background-color: whitesmoke;
+ color: #0a0a0a;
+ }
+ .navbar.is-transparent .navbar-dropdown a.navbar-item.is-active {
+ background-color: whitesmoke;
+ color: #00d1b2;
+ }
+ .navbar-burger {
+ display: none;
+ }
+ .navbar-item,
+ .navbar-link {
+ -webkit-box-align: center;
+ -ms-flex-align: center;
+ align-items: center;
+ display: -webkit-box;
+ display: -ms-flexbox;
+ display: flex;
+ }
+ .navbar-item.has-dropdown {
+ -webkit-box-align: stretch;
+ -ms-flex-align: stretch;
+ align-items: stretch;
+ }
+ .navbar-item.is-active .navbar-dropdown, .navbar-item.is-hoverable:hover .navbar-dropdown {
+ display: block;
+ }
+ .navbar-item.is-active .navbar-dropdown.is-boxed, .navbar-item.is-hoverable:hover .navbar-dropdown.is-boxed {
+ opacity: 1;
+ pointer-events: auto;
+ -webkit-transform: translateY(0);
+ transform: translateY(0);
+ }
+ .navbar-link::after {
+ border: 1px solid #00d1b2;
+ border-right: 0;
+ border-top: 0;
+ content: " ";
+ display: block;
+ height: 0.5em;
+ pointer-events: none;
+ position: absolute;
+ -webkit-transform: rotate(-45deg);
+ transform: rotate(-45deg);
+ width: 0.5em;
+ margin-top: -0.375em;
+ right: 1.125em;
+ top: 50%;
+ }
+ .navbar-menu {
+ -webkit-box-flex: 1;
+ -ms-flex-positive: 1;
+ flex-grow: 1;
+ -ms-flex-negative: 0;
+ flex-shrink: 0;
+ }
+ .navbar-start {
+ -webkit-box-pack: start;
+ -ms-flex-pack: start;
+ justify-content: flex-start;
+ margin-right: auto;
+ }
+ .navbar-end {
+ -webkit-box-pack: end;
+ -ms-flex-pack: end;
+ justify-content: flex-end;
+ margin-left: auto;
+ }
+ .navbar-dropdown {
+ background-color: white;
+ border-bottom-left-radius: 5px;
+ border-bottom-right-radius: 5px;
+ border-top: 1px solid #dbdbdb;
+ -webkit-box-shadow: 0 8px 8px rgba(10, 10, 10, 0.1);
+ box-shadow: 0 8px 8px rgba(10, 10, 10, 0.1);
+ display: none;
+ font-size: 0.875rem;
+ left: 0;
+ min-width: 100%;
+ position: absolute;
+ top: 100%;
+ z-index: 20;
+ }
+ .navbar-dropdown .navbar-item {
+ padding: 0.375rem 1rem;
+ white-space: nowrap;
+ }
+ .navbar-dropdown a.navbar-item {
+ padding-right: 3rem;
+ }
+ .navbar-dropdown a.navbar-item:hover {
+ background-color: whitesmoke;
+ color: #0a0a0a;
+ }
+ .navbar-dropdown a.navbar-item.is-active {
+ background-color: whitesmoke;
+ color: #00d1b2;
+ }
+ .navbar-dropdown.is-boxed {
+ border-radius: 5px;
+ border-top: none;
+ -webkit-box-shadow: 0 8px 8px rgba(10, 10, 10, 0.1), 0 0 0 1px rgba(10, 10, 10, 0.1);
+ box-shadow: 0 8px 8px rgba(10, 10, 10, 0.1), 0 0 0 1px rgba(10, 10, 10, 0.1);
+ display: block;
+ opacity: 0;
+ pointer-events: none;
+ top: calc(100% + (-4px));
+ -webkit-transform: translateY(-5px);
+ transform: translateY(-5px);
+ -webkit-transition-duration: 86ms;
+ transition-duration: 86ms;
+ -webkit-transition-property: opacity, -webkit-transform;
+ transition-property: opacity, -webkit-transform;
+ transition-property: opacity, transform;
+ transition-property: opacity, transform, -webkit-transform;
+ }
+ .navbar-divider {
+ display: block;
+ }
+ .container > .navbar {
+ margin-left: -1rem;
+ margin-right: -1rem;
+ }
+ a.navbar-item.is-active,
+ .navbar-link.is-active {
+ color: #0a0a0a;
+ }
+ a.navbar-item.is-active:not(:hover),
+ .navbar-link.is-active:not(:hover) {
+ background-color: transparent;
+ }
+ .navbar-item.has-dropdown:hover .navbar-link, .navbar-item.has-dropdown.is-active .navbar-link {
+ background-color: whitesmoke;
+ }
+}
+
+.pagination {
+ font-size: 1rem;
+ margin: -0.25rem;
+}
+
+.pagination.is-small {
+ font-size: 0.75rem;
+}
+
+.pagination.is-medium {
+ font-size: 1.25rem;
+}
+
+.pagination.is-large {
+ font-size: 1.5rem;
+}
+
+.pagination,
+.pagination-list {
+ -webkit-box-align: center;
+ -ms-flex-align: center;
+ align-items: center;
+ display: -webkit-box;
+ display: -ms-flexbox;
+ display: flex;
+ -webkit-box-pack: center;
+ -ms-flex-pack: center;
+ justify-content: center;
+ text-align: center;
+}
+
+.pagination-previous,
+.pagination-next,
+.pagination-link,
+.pagination-ellipsis {
+ -moz-appearance: none;
+ -webkit-appearance: none;
+ -webkit-box-align: center;
+ -ms-flex-align: center;
+ align-items: center;
+ border: 1px solid transparent;
+ border-radius: 3px;
+ -webkit-box-shadow: none;
+ box-shadow: none;
+ display: -webkit-inline-box;
+ display: -ms-inline-flexbox;
+ display: inline-flex;
+ font-size: 1rem;
+ height: 2.25em;
+ -webkit-box-pack: start;
+ -ms-flex-pack: start;
+ justify-content: flex-start;
+ line-height: 1.5;
+ padding-bottom: calc(0.375em - 1px);
+ padding-left: calc(0.625em - 1px);
+ padding-right: calc(0.625em - 1px);
+ padding-top: calc(0.375em - 1px);
+ position: relative;
+ vertical-align: top;
+ -webkit-touch-callout: none;
+ -webkit-user-select: none;
+ -moz-user-select: none;
+ -ms-user-select: none;
+ user-select: none;
+ font-size: 1em;
+ padding-left: 0.5em;
+ padding-right: 0.5em;
+ -webkit-box-pack: center;
+ -ms-flex-pack: center;
+ justify-content: center;
+ margin: 0.25rem;
+ text-align: center;
+}
+
+.pagination-previous:focus, .pagination-previous.is-focused, .pagination-previous:active, .pagination-previous.is-active,
+.pagination-next:focus,
+.pagination-next.is-focused,
+.pagination-next:active,
+.pagination-next.is-active,
+.pagination-link:focus,
+.pagination-link.is-focused,
+.pagination-link:active,
+.pagination-link.is-active,
+.pagination-ellipsis:focus,
+.pagination-ellipsis.is-focused,
+.pagination-ellipsis:active,
+.pagination-ellipsis.is-active {
+ outline: none;
+}
+
+.pagination-previous[disabled],
+.pagination-next[disabled],
+.pagination-link[disabled],
+.pagination-ellipsis[disabled] {
+ cursor: not-allowed;
+}
+
+.pagination-previous,
+.pagination-next,
+.pagination-link {
+ border-color: #dbdbdb;
+ min-width: 2.25em;
+}
+
+.pagination-previous:hover,
+.pagination-next:hover,
+.pagination-link:hover {
+ border-color: #b5b5b5;
+ color: #363636;
+}
+
+.pagination-previous:focus,
+.pagination-next:focus,
+.pagination-link:focus {
+ border-color: #00d1b2;
+}
+
+.pagination-previous:active,
+.pagination-next:active,
+.pagination-link:active {
+ -webkit-box-shadow: inset 0 1px 2px rgba(10, 10, 10, 0.2);
+ box-shadow: inset 0 1px 2px rgba(10, 10, 10, 0.2);
+}
+
+.pagination-previous[disabled],
+.pagination-next[disabled],
+.pagination-link[disabled] {
+ background-color: #dbdbdb;
+ border-color: #dbdbdb;
+ -webkit-box-shadow: none;
+ box-shadow: none;
+ color: #7a7a7a;
+ opacity: 0.5;
+}
+
+.pagination-previous,
+.pagination-next {
+ padding-left: 0.75em;
+ padding-right: 0.75em;
+ white-space: nowrap;
+}
+
+.pagination-link.is-current {
+ background-color: #00d1b2;
+ border-color: #00d1b2;
+ color: #fff;
+}
+
+.pagination-ellipsis {
+ color: #b5b5b5;
+ pointer-events: none;
+}
+
+.pagination-list {
+ -ms-flex-wrap: wrap;
+ flex-wrap: wrap;
+}
+
+@media screen and (max-width: 768px) {
+ .pagination {
+ -ms-flex-wrap: wrap;
+ flex-wrap: wrap;
+ }
+ .pagination-previous,
+ .pagination-next {
+ -webkit-box-flex: 1;
+ -ms-flex-positive: 1;
+ flex-grow: 1;
+ -ms-flex-negative: 1;
+ flex-shrink: 1;
+ }
+ .pagination-list li {
+ -webkit-box-flex: 1;
+ -ms-flex-positive: 1;
+ flex-grow: 1;
+ -ms-flex-negative: 1;
+ flex-shrink: 1;
+ }
+}
+
+@media screen and (min-width: 769px), print {
+ .pagination-list {
+ -webkit-box-flex: 1;
+ -ms-flex-positive: 1;
+ flex-grow: 1;
+ -ms-flex-negative: 1;
+ flex-shrink: 1;
+ -webkit-box-pack: start;
+ -ms-flex-pack: start;
+ justify-content: flex-start;
+ -webkit-box-ordinal-group: 2;
+ -ms-flex-order: 1;
+ order: 1;
+ }
+ .pagination-previous {
+ -webkit-box-ordinal-group: 3;
+ -ms-flex-order: 2;
+ order: 2;
+ }
+ .pagination-next {
+ -webkit-box-ordinal-group: 4;
+ -ms-flex-order: 3;
+ order: 3;
+ }
+ .pagination {
+ -webkit-box-pack: justify;
+ -ms-flex-pack: justify;
+ justify-content: space-between;
+ }
+ .pagination.is-centered .pagination-previous {
+ -webkit-box-ordinal-group: 2;
+ -ms-flex-order: 1;
+ order: 1;
+ }
+ .pagination.is-centered .pagination-list {
+ -webkit-box-pack: center;
+ -ms-flex-pack: center;
+ justify-content: center;
+ -webkit-box-ordinal-group: 3;
+ -ms-flex-order: 2;
+ order: 2;
+ }
+ .pagination.is-centered .pagination-next {
+ -webkit-box-ordinal-group: 4;
+ -ms-flex-order: 3;
+ order: 3;
+ }
+ .pagination.is-right .pagination-previous {
+ -webkit-box-ordinal-group: 2;
+ -ms-flex-order: 1;
+ order: 1;
+ }
+ .pagination.is-right .pagination-next {
+ -webkit-box-ordinal-group: 3;
+ -ms-flex-order: 2;
+ order: 2;
+ }
+ .pagination.is-right .pagination-list {
+ -webkit-box-pack: end;
+ -ms-flex-pack: end;
+ justify-content: flex-end;
+ -webkit-box-ordinal-group: 4;
+ -ms-flex-order: 3;
+ order: 3;
+ }
+}
+
+.panel {
+ font-size: 1rem;
+}
+
+.panel:not(:last-child) {
+ margin-bottom: 1.5rem;
+}
+
+.panel-heading,
+.panel-tabs,
+.panel-block {
+ border-bottom: 1px solid #dbdbdb;
+ border-left: 1px solid #dbdbdb;
+ border-right: 1px solid #dbdbdb;
+}
+
+.panel-heading:first-child,
+.panel-tabs:first-child,
+.panel-block:first-child {
+ border-top: 1px solid #dbdbdb;
+}
+
+.panel-heading {
+ background-color: whitesmoke;
+ border-radius: 3px 3px 0 0;
+ color: #363636;
+ font-size: 1.25em;
+ font-weight: 300;
+ line-height: 1.25;
+ padding: 0.5em 0.75em;
+}
+
+.panel-tabs {
+ -webkit-box-align: end;
+ -ms-flex-align: end;
+ align-items: flex-end;
+ display: -webkit-box;
+ display: -ms-flexbox;
+ display: flex;
+ font-size: 0.875em;
+ -webkit-box-pack: center;
+ -ms-flex-pack: center;
+ justify-content: center;
+}
+
+.panel-tabs a {
+ border-bottom: 1px solid #dbdbdb;
+ margin-bottom: -1px;
+ padding: 0.5em;
+}
+
+.panel-tabs a.is-active {
+ border-bottom-color: #4a4a4a;
+ color: #363636;
+}
+
+.panel-list a {
+ color: #4a4a4a;
+}
+
+.panel-list a:hover {
+ color: #00d1b2;
+}
+
+.panel-block {
+ -webkit-box-align: center;
+ -ms-flex-align: center;
+ align-items: center;
+ color: #363636;
+ display: -webkit-box;
+ display: -ms-flexbox;
+ display: flex;
+ -webkit-box-pack: start;
+ -ms-flex-pack: start;
+ justify-content: flex-start;
+ padding: 0.5em 0.75em;
+}
+
+.panel-block input[type="checkbox"] {
+ margin-right: 0.75em;
+}
+
+.panel-block > .control {
+ -webkit-box-flex: 1;
+ -ms-flex-positive: 1;
+ flex-grow: 1;
+ -ms-flex-negative: 1;
+ flex-shrink: 1;
+ width: 100%;
+}
+
+.panel-block.is-wrapped {
+ -ms-flex-wrap: wrap;
+ flex-wrap: wrap;
+}
+
+.panel-block.is-active {
+ border-left-color: #00d1b2;
+ color: #363636;
+}
+
+.panel-block.is-active .panel-icon {
+ color: #00d1b2;
+}
+
+a.panel-block,
+label.panel-block {
+ cursor: pointer;
+}
+
+a.panel-block:hover,
+label.panel-block:hover {
+ background-color: whitesmoke;
+}
+
+.panel-icon {
+ display: inline-block;
+ font-size: 14px;
+ height: 1em;
+ line-height: 1em;
+ text-align: center;
+ vertical-align: top;
+ width: 1em;
+ color: #7a7a7a;
+ margin-right: 0.75em;
+}
+
+.panel-icon .fa {
+ font-size: inherit;
+ line-height: inherit;
+}
+
+.tabs {
+ -webkit-overflow-scrolling: touch;
+ -webkit-touch-callout: none;
+ -webkit-user-select: none;
+ -moz-user-select: none;
+ -ms-user-select: none;
+ user-select: none;
+ -webkit-box-align: stretch;
+ -ms-flex-align: stretch;
+ align-items: stretch;
+ display: -webkit-box;
+ display: -ms-flexbox;
+ display: flex;
+ font-size: 1rem;
+ -webkit-box-pack: justify;
+ -ms-flex-pack: justify;
+ justify-content: space-between;
+ overflow: hidden;
+ overflow-x: auto;
+ white-space: nowrap;
+}
+
+.tabs:not(:last-child) {
+ margin-bottom: 1.5rem;
+}
+
+.tabs a {
+ -webkit-box-align: center;
+ -ms-flex-align: center;
+ align-items: center;
+ border-bottom: 1px solid #dbdbdb;
+ color: #4a4a4a;
+ display: -webkit-box;
+ display: -ms-flexbox;
+ display: flex;
+ -webkit-box-pack: center;
+ -ms-flex-pack: center;
+ justify-content: center;
+ margin-bottom: -1px;
+ padding: 0.5em 1em;
+ vertical-align: top;
+}
+
+.tabs a:hover {
+ border-bottom-color: #363636;
+ color: #363636;
+}
+
+.tabs li {
+ display: block;
+}
+
+.tabs li.is-active a {
+ border-bottom-color: #00d1b2;
+ color: #00d1b2;
+}
+
+.tabs ul {
+ -webkit-box-align: center;
+ -ms-flex-align: center;
+ align-items: center;
+ border-bottom: 1px solid #dbdbdb;
+ display: -webkit-box;
+ display: -ms-flexbox;
+ display: flex;
+ -webkit-box-flex: 1;
+ -ms-flex-positive: 1;
+ flex-grow: 1;
+ -ms-flex-negative: 0;
+ flex-shrink: 0;
+ -webkit-box-pack: start;
+ -ms-flex-pack: start;
+ justify-content: flex-start;
+}
+
+.tabs ul.is-left {
+ padding-right: 0.75em;
+}
+
+.tabs ul.is-center {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ -webkit-box-pack: center;
+ -ms-flex-pack: center;
+ justify-content: center;
+ padding-left: 0.75em;
+ padding-right: 0.75em;
+}
+
+.tabs ul.is-right {
+ -webkit-box-pack: end;
+ -ms-flex-pack: end;
+ justify-content: flex-end;
+ padding-left: 0.75em;
+}
+
+.tabs .icon:first-child {
+ margin-right: 0.5em;
+}
+
+.tabs .icon:last-child {
+ margin-left: 0.5em;
+}
+
+.tabs.is-centered ul {
+ -webkit-box-pack: center;
+ -ms-flex-pack: center;
+ justify-content: center;
+}
+
+.tabs.is-right ul {
+ -webkit-box-pack: end;
+ -ms-flex-pack: end;
+ justify-content: flex-end;
+}
+
+.tabs.is-boxed a {
+ border: 1px solid transparent;
+ border-radius: 3px 3px 0 0;
+}
+
+.tabs.is-boxed a:hover {
+ background-color: whitesmoke;
+ border-bottom-color: #dbdbdb;
+}
+
+.tabs.is-boxed li.is-active a {
+ background-color: white;
+ border-color: #dbdbdb;
+ border-bottom-color: transparent !important;
+}
+
+.tabs.is-fullwidth li {
+ -webkit-box-flex: 1;
+ -ms-flex-positive: 1;
+ flex-grow: 1;
+ -ms-flex-negative: 0;
+ flex-shrink: 0;
+}
+
+.tabs.is-toggle a {
+ border: 1px solid #dbdbdb;
+ margin-bottom: 0;
+ position: relative;
+}
+
+.tabs.is-toggle a:hover {
+ background-color: whitesmoke;
+ border-color: #b5b5b5;
+ z-index: 2;
+}
+
+.tabs.is-toggle li + li {
+ margin-left: -1px;
+}
+
+.tabs.is-toggle li:first-child a {
+ border-radius: 3px 0 0 3px;
+}
+
+.tabs.is-toggle li:last-child a {
+ border-radius: 0 3px 3px 0;
+}
+
+.tabs.is-toggle li.is-active a {
+ background-color: #00d1b2;
+ border-color: #00d1b2;
+ color: #fff;
+ z-index: 1;
+}
+
+.tabs.is-toggle ul {
+ border-bottom: none;
+}
+
+.tabs.is-small {
+ font-size: 0.75rem;
+}
+
+.tabs.is-medium {
+ font-size: 1.25rem;
+}
+
+.tabs.is-large {
+ font-size: 1.5rem;
+}
+
+.column {
+ display: block;
+ -ms-flex-preferred-size: 0;
+ flex-basis: 0;
+ -webkit-box-flex: 1;
+ -ms-flex-positive: 1;
+ flex-grow: 1;
+ -ms-flex-negative: 1;
+ flex-shrink: 1;
+ padding: 0.75rem;
+}
+
+.columns.is-mobile > .column.is-narrow {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+}
+
+.columns.is-mobile > .column.is-full {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 100%;
+}
+
+.columns.is-mobile > .column.is-three-quarters {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 75%;
+}
+
+.columns.is-mobile > .column.is-two-thirds {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 66.6666%;
+}
+
+.columns.is-mobile > .column.is-half {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 50%;
+}
+
+.columns.is-mobile > .column.is-one-third {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 33.3333%;
+}
+
+.columns.is-mobile > .column.is-one-quarter {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 25%;
+}
+
+.columns.is-mobile > .column.is-offset-three-quarters {
+ margin-left: 75%;
+}
+
+.columns.is-mobile > .column.is-offset-two-thirds {
+ margin-left: 66.6666%;
+}
+
+.columns.is-mobile > .column.is-offset-half {
+ margin-left: 50%;
+}
+
+.columns.is-mobile > .column.is-offset-one-third {
+ margin-left: 33.3333%;
+}
+
+.columns.is-mobile > .column.is-offset-one-quarter {
+ margin-left: 25%;
+}
+
+.columns.is-mobile > .column.is-1 {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 8.33333%;
+}
+
+.columns.is-mobile > .column.is-offset-1 {
+ margin-left: 8.33333%;
+}
+
+.columns.is-mobile > .column.is-2 {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 16.66667%;
+}
+
+.columns.is-mobile > .column.is-offset-2 {
+ margin-left: 16.66667%;
+}
+
+.columns.is-mobile > .column.is-3 {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 25%;
+}
+
+.columns.is-mobile > .column.is-offset-3 {
+ margin-left: 25%;
+}
+
+.columns.is-mobile > .column.is-4 {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 33.33333%;
+}
+
+.columns.is-mobile > .column.is-offset-4 {
+ margin-left: 33.33333%;
+}
+
+.columns.is-mobile > .column.is-5 {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 41.66667%;
+}
+
+.columns.is-mobile > .column.is-offset-5 {
+ margin-left: 41.66667%;
+}
+
+.columns.is-mobile > .column.is-6 {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 50%;
+}
+
+.columns.is-mobile > .column.is-offset-6 {
+ margin-left: 50%;
+}
+
+.columns.is-mobile > .column.is-7 {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 58.33333%;
+}
+
+.columns.is-mobile > .column.is-offset-7 {
+ margin-left: 58.33333%;
+}
+
+.columns.is-mobile > .column.is-8 {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 66.66667%;
+}
+
+.columns.is-mobile > .column.is-offset-8 {
+ margin-left: 66.66667%;
+}
+
+.columns.is-mobile > .column.is-9 {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 75%;
+}
+
+.columns.is-mobile > .column.is-offset-9 {
+ margin-left: 75%;
+}
+
+.columns.is-mobile > .column.is-10 {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 83.33333%;
+}
+
+.columns.is-mobile > .column.is-offset-10 {
+ margin-left: 83.33333%;
+}
+
+.columns.is-mobile > .column.is-11 {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 91.66667%;
+}
+
+.columns.is-mobile > .column.is-offset-11 {
+ margin-left: 91.66667%;
+}
+
+.columns.is-mobile > .column.is-12 {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 100%;
+}
+
+.columns.is-mobile > .column.is-offset-12 {
+ margin-left: 100%;
+}
+
+@media screen and (max-width: 768px) {
+ .column.is-narrow-mobile {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ }
+ .column.is-full-mobile {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 100%;
+ }
+ .column.is-three-quarters-mobile {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 75%;
+ }
+ .column.is-two-thirds-mobile {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 66.6666%;
+ }
+ .column.is-half-mobile {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 50%;
+ }
+ .column.is-one-third-mobile {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 33.3333%;
+ }
+ .column.is-one-quarter-mobile {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 25%;
+ }
+ .column.is-offset-three-quarters-mobile {
+ margin-left: 75%;
+ }
+ .column.is-offset-two-thirds-mobile {
+ margin-left: 66.6666%;
+ }
+ .column.is-offset-half-mobile {
+ margin-left: 50%;
+ }
+ .column.is-offset-one-third-mobile {
+ margin-left: 33.3333%;
+ }
+ .column.is-offset-one-quarter-mobile {
+ margin-left: 25%;
+ }
+ .column.is-1-mobile {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 8.33333%;
+ }
+ .column.is-offset-1-mobile {
+ margin-left: 8.33333%;
+ }
+ .column.is-2-mobile {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 16.66667%;
+ }
+ .column.is-offset-2-mobile {
+ margin-left: 16.66667%;
+ }
+ .column.is-3-mobile {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 25%;
+ }
+ .column.is-offset-3-mobile {
+ margin-left: 25%;
+ }
+ .column.is-4-mobile {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 33.33333%;
+ }
+ .column.is-offset-4-mobile {
+ margin-left: 33.33333%;
+ }
+ .column.is-5-mobile {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 41.66667%;
+ }
+ .column.is-offset-5-mobile {
+ margin-left: 41.66667%;
+ }
+ .column.is-6-mobile {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 50%;
+ }
+ .column.is-offset-6-mobile {
+ margin-left: 50%;
+ }
+ .column.is-7-mobile {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 58.33333%;
+ }
+ .column.is-offset-7-mobile {
+ margin-left: 58.33333%;
+ }
+ .column.is-8-mobile {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 66.66667%;
+ }
+ .column.is-offset-8-mobile {
+ margin-left: 66.66667%;
+ }
+ .column.is-9-mobile {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 75%;
+ }
+ .column.is-offset-9-mobile {
+ margin-left: 75%;
+ }
+ .column.is-10-mobile {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 83.33333%;
+ }
+ .column.is-offset-10-mobile {
+ margin-left: 83.33333%;
+ }
+ .column.is-11-mobile {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 91.66667%;
+ }
+ .column.is-offset-11-mobile {
+ margin-left: 91.66667%;
+ }
+ .column.is-12-mobile {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 100%;
+ }
+ .column.is-offset-12-mobile {
+ margin-left: 100%;
+ }
+}
+
+@media screen and (min-width: 769px), print {
+ .column.is-narrow, .column.is-narrow-tablet {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ }
+ .column.is-full, .column.is-full-tablet {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 100%;
+ }
+ .column.is-three-quarters, .column.is-three-quarters-tablet {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 75%;
+ }
+ .column.is-two-thirds, .column.is-two-thirds-tablet {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 66.6666%;
+ }
+ .column.is-half, .column.is-half-tablet {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 50%;
+ }
+ .column.is-one-third, .column.is-one-third-tablet {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 33.3333%;
+ }
+ .column.is-one-quarter, .column.is-one-quarter-tablet {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 25%;
+ }
+ .column.is-offset-three-quarters, .column.is-offset-three-quarters-tablet {
+ margin-left: 75%;
+ }
+ .column.is-offset-two-thirds, .column.is-offset-two-thirds-tablet {
+ margin-left: 66.6666%;
+ }
+ .column.is-offset-half, .column.is-offset-half-tablet {
+ margin-left: 50%;
+ }
+ .column.is-offset-one-third, .column.is-offset-one-third-tablet {
+ margin-left: 33.3333%;
+ }
+ .column.is-offset-one-quarter, .column.is-offset-one-quarter-tablet {
+ margin-left: 25%;
+ }
+ .column.is-1, .column.is-1-tablet {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 8.33333%;
+ }
+ .column.is-offset-1, .column.is-offset-1-tablet {
+ margin-left: 8.33333%;
+ }
+ .column.is-2, .column.is-2-tablet {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 16.66667%;
+ }
+ .column.is-offset-2, .column.is-offset-2-tablet {
+ margin-left: 16.66667%;
+ }
+ .column.is-3, .column.is-3-tablet {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 25%;
+ }
+ .column.is-offset-3, .column.is-offset-3-tablet {
+ margin-left: 25%;
+ }
+ .column.is-4, .column.is-4-tablet {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 33.33333%;
+ }
+ .column.is-offset-4, .column.is-offset-4-tablet {
+ margin-left: 33.33333%;
+ }
+ .column.is-5, .column.is-5-tablet {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 41.66667%;
+ }
+ .column.is-offset-5, .column.is-offset-5-tablet {
+ margin-left: 41.66667%;
+ }
+ .column.is-6, .column.is-6-tablet {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 50%;
+ }
+ .column.is-offset-6, .column.is-offset-6-tablet {
+ margin-left: 50%;
+ }
+ .column.is-7, .column.is-7-tablet {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 58.33333%;
+ }
+ .column.is-offset-7, .column.is-offset-7-tablet {
+ margin-left: 58.33333%;
+ }
+ .column.is-8, .column.is-8-tablet {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 66.66667%;
+ }
+ .column.is-offset-8, .column.is-offset-8-tablet {
+ margin-left: 66.66667%;
+ }
+ .column.is-9, .column.is-9-tablet {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 75%;
+ }
+ .column.is-offset-9, .column.is-offset-9-tablet {
+ margin-left: 75%;
+ }
+ .column.is-10, .column.is-10-tablet {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 83.33333%;
+ }
+ .column.is-offset-10, .column.is-offset-10-tablet {
+ margin-left: 83.33333%;
+ }
+ .column.is-11, .column.is-11-tablet {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 91.66667%;
+ }
+ .column.is-offset-11, .column.is-offset-11-tablet {
+ margin-left: 91.66667%;
+ }
+ .column.is-12, .column.is-12-tablet {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 100%;
+ }
+ .column.is-offset-12, .column.is-offset-12-tablet {
+ margin-left: 100%;
+ }
+}
+
+@media screen and (max-width: 1007px) {
+ .column.is-narrow-touch {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ }
+ .column.is-full-touch {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 100%;
+ }
+ .column.is-three-quarters-touch {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 75%;
+ }
+ .column.is-two-thirds-touch {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 66.6666%;
+ }
+ .column.is-half-touch {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 50%;
+ }
+ .column.is-one-third-touch {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 33.3333%;
+ }
+ .column.is-one-quarter-touch {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 25%;
+ }
+ .column.is-offset-three-quarters-touch {
+ margin-left: 75%;
+ }
+ .column.is-offset-two-thirds-touch {
+ margin-left: 66.6666%;
+ }
+ .column.is-offset-half-touch {
+ margin-left: 50%;
+ }
+ .column.is-offset-one-third-touch {
+ margin-left: 33.3333%;
+ }
+ .column.is-offset-one-quarter-touch {
+ margin-left: 25%;
+ }
+ .column.is-1-touch {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 8.33333%;
+ }
+ .column.is-offset-1-touch {
+ margin-left: 8.33333%;
+ }
+ .column.is-2-touch {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 16.66667%;
+ }
+ .column.is-offset-2-touch {
+ margin-left: 16.66667%;
+ }
+ .column.is-3-touch {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 25%;
+ }
+ .column.is-offset-3-touch {
+ margin-left: 25%;
+ }
+ .column.is-4-touch {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 33.33333%;
+ }
+ .column.is-offset-4-touch {
+ margin-left: 33.33333%;
+ }
+ .column.is-5-touch {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 41.66667%;
+ }
+ .column.is-offset-5-touch {
+ margin-left: 41.66667%;
+ }
+ .column.is-6-touch {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 50%;
+ }
+ .column.is-offset-6-touch {
+ margin-left: 50%;
+ }
+ .column.is-7-touch {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 58.33333%;
+ }
+ .column.is-offset-7-touch {
+ margin-left: 58.33333%;
+ }
+ .column.is-8-touch {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 66.66667%;
+ }
+ .column.is-offset-8-touch {
+ margin-left: 66.66667%;
+ }
+ .column.is-9-touch {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 75%;
+ }
+ .column.is-offset-9-touch {
+ margin-left: 75%;
+ }
+ .column.is-10-touch {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 83.33333%;
+ }
+ .column.is-offset-10-touch {
+ margin-left: 83.33333%;
+ }
+ .column.is-11-touch {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 91.66667%;
+ }
+ .column.is-offset-11-touch {
+ margin-left: 91.66667%;
+ }
+ .column.is-12-touch {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 100%;
+ }
+ .column.is-offset-12-touch {
+ margin-left: 100%;
+ }
+}
+
+@media screen and (min-width: 1008px) {
+ .column.is-narrow-desktop {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ }
+ .column.is-full-desktop {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 100%;
+ }
+ .column.is-three-quarters-desktop {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 75%;
+ }
+ .column.is-two-thirds-desktop {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 66.6666%;
+ }
+ .column.is-half-desktop {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 50%;
+ }
+ .column.is-one-third-desktop {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 33.3333%;
+ }
+ .column.is-one-quarter-desktop {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 25%;
+ }
+ .column.is-offset-three-quarters-desktop {
+ margin-left: 75%;
+ }
+ .column.is-offset-two-thirds-desktop {
+ margin-left: 66.6666%;
+ }
+ .column.is-offset-half-desktop {
+ margin-left: 50%;
+ }
+ .column.is-offset-one-third-desktop {
+ margin-left: 33.3333%;
+ }
+ .column.is-offset-one-quarter-desktop {
+ margin-left: 25%;
+ }
+ .column.is-1-desktop {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 8.33333%;
+ }
+ .column.is-offset-1-desktop {
+ margin-left: 8.33333%;
+ }
+ .column.is-2-desktop {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 16.66667%;
+ }
+ .column.is-offset-2-desktop {
+ margin-left: 16.66667%;
+ }
+ .column.is-3-desktop {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 25%;
+ }
+ .column.is-offset-3-desktop {
+ margin-left: 25%;
+ }
+ .column.is-4-desktop {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 33.33333%;
+ }
+ .column.is-offset-4-desktop {
+ margin-left: 33.33333%;
+ }
+ .column.is-5-desktop {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 41.66667%;
+ }
+ .column.is-offset-5-desktop {
+ margin-left: 41.66667%;
+ }
+ .column.is-6-desktop {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 50%;
+ }
+ .column.is-offset-6-desktop {
+ margin-left: 50%;
+ }
+ .column.is-7-desktop {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 58.33333%;
+ }
+ .column.is-offset-7-desktop {
+ margin-left: 58.33333%;
+ }
+ .column.is-8-desktop {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 66.66667%;
+ }
+ .column.is-offset-8-desktop {
+ margin-left: 66.66667%;
+ }
+ .column.is-9-desktop {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 75%;
+ }
+ .column.is-offset-9-desktop {
+ margin-left: 75%;
+ }
+ .column.is-10-desktop {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 83.33333%;
+ }
+ .column.is-offset-10-desktop {
+ margin-left: 83.33333%;
+ }
+ .column.is-11-desktop {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 91.66667%;
+ }
+ .column.is-offset-11-desktop {
+ margin-left: 91.66667%;
+ }
+ .column.is-12-desktop {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 100%;
+ }
+ .column.is-offset-12-desktop {
+ margin-left: 100%;
+ }
+}
+
+@media screen and (min-width: 1200px) {
+ .column.is-narrow-widescreen {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ }
+ .column.is-full-widescreen {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 100%;
+ }
+ .column.is-three-quarters-widescreen {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 75%;
+ }
+ .column.is-two-thirds-widescreen {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 66.6666%;
+ }
+ .column.is-half-widescreen {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 50%;
+ }
+ .column.is-one-third-widescreen {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 33.3333%;
+ }
+ .column.is-one-quarter-widescreen {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 25%;
+ }
+ .column.is-offset-three-quarters-widescreen {
+ margin-left: 75%;
+ }
+ .column.is-offset-two-thirds-widescreen {
+ margin-left: 66.6666%;
+ }
+ .column.is-offset-half-widescreen {
+ margin-left: 50%;
+ }
+ .column.is-offset-one-third-widescreen {
+ margin-left: 33.3333%;
+ }
+ .column.is-offset-one-quarter-widescreen {
+ margin-left: 25%;
+ }
+ .column.is-1-widescreen {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 8.33333%;
+ }
+ .column.is-offset-1-widescreen {
+ margin-left: 8.33333%;
+ }
+ .column.is-2-widescreen {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 16.66667%;
+ }
+ .column.is-offset-2-widescreen {
+ margin-left: 16.66667%;
+ }
+ .column.is-3-widescreen {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 25%;
+ }
+ .column.is-offset-3-widescreen {
+ margin-left: 25%;
+ }
+ .column.is-4-widescreen {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 33.33333%;
+ }
+ .column.is-offset-4-widescreen {
+ margin-left: 33.33333%;
+ }
+ .column.is-5-widescreen {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 41.66667%;
+ }
+ .column.is-offset-5-widescreen {
+ margin-left: 41.66667%;
+ }
+ .column.is-6-widescreen {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 50%;
+ }
+ .column.is-offset-6-widescreen {
+ margin-left: 50%;
+ }
+ .column.is-7-widescreen {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 58.33333%;
+ }
+ .column.is-offset-7-widescreen {
+ margin-left: 58.33333%;
+ }
+ .column.is-8-widescreen {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 66.66667%;
+ }
+ .column.is-offset-8-widescreen {
+ margin-left: 66.66667%;
+ }
+ .column.is-9-widescreen {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 75%;
+ }
+ .column.is-offset-9-widescreen {
+ margin-left: 75%;
+ }
+ .column.is-10-widescreen {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 83.33333%;
+ }
+ .column.is-offset-10-widescreen {
+ margin-left: 83.33333%;
+ }
+ .column.is-11-widescreen {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 91.66667%;
+ }
+ .column.is-offset-11-widescreen {
+ margin-left: 91.66667%;
+ }
+ .column.is-12-widescreen {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 100%;
+ }
+ .column.is-offset-12-widescreen {
+ margin-left: 100%;
+ }
+}
+
+@media screen and (min-width: 1392px) {
+ .column.is-narrow-fullhd {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ }
+ .column.is-full-fullhd {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 100%;
+ }
+ .column.is-three-quarters-fullhd {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 75%;
+ }
+ .column.is-two-thirds-fullhd {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 66.6666%;
+ }
+ .column.is-half-fullhd {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 50%;
+ }
+ .column.is-one-third-fullhd {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 33.3333%;
+ }
+ .column.is-one-quarter-fullhd {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 25%;
+ }
+ .column.is-offset-three-quarters-fullhd {
+ margin-left: 75%;
+ }
+ .column.is-offset-two-thirds-fullhd {
+ margin-left: 66.6666%;
+ }
+ .column.is-offset-half-fullhd {
+ margin-left: 50%;
+ }
+ .column.is-offset-one-third-fullhd {
+ margin-left: 33.3333%;
+ }
+ .column.is-offset-one-quarter-fullhd {
+ margin-left: 25%;
+ }
+ .column.is-1-fullhd {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 8.33333%;
+ }
+ .column.is-offset-1-fullhd {
+ margin-left: 8.33333%;
+ }
+ .column.is-2-fullhd {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 16.66667%;
+ }
+ .column.is-offset-2-fullhd {
+ margin-left: 16.66667%;
+ }
+ .column.is-3-fullhd {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 25%;
+ }
+ .column.is-offset-3-fullhd {
+ margin-left: 25%;
+ }
+ .column.is-4-fullhd {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 33.33333%;
+ }
+ .column.is-offset-4-fullhd {
+ margin-left: 33.33333%;
+ }
+ .column.is-5-fullhd {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 41.66667%;
+ }
+ .column.is-offset-5-fullhd {
+ margin-left: 41.66667%;
+ }
+ .column.is-6-fullhd {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 50%;
+ }
+ .column.is-offset-6-fullhd {
+ margin-left: 50%;
+ }
+ .column.is-7-fullhd {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 58.33333%;
+ }
+ .column.is-offset-7-fullhd {
+ margin-left: 58.33333%;
+ }
+ .column.is-8-fullhd {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 66.66667%;
+ }
+ .column.is-offset-8-fullhd {
+ margin-left: 66.66667%;
+ }
+ .column.is-9-fullhd {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 75%;
+ }
+ .column.is-offset-9-fullhd {
+ margin-left: 75%;
+ }
+ .column.is-10-fullhd {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 83.33333%;
+ }
+ .column.is-offset-10-fullhd {
+ margin-left: 83.33333%;
+ }
+ .column.is-11-fullhd {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 91.66667%;
+ }
+ .column.is-offset-11-fullhd {
+ margin-left: 91.66667%;
+ }
+ .column.is-12-fullhd {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 100%;
+ }
+ .column.is-offset-12-fullhd {
+ margin-left: 100%;
+ }
+}
+
+.columns {
+ margin-left: -0.75rem;
+ margin-right: -0.75rem;
+ margin-top: -0.75rem;
+}
+
+.columns:last-child {
+ margin-bottom: -0.75rem;
+}
+
+.columns:not(:last-child) {
+ margin-bottom: 0.75rem;
+}
+
+.columns.is-centered {
+ -webkit-box-pack: center;
+ -ms-flex-pack: center;
+ justify-content: center;
+}
+
+.columns.is-gapless {
+ margin-left: 0;
+ margin-right: 0;
+ margin-top: 0;
+}
+
+.columns.is-gapless:last-child {
+ margin-bottom: 0;
+}
+
+.columns.is-gapless:not(:last-child) {
+ margin-bottom: 1.5rem;
+}
+
+.columns.is-gapless > .column {
+ margin: 0;
+ padding: 0;
+}
+
+@media screen and (min-width: 769px), print {
+ .columns.is-grid {
+ -ms-flex-wrap: wrap;
+ flex-wrap: wrap;
+ }
+ .columns.is-grid > .column {
+ max-width: 33.3333%;
+ padding: 0.75rem;
+ width: 33.3333%;
+ }
+ .columns.is-grid > .column + .column {
+ margin-left: 0;
+ }
+}
+
+.columns.is-mobile {
+ display: -webkit-box;
+ display: -ms-flexbox;
+ display: flex;
+}
+
+.columns.is-multiline {
+ -ms-flex-wrap: wrap;
+ flex-wrap: wrap;
+}
+
+.columns.is-vcentered {
+ -webkit-box-align: center;
+ -ms-flex-align: center;
+ align-items: center;
+}
+
+@media screen and (min-width: 769px), print {
+ .columns:not(.is-desktop) {
+ display: -webkit-box;
+ display: -ms-flexbox;
+ display: flex;
+ }
+}
+
+@media screen and (min-width: 1008px) {
+ .columns.is-desktop {
+ display: -webkit-box;
+ display: -ms-flexbox;
+ display: flex;
+ }
+}
+
+.tile {
+ -webkit-box-align: stretch;
+ -ms-flex-align: stretch;
+ align-items: stretch;
+ display: block;
+ -ms-flex-preferred-size: 0;
+ flex-basis: 0;
+ -webkit-box-flex: 1;
+ -ms-flex-positive: 1;
+ flex-grow: 1;
+ -ms-flex-negative: 1;
+ flex-shrink: 1;
+ min-height: -webkit-min-content;
+ min-height: -moz-min-content;
+ min-height: min-content;
+}
+
+.tile.is-ancestor {
+ margin-left: -0.75rem;
+ margin-right: -0.75rem;
+ margin-top: -0.75rem;
+}
+
+.tile.is-ancestor:last-child {
+ margin-bottom: -0.75rem;
+}
+
+.tile.is-ancestor:not(:last-child) {
+ margin-bottom: 0.75rem;
+}
+
+.tile.is-child {
+ margin: 0 !important;
+}
+
+.tile.is-parent {
+ padding: 0.75rem;
+}
+
+.tile.is-vertical {
+ -webkit-box-orient: vertical;
+ -webkit-box-direction: normal;
+ -ms-flex-direction: column;
+ flex-direction: column;
+}
+
+.tile.is-vertical > .tile.is-child:not(:last-child) {
+ margin-bottom: 1.5rem !important;
+}
+
+@media screen and (min-width: 769px), print {
+ .tile:not(.is-child) {
+ display: -webkit-box;
+ display: -ms-flexbox;
+ display: flex;
+ }
+ .tile.is-1 {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 8.33333%;
+ }
+ .tile.is-2 {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 16.66667%;
+ }
+ .tile.is-3 {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 25%;
+ }
+ .tile.is-4 {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 33.33333%;
+ }
+ .tile.is-5 {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 41.66667%;
+ }
+ .tile.is-6 {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 50%;
+ }
+ .tile.is-7 {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 58.33333%;
+ }
+ .tile.is-8 {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 66.66667%;
+ }
+ .tile.is-9 {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 75%;
+ }
+ .tile.is-10 {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 83.33333%;
+ }
+ .tile.is-11 {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 91.66667%;
+ }
+ .tile.is-12 {
+ -webkit-box-flex: 0;
+ -ms-flex: none;
+ flex: none;
+ width: 100%;
+ }
+}
+
+.hero-video {
+ bottom: 0;
+ left: 0;
+ position: absolute;
+ right: 0;
+ top: 0;
+ overflow: hidden;
+}
+
+.hero-video video {
+ left: 50%;
+ min-height: 100%;
+ min-width: 100%;
+ position: absolute;
+ top: 50%;
+ -webkit-transform: translate3d(-50%, -50%, 0);
+ transform: translate3d(-50%, -50%, 0);
+}
+
+.hero-video.is-transparent {
+ opacity: 0.3;
+}
+
+@media screen and (max-width: 768px) {
+ .hero-video {
+ display: none;
+ }
+}
+
+.hero-buttons {
+ margin-top: 1.5rem;
+}
+
+@media screen and (max-width: 768px) {
+ .hero-buttons .button {
+ display: -webkit-box;
+ display: -ms-flexbox;
+ display: flex;
+ }
+ .hero-buttons .button:not(:last-child) {
+ margin-bottom: 0.75rem;
+ }
+}
+
+@media screen and (min-width: 769px), print {
+ .hero-buttons {
+ display: -webkit-box;
+ display: -ms-flexbox;
+ display: flex;
+ -webkit-box-pack: center;
+ -ms-flex-pack: center;
+ justify-content: center;
+ }
+ .hero-buttons .button:not(:last-child) {
+ margin-right: 1.5rem;
+ }
+}
+
+.hero-head,
+.hero-foot {
+ -webkit-box-flex: 0;
+ -ms-flex-positive: 0;
+ flex-grow: 0;
+ -ms-flex-negative: 0;
+ flex-shrink: 0;
+}
+
+.hero-body {
+ -webkit-box-flex: 1;
+ -ms-flex-positive: 1;
+ flex-grow: 1;
+ -ms-flex-negative: 0;
+ flex-shrink: 0;
+ padding: 3rem 1.5rem;
+}
+
+.hero {
+ -webkit-box-align: stretch;
+ -ms-flex-align: stretch;
+ align-items: stretch;
+ background-color: white;
+ display: -webkit-box;
+ display: -ms-flexbox;
+ display: flex;
+ -webkit-box-orient: vertical;
+ -webkit-box-direction: normal;
+ -ms-flex-direction: column;
+ flex-direction: column;
+ -webkit-box-pack: justify;
+ -ms-flex-pack: justify;
+ justify-content: space-between;
+}
+
+.hero .nav {
+ background: none;
+ -webkit-box-shadow: 0 1px 0 rgba(219, 219, 219, 0.3);
+ box-shadow: 0 1px 0 rgba(219, 219, 219, 0.3);
+}
+
+.hero .tabs ul {
+ border-bottom: none;
+}
+
+.hero.is-white {
+ background-color: white;
+ color: #0a0a0a;
+}
+
+.hero.is-white a:not(.button),
+.hero.is-white strong {
+ color: inherit;
+}
+
+.hero.is-white .title {
+ color: #0a0a0a;
+}
+
+.hero.is-white .subtitle {
+ color: rgba(10, 10, 10, 0.9);
+}
+
+.hero.is-white .subtitle a:not(.button),
+.hero.is-white .subtitle strong {
+ color: #0a0a0a;
+}
+
+.hero.is-white .nav {
+ -webkit-box-shadow: 0 1px 0 rgba(10, 10, 10, 0.2);
+ box-shadow: 0 1px 0 rgba(10, 10, 10, 0.2);
+}
+
+@media screen and (max-width: 768px) {
+ .hero.is-white .nav-menu {
+ background-color: white;
+ }
+}
+
+.hero.is-white a.nav-item,
+.hero.is-white .nav-item a:not(.button) {
+ color: rgba(10, 10, 10, 0.7);
+}
+
+.hero.is-white a.nav-item:hover, .hero.is-white a.nav-item.is-active,
+.hero.is-white .nav-item a:not(.button):hover,
+.hero.is-white .nav-item a:not(.button).is-active {
+ color: #0a0a0a;
+}
+
+.hero.is-white .tabs a {
+ color: #0a0a0a;
+ opacity: 0.9;
+}
+
+.hero.is-white .tabs a:hover {
+ opacity: 1;
+}
+
+.hero.is-white .tabs li.is-active a {
+ opacity: 1;
+}
+
+.hero.is-white .tabs.is-boxed a, .hero.is-white .tabs.is-toggle a {
+ color: #0a0a0a;
+}
+
+.hero.is-white .tabs.is-boxed a:hover, .hero.is-white .tabs.is-toggle a:hover {
+ background-color: rgba(10, 10, 10, 0.1);
+}
+
+.hero.is-white .tabs.is-boxed li.is-active a, .hero.is-white .tabs.is-boxed li.is-active a:hover, .hero.is-white .tabs.is-toggle li.is-active a, .hero.is-white .tabs.is-toggle li.is-active a:hover {
+ background-color: #0a0a0a;
+ border-color: #0a0a0a;
+ color: white;
+}
+
+.hero.is-white.is-bold {
+ background-image: linear-gradient(141deg, #e6e6e6 0%, white 71%, white 100%);
+}
+
+@media screen and (max-width: 768px) {
+ .hero.is-white.is-bold .nav-menu {
+ background-image: linear-gradient(141deg, #e6e6e6 0%, white 71%, white 100%);
+ }
+}
+
+@media screen and (max-width: 768px) {
+ .hero.is-white .nav-toggle span {
+ background-color: #0a0a0a;
+ }
+ .hero.is-white .nav-toggle:hover {
+ background-color: rgba(10, 10, 10, 0.1);
+ }
+ .hero.is-white .nav-toggle.is-active span {
+ background-color: #0a0a0a;
+ }
+ .hero.is-white .nav-menu .nav-item {
+ border-top-color: rgba(10, 10, 10, 0.2);
+ }
+}
+
+.hero.is-black {
+ background-color: #0a0a0a;
+ color: white;
+}
+
+.hero.is-black a:not(.button),
+.hero.is-black strong {
+ color: inherit;
+}
+
+.hero.is-black .title {
+ color: white;
+}
+
+.hero.is-black .subtitle {
+ color: rgba(255, 255, 255, 0.9);
+}
+
+.hero.is-black .subtitle a:not(.button),
+.hero.is-black .subtitle strong {
+ color: white;
+}
+
+.hero.is-black .nav {
+ -webkit-box-shadow: 0 1px 0 rgba(255, 255, 255, 0.2);
+ box-shadow: 0 1px 0 rgba(255, 255, 255, 0.2);
+}
+
+@media screen and (max-width: 768px) {
+ .hero.is-black .nav-menu {
+ background-color: #0a0a0a;
+ }
+}
+
+.hero.is-black a.nav-item,
+.hero.is-black .nav-item a:not(.button) {
+ color: rgba(255, 255, 255, 0.7);
+}
+
+.hero.is-black a.nav-item:hover, .hero.is-black a.nav-item.is-active,
+.hero.is-black .nav-item a:not(.button):hover,
+.hero.is-black .nav-item a:not(.button).is-active {
+ color: white;
+}
+
+.hero.is-black .tabs a {
+ color: white;
+ opacity: 0.9;
+}
+
+.hero.is-black .tabs a:hover {
+ opacity: 1;
+}
+
+.hero.is-black .tabs li.is-active a {
+ opacity: 1;
+}
+
+.hero.is-black .tabs.is-boxed a, .hero.is-black .tabs.is-toggle a {
+ color: white;
+}
+
+.hero.is-black .tabs.is-boxed a:hover, .hero.is-black .tabs.is-toggle a:hover {
+ background-color: rgba(10, 10, 10, 0.1);
+}
+
+.hero.is-black .tabs.is-boxed li.is-active a, .hero.is-black .tabs.is-boxed li.is-active a:hover, .hero.is-black .tabs.is-toggle li.is-active a, .hero.is-black .tabs.is-toggle li.is-active a:hover {
+ background-color: white;
+ border-color: white;
+ color: #0a0a0a;
+}
+
+.hero.is-black.is-bold {
+ background-image: linear-gradient(141deg, black 0%, #0a0a0a 71%, #181616 100%);
+}
+
+@media screen and (max-width: 768px) {
+ .hero.is-black.is-bold .nav-menu {
+ background-image: linear-gradient(141deg, black 0%, #0a0a0a 71%, #181616 100%);
+ }
+}
+
+@media screen and (max-width: 768px) {
+ .hero.is-black .nav-toggle span {
+ background-color: white;
+ }
+ .hero.is-black .nav-toggle:hover {
+ background-color: rgba(10, 10, 10, 0.1);
+ }
+ .hero.is-black .nav-toggle.is-active span {
+ background-color: white;
+ }
+ .hero.is-black .nav-menu .nav-item {
+ border-top-color: rgba(255, 255, 255, 0.2);
+ }
+}
+
+.hero.is-light {
+ background-color: whitesmoke;
+ color: #363636;
+}
+
+.hero.is-light a:not(.button),
+.hero.is-light strong {
+ color: inherit;
+}
+
+.hero.is-light .title {
+ color: #363636;
+}
+
+.hero.is-light .subtitle {
+ color: rgba(54, 54, 54, 0.9);
+}
+
+.hero.is-light .subtitle a:not(.button),
+.hero.is-light .subtitle strong {
+ color: #363636;
+}
+
+.hero.is-light .nav {
+ -webkit-box-shadow: 0 1px 0 rgba(54, 54, 54, 0.2);
+ box-shadow: 0 1px 0 rgba(54, 54, 54, 0.2);
+}
+
+@media screen and (max-width: 768px) {
+ .hero.is-light .nav-menu {
+ background-color: whitesmoke;
+ }
+}
+
+.hero.is-light a.nav-item,
+.hero.is-light .nav-item a:not(.button) {
+ color: rgba(54, 54, 54, 0.7);
+}
+
+.hero.is-light a.nav-item:hover, .hero.is-light a.nav-item.is-active,
+.hero.is-light .nav-item a:not(.button):hover,
+.hero.is-light .nav-item a:not(.button).is-active {
+ color: #363636;
+}
+
+.hero.is-light .tabs a {
+ color: #363636;
+ opacity: 0.9;
+}
+
+.hero.is-light .tabs a:hover {
+ opacity: 1;
+}
+
+.hero.is-light .tabs li.is-active a {
+ opacity: 1;
+}
+
+.hero.is-light .tabs.is-boxed a, .hero.is-light .tabs.is-toggle a {
+ color: #363636;
+}
+
+.hero.is-light .tabs.is-boxed a:hover, .hero.is-light .tabs.is-toggle a:hover {
+ background-color: rgba(10, 10, 10, 0.1);
+}
+
+.hero.is-light .tabs.is-boxed li.is-active a, .hero.is-light .tabs.is-boxed li.is-active a:hover, .hero.is-light .tabs.is-toggle li.is-active a, .hero.is-light .tabs.is-toggle li.is-active a:hover {
+ background-color: #363636;
+ border-color: #363636;
+ color: whitesmoke;
+}
+
+.hero.is-light.is-bold {
+ background-image: linear-gradient(141deg, #dfd8d9 0%, whitesmoke 71%, white 100%);
+}
+
+@media screen and (max-width: 768px) {
+ .hero.is-light.is-bold .nav-menu {
+ background-image: linear-gradient(141deg, #dfd8d9 0%, whitesmoke 71%, white 100%);
+ }
+}
+
+@media screen and (max-width: 768px) {
+ .hero.is-light .nav-toggle span {
+ background-color: #363636;
+ }
+ .hero.is-light .nav-toggle:hover {
+ background-color: rgba(10, 10, 10, 0.1);
+ }
+ .hero.is-light .nav-toggle.is-active span {
+ background-color: #363636;
+ }
+ .hero.is-light .nav-menu .nav-item {
+ border-top-color: rgba(54, 54, 54, 0.2);
+ }
+}
+
+.hero.is-dark {
+ background-color: #363636;
+ color: whitesmoke;
+}
+
+.hero.is-dark a:not(.button),
+.hero.is-dark strong {
+ color: inherit;
+}
+
+.hero.is-dark .title {
+ color: whitesmoke;
+}
+
+.hero.is-dark .subtitle {
+ color: rgba(245, 245, 245, 0.9);
+}
+
+.hero.is-dark .subtitle a:not(.button),
+.hero.is-dark .subtitle strong {
+ color: whitesmoke;
+}
+
+.hero.is-dark .nav {
+ -webkit-box-shadow: 0 1px 0 rgba(245, 245, 245, 0.2);
+ box-shadow: 0 1px 0 rgba(245, 245, 245, 0.2);
+}
+
+@media screen and (max-width: 768px) {
+ .hero.is-dark .nav-menu {
+ background-color: #363636;
+ }
+}
+
+.hero.is-dark a.nav-item,
+.hero.is-dark .nav-item a:not(.button) {
+ color: rgba(245, 245, 245, 0.7);
+}
+
+.hero.is-dark a.nav-item:hover, .hero.is-dark a.nav-item.is-active,
+.hero.is-dark .nav-item a:not(.button):hover,
+.hero.is-dark .nav-item a:not(.button).is-active {
+ color: whitesmoke;
+}
+
+.hero.is-dark .tabs a {
+ color: whitesmoke;
+ opacity: 0.9;
+}
+
+.hero.is-dark .tabs a:hover {
+ opacity: 1;
+}
+
+.hero.is-dark .tabs li.is-active a {
+ opacity: 1;
+}
+
+.hero.is-dark .tabs.is-boxed a, .hero.is-dark .tabs.is-toggle a {
+ color: whitesmoke;
+}
+
+.hero.is-dark .tabs.is-boxed a:hover, .hero.is-dark .tabs.is-toggle a:hover {
+ background-color: rgba(10, 10, 10, 0.1);
+}
+
+.hero.is-dark .tabs.is-boxed li.is-active a, .hero.is-dark .tabs.is-boxed li.is-active a:hover, .hero.is-dark .tabs.is-toggle li.is-active a, .hero.is-dark .tabs.is-toggle li.is-active a:hover {
+ background-color: whitesmoke;
+ border-color: whitesmoke;
+ color: #363636;
+}
+
+.hero.is-dark.is-bold {
+ background-image: linear-gradient(141deg, #1f191a 0%, #363636 71%, #46403f 100%);
+}
+
+@media screen and (max-width: 768px) {
+ .hero.is-dark.is-bold .nav-menu {
+ background-image: linear-gradient(141deg, #1f191a 0%, #363636 71%, #46403f 100%);
+ }
+}
+
+@media screen and (max-width: 768px) {
+ .hero.is-dark .nav-toggle span {
+ background-color: whitesmoke;
+ }
+ .hero.is-dark .nav-toggle:hover {
+ background-color: rgba(10, 10, 10, 0.1);
+ }
+ .hero.is-dark .nav-toggle.is-active span {
+ background-color: whitesmoke;
+ }
+ .hero.is-dark .nav-menu .nav-item {
+ border-top-color: rgba(245, 245, 245, 0.2);
+ }
+}
+
+.hero.is-primary {
+ background-color: #00d1b2;
+ color: #fff;
+}
+
+.hero.is-primary a:not(.button),
+.hero.is-primary strong {
+ color: inherit;
+}
+
+.hero.is-primary .title {
+ color: #fff;
+}
+
+.hero.is-primary .subtitle {
+ color: rgba(255, 255, 255, 0.9);
+}
+
+.hero.is-primary .subtitle a:not(.button),
+.hero.is-primary .subtitle strong {
+ color: #fff;
+}
+
+.hero.is-primary .nav {
+ -webkit-box-shadow: 0 1px 0 rgba(255, 255, 255, 0.2);
+ box-shadow: 0 1px 0 rgba(255, 255, 255, 0.2);
+}
+
+@media screen and (max-width: 768px) {
+ .hero.is-primary .nav-menu {
+ background-color: #00d1b2;
+ }
+}
+
+.hero.is-primary a.nav-item,
+.hero.is-primary .nav-item a:not(.button) {
+ color: rgba(255, 255, 255, 0.7);
+}
+
+.hero.is-primary a.nav-item:hover, .hero.is-primary a.nav-item.is-active,
+.hero.is-primary .nav-item a:not(.button):hover,
+.hero.is-primary .nav-item a:not(.button).is-active {
+ color: #fff;
+}
+
+.hero.is-primary .tabs a {
+ color: #fff;
+ opacity: 0.9;
+}
+
+.hero.is-primary .tabs a:hover {
+ opacity: 1;
+}
+
+.hero.is-primary .tabs li.is-active a {
+ opacity: 1;
+}
+
+.hero.is-primary .tabs.is-boxed a, .hero.is-primary .tabs.is-toggle a {
+ color: #fff;
+}
+
+.hero.is-primary .tabs.is-boxed a:hover, .hero.is-primary .tabs.is-toggle a:hover {
+ background-color: rgba(10, 10, 10, 0.1);
+}
+
+.hero.is-primary .tabs.is-boxed li.is-active a, .hero.is-primary .tabs.is-boxed li.is-active a:hover, .hero.is-primary .tabs.is-toggle li.is-active a, .hero.is-primary .tabs.is-toggle li.is-active a:hover {
+ background-color: #fff;
+ border-color: #fff;
+ color: #00d1b2;
+}
+
+.hero.is-primary.is-bold {
+ background-image: linear-gradient(141deg, #009e6c 0%, #00d1b2 71%, #00e7eb 100%);
+}
+
+@media screen and (max-width: 768px) {
+ .hero.is-primary.is-bold .nav-menu {
+ background-image: linear-gradient(141deg, #009e6c 0%, #00d1b2 71%, #00e7eb 100%);
+ }
+}
+
+@media screen and (max-width: 768px) {
+ .hero.is-primary .nav-toggle span {
+ background-color: #fff;
+ }
+ .hero.is-primary .nav-toggle:hover {
+ background-color: rgba(10, 10, 10, 0.1);
+ }
+ .hero.is-primary .nav-toggle.is-active span {
+ background-color: #fff;
+ }
+ .hero.is-primary .nav-menu .nav-item {
+ border-top-color: rgba(255, 255, 255, 0.2);
+ }
+}
+
+.hero.is-info {
+ background-color: #3273dc;
+ color: #fff;
+}
+
+.hero.is-info a:not(.button),
+.hero.is-info strong {
+ color: inherit;
+}
+
+.hero.is-info .title {
+ color: #fff;
+}
+
+.hero.is-info .subtitle {
+ color: rgba(255, 255, 255, 0.9);
+}
+
+.hero.is-info .subtitle a:not(.button),
+.hero.is-info .subtitle strong {
+ color: #fff;
+}
+
+.hero.is-info .nav {
+ -webkit-box-shadow: 0 1px 0 rgba(255, 255, 255, 0.2);
+ box-shadow: 0 1px 0 rgba(255, 255, 255, 0.2);
+}
+
+@media screen and (max-width: 768px) {
+ .hero.is-info .nav-menu {
+ background-color: #3273dc;
+ }
+}
+
+.hero.is-info a.nav-item,
+.hero.is-info .nav-item a:not(.button) {
+ color: rgba(255, 255, 255, 0.7);
+}
+
+.hero.is-info a.nav-item:hover, .hero.is-info a.nav-item.is-active,
+.hero.is-info .nav-item a:not(.button):hover,
+.hero.is-info .nav-item a:not(.button).is-active {
+ color: #fff;
+}
+
+.hero.is-info .tabs a {
+ color: #fff;
+ opacity: 0.9;
+}
+
+.hero.is-info .tabs a:hover {
+ opacity: 1;
+}
+
+.hero.is-info .tabs li.is-active a {
+ opacity: 1;
+}
+
+.hero.is-info .tabs.is-boxed a, .hero.is-info .tabs.is-toggle a {
+ color: #fff;
+}
+
+.hero.is-info .tabs.is-boxed a:hover, .hero.is-info .tabs.is-toggle a:hover {
+ background-color: rgba(10, 10, 10, 0.1);
+}
+
+.hero.is-info .tabs.is-boxed li.is-active a, .hero.is-info .tabs.is-boxed li.is-active a:hover, .hero.is-info .tabs.is-toggle li.is-active a, .hero.is-info .tabs.is-toggle li.is-active a:hover {
+ background-color: #fff;
+ border-color: #fff;
+ color: #3273dc;
+}
+
+.hero.is-info.is-bold {
+ background-image: linear-gradient(141deg, #1577c6 0%, #3273dc 71%, #4366e5 100%);
+}
+
+@media screen and (max-width: 768px) {
+ .hero.is-info.is-bold .nav-menu {
+ background-image: linear-gradient(141deg, #1577c6 0%, #3273dc 71%, #4366e5 100%);
+ }
+}
+
+@media screen and (max-width: 768px) {
+ .hero.is-info .nav-toggle span {
+ background-color: #fff;
+ }
+ .hero.is-info .nav-toggle:hover {
+ background-color: rgba(10, 10, 10, 0.1);
+ }
+ .hero.is-info .nav-toggle.is-active span {
+ background-color: #fff;
+ }
+ .hero.is-info .nav-menu .nav-item {
+ border-top-color: rgba(255, 255, 255, 0.2);
+ }
+}
+
+.hero.is-success {
+ background-color: #23d160;
+ color: #fff;
+}
+
+.hero.is-success a:not(.button),
+.hero.is-success strong {
+ color: inherit;
+}
+
+.hero.is-success .title {
+ color: #fff;
+}
+
+.hero.is-success .subtitle {
+ color: rgba(255, 255, 255, 0.9);
+}
+
+.hero.is-success .subtitle a:not(.button),
+.hero.is-success .subtitle strong {
+ color: #fff;
+}
+
+.hero.is-success .nav {
+ -webkit-box-shadow: 0 1px 0 rgba(255, 255, 255, 0.2);
+ box-shadow: 0 1px 0 rgba(255, 255, 255, 0.2);
+}
+
+@media screen and (max-width: 768px) {
+ .hero.is-success .nav-menu {
+ background-color: #23d160;
+ }
+}
+
+.hero.is-success a.nav-item,
+.hero.is-success .nav-item a:not(.button) {
+ color: rgba(255, 255, 255, 0.7);
+}
+
+.hero.is-success a.nav-item:hover, .hero.is-success a.nav-item.is-active,
+.hero.is-success .nav-item a:not(.button):hover,
+.hero.is-success .nav-item a:not(.button).is-active {
+ color: #fff;
+}
+
+.hero.is-success .tabs a {
+ color: #fff;
+ opacity: 0.9;
+}
+
+.hero.is-success .tabs a:hover {
+ opacity: 1;
+}
+
+.hero.is-success .tabs li.is-active a {
+ opacity: 1;
+}
+
+.hero.is-success .tabs.is-boxed a, .hero.is-success .tabs.is-toggle a {
+ color: #fff;
+}
+
+.hero.is-success .tabs.is-boxed a:hover, .hero.is-success .tabs.is-toggle a:hover {
+ background-color: rgba(10, 10, 10, 0.1);
+}
+
+.hero.is-success .tabs.is-boxed li.is-active a, .hero.is-success .tabs.is-boxed li.is-active a:hover, .hero.is-success .tabs.is-toggle li.is-active a, .hero.is-success .tabs.is-toggle li.is-active a:hover {
+ background-color: #fff;
+ border-color: #fff;
+ color: #23d160;
+}
+
+.hero.is-success.is-bold {
+ background-image: linear-gradient(141deg, #12af2f 0%, #23d160 71%, #2ce28a 100%);
+}
+
+@media screen and (max-width: 768px) {
+ .hero.is-success.is-bold .nav-menu {
+ background-image: linear-gradient(141deg, #12af2f 0%, #23d160 71%, #2ce28a 100%);
+ }
+}
+
+@media screen and (max-width: 768px) {
+ .hero.is-success .nav-toggle span {
+ background-color: #fff;
+ }
+ .hero.is-success .nav-toggle:hover {
+ background-color: rgba(10, 10, 10, 0.1);
+ }
+ .hero.is-success .nav-toggle.is-active span {
+ background-color: #fff;
+ }
+ .hero.is-success .nav-menu .nav-item {
+ border-top-color: rgba(255, 255, 255, 0.2);
+ }
+}
+
+.hero.is-warning {
+ background-color: #ffdd57;
+ color: rgba(0, 0, 0, 0.7);
+}
+
+.hero.is-warning a:not(.button),
+.hero.is-warning strong {
+ color: inherit;
+}
+
+.hero.is-warning .title {
+ color: rgba(0, 0, 0, 0.7);
+}
+
+.hero.is-warning .subtitle {
+ color: rgba(0, 0, 0, 0.9);
+}
+
+.hero.is-warning .subtitle a:not(.button),
+.hero.is-warning .subtitle strong {
+ color: rgba(0, 0, 0, 0.7);
+}
+
+.hero.is-warning .nav {
+ -webkit-box-shadow: 0 1px 0 rgba(0, 0, 0, 0.2);
+ box-shadow: 0 1px 0 rgba(0, 0, 0, 0.2);
+}
+
+@media screen and (max-width: 768px) {
+ .hero.is-warning .nav-menu {
+ background-color: #ffdd57;
+ }
+}
+
+.hero.is-warning a.nav-item,
+.hero.is-warning .nav-item a:not(.button) {
+ color: rgba(0, 0, 0, 0.7);
+}
+
+.hero.is-warning a.nav-item:hover, .hero.is-warning a.nav-item.is-active,
+.hero.is-warning .nav-item a:not(.button):hover,
+.hero.is-warning .nav-item a:not(.button).is-active {
+ color: rgba(0, 0, 0, 0.7);
+}
+
+.hero.is-warning .tabs a {
+ color: rgba(0, 0, 0, 0.7);
+ opacity: 0.9;
+}
+
+.hero.is-warning .tabs a:hover {
+ opacity: 1;
+}
+
+.hero.is-warning .tabs li.is-active a {
+ opacity: 1;
+}
+
+.hero.is-warning .tabs.is-boxed a, .hero.is-warning .tabs.is-toggle a {
+ color: rgba(0, 0, 0, 0.7);
+}
+
+.hero.is-warning .tabs.is-boxed a:hover, .hero.is-warning .tabs.is-toggle a:hover {
+ background-color: rgba(10, 10, 10, 0.1);
+}
+
+.hero.is-warning .tabs.is-boxed li.is-active a, .hero.is-warning .tabs.is-boxed li.is-active a:hover, .hero.is-warning .tabs.is-toggle li.is-active a, .hero.is-warning .tabs.is-toggle li.is-active a:hover {
+ background-color: rgba(0, 0, 0, 0.7);
+ border-color: rgba(0, 0, 0, 0.7);
+ color: #ffdd57;
+}
+
+.hero.is-warning.is-bold {
+ background-image: linear-gradient(141deg, #ffaf24 0%, #ffdd57 71%, #fffa70 100%);
+}
+
+@media screen and (max-width: 768px) {
+ .hero.is-warning.is-bold .nav-menu {
+ background-image: linear-gradient(141deg, #ffaf24 0%, #ffdd57 71%, #fffa70 100%);
+ }
+}
+
+@media screen and (max-width: 768px) {
+ .hero.is-warning .nav-toggle span {
+ background-color: rgba(0, 0, 0, 0.7);
+ }
+ .hero.is-warning .nav-toggle:hover {
+ background-color: rgba(10, 10, 10, 0.1);
+ }
+ .hero.is-warning .nav-toggle.is-active span {
+ background-color: rgba(0, 0, 0, 0.7);
+ }
+ .hero.is-warning .nav-menu .nav-item {
+ border-top-color: rgba(0, 0, 0, 0.2);
+ }
+}
+
+.hero.is-danger {
+ background-color: #ff3860;
+ color: #fff;
+}
+
+.hero.is-danger a:not(.button),
+.hero.is-danger strong {
+ color: inherit;
+}
+
+.hero.is-danger .title {
+ color: #fff;
+}
+
+.hero.is-danger .subtitle {
+ color: rgba(255, 255, 255, 0.9);
+}
+
+.hero.is-danger .subtitle a:not(.button),
+.hero.is-danger .subtitle strong {
+ color: #fff;
+}
+
+.hero.is-danger .nav {
+ -webkit-box-shadow: 0 1px 0 rgba(255, 255, 255, 0.2);
+ box-shadow: 0 1px 0 rgba(255, 255, 255, 0.2);
+}
+
+@media screen and (max-width: 768px) {
+ .hero.is-danger .nav-menu {
+ background-color: #ff3860;
+ }
+}
+
+.hero.is-danger a.nav-item,
+.hero.is-danger .nav-item a:not(.button) {
+ color: rgba(255, 255, 255, 0.7);
+}
+
+.hero.is-danger a.nav-item:hover, .hero.is-danger a.nav-item.is-active,
+.hero.is-danger .nav-item a:not(.button):hover,
+.hero.is-danger .nav-item a:not(.button).is-active {
+ color: #fff;
+}
+
+.hero.is-danger .tabs a {
+ color: #fff;
+ opacity: 0.9;
+}
+
+.hero.is-danger .tabs a:hover {
+ opacity: 1;
+}
+
+.hero.is-danger .tabs li.is-active a {
+ opacity: 1;
+}
+
+.hero.is-danger .tabs.is-boxed a, .hero.is-danger .tabs.is-toggle a {
+ color: #fff;
+}
+
+.hero.is-danger .tabs.is-boxed a:hover, .hero.is-danger .tabs.is-toggle a:hover {
+ background-color: rgba(10, 10, 10, 0.1);
+}
+
+.hero.is-danger .tabs.is-boxed li.is-active a, .hero.is-danger .tabs.is-boxed li.is-active a:hover, .hero.is-danger .tabs.is-toggle li.is-active a, .hero.is-danger .tabs.is-toggle li.is-active a:hover {
+ background-color: #fff;
+ border-color: #fff;
+ color: #ff3860;
+}
+
+.hero.is-danger.is-bold {
+ background-image: linear-gradient(141deg, #ff0561 0%, #ff3860 71%, #ff5257 100%);
+}
+
+@media screen and (max-width: 768px) {
+ .hero.is-danger.is-bold .nav-menu {
+ background-image: linear-gradient(141deg, #ff0561 0%, #ff3860 71%, #ff5257 100%);
+ }
+}
+
+@media screen and (max-width: 768px) {
+ .hero.is-danger .nav-toggle span {
+ background-color: #fff;
+ }
+ .hero.is-danger .nav-toggle:hover {
+ background-color: rgba(10, 10, 10, 0.1);
+ }
+ .hero.is-danger .nav-toggle.is-active span {
+ background-color: #fff;
+ }
+ .hero.is-danger .nav-menu .nav-item {
+ border-top-color: rgba(255, 255, 255, 0.2);
+ }
+}
+
+@media screen and (min-width: 769px), print {
+ .hero.is-medium .hero-body {
+ padding-bottom: 9rem;
+ padding-top: 9rem;
+ }
+}
+
+@media screen and (min-width: 769px), print {
+ .hero.is-large .hero-body {
+ padding-bottom: 18rem;
+ padding-top: 18rem;
+ }
+}
+
+.hero.is-halfheight .hero-body, .hero.is-fullheight .hero-body {
+ -webkit-box-align: center;
+ -ms-flex-align: center;
+ align-items: center;
+ display: -webkit-box;
+ display: -ms-flexbox;
+ display: flex;
+}
+
+.hero.is-halfheight .hero-body > .container, .hero.is-fullheight .hero-body > .container {
+ -webkit-box-flex: 1;
+ -ms-flex-positive: 1;
+ flex-grow: 1;
+ -ms-flex-negative: 1;
+ flex-shrink: 1;
+}
+
+.hero.is-halfheight {
+ min-height: 50vh;
+}
+
+.hero.is-fullheight {
+ min-height: 100vh;
+}
+
+.section {
+ background-color: white;
+ padding: 3rem 1.5rem;
+}
+
+@media screen and (min-width: 1008px) {
+ .section.is-medium {
+ padding: 9rem 1.5rem;
+ }
+ .section.is-large {
+ padding: 18rem 1.5rem;
+ }
+}
+
+.footer {
+ background-color: whitesmoke;
+ padding: 3rem 1.5rem 6rem;
+}
+
+.highlight {
+ background-color: #f5f5f5;
+ color: #586e75;
+}
+
+.highlight .c {
+ color: #93a1a1;
+}
+
+.highlight .err,
+.highlight .g {
+ color: #586e75;
+}
+
+.highlight .k {
+ color: #859900;
+}
+
+.highlight .l,
+.highlight .n {
+ color: #586e75;
+}
+
+.highlight .o {
+ color: #859900;
+}
+
+.highlight .x {
+ color: #cb4b16;
+}
+
+.highlight .p {
+ color: #586e75;
+}
+
+.highlight .cm {
+ color: #93a1a1;
+}
+
+.highlight .cp {
+ color: #859900;
+}
+
+.highlight .c1 {
+ color: #93a1a1;
+}
+
+.highlight .cs {
+ color: #859900;
+}
+
+.highlight .gd {
+ color: #2aa198;
+}
+
+.highlight .ge {
+ color: #586e75;
+ font-style: italic;
+}
+
+.highlight .gr {
+ color: #dc322f;
+}
+
+.highlight .gh {
+ color: #cb4b16;
+}
+
+.highlight .gi {
+ color: #859900;
+}
+
+.highlight .go,
+.highlight .gp {
+ color: #586e75;
+}
+
+.highlight .gs {
+ color: #586e75;
+ font-weight: bold;
+}
+
+.highlight .gu {
+ color: #cb4b16;
+}
+
+.highlight .gt {
+ color: #586e75;
+}
+
+.highlight .kc {
+ color: #cb4b16;
+}
+
+.highlight .kd {
+ color: #268bd2;
+}
+
+.highlight .kn,
+.highlight .kp {
+ color: #859900;
+}
+
+.highlight .kr {
+ color: #268bd2;
+}
+
+.highlight .kt {
+ color: #dc322f;
+}
+
+.highlight .ld {
+ color: #586e75;
+}
+
+.highlight .m,
+.highlight .s {
+ color: #2aa198;
+}
+
+.highlight .na {
+ color: #B58900;
+}
+
+.highlight .nb {
+ color: #586e75;
+}
+
+.highlight .nc {
+ color: #268bd2;
+}
+
+.highlight .no {
+ color: #cb4b16;
+}
+
+.highlight .nd {
+ color: #268bd2;
+}
+
+.highlight .ni,
+.highlight .ne {
+ color: #cb4b16;
+}
+
+.highlight .nf {
+ color: #268bd2;
+}
+
+.highlight .nl,
+.highlight .nn,
+.highlight .nx,
+.highlight .py {
+ color: #586e75;
+}
+
+.highlight .nt,
+.highlight .nv {
+ color: #268bd2;
+}
+
+.highlight .ow {
+ color: #859900;
+}
+
+.highlight .w {
+ color: #586e75;
+}
+
+.highlight .mf,
+.highlight .mh,
+.highlight .mi,
+.highlight .mo {
+ color: #2aa198;
+}
+
+.highlight .sb {
+ color: #93a1a1;
+}
+
+.highlight .sc {
+ color: #2aa198;
+}
+
+.highlight .sd {
+ color: #586e75;
+}
+
+.highlight .s2 {
+ color: #2aa198;
+}
+
+.highlight .se {
+ color: #cb4b16;
+}
+
+.highlight .sh {
+ color: #586e75;
+}
+
+.highlight .si,
+.highlight .sx {
+ color: #2aa198;
+}
+
+.highlight .sr {
+ color: #dc322f;
+}
+
+.highlight .s1,
+.highlight .ss {
+ color: #2aa198;
+}
+
+.highlight .bp,
+.highlight .vc,
+.highlight .vg,
+.highlight .vi {
+ color: #268bd2;
+}
+
+.highlight .il {
+ color: #2aa198;
+}
+
+.content .highlight {
+ text-align: left;
+}
+
+@media screen and (min-width: 769px), print {
+ .button small {
+ color: #4a4a4a;
+ left: 0;
+ margin-top: 10px;
+ position: absolute;
+ top: 100%;
+ width: 100%;
+ }
+}
+
+body.page-grid .column > .notification {
+ padding-left: 0;
+ padding-right: 0;
+ text-align: center;
+}
+
+@media screen and (min-width: 769px), print {
+ .header-item .button + .button {
+ margin-left: 0.75rem;
+ }
+}
+
+svg {
+ max-height: 100%;
+ max-width: 100%;
+}
+
+#carbon {
+ margin-left: auto;
+ margin-right: auto;
+ max-width: 340px;
+ min-height: 150px;
+ padding: 0;
+ position: relative;
+}
+
+#carbon:hover {
+ -webkit-box-shadow: 0 2px 3px rgba(10, 10, 10, 0.1), 0 0 0 1px #00d1b2;
+ box-shadow: 0 2px 3px rgba(10, 10, 10, 0.1), 0 0 0 1px #00d1b2;
+}
+
+@media screen and (min-width: 769px), print {
+ #carbon {
+ width: 340px;
+ }
+}
+
+#carbonads {
+ font-size: 14px;
+ text-align: left;
+}
+
+#carbonads a,
+#carbonads span {
+ display: block;
+}
+
+#carbonads .carbon-wrap {
+ position: relative;
+}
+
+#carbonads .carbon-img {
+ background: whitesmoke;
+ float: left;
+ height: 100px;
+ margin: 15px 0 15px 15px;
+ width: 130px;
+}
+
+#carbonads .carbon-img img {
+ display: block;
+ height: 100px;
+ width: 130px;
+}
+
+#carbonads .carbon-text {
+ display: block;
+ color: #363636;
+ line-height: 20px;
+ padding: 15px 15px 35px 160px;
+}
+
+#carbonads .carbon-poweredby {
+ bottom: 0;
+ color: #7a7a7a;
+ font-size: 0.75rem;
+ left: 160px;
+ line-height: 20px;
+ padding: 0 15px 10px 0;
+ position: absolute;
+ right: 0;
+}
+
+@-webkit-keyframes floatUp {
+ 0% {
+ -webkit-box-shadow: 0 0 0 rgba(10, 10, 10, 0), 0 0 0 rgba(10, 10, 10, 0), 0 0 0 rgba(10, 10, 10, 0);
+ box-shadow: 0 0 0 rgba(10, 10, 10, 0), 0 0 0 rgba(10, 10, 10, 0), 0 0 0 rgba(10, 10, 10, 0);
+ -webkit-transform: scale(0.86);
+ transform: scale(0.86);
+ }
+ 67% {
+ -webkit-box-shadow: 0 0 0 rgba(10, 10, 10, 0), 0 5px 10px rgba(10, 10, 10, 0.1), 0 1px 1px rgba(10, 10, 10, 0.2);
+ box-shadow: 0 0 0 rgba(10, 10, 10, 0), 0 5px 10px rgba(10, 10, 10, 0.1), 0 1px 1px rgba(10, 10, 10, 0.2);
+ -webkit-transform: scale(1);
+ transform: scale(1);
+ }
+ 100% {
+ -webkit-box-shadow: 0 20px 60px rgba(10, 10, 10, 0.05), 0 5px 10px rgba(10, 10, 10, 0.1), 0 1px 1px rgba(10, 10, 10, 0.2);
+ box-shadow: 0 20px 60px rgba(10, 10, 10, 0.05), 0 5px 10px rgba(10, 10, 10, 0.1), 0 1px 1px rgba(10, 10, 10, 0.2);
+ -webkit-transform: scale(1);
+ transform: scale(1);
+ }
+}
+
+@keyframes floatUp {
+ 0% {
+ -webkit-box-shadow: 0 0 0 rgba(10, 10, 10, 0), 0 0 0 rgba(10, 10, 10, 0), 0 0 0 rgba(10, 10, 10, 0);
+ box-shadow: 0 0 0 rgba(10, 10, 10, 0), 0 0 0 rgba(10, 10, 10, 0), 0 0 0 rgba(10, 10, 10, 0);
+ -webkit-transform: scale(0.86);
+ transform: scale(0.86);
+ }
+ 67% {
+ -webkit-box-shadow: 0 0 0 rgba(10, 10, 10, 0), 0 5px 10px rgba(10, 10, 10, 0.1), 0 1px 1px rgba(10, 10, 10, 0.2);
+ box-shadow: 0 0 0 rgba(10, 10, 10, 0), 0 5px 10px rgba(10, 10, 10, 0.1), 0 1px 1px rgba(10, 10, 10, 0.2);
+ -webkit-transform: scale(1);
+ transform: scale(1);
+ }
+ 100% {
+ -webkit-box-shadow: 0 20px 60px rgba(10, 10, 10, 0.05), 0 5px 10px rgba(10, 10, 10, 0.1), 0 1px 1px rgba(10, 10, 10, 0.2);
+ box-shadow: 0 20px 60px rgba(10, 10, 10, 0.05), 0 5px 10px rgba(10, 10, 10, 0.1), 0 1px 1px rgba(10, 10, 10, 0.2);
+ -webkit-transform: scale(1);
+ transform: scale(1);
+ }
+}
+
+@-webkit-keyframes strokePath {
+ from {
+ stroke-dashoffset: 880;
+ }
+ to {
+ stroke-dashoffset: 0;
+ }
+}
+
+@keyframes strokePath {
+ from {
+ stroke-dashoffset: 880;
+ }
+ to {
+ stroke-dashoffset: 0;
+ }
+}
+
+@-webkit-keyframes fadeIn {
+ from {
+ opacity: 0;
+ -webkit-transform: scale(0.86);
+ transform: scale(0.86);
+ }
+ to {
+ opacity: 1;
+ -webkit-transform: scale(1);
+ transform: scale(1);
+ }
+}
+
+@keyframes fadeIn {
+ from {
+ opacity: 0;
+ -webkit-transform: scale(0.86);
+ transform: scale(0.86);
+ }
+ to {
+ opacity: 1;
+ -webkit-transform: scale(1);
+ transform: scale(1);
+ }
+}
+
+@-webkit-keyframes fadeOut {
+ 0% {
+ opacity: 1;
+ -webkit-transform: scale(0.86);
+ transform: scale(0.86);
+ }
+ 67% {
+ opacity: 1;
+ -webkit-transform: scale(0.86);
+ transform: scale(0.86);
+ }
+ 100% {
+ opacity: 0;
+ -webkit-transform: scale(1);
+ transform: scale(1);
+ }
+}
+
+@keyframes fadeOut {
+ 0% {
+ opacity: 1;
+ -webkit-transform: scale(0.86);
+ transform: scale(0.86);
+ }
+ 67% {
+ opacity: 1;
+ -webkit-transform: scale(0.86);
+ transform: scale(0.86);
+ }
+ 100% {
+ opacity: 0;
+ -webkit-transform: scale(1);
+ transform: scale(1);
+ }
+}
+
+@-webkit-keyframes slideDown {
+ 0% {
+ opacity: 0;
+ -webkit-transform: translateY(-10px);
+ transform: translateY(-10px);
+ }
+ 100% {
+ opacity: 1;
+ -webkit-transform: translateY(0);
+ transform: translateY(0);
+ }
+}
+
+@keyframes slideDown {
+ 0% {
+ opacity: 0;
+ -webkit-transform: translateY(-10px);
+ transform: translateY(-10px);
+ }
+ 100% {
+ opacity: 1;
+ -webkit-transform: translateY(0);
+ transform: translateY(0);
+ }
+}
+
+@-webkit-keyframes slideUp {
+ 0% {
+ opacity: 0;
+ -webkit-transform: translateY(10px);
+ transform: translateY(10px);
+ }
+ 100% {
+ opacity: 1;
+ -webkit-transform: translateY(0);
+ transform: translateY(0);
+ }
+}
+
+@keyframes slideUp {
+ 0% {
+ opacity: 0;
+ -webkit-transform: translateY(10px);
+ transform: translateY(10px);
+ }
+ 100% {
+ opacity: 1;
+ -webkit-transform: translateY(0);
+ transform: translateY(0);
+ }
+}
+
+#b {
+ -webkit-animation-duration: 1.5s;
+ animation-duration: 1.5s;
+ -webkit-animation-fill-mode: both;
+ animation-fill-mode: both;
+ -webkit-animation-name: floatUp;
+ animation-name: floatUp;
+ -webkit-animation-timing-function: cubic-bezier(0, 0.71, 0.29, 1);
+ animation-timing-function: cubic-bezier(0, 0.71, 0.29, 1);
+ border-radius: 24px;
+ display: inline-block;
+ height: 240px;
+ margin-bottom: 40px;
+ position: relative;
+ vertical-align: top;
+ width: 240px;
+}
+
+#b svg {
+ bottom: 0;
+ left: 0;
+ position: absolute;
+ right: 0;
+ top: 0;
+ display: block;
+ height: 240px;
+ width: 240px;
+}
+
+#b svg:first-child {
+ -webkit-animation-duration: 1.5s;
+ animation-duration: 1.5s;
+ -webkit-animation-fill-mode: both;
+ animation-fill-mode: both;
+ -webkit-animation-name: fadeOut;
+ animation-name: fadeOut;
+ -webkit-animation-timing-function: cubic-bezier(0, 0.71, 0.29, 1);
+ animation-timing-function: cubic-bezier(0, 0.71, 0.29, 1);
+}
+
+#b svg:first-child g {
+ -webkit-animation-duration: 1s;
+ animation-duration: 1s;
+ -webkit-animation-fill-mode: both;
+ animation-fill-mode: both;
+ -webkit-animation-name: strokePath;
+ animation-name: strokePath;
+ -webkit-animation-timing-function: cubic-bezier(0, 0.71, 0.29, 1);
+ animation-timing-function: cubic-bezier(0, 0.71, 0.29, 1);
+ fill: none;
+ stroke: #00d1b2;
+ stroke-dasharray: 880;
+ stroke-width: 2px;
+}
+
+#b svg:last-child {
+ -webkit-animation-delay: 1s;
+ animation-delay: 1s;
+ -webkit-animation-duration: 1s;
+ animation-duration: 1s;
+ -webkit-animation-fill-mode: both;
+ animation-fill-mode: both;
+ -webkit-animation-name: fadeIn;
+ animation-name: fadeIn;
+ -webkit-animation-timing-function: cubic-bezier(0, 0.71, 0.29, 1);
+ animation-timing-function: cubic-bezier(0, 0.71, 0.29, 1);
+}
+
+#b svg:last-child g {
+ fill: #00d1b2;
+}
+
+@media screen and (max-width: 768px) {
+ #b {
+ border-radius: 16px;
+ height: 160px;
+ width: 160px;
+ }
+}
+
+#bulma {
+ -webkit-animation: slideDown 500ms both;
+ animation: slideDown 500ms both;
+}
+
+#modern-framework {
+ -webkit-animation: slideUp 500ms both;
+ animation: slideUp 500ms both;
+ -webkit-animation-delay: 0.2s;
+ animation-delay: 0.2s;
+}
+
+#npm {
+ -webkit-box-align: center;
+ -ms-flex-align: center;
+ align-items: center;
+ -webkit-animation: fadeIn 500ms both;
+ animation: fadeIn 500ms both;
+ -webkit-animation-delay: 0.4s;
+ animation-delay: 0.4s;
+ background: none;
+ display: -webkit-box;
+ display: -ms-flexbox;
+ display: flex;
+ -webkit-box-pack: center;
+ -ms-flex-pack: center;
+ justify-content: center;
+ margin: -10px 0 20px;
+}
+
+#npm code {
+ background: whitesmoke;
+ border-radius: 3px;
+ color: #00d1b2;
+ display: inline-block;
+ font-size: 16px;
+ padding: 16px 32px;
+}
+
+#ghbtns {
+ -webkit-animation: slideDown 500ms both;
+ animation: slideDown 500ms both;
+ -webkit-animation-delay: 0.6s;
+ animation-delay: 0.6s;
+}
+
+html.route-index #carbon {
+ -webkit-animation: slideUp 500ms both;
+ animation: slideUp 500ms both;
+ -webkit-animation-delay: 0.8s;
+ animation-delay: 0.8s;
+}
+
+#download {
+ -webkit-animation: fadeIn 500ms both;
+ animation: fadeIn 500ms both;
+ -webkit-animation-delay: 1s;
+ animation-delay: 1s;
+}
+
+#grid .notification {
+ padding-left: 0;
+ padding-right: 0;
+}
+
+#message {
+ display: none;
+}
+
+#tweet {
+ background: white;
+ border-radius: 5px;
+ -webkit-box-shadow: 0 2px 3px rgba(10, 10, 10, 0.1), 0 0 0 1px rgba(10, 10, 10, 0.1);
+ box-shadow: 0 2px 3px rgba(10, 10, 10, 0.1), 0 0 0 1px rgba(10, 10, 10, 0.1);
+ padding: 1.5rem;
+}
+
+#github {
+ color: #333333;
+ border-color: #333333;
+}
+
+#github:hover {
+ background: #333333;
+ border-color: #333333;
+ color: white;
+}
+
+#twitter {
+ color: #55acee;
+ border-color: #55acee;
+}
+
+#twitter:hover {
+ background: #55acee;
+ border-color: #55acee;
+ color: white;
+}
+
+@media screen and (min-width: 1008px) {
+ #blogDropdown {
+ width: 16rem;
+ }
+ #blogDropdown .navbar-item {
+ white-space: normal;
+ }
+ #moreDropdown {
+ width: 16rem;
+ }
+ #moreDropdown .navbar-item {
+ padding-right: 1rem;
+ }
+ #moreDropdown .navbar-item .level {
+ -webkit-box-flex: 1;
+ -ms-flex-positive: 1;
+ flex-grow: 1;
+ }
+}
+
+#about .twitter-container {
+ display: block;
+ height: 30px;
+ line-height: 30px;
+ margin-top: 5px;
+}
+
+#about small {
+ display: block;
+ margin-top: 5px;
+}
+
+#mc_embed_signup .field {
+ margin-bottom: 0;
+}
+
+#mc_embed_signup .notification {
+ margin-top: 0.75rem;
+}
+
+#share form {
+ height: 30px;
+ margin-top: 10px;
+}
+
+#social {
+ -webkit-box-align: center;
+ -ms-flex-align: center;
+ align-items: center;
+ display: -webkit-box;
+ display: -ms-flexbox;
+ display: flex;
+ -ms-flex-wrap: wrap;
+ flex-wrap: wrap;
+ -webkit-box-pack: start;
+ -ms-flex-pack: start;
+ justify-content: flex-start;
+}
+
+#social > iframe,
+#social > a,
+#social > form,
+#social > div {
+ display: inline-block;
+ font-size: 11px;
+ height: 30px;
+ line-height: 30px;
+ margin-top: 5px;
+}
+
+#social .github-btn {
+ width: 160px;
+}
+
+#social .twitter-share-button {
+ margin-right: 10px;
+ min-width: 76px;
+}
+
+#social .paypal-form {
+ min-width: 148px;
+}
+
+#social .fb-like {
+ -webkit-box-align: center;
+ -ms-flex-align: center;
+ align-items: center;
+ display: -webkit-box;
+ display: -ms-flexbox;
+ display: flex;
+ width: 130px;
+}
+
+#newsletter .input {
+ border-color: white;
+ -webkit-box-shadow: none;
+ box-shadow: none;
+}
+
+#sister ul {
+ display: -webkit-box;
+ display: -ms-flexbox;
+ display: flex;
+ -ms-flex-wrap: wrap;
+ flex-wrap: wrap;
+}
+
+#sister li {
+ display: -webkit-box;
+ display: -ms-flexbox;
+ display: flex;
+ height: 30px;
+ margin: 5px 1rem 0 0;
+}
+
+#sister img {
+ height: 30px;
+}
+
+#tsp small {
+ display: block;
+}
+
+#images tr td:nth-child(2) {
+ width: 320px;
+}
+
+.color {
+ border-radius: 2px;
+ -webkit-box-shadow: 0 2px 3px 0 rgba(0, 0, 0, 0.1), inset 0 0 0 1px rgba(0, 0, 0, 0.1);
+ box-shadow: 0 2px 3px 0 rgba(0, 0, 0, 0.1), inset 0 0 0 1px rgba(0, 0, 0, 0.1);
+ display: inline-block;
+ float: left;
+ height: 24px;
+ margin-right: 8px;
+ width: 24px;
+}
+
+.button.is-rss {
+ background-color: #f26522;
+ border-color: transparent;
+ color: #fff;
+}
+
+.button.is-rss:hover {
+ background-color: #ed560e;
+}
+
+.button.is-rss:active {
+ background-color: #d54d0d;
+}
+
+.view-all-versions {
+ color: #7a7a7a;
+}
+
+.view-all-versions:hover {
+ text-decoration: underline;
+}
+
+.example,
+.structure {
+ border: 1px solid #ffdd57;
+ border-top-right-radius: 3px;
+ color: rgba(0, 0, 0, 0.7);
+ padding: 1.5rem;
+ position: relative;
+}
+
+.example:not(:first-child),
+.structure:not(:first-child) {
+ margin-top: 2rem;
+}
+
+.example:not(:last-child),
+.structure:not(:last-child) {
+ margin-bottom: 1.5rem;
+}
+
+.example:before,
+.structure:before {
+ background: #ffdd57;
+ border-radius: 3px 3px 0 0;
+ bottom: 100%;
+ content: "Example";
+ display: inline-block;
+ font-size: 7px;
+ font-weight: bold;
+ left: -1px;
+ letter-spacing: 1px;
+ padding: 3px 5px;
+ position: absolute;
+ text-transform: uppercase;
+ vertical-align: top;
+}
+
+@media screen and (min-width: 769px), print {
+ .example.is-fullwidth,
+ .structure.is-fullwidth {
+ border-left: none;
+ border-right: none;
+ padding: 0;
+ }
+}
+
+.example + .highlight {
+ border: 1px solid #ffdd57;
+ border-radius: 0 0 3px 3px;
+ border-top: none;
+ margin-top: -1.5rem;
+}
+
+.example + .highlight:not(:last-child) {
+ margin-bottom: 1.5rem;
+}
+
+.highlight pre {
+ max-height: 480px;
+ margin-bottom: 0 !important;
+ padding: 0;
+}
+
+.highlight pre code {
+ padding: 1.25em 1.5em;
+}
+
+.highlight-full .highlight pre,
+#navbarJsExample .highlight pre {
+ max-height: none;
+}
+
+.structure {
+ border-color: #ff3860;
+ border-radius: 3px;
+ padding: 1.5rem;
+}
+
+.structure:before {
+ background: #ff3860;
+ color: #fff;
+ content: "Structure";
+}
+
+.structure-item {
+ position: relative;
+}
+
+.structure-item:before {
+ bottom: 0;
+ left: 0;
+ position: absolute;
+ right: 0;
+ top: 0;
+ background: rgba(10, 10, 10, 0.7);
+ background: whitesmoke;
+ border: 1px solid #dbdbdb;
+ content: "";
+ display: block;
+ z-index: 1;
+}
+
+.structure-item:after {
+ bottom: 0;
+ left: 0;
+ position: absolute;
+ right: 0;
+ top: 0;
+ -webkit-box-align: center;
+ -ms-flex-align: center;
+ align-items: center;
+ content: attr(title);
+ display: -webkit-box;
+ display: -ms-flexbox;
+ display: flex;
+ font-family: monospace;
+ font-size: 11px;
+ -webkit-box-pack: center;
+ -ms-flex-pack: center;
+ justify-content: center;
+ padding: 3px 5px;
+ z-index: 2;
+}
+
+.structure-item.is-structure-container {
+ padding: 1.5rem 0.75rem 0.75rem;
+}
+
+.structure-item.is-structure-container:after {
+ -webkit-box-align: start;
+ -ms-flex-align: start;
+ align-items: flex-start;
+ -webkit-box-pack: start;
+ -ms-flex-pack: start;
+ justify-content: flex-start;
+ padding: 0.5rem 0.75rem;
+}
+
+.highlight {
+ position: relative;
+}
+
+.highlight .copy,
+.highlight .expand {
+ -webkit-touch-callout: none;
+ -webkit-user-select: none;
+ -moz-user-select: none;
+ -ms-user-select: none;
+ user-select: none;
+ background: white;
+ border: solid #dbdbdb;
+ border-width: 0 0 1px 1px;
+ color: #7a7a7a;
+ cursor: pointer;
+ outline: none;
+ position: absolute;
+ right: 0;
+ top: 0;
+}
+
+.highlight .copy:hover,
+.highlight .expand:hover {
+ border-color: #ff3860;
+ color: #ff3860;
+}
+
+.highlight .expand {
+ border-right-width: 1px;
+ right: 50px;
+}
+
+@media screen and (min-width: 769px), print {
+ .highlight pre {
+ white-space: pre-wrap;
+ }
+}
+
+@media screen and (min-width: 769px), print {
+ .section:not(.is-fullwidth) > .example:not(.is-fullwidth) {
+ margin-left: 1.5rem;
+ margin-right: 1.5rem;
+ }
+ .section:not(.is-fullwidth) > .example:not(.is-fullwidth) + .highlight {
+ margin-left: 1.5rem;
+ margin-right: 1.5rem;
+ }
+}
+
+.section.is-fullwidth {
+ padding: 0 !important;
+}
+
+.section.is-fullwidth .example {
+ border-left: none;
+ border-radius: 0;
+ border-right: none;
+ padding: 0;
+}
+
+.section.is-fullwidth .example + .highlight {
+ border-left: none;
+ border-radius: 0;
+ border-right: none;
+}
+
+.callout {
+ background-color: whitesmoke;
+ border-radius: 3px;
+ padding: 1.25rem 2.5rem 1.25rem 1.5rem;
+ position: relative;
+}
+
+.callout:not(:last-child) {
+ margin-bottom: 1.5rem;
+}
+
+.callout.is-white {
+ background-color: white;
+ color: #0a0a0a;
+}
+
+.callout.is-black {
+ background-color: #0a0a0a;
+ color: white;
+}
+
+.callout.is-light {
+ background-color: whitesmoke;
+ color: #363636;
+}
+
+.callout.is-dark {
+ background-color: #363636;
+ color: whitesmoke;
+}
+
+.callout.is-primary {
+ background-color: #00d1b2;
+ color: #fff;
+}
+
+.callout.is-info {
+ background-color: #3273dc;
+ color: #fff;
+}
+
+.callout.is-success {
+ background-color: #23d160;
+ color: #fff;
+}
+
+.callout.is-warning {
+ background-color: #ffdd57;
+ color: rgba(0, 0, 0, 0.7);
+}
+
+.callout.is-danger {
+ background-color: #ff3860;
+ color: #fff;
+}
+
+.bsa {
+ padding: 2rem;
+}
+
+.bsa-cpc {
+ min-height: 1px;
+}
+
+#_default_ .default-ad {
+ background-color: rgba(0, 0, 0, 0.3);
+ border-radius: 2px;
+ color: white;
+ display: inline-block;
+ font-size: 10px;
+ font-weight: bold;
+ padding: 0 4px;
+ text-transform: uppercase;
+ vertical-align: top;
+}
+
+#_default_ > a {
+ background-color: white;
+ border-radius: 5px;
+ -webkit-box-shadow: 0 2px 3px rgba(10, 10, 10, 0.1), 0 0 0 1px rgba(10, 10, 10, 0.1);
+ box-shadow: 0 2px 3px rgba(10, 10, 10, 0.1), 0 0 0 1px rgba(10, 10, 10, 0.1);
+ color: #4a4a4a;
+ display: block;
+ line-height: 1.375;
+ margin-top: 15px;
+ min-height: 70px;
+ padding: 15px;
+ padding-left: 70px;
+ position: relative;
+}
+
+#_default_ > a:hover, #_default_ > a:focus {
+ -webkit-box-shadow: 0 2px 3px rgba(10, 10, 10, 0.1), 0 0 0 1px #00d1b2;
+ box-shadow: 0 2px 3px rgba(10, 10, 10, 0.1), 0 0 0 1px #00d1b2;
+}
+
+#_default_ > a:active {
+ -webkit-box-shadow: inset 0 1px 2px rgba(10, 10, 10, 0.2), 0 0 0 1px #00d1b2;
+ box-shadow: inset 0 1px 2px rgba(10, 10, 10, 0.2), 0 0 0 1px #00d1b2;
+}
+
+#_default_ > a span {
+ display: block;
+}
+
+#_default_ > a .default-image {
+ display: block;
+ left: 15px;
+ height: 40px;
+ position: absolute;
+ top: 15px;
+ width: 40px;
+}
+
+#_default_ > a .default-image img {
+ display: block;
+ height: 40px;
+ width: 40px;
+}
+
+#_default_ > a .default-title {
+ color: #363636;
+ display: inline;
+ font-weight: 700;
+}
+
+#_default_ > a .default-title:after {
+ content: " — ";
+}
+
+#_default_ > a .default-description {
+ display: inline;
+}
+
+@media screen and (min-width: 769px), print {
+ .bsa .columns {
+ min-height: 120px;
+ }
+ #_default_ {
+ display: -webkit-box;
+ display: -ms-flexbox;
+ display: flex;
+ -webkit-box-pack: center;
+ -ms-flex-pack: center;
+ justify-content: center;
+ position: relative;
+ }
+ #_default_ .default-ad {
+ left: 100%;
+ margin-left: 2rem;
+ position: absolute;
+ top: 0;
+ }
+ #_default_ > a {
+ margin: 0;
+ }
+ #_default_ > a:not(:nth-child(2)) {
+ margin-left: 2rem;
+ }
+}
+
+html.route-index .title.is-2 {
+ position: relative;
+}
+
+html.route-index .title.is-2 a {
+ color: #242424;
+ padding-left: 48px;
+ position: relative;
+}
+
+html.route-index .title.is-2 a:hover {
+ color: #00d1b2;
+}
+
+html.route-index .title.is-2 .icon.is-medium {
+ left: 8px;
+ position: absolute;
+ top: 10px;
+}
+
+html.route-index .hero .title.is-2 a {
+ color: white;
+}
+
+html.route-index .hero .title.is-2 a:hover {
+ color: white;
+}
+
+html.route-index .hero.is-primary a.column,
+html.route-index .hero.is-primary a.column:hover {
+ color: white;
+}
+
+html.route-index .hero.is-primary a.column:hover .title strong {
+ border-bottom: 1px solid;
+}
+
+@media screen and (max-width: 979px) {
+ html.route-index .title.is-2 a {
+ padding-left: 0;
+ }
+ html.route-index .title.is-2 .icon.is-medium {
+ display: none;
+ }
+}
+
+:root {
+ --primary: #00d1b2;
+ --gap: 0.75rem;
+}
+
+html ::-moz-selection {
+ background: #00d1b2;
+ color: #fff;
+}
+
+html ::selection {
+ background: #00d1b2;
+ color: #fff;
+}
+
+/*# sourceMappingURL=data:application/json;base64,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QUNFLG1CQUFtQjtFQUNuQixlQUFlO0NBQ2hCOztBQUVEO0VBQ0Usb0JBQW9CO0VBQ3BCLFlBQVk7Q0FDYjs7QUFFRDtFQUNFLG9CQUFvQjtFQUNwQixZQUFZO0NBQ2IiLCJmaWxlIjoiYnVsbWEtZG9jcy5jc3MiLCJzb3VyY2VzQ29udGVudCI6WyJAY2hhcnNldCBcIlVURi04XCI7XG4vKiEgYnVsbWEuaW8gdjAuNC40IHwgTUlUIExpY2Vuc2UgfCBnaXRodWIuY29tL2pndGhtcy9idWxtYSAqL1xuQGtleWZyYW1lcyBzcGluQXJvdW5kIHtcbiAgZnJvbSB7XG4gICAgdHJhbnNmb3JtOiByb3RhdGUoMGRlZyk7XG4gIH1cbiAgdG8ge1xuICAgIHRyYW5zZm9ybTogcm90YXRlKDM1OWRlZyk7XG4gIH1cbn1cblxuLyohIG1pbmlyZXNldC5jc3MgdjAuMC4yIHwgTUlUIExpY2Vuc2UgfCBnaXRodWIuY29tL2pndGhtcy9taW5pcmVzZXQuY3NzICovXG5odG1sLFxuYm9keSxcbnAsXG5vbCxcbnVsLFxubGksXG5kbCxcbmR0LFxuZGQsXG5ibG9ja3F1b3RlLFxuZmlndXJlLFxuZmllbGRzZXQsXG5sZWdlbmQsXG50ZXh0YXJlYSxcbnByZSxcbmlmcmFtZSxcbmhyLFxuaDEsXG5oMixcbmgzLFxuaDQsXG5oNSxcbmg2IHtcbiAgbWFyZ2luOiAwO1xuICBwYWRkaW5nOiAwO1xufVxuXG5oMSxcbmgyLFxuaDMsXG5oNCxcbmg1LFxuaDYge1xuICBmb250LXNpemU6IDEwMCU7XG4gIGZvbnQtd2VpZ2h0OiBub3JtYWw7XG59XG5cbnVsIHtcbiAgbGlzdC1zdHlsZTogbm9uZTtcbn1cblxuYnV0dG9uLFxuaW5wdXQsXG5zZWxlY3QsXG50ZXh0YXJlYSB7XG4gIG1hcmdpbjogMDtcbn1cblxuaHRtbCB7XG4gIGJveC1zaXppbmc6IGJvcmRlci1ib3g7XG59XG5cbioge1xuICBib3gtc2l6aW5nOiBpbmhlcml0O1xufVxuXG4qOmJlZm9yZSwgKjphZnRlciB7XG4gIGJveC1zaXppbmc6IGluaGVyaXQ7XG59XG5cbmltZyxcbmVtYmVkLFxub2JqZWN0LFxuYXVkaW8sXG52aWRlbyB7XG4gIG1heC13aWR0aDogMTAwJTtcbn1cblxuaWZyYW1lIHtcbiAgYm9yZGVyOiAwO1xufVxuXG50YWJsZSB7XG4gIGJvcmRlci1jb2xsYXBzZTogY29sbGFwc2U7XG4gIGJvcmRlci1zcGFjaW5nOiAwO1xufVxuXG50ZCxcbnRoIHtcbiAgcGFkZGluZzogMDtcbiAgdGV4dC1hbGlnbjogbGVmdDtcbn1cblxuaHRtbCB7XG4gIGJhY2tncm91bmQtY29sb3I6ICNmZmY7XG4gIGZvbnQtc2l6ZTogMTZweDtcbiAgLW1vei1vc3gtZm9udC1zbW9vdGhpbmc6IGdyYXlzY2FsZTtcbiAgLXdlYmtpdC1mb250LXNtb290aGluZzogYW50aWFsaWFzZWQ7XG4gIG1pbi13aWR0aDogMzAwcHg7XG4gIG92ZXJmbG93LXg6IGhpZGRlbjtcbiAgb3ZlcmZsb3cteTogc2Nyb2xsO1xuICB0ZXh0LXJlbmRlcmluZzogb3B0aW1pemVMZWdpYmlsaXR5O1xufVxuXG5hcnRpY2xlLFxuYXNpZGUsXG5maWd1cmUsXG5mb290ZXIsXG5oZWFkZXIsXG5oZ3JvdXAsXG5zZWN0aW9uIHtcbiAgZGlzcGxheTogYmxvY2s7XG59XG5cbmJvZHksXG5idXR0b24sXG5pbnB1dCxcbnNlbGVjdCxcbnRleHRhcmVhIHtcbiAgZm9udC1mYW1pbHk6IEJsaW5rTWFjU3lzdGVtRm9udCwgLWFwcGxlLXN5c3RlbSwgXCJTZWdvZSBVSVwiLCBcIlJvYm90b1wiLCBcIk94eWdlblwiLCBcIlVidW50dVwiLCBcIkNhbnRhcmVsbFwiLCBcIkZpcmEgU2Fuc1wiLCBcIkRyb2lkIFNhbnNcIiwgXCJIZWx2ZXRpY2EgTmV1ZVwiLCBcIkhlbHZldGljYVwiLCBcIkFyaWFsXCIsIHNhbnMtc2VyaWY7XG59XG5cbmNvZGUsXG5wcmUge1xuICAtbW96LW9zeC1mb250LXNtb290aGluZzogYXV0bztcbiAgLXdlYmtpdC1mb250LXNtb290aGluZzogYXV0bztcbiAgZm9udC1mYW1pbHk6IG1vbm9zcGFjZTtcbn1cblxuYm9keSB7XG4gIGNvbG9yOiAjNGE0YTRhO1xuICBmb250LXNpemU6IDFyZW07XG4gIGZvbnQtd2VpZ2h0OiA0MDA7XG4gIGxpbmUtaGVpZ2h0OiAxLjU7XG59XG5cbmEge1xuICBjb2xvcjogIzAwZDFiMjtcbiAgY3Vyc29yOiBwb2ludGVyO1xuICB0ZXh0LWRlY29yYXRpb246IG5vbmU7XG4gIHRyYW5zaXRpb246IG5vbmUgODZtcyBlYXNlLW91dDtcbn1cblxuYTpob3ZlciB7XG4gIGNvbG9yOiAjMzYzNjM2O1xufVxuXG5jb2RlIHtcbiAgYmFja2dyb3VuZC1jb2xvcjogd2hpdGVzbW9rZTtcbiAgY29sb3I6ICNmZjM4NjA7XG4gIGZvbnQtc2l6ZTogMC44ZW07XG4gIGZvbnQtd2VpZ2h0OiBub3JtYWw7XG4gIHBhZGRpbmc6IDAuMjVlbSAwLjVlbSAwLjI1ZW07XG59XG5cbmhyIHtcbiAgYmFja2dyb3VuZC1jb2xvcjogI2RiZGJkYjtcbiAgYm9yZGVyOiBub25lO1xuICBkaXNwbGF5OiBibG9jaztcbiAgaGVpZ2h0OiAxcHg7XG4gIG1hcmdpbjogMS41cmVtIDA7XG59XG5cbmltZyB7XG4gIGhlaWdodDogYXV0bztcbiAgbWF4LXdpZHRoOiAxMDAlO1xufVxuXG5pbnB1dFt0eXBlPVwiY2hlY2tib3hcIl0sXG5pbnB1dFt0eXBlPVwicmFkaW9cIl0ge1xuICB2ZXJ0aWNhbC1hbGlnbjogYmFzZWxpbmU7XG59XG5cbnNtYWxsIHtcbiAgZm9udC1zaXplOiAwLjg3NWVtO1xufVxuXG5zcGFuIHtcbiAgZm9udC1zdHlsZTogaW5oZXJpdDtcbiAgZm9udC13ZWlnaHQ6IGluaGVyaXQ7XG59XG5cbnN0cm9uZyB7XG4gIGNvbG9yOiAjMzYzNjM2O1xuICBmb250LXdlaWdodDogNzAwO1xufVxuXG5wcmUge1xuICBiYWNrZ3JvdW5kLWNvbG9yOiB3aGl0ZXNtb2tlO1xuICBjb2xvcjogIzRhNGE0YTtcbiAgZm9udC1zaXplOiAwLjhlbTtcbiAgd2hpdGUtc3BhY2U6IHByZTtcbiAgd29yZC13cmFwOiBub3JtYWw7XG59XG5cbnByZSBjb2RlIHtcbiAgLXdlYmtpdC1vdmVyZmxvdy1zY3JvbGxpbmc6IHRvdWNoO1xuICBiYWNrZ3JvdW5kOiBub25lO1xuICBjb2xvcjogaW5oZXJpdDtcbiAgZGlzcGxheTogYmxvY2s7XG4gIGZvbnQtc2l6ZTogMWVtO1xuICBvdmVyZmxvdy14OiBhdXRvO1xuICBwYWRkaW5nOiAxLjI1cmVtIDEuNXJlbTtcbn1cblxudGFibGUge1xuICB3aWR0aDogMTAwJTtcbn1cblxudGFibGUgdGQsXG50YWJsZSB0aCB7XG4gIHRleHQtYWxpZ246IGxlZnQ7XG4gIHZlcnRpY2FsLWFsaWduOiB0b3A7XG59XG5cbnRhYmxlIHRoIHtcbiAgY29sb3I6ICMzNjM2MzY7XG59XG5cbi5pcy1ibG9jayB7XG4gIGRpc3BsYXk6IGJsb2NrO1xufVxuXG5AbWVkaWEgc2NyZWVuIGFuZCAobWF4LXdpZHRoOiA3NjhweCkge1xuICAuaXMtYmxvY2stbW9iaWxlIHtcbiAgICBkaXNwbGF5OiBibG9jayAhaW1wb3J0YW50O1xuICB9XG59XG5cbkBtZWRpYSBzY3JlZW4gYW5kIChtaW4td2lkdGg6IDc2OXB4KSwgcHJpbnQge1xuICAuaXMtYmxvY2stdGFibGV0IHtcbiAgICBkaXNwbGF5OiBibG9jayAhaW1wb3J0YW50O1xuICB9XG59XG5cbkBtZWRpYSBzY3JlZW4gYW5kIChtaW4td2lkdGg6IDc2OXB4KSBhbmQgKG1heC13aWR0aDogMTAwN3B4KSB7XG4gIC5pcy1ibG9jay10YWJsZXQtb25seSB7XG4gICAgZGlzcGxheTogYmxvY2sgIWltcG9ydGFudDtcbiAgfVxufVxuXG5AbWVkaWEgc2NyZWVuIGFuZCAobWF4LXdpZHRoOiAxMDA3cHgpIHtcbiAgLmlzLWJsb2NrLXRvdWNoIHtcbiAgICBkaXNwbGF5OiBibG9jayAhaW1wb3J0YW50O1xuICB9XG59XG5cbkBtZWRpYSBzY3JlZW4gYW5kIChtaW4td2lkdGg6IDEwMDhweCkge1xuICAuaXMtYmxvY2stZGVza3RvcCB7XG4gICAgZGlzcGxheTogYmxvY2sgIWltcG9ydGFudDtcbiAgfVxufVxuXG5AbWVkaWEgc2NyZWVuIGFuZCAobWluLXdpZHRoOiAxMDA4cHgpIGFuZCAobWF4LXdpZHRoOiAxMTk5cHgpIHtcbiAgLmlzLWJsb2NrLWRlc2t0b3Atb25seSB7XG4gICAgZGlzcGxheTogYmxvY2sgIWltcG9ydGFudDtcbiAgfVxufVxuXG5AbWVkaWEgc2NyZWVuIGFuZCAobWluLXdpZHRoOiAxMjAwcHgpIHtcbiAgLmlzLWJsb2NrLXdpZGVzY3JlZW4ge1xuICAgIGRpc3BsYXk6IGJsb2NrICFpbXBvcnRhbnQ7XG4gIH1cbn1cblxuLmlzLWZsZXgge1xuICBkaXNwbGF5OiBmbGV4O1xufVxuXG5AbWVkaWEgc2NyZWVuIGFuZCAobWF4LXdpZHRoOiA3NjhweCkge1xuICAuaXMtZmxleC1tb2JpbGUge1xuICAgIGRpc3BsYXk6IGZsZXggIWltcG9ydGFudDtcbiAgfVxufVxuXG5AbWVkaWEgc2NyZWVuIGFuZCAobWluLXdpZHRoOiA3NjlweCksIHByaW50IHtcbiAgLmlzLWZsZXgtdGFibGV0IHtcbiAgICBkaXNwbGF5OiBmbGV4ICFpbXBvcnRhbnQ7XG4gIH1cbn1cblxuQG1lZGlhIHNjcmVlbiBhbmQgKG1pbi13aWR0aDogNzY5cHgpIGFuZCAobWF4LXdpZHRoOiAxMDA3cHgpIHtcbiAgLmlzLWZsZXgtdGFibGV0LW9ubHkge1xuICAgIGRpc3BsYXk6IGZsZXggIWltcG9ydGFudDtcbiAgfVxufVxuXG5AbWVkaWEgc2NyZWVuIGFuZCAobWF4LXdpZHRoOiAxMDA3cHgpIHtcbiAgLmlzLWZsZXgtdG91Y2gge1xuICAgIGRpc3BsYXk6IGZsZXggIWltcG9ydGFudDtcbiAgfVxufVxuXG5AbWVkaWEgc2NyZWVuIGFuZCAobWluLXdpZHRoOiAxMDA4cHgpIHtcbiAgLmlzLWZsZXgtZGVza3RvcCB7XG4gICAgZGlzcGxheTogZmxleCAhaW1wb3J0YW50O1xuICB9XG59XG5cbkBtZWRpYSBzY3JlZW4gYW5kIChtaW4td2lkdGg6IDEwMDhweCkgYW5kIChtYXgtd2lkdGg6IDExOTlweCkge1xuICAuaXMtZmxleC1kZXNrdG9wLW9ubHkge1xuICAgIGRpc3BsYXk6IGZsZXggIWltcG9ydGFudDtcbiAgfVxufVxuXG5AbWVkaWEgc2NyZWVuIGFuZCAobWluLXdpZHRoOiAxMjAwcHgpIHtcbiAgLmlzLWZsZXgtd2lkZXNjcmVlbiB7XG4gICAgZGlzcGxheTogZmxleCAhaW1wb3J0YW50O1xuICB9XG59XG5cbi5pcy1pbmxpbmUge1xuICBkaXNwbGF5OiBpbmxpbmU7XG59XG5cbkBtZWRpYSBzY3JlZW4gYW5kIChtYXgtd2lkdGg6IDc2OHB4KSB7XG4gIC5pcy1pbmxpbmUtbW9iaWxlIHtcbiAgICBkaXNwbGF5OiBpbmxpbmUgIWltcG9ydGFudDtcbiAgfVxufVxuXG5AbWVkaWEgc2NyZWVuIGFuZCAobWluLXdpZHRoOiA3NjlweCksIHByaW50IHtcbiAgLmlzLWlubGluZS10YWJsZXQge1xuICAgIGRpc3BsYXk6IGlubGluZSAhaW1wb3J0YW50O1xuICB9XG59XG5cbkBtZWRpYSBzY3JlZW4gYW5kIChtaW4td2lkdGg6IDc2OXB4KSBhbmQgKG1heC13aWR0aDogMTAwN3B4KSB7XG4gIC5pcy1pbmxpbmUtdGFibGV0LW9ubHkge1xuICAgIGRpc3BsYXk6IGlubGluZSAhaW1wb3J0YW50O1xuICB9XG59XG5cbkBtZWRpYSBzY3JlZW4gYW5kIChtYXgtd2lkdGg6IDEwMDdweCkge1xuICAuaXMtaW5saW5lLXRvdWNoIHtcbiAgICBkaXNwbGF5OiBpbmxpbmUgIWltcG9ydGFudDtcbiAgfVxufVxuXG5AbWVkaWEgc2NyZWVuIGFuZCAobWluLXdpZHRoOiAxMDA4cHgpIHtcbiAgLmlzLWlubGluZS1kZXNrdG9wIHtcbiAgICBkaXNwbGF5OiBpbmxpbmUgIWltcG9ydGFudDtcbiAgfVxufVxuXG5AbWVkaWEgc2NyZWVuIGFuZCAobWluLXdpZHRoOiAxMDA4cHgpIGFuZCAobWF4LXdpZHRoOiAxMTk5cHgpIHtcbiAgLmlzLWlubGluZS1kZXNrdG9wLW9ubHkge1xuICAgIGRpc3BsYXk6IGlubGluZSAhaW1wb3J0YW50O1xuICB9XG59XG5cbkBtZWRpYSBzY3JlZW4gYW5kIChtaW4td2lkdGg6IDEyMDBweCkge1xuICAuaXMtaW5saW5lLXdpZGVzY3JlZW4ge1xuICAgIGRpc3BsYXk6IGlubGluZSAhaW1wb3J0YW50O1xuICB9XG59XG5cbi5pcy1pbmxpbmUtYmxvY2sge1xuICBkaXNwbGF5OiBpbmxpbmUtYmxvY2s7XG59XG5cbkBtZWRpYSBzY3JlZW4gYW5kIChtYXgtd2lkdGg6IDc2OHB4KSB7XG4gIC5pcy1pbmxpbmUtYmxvY2stbW9iaWxlIHtcbiAgICBkaXNwbGF5OiBpbmxpbmUtYmxvY2sgIWltcG9ydGFudDtcbiAgfVxufVxuXG5AbWVkaWEgc2NyZWVuIGFuZCAobWluLXdpZHRoOiA3NjlweCksIHByaW50IHtcbiAgLmlzLWlubGluZS1ibG9jay10YWJsZXQge1xuICAgIGRpc3BsYXk6IGlubGluZS1ibG9jayAhaW1wb3J0YW50O1xuICB9XG59XG5cbkBtZWRpYSBzY3JlZW4gYW5kIChtaW4td2lkdGg6IDc2OXB4KSBhbmQgKG1heC13aWR0aDogMTAwN3B4KSB7XG4gIC5pcy1pbmxpbmUtYmxvY2stdGFibGV0LW9ubHkge1xuICAgIGRpc3BsYXk6IGlubGluZS1ibG9jayAhaW1wb3J0YW50O1xuICB9XG59XG5cbkBtZWRpYSBzY3JlZW4gYW5kIChtYXgtd2lkdGg6IDEwMDdweCkge1xuICAuaXMtaW5saW5lLWJsb2NrLXRvdWNoIHtcbiAgICBkaXNwbGF5OiBpbmxpbmUtYmxvY2sgIWltcG9ydGFudDtcbiAgfVxufVxuXG5AbWVkaWEgc2NyZWVuIGFuZCAobWluLXdpZHRoOiAxMDA4cHgpIHtcbiAgLmlzLWlubGluZS1ibG9jay1kZXNrdG9wIHtcbiAgICBkaXNwbGF5OiBpbmxpbmUtYmxvY2sgIWltcG9ydGFudDtcbiAgfVxufVxuXG5AbWVkaWEgc2NyZWVuIGFuZCAobWluLXdpZHRoOiAxMDA4cHgpIGFuZCAobWF4LXdpZHRoOiAxMTk5cHgpIHtcbiAgLmlzLWlubGluZS1ibG9jay1kZXNrdG9wLW9ubHkge1xuICAgIGRpc3BsYXk6IGlubGluZS1ibG9jayAhaW1wb3J0YW50O1xuICB9XG59XG5cbkBtZWRpYSBzY3JlZW4gYW5kIChtaW4td2lkdGg6IDEyMDBweCkge1xuICAuaXMtaW5saW5lLWJsb2NrLXdpZGVzY3JlZW4ge1xuICAgIGRpc3BsYXk6IGlubGluZS1ibG9jayAhaW1wb3J0YW50O1xuICB9XG59XG5cbi5pcy1pbmxpbmUtZmxleCB7XG4gIGRpc3BsYXk6IGlubGluZS1mbGV4O1xufVxuXG5AbWVkaWEgc2NyZWVuIGFuZCAobWF4LXdpZHRoOiA3NjhweCkge1xuICAuaXMtaW5saW5lLWZsZXgtbW9iaWxlIHtcbiAgICBkaXNwbGF5OiBpbmxpbmUtZmxleCAhaW1wb3J0YW50O1xuICB9XG59XG5cbkBtZWRpYSBzY3JlZW4gYW5kIChtaW4td2lkdGg6IDc2OXB4KSwgcHJpbnQge1xuICAuaXMtaW5saW5lLWZsZXgtdGFibGV0IHtcbiAgICBkaXNwbGF5OiBpbmxpbmUtZmxleCAhaW1wb3J0YW50O1xuICB9XG59XG5cbkBtZWRpYSBzY3JlZW4gYW5kIChtaW4td2lkdGg6IDc2OXB4KSBhbmQgKG1heC13aWR0aDogMTAwN3B4KSB7XG4gIC5pcy1pbmxpbmUtZmxleC10YWJsZXQtb25seSB7XG4gICAgZGlzcGxheTogaW5saW5lLWZsZXggIWltcG9ydGFudDtcbiAgfVxufVxuXG5AbWVkaWEgc2NyZWVuIGFuZCAobWF4LXdpZHRoOiAxMDA3cHgpIHtcbiAgLmlzLWlubGluZS1mbGV4LXRvdWNoIHtcbiAgICBkaXNwbGF5OiBpbmxpbmUtZmxleCAhaW1wb3J0YW50O1xuICB9XG59XG5cbkBtZWRpYSBzY3JlZW4gYW5kIChtaW4td2lkdGg6IDEwMDhweCkge1xuICAuaXMtaW5saW5lLWZsZXgtZGVza3RvcCB7XG4gICAgZGlzcGxheTogaW5saW5lLWZsZXggIWltcG9ydGFudDtcbiAgfVxufVxuXG5AbWVkaWEgc2NyZWVuIGFuZCAobWluLXdpZHRoOiAxMDA4cHgpIGFuZCAobWF4LXdpZHRoOiAxMTk5cHgpIHtcbiAgLmlzLWlubGluZS1mbGV4LWRlc2t0b3Atb25seSB7XG4gICAgZGlzcGxheTogaW5saW5lLWZsZXggIWltcG9ydGFudDtcbiAgfVxufVxuXG5AbWVkaWEgc2NyZWVuIGFuZCAobWluLXdpZHRoOiAxMjAwcHgpIHtcbiAgLmlzLWlubGluZS1mbGV4LXdpZGVzY3JlZW4ge1xuICAgIGRpc3BsYXk6IGlubGluZS1mbGV4ICFpbXBvcnRhbnQ7XG4gIH1cbn1cblxuLmlzLWNsZWFyZml4OmFmdGVyIHtcbiAgY2xlYXI6IGJvdGg7XG4gIGNvbnRlbnQ6IFwiIFwiO1xuICBkaXNwbGF5OiB0YWJsZTtcbn1cblxuLmlzLXB1bGxlZC1sZWZ0IHtcbiAgZmxvYXQ6IGxlZnQgIWltcG9ydGFudDtcbn1cblxuLmlzLXB1bGxlZC1yaWdodCB7XG4gIGZsb2F0OiByaWdodCAhaW1wb3J0YW50O1xufVxuXG4uaXMtY2xpcHBlZCB7XG4gIG92ZXJmbG93OiBoaWRkZW4gIWltcG9ydGFudDtcbn1cblxuLmlzLW92ZXJsYXkge1xuICBib3R0b206IDA7XG4gIGxlZnQ6IDA7XG4gIHBvc2l0aW9uOiBhYnNvbHV0ZTtcbiAgcmlnaHQ6IDA7XG4gIHRvcDogMDtcbn1cblxuLmlzLXNpemUtMSB7XG4gIGZvbnQtc2l6ZTogM3JlbTtcbn1cblxuQG1lZGlhIHNjcmVlbiBhbmQgKG1heC13aWR0aDogNzY4cHgpIHtcbiAgLmlzLXNpemUtMS1tb2JpbGUge1xuICAgIGZvbnQtc2l6ZTogM3JlbTtcbiAgfVxufVxuXG5AbWVkaWEgc2NyZWVuIGFuZCAobWluLXdpZHRoOiA3NjlweCksIHByaW50IHtcbiAgLmlzLXNpemUtMS10YWJsZXQge1xuICAgIGZvbnQtc2l6ZTogM3JlbTtcbiAgfVxufVxuXG5AbWVkaWEgc2NyZWVuIGFuZCAobWF4LXdpZHRoOiAxMDA3cHgpIHtcbiAgLmlzLXNpemUtMS10b3VjaCB7XG4gICAgZm9udC1zaXplOiAzcmVtO1xuICB9XG59XG5cbkBtZWRpYSBzY3JlZW4gYW5kIChtaW4td2lkdGg6IDEwMDhweCkge1xuICAuaXMtc2l6ZS0xLWRlc2t0b3Age1xuICAgIGZvbnQtc2l6ZTogM3JlbTtcbiAgfVxufVxuXG5AbWVkaWEgc2NyZWVuIGFuZCAobWluLXdpZHRoOiAxMjAwcHgpIHtcbiAgLmlzLXNpemUtMS13aWRlc2NyZWVuIHtcbiAgICBmb250LXNpemU6IDNyZW07XG4gIH1cbn1cblxuQG1lZGlhIHNjcmVlbiBhbmQgKG1pbi13aWR0aDogMTM5MnB4KSB7XG4gIC5pcy1zaXplLTEtZnVsbGhkIHtcbiAgICBmb250LXNpemU6IDNyZW07XG4gIH1cbn1cblxuLmlzLXNpemUtMiB7XG4gIGZvbnQtc2l6ZTogMi41cmVtO1xufVxuXG5AbWVkaWEgc2NyZWVuIGFuZCAobWF4LXdpZHRoOiA3NjhweCkge1xuICAuaXMtc2l6ZS0yLW1vYmlsZSB7XG4gICAgZm9udC1zaXplOiAyLjVyZW07XG4gIH1cbn1cblxuQG1lZGlhIHNjcmVlbiBhbmQgKG1pbi13aWR0aDogNzY5cHgpLCBwcmludCB7XG4gIC5pcy1zaXplLTItdGFibGV0IHtcbiAgICBmb250LXNpemU6IDIuNXJlbTtcbiAgfVxufVxuXG5AbWVkaWEgc2NyZWVuIGFuZCAobWF4LXdpZHRoOiAxMDA3cHgpIHtcbiAgLmlzLXNpemUtMi10b3VjaCB7XG4gICAgZm9udC1zaXplOiAyLjVyZW07XG4gIH1cbn1cblxuQG1lZGlhIHNjcmVlbiBhbmQgKG1pbi13aWR0aDogMTAwOHB4KSB7XG4gIC5pcy1zaXplLTItZGVza3RvcCB7XG4gICAgZm9udC1zaXplOiAyLjVyZW07XG4gIH1cbn1cblxuQG1lZGlhIHNjcmVlbiBhbmQgKG1pbi13aWR0aDogMTIwMHB4KSB7XG4gIC5pcy1zaXplLTItd2lkZXNjcmVlbiB7XG4gICAgZm9udC1zaXplOiAyLjVyZW07XG4gIH1cbn1cblxuQG1lZGlhIHNjcmVlbiBhbmQgKG1pbi13aWR0aDogMTM5MnB4KSB7XG4gIC5pcy1zaXplLTItZnVsbGhkIHtcbiAgICBmb250LXNpemU6IDIuNXJlbTtcbiAgfVxufVxuXG4uaXMtc2l6ZS0zIHtcbiAgZm9udC1zaXplOiAycmVtO1xufVxuXG5AbWVkaWEgc2NyZWVuIGFuZCAobWF4LXdpZHRoOiA3NjhweCkge1xuICAuaXMtc2l6ZS0zLW1vYmlsZSB7XG4gICAgZm9udC1zaXplOiAycmVtO1xuICB9XG59XG5cbkBtZWRpYSBzY3JlZW4gYW5kIChtaW4td2lkdGg6IDc2OXB4KSwgcHJpbnQge1xuICAuaXMtc2l6ZS0zLXRhYmxldCB7XG4gICAgZm9udC1zaXplOiAycmVtO1xuICB9XG59XG5cbkBtZWRpYSBzY3JlZW4gYW5kIChtYXgtd2lkdGg6IDEwMDdweCkge1xuICAuaXMtc2l6ZS0zLXRvdWNoIHtcbiAgICBmb250LXNpemU6IDJyZW07XG4gIH1cbn1cblxuQG1lZGlhIHNjcmVlbiBhbmQgKG1pbi13aWR0aDogMTAwOHB4KSB7XG4gIC5pcy1zaXplLTMtZGVza3RvcCB7XG4gICAgZm9udC1zaXplOiAycmVtO1xuICB9XG59XG5cbkBtZWRpYSBzY3JlZW4gYW5kIChtaW4td2lkdGg6IDEyMDBweCkge1xuICAuaXMtc2l6ZS0zLXdpZGVzY3JlZW4ge1xuICAgIGZvbnQtc2l6ZTogMnJlbTtcbiAgfVxufVxuXG5AbWVkaWEgc2NyZWVuIGFuZCAobWluLXdpZHRoOiAxMzkycHgpIHtcbiAgLmlzLXNpemUtMy1mdWxsaGQge1xuICAgIGZvbnQtc2l6ZTogMnJlbTtcbiAgfVxufVxuXG4uaXMtc2l6ZS00IHtcbiAgZm9udC1zaXplOiAxLjVyZW07XG59XG5cbkBtZWRpYSBzY3JlZW4gYW5kIChtYXgtd2lkdGg6IDc2OHB4KSB7XG4gIC5pcy1zaXplLTQtbW9iaWxlIHtcbiAgICBmb250LXNpemU6IDEuNXJlbTtcbiAgfVxufVxuXG5AbWVkaWEgc2NyZWVuIGFuZCAobWluLXdpZHRoOiA3NjlweCksIHByaW50IHtcbiAgLmlzLXNpemUtNC10YWJsZXQge1xuICAgIGZvbnQtc2l6ZTogMS41cmVtO1xuICB9XG59XG5cbkBtZWRpYSBzY3JlZW4gYW5kIChtYXgtd2lkdGg6IDEwMDdweCkge1xuICAuaXMtc2l6ZS00LXRvdWNoIHtcbiAgICBmb250LXNpemU6IDEuNXJlbTtcbiAgfVxufVxuXG5AbWVkaWEgc2NyZWVuIGFuZCAobWluLXdpZHRoOiAxMDA4cHgpIHtcbiAgLmlzLXNpemUtNC1kZXNrdG9wIHtcbiAgICBmb250LXNpemU6IDEuNXJlbTtcbiAgfVxufVxuXG5AbWVkaWEgc2NyZWVuIGFuZCAobWluLXdpZHRoOiAxMjAwcHgpIHtcbiAgLmlzLXNpemUtNC13aWRlc2NyZWVuIHtcbiAgICBmb250LXNpemU6IDEuNXJlbTtcbiAgfVxufVxuXG5AbWVkaWEgc2NyZWVuIGFuZCAobWluLXdpZHRoOiAxMzkycHgpIHtcbiAgLmlzLXNpemUtNC1mdWxsaGQge1xuICAgIGZvbnQtc2l6ZTogMS41cmVtO1xuICB9XG59XG5cbi5pcy1zaXplLTUge1xuICBmb250LXNpemU6IDEuMjVyZW07XG59XG5cbkBtZWRpYSBzY3JlZW4gYW5kIChtYXgtd2lkdGg6IDc2OHB4KSB7XG4gIC5pcy1zaXplLTUtbW9iaWxlIHtcbiAgICBmb250LXNpemU6IDEuMjVyZW07XG4gIH1cbn1cblxuQG1lZGlhIHNjcmVlbiBhbmQgKG1pbi13aWR0aDogNzY5cHgpLCBwcmludCB7XG4gIC5pcy1zaXplLTUtdGFibGV0IHtcbiAgICBmb250LXNpemU6IDEuMjVyZW07XG4gIH1cbn1cblxuQG1lZGlhIHNjcmVlbiBhbmQgKG1heC13aWR0aDogMTAwN3B4KSB7XG4gIC5pcy1zaXplLTUtdG91Y2gge1xuICAgIGZvbnQtc2l6ZTogMS4yNXJlbTtcbiAgfVxufVxuXG5AbWVkaWEgc2NyZWVuIGFuZCAobWluLXdpZHRoOiAxMDA4cHgpIHtcbiAgLmlzLXNpemUtNS1kZXNrdG9wIHtcbiAgICBmb250LXNpemU6IDEuMjVyZW07XG4gIH1cbn1cblxuQG1lZGlhIHNjcmVlbiBhbmQgKG1pbi13aWR0aDogMTIwMHB4KSB7XG4gIC5pcy1zaXplLTUtd2lkZXNjcmVlbiB7XG4gICAgZm9udC1zaXplOiAxLjI1cmVtO1xuICB9XG59XG5cbkBtZWRpYSBzY3JlZW4gYW5kIChtaW4td2lkdGg6IDEzOTJweCkge1xuICAuaXMtc2l6ZS01LWZ1bGxoZCB7XG4gICAgZm9udC1zaXplOiAxLjI1cmVtO1xuICB9XG59XG5cbi5pcy1zaXplLTYge1xuICBmb250LXNpemU6IDFyZW07XG59XG5cbkBtZWRpYSBzY3JlZW4gYW5kIChtYXgtd2lkdGg6IDc2OHB4KSB7XG4gIC5pcy1zaXplLTYtbW9iaWxlIHtcbiAgICBmb250LXNpemU6IDFyZW07XG4gIH1cbn1cblxuQG1lZGlhIHNjcmVlbiBhbmQgKG1pbi13aWR0aDogNzY5cHgpLCBwcmludCB7XG4gIC5pcy1zaXplLTYtdGFibGV0IHtcbiAgICBmb250LXNpemU6IDFyZW07XG4gIH1cbn1cblxuQG1lZGlhIHNjcmVlbiBhbmQgKG1heC13aWR0aDogMTAwN3B4KSB7XG4gIC5pcy1zaXplLTYtdG91Y2gge1xuICAgIGZvbnQtc2l6ZTogMXJlbTtcbiAgfVxufVxuXG5AbWVkaWEgc2NyZWVuIGFuZCAobWluLXdpZHRoOiAxMDA4cHgpIHtcbiAgLmlzLXNpemUtNi1kZXNrdG9wIHtcbiAgICBmb250LXNpemU6IDFyZW07XG4gIH1cbn1cblxuQG1lZGlhIHNjcmVlbiBhbmQgKG1pbi13aWR0aDogMTIwMHB4KSB7XG4gIC5pcy1zaXplLTYtd2lkZXNjcmVlbiB7XG4gICAgZm9udC1zaXplOiAxcmVtO1xuICB9XG59XG5cbkBtZWRpYSBzY3JlZW4gYW5kIChtaW4td2lkdGg6IDEzOTJweCkge1xuICAuaXMtc2l6ZS02LWZ1bGxoZCB7XG4gICAgZm9udC1zaXplOiAxcmVtO1xuICB9XG59XG5cbi5oYXMtdGV4dC1jZW50ZXJlZCB7XG4gIHRleHQtYWxpZ246IGNlbnRlciAhaW1wb3J0YW50O1xufVxuXG4uaGFzLXRleHQtbGVmdCB7XG4gIHRleHQtYWxpZ246IGxlZnQgIWltcG9ydGFudDtcbn1cblxuLmhhcy10ZXh0LXJpZ2h0IHtcbiAgdGV4dC1hbGlnbjogcmlnaHQgIWltcG9ydGFudDtcbn1cblxuLmhhcy10ZXh0LXdoaXRlIHtcbiAgY29sb3I6IHdoaXRlO1xufVxuXG5hLmhhcy10ZXh0LXdoaXRlOmhvdmVyLCBhLmhhcy10ZXh0LXdoaXRlOmZvY3VzIHtcbiAgY29sb3I6ICNlNmU2ZTY7XG59XG5cbi5oYXMtdGV4dC1ibGFjayB7XG4gIGNvbG9yOiAjMGEwYTBhO1xufVxuXG5hLmhhcy10ZXh0LWJsYWNrOmhvdmVyLCBhLmhhcy10ZXh0LWJsYWNrOmZvY3VzIHtcbiAgY29sb3I6IGJsYWNrO1xufVxuXG4uaGFzLXRleHQtbGlnaHQge1xuICBjb2xvcjogd2hpdGVzbW9rZTtcbn1cblxuYS5oYXMtdGV4dC1saWdodDpob3ZlciwgYS5oYXMtdGV4dC1saWdodDpmb2N1cyB7XG4gIGNvbG9yOiAjZGJkYmRiO1xufVxuXG4uaGFzLXRleHQtZGFyayB7XG4gIGNvbG9yOiAjMzYzNjM2O1xufVxuXG5hLmhhcy10ZXh0LWRhcms6aG92ZXIsIGEuaGFzLXRleHQtZGFyazpmb2N1cyB7XG4gIGNvbG9yOiAjMWMxYzFjO1xufVxuXG4uaGFzLXRleHQtcHJpbWFyeSB7XG4gIGNvbG9yOiAjMDBkMWIyO1xufVxuXG5hLmhhcy10ZXh0LXByaW1hcnk6aG92ZXIsIGEuaGFzLXRleHQtcHJpbWFyeTpmb2N1cyB7XG4gIGNvbG9yOiAjMDA5ZTg2O1xufVxuXG4uaGFzLXRleHQtaW5mbyB7XG4gIGNvbG9yOiAjMzI3M2RjO1xufVxuXG5hLmhhcy10ZXh0LWluZm86aG92ZXIsIGEuaGFzLXRleHQtaW5mbzpmb2N1cyB7XG4gIGNvbG9yOiAjMjA1YmJjO1xufVxuXG4uaGFzLXRleHQtc3VjY2VzcyB7XG4gIGNvbG9yOiAjMjNkMTYwO1xufVxuXG5hLmhhcy10ZXh0LXN1Y2Nlc3M6aG92ZXIsIGEuaGFzLXRleHQtc3VjY2Vzczpmb2N1cyB7XG4gIGNvbG9yOiAjMWNhNjRjO1xufVxuXG4uaGFzLXRleHQtd2FybmluZyB7XG4gIGNvbG9yOiAjZmZkZDU3O1xufVxuXG5hLmhhcy10ZXh0LXdhcm5pbmc6aG92ZXIsIGEuaGFzLXRleHQtd2FybmluZzpmb2N1cyB7XG4gIGNvbG9yOiAjZmZkMzI0O1xufVxuXG4uaGFzLXRleHQtZGFuZ2VyIHtcbiAgY29sb3I6ICNmZjM4NjA7XG59XG5cbmEuaGFzLXRleHQtZGFuZ2VyOmhvdmVyLCBhLmhhcy10ZXh0LWRhbmdlcjpmb2N1cyB7XG4gIGNvbG9yOiAjZmYwNTM3O1xufVxuXG4uaXMtaGlkZGVuIHtcbiAgZGlzcGxheTogbm9uZSAhaW1wb3J0YW50O1xufVxuXG5AbWVkaWEgc2NyZWVuIGFuZCAobWF4LXdpZHRoOiA3NjhweCkge1xuICAuaXMtaGlkZGVuLW1vYmlsZSB7XG4gICAgZGlzcGxheTogbm9uZSAhaW1wb3J0YW50O1xuICB9XG59XG5cbkBtZWRpYSBzY3JlZW4gYW5kIChtaW4td2lkdGg6IDc2OXB4KSwgcHJpbnQge1xuICAuaXMtaGlkZGVuLXRhYmxldCB7XG4gICAgZGlzcGxheTogbm9uZSAhaW1wb3J0YW50O1xuICB9XG59XG5cbkBtZWRpYSBzY3JlZW4gYW5kIChtaW4td2lkdGg6IDc2OXB4KSBhbmQgKG1heC13aWR0aDogMTAwN3B4KSB7XG4gIC5pcy1oaWRkZW4tdGFibGV0LW9ubHkge1xuICAgIGRpc3BsYXk6IG5vbmUgIWltcG9ydGFudDtcbiAgfVxufVxuXG5AbWVkaWEgc2NyZWVuIGFuZCAobWF4LXdpZHRoOiAxMDA3cHgpIHtcbiAgLmlzLWhpZGRlbi10b3VjaCB7XG4gICAgZGlzcGxheTogbm9uZSAhaW1wb3J0YW50O1xuICB9XG59XG5cbkBtZWRpYSBzY3JlZW4gYW5kIChtaW4td2lkdGg6IDEwMDhweCkge1xuICAuaXMtaGlkZGVuLWRlc2t0b3Age1xuICAgIGRpc3BsYXk6IG5vbmUgIWltcG9ydGFudDtcbiAgfVxufVxuXG5AbWVkaWEgc2NyZWVuIGFuZCAobWluLXdpZHRoOiAxMDA4cHgpIGFuZCAobWF4LXdpZHRoOiAxMTk5cHgpIHtcbiAgLmlzLWhpZGRlbi1kZXNrdG9wLW9ubHkge1xuICAgIGRpc3BsYXk6IG5vbmUgIWltcG9ydGFudDtcbiAgfVxufVxuXG5AbWVkaWEgc2NyZWVuIGFuZCAobWluLXdpZHRoOiAxMjAwcHgpIHtcbiAgLmlzLWhpZGRlbi13aWRlc2NyZWVuIHtcbiAgICBkaXNwbGF5OiBub25lICFpbXBvcnRhbnQ7XG4gIH1cbn1cblxuLmlzLW1hcmdpbmxlc3Mge1xuICBtYXJnaW46IDAgIWltcG9ydGFudDtcbn1cblxuLmlzLXBhZGRpbmdsZXNzIHtcbiAgcGFkZGluZzogMCAhaW1wb3J0YW50O1xufVxuXG4uaXMtdW5zZWxlY3RhYmxlIHtcbiAgLXdlYmtpdC10b3VjaC1jYWxsb3V0OiBub25lO1xuICAtd2Via2l0LXVzZXItc2VsZWN0OiBub25lO1xuICAtbW96LXVzZXItc2VsZWN0OiBub25lO1xuICAtbXMtdXNlci1zZWxlY3Q6IG5vbmU7XG4gIHVzZXItc2VsZWN0OiBub25lO1xufVxuXG4uYm94IHtcbiAgYmFja2dyb3VuZC1jb2xvcjogd2hpdGU7XG4gIGJvcmRlci1yYWRpdXM6IDVweDtcbiAgYm94LXNoYWRvdzogMCAycHggM3B4IHJnYmEoMTAsIDEwLCAxMCwgMC4xKSwgMCAwIDAgMXB4IHJnYmEoMTAsIDEwLCAxMCwgMC4xKTtcbiAgY29sb3I6ICM0YTRhNGE7XG4gIGRpc3BsYXk6IGJsb2NrO1xuICBwYWRkaW5nOiAxLjI1cmVtO1xufVxuXG4uYm94Om5vdCg6bGFzdC1jaGlsZCkge1xuICBtYXJnaW4tYm90dG9tOiAxLjVyZW07XG59XG5cbmEuYm94OmhvdmVyLCBhLmJveDpmb2N1cyB7XG4gIGJveC1zaGFkb3c6IDAgMnB4IDNweCByZ2JhKDEwLCAxMCwgMTAsIDAuMSksIDAgMCAwIDFweCAjMDBkMWIyO1xufVxuXG5hLmJveDphY3RpdmUge1xuICBib3gtc2hhZG93OiBpbnNldCAwIDFweCAycHggcmdiYSgxMCwgMTAsIDEwLCAwLjIpLCAwIDAgMCAxcHggIzAwZDFiMjtcbn1cblxuLmJ1dHRvbiB7XG4gIC1tb3otYXBwZWFyYW5jZTogbm9uZTtcbiAgLXdlYmtpdC1hcHBlYXJhbmNlOiBub25lO1xuICBhbGlnbi1pdGVtczogY2VudGVyO1xuICBib3JkZXI6IDFweCBzb2xpZCB0cmFuc3BhcmVudDtcbiAgYm9yZGVyLXJhZGl1czogM3B4O1xuICBib3gtc2hhZG93OiBub25lO1xuICBkaXNwbGF5OiBpbmxpbmUtZmxleDtcbiAgZm9udC1zaXplOiAxcmVtO1xuICBoZWlnaHQ6IDIuMjVlbTtcbiAganVzdGlmeS1jb250ZW50OiBmbGV4LXN0YXJ0O1xuICBsaW5lLWhlaWdodDogMS41O1xuICBwYWRkaW5nLWJvdHRvbTogY2FsYygwLjM3NWVtIC0gMXB4KTtcbiAgcGFkZGluZy1sZWZ0OiBjYWxjKDAuNjI1ZW0gLSAxcHgpO1xuICBwYWRkaW5nLXJpZ2h0OiBjYWxjKDAuNjI1ZW0gLSAxcHgpO1xuICBwYWRkaW5nLXRvcDogY2FsYygwLjM3NWVtIC0gMXB4KTtcbiAgcG9zaXRpb246IHJlbGF0aXZlO1xuICB2ZXJ0aWNhbC1hbGlnbjogdG9wO1xuICAtd2Via2l0LXRvdWNoLWNhbGxvdXQ6IG5vbmU7XG4gIC13ZWJraXQtdXNlci1zZWxlY3Q6IG5vbmU7XG4gIC1tb3otdXNlci1zZWxlY3Q6IG5vbmU7XG4gIC1tcy11c2VyLXNlbGVjdDogbm9uZTtcbiAgdXNlci1zZWxlY3Q6IG5vbmU7XG4gIGJhY2tncm91bmQtY29sb3I6IHdoaXRlO1xuICBib3JkZXItY29sb3I6ICNkYmRiZGI7XG4gIGNvbG9yOiAjMzYzNjM2O1xuICBjdXJzb3I6IHBvaW50ZXI7XG4gIGp1c3RpZnktY29udGVudDogY2VudGVyO1xuICBwYWRkaW5nLWxlZnQ6IDAuNzVlbTtcbiAgcGFkZGluZy1yaWdodDogMC43NWVtO1xuICB0ZXh0LWFsaWduOiBjZW50ZXI7XG4gIHdoaXRlLXNwYWNlOiBub3dyYXA7XG59XG5cbi5idXR0b246Zm9jdXMsIC5idXR0b24uaXMtZm9jdXNlZCwgLmJ1dHRvbjphY3RpdmUsIC5idXR0b24uaXMtYWN0aXZlIHtcbiAgb3V0bGluZTogbm9uZTtcbn1cblxuLmJ1dHRvbltkaXNhYmxlZF0ge1xuICBjdXJzb3I6IG5vdC1hbGxvd2VkO1xufVxuXG4uYnV0dG9uIHN0cm9uZyB7XG4gIGNvbG9yOiBpbmhlcml0O1xufVxuXG4uYnV0dG9uIC5pY29uLCAuYnV0dG9uIC5pY29uLmlzLXNtYWxsLCAuYnV0dG9uIC5pY29uLmlzLW1lZGl1bSwgLmJ1dHRvbiAuaWNvbi5pcy1sYXJnZSB7XG4gIGhlaWdodDogMS41ZW07XG4gIHdpZHRoOiAxLjVlbTtcbn1cblxuLmJ1dHRvbiAuaWNvbjpmaXJzdC1jaGlsZDpub3QoOmxhc3QtY2hpbGQpIHtcbiAgbWFyZ2luLWxlZnQ6IGNhbGMoLTAuMzc1ZW0gLSAxcHgpO1xuICBtYXJnaW4tcmlnaHQ6IDAuMTg3NWVtO1xufVxuXG4uYnV0dG9uIC5pY29uOmxhc3QtY2hpbGQ6bm90KDpmaXJzdC1jaGlsZCkge1xuICBtYXJnaW4tbGVmdDogMC4xODc1ZW07XG4gIG1hcmdpbi1yaWdodDogY2FsYygtMC4zNzVlbSAtIDFweCk7XG59XG5cbi5idXR0b24gLmljb246Zmlyc3QtY2hpbGQ6bGFzdC1jaGlsZCB7XG4gIG1hcmdpbi1sZWZ0OiBjYWxjKC0wLjM3NWVtIC0gMXB4KTtcbiAgbWFyZ2luLXJpZ2h0OiBjYWxjKC0wLjM3NWVtIC0gMXB4KTtcbn1cblxuLmJ1dHRvbjpob3ZlciwgLmJ1dHRvbi5pcy1ob3ZlcmVkIHtcbiAgYm9yZGVyLWNvbG9yOiAjYjViNWI1O1xuICBjb2xvcjogIzM2MzYzNjtcbn1cblxuLmJ1dHRvbjpmb2N1cywgLmJ1dHRvbi5pcy1mb2N1c2VkIHtcbiAgYm9yZGVyLWNvbG9yOiAjMDBkMWIyO1xuICBib3gtc2hhZG93OiAwIDAgMC41ZW0gcmdiYSgwLCAyMDksIDE3OCwgMC4yNSk7XG4gIGNvbG9yOiAjMzYzNjM2O1xufVxuXG4uYnV0dG9uOmFjdGl2ZSwgLmJ1dHRvbi5pcy1hY3RpdmUge1xuICBib3JkZXItY29sb3I6ICM0YTRhNGE7XG4gIGJveC1zaGFkb3c6IGluc2V0IDAgMXB4IDJweCByZ2JhKDEwLCAxMCwgMTAsIDAuMik7XG4gIGNvbG9yOiAjMzYzNjM2O1xufVxuXG4uYnV0dG9uLmlzLWxpbmsge1xuICBiYWNrZ3JvdW5kLWNvbG9yOiB0cmFuc3BhcmVudDtcbiAgYm9yZGVyLWNvbG9yOiB0cmFuc3BhcmVudDtcbiAgY29sb3I6ICM0YTRhNGE7XG4gIHRleHQtZGVjb3JhdGlvbjogdW5kZXJsaW5lO1xufVxuXG4uYnV0dG9uLmlzLWxpbms6aG92ZXIsIC5idXR0b24uaXMtbGluay5pcy1ob3ZlcmVkLCAuYnV0dG9uLmlzLWxpbms6Zm9jdXMsIC5idXR0b24uaXMtbGluay5pcy1mb2N1c2VkLCAuYnV0dG9uLmlzLWxpbms6YWN0aXZlLCAuYnV0dG9uLmlzLWxpbmsuaXMtYWN0aXZlIHtcbiAgYmFja2dyb3VuZC1jb2xvcjogd2hpdGVzbW9rZTtcbiAgY29sb3I6ICMzNjM2MzY7XG59XG5cbi5idXR0b24uaXMtbGlua1tkaXNhYmxlZF0ge1xuICBiYWNrZ3JvdW5kLWNvbG9yOiB0cmFuc3BhcmVudDtcbiAgYm9yZGVyLWNvbG9yOiB0cmFuc3BhcmVudDtcbiAgYm94LXNoYWRvdzogbm9uZTtcbn1cblxuLmJ1dHRvbi5pcy13aGl0ZSB7XG4gIGJhY2tncm91bmQtY29sb3I6IHdoaXRlO1xuICBib3JkZXItY29sb3I6IHRyYW5zcGFyZW50O1xuICBjb2xvcjogIzBhMGEwYTtcbn1cblxuLmJ1dHRvbi5pcy13aGl0ZTpob3ZlciwgLmJ1dHRvbi5pcy13aGl0ZS5pcy1ob3ZlcmVkIHtcbiAgYmFja2dyb3VuZC1jb2xvcjogI2Y5ZjlmOTtcbiAgYm9yZGVyLWNvbG9yOiB0cmFuc3BhcmVudDtcbiAgY29sb3I6ICMwYTBhMGE7XG59XG5cbi5idXR0b24uaXMtd2hpdGU6Zm9jdXMsIC5idXR0b24uaXMtd2hpdGUuaXMtZm9jdXNlZCB7XG4gIGJvcmRlci1jb2xvcjogdHJhbnNwYXJlbnQ7XG4gIGJveC1zaGFkb3c6IDAgMCAwLjVlbSByZ2JhKDI1NSwgMjU1LCAyNTUsIDAuMjUpO1xuICBjb2xvcjogIzBhMGEwYTtcbn1cblxuLmJ1dHRvbi5pcy13aGl0ZTphY3RpdmUsIC5idXR0b24uaXMtd2hpdGUuaXMtYWN0aXZlIHtcbiAgYmFja2dyb3VuZC1jb2xvcjogI2YyZjJmMjtcbiAgYm9yZGVyLWNvbG9yOiB0cmFuc3BhcmVudDtcbiAgYm94LXNoYWRvdzogaW5zZXQgMCAxcHggMnB4IHJnYmEoMTAsIDEwLCAxMCwgMC4yKTtcbiAgY29sb3I6ICMwYTBhMGE7XG59XG5cbi5idXR0b24uaXMtd2hpdGVbZGlzYWJsZWRdIHtcbiAgYmFja2dyb3VuZC1jb2xvcjogd2hpdGU7XG4gIGJvcmRlci1jb2xvcjogdHJhbnNwYXJlbnQ7XG4gIGJveC1zaGFkb3c6IG5vbmU7XG59XG5cbi5idXR0b24uaXMtd2hpdGUuaXMtaW52ZXJ0ZWQge1xuICBiYWNrZ3JvdW5kLWNvbG9yOiAjMGEwYTBhO1xuICBjb2xvcjogd2hpdGU7XG59XG5cbi5idXR0b24uaXMtd2hpdGUuaXMtaW52ZXJ0ZWQ6aG92ZXIge1xuICBiYWNrZ3JvdW5kLWNvbG9yOiBibGFjaztcbn1cblxuLmJ1dHRvbi5pcy13aGl0ZS5pcy1pbnZlcnRlZFtkaXNhYmxlZF0ge1xuICBiYWNrZ3JvdW5kLWNvbG9yOiAjMGEwYTBhO1xuICBib3JkZXItY29sb3I6IHRyYW5zcGFyZW50O1xuICBib3gtc2hhZG93OiBub25lO1xuICBjb2xvcjogd2hpdGU7XG59XG5cbi5idXR0b24uaXMtd2hpdGUuaXMtbG9hZGluZzphZnRlciB7XG4gIGJvcmRlci1jb2xvcjogdHJhbnNwYXJlbnQgdHJhbnNwYXJlbnQgIzBhMGEwYSAjMGEwYTBhICFpbXBvcnRhbnQ7XG59XG5cbi5idXR0b24uaXMtd2hpdGUuaXMtb3V0bGluZWQge1xuICBiYWNrZ3JvdW5kLWNvbG9yOiB0cmFuc3BhcmVudDtcbiAgYm9yZGVyLWNvbG9yOiB3aGl0ZTtcbiAgY29sb3I6IHdoaXRlO1xufVxuXG4uYnV0dG9uLmlzLXdoaXRlLmlzLW91dGxpbmVkOmhvdmVyLCAuYnV0dG9uLmlzLXdoaXRlLmlzLW91dGxpbmVkOmZvY3VzIHtcbiAgYmFja2dyb3VuZC1jb2xvcjogd2hpdGU7XG4gIGJvcmRlci1jb2xvcjogd2hpdGU7XG4gIGNvbG9yOiAjMGEwYTBhO1xufVxuXG4uYnV0dG9uLmlzLXdoaXRlLmlzLW91dGxpbmVkLmlzLWxvYWRpbmc6YWZ0ZXIge1xuICBib3JkZXItY29sb3I6IHRyYW5zcGFyZW50IHRyYW5zcGFyZW50IHdoaXRlIHdoaXRlICFpbXBvcnRhbnQ7XG59XG5cbi5idXR0b24uaXMtd2hpdGUuaXMtb3V0bGluZWRbZGlzYWJsZWRdIHtcbiAgYmFja2dyb3VuZC1jb2xvcjogdHJhbnNwYXJlbnQ7XG4gIGJvcmRlci1jb2xvcjogd2hpdGU7XG4gIGJveC1zaGFkb3c6IG5vbmU7XG4gIGNvbG9yOiB3aGl0ZTtcbn1cblxuLmJ1dHRvbi5pcy13aGl0ZS5pcy1pbnZlcnRlZC5pcy1vdXRsaW5lZCB7XG4gIGJhY2tncm91bmQtY29sb3I6IHRyYW5zcGFyZW50O1xuICBib3JkZXItY29sb3I6ICMwYTBhMGE7XG4gIGNvbG9yOiAjMGEwYTBhO1xufVxuXG4uYnV0dG9uLmlzLXdoaXRlLmlzLWludmVydGVkLmlzLW91dGxpbmVkOmhvdmVyLCAuYnV0dG9uLmlzLXdoaXRlLmlzLWludmVydGVkLmlzLW91dGxpbmVkOmZvY3VzIHtcbiAgYmFja2dyb3VuZC1jb2xvcjogIzBhMGEwYTtcbiAgY29sb3I6IHdoaXRlO1xufVxuXG4uYnV0dG9uLmlzLXdoaXRlLmlzLWludmVydGVkLmlzLW91dGxpbmVkW2Rpc2FibGVkXSB7XG4gIGJhY2tncm91bmQtY29sb3I6IHRyYW5zcGFyZW50O1xuICBib3JkZXItY29sb3I6ICMwYTBhMGE7XG4gIGJveC1zaGFkb3c6IG5vbmU7XG4gIGNvbG9yOiAjMGEwYTBhO1xufVxuXG4uYnV0dG9uLmlzLWJsYWNrIHtcbiAgYmFja2dyb3VuZC1jb2xvcjogIzBhMGEwYTtcbiAgYm9yZGVyLWNvbG9yOiB0cmFuc3BhcmVudDtcbiAgY29sb3I6IHdoaXRlO1xufVxuXG4uYnV0dG9uLmlzLWJsYWNrOmhvdmVyLCAuYnV0dG9uLmlzLWJsYWNrLmlzLWhvdmVyZWQge1xuICBiYWNrZ3JvdW5kLWNvbG9yOiAjMDQwNDA0O1xuICBib3JkZXItY29sb3I6IHRyYW5zcGFyZW50O1xuICBjb2xvcjogd2hpdGU7XG59XG5cbi5idXR0b24uaXMtYmxhY2s6Zm9jdXMsIC5idXR0b24uaXMtYmxhY2suaXMtZm9jdXNlZCB7XG4gIGJvcmRlci1jb2xvcjogdHJhbnNwYXJlbnQ7XG4gIGJveC1zaGFkb3c6IDAgMCAwLjVlbSByZ2JhKDEwLCAxMCwgMTAsIDAuMjUpO1xuICBjb2xvcjogd2hpdGU7XG59XG5cbi5idXR0b24uaXMtYmxhY2s6YWN0aXZlLCAuYnV0dG9uLmlzLWJsYWNrLmlzLWFjdGl2ZSB7XG4gIGJhY2tncm91bmQtY29sb3I6IGJsYWNrO1xuICBib3JkZXItY29sb3I6IHRyYW5zcGFyZW50O1xuICBib3gtc2hhZG93OiBpbnNldCAwIDFweCAycHggcmdiYSgxMCwgMTAsIDEwLCAwLjIpO1xuICBjb2xvcjogd2hpdGU7XG59XG5cbi5idXR0b24uaXMtYmxhY2tbZGlzYWJsZWRdIHtcbiAgYmFja2dyb3VuZC1jb2xvcjogIzBhMGEwYTtcbiAgYm9yZGVyLWNvbG9yOiB0cmFuc3BhcmVudDtcbiAgYm94LXNoYWRvdzogbm9uZTtcbn1cblxuLmJ1dHRvbi5pcy1ibGFjay5pcy1pbnZlcnRlZCB7XG4gIGJhY2tncm91bmQtY29sb3I6IHdoaXRlO1xuICBjb2xvcjogIzBhMGEwYTtcbn1cblxuLmJ1dHRvbi5pcy1ibGFjay5pcy1pbnZlcnRlZDpob3ZlciB7XG4gIGJhY2tncm91bmQtY29sb3I6ICNmMmYyZjI7XG59XG5cbi5idXR0b24uaXMtYmxhY2suaXMtaW52ZXJ0ZWRbZGlzYWJsZWRdIHtcbiAgYmFja2dyb3VuZC1jb2xvcjogd2hpdGU7XG4gIGJvcmRlci1jb2xvcjogdHJhbnNwYXJlbnQ7XG4gIGJveC1zaGFkb3c6IG5vbmU7XG4gIGNvbG9yOiAjMGEwYTBhO1xufVxuXG4uYnV0dG9uLmlzLWJsYWNrLmlzLWxvYWRpbmc6YWZ0ZXIge1xuICBib3JkZXItY29sb3I6IHRyYW5zcGFyZW50IHRyYW5zcGFyZW50IHdoaXRlIHdoaXRlICFpbXBvcnRhbnQ7XG59XG5cbi5idXR0b24uaXMtYmxhY2suaXMtb3V0bGluZWQge1xuICBiYWNrZ3JvdW5kLWNvbG9yOiB0cmFuc3BhcmVudDtcbiAgYm9yZGVyLWNvbG9yOiAjMGEwYTBhO1xuICBjb2xvcjogIzBhMGEwYTtcbn1cblxuLmJ1dHRvbi5pcy1ibGFjay5pcy1vdXRsaW5lZDpob3ZlciwgLmJ1dHRvbi5pcy1ibGFjay5pcy1vdXRsaW5lZDpmb2N1cyB7XG4gIGJhY2tncm91bmQtY29sb3I6ICMwYTBhMGE7XG4gIGJvcmRlci1jb2xvcjogIzBhMGEwYTtcbiAgY29sb3I6IHdoaXRlO1xufVxuXG4uYnV0dG9uLmlzLWJsYWNrLmlzLW91dGxpbmVkLmlzLWxvYWRpbmc6YWZ0ZXIge1xuICBib3JkZXItY29sb3I6IHRyYW5zcGFyZW50IHRyYW5zcGFyZW50ICMwYTBhMGEgIzBhMGEwYSAhaW1wb3J0YW50O1xufVxuXG4uYnV0dG9uLmlzLWJsYWNrLmlzLW91dGxpbmVkW2Rpc2FibGVkXSB7XG4gIGJhY2tncm91bmQtY29sb3I6IHRyYW5zcGFyZW50O1xuICBib3JkZXItY29sb3I6ICMwYTBhMGE7XG4gIGJveC1zaGFkb3c6IG5vbmU7XG4gIGNvbG9yOiAjMGEwYTBhO1xufVxuXG4uYnV0dG9uLmlzLWJsYWNrLmlzLWludmVydGVkLmlzLW91dGxpbmVkIHtcbiAgYmFja2dyb3VuZC1jb2xvcjogdHJhbnNwYXJlbnQ7XG4gIGJvcmRlci1jb2xvcjogd2hpdGU7XG4gIGNvbG9yOiB3aGl0ZTtcbn1cblxuLmJ1dHRvbi5pcy1ibGFjay5pcy1pbnZlcnRlZC5pcy1vdXRsaW5lZDpob3ZlciwgLmJ1dHRvbi5pcy1ibGFjay5pcy1pbnZlcnRlZC5pcy1vdXRsaW5lZDpmb2N1cyB7XG4gIGJhY2tncm91bmQtY29sb3I6IHdoaXRlO1xuICBjb2xvcjogIzBhMGEwYTtcbn1cblxuLmJ1dHRvbi5pcy1ibGFjay5pcy1pbnZlcnRlZC5pcy1vdXRsaW5lZFtkaXNhYmxlZF0ge1xuICBiYWNrZ3JvdW5kLWNvbG9yOiB0cmFuc3BhcmVudDtcbiAgYm9yZGVyLWNvbG9yOiB3aGl0ZTtcbiAgYm94LXNoYWRvdzogbm9uZTtcbiAgY29sb3I6IHdoaXRlO1xufVxuXG4uYnV0dG9uLmlzLWxpZ2h0IHtcbiAgYmFja2dyb3VuZC1jb2xvcjogd2hpdGVzbW9rZTtcbiAgYm9yZGVyLWNvbG9yOiB0cmFuc3BhcmVudDtcbiAgY29sb3I6ICMzNjM2MzY7XG59XG5cbi5idXR0b24uaXMtbGlnaHQ6aG92ZXIsIC5idXR0b24uaXMtbGlnaHQuaXMtaG92ZXJlZCB7XG4gIGJhY2tncm91bmQtY29sb3I6ICNlZWVlZWU7XG4gIGJvcmRlci1jb2xvcjogdHJhbnNwYXJlbnQ7XG4gIGNvbG9yOiAjMzYzNjM2O1xufVxuXG4uYnV0dG9uLmlzLWxpZ2h0OmZvY3VzLCAuYnV0dG9uLmlzLWxpZ2h0LmlzLWZvY3VzZWQge1xuICBib3JkZXItY29sb3I6IHRyYW5zcGFyZW50O1xuICBib3gtc2hhZG93OiAwIDAgMC41ZW0gcmdiYSgyNDUsIDI0NSwgMjQ1LCAwLjI1KTtcbiAgY29sb3I6ICMzNjM2MzY7XG59XG5cbi5idXR0b24uaXMtbGlnaHQ6YWN0aXZlLCAuYnV0dG9uLmlzLWxpZ2h0LmlzLWFjdGl2ZSB7XG4gIGJhY2tncm91bmQtY29sb3I6ICNlOGU4ZTg7XG4gIGJvcmRlci1jb2xvcjogdHJhbnNwYXJlbnQ7XG4gIGJveC1zaGFkb3c6IGluc2V0IDAgMXB4IDJweCByZ2JhKDEwLCAxMCwgMTAsIDAuMik7XG4gIGNvbG9yOiAjMzYzNjM2O1xufVxuXG4uYnV0dG9uLmlzLWxpZ2h0W2Rpc2FibGVkXSB7XG4gIGJhY2tncm91bmQtY29sb3I6IHdoaXRlc21va2U7XG4gIGJvcmRlci1jb2xvcjogdHJhbnNwYXJlbnQ7XG4gIGJveC1zaGFkb3c6IG5vbmU7XG59XG5cbi5idXR0b24uaXMtbGlnaHQuaXMtaW52ZXJ0ZWQge1xuICBiYWNrZ3JvdW5kLWNvbG9yOiAjMzYzNjM2O1xuICBjb2xvcjogd2hpdGVzbW9rZTtcbn1cblxuLmJ1dHRvbi5pcy1saWdodC5pcy1pbnZlcnRlZDpob3ZlciB7XG4gIGJhY2tncm91bmQtY29sb3I6ICMyOTI5Mjk7XG59XG5cbi5idXR0b24uaXMtbGlnaHQuaXMtaW52ZXJ0ZWRbZGlzYWJsZWRdIHtcbiAgYmFja2dyb3VuZC1jb2xvcjogIzM2MzYzNjtcbiAgYm9yZGVyLWNvbG9yOiB0cmFuc3BhcmVudDtcbiAgYm94LXNoYWRvdzogbm9uZTtcbiAgY29sb3I6IHdoaXRlc21va2U7XG59XG5cbi5idXR0b24uaXMtbGlnaHQuaXMtbG9hZGluZzphZnRlciB7XG4gIGJvcmRlci1jb2xvcjogdHJhbnNwYXJlbnQgdHJhbnNwYXJlbnQgIzM2MzYzNiAjMzYzNjM2ICFpbXBvcnRhbnQ7XG59XG5cbi5idXR0b24uaXMtbGlnaHQuaXMtb3V0bGluZWQge1xuICBiYWNrZ3JvdW5kLWNvbG9yOiB0cmFuc3BhcmVudDtcbiAgYm9yZGVyLWNvbG9yOiB3aGl0ZXNtb2tlO1xuICBjb2xvcjogd2hpdGVzbW9rZTtcbn1cblxuLmJ1dHRvbi5pcy1saWdodC5pcy1vdXRsaW5lZDpob3ZlciwgLmJ1dHRvbi5pcy1saWdodC5pcy1vdXRsaW5lZDpmb2N1cyB7XG4gIGJhY2tncm91bmQtY29sb3I6IHdoaXRlc21va2U7XG4gIGJvcmRlci1jb2xvcjogd2hpdGVzbW9rZTtcbiAgY29sb3I6ICMzNjM2MzY7XG59XG5cbi5idXR0b24uaXMtbGlnaHQuaXMtb3V0bGluZWQuaXMtbG9hZGluZzphZnRlciB7XG4gIGJvcmRlci1jb2xvcjogdHJhbnNwYXJlbnQgdHJhbnNwYXJlbnQgd2hpdGVzbW9rZSB3aGl0ZXNtb2tlICFpbXBvcnRhbnQ7XG59XG5cbi5idXR0b24uaXMtbGlnaHQuaXMtb3V0bGluZWRbZGlzYWJsZWRdIHtcbiAgYmFja2dyb3VuZC1jb2xvcjogdHJhbnNwYXJlbnQ7XG4gIGJvcmRlci1jb2xvcjogd2hpdGVzbW9rZTtcbiAgYm94LXNoYWRvdzogbm9uZTtcbiAgY29sb3I6IHdoaXRlc21va2U7XG59XG5cbi5idXR0b24uaXMtbGlnaHQuaXMtaW52ZXJ0ZWQuaXMtb3V0bGluZWQge1xuICBiYWNrZ3JvdW5kLWNvbG9yOiB0cmFuc3BhcmVudDtcbiAgYm9yZGVyLWNvbG9yOiAjMzYzNjM2O1xuICBjb2xvcjogIzM2MzYzNjtcbn1cblxuLmJ1dHRvbi5pcy1saWdodC5pcy1pbnZlcnRlZC5pcy1vdXRsaW5lZDpob3ZlciwgLmJ1dHRvbi5pcy1saWdodC5pcy1pbnZlcnRlZC5pcy1vdXRsaW5lZDpmb2N1cyB7XG4gIGJhY2tncm91bmQtY29sb3I6ICMzNjM2MzY7XG4gIGNvbG9yOiB3aGl0ZXNtb2tlO1xufVxuXG4uYnV0dG9uLmlzLWxpZ2h0LmlzLWludmVydGVkLmlzLW91dGxpbmVkW2Rpc2FibGVkXSB7XG4gIGJhY2tncm91bmQtY29sb3I6IHRyYW5zcGFyZW50O1xuICBib3JkZXItY29sb3I6ICMzNjM2MzY7XG4gIGJveC1zaGFkb3c6IG5vbmU7XG4gIGNvbG9yOiAjMzYzNjM2O1xufVxuXG4uYnV0dG9uLmlzLWRhcmsge1xuICBiYWNrZ3JvdW5kLWNvbG9yOiAjMzYzNjM2O1xuICBib3JkZXItY29sb3I6IHRyYW5zcGFyZW50O1xuICBjb2xvcjogd2hpdGVzbW9rZTtcbn1cblxuLmJ1dHRvbi5pcy1kYXJrOmhvdmVyLCAuYnV0dG9uLmlzLWRhcmsuaXMtaG92ZXJlZCB7XG4gIGJhY2tncm91bmQtY29sb3I6ICMyZjJmMmY7XG4gIGJvcmRlci1jb2xvcjogdHJhbnNwYXJlbnQ7XG4gIGNvbG9yOiB3aGl0ZXNtb2tlO1xufVxuXG4uYnV0dG9uLmlzLWRhcms6Zm9jdXMsIC5idXR0b24uaXMtZGFyay5pcy1mb2N1c2VkIHtcbiAgYm9yZGVyLWNvbG9yOiB0cmFuc3BhcmVudDtcbiAgYm94LXNoYWRvdzogMCAwIDAuNWVtIHJnYmEoNTQsIDU0LCA1NCwgMC4yNSk7XG4gIGNvbG9yOiB3aGl0ZXNtb2tlO1xufVxuXG4uYnV0dG9uLmlzLWRhcms6YWN0aXZlLCAuYnV0dG9uLmlzLWRhcmsuaXMtYWN0aXZlIHtcbiAgYmFja2dyb3VuZC1jb2xvcjogIzI5MjkyOTtcbiAgYm9yZGVyLWNvbG9yOiB0cmFuc3BhcmVudDtcbiAgYm94LXNoYWRvdzogaW5zZXQgMCAxcHggMnB4IHJnYmEoMTAsIDEwLCAxMCwgMC4yKTtcbiAgY29sb3I6IHdoaXRlc21va2U7XG59XG5cbi5idXR0b24uaXMtZGFya1tkaXNhYmxlZF0ge1xuICBiYWNrZ3JvdW5kLWNvbG9yOiAjMzYzNjM2O1xuICBib3JkZXItY29sb3I6IHRyYW5zcGFyZW50O1xuICBib3gtc2hhZG93OiBub25lO1xufVxuXG4uYnV0dG9uLmlzLWRhcmsuaXMtaW52ZXJ0ZWQge1xuICBiYWNrZ3JvdW5kLWNvbG9yOiB3aGl0ZXNtb2tlO1xuICBjb2xvcjogIzM2MzYzNjtcbn1cblxuLmJ1dHRvbi5pcy1kYXJrLmlzLWludmVydGVkOmhvdmVyIHtcbiAgYmFja2dyb3VuZC1jb2xvcjogI2U4ZThlODtcbn1cblxuLmJ1dHRvbi5pcy1kYXJrLmlzLWludmVydGVkW2Rpc2FibGVkXSB7XG4gIGJhY2tncm91bmQtY29sb3I6IHdoaXRlc21va2U7XG4gIGJvcmRlci1jb2xvcjogdHJhbnNwYXJlbnQ7XG4gIGJveC1zaGFkb3c6IG5vbmU7XG4gIGNvbG9yOiAjMzYzNjM2O1xufVxuXG4uYnV0dG9uLmlzLWRhcmsuaXMtbG9hZGluZzphZnRlciB7XG4gIGJvcmRlci1jb2xvcjogdHJhbnNwYXJlbnQgdHJhbnNwYXJlbnQgd2hpdGVzbW9rZSB3aGl0ZXNtb2tlICFpbXBvcnRhbnQ7XG59XG5cbi5idXR0b24uaXMtZGFyay5pcy1vdXRsaW5lZCB7XG4gIGJhY2tncm91bmQtY29sb3I6IHRyYW5zcGFyZW50O1xuICBib3JkZXItY29sb3I6ICMzNjM2MzY7XG4gIGNvbG9yOiAjMzYzNjM2O1xufVxuXG4uYnV0dG9uLmlzLWRhcmsuaXMtb3V0bGluZWQ6aG92ZXIsIC5idXR0b24uaXMtZGFyay5pcy1vdXRsaW5lZDpmb2N1cyB7XG4gIGJhY2tncm91bmQtY29sb3I6ICMzNjM2MzY7XG4gIGJvcmRlci1jb2xvcjogIzM2MzYzNjtcbiAgY29sb3I6IHdoaXRlc21va2U7XG59XG5cbi5idXR0b24uaXMtZGFyay5pcy1vdXRsaW5lZC5pcy1sb2FkaW5nOmFmdGVyIHtcbiAgYm9yZGVyLWNvbG9yOiB0cmFuc3BhcmVudCB0cmFuc3BhcmVudCAjMzYzNjM2ICMzNjM2MzYgIWltcG9ydGFudDtcbn1cblxuLmJ1dHRvbi5pcy1kYXJrLmlzLW91dGxpbmVkW2Rpc2FibGVkXSB7XG4gIGJhY2tncm91bmQtY29sb3I6IHRyYW5zcGFyZW50O1xuICBib3JkZXItY29sb3I6ICMzNjM2MzY7XG4gIGJveC1zaGFkb3c6IG5vbmU7XG4gIGNvbG9yOiAjMzYzNjM2O1xufVxuXG4uYnV0dG9uLmlzLWRhcmsuaXMtaW52ZXJ0ZWQuaXMtb3V0bGluZWQge1xuICBiYWNrZ3JvdW5kLWNvbG9yOiB0cmFuc3BhcmVudDtcbiAgYm9yZGVyLWNvbG9yOiB3aGl0ZXNtb2tlO1xuICBjb2xvcjogd2hpdGVzbW9rZTtcbn1cblxuLmJ1dHRvbi5pcy1kYXJrLmlzLWludmVydGVkLmlzLW91dGxpbmVkOmhvdmVyLCAuYnV0dG9uLmlzLWRhcmsuaXMtaW52ZXJ0ZWQuaXMtb3V0bGluZWQ6Zm9jdXMge1xuICBiYWNrZ3JvdW5kLWNvbG9yOiB3aGl0ZXNtb2tlO1xuICBjb2xvcjogIzM2MzYzNjtcbn1cblxuLmJ1dHRvbi5pcy1kYXJrLmlzLWludmVydGVkLmlzLW91dGxpbmVkW2Rpc2FibGVkXSB7XG4gIGJhY2tncm91bmQtY29sb3I6IHRyYW5zcGFyZW50O1xuICBib3JkZXItY29sb3I6IHdoaXRlc21va2U7XG4gIGJveC1zaGFkb3c6IG5vbmU7XG4gIGNvbG9yOiB3aGl0ZXNtb2tlO1xufVxuXG4uYnV0dG9uLmlzLXByaW1hcnkge1xuICBiYWNrZ3JvdW5kLWNvbG9yOiAjMDBkMWIyO1xuICBib3JkZXItY29sb3I6IHRyYW5zcGFyZW50O1xuICBjb2xvcjogI2ZmZjtcbn1cblxuLmJ1dHRvbi5pcy1wcmltYXJ5OmhvdmVyLCAuYnV0dG9uLmlzLXByaW1hcnkuaXMtaG92ZXJlZCB7XG4gIGJhY2tncm91bmQtY29sb3I6ICMwMGM0YTc7XG4gIGJvcmRlci1jb2xvcjogdHJhbnNwYXJlbnQ7XG4gIGNvbG9yOiAjZmZmO1xufVxuXG4uYnV0dG9uLmlzLXByaW1hcnk6Zm9jdXMsIC5idXR0b24uaXMtcHJpbWFyeS5pcy1mb2N1c2VkIHtcbiAgYm9yZGVyLWNvbG9yOiB0cmFuc3BhcmVudDtcbiAgYm94LXNoYWRvdzogMCAwIDAuNWVtIHJnYmEoMCwgMjA5LCAxNzgsIDAuMjUpO1xuICBjb2xvcjogI2ZmZjtcbn1cblxuLmJ1dHRvbi5pcy1wcmltYXJ5OmFjdGl2ZSwgLmJ1dHRvbi5pcy1wcmltYXJ5LmlzLWFjdGl2ZSB7XG4gIGJhY2tncm91bmQtY29sb3I6ICMwMGI4OWM7XG4gIGJvcmRlci1jb2xvcjogdHJhbnNwYXJlbnQ7XG4gIGJveC1zaGFkb3c6IGluc2V0IDAgMXB4IDJweCByZ2JhKDEwLCAxMCwgMTAsIDAuMik7XG4gIGNvbG9yOiAjZmZmO1xufVxuXG4uYnV0dG9uLmlzLXByaW1hcnlbZGlzYWJsZWRdIHtcbiAgYmFja2dyb3VuZC1jb2xvcjogIzAwZDFiMjtcbiAgYm9yZGVyLWNvbG9yOiB0cmFuc3BhcmVudDtcbiAgYm94LXNoYWRvdzogbm9uZTtcbn1cblxuLmJ1dHRvbi5pcy1wcmltYXJ5LmlzLWludmVydGVkIHtcbiAgYmFja2dyb3VuZC1jb2xvcjogI2ZmZjtcbiAgY29sb3I6ICMwMGQxYjI7XG59XG5cbi5idXR0b24uaXMtcHJpbWFyeS5pcy1pbnZlcnRlZDpob3ZlciB7XG4gIGJhY2tncm91bmQtY29sb3I6ICNmMmYyZjI7XG59XG5cbi5idXR0b24uaXMtcHJpbWFyeS5pcy1pbnZlcnRlZFtkaXNhYmxlZF0ge1xuICBiYWNrZ3JvdW5kLWNvbG9yOiAjZmZmO1xuICBib3JkZXItY29sb3I6IHRyYW5zcGFyZW50O1xuICBib3gtc2hhZG93OiBub25lO1xuICBjb2xvcjogIzAwZDFiMjtcbn1cblxuLmJ1dHRvbi5pcy1wcmltYXJ5LmlzLWxvYWRpbmc6YWZ0ZXIge1xuICBib3JkZXItY29sb3I6IHRyYW5zcGFyZW50IHRyYW5zcGFyZW50ICNmZmYgI2ZmZiAhaW1wb3J0YW50O1xufVxuXG4uYnV0dG9uLmlzLXByaW1hcnkuaXMtb3V0bGluZWQge1xuICBiYWNrZ3JvdW5kLWNvbG9yOiB0cmFuc3BhcmVudDtcbiAgYm9yZGVyLWNvbG9yOiAjMDBkMWIyO1xuICBjb2xvcjogIzAwZDFiMjtcbn1cblxuLmJ1dHRvbi5pcy1wcmltYXJ5LmlzLW91dGxpbmVkOmhvdmVyLCAuYnV0dG9uLmlzLXByaW1hcnkuaXMtb3V0bGluZWQ6Zm9jdXMge1xuICBiYWNrZ3JvdW5kLWNvbG9yOiAjMDBkMWIyO1xuICBib3JkZXItY29sb3I6ICMwMGQxYjI7XG4gIGNvbG9yOiAjZmZmO1xufVxuXG4uYnV0dG9uLmlzLXByaW1hcnkuaXMtb3V0bGluZWQuaXMtbG9hZGluZzphZnRlciB7XG4gIGJvcmRlci1jb2xvcjogdHJhbnNwYXJlbnQgdHJhbnNwYXJlbnQgIzAwZDFiMiAjMDBkMWIyICFpbXBvcnRhbnQ7XG59XG5cbi5idXR0b24uaXMtcHJpbWFyeS5pcy1vdXRsaW5lZFtkaXNhYmxlZF0ge1xuICBiYWNrZ3JvdW5kLWNvbG9yOiB0cmFuc3BhcmVudDtcbiAgYm9yZGVyLWNvbG9yOiAjMDBkMWIyO1xuICBib3gtc2hhZG93OiBub25lO1xuICBjb2xvcjogIzAwZDFiMjtcbn1cblxuLmJ1dHRvbi5pcy1wcmltYXJ5LmlzLWludmVydGVkLmlzLW91dGxpbmVkIHtcbiAgYmFja2dyb3VuZC1jb2xvcjogdHJhbnNwYXJlbnQ7XG4gIGJvcmRlci1jb2xvcjogI2ZmZjtcbiAgY29sb3I6ICNmZmY7XG59XG5cbi5idXR0b24uaXMtcHJpbWFyeS5pcy1pbnZlcnRlZC5pcy1vdXRsaW5lZDpob3ZlciwgLmJ1dHRvbi5pcy1wcmltYXJ5LmlzLWludmVydGVkLmlzLW91dGxpbmVkOmZvY3VzIHtcbiAgYmFja2dyb3VuZC1jb2xvcjogI2ZmZjtcbiAgY29sb3I6ICMwMGQxYjI7XG59XG5cbi5idXR0b24uaXMtcHJpbWFyeS5pcy1pbnZlcnRlZC5pcy1vdXRsaW5lZFtkaXNhYmxlZF0ge1xuICBiYWNrZ3JvdW5kLWNvbG9yOiB0cmFuc3BhcmVudDtcbiAgYm9yZGVyLWNvbG9yOiAjZmZmO1xuICBib3gtc2hhZG93OiBub25lO1xuICBjb2xvcjogI2ZmZjtcbn1cblxuLmJ1dHRvbi5pcy1pbmZvIHtcbiAgYmFja2dyb3VuZC1jb2xvcjogIzMyNzNkYztcbiAgYm9yZGVyLWNvbG9yOiB0cmFuc3BhcmVudDtcbiAgY29sb3I6ICNmZmY7XG59XG5cbi5idXR0b24uaXMtaW5mbzpob3ZlciwgLmJ1dHRvbi5pcy1pbmZvLmlzLWhvdmVyZWQge1xuICBiYWNrZ3JvdW5kLWNvbG9yOiAjMjc2Y2RhO1xuICBib3JkZXItY29sb3I6IHRyYW5zcGFyZW50O1xuICBjb2xvcjogI2ZmZjtcbn1cblxuLmJ1dHRvbi5pcy1pbmZvOmZvY3VzLCAuYnV0dG9uLmlzLWluZm8uaXMtZm9jdXNlZCB7XG4gIGJvcmRlci1jb2xvcjogdHJhbnNwYXJlbnQ7XG4gIGJveC1zaGFkb3c6IDAgMCAwLjVlbSByZ2JhKDUwLCAxMTUsIDIyMCwgMC4yNSk7XG4gIGNvbG9yOiAjZmZmO1xufVxuXG4uYnV0dG9uLmlzLWluZm86YWN0aXZlLCAuYnV0dG9uLmlzLWluZm8uaXMtYWN0aXZlIHtcbiAgYmFja2dyb3VuZC1jb2xvcjogIzIzNjZkMTtcbiAgYm9yZGVyLWNvbG9yOiB0cmFuc3BhcmVudDtcbiAgYm94LXNoYWRvdzogaW5zZXQgMCAxcHggMnB4IHJnYmEoMTAsIDEwLCAxMCwgMC4yKTtcbiAgY29sb3I6ICNmZmY7XG59XG5cbi5idXR0b24uaXMtaW5mb1tkaXNhYmxlZF0ge1xuICBiYWNrZ3JvdW5kLWNvbG9yOiAjMzI3M2RjO1xuICBib3JkZXItY29sb3I6IHRyYW5zcGFyZW50O1xuICBib3gtc2hhZG93OiBub25lO1xufVxuXG4uYnV0dG9uLmlzLWluZm8uaXMtaW52ZXJ0ZWQge1xuICBiYWNrZ3JvdW5kLWNvbG9yOiAjZmZmO1xuICBjb2xvcjogIzMyNzNkYztcbn1cblxuLmJ1dHRvbi5pcy1pbmZvLmlzLWludmVydGVkOmhvdmVyIHtcbiAgYmFja2dyb3VuZC1jb2xvcjogI2YyZjJmMjtcbn1cblxuLmJ1dHRvbi5pcy1pbmZvLmlzLWludmVydGVkW2Rpc2FibGVkXSB7XG4gIGJhY2tncm91bmQtY29sb3I6ICNmZmY7XG4gIGJvcmRlci1jb2xvcjogdHJhbnNwYXJlbnQ7XG4gIGJveC1zaGFkb3c6IG5vbmU7XG4gIGNvbG9yOiAjMzI3M2RjO1xufVxuXG4uYnV0dG9uLmlzLWluZm8uaXMtbG9hZGluZzphZnRlciB7XG4gIGJvcmRlci1jb2xvcjogdHJhbnNwYXJlbnQgdHJhbnNwYXJlbnQgI2ZmZiAjZmZmICFpbXBvcnRhbnQ7XG59XG5cbi5idXR0b24uaXMtaW5mby5pcy1vdXRsaW5lZCB7XG4gIGJhY2tncm91bmQtY29sb3I6IHRyYW5zcGFyZW50O1xuICBib3JkZXItY29sb3I6ICMzMjczZGM7XG4gIGNvbG9yOiAjMzI3M2RjO1xufVxuXG4uYnV0dG9uLmlzLWluZm8uaXMtb3V0bGluZWQ6aG92ZXIsIC5idXR0b24uaXMtaW5mby5pcy1vdXRsaW5lZDpmb2N1cyB7XG4gIGJhY2tncm91bmQtY29sb3I6ICMzMjczZGM7XG4gIGJvcmRlci1jb2xvcjogIzMyNzNkYztcbiAgY29sb3I6ICNmZmY7XG59XG5cbi5idXR0b24uaXMtaW5mby5pcy1vdXRsaW5lZC5pcy1sb2FkaW5nOmFmdGVyIHtcbiAgYm9yZGVyLWNvbG9yOiB0cmFuc3BhcmVudCB0cmFuc3BhcmVudCAjMzI3M2RjICMzMjczZGMgIWltcG9ydGFudDtcbn1cblxuLmJ1dHRvbi5pcy1pbmZvLmlzLW91dGxpbmVkW2Rpc2FibGVkXSB7XG4gIGJhY2tncm91bmQtY29sb3I6IHRyYW5zcGFyZW50O1xuICBib3JkZXItY29sb3I6ICMzMjczZGM7XG4gIGJveC1zaGFkb3c6IG5vbmU7XG4gIGNvbG9yOiAjMzI3M2RjO1xufVxuXG4uYnV0dG9uLmlzLWluZm8uaXMtaW52ZXJ0ZWQuaXMtb3V0bGluZWQge1xuICBiYWNrZ3JvdW5kLWNvbG9yOiB0cmFuc3BhcmVudDtcbiAgYm9yZGVyLWNvbG9yOiAjZmZmO1xuICBjb2xvcjogI2ZmZjtcbn1cblxuLmJ1dHRvbi5pcy1pbmZvLmlzLWludmVydGVkLmlzLW91dGxpbmVkOmhvdmVyLCAuYnV0dG9uLmlzLWluZm8uaXMtaW52ZXJ0ZWQuaXMtb3V0bGluZWQ6Zm9jdXMge1xuICBiYWNrZ3JvdW5kLWNvbG9yOiAjZmZmO1xuICBjb2xvcjogIzMyNzNkYztcbn1cblxuLmJ1dHRvbi5pcy1pbmZvLmlzLWludmVydGVkLmlzLW91dGxpbmVkW2Rpc2FibGVkXSB7XG4gIGJhY2tncm91bmQtY29sb3I6IHRyYW5zcGFyZW50O1xuICBib3JkZXItY29sb3I6ICNmZmY7XG4gIGJveC1zaGFkb3c6IG5vbmU7XG4gIGNvbG9yOiAjZmZmO1xufVxuXG4uYnV0dG9uLmlzLXN1Y2Nlc3Mge1xuICBiYWNrZ3JvdW5kLWNvbG9yOiAjMjNkMTYwO1xuICBib3JkZXItY29sb3I6IHRyYW5zcGFyZW50O1xuICBjb2xvcjogI2ZmZjtcbn1cblxuLmJ1dHRvbi5pcy1zdWNjZXNzOmhvdmVyLCAuYnV0dG9uLmlzLXN1Y2Nlc3MuaXMtaG92ZXJlZCB7XG4gIGJhY2tncm91bmQtY29sb3I6ICMyMmM2NWI7XG4gIGJvcmRlci1jb2xvcjogdHJhbnNwYXJlbnQ7XG4gIGNvbG9yOiAjZmZmO1xufVxuXG4uYnV0dG9uLmlzLXN1Y2Nlc3M6Zm9jdXMsIC5idXR0b24uaXMtc3VjY2Vzcy5pcy1mb2N1c2VkIHtcbiAgYm9yZGVyLWNvbG9yOiB0cmFuc3BhcmVudDtcbiAgYm94LXNoYWRvdzogMCAwIDAuNWVtIHJnYmEoMzUsIDIwOSwgOTYsIDAuMjUpO1xuICBjb2xvcjogI2ZmZjtcbn1cblxuLmJ1dHRvbi5pcy1zdWNjZXNzOmFjdGl2ZSwgLmJ1dHRvbi5pcy1zdWNjZXNzLmlzLWFjdGl2ZSB7XG4gIGJhY2tncm91bmQtY29sb3I6ICMyMGJjNTY7XG4gIGJvcmRlci1jb2xvcjogdHJhbnNwYXJlbnQ7XG4gIGJveC1zaGFkb3c6IGluc2V0IDAgMXB4IDJweCByZ2JhKDEwLCAxMCwgMTAsIDAuMik7XG4gIGNvbG9yOiAjZmZmO1xufVxuXG4uYnV0dG9uLmlzLXN1Y2Nlc3NbZGlzYWJsZWRdIHtcbiAgYmFja2dyb3VuZC1jb2xvcjogIzIzZDE2MDtcbiAgYm9yZGVyLWNvbG9yOiB0cmFuc3BhcmVudDtcbiAgYm94LXNoYWRvdzogbm9uZTtcbn1cblxuLmJ1dHRvbi5pcy1zdWNjZXNzLmlzLWludmVydGVkIHtcbiAgYmFja2dyb3VuZC1jb2xvcjogI2ZmZjtcbiAgY29sb3I6ICMyM2QxNjA7XG59XG5cbi5idXR0b24uaXMtc3VjY2Vzcy5pcy1pbnZlcnRlZDpob3ZlciB7XG4gIGJhY2tncm91bmQtY29sb3I6ICNmMmYyZjI7XG59XG5cbi5idXR0b24uaXMtc3VjY2Vzcy5pcy1pbnZlcnRlZFtkaXNhYmxlZF0ge1xuICBiYWNrZ3JvdW5kLWNvbG9yOiAjZmZmO1xuICBib3JkZXItY29sb3I6IHRyYW5zcGFyZW50O1xuICBib3gtc2hhZG93OiBub25lO1xuICBjb2xvcjogIzIzZDE2MDtcbn1cblxuLmJ1dHRvbi5pcy1zdWNjZXNzLmlzLWxvYWRpbmc6YWZ0ZXIge1xuICBib3JkZXItY29sb3I6IHRyYW5zcGFyZW50IHRyYW5zcGFyZW50ICNmZmYgI2ZmZiAhaW1wb3J0YW50O1xufVxuXG4uYnV0dG9uLmlzLXN1Y2Nlc3MuaXMtb3V0bGluZWQge1xuICBiYWNrZ3JvdW5kLWNvbG9yOiB0cmFuc3BhcmVudDtcbiAgYm9yZGVyLWNvbG9yOiAjMjNkMTYwO1xuICBjb2xvcjogIzIzZDE2MDtcbn1cblxuLmJ1dHRvbi5pcy1zdWNjZXNzLmlzLW91dGxpbmVkOmhvdmVyLCAuYnV0dG9uLmlzLXN1Y2Nlc3MuaXMtb3V0bGluZWQ6Zm9jdXMge1xuICBiYWNrZ3JvdW5kLWNvbG9yOiAjMjNkMTYwO1xuICBib3JkZXItY29sb3I6ICMyM2QxNjA7XG4gIGNvbG9yOiAjZmZmO1xufVxuXG4uYnV0dG9uLmlzLXN1Y2Nlc3MuaXMtb3V0bGluZWQuaXMtbG9hZGluZzphZnRlciB7XG4gIGJvcmRlci1jb2xvcjogdHJhbnNwYXJlbnQgdHJhbnNwYXJlbnQgIzIzZDE2MCAjMjNkMTYwICFpbXBvcnRhbnQ7XG59XG5cbi5idXR0b24uaXMtc3VjY2Vzcy5pcy1vdXRsaW5lZFtkaXNhYmxlZF0ge1xuICBiYWNrZ3JvdW5kLWNvbG9yOiB0cmFuc3BhcmVudDtcbiAgYm9yZGVyLWNvbG9yOiAjMjNkMTYwO1xuICBib3gtc2hhZG93OiBub25lO1xuICBjb2xvcjogIzIzZDE2MDtcbn1cblxuLmJ1dHRvbi5pcy1zdWNjZXNzLmlzLWludmVydGVkLmlzLW91dGxpbmVkIHtcbiAgYmFja2dyb3VuZC1jb2xvcjogdHJhbnNwYXJlbnQ7XG4gIGJvcmRlci1jb2xvcjogI2ZmZjtcbiAgY29sb3I6ICNmZmY7XG59XG5cbi5idXR0b24uaXMtc3VjY2Vzcy5pcy1pbnZlcnRlZC5pcy1vdXRsaW5lZDpob3ZlciwgLmJ1dHRvbi5pcy1zdWNjZXNzLmlzLWludmVydGVkLmlzLW91dGxpbmVkOmZvY3VzIHtcbiAgYmFja2dyb3VuZC1jb2xvcjogI2ZmZjtcbiAgY29sb3I6ICMyM2QxNjA7XG59XG5cbi5idXR0b24uaXMtc3VjY2Vzcy5pcy1pbnZlcnRlZC5pcy1vdXRsaW5lZFtkaXNhYmxlZF0ge1xuICBiYWNrZ3JvdW5kLWNvbG9yOiB0cmFuc3BhcmVudDtcbiAgYm9yZGVyLWNvbG9yOiAjZmZmO1xuICBib3gtc2hhZG93OiBub25lO1xuICBjb2xvcjogI2ZmZjtcbn1cblxuLmJ1dHRvbi5pcy13YXJuaW5nIHtcbiAgYmFja2dyb3VuZC1jb2xvcjogI2ZmZGQ1NztcbiAgYm9yZGVyLWNvbG9yOiB0cmFuc3BhcmVudDtcbiAgY29sb3I6IHJnYmEoMCwgMCwgMCwgMC43KTtcbn1cblxuLmJ1dHRvbi5pcy13YXJuaW5nOmhvdmVyLCAuYnV0dG9uLmlzLXdhcm5pbmcuaXMtaG92ZXJlZCB7XG4gIGJhY2tncm91bmQtY29sb3I6ICNmZmRiNGE7XG4gIGJvcmRlci1jb2xvcjogdHJhbnNwYXJlbnQ7XG4gIGNvbG9yOiByZ2JhKDAsIDAsIDAsIDAuNyk7XG59XG5cbi5idXR0b24uaXMtd2FybmluZzpmb2N1cywgLmJ1dHRvbi5pcy13YXJuaW5nLmlzLWZvY3VzZWQge1xuICBib3JkZXItY29sb3I6IHRyYW5zcGFyZW50O1xuICBib3gtc2hhZG93OiAwIDAgMC41ZW0gcmdiYSgyNTUsIDIyMSwgODcsIDAuMjUpO1xuICBjb2xvcjogcmdiYSgwLCAwLCAwLCAwLjcpO1xufVxuXG4uYnV0dG9uLmlzLXdhcm5pbmc6YWN0aXZlLCAuYnV0dG9uLmlzLXdhcm5pbmcuaXMtYWN0aXZlIHtcbiAgYmFja2dyb3VuZC1jb2xvcjogI2ZmZDgzZDtcbiAgYm9yZGVyLWNvbG9yOiB0cmFuc3BhcmVudDtcbiAgYm94LXNoYWRvdzogaW5zZXQgMCAxcHggMnB4IHJnYmEoMTAsIDEwLCAxMCwgMC4yKTtcbiAgY29sb3I6IHJnYmEoMCwgMCwgMCwgMC43KTtcbn1cblxuLmJ1dHRvbi5pcy13YXJuaW5nW2Rpc2FibGVkXSB7XG4gIGJhY2tncm91bmQtY29sb3I6ICNmZmRkNTc7XG4gIGJvcmRlci1jb2xvcjogdHJhbnNwYXJlbnQ7XG4gIGJveC1zaGFkb3c6IG5vbmU7XG59XG5cbi5idXR0b24uaXMtd2FybmluZy5pcy1pbnZlcnRlZCB7XG4gIGJhY2tncm91bmQtY29sb3I6IHJnYmEoMCwgMCwgMCwgMC43KTtcbiAgY29sb3I6ICNmZmRkNTc7XG59XG5cbi5idXR0b24uaXMtd2FybmluZy5pcy1pbnZlcnRlZDpob3ZlciB7XG4gIGJhY2tncm91bmQtY29sb3I6IHJnYmEoMCwgMCwgMCwgMC43KTtcbn1cblxuLmJ1dHRvbi5pcy13YXJuaW5nLmlzLWludmVydGVkW2Rpc2FibGVkXSB7XG4gIGJhY2tncm91bmQtY29sb3I6IHJnYmEoMCwgMCwgMCwgMC43KTtcbiAgYm9yZGVyLWNvbG9yOiB0cmFuc3BhcmVudDtcbiAgYm94LXNoYWRvdzogbm9uZTtcbiAgY29sb3I6ICNmZmRkNTc7XG59XG5cbi5idXR0b24uaXMtd2FybmluZy5pcy1sb2FkaW5nOmFmdGVyIHtcbiAgYm9yZGVyLWNvbG9yOiB0cmFuc3BhcmVudCB0cmFuc3BhcmVudCByZ2JhKDAsIDAsIDAsIDAuNykgcmdiYSgwLCAwLCAwLCAwLjcpICFpbXBvcnRhbnQ7XG59XG5cbi5idXR0b24uaXMtd2FybmluZy5pcy1vdXRsaW5lZCB7XG4gIGJhY2tncm91bmQtY29sb3I6IHRyYW5zcGFyZW50O1xuICBib3JkZXItY29sb3I6ICNmZmRkNTc7XG4gIGNvbG9yOiAjZmZkZDU3O1xufVxuXG4uYnV0dG9uLmlzLXdhcm5pbmcuaXMtb3V0bGluZWQ6aG92ZXIsIC5idXR0b24uaXMtd2FybmluZy5pcy1vdXRsaW5lZDpmb2N1cyB7XG4gIGJhY2tncm91bmQtY29sb3I6ICNmZmRkNTc7XG4gIGJvcmRlci1jb2xvcjogI2ZmZGQ1NztcbiAgY29sb3I6IHJnYmEoMCwgMCwgMCwgMC43KTtcbn1cblxuLmJ1dHRvbi5pcy13YXJuaW5nLmlzLW91dGxpbmVkLmlzLWxvYWRpbmc6YWZ0ZXIge1xuICBib3JkZXItY29sb3I6IHRyYW5zcGFyZW50IHRyYW5zcGFyZW50ICNmZmRkNTcgI2ZmZGQ1NyAhaW1wb3J0YW50O1xufVxuXG4uYnV0dG9uLmlzLXdhcm5pbmcuaXMtb3V0bGluZWRbZGlzYWJsZWRdIHtcbiAgYmFja2dyb3VuZC1jb2xvcjogdHJhbnNwYXJlbnQ7XG4gIGJvcmRlci1jb2xvcjogI2ZmZGQ1NztcbiAgYm94LXNoYWRvdzogbm9uZTtcbiAgY29sb3I6ICNmZmRkNTc7XG59XG5cbi5idXR0b24uaXMtd2FybmluZy5pcy1pbnZlcnRlZC5pcy1vdXRsaW5lZCB7XG4gIGJhY2tncm91bmQtY29sb3I6IHRyYW5zcGFyZW50O1xuICBib3JkZXItY29sb3I6IHJnYmEoMCwgMCwgMCwgMC43KTtcbiAgY29sb3I6IHJnYmEoMCwgMCwgMCwgMC43KTtcbn1cblxuLmJ1dHRvbi5pcy13YXJuaW5nLmlzLWludmVydGVkLmlzLW91dGxpbmVkOmhvdmVyLCAuYnV0dG9uLmlzLXdhcm5pbmcuaXMtaW52ZXJ0ZWQuaXMtb3V0bGluZWQ6Zm9jdXMge1xuICBiYWNrZ3JvdW5kLWNvbG9yOiByZ2JhKDAsIDAsIDAsIDAuNyk7XG4gIGNvbG9yOiAjZmZkZDU3O1xufVxuXG4uYnV0dG9uLmlzLXdhcm5pbmcuaXMtaW52ZXJ0ZWQuaXMtb3V0bGluZWRbZGlzYWJsZWRdIHtcbiAgYmFja2dyb3VuZC1jb2xvcjogdHJhbnNwYXJlbnQ7XG4gIGJvcmRlci1jb2xvcjogcmdiYSgwLCAwLCAwLCAwLjcpO1xuICBib3gtc2hhZG93OiBub25lO1xuICBjb2xvcjogcmdiYSgwLCAwLCAwLCAwLjcpO1xufVxuXG4uYnV0dG9uLmlzLWRhbmdlciB7XG4gIGJhY2tncm91bmQtY29sb3I6ICNmZjM4NjA7XG4gIGJvcmRlci1jb2xvcjogdHJhbnNwYXJlbnQ7XG4gIGNvbG9yOiAjZmZmO1xufVxuXG4uYnV0dG9uLmlzLWRhbmdlcjpob3ZlciwgLmJ1dHRvbi5pcy1kYW5nZXIuaXMtaG92ZXJlZCB7XG4gIGJhY2tncm91bmQtY29sb3I6ICNmZjJiNTY7XG4gIGJvcmRlci1jb2xvcjogdHJhbnNwYXJlbnQ7XG4gIGNvbG9yOiAjZmZmO1xufVxuXG4uYnV0dG9uLmlzLWRhbmdlcjpmb2N1cywgLmJ1dHRvbi5pcy1kYW5nZXIuaXMtZm9jdXNlZCB7XG4gIGJvcmRlci1jb2xvcjogdHJhbnNwYXJlbnQ7XG4gIGJveC1zaGFkb3c6IDAgMCAwLjVlbSByZ2JhKDI1NSwgNTYsIDk2LCAwLjI1KTtcbiAgY29sb3I6ICNmZmY7XG59XG5cbi5idXR0b24uaXMtZGFuZ2VyOmFjdGl2ZSwgLmJ1dHRvbi5pcy1kYW5nZXIuaXMtYWN0aXZlIHtcbiAgYmFja2dyb3VuZC1jb2xvcjogI2ZmMWY0YjtcbiAgYm9yZGVyLWNvbG9yOiB0cmFuc3BhcmVudDtcbiAgYm94LXNoYWRvdzogaW5zZXQgMCAxcHggMnB4IHJnYmEoMTAsIDEwLCAxMCwgMC4yKTtcbiAgY29sb3I6ICNmZmY7XG59XG5cbi5idXR0b24uaXMtZGFuZ2VyW2Rpc2FibGVkXSB7XG4gIGJhY2tncm91bmQtY29sb3I6ICNmZjM4NjA7XG4gIGJvcmRlci1jb2xvcjogdHJhbnNwYXJlbnQ7XG4gIGJveC1zaGFkb3c6IG5vbmU7XG59XG5cbi5idXR0b24uaXMtZGFuZ2VyLmlzLWludmVydGVkIHtcbiAgYmFja2dyb3VuZC1jb2xvcjogI2ZmZjtcbiAgY29sb3I6ICNmZjM4NjA7XG59XG5cbi5idXR0b24uaXMtZGFuZ2VyLmlzLWludmVydGVkOmhvdmVyIHtcbiAgYmFja2dyb3VuZC1jb2xvcjogI2YyZjJmMjtcbn1cblxuLmJ1dHRvbi5pcy1kYW5nZXIuaXMtaW52ZXJ0ZWRbZGlzYWJsZWRdIHtcbiAgYmFja2dyb3VuZC1jb2xvcjogI2ZmZjtcbiAgYm9yZGVyLWNvbG9yOiB0cmFuc3BhcmVudDtcbiAgYm94LXNoYWRvdzogbm9uZTtcbiAgY29sb3I6ICNmZjM4NjA7XG59XG5cbi5idXR0b24uaXMtZGFuZ2VyLmlzLWxvYWRpbmc6YWZ0ZXIge1xuICBib3JkZXItY29sb3I6IHRyYW5zcGFyZW50IHRyYW5zcGFyZW50ICNmZmYgI2ZmZiAhaW1wb3J0YW50O1xufVxuXG4uYnV0dG9uLmlzLWRhbmdlci5pcy1vdXRsaW5lZCB7XG4gIGJhY2tncm91bmQtY29sb3I6IHRyYW5zcGFyZW50O1xuICBib3JkZXItY29sb3I6ICNmZjM4NjA7XG4gIGNvbG9yOiAjZmYzODYwO1xufVxuXG4uYnV0dG9uLmlzLWRhbmdlci5pcy1vdXRsaW5lZDpob3ZlciwgLmJ1dHRvbi5pcy1kYW5nZXIuaXMtb3V0bGluZWQ6Zm9jdXMge1xuICBiYWNrZ3JvdW5kLWNvbG9yOiAjZmYzODYwO1xuICBib3JkZXItY29sb3I6ICNmZjM4NjA7XG4gIGNvbG9yOiAjZmZmO1xufVxuXG4uYnV0dG9uLmlzLWRhbmdlci5pcy1vdXRsaW5lZC5pcy1sb2FkaW5nOmFmdGVyIHtcbiAgYm9yZGVyLWNvbG9yOiB0cmFuc3BhcmVudCB0cmFuc3BhcmVudCAjZmYzODYwICNmZjM4NjAgIWltcG9ydGFudDtcbn1cblxuLmJ1dHRvbi5pcy1kYW5nZXIuaXMtb3V0bGluZWRbZGlzYWJsZWRdIHtcbiAgYmFja2dyb3VuZC1jb2xvcjogdHJhbnNwYXJlbnQ7XG4gIGJvcmRlci1jb2xvcjogI2ZmMzg2MDtcbiAgYm94LXNoYWRvdzogbm9uZTtcbiAgY29sb3I6ICNmZjM4NjA7XG59XG5cbi5idXR0b24uaXMtZGFuZ2VyLmlzLWludmVydGVkLmlzLW91dGxpbmVkIHtcbiAgYmFja2dyb3VuZC1jb2xvcjogdHJhbnNwYXJlbnQ7XG4gIGJvcmRlci1jb2xvcjogI2ZmZjtcbiAgY29sb3I6ICNmZmY7XG59XG5cbi5idXR0b24uaXMtZGFuZ2VyLmlzLWludmVydGVkLmlzLW91dGxpbmVkOmhvdmVyLCAuYnV0dG9uLmlzLWRhbmdlci5pcy1pbnZlcnRlZC5pcy1vdXRsaW5lZDpmb2N1cyB7XG4gIGJhY2tncm91bmQtY29sb3I6ICNmZmY7XG4gIGNvbG9yOiAjZmYzODYwO1xufVxuXG4uYnV0dG9uLmlzLWRhbmdlci5pcy1pbnZlcnRlZC5pcy1vdXRsaW5lZFtkaXNhYmxlZF0ge1xuICBiYWNrZ3JvdW5kLWNvbG9yOiB0cmFuc3BhcmVudDtcbiAgYm9yZGVyLWNvbG9yOiAjZmZmO1xuICBib3gtc2hhZG93OiBub25lO1xuICBjb2xvcjogI2ZmZjtcbn1cblxuLmJ1dHRvbi5pcy1zbWFsbCB7XG4gIGJvcmRlci1yYWRpdXM6IDJweDtcbiAgZm9udC1zaXplOiAwLjc1cmVtO1xufVxuXG4uYnV0dG9uLmlzLW1lZGl1bSB7XG4gIGZvbnQtc2l6ZTogMS4yNXJlbTtcbn1cblxuLmJ1dHRvbi5pcy1sYXJnZSB7XG4gIGZvbnQtc2l6ZTogMS41cmVtO1xufVxuXG4uYnV0dG9uW2Rpc2FibGVkXSB7XG4gIGJhY2tncm91bmQtY29sb3I6IHdoaXRlO1xuICBib3JkZXItY29sb3I6ICNkYmRiZGI7XG4gIGJveC1zaGFkb3c6IG5vbmU7XG4gIG9wYWNpdHk6IDAuNTtcbn1cblxuLmJ1dHRvbi5pcy1mdWxsd2lkdGgge1xuICBkaXNwbGF5OiBmbGV4O1xuICB3aWR0aDogMTAwJTtcbn1cblxuLmJ1dHRvbi5pcy1sb2FkaW5nIHtcbiAgY29sb3I6IHRyYW5zcGFyZW50ICFpbXBvcnRhbnQ7XG4gIHBvaW50ZXItZXZlbnRzOiBub25lO1xufVxuXG4uYnV0dG9uLmlzLWxvYWRpbmc6YWZ0ZXIge1xuICBhbmltYXRpb246IHNwaW5Bcm91bmQgNTAwbXMgaW5maW5pdGUgbGluZWFyO1xuICBib3JkZXI6IDJweCBzb2xpZCAjZGJkYmRiO1xuICBib3JkZXItcmFkaXVzOiAyOTA0ODZweDtcbiAgYm9yZGVyLXJpZ2h0LWNvbG9yOiB0cmFuc3BhcmVudDtcbiAgYm9yZGVyLXRvcC1jb2xvcjogdHJhbnNwYXJlbnQ7XG4gIGNvbnRlbnQ6IFwiXCI7XG4gIGRpc3BsYXk6IGJsb2NrO1xuICBoZWlnaHQ6IDFlbTtcbiAgcG9zaXRpb246IHJlbGF0aXZlO1xuICB3aWR0aDogMWVtO1xuICBwb3NpdGlvbjogYWJzb2x1dGU7XG4gIGxlZnQ6IGNhbGMoNTAlIC0gKDFlbSAvIDIpKTtcbiAgdG9wOiBjYWxjKDUwJSAtICgxZW0gLyAyKSk7XG4gIHBvc2l0aW9uOiBhYnNvbHV0ZSAhaW1wb3J0YW50O1xufVxuXG4uYnV0dG9uLmlzLXN0YXRpYyB7XG4gIGJhY2tncm91bmQtY29sb3I6IHdoaXRlc21va2U7XG4gIGJvcmRlci1jb2xvcjogI2RiZGJkYjtcbiAgY29sb3I6ICM3YTdhN2E7XG4gIGJveC1zaGFkb3c6IG5vbmU7XG4gIHBvaW50ZXItZXZlbnRzOiBub25lO1xufVxuXG5idXR0b24uYnV0dG9uLFxuaW5wdXRbdHlwZT1cInN1Ym1pdFwiXS5idXR0b24ge1xuICBsaW5lLWhlaWdodDogMTtcbiAgcGFkZGluZy1ib3R0b206IDAuNGVtO1xuICBwYWRkaW5nLXRvcDogMC4zNWVtO1xufVxuXG4uY29udGVudDpub3QoOmxhc3QtY2hpbGQpIHtcbiAgbWFyZ2luLWJvdHRvbTogMS41cmVtO1xufVxuXG4uY29udGVudCBsaSArIGxpIHtcbiAgbWFyZ2luLXRvcDogMC4yNWVtO1xufVxuXG4uY29udGVudCBwOm5vdCg6bGFzdC1jaGlsZCksXG4uY29udGVudCBkbDpub3QoOmxhc3QtY2hpbGQpLFxuLmNvbnRlbnQgb2w6bm90KDpsYXN0LWNoaWxkKSxcbi5jb250ZW50IHVsOm5vdCg6bGFzdC1jaGlsZCksXG4uY29udGVudCBibG9ja3F1b3RlOm5vdCg6bGFzdC1jaGlsZCksXG4uY29udGVudCBwcmU6bm90KDpsYXN0LWNoaWxkKSxcbi5jb250ZW50IHRhYmxlOm5vdCg6bGFzdC1jaGlsZCkge1xuICBtYXJnaW4tYm90dG9tOiAxZW07XG59XG5cbi5jb250ZW50IGgxLFxuLmNvbnRlbnQgaDIsXG4uY29udGVudCBoMyxcbi5jb250ZW50IGg0LFxuLmNvbnRlbnQgaDUsXG4uY29udGVudCBoNiB7XG4gIGNvbG9yOiAjMzYzNjM2O1xuICBmb250LXdlaWdodDogNDAwO1xuICBsaW5lLWhlaWdodDogMS4xMjU7XG59XG5cbi5jb250ZW50IGgxIHtcbiAgZm9udC1zaXplOiAyZW07XG4gIG1hcmdpbi1ib3R0b206IDAuNWVtO1xufVxuXG4uY29udGVudCBoMTpub3QoOmZpcnN0LWNoaWxkKSB7XG4gIG1hcmdpbi10b3A6IDFlbTtcbn1cblxuLmNvbnRlbnQgaDIge1xuICBmb250LXNpemU6IDEuNzVlbTtcbiAgbWFyZ2luLWJvdHRvbTogMC41NzE0ZW07XG59XG5cbi5jb250ZW50IGgyOm5vdCg6Zmlyc3QtY2hpbGQpIHtcbiAgbWFyZ2luLXRvcDogMS4xNDI4ZW07XG59XG5cbi5jb250ZW50IGgzIHtcbiAgZm9udC1zaXplOiAxLjVlbTtcbiAgbWFyZ2luLWJvdHRvbTogMC42NjY2ZW07XG59XG5cbi5jb250ZW50IGgzOm5vdCg6Zmlyc3QtY2hpbGQpIHtcbiAgbWFyZ2luLXRvcDogMS4zMzMzZW07XG59XG5cbi5jb250ZW50IGg0IHtcbiAgZm9udC1zaXplOiAxLjI1ZW07XG4gIG1hcmdpbi1ib3R0b206IDAuOGVtO1xufVxuXG4uY29udGVudCBoNSB7XG4gIGZvbnQtc2l6ZTogMS4xMjVlbTtcbiAgbWFyZ2luLWJvdHRvbTogMC44ODg4ZW07XG59XG5cbi5jb250ZW50IGg2IHtcbiAgZm9udC1zaXplOiAxZW07XG4gIG1hcmdpbi1ib3R0b206IDFlbTtcbn1cblxuLmNvbnRlbnQgYmxvY2txdW90ZSB7XG4gIGJhY2tncm91bmQtY29sb3I6IHdoaXRlc21va2U7XG4gIGJvcmRlci1sZWZ0OiA1cHggc29saWQgI2RiZGJkYjtcbiAgcGFkZGluZzogMS4yNWVtIDEuNWVtO1xufVxuXG4uY29udGVudCBvbCB7XG4gIGxpc3Qtc3R5bGU6IGRlY2ltYWwgb3V0c2lkZTtcbiAgbWFyZ2luLWxlZnQ6IDJlbTtcbiAgbWFyZ2luLXRvcDogMWVtO1xufVxuXG4uY29udGVudCB1bCB7XG4gIGxpc3Qtc3R5bGU6IGRpc2Mgb3V0c2lkZTtcbiAgbWFyZ2luLWxlZnQ6IDJlbTtcbiAgbWFyZ2luLXRvcDogMWVtO1xufVxuXG4uY29udGVudCB1bCB1bCB7XG4gIGxpc3Qtc3R5bGUtdHlwZTogY2lyY2xlO1xuICBtYXJnaW4tdG9wOiAwLjVlbTtcbn1cblxuLmNvbnRlbnQgdWwgdWwgdWwge1xuICBsaXN0LXN0eWxlLXR5cGU6IHNxdWFyZTtcbn1cblxuLmNvbnRlbnQgZGQge1xuICBtYXJnaW4tbGVmdDogMmVtO1xufVxuXG4uY29udGVudCBmaWd1cmUge1xuICB0ZXh0LWFsaWduOiBjZW50ZXI7XG59XG5cbi5jb250ZW50IGZpZ3VyZSBpbWcge1xuICBkaXNwbGF5OiBpbmxpbmUtYmxvY2s7XG59XG5cbi5jb250ZW50IGZpZ3VyZSBmaWdjYXB0aW9uIHtcbiAgZm9udC1zdHlsZTogaXRhbGljO1xufVxuXG4uY29udGVudCBwcmUge1xuICAtd2Via2l0LW92ZXJmbG93LXNjcm9sbGluZzogdG91Y2g7XG4gIG92ZXJmbG93LXg6IGF1dG87XG4gIHBhZGRpbmc6IDEuMjVlbSAxLjVlbTtcbiAgd2hpdGUtc3BhY2U6IHByZTtcbiAgd29yZC13cmFwOiBub3JtYWw7XG59XG5cbi5jb250ZW50IHN1cCxcbi5jb250ZW50IHN1YiB7XG4gIGZvbnQtc2l6ZTogNzAlO1xufVxuXG4uY29udGVudCB0YWJsZSB7XG4gIHdpZHRoOiAxMDAlO1xufVxuXG4uY29udGVudCB0YWJsZSB0ZCxcbi5jb250ZW50IHRhYmxlIHRoIHtcbiAgYm9yZGVyOiAxcHggc29saWQgI2RiZGJkYjtcbiAgYm9yZGVyLXdpZHRoOiAwIDAgMXB4O1xuICBwYWRkaW5nOiAwLjVlbSAwLjc1ZW07XG4gIHZlcnRpY2FsLWFsaWduOiB0b3A7XG59XG5cbi5jb250ZW50IHRhYmxlIHRoIHtcbiAgY29sb3I6ICMzNjM2MzY7XG4gIHRleHQtYWxpZ246IGxlZnQ7XG59XG5cbi5jb250ZW50IHRhYmxlIHRyOmhvdmVyIHtcbiAgYmFja2dyb3VuZC1jb2xvcjogd2hpdGVzbW9rZTtcbn1cblxuLmNvbnRlbnQgdGFibGUgdGhlYWQgdGQsXG4uY29udGVudCB0YWJsZSB0aGVhZCB0aCB7XG4gIGJvcmRlci13aWR0aDogMCAwIDJweDtcbiAgY29sb3I6ICMzNjM2MzY7XG59XG5cbi5jb250ZW50IHRhYmxlIHRmb290IHRkLFxuLmNvbnRlbnQgdGFibGUgdGZvb3QgdGgge1xuICBib3JkZXItd2lkdGg6IDJweCAwIDA7XG4gIGNvbG9yOiAjMzYzNjM2O1xufVxuXG4uY29udGVudCB0YWJsZSB0Ym9keSB0cjpsYXN0LWNoaWxkIHRkLFxuLmNvbnRlbnQgdGFibGUgdGJvZHkgdHI6bGFzdC1jaGlsZCB0aCB7XG4gIGJvcmRlci1ib3R0b20td2lkdGg6IDA7XG59XG5cbi5jb250ZW50LmlzLXNtYWxsIHtcbiAgZm9udC1zaXplOiAwLjc1cmVtO1xufVxuXG4uY29udGVudC5pcy1tZWRpdW0ge1xuICBmb250LXNpemU6IDEuMjVyZW07XG59XG5cbi5jb250ZW50LmlzLWxhcmdlIHtcbiAgZm9udC1zaXplOiAxLjVyZW07XG59XG5cbi5pbnB1dCxcbi50ZXh0YXJlYSB7XG4gIC1tb3otYXBwZWFyYW5jZTogbm9uZTtcbiAgLXdlYmtpdC1hcHBlYXJhbmNlOiBub25lO1xuICBhbGlnbi1pdGVtczogY2VudGVyO1xuICBib3JkZXI6IDFweCBzb2xpZCB0cmFuc3BhcmVudDtcbiAgYm9yZGVyLXJhZGl1czogM3B4O1xuICBib3gtc2hhZG93OiBub25lO1xuICBkaXNwbGF5OiBpbmxpbmUtZmxleDtcbiAgZm9udC1zaXplOiAxcmVtO1xuICBoZWlnaHQ6IDIuMjVlbTtcbiAganVzdGlmeS1jb250ZW50OiBmbGV4LXN0YXJ0O1xuICBsaW5lLWhlaWdodDogMS41O1xuICBwYWRkaW5nLWJvdHRvbTogY2FsYygwLjM3NWVtIC0gMXB4KTtcbiAgcGFkZGluZy1sZWZ0OiBjYWxjKDAuNjI1ZW0gLSAxcHgpO1xuICBwYWRkaW5nLXJpZ2h0OiBjYWxjKDAuNjI1ZW0gLSAxcHgpO1xuICBwYWRkaW5nLXRvcDogY2FsYygwLjM3NWVtIC0gMXB4KTtcbiAgcG9zaXRpb246IHJlbGF0aXZlO1xuICB2ZXJ0aWNhbC1hbGlnbjogdG9wO1xuICBiYWNrZ3JvdW5kLWNvbG9yOiB3aGl0ZTtcbiAgYm9yZGVyLWNvbG9yOiAjZGJkYmRiO1xuICBjb2xvcjogIzM2MzYzNjtcbiAgYm94LXNoYWRvdzogaW5zZXQgMCAxcHggMnB4IHJnYmEoMTAsIDEwLCAxMCwgMC4xKTtcbiAgbWF4LXdpZHRoOiAxMDAlO1xuICB3aWR0aDogMTAwJTtcbn1cblxuLmlucHV0OmZvY3VzLCAuaW5wdXQuaXMtZm9jdXNlZCwgLmlucHV0OmFjdGl2ZSwgLmlucHV0LmlzLWFjdGl2ZSxcbi50ZXh0YXJlYTpmb2N1cyxcbi50ZXh0YXJlYS5pcy1mb2N1c2VkLFxuLnRleHRhcmVhOmFjdGl2ZSxcbi50ZXh0YXJlYS5pcy1hY3RpdmUge1xuICBvdXRsaW5lOiBub25lO1xufVxuXG4uaW5wdXRbZGlzYWJsZWRdLFxuLnRleHRhcmVhW2Rpc2FibGVkXSB7XG4gIGN1cnNvcjogbm90LWFsbG93ZWQ7XG59XG5cbi5pbnB1dDpob3ZlciwgLmlucHV0LmlzLWhvdmVyZWQsXG4udGV4dGFyZWE6aG92ZXIsXG4udGV4dGFyZWEuaXMtaG92ZXJlZCB7XG4gIGJvcmRlci1jb2xvcjogI2I1YjViNTtcbn1cblxuLmlucHV0OmZvY3VzLCAuaW5wdXQuaXMtZm9jdXNlZCwgLmlucHV0OmFjdGl2ZSwgLmlucHV0LmlzLWFjdGl2ZSxcbi50ZXh0YXJlYTpmb2N1cyxcbi50ZXh0YXJlYS5pcy1mb2N1c2VkLFxuLnRleHRhcmVhOmFjdGl2ZSxcbi50ZXh0YXJlYS5pcy1hY3RpdmUge1xuICBib3JkZXItY29sb3I6ICMwMGQxYjI7XG59XG5cbi5pbnB1dFtkaXNhYmxlZF0sXG4udGV4dGFyZWFbZGlzYWJsZWRdIHtcbiAgYmFja2dyb3VuZC1jb2xvcjogd2hpdGVzbW9rZTtcbiAgYm9yZGVyLWNvbG9yOiB3aGl0ZXNtb2tlO1xuICBib3gtc2hhZG93OiBub25lO1xuICBjb2xvcjogIzdhN2E3YTtcbn1cblxuLmlucHV0W2Rpc2FibGVkXTo6LW1vei1wbGFjZWhvbGRlcixcbi50ZXh0YXJlYVtkaXNhYmxlZF06Oi1tb3otcGxhY2Vob2xkZXIge1xuICBjb2xvcjogcmdiYSg1NCwgNTQsIDU0LCAwLjMpO1xufVxuXG4uaW5wdXRbZGlzYWJsZWRdOjotd2Via2l0LWlucHV0LXBsYWNlaG9sZGVyLFxuLnRleHRhcmVhW2Rpc2FibGVkXTo6LXdlYmtpdC1pbnB1dC1wbGFjZWhvbGRlciB7XG4gIGNvbG9yOiByZ2JhKDU0LCA1NCwgNTQsIDAuMyk7XG59XG5cbi5pbnB1dFtkaXNhYmxlZF06LW1vei1wbGFjZWhvbGRlcixcbi50ZXh0YXJlYVtkaXNhYmxlZF06LW1vei1wbGFjZWhvbGRlciB7XG4gIGNvbG9yOiByZ2JhKDU0LCA1NCwgNTQsIDAuMyk7XG59XG5cbi5pbnB1dFtkaXNhYmxlZF06LW1zLWlucHV0LXBsYWNlaG9sZGVyLFxuLnRleHRhcmVhW2Rpc2FibGVkXTotbXMtaW5wdXQtcGxhY2Vob2xkZXIge1xuICBjb2xvcjogcmdiYSg1NCwgNTQsIDU0LCAwLjMpO1xufVxuXG4uaW5wdXRbdHlwZT1cInNlYXJjaFwiXSxcbi50ZXh0YXJlYVt0eXBlPVwic2VhcmNoXCJdIHtcbiAgYm9yZGVyLXJhZGl1czogMjkwNDg2cHg7XG59XG5cbi5pbnB1dC5pcy13aGl0ZSxcbi50ZXh0YXJlYS5pcy13aGl0ZSB7XG4gIGJvcmRlci1jb2xvcjogd2hpdGU7XG59XG5cbi5pbnB1dC5pcy1ibGFjayxcbi50ZXh0YXJlYS5pcy1ibGFjayB7XG4gIGJvcmRlci1jb2xvcjogIzBhMGEwYTtcbn1cblxuLmlucHV0LmlzLWxpZ2h0LFxuLnRleHRhcmVhLmlzLWxpZ2h0IHtcbiAgYm9yZGVyLWNvbG9yOiB3aGl0ZXNtb2tlO1xufVxuXG4uaW5wdXQuaXMtZGFyayxcbi50ZXh0YXJlYS5pcy1kYXJrIHtcbiAgYm9yZGVyLWNvbG9yOiAjMzYzNjM2O1xufVxuXG4uaW5wdXQuaXMtcHJpbWFyeSxcbi50ZXh0YXJlYS5pcy1wcmltYXJ5IHtcbiAgYm9yZGVyLWNvbG9yOiAjMDBkMWIyO1xufVxuXG4uaW5wdXQuaXMtaW5mbyxcbi50ZXh0YXJlYS5pcy1pbmZvIHtcbiAgYm9yZGVyLWNvbG9yOiAjMzI3M2RjO1xufVxuXG4uaW5wdXQuaXMtc3VjY2Vzcyxcbi50ZXh0YXJlYS5pcy1zdWNjZXNzIHtcbiAgYm9yZGVyLWNvbG9yOiAjMjNkMTYwO1xufVxuXG4uaW5wdXQuaXMtd2FybmluZyxcbi50ZXh0YXJlYS5pcy13YXJuaW5nIHtcbiAgYm9yZGVyLWNvbG9yOiAjZmZkZDU3O1xufVxuXG4uaW5wdXQuaXMtZGFuZ2VyLFxuLnRleHRhcmVhLmlzLWRhbmdlciB7XG4gIGJvcmRlci1jb2xvcjogI2ZmMzg2MDtcbn1cblxuLmlucHV0LmlzLXNtYWxsLFxuLnRleHRhcmVhLmlzLXNtYWxsIHtcbiAgYm9yZGVyLXJhZGl1czogMnB4O1xuICBmb250LXNpemU6IDAuNzVyZW07XG59XG5cbi5pbnB1dC5pcy1tZWRpdW0sXG4udGV4dGFyZWEuaXMtbWVkaXVtIHtcbiAgZm9udC1zaXplOiAxLjI1cmVtO1xufVxuXG4uaW5wdXQuaXMtbGFyZ2UsXG4udGV4dGFyZWEuaXMtbGFyZ2Uge1xuICBmb250LXNpemU6IDEuNXJlbTtcbn1cblxuLmlucHV0LmlzLWZ1bGx3aWR0aCxcbi50ZXh0YXJlYS5pcy1mdWxsd2lkdGgge1xuICBkaXNwbGF5OiBibG9jaztcbiAgd2lkdGg6IDEwMCU7XG59XG5cbi5pbnB1dC5pcy1pbmxpbmUsXG4udGV4dGFyZWEuaXMtaW5saW5lIHtcbiAgZGlzcGxheTogaW5saW5lO1xuICB3aWR0aDogYXV0bztcbn1cblxuLnRleHRhcmVhIHtcbiAgZGlzcGxheTogYmxvY2s7XG4gIG1heC13aWR0aDogMTAwJTtcbiAgbWluLXdpZHRoOiAxMDAlO1xuICBwYWRkaW5nOiAwLjYyNWVtO1xuICByZXNpemU6IHZlcnRpY2FsO1xufVxuXG4udGV4dGFyZWE6bm90KFtyb3dzXSkge1xuICBtYXgtaGVpZ2h0OiA2MDBweDtcbiAgbWluLWhlaWdodDogMTIwcHg7XG59XG5cbi50ZXh0YXJlYVtyb3dzXSB7XG4gIGhlaWdodDogdW5zZXQ7XG59XG5cbi5jaGVja2JveCxcbi5yYWRpbyB7XG4gIGN1cnNvcjogcG9pbnRlcjtcbiAgZGlzcGxheTogaW5saW5lLWJsb2NrO1xuICBsaW5lLWhlaWdodDogMS4yNTtcbiAgcG9zaXRpb246IHJlbGF0aXZlO1xufVxuXG4uY2hlY2tib3ggaW5wdXQsXG4ucmFkaW8gaW5wdXQge1xuICBjdXJzb3I6IHBvaW50ZXI7XG59XG5cbi5jaGVja2JveDpob3Zlcixcbi5yYWRpbzpob3ZlciB7XG4gIGNvbG9yOiAjMzYzNjM2O1xufVxuXG4uY2hlY2tib3hbZGlzYWJsZWRdLFxuLnJhZGlvW2Rpc2FibGVkXSB7XG4gIGNvbG9yOiAjN2E3YTdhO1xuICBjdXJzb3I6IG5vdC1hbGxvd2VkO1xufVxuXG4ucmFkaW8gKyAucmFkaW8ge1xuICBtYXJnaW4tbGVmdDogMC41ZW07XG59XG5cbi5zZWxlY3Qge1xuICBkaXNwbGF5OiBpbmxpbmUtYmxvY2s7XG4gIG1heC13aWR0aDogMTAwJTtcbiAgcG9zaXRpb246IHJlbGF0aXZlO1xuICB2ZXJ0aWNhbC1hbGlnbjogdG9wO1xufVxuXG4uc2VsZWN0Om5vdCguaXMtbXVsdGlwbGUpIHtcbiAgaGVpZ2h0OiAyLjI1ZW07XG59XG5cbi5zZWxlY3Q6bm90KC5pcy1tdWx0aXBsZSk6OmFmdGVyIHtcbiAgYm9yZGVyOiAxcHggc29saWQgIzAwZDFiMjtcbiAgYm9yZGVyLXJpZ2h0OiAwO1xuICBib3JkZXItdG9wOiAwO1xuICBjb250ZW50OiBcIiBcIjtcbiAgZGlzcGxheTogYmxvY2s7XG4gIGhlaWdodDogMC41ZW07XG4gIHBvaW50ZXItZXZlbnRzOiBub25lO1xuICBwb3NpdGlvbjogYWJzb2x1dGU7XG4gIHRyYW5zZm9ybTogcm90YXRlKC00NWRlZyk7XG4gIHdpZHRoOiAwLjVlbTtcbiAgbWFyZ2luLXRvcDogLTAuMzc1ZW07XG4gIHJpZ2h0OiAxLjEyNWVtO1xuICB0b3A6IDUwJTtcbiAgei1pbmRleDogNDtcbn1cblxuLnNlbGVjdCBzZWxlY3Qge1xuICAtbW96LWFwcGVhcmFuY2U6IG5vbmU7XG4gIC13ZWJraXQtYXBwZWFyYW5jZTogbm9uZTtcbiAgYWxpZ24taXRlbXM6IGNlbnRlcjtcbiAgYm9yZGVyOiAxcHggc29saWQgdHJhbnNwYXJlbnQ7XG4gIGJvcmRlci1yYWRpdXM6IDNweDtcbiAgYm94LXNoYWRvdzogbm9uZTtcbiAgZGlzcGxheTogaW5saW5lLWZsZXg7XG4gIGZvbnQtc2l6ZTogMXJlbTtcbiAgaGVpZ2h0OiAyLjI1ZW07XG4gIGp1c3RpZnktY29udGVudDogZmxleC1zdGFydDtcbiAgbGluZS1oZWlnaHQ6IDEuNTtcbiAgcGFkZGluZy1ib3R0b206IGNhbGMoMC4zNzVlbSAtIDFweCk7XG4gIHBhZGRpbmctbGVmdDogY2FsYygwLjYyNWVtIC0gMXB4KTtcbiAgcGFkZGluZy1yaWdodDogY2FsYygwLjYyNWVtIC0gMXB4KTtcbiAgcGFkZGluZy10b3A6IGNhbGMoMC4zNzVlbSAtIDFweCk7XG4gIHBvc2l0aW9uOiByZWxhdGl2ZTtcbiAgdmVydGljYWwtYWxpZ246IHRvcDtcbiAgYmFja2dyb3VuZC1jb2xvcjogd2hpdGU7XG4gIGJvcmRlci1jb2xvcjogI2RiZGJkYjtcbiAgY29sb3I6ICMzNjM2MzY7XG4gIGN1cnNvcjogcG9pbnRlcjtcbiAgZGlzcGxheTogYmxvY2s7XG4gIGZvbnQtc2l6ZTogMWVtO1xuICBtYXgtd2lkdGg6IDEwMCU7XG4gIG91dGxpbmU6IG5vbmU7XG59XG5cbi5zZWxlY3Qgc2VsZWN0OmZvY3VzLCAuc2VsZWN0IHNlbGVjdC5pcy1mb2N1c2VkLCAuc2VsZWN0IHNlbGVjdDphY3RpdmUsIC5zZWxlY3Qgc2VsZWN0LmlzLWFjdGl2ZSB7XG4gIG91dGxpbmU6IG5vbmU7XG59XG5cbi5zZWxlY3Qgc2VsZWN0W2Rpc2FibGVkXSB7XG4gIGN1cnNvcjogbm90LWFsbG93ZWQ7XG59XG5cbi5zZWxlY3Qgc2VsZWN0OmhvdmVyLCAuc2VsZWN0IHNlbGVjdC5pcy1ob3ZlcmVkIHtcbiAgYm9yZGVyLWNvbG9yOiAjYjViNWI1O1xufVxuXG4uc2VsZWN0IHNlbGVjdDpmb2N1cywgLnNlbGVjdCBzZWxlY3QuaXMtZm9jdXNlZCwgLnNlbGVjdCBzZWxlY3Q6YWN0aXZlLCAuc2VsZWN0IHNlbGVjdC5pcy1hY3RpdmUge1xuICBib3JkZXItY29sb3I6ICMwMGQxYjI7XG59XG5cbi5zZWxlY3Qgc2VsZWN0W2Rpc2FibGVkXSB7XG4gIGJhY2tncm91bmQtY29sb3I6IHdoaXRlc21va2U7XG4gIGJvcmRlci1jb2xvcjogd2hpdGVzbW9rZTtcbiAgYm94LXNoYWRvdzogbm9uZTtcbiAgY29sb3I6ICM3YTdhN2E7XG59XG5cbi5zZWxlY3Qgc2VsZWN0W2Rpc2FibGVkXTo6LW1vei1wbGFjZWhvbGRlciB7XG4gIGNvbG9yOiByZ2JhKDU0LCA1NCwgNTQsIDAuMyk7XG59XG5cbi5zZWxlY3Qgc2VsZWN0W2Rpc2FibGVkXTo6LXdlYmtpdC1pbnB1dC1wbGFjZWhvbGRlciB7XG4gIGNvbG9yOiByZ2JhKDU0LCA1NCwgNTQsIDAuMyk7XG59XG5cbi5zZWxlY3Qgc2VsZWN0W2Rpc2FibGVkXTotbW96LXBsYWNlaG9sZGVyIHtcbiAgY29sb3I6IHJnYmEoNTQsIDU0LCA1NCwgMC4zKTtcbn1cblxuLnNlbGVjdCBzZWxlY3RbZGlzYWJsZWRdOi1tcy1pbnB1dC1wbGFjZWhvbGRlciB7XG4gIGNvbG9yOiByZ2JhKDU0LCA1NCwgNTQsIDAuMyk7XG59XG5cbi5zZWxlY3Qgc2VsZWN0OmhvdmVyIHtcbiAgYm9yZGVyLWNvbG9yOiAjYjViNWI1O1xufVxuXG4uc2VsZWN0IHNlbGVjdDpmb2N1cywgLnNlbGVjdCBzZWxlY3QuaXMtZm9jdXNlZCwgLnNlbGVjdCBzZWxlY3Q6YWN0aXZlLCAuc2VsZWN0IHNlbGVjdC5pcy1hY3RpdmUge1xuICBib3JkZXItY29sb3I6ICMwMGQxYjI7XG59XG5cbi5zZWxlY3Qgc2VsZWN0OjotbXMtZXhwYW5kIHtcbiAgZGlzcGxheTogbm9uZTtcbn1cblxuLnNlbGVjdCBzZWxlY3RbZGlzYWJsZWRdOmhvdmVyIHtcbiAgYm9yZGVyLWNvbG9yOiB3aGl0ZXNtb2tlO1xufVxuXG4uc2VsZWN0IHNlbGVjdDpub3QoW211bHRpcGxlXSkge1xuICBwYWRkaW5nLXJpZ2h0OiAyLjVlbTtcbn1cblxuLnNlbGVjdCBzZWxlY3RbbXVsdGlwbGVdIHtcbiAgaGVpZ2h0OiB1bnNldDtcbiAgcGFkZGluZzogMDtcbn1cblxuLnNlbGVjdCBzZWxlY3RbbXVsdGlwbGVdIG9wdGlvbiB7XG4gIHBhZGRpbmc6IDAuNWVtIDFlbTtcbn1cblxuLnNlbGVjdDpob3Zlcjo6YWZ0ZXIge1xuICBib3JkZXItY29sb3I6ICMzNjM2MzY7XG59XG5cbi5zZWxlY3QuaXMtd2hpdGUgc2VsZWN0IHtcbiAgYm9yZGVyLWNvbG9yOiB3aGl0ZTtcbn1cblxuLnNlbGVjdC5pcy1ibGFjayBzZWxlY3Qge1xuICBib3JkZXItY29sb3I6ICMwYTBhMGE7XG59XG5cbi5zZWxlY3QuaXMtbGlnaHQgc2VsZWN0IHtcbiAgYm9yZGVyLWNvbG9yOiB3aGl0ZXNtb2tlO1xufVxuXG4uc2VsZWN0LmlzLWRhcmsgc2VsZWN0IHtcbiAgYm9yZGVyLWNvbG9yOiAjMzYzNjM2O1xufVxuXG4uc2VsZWN0LmlzLXByaW1hcnkgc2VsZWN0IHtcbiAgYm9yZGVyLWNvbG9yOiAjMDBkMWIyO1xufVxuXG4uc2VsZWN0LmlzLWluZm8gc2VsZWN0IHtcbiAgYm9yZGVyLWNvbG9yOiAjMzI3M2RjO1xufVxuXG4uc2VsZWN0LmlzLXN1Y2Nlc3Mgc2VsZWN0IHtcbiAgYm9yZGVyLWNvbG9yOiAjMjNkMTYwO1xufVxuXG4uc2VsZWN0LmlzLXdhcm5pbmcgc2VsZWN0IHtcbiAgYm9yZGVyLWNvbG9yOiAjZmZkZDU3O1xufVxuXG4uc2VsZWN0LmlzLWRhbmdlciBzZWxlY3Qge1xuICBib3JkZXItY29sb3I6ICNmZjM4NjA7XG59XG5cbi5zZWxlY3QuaXMtc21hbGwge1xuICBib3JkZXItcmFkaXVzOiAycHg7XG4gIGZvbnQtc2l6ZTogMC43NXJlbTtcbn1cblxuLnNlbGVjdC5pcy1tZWRpdW0ge1xuICBmb250LXNpemU6IDEuMjVyZW07XG59XG5cbi5zZWxlY3QuaXMtbGFyZ2Uge1xuICBmb250LXNpemU6IDEuNXJlbTtcbn1cblxuLnNlbGVjdC5pcy1kaXNhYmxlZDo6YWZ0ZXIge1xuICBib3JkZXItY29sb3I6ICM3YTdhN2E7XG59XG5cbi5zZWxlY3QuaXMtZnVsbHdpZHRoIHtcbiAgd2lkdGg6IDEwMCU7XG59XG5cbi5zZWxlY3QuaXMtZnVsbHdpZHRoIHNlbGVjdCB7XG4gIHdpZHRoOiAxMDAlO1xufVxuXG4uc2VsZWN0LmlzLWxvYWRpbmc6OmFmdGVyIHtcbiAgYW5pbWF0aW9uOiBzcGluQXJvdW5kIDUwMG1zIGluZmluaXRlIGxpbmVhcjtcbiAgYm9yZGVyOiAycHggc29saWQgI2RiZGJkYjtcbiAgYm9yZGVyLXJhZGl1czogMjkwNDg2cHg7XG4gIGJvcmRlci1yaWdodC1jb2xvcjogdHJhbnNwYXJlbnQ7XG4gIGJvcmRlci10b3AtY29sb3I6IHRyYW5zcGFyZW50O1xuICBjb250ZW50OiBcIlwiO1xuICBkaXNwbGF5OiBibG9jaztcbiAgaGVpZ2h0OiAxZW07XG4gIHBvc2l0aW9uOiByZWxhdGl2ZTtcbiAgd2lkdGg6IDFlbTtcbiAgbWFyZ2luLXRvcDogMDtcbiAgcG9zaXRpb246IGFic29sdXRlO1xuICByaWdodDogMC42MjVlbTtcbiAgdG9wOiAwLjYyNWVtO1xuICB0cmFuc2Zvcm06IG5vbmU7XG59XG5cbi5zZWxlY3QuaXMtbG9hZGluZy5pcy1zbWFsbDphZnRlciB7XG4gIGZvbnQtc2l6ZTogMC43NXJlbTtcbn1cblxuLnNlbGVjdC5pcy1sb2FkaW5nLmlzLW1lZGl1bTphZnRlciB7XG4gIGZvbnQtc2l6ZTogMS4yNXJlbTtcbn1cblxuLnNlbGVjdC5pcy1sb2FkaW5nLmlzLWxhcmdlOmFmdGVyIHtcbiAgZm9udC1zaXplOiAxLjVyZW07XG59XG5cbi5sYWJlbCB7XG4gIGNvbG9yOiAjMzYzNjM2O1xuICBkaXNwbGF5OiBibG9jaztcbiAgZm9udC1zaXplOiAxcmVtO1xuICBmb250LXdlaWdodDogNzAwO1xufVxuXG4ubGFiZWw6bm90KDpsYXN0LWNoaWxkKSB7XG4gIG1hcmdpbi1ib3R0b206IDAuNWVtO1xufVxuXG4ubGFiZWwuaXMtc21hbGwge1xuICBmb250LXNpemU6IDAuNzVyZW07XG59XG5cbi5sYWJlbC5pcy1tZWRpdW0ge1xuICBmb250LXNpemU6IDEuMjVyZW07XG59XG5cbi5sYWJlbC5pcy1sYXJnZSB7XG4gIGZvbnQtc2l6ZTogMS41cmVtO1xufVxuXG4uaGVscCB7XG4gIGRpc3BsYXk6IGJsb2NrO1xuICBmb250LXNpemU6IDAuNzVyZW07XG4gIG1hcmdpbi10b3A6IDAuMjVyZW07XG59XG5cbi5oZWxwLmlzLXdoaXRlIHtcbiAgY29sb3I6IHdoaXRlO1xufVxuXG4uaGVscC5pcy1ibGFjayB7XG4gIGNvbG9yOiAjMGEwYTBhO1xufVxuXG4uaGVscC5pcy1saWdodCB7XG4gIGNvbG9yOiB3aGl0ZXNtb2tlO1xufVxuXG4uaGVscC5pcy1kYXJrIHtcbiAgY29sb3I6ICMzNjM2MzY7XG59XG5cbi5oZWxwLmlzLXByaW1hcnkge1xuICBjb2xvcjogIzAwZDFiMjtcbn1cblxuLmhlbHAuaXMtaW5mbyB7XG4gIGNvbG9yOiAjMzI3M2RjO1xufVxuXG4uaGVscC5pcy1zdWNjZXNzIHtcbiAgY29sb3I6ICMyM2QxNjA7XG59XG5cbi5oZWxwLmlzLXdhcm5pbmcge1xuICBjb2xvcjogI2ZmZGQ1Nztcbn1cblxuLmhlbHAuaXMtZGFuZ2VyIHtcbiAgY29sb3I6ICNmZjM4NjA7XG59XG5cbi5maWVsZDpub3QoOmxhc3QtY2hpbGQpIHtcbiAgbWFyZ2luLWJvdHRvbTogMC43NXJlbTtcbn1cblxuLmZpZWxkLmhhcy1hZGRvbnMge1xuICBkaXNwbGF5OiBmbGV4O1xuICBqdXN0aWZ5LWNvbnRlbnQ6IGZsZXgtc3RhcnQ7XG59XG5cbi5maWVsZC5oYXMtYWRkb25zIC5jb250cm9sOm5vdCg6bGFzdC1jaGlsZCkge1xuICBtYXJnaW4tcmlnaHQ6IC0xcHg7XG59XG5cbi5maWVsZC5oYXMtYWRkb25zIC5jb250cm9sOmZpcnN0LWNoaWxkIC5idXR0b24sXG4uZmllbGQuaGFzLWFkZG9ucyAuY29udHJvbDpmaXJzdC1jaGlsZCAuaW5wdXQsXG4uZmllbGQuaGFzLWFkZG9ucyAuY29udHJvbDpmaXJzdC1jaGlsZCAuc2VsZWN0IHNlbGVjdCB7XG4gIGJvcmRlci1ib3R0b20tbGVmdC1yYWRpdXM6IDNweDtcbiAgYm9yZGVyLXRvcC1sZWZ0LXJhZGl1czogM3B4O1xufVxuXG4uZmllbGQuaGFzLWFkZG9ucyAuY29udHJvbDpsYXN0LWNoaWxkIC5idXR0b24sXG4uZmllbGQuaGFzLWFkZG9ucyAuY29udHJvbDpsYXN0LWNoaWxkIC5pbnB1dCxcbi5maWVsZC5oYXMtYWRkb25zIC5jb250cm9sOmxhc3QtY2hpbGQgLnNlbGVjdCBzZWxlY3Qge1xuICBib3JkZXItYm90dG9tLXJpZ2h0LXJhZGl1czogM3B4O1xuICBib3JkZXItdG9wLXJpZ2h0LXJhZGl1czogM3B4O1xufVxuXG4uZmllbGQuaGFzLWFkZG9ucyAuY29udHJvbCAuYnV0dG9uLFxuLmZpZWxkLmhhcy1hZGRvbnMgLmNvbnRyb2wgLmlucHV0LFxuLmZpZWxkLmhhcy1hZGRvbnMgLmNvbnRyb2wgLnNlbGVjdCBzZWxlY3Qge1xuICBib3JkZXItcmFkaXVzOiAwO1xufVxuXG4uZmllbGQuaGFzLWFkZG9ucyAuY29udHJvbCAuYnV0dG9uOmhvdmVyLCAuZmllbGQuaGFzLWFkZG9ucyAuY29udHJvbCAuYnV0dG9uLmlzLWhvdmVyZWQsXG4uZmllbGQuaGFzLWFkZG9ucyAuY29udHJvbCAuaW5wdXQ6aG92ZXIsXG4uZmllbGQuaGFzLWFkZG9ucyAuY29udHJvbCAuaW5wdXQuaXMtaG92ZXJlZCxcbi5maWVsZC5oYXMtYWRkb25zIC5jb250cm9sIC5zZWxlY3Qgc2VsZWN0OmhvdmVyLFxuLmZpZWxkLmhhcy1hZGRvbnMgLmNvbnRyb2wgLnNlbGVjdCBzZWxlY3QuaXMtaG92ZXJlZCB7XG4gIHotaW5kZXg6IDI7XG59XG5cbi5maWVsZC5oYXMtYWRkb25zIC5jb250cm9sIC5idXR0b246Zm9jdXMsIC5maWVsZC5oYXMtYWRkb25zIC5jb250cm9sIC5idXR0b24uaXMtZm9jdXNlZCwgLmZpZWxkLmhhcy1hZGRvbnMgLmNvbnRyb2wgLmJ1dHRvbjphY3RpdmUsIC5maWVsZC5oYXMtYWRkb25zIC5jb250cm9sIC5idXR0b24uaXMtYWN0aXZlLFxuLmZpZWxkLmhhcy1hZGRvbnMgLmNvbnRyb2wgLmlucHV0OmZvY3VzLFxuLmZpZWxkLmhhcy1hZGRvbnMgLmNvbnRyb2wgLmlucHV0LmlzLWZvY3VzZWQsXG4uZmllbGQuaGFzLWFkZG9ucyAuY29udHJvbCAuaW5wdXQ6YWN0aXZlLFxuLmZpZWxkLmhhcy1hZGRvbnMgLmNvbnRyb2wgLmlucHV0LmlzLWFjdGl2ZSxcbi5maWVsZC5oYXMtYWRkb25zIC5jb250cm9sIC5zZWxlY3Qgc2VsZWN0OmZvY3VzLFxuLmZpZWxkLmhhcy1hZGRvbnMgLmNvbnRyb2wgLnNlbGVjdCBzZWxlY3QuaXMtZm9jdXNlZCxcbi5maWVsZC5oYXMtYWRkb25zIC5jb250cm9sIC5zZWxlY3Qgc2VsZWN0OmFjdGl2ZSxcbi5maWVsZC5oYXMtYWRkb25zIC5jb250cm9sIC5zZWxlY3Qgc2VsZWN0LmlzLWFjdGl2ZSB7XG4gIHotaW5kZXg6IDM7XG59XG5cbi5maWVsZC5oYXMtYWRkb25zIC5jb250cm9sIC5idXR0b246Zm9jdXM6aG92ZXIsIC5maWVsZC5oYXMtYWRkb25zIC5jb250cm9sIC5idXR0b24uaXMtZm9jdXNlZDpob3ZlciwgLmZpZWxkLmhhcy1hZGRvbnMgLmNvbnRyb2wgLmJ1dHRvbjphY3RpdmU6aG92ZXIsIC5maWVsZC5oYXMtYWRkb25zIC5jb250cm9sIC5idXR0b24uaXMtYWN0aXZlOmhvdmVyLFxuLmZpZWxkLmhhcy1hZGRvbnMgLmNvbnRyb2wgLmlucHV0OmZvY3VzOmhvdmVyLFxuLmZpZWxkLmhhcy1hZGRvbnMgLmNvbnRyb2wgLmlucHV0LmlzLWZvY3VzZWQ6aG92ZXIsXG4uZmllbGQuaGFzLWFkZG9ucyAuY29udHJvbCAuaW5wdXQ6YWN0aXZlOmhvdmVyLFxuLmZpZWxkLmhhcy1hZGRvbnMgLmNvbnRyb2wgLmlucHV0LmlzLWFjdGl2ZTpob3Zlcixcbi5maWVsZC5oYXMtYWRkb25zIC5jb250cm9sIC5zZWxlY3Qgc2VsZWN0OmZvY3VzOmhvdmVyLFxuLmZpZWxkLmhhcy1hZGRvbnMgLmNvbnRyb2wgLnNlbGVjdCBzZWxlY3QuaXMtZm9jdXNlZDpob3Zlcixcbi5maWVsZC5oYXMtYWRkb25zIC5jb250cm9sIC5zZWxlY3Qgc2VsZWN0OmFjdGl2ZTpob3Zlcixcbi5maWVsZC5oYXMtYWRkb25zIC5jb250cm9sIC5zZWxlY3Qgc2VsZWN0LmlzLWFjdGl2ZTpob3ZlciB7XG4gIHotaW5kZXg6IDQ7XG59XG5cbi5maWVsZC5oYXMtYWRkb25zIC5jb250cm9sLmlzLWV4cGFuZGVkIHtcbiAgZmxleC1ncm93OiAxO1xufVxuXG4uZmllbGQuaGFzLWFkZG9ucy5oYXMtYWRkb25zLWNlbnRlcmVkIHtcbiAganVzdGlmeS1jb250ZW50OiBjZW50ZXI7XG59XG5cbi5maWVsZC5oYXMtYWRkb25zLmhhcy1hZGRvbnMtcmlnaHQge1xuICBqdXN0aWZ5LWNvbnRlbnQ6IGZsZXgtZW5kO1xufVxuXG4uZmllbGQuaGFzLWFkZG9ucy5oYXMtYWRkb25zLWZ1bGx3aWR0aCAuY29udHJvbCB7XG4gIGZsZXgtZ3JvdzogMTtcbiAgZmxleC1zaHJpbms6IDA7XG59XG5cbi5maWVsZC5pcy1ncm91cGVkIHtcbiAgZGlzcGxheTogZmxleDtcbiAganVzdGlmeS1jb250ZW50OiBmbGV4LXN0YXJ0O1xufVxuXG4uZmllbGQuaXMtZ3JvdXBlZCA+IC5jb250cm9sIHtcbiAgZmxleC1zaHJpbms6IDA7XG59XG5cbi5maWVsZC5pcy1ncm91cGVkID4gLmNvbnRyb2w6bm90KDpsYXN0LWNoaWxkKSB7XG4gIG1hcmdpbi1ib3R0b206IDA7XG4gIG1hcmdpbi1yaWdodDogMC43NXJlbTtcbn1cblxuLmZpZWxkLmlzLWdyb3VwZWQgPiAuY29udHJvbC5pcy1leHBhbmRlZCB7XG4gIGZsZXgtZ3JvdzogMTtcbiAgZmxleC1zaHJpbms6IDE7XG59XG5cbi5maWVsZC5pcy1ncm91cGVkLmlzLWdyb3VwZWQtY2VudGVyZWQge1xuICBqdXN0aWZ5LWNvbnRlbnQ6IGNlbnRlcjtcbn1cblxuLmZpZWxkLmlzLWdyb3VwZWQuaXMtZ3JvdXBlZC1yaWdodCB7XG4gIGp1c3RpZnktY29udGVudDogZmxleC1lbmQ7XG59XG5cbkBtZWRpYSBzY3JlZW4gYW5kIChtaW4td2lkdGg6IDc2OXB4KSwgcHJpbnQge1xuICAuZmllbGQuaXMtaG9yaXpvbnRhbCB7XG4gICAgZGlzcGxheTogZmxleDtcbiAgfVxufVxuXG4uZmllbGQtbGFiZWwgLmxhYmVsIHtcbiAgZm9udC1zaXplOiBpbmhlcml0O1xufVxuXG5AbWVkaWEgc2NyZWVuIGFuZCAobWF4LXdpZHRoOiA3NjhweCkge1xuICAuZmllbGQtbGFiZWwge1xuICAgIG1hcmdpbi1ib3R0b206IDAuNXJlbTtcbiAgfVxufVxuXG5AbWVkaWEgc2NyZWVuIGFuZCAobWluLXdpZHRoOiA3NjlweCksIHByaW50IHtcbiAgLmZpZWxkLWxhYmVsIHtcbiAgICBmbGV4LWJhc2lzOiAwO1xuICAgIGZsZXgtZ3JvdzogMTtcbiAgICBmbGV4LXNocmluazogMDtcbiAgICBtYXJnaW4tcmlnaHQ6IDEuNXJlbTtcbiAgICB0ZXh0LWFsaWduOiByaWdodDtcbiAgfVxuICAuZmllbGQtbGFiZWwuaXMtc21hbGwge1xuICAgIGZvbnQtc2l6ZTogMC43NXJlbTtcbiAgICBwYWRkaW5nLXRvcDogMC4zNzVlbTtcbiAgfVxuICAuZmllbGQtbGFiZWwuaXMtbm9ybWFsIHtcbiAgICBwYWRkaW5nLXRvcDogMC4zNzVlbTtcbiAgfVxuICAuZmllbGQtbGFiZWwuaXMtbWVkaXVtIHtcbiAgICBmb250LXNpemU6IDEuMjVyZW07XG4gICAgcGFkZGluZy10b3A6IDAuMzc1ZW07XG4gIH1cbiAgLmZpZWxkLWxhYmVsLmlzLWxhcmdlIHtcbiAgICBmb250LXNpemU6IDEuNXJlbTtcbiAgICBwYWRkaW5nLXRvcDogMC4zNzVlbTtcbiAgfVxufVxuXG4uZmllbGQtYm9keSAuZmllbGQgLmZpZWxkIHtcbiAgbWFyZ2luLWJvdHRvbTogMDtcbn1cblxuQG1lZGlhIHNjcmVlbiBhbmQgKG1pbi13aWR0aDogNzY5cHgpLCBwcmludCB7XG4gIC5maWVsZC1ib2R5IHtcbiAgICBkaXNwbGF5OiBmbGV4O1xuICAgIGZsZXgtYmFzaXM6IDA7XG4gICAgZmxleC1ncm93OiA1O1xuICAgIGZsZXgtc2hyaW5rOiAxO1xuICB9XG4gIC5maWVsZC1ib2R5IC5maWVsZCB7XG4gICAgbWFyZ2luLWJvdHRvbTogMDtcbiAgfVxuICAuZmllbGQtYm9keSA+IC5maWVsZCB7XG4gICAgZmxleC1zaHJpbms6IDE7XG4gIH1cbiAgLmZpZWxkLWJvZHkgPiAuZmllbGQ6bm90KC5pcy1uYXJyb3cpIHtcbiAgICBmbGV4LWdyb3c6IDE7XG4gIH1cbiAgLmZpZWxkLWJvZHkgPiAuZmllbGQ6bm90KDpsYXN0LWNoaWxkKSB7XG4gICAgbWFyZ2luLXJpZ2h0OiAwLjc1cmVtO1xuICB9XG59XG5cbi5jb250cm9sIHtcbiAgZm9udC1zaXplOiAxcmVtO1xuICBwb3NpdGlvbjogcmVsYXRpdmU7XG4gIHRleHQtYWxpZ246IGxlZnQ7XG59XG5cbi5jb250cm9sLmhhcy1pY29uIC5pY29uIHtcbiAgY29sb3I6ICNkYmRiZGI7XG4gIGhlaWdodDogMi4yNWVtO1xuICBwb2ludGVyLWV2ZW50czogbm9uZTtcbiAgcG9zaXRpb246IGFic29sdXRlO1xuICB0b3A6IDA7XG4gIHdpZHRoOiAyLjI1ZW07XG4gIHotaW5kZXg6IDQ7XG59XG5cbi5jb250cm9sLmhhcy1pY29uIC5pbnB1dDpmb2N1cyArIC5pY29uIHtcbiAgY29sb3I6ICM3YTdhN2E7XG59XG5cbi5jb250cm9sLmhhcy1pY29uIC5pbnB1dC5pcy1zbWFsbCArIC5pY29uIHtcbiAgZm9udC1zaXplOiAwLjc1cmVtO1xufVxuXG4uY29udHJvbC5oYXMtaWNvbiAuaW5wdXQuaXMtbWVkaXVtICsgLmljb24ge1xuICBmb250LXNpemU6IDEuMjVyZW07XG59XG5cbi5jb250cm9sLmhhcy1pY29uIC5pbnB1dC5pcy1sYXJnZSArIC5pY29uIHtcbiAgZm9udC1zaXplOiAxLjVyZW07XG59XG5cbi5jb250cm9sLmhhcy1pY29uOm5vdCguaGFzLWljb24tcmlnaHQpIC5pY29uIHtcbiAgbGVmdDogMDtcbn1cblxuLmNvbnRyb2wuaGFzLWljb246bm90KC5oYXMtaWNvbi1yaWdodCkgLmlucHV0IHtcbiAgcGFkZGluZy1sZWZ0OiAyLjI1ZW07XG59XG5cbi5jb250cm9sLmhhcy1pY29uLmhhcy1pY29uLXJpZ2h0IC5pY29uIHtcbiAgcmlnaHQ6IDA7XG59XG5cbi5jb250cm9sLmhhcy1pY29uLmhhcy1pY29uLXJpZ2h0IC5pbnB1dCB7XG4gIHBhZGRpbmctcmlnaHQ6IDIuMjVlbTtcbn1cblxuLmNvbnRyb2wuaGFzLWljb25zLWxlZnQgLmlucHV0OmZvY3VzIH4gLmljb24sXG4uY29udHJvbC5oYXMtaWNvbnMtbGVmdCAuc2VsZWN0OmZvY3VzIH4gLmljb24sIC5jb250cm9sLmhhcy1pY29ucy1yaWdodCAuaW5wdXQ6Zm9jdXMgfiAuaWNvbixcbi5jb250cm9sLmhhcy1pY29ucy1yaWdodCAuc2VsZWN0OmZvY3VzIH4gLmljb24ge1xuICBjb2xvcjogIzdhN2E3YTtcbn1cblxuLmNvbnRyb2wuaGFzLWljb25zLWxlZnQgLmlucHV0LmlzLXNtYWxsIH4gLmljb24sXG4uY29udHJvbC5oYXMtaWNvbnMtbGVmdCAuc2VsZWN0LmlzLXNtYWxsIH4gLmljb24sIC5jb250cm9sLmhhcy1pY29ucy1yaWdodCAuaW5wdXQuaXMtc21hbGwgfiAuaWNvbixcbi5jb250cm9sLmhhcy1pY29ucy1yaWdodCAuc2VsZWN0LmlzLXNtYWxsIH4gLmljb24ge1xuICBmb250LXNpemU6IDAuNzVyZW07XG59XG5cbi5jb250cm9sLmhhcy1pY29ucy1sZWZ0IC5pbnB1dC5pcy1tZWRpdW0gfiAuaWNvbixcbi5jb250cm9sLmhhcy1pY29ucy1sZWZ0IC5zZWxlY3QuaXMtbWVkaXVtIH4gLmljb24sIC5jb250cm9sLmhhcy1pY29ucy1yaWdodCAuaW5wdXQuaXMtbWVkaXVtIH4gLmljb24sXG4uY29udHJvbC5oYXMtaWNvbnMtcmlnaHQgLnNlbGVjdC5pcy1tZWRpdW0gfiAuaWNvbiB7XG4gIGZvbnQtc2l6ZTogMS4yNXJlbTtcbn1cblxuLmNvbnRyb2wuaGFzLWljb25zLWxlZnQgLmlucHV0LmlzLWxhcmdlIH4gLmljb24sXG4uY29udHJvbC5oYXMtaWNvbnMtbGVmdCAuc2VsZWN0LmlzLWxhcmdlIH4gLmljb24sIC5jb250cm9sLmhhcy1pY29ucy1yaWdodCAuaW5wdXQuaXMtbGFyZ2UgfiAuaWNvbixcbi5jb250cm9sLmhhcy1pY29ucy1yaWdodCAuc2VsZWN0LmlzLWxhcmdlIH4gLmljb24ge1xuICBmb250LXNpemU6IDEuNXJlbTtcbn1cblxuLmNvbnRyb2wuaGFzLWljb25zLWxlZnQgLmljb24sIC5jb250cm9sLmhhcy1pY29ucy1yaWdodCAuaWNvbiB7XG4gIGNvbG9yOiAjZGJkYmRiO1xuICBoZWlnaHQ6IDIuMjVlbTtcbiAgcG9pbnRlci1ldmVudHM6IG5vbmU7XG4gIHBvc2l0aW9uOiBhYnNvbHV0ZTtcbiAgdG9wOiAwO1xuICB3aWR0aDogMi4yNWVtO1xuICB6LWluZGV4OiA0O1xufVxuXG4uY29udHJvbC5oYXMtaWNvbnMtbGVmdCAuaW5wdXQsXG4uY29udHJvbC5oYXMtaWNvbnMtbGVmdCAuc2VsZWN0IHNlbGVjdCB7XG4gIHBhZGRpbmctbGVmdDogMi4yNWVtO1xufVxuXG4uY29udHJvbC5oYXMtaWNvbnMtbGVmdCAuaWNvbi5pcy1sZWZ0IHtcbiAgbGVmdDogMDtcbn1cblxuLmNvbnRyb2wuaGFzLWljb25zLXJpZ2h0IC5pbnB1dCxcbi5jb250cm9sLmhhcy1pY29ucy1yaWdodCAuc2VsZWN0IHNlbGVjdCB7XG4gIHBhZGRpbmctcmlnaHQ6IDIuMjVlbTtcbn1cblxuLmNvbnRyb2wuaGFzLWljb25zLXJpZ2h0IC5pY29uLmlzLXJpZ2h0IHtcbiAgcmlnaHQ6IDA7XG59XG5cbi5jb250cm9sLmlzLWxvYWRpbmc6OmFmdGVyIHtcbiAgYW5pbWF0aW9uOiBzcGluQXJvdW5kIDUwMG1zIGluZmluaXRlIGxpbmVhcjtcbiAgYm9yZGVyOiAycHggc29saWQgI2RiZGJkYjtcbiAgYm9yZGVyLXJhZGl1czogMjkwNDg2cHg7XG4gIGJvcmRlci1yaWdodC1jb2xvcjogdHJhbnNwYXJlbnQ7XG4gIGJvcmRlci10b3AtY29sb3I6IHRyYW5zcGFyZW50O1xuICBjb250ZW50OiBcIlwiO1xuICBkaXNwbGF5OiBibG9jaztcbiAgaGVpZ2h0OiAxZW07XG4gIHBvc2l0aW9uOiByZWxhdGl2ZTtcbiAgd2lkdGg6IDFlbTtcbiAgcG9zaXRpb246IGFic29sdXRlICFpbXBvcnRhbnQ7XG4gIHJpZ2h0OiAwLjYyNWVtO1xuICB0b3A6IDAuNjI1ZW07XG59XG5cbi5jb250cm9sLmlzLWxvYWRpbmcuaXMtc21hbGw6YWZ0ZXIge1xuICBmb250LXNpemU6IDAuNzVyZW07XG59XG5cbi5jb250cm9sLmlzLWxvYWRpbmcuaXMtbWVkaXVtOmFmdGVyIHtcbiAgZm9udC1zaXplOiAxLjI1cmVtO1xufVxuXG4uY29udHJvbC5pcy1sb2FkaW5nLmlzLWxhcmdlOmFmdGVyIHtcbiAgZm9udC1zaXplOiAxLjVyZW07XG59XG5cbi5pY29uIHtcbiAgYWxpZ24taXRlbXM6IGNlbnRlcjtcbiAgZGlzcGxheTogaW5saW5lLWZsZXg7XG4gIGp1c3RpZnktY29udGVudDogY2VudGVyO1xuICBoZWlnaHQ6IDEuNXJlbTtcbiAgd2lkdGg6IDEuNXJlbTtcbn1cblxuLmljb24gLmZhIHtcbiAgZm9udC1zaXplOiAyMXB4O1xufVxuXG4uaWNvbi5pcy1zbWFsbCB7XG4gIGhlaWdodDogMXJlbTtcbiAgd2lkdGg6IDFyZW07XG59XG5cbi5pY29uLmlzLXNtYWxsIC5mYSB7XG4gIGZvbnQtc2l6ZTogMTRweDtcbn1cblxuLmljb24uaXMtbWVkaXVtIHtcbiAgaGVpZ2h0OiAycmVtO1xuICB3aWR0aDogMnJlbTtcbn1cblxuLmljb24uaXMtbWVkaXVtIC5mYSB7XG4gIGZvbnQtc2l6ZTogMjhweDtcbn1cblxuLmljb24uaXMtbGFyZ2Uge1xuICBoZWlnaHQ6IDNyZW07XG4gIHdpZHRoOiAzcmVtO1xufVxuXG4uaWNvbi5pcy1sYXJnZSAuZmEge1xuICBmb250LXNpemU6IDQycHg7XG59XG5cbi5pbWFnZSB7XG4gIGRpc3BsYXk6IGJsb2NrO1xuICBwb3NpdGlvbjogcmVsYXRpdmU7XG59XG5cbi5pbWFnZSBpbWcge1xuICBkaXNwbGF5OiBibG9jaztcbiAgaGVpZ2h0OiBhdXRvO1xuICB3aWR0aDogMTAwJTtcbn1cblxuLmltYWdlLmlzLXNxdWFyZSBpbWcsIC5pbWFnZS5pcy0xYnkxIGltZywgLmltYWdlLmlzLTRieTMgaW1nLCAuaW1hZ2UuaXMtM2J5MiBpbWcsIC5pbWFnZS5pcy0xNmJ5OSBpbWcsIC5pbWFnZS5pcy0yYnkxIGltZyB7XG4gIGJvdHRvbTogMDtcbiAgbGVmdDogMDtcbiAgcG9zaXRpb246IGFic29sdXRlO1xuICByaWdodDogMDtcbiAgdG9wOiAwO1xuICBoZWlnaHQ6IDEwMCU7XG4gIHdpZHRoOiAxMDAlO1xufVxuXG4uaW1hZ2UuaXMtc3F1YXJlLCAuaW1hZ2UuaXMtMWJ5MSB7XG4gIHBhZGRpbmctdG9wOiAxMDAlO1xufVxuXG4uaW1hZ2UuaXMtNGJ5MyB7XG4gIHBhZGRpbmctdG9wOiA3NSU7XG59XG5cbi5pbWFnZS5pcy0zYnkyIHtcbiAgcGFkZGluZy10b3A6IDY2LjY2NjYlO1xufVxuXG4uaW1hZ2UuaXMtMTZieTkge1xuICBwYWRkaW5nLXRvcDogNTYuMjUlO1xufVxuXG4uaW1hZ2UuaXMtMmJ5MSB7XG4gIHBhZGRpbmctdG9wOiA1MCU7XG59XG5cbi5pbWFnZS5pcy0xNngxNiB7XG4gIGhlaWdodDogMTZweDtcbiAgd2lkdGg6IDE2cHg7XG59XG5cbi5pbWFnZS5pcy0yNHgyNCB7XG4gIGhlaWdodDogMjRweDtcbiAgd2lkdGg6IDI0cHg7XG59XG5cbi5pbWFnZS5pcy0zMngzMiB7XG4gIGhlaWdodDogMzJweDtcbiAgd2lkdGg6IDMycHg7XG59XG5cbi5pbWFnZS5pcy00OHg0OCB7XG4gIGhlaWdodDogNDhweDtcbiAgd2lkdGg6IDQ4cHg7XG59XG5cbi5pbWFnZS5pcy02NHg2NCB7XG4gIGhlaWdodDogNjRweDtcbiAgd2lkdGg6IDY0cHg7XG59XG5cbi5pbWFnZS5pcy05Nng5NiB7XG4gIGhlaWdodDogOTZweDtcbiAgd2lkdGg6IDk2cHg7XG59XG5cbi5pbWFnZS5pcy0xMjh4MTI4IHtcbiAgaGVpZ2h0OiAxMjhweDtcbiAgd2lkdGg6IDEyOHB4O1xufVxuXG4ubm90aWZpY2F0aW9uIHtcbiAgYmFja2dyb3VuZC1jb2xvcjogd2hpdGVzbW9rZTtcbiAgYm9yZGVyLXJhZGl1czogM3B4O1xuICBwYWRkaW5nOiAxLjI1cmVtIDIuNXJlbSAxLjI1cmVtIDEuNXJlbTtcbiAgcG9zaXRpb246IHJlbGF0aXZlO1xufVxuXG4ubm90aWZpY2F0aW9uOm5vdCg6bGFzdC1jaGlsZCkge1xuICBtYXJnaW4tYm90dG9tOiAxLjVyZW07XG59XG5cbi5ub3RpZmljYXRpb24gYTpub3QoLmJ1dHRvbikge1xuICBjb2xvcjogY3VycmVudENvbG9yO1xuICB0ZXh0LWRlY29yYXRpb246IHVuZGVybGluZTtcbn1cblxuLm5vdGlmaWNhdGlvbiBzdHJvbmcge1xuICBjb2xvcjogY3VycmVudENvbG9yO1xufVxuXG4ubm90aWZpY2F0aW9uIGNvZGUsXG4ubm90aWZpY2F0aW9uIHByZSB7XG4gIGJhY2tncm91bmQ6IHdoaXRlO1xufVxuXG4ubm90aWZpY2F0aW9uIHByZSBjb2RlIHtcbiAgYmFja2dyb3VuZDogdHJhbnNwYXJlbnQ7XG59XG5cbi5ub3RpZmljYXRpb24gPiAuZGVsZXRlIHtcbiAgcG9zaXRpb246IGFic29sdXRlO1xuICByaWdodDogMC41ZW07XG4gIHRvcDogMC41ZW07XG59XG5cbi5ub3RpZmljYXRpb24gLnRpdGxlLFxuLm5vdGlmaWNhdGlvbiAuc3VidGl0bGUsXG4ubm90aWZpY2F0aW9uIC5jb250ZW50IHtcbiAgY29sb3I6IGN1cnJlbnRDb2xvcjtcbn1cblxuLm5vdGlmaWNhdGlvbi5pcy13aGl0ZSB7XG4gIGJhY2tncm91bmQtY29sb3I6IHdoaXRlO1xuICBjb2xvcjogIzBhMGEwYTtcbn1cblxuLm5vdGlmaWNhdGlvbi5pcy1ibGFjayB7XG4gIGJhY2tncm91bmQtY29sb3I6ICMwYTBhMGE7XG4gIGNvbG9yOiB3aGl0ZTtcbn1cblxuLm5vdGlmaWNhdGlvbi5pcy1saWdodCB7XG4gIGJhY2tncm91bmQtY29sb3I6IHdoaXRlc21va2U7XG4gIGNvbG9yOiAjMzYzNjM2O1xufVxuXG4ubm90aWZpY2F0aW9uLmlzLWRhcmsge1xuICBiYWNrZ3JvdW5kLWNvbG9yOiAjMzYzNjM2O1xuICBjb2xvcjogd2hpdGVzbW9rZTtcbn1cblxuLm5vdGlmaWNhdGlvbi5pcy1wcmltYXJ5IHtcbiAgYmFja2dyb3VuZC1jb2xvcjogIzAwZDFiMjtcbiAgY29sb3I6ICNmZmY7XG59XG5cbi5ub3RpZmljYXRpb24uaXMtaW5mbyB7XG4gIGJhY2tncm91bmQtY29sb3I6ICMzMjczZGM7XG4gIGNvbG9yOiAjZmZmO1xufVxuXG4ubm90aWZpY2F0aW9uLmlzLXN1Y2Nlc3Mge1xuICBiYWNrZ3JvdW5kLWNvbG9yOiAjMjNkMTYwO1xuICBjb2xvcjogI2ZmZjtcbn1cblxuLm5vdGlmaWNhdGlvbi5pcy13YXJuaW5nIHtcbiAgYmFja2dyb3VuZC1jb2xvcjogI2ZmZGQ1NztcbiAgY29sb3I6IHJnYmEoMCwgMCwgMCwgMC43KTtcbn1cblxuLm5vdGlmaWNhdGlvbi5pcy1kYW5nZXIge1xuICBiYWNrZ3JvdW5kLWNvbG9yOiAjZmYzODYwO1xuICBjb2xvcjogI2ZmZjtcbn1cblxuLnByb2dyZXNzIHtcbiAgLW1vei1hcHBlYXJhbmNlOiBub25lO1xuICAtd2Via2l0LWFwcGVhcmFuY2U6IG5vbmU7XG4gIGJvcmRlcjogbm9uZTtcbiAgYm9yZGVyLXJhZGl1czogMjkwNDg2cHg7XG4gIGRpc3BsYXk6IGJsb2NrO1xuICBoZWlnaHQ6IDFyZW07XG4gIG92ZXJmbG93OiBoaWRkZW47XG4gIHBhZGRpbmc6IDA7XG4gIHdpZHRoOiAxMDAlO1xufVxuXG4ucHJvZ3Jlc3M6bm90KDpsYXN0LWNoaWxkKSB7XG4gIG1hcmdpbi1ib3R0b206IDEuNXJlbTtcbn1cblxuLnByb2dyZXNzOjotd2Via2l0LXByb2dyZXNzLWJhciB7XG4gIGJhY2tncm91bmQtY29sb3I6ICNkYmRiZGI7XG59XG5cbi5wcm9ncmVzczo6LXdlYmtpdC1wcm9ncmVzcy12YWx1ZSB7XG4gIGJhY2tncm91bmQtY29sb3I6ICM0YTRhNGE7XG59XG5cbi5wcm9ncmVzczo6LW1vei1wcm9ncmVzcy1iYXIge1xuICBiYWNrZ3JvdW5kLWNvbG9yOiAjNGE0YTRhO1xufVxuXG4ucHJvZ3Jlc3MuaXMtd2hpdGU6Oi13ZWJraXQtcHJvZ3Jlc3MtdmFsdWUge1xuICBiYWNrZ3JvdW5kLWNvbG9yOiB3aGl0ZTtcbn1cblxuLnByb2dyZXNzLmlzLXdoaXRlOjotbW96LXByb2dyZXNzLWJhciB7XG4gIGJhY2tncm91bmQtY29sb3I6IHdoaXRlO1xufVxuXG4ucHJvZ3Jlc3MuaXMtYmxhY2s6Oi13ZWJraXQtcHJvZ3Jlc3MtdmFsdWUge1xuICBiYWNrZ3JvdW5kLWNvbG9yOiAjMGEwYTBhO1xufVxuXG4ucHJvZ3Jlc3MuaXMtYmxhY2s6Oi1tb3otcHJvZ3Jlc3MtYmFyIHtcbiAgYmFja2dyb3VuZC1jb2xvcjogIzBhMGEwYTtcbn1cblxuLnByb2dyZXNzLmlzLWxpZ2h0Ojotd2Via2l0LXByb2dyZXNzLXZhbHVlIHtcbiAgYmFja2dyb3VuZC1jb2xvcjogd2hpdGVzbW9rZTtcbn1cblxuLnByb2dyZXNzLmlzLWxpZ2h0OjotbW96LXByb2dyZXNzLWJhciB7XG4gIGJhY2tncm91bmQtY29sb3I6IHdoaXRlc21va2U7XG59XG5cbi5wcm9ncmVzcy5pcy1kYXJrOjotd2Via2l0LXByb2dyZXNzLXZhbHVlIHtcbiAgYmFja2dyb3VuZC1jb2xvcjogIzM2MzYzNjtcbn1cblxuLnByb2dyZXNzLmlzLWRhcms6Oi1tb3otcHJvZ3Jlc3MtYmFyIHtcbiAgYmFja2dyb3VuZC1jb2xvcjogIzM2MzYzNjtcbn1cblxuLnByb2dyZXNzLmlzLXByaW1hcnk6Oi13ZWJraXQtcHJvZ3Jlc3MtdmFsdWUge1xuICBiYWNrZ3JvdW5kLWNvbG9yOiAjMDBkMWIyO1xufVxuXG4ucHJvZ3Jlc3MuaXMtcHJpbWFyeTo6LW1vei1wcm9ncmVzcy1iYXIge1xuICBiYWNrZ3JvdW5kLWNvbG9yOiAjMDBkMWIyO1xufVxuXG4ucHJvZ3Jlc3MuaXMtaW5mbzo6LXdlYmtpdC1wcm9ncmVzcy12YWx1ZSB7XG4gIGJhY2tncm91bmQtY29sb3I6ICMzMjczZGM7XG59XG5cbi5wcm9ncmVzcy5pcy1pbmZvOjotbW96LXByb2dyZXNzLWJhciB7XG4gIGJhY2tncm91bmQtY29sb3I6ICMzMjczZGM7XG59XG5cbi5wcm9ncmVzcy5pcy1zdWNjZXNzOjotd2Via2l0LXByb2dyZXNzLXZhbHVlIHtcbiAgYmFja2dyb3VuZC1jb2xvcjogIzIzZDE2MDtcbn1cblxuLnByb2dyZXNzLmlzLXN1Y2Nlc3M6Oi1tb3otcHJvZ3Jlc3MtYmFyIHtcbiAgYmFja2dyb3VuZC1jb2xvcjogIzIzZDE2MDtcbn1cblxuLnByb2dyZXNzLmlzLXdhcm5pbmc6Oi13ZWJraXQtcHJvZ3Jlc3MtdmFsdWUge1xuICBiYWNrZ3JvdW5kLWNvbG9yOiAjZmZkZDU3O1xufVxuXG4ucHJvZ3Jlc3MuaXMtd2FybmluZzo6LW1vei1wcm9ncmVzcy1iYXIge1xuICBiYWNrZ3JvdW5kLWNvbG9yOiAjZmZkZDU3O1xufVxuXG4ucHJvZ3Jlc3MuaXMtZGFuZ2VyOjotd2Via2l0LXByb2dyZXNzLXZhbHVlIHtcbiAgYmFja2dyb3VuZC1jb2xvcjogI2ZmMzg2MDtcbn1cblxuLnByb2dyZXNzLmlzLWRhbmdlcjo6LW1vei1wcm9ncmVzcy1iYXIge1xuICBiYWNrZ3JvdW5kLWNvbG9yOiAjZmYzODYwO1xufVxuXG4ucHJvZ3Jlc3MuaXMtc21hbGwge1xuICBoZWlnaHQ6IDAuNzVyZW07XG59XG5cbi5wcm9ncmVzcy5pcy1tZWRpdW0ge1xuICBoZWlnaHQ6IDEuMjVyZW07XG59XG5cbi5wcm9ncmVzcy5pcy1sYXJnZSB7XG4gIGhlaWdodDogMS41cmVtO1xufVxuXG4udGFibGUge1xuICBiYWNrZ3JvdW5kLWNvbG9yOiB3aGl0ZTtcbiAgY29sb3I6ICMzNjM2MzY7XG4gIG1hcmdpbi1ib3R0b206IDEuNXJlbTtcbiAgd2lkdGg6IDEwMCU7XG59XG5cbi50YWJsZSB0ZCxcbi50YWJsZSB0aCB7XG4gIGJvcmRlcjogMXB4IHNvbGlkICNkYmRiZGI7XG4gIGJvcmRlci13aWR0aDogMCAwIDFweDtcbiAgcGFkZGluZzogMC41ZW0gMC43NWVtO1xuICB2ZXJ0aWNhbC1hbGlnbjogdG9wO1xufVxuXG4udGFibGUgdGQuaXMtbmFycm93LFxuLnRhYmxlIHRoLmlzLW5hcnJvdyB7XG4gIHdoaXRlLXNwYWNlOiBub3dyYXA7XG4gIHdpZHRoOiAxJTtcbn1cblxuLnRhYmxlIHRoIHtcbiAgY29sb3I6ICMzNjM2MzY7XG4gIHRleHQtYWxpZ246IGxlZnQ7XG59XG5cbi50YWJsZSB0cjpob3ZlciB7XG4gIGJhY2tncm91bmQtY29sb3I6ICNmYWZhZmE7XG59XG5cbi50YWJsZSB0ci5pcy1zZWxlY3RlZCB7XG4gIGJhY2tncm91bmQtY29sb3I6ICMwMGQxYjI7XG4gIGNvbG9yOiAjZmZmO1xufVxuXG4udGFibGUgdHIuaXMtc2VsZWN0ZWQgYSxcbi50YWJsZSB0ci5pcy1zZWxlY3RlZCBzdHJvbmcge1xuICBjb2xvcjogY3VycmVudENvbG9yO1xufVxuXG4udGFibGUgdHIuaXMtc2VsZWN0ZWQgdGQsXG4udGFibGUgdHIuaXMtc2VsZWN0ZWQgdGgge1xuICBib3JkZXItY29sb3I6ICNmZmY7XG4gIGNvbG9yOiBjdXJyZW50Q29sb3I7XG59XG5cbi50YWJsZSB0aGVhZCB0ZCxcbi50YWJsZSB0aGVhZCB0aCB7XG4gIGJvcmRlci13aWR0aDogMCAwIDJweDtcbiAgY29sb3I6ICM3YTdhN2E7XG59XG5cbi50YWJsZSB0Zm9vdCB0ZCxcbi50YWJsZSB0Zm9vdCB0aCB7XG4gIGJvcmRlci13aWR0aDogMnB4IDAgMDtcbiAgY29sb3I6ICM3YTdhN2E7XG59XG5cbi50YWJsZSB0Ym9keSB0cjpsYXN0LWNoaWxkIHRkLFxuLnRhYmxlIHRib2R5IHRyOmxhc3QtY2hpbGQgdGgge1xuICBib3JkZXItYm90dG9tLXdpZHRoOiAwO1xufVxuXG4udGFibGUuaXMtYm9yZGVyZWQgdGQsXG4udGFibGUuaXMtYm9yZGVyZWQgdGgge1xuICBib3JkZXItd2lkdGg6IDFweDtcbn1cblxuLnRhYmxlLmlzLWJvcmRlcmVkIHRyOmxhc3QtY2hpbGQgdGQsXG4udGFibGUuaXMtYm9yZGVyZWQgdHI6bGFzdC1jaGlsZCB0aCB7XG4gIGJvcmRlci1ib3R0b20td2lkdGg6IDFweDtcbn1cblxuLnRhYmxlLmlzLW5hcnJvdyB0ZCxcbi50YWJsZS5pcy1uYXJyb3cgdGgge1xuICBwYWRkaW5nOiAwLjI1ZW0gMC41ZW07XG59XG5cbi50YWJsZS5pcy1zdHJpcGVkIHRib2R5IHRyOm5vdCguaXMtc2VsZWN0ZWQpOm50aC1jaGlsZChldmVuKSB7XG4gIGJhY2tncm91bmQtY29sb3I6ICNmYWZhZmE7XG59XG5cbi50YWJsZS5pcy1zdHJpcGVkIHRib2R5IHRyOm5vdCguaXMtc2VsZWN0ZWQpOm50aC1jaGlsZChldmVuKTpob3ZlciB7XG4gIGJhY2tncm91bmQtY29sb3I6IHdoaXRlc21va2U7XG59XG5cbi50YWcge1xuICBhbGlnbi1pdGVtczogY2VudGVyO1xuICBiYWNrZ3JvdW5kLWNvbG9yOiB3aGl0ZXNtb2tlO1xuICBib3JkZXItcmFkaXVzOiAyOTA0ODZweDtcbiAgY29sb3I6ICM0YTRhNGE7XG4gIGRpc3BsYXk6IGlubGluZS1mbGV4O1xuICBmb250LXNpemU6IDAuNzVyZW07XG4gIGhlaWdodDogMmVtO1xuICBqdXN0aWZ5LWNvbnRlbnQ6IGNlbnRlcjtcbiAgbGluZS1oZWlnaHQ6IDEuNTtcbiAgcGFkZGluZy1sZWZ0OiAwLjg3NWVtO1xuICBwYWRkaW5nLXJpZ2h0OiAwLjg3NWVtO1xuICB3aGl0ZS1zcGFjZTogbm93cmFwO1xufVxuXG4udGFnIC5kZWxldGUge1xuICBtYXJnaW4tbGVmdDogMC4yNWVtO1xuICBtYXJnaW4tcmlnaHQ6IC0wLjM3NWVtO1xufVxuXG4udGFnLmlzLXdoaXRlIHtcbiAgYmFja2dyb3VuZC1jb2xvcjogd2hpdGU7XG4gIGNvbG9yOiAjMGEwYTBhO1xufVxuXG4udGFnLmlzLWJsYWNrIHtcbiAgYmFja2dyb3VuZC1jb2xvcjogIzBhMGEwYTtcbiAgY29sb3I6IHdoaXRlO1xufVxuXG4udGFnLmlzLWxpZ2h0IHtcbiAgYmFja2dyb3VuZC1jb2xvcjogd2hpdGVzbW9rZTtcbiAgY29sb3I6ICMzNjM2MzY7XG59XG5cbi50YWcuaXMtZGFyayB7XG4gIGJhY2tncm91bmQtY29sb3I6ICMzNjM2MzY7XG4gIGNvbG9yOiB3aGl0ZXNtb2tlO1xufVxuXG4udGFnLmlzLXByaW1hcnkge1xuICBiYWNrZ3JvdW5kLWNvbG9yOiAjMDBkMWIyO1xuICBjb2xvcjogI2ZmZjtcbn1cblxuLnRhZy5pcy1pbmZvIHtcbiAgYmFja2dyb3VuZC1jb2xvcjogIzMyNzNkYztcbiAgY29sb3I6ICNmZmY7XG59XG5cbi50YWcuaXMtc3VjY2VzcyB7XG4gIGJhY2tncm91bmQtY29sb3I6ICMyM2QxNjA7XG4gIGNvbG9yOiAjZmZmO1xufVxuXG4udGFnLmlzLXdhcm5pbmcge1xuICBiYWNrZ3JvdW5kLWNvbG9yOiAjZmZkZDU3O1xuICBjb2xvcjogcmdiYSgwLCAwLCAwLCAwLjcpO1xufVxuXG4udGFnLmlzLWRhbmdlciB7XG4gIGJhY2tncm91bmQtY29sb3I6ICNmZjM4NjA7XG4gIGNvbG9yOiAjZmZmO1xufVxuXG4udGFnLmlzLW1lZGl1bSB7XG4gIGZvbnQtc2l6ZTogMXJlbTtcbn1cblxuLnRhZy5pcy1sYXJnZSB7XG4gIGZvbnQtc2l6ZTogMS4yNXJlbTtcbn1cblxuLnRpdGxlLFxuLnN1YnRpdGxlIHtcbiAgd29yZC1icmVhazogYnJlYWstd29yZDtcbn1cblxuLnRpdGxlOm5vdCg6bGFzdC1jaGlsZCksXG4uc3VidGl0bGU6bm90KDpsYXN0LWNoaWxkKSB7XG4gIG1hcmdpbi1ib3R0b206IDEuNXJlbTtcbn1cblxuLnRpdGxlIGVtLFxuLnRpdGxlIHNwYW4sXG4uc3VidGl0bGUgZW0sXG4uc3VidGl0bGUgc3BhbiB7XG4gIGZvbnQtd2VpZ2h0OiAzMDA7XG59XG5cbi50aXRsZSBzdHJvbmcsXG4uc3VidGl0bGUgc3Ryb25nIHtcbiAgZm9udC13ZWlnaHQ6IDUwMDtcbn1cblxuLnRpdGxlIC50YWcsXG4uc3VidGl0bGUgLnRhZyB7XG4gIHZlcnRpY2FsLWFsaWduOiBtaWRkbGU7XG59XG5cbi50aXRsZSB7XG4gIGNvbG9yOiAjMzYzNjM2O1xuICBmb250LXNpemU6IDJyZW07XG4gIGZvbnQtd2VpZ2h0OiAzMDA7XG4gIGxpbmUtaGVpZ2h0OiAxLjEyNTtcbn1cblxuLnRpdGxlIHN0cm9uZyB7XG4gIGNvbG9yOiBpbmhlcml0O1xufVxuXG4udGl0bGUgKyAuaGlnaGxpZ2h0IHtcbiAgbWFyZ2luLXRvcDogLTAuNzVyZW07XG59XG5cbi50aXRsZTpub3QoLmlzLXNwYWNlZCkgKyAuc3VidGl0bGUge1xuICBtYXJnaW4tdG9wOiAtMS41cmVtO1xufVxuXG4udGl0bGUuaXMtMSB7XG4gIGZvbnQtc2l6ZTogM3JlbTtcbn1cblxuLnRpdGxlLmlzLTIge1xuICBmb250LXNpemU6IDIuNXJlbTtcbn1cblxuLnRpdGxlLmlzLTMge1xuICBmb250LXNpemU6IDJyZW07XG59XG5cbi50aXRsZS5pcy00IHtcbiAgZm9udC1zaXplOiAxLjVyZW07XG59XG5cbi50aXRsZS5pcy01IHtcbiAgZm9udC1zaXplOiAxLjI1cmVtO1xufVxuXG4udGl0bGUuaXMtNiB7XG4gIGZvbnQtc2l6ZTogMXJlbTtcbn1cblxuLnN1YnRpdGxlIHtcbiAgY29sb3I6ICM0YTRhNGE7XG4gIGZvbnQtc2l6ZTogMS4yNXJlbTtcbiAgZm9udC13ZWlnaHQ6IDMwMDtcbiAgbGluZS1oZWlnaHQ6IDEuMjU7XG59XG5cbi5zdWJ0aXRsZSBzdHJvbmcge1xuICBjb2xvcjogIzM2MzYzNjtcbn1cblxuLnN1YnRpdGxlOm5vdCguaXMtc3BhY2VkKSArIC50aXRsZSB7XG4gIG1hcmdpbi10b3A6IC0xLjVyZW07XG59XG5cbi5zdWJ0aXRsZS5pcy0xIHtcbiAgZm9udC1zaXplOiAzcmVtO1xufVxuXG4uc3VidGl0bGUuaXMtMiB7XG4gIGZvbnQtc2l6ZTogMi41cmVtO1xufVxuXG4uc3VidGl0bGUuaXMtMyB7XG4gIGZvbnQtc2l6ZTogMnJlbTtcbn1cblxuLnN1YnRpdGxlLmlzLTQge1xuICBmb250LXNpemU6IDEuNXJlbTtcbn1cblxuLnN1YnRpdGxlLmlzLTUge1xuICBmb250LXNpemU6IDEuMjVyZW07XG59XG5cbi5zdWJ0aXRsZS5pcy02IHtcbiAgZm9udC1zaXplOiAxcmVtO1xufVxuXG4uYmxvY2s6bm90KDpsYXN0LWNoaWxkKSB7XG4gIG1hcmdpbi1ib3R0b206IDEuNXJlbTtcbn1cblxuLmNvbnRhaW5lciB7XG4gIG1hcmdpbjogMCBhdXRvO1xuICBwb3NpdGlvbjogcmVsYXRpdmU7XG59XG5cbkBtZWRpYSBzY3JlZW4gYW5kIChtaW4td2lkdGg6IDEwMDhweCkge1xuICAuY29udGFpbmVyIHtcbiAgICBtYXgtd2lkdGg6IDk2MHB4O1xuICAgIHdpZHRoOiA5NjBweDtcbiAgfVxuICAuY29udGFpbmVyLmlzLWZsdWlkIHtcbiAgICBtYXJnaW4tbGVmdDogMjRweDtcbiAgICBtYXJnaW4tcmlnaHQ6IDI0cHg7XG4gICAgbWF4LXdpZHRoOiBub25lO1xuICAgIHdpZHRoOiBhdXRvO1xuICB9XG59XG5cbkBtZWRpYSBzY3JlZW4gYW5kIChtYXgtd2lkdGg6IDExOTlweCkge1xuICAuY29udGFpbmVyLmlzLXdpZGVzY3JlZW4ge1xuICAgIG1heC13aWR0aDogMTE1MnB4O1xuICAgIHdpZHRoOiBhdXRvO1xuICB9XG59XG5cbkBtZWRpYSBzY3JlZW4gYW5kIChtYXgtd2lkdGg6IDEzOTFweCkge1xuICAuY29udGFpbmVyLmlzLWZ1bGxoZCB7XG4gICAgbWF4LXdpZHRoOiAxMzQ0cHg7XG4gICAgd2lkdGg6IGF1dG87XG4gIH1cbn1cblxuQG1lZGlhIHNjcmVlbiBhbmQgKG1pbi13aWR0aDogMTIwMHB4KSB7XG4gIC5jb250YWluZXIge1xuICAgIG1heC13aWR0aDogMTE1MnB4O1xuICAgIHdpZHRoOiAxMTUycHg7XG4gIH1cbn1cblxuQG1lZGlhIHNjcmVlbiBhbmQgKG1pbi13aWR0aDogMTM5MnB4KSB7XG4gIC5jb250YWluZXIge1xuICAgIG1heC13aWR0aDogMTM0NHB4O1xuICAgIHdpZHRoOiAxMzQ0cHg7XG4gIH1cbn1cblxuLmRlbGV0ZSB7XG4gIC13ZWJraXQtdG91Y2gtY2FsbG91dDogbm9uZTtcbiAgLXdlYmtpdC11c2VyLXNlbGVjdDogbm9uZTtcbiAgLW1vei11c2VyLXNlbGVjdDogbm9uZTtcbiAgLW1zLXVzZXItc2VsZWN0OiBub25lO1xuICB1c2VyLXNlbGVjdDogbm9uZTtcbiAgLW1vei1hcHBlYXJhbmNlOiBub25lO1xuICAtd2Via2l0LWFwcGVhcmFuY2U6IG5vbmU7XG4gIGJhY2tncm91bmQtY29sb3I6IHJnYmEoMTAsIDEwLCAxMCwgMC4yKTtcbiAgYm9yZGVyOiBub25lO1xuICBib3JkZXItcmFkaXVzOiAyOTA0ODZweDtcbiAgY3Vyc29yOiBwb2ludGVyO1xuICBkaXNwbGF5OiBpbmxpbmUtYmxvY2s7XG4gIGZsZXgtZ3JvdzogMDtcbiAgZmxleC1zaHJpbms6IDA7XG4gIGZvbnQtc2l6ZTogMXJlbTtcbiAgaGVpZ2h0OiAyMHB4O1xuICBtYXgtaGVpZ2h0OiAyMHB4O1xuICBtYXgtd2lkdGg6IDIwcHg7XG4gIG1pbi1oZWlnaHQ6IDIwcHg7XG4gIG1pbi13aWR0aDogMjBweDtcbiAgb3V0bGluZTogbm9uZTtcbiAgcG9zaXRpb246IHJlbGF0aXZlO1xuICB2ZXJ0aWNhbC1hbGlnbjogdG9wO1xuICB3aWR0aDogMjBweDtcbn1cblxuLmRlbGV0ZTpiZWZvcmUsIC5kZWxldGU6YWZ0ZXIge1xuICBiYWNrZ3JvdW5kLWNvbG9yOiB3aGl0ZTtcbiAgY29udGVudDogXCJcIjtcbiAgZGlzcGxheTogYmxvY2s7XG4gIGxlZnQ6IDUwJTtcbiAgcG9zaXRpb246IGFic29sdXRlO1xuICB0b3A6IDUwJTtcbiAgdHJhbnNmb3JtOiB0cmFuc2xhdGVYKC01MCUpIHRyYW5zbGF0ZVkoLTUwJSkgcm90YXRlKDQ1ZGVnKTtcbiAgdHJhbnNmb3JtLW9yaWdpbjogY2VudGVyIGNlbnRlcjtcbn1cblxuLmRlbGV0ZTpiZWZvcmUge1xuICBoZWlnaHQ6IDJweDtcbiAgd2lkdGg6IDUwJTtcbn1cblxuLmRlbGV0ZTphZnRlciB7XG4gIGhlaWdodDogNTAlO1xuICB3aWR0aDogMnB4O1xufVxuXG4uZGVsZXRlOmhvdmVyLCAuZGVsZXRlOmZvY3VzIHtcbiAgYmFja2dyb3VuZC1jb2xvcjogcmdiYSgxMCwgMTAsIDEwLCAwLjMpO1xufVxuXG4uZGVsZXRlOmFjdGl2ZSB7XG4gIGJhY2tncm91bmQtY29sb3I6IHJnYmEoMTAsIDEwLCAxMCwgMC40KTtcbn1cblxuLmRlbGV0ZS5pcy1zbWFsbCB7XG4gIGhlaWdodDogMTZweDtcbiAgbWF4LWhlaWdodDogMTZweDtcbiAgbWF4LXdpZHRoOiAxNnB4O1xuICBtaW4taGVpZ2h0OiAxNnB4O1xuICBtaW4td2lkdGg6IDE2cHg7XG4gIHdpZHRoOiAxNnB4O1xufVxuXG4uZGVsZXRlLmlzLW1lZGl1bSB7XG4gIGhlaWdodDogMjRweDtcbiAgbWF4LWhlaWdodDogMjRweDtcbiAgbWF4LXdpZHRoOiAyNHB4O1xuICBtaW4taGVpZ2h0OiAyNHB4O1xuICBtaW4td2lkdGg6IDI0cHg7XG4gIHdpZHRoOiAyNHB4O1xufVxuXG4uZGVsZXRlLmlzLWxhcmdlIHtcbiAgaGVpZ2h0OiAzMnB4O1xuICBtYXgtaGVpZ2h0OiAzMnB4O1xuICBtYXgtd2lkdGg6IDMycHg7XG4gIG1pbi1oZWlnaHQ6IDMycHg7XG4gIG1pbi13aWR0aDogMzJweDtcbiAgd2lkdGg6IDMycHg7XG59XG5cbi5mYSB7XG4gIGZvbnQtc2l6ZTogMjFweDtcbiAgdGV4dC1hbGlnbjogY2VudGVyO1xuICB2ZXJ0aWNhbC1hbGlnbjogdG9wO1xufVxuXG4uaGVhZGluZyB7XG4gIGRpc3BsYXk6IGJsb2NrO1xuICBmb250LXNpemU6IDExcHg7XG4gIGxldHRlci1zcGFjaW5nOiAxcHg7XG4gIG1hcmdpbi1ib3R0b206IDVweDtcbiAgdGV4dC10cmFuc2Zvcm06IHVwcGVyY2FzZTtcbn1cblxuLmhpZ2hsaWdodCB7XG4gIGZvbnQtd2VpZ2h0OiA0MDA7XG4gIG1heC13aWR0aDogMTAwJTtcbiAgb3ZlcmZsb3c6IGhpZGRlbjtcbiAgcGFkZGluZzogMDtcbn1cblxuLmhpZ2hsaWdodDpub3QoOmxhc3QtY2hpbGQpIHtcbiAgbWFyZ2luLWJvdHRvbTogMS41cmVtO1xufVxuXG4uaGlnaGxpZ2h0IHByZSB7XG4gIG92ZXJmbG93OiBhdXRvO1xuICBtYXgtd2lkdGg6IDEwMCU7XG59XG5cbi5sb2FkZXIge1xuICBhbmltYXRpb246IHNwaW5Bcm91bmQgNTAwbXMgaW5maW5pdGUgbGluZWFyO1xuICBib3JkZXI6IDJweCBzb2xpZCAjZGJkYmRiO1xuICBib3JkZXItcmFkaXVzOiAyOTA0ODZweDtcbiAgYm9yZGVyLXJpZ2h0LWNvbG9yOiB0cmFuc3BhcmVudDtcbiAgYm9yZGVyLXRvcC1jb2xvcjogdHJhbnNwYXJlbnQ7XG4gIGNvbnRlbnQ6IFwiXCI7XG4gIGRpc3BsYXk6IGJsb2NrO1xuICBoZWlnaHQ6IDFlbTtcbiAgcG9zaXRpb246IHJlbGF0aXZlO1xuICB3aWR0aDogMWVtO1xufVxuXG4ubnVtYmVyIHtcbiAgYWxpZ24taXRlbXM6IGNlbnRlcjtcbiAgYmFja2dyb3VuZC1jb2xvcjogd2hpdGVzbW9rZTtcbiAgYm9yZGVyLXJhZGl1czogMjkwNDg2cHg7XG4gIGRpc3BsYXk6IGlubGluZS1mbGV4O1xuICBmb250LXNpemU6IDEuMjVyZW07XG4gIGhlaWdodDogMmVtO1xuICBqdXN0aWZ5LWNvbnRlbnQ6IGNlbnRlcjtcbiAgbWFyZ2luLXJpZ2h0OiAxLjVyZW07XG4gIG1pbi13aWR0aDogMi41ZW07XG4gIHBhZGRpbmc6IDAuMjVyZW0gMC41cmVtO1xuICB0ZXh0LWFsaWduOiBjZW50ZXI7XG4gIHZlcnRpY2FsLWFsaWduOiB0b3A7XG59XG5cbi5icmVhZGNydW1iIHtcbiAgLXdlYmtpdC10b3VjaC1jYWxsb3V0OiBub25lO1xuICAtd2Via2l0LXVzZXItc2VsZWN0OiBub25lO1xuICAtbW96LXVzZXItc2VsZWN0OiBub25lO1xuICAtbXMtdXNlci1zZWxlY3Q6IG5vbmU7XG4gIHVzZXItc2VsZWN0OiBub25lO1xuICBhbGlnbi1pdGVtczogc3RyZXRjaDtcbiAgZGlzcGxheTogZmxleDtcbiAgZm9udC1zaXplOiAxcmVtO1xuICBvdmVyZmxvdzogaGlkZGVuO1xuICBvdmVyZmxvdy14OiBhdXRvO1xuICB3aGl0ZS1zcGFjZTogbm93cmFwO1xufVxuXG4uYnJlYWRjcnVtYjpub3QoOmxhc3QtY2hpbGQpIHtcbiAgbWFyZ2luLWJvdHRvbTogMS41cmVtO1xufVxuXG4uYnJlYWRjcnVtYiBhIHtcbiAgYWxpZ24taXRlbXM6IGNlbnRlcjtcbiAgY29sb3I6ICM3YTdhN2E7XG4gIGRpc3BsYXk6IGZsZXg7XG4gIGp1c3RpZnktY29udGVudDogY2VudGVyO1xuICBwYWRkaW5nOiAwLjVlbSAwLjc1ZW07XG59XG5cbi5icmVhZGNydW1iIGE6aG92ZXIge1xuICBjb2xvcjogIzM2MzYzNjtcbn1cblxuLmJyZWFkY3J1bWIgbGkge1xuICBhbGlnbi1pdGVtczogY2VudGVyO1xuICBkaXNwbGF5OiBmbGV4O1xufVxuXG4uYnJlYWRjcnVtYiBsaS5pcy1hY3RpdmUgYSB7XG4gIGNvbG9yOiAjMzYzNjM2O1xuICBjdXJzb3I6IGRlZmF1bHQ7XG4gIHBvaW50ZXItZXZlbnRzOiBub25lO1xufVxuXG4uYnJlYWRjcnVtYiBsaSArIGxpOmJlZm9yZSB7XG4gIGNvbG9yOiAjNGE0YTRhO1xuICBjb250ZW50OiAnXFwwMDAyZic7XG59XG5cbi5icmVhZGNydW1iIHVsLCAuYnJlYWRjcnVtYiBvbCB7XG4gIGFsaWduLWl0ZW1zOiBjZW50ZXI7XG4gIGRpc3BsYXk6IGZsZXg7XG4gIGZsZXgtZ3JvdzogMTtcbiAgZmxleC1zaHJpbms6IDA7XG4gIGp1c3RpZnktY29udGVudDogZmxleC1zdGFydDtcbn1cblxuLmJyZWFkY3J1bWIgLmljb246Zmlyc3QtY2hpbGQge1xuICBtYXJnaW4tcmlnaHQ6IDAuNWVtO1xufVxuXG4uYnJlYWRjcnVtYiAuaWNvbjpsYXN0LWNoaWxkIHtcbiAgbWFyZ2luLWxlZnQ6IDAuNWVtO1xufVxuXG4uYnJlYWRjcnVtYi5pcy1jZW50ZXJlZCBvbCwgLmJyZWFkY3J1bWIuaXMtY2VudGVyZWQgdWwge1xuICBqdXN0aWZ5LWNvbnRlbnQ6IGNlbnRlcjtcbn1cblxuLmJyZWFkY3J1bWIuaXMtcmlnaHQgb2wsIC5icmVhZGNydW1iLmlzLXJpZ2h0IHVsIHtcbiAganVzdGlmeS1jb250ZW50OiBmbGV4LWVuZDtcbn1cblxuLmJyZWFkY3J1bWIuaXMtc21hbGwge1xuICBmb250LXNpemU6IDAuNzVyZW07XG59XG5cbi5icmVhZGNydW1iLmlzLW1lZGl1bSB7XG4gIGZvbnQtc2l6ZTogMS4yNXJlbTtcbn1cblxuLmJyZWFkY3J1bWIuaXMtbGFyZ2Uge1xuICBmb250LXNpemU6IDEuNXJlbTtcbn1cblxuLmJyZWFkY3J1bWIuaGFzLWFycm93LXNlcGFyYXRvciBsaSArIGxpOmJlZm9yZSB7XG4gIGNvbnRlbnQ6ICdcXDAyMTkyJztcbn1cblxuLmJyZWFkY3J1bWIuaGFzLWJ1bGxldC1zZXBhcmF0b3IgbGkgKyBsaTpiZWZvcmUge1xuICBjb250ZW50OiAnXFwwMjAyMic7XG59XG5cbi5icmVhZGNydW1iLmhhcy1kb3Qtc2VwYXJhdG9yIGxpICsgbGk6YmVmb3JlIHtcbiAgY29udGVudDogJ1xcMDAwYjcnO1xufVxuXG4uYnJlYWRjcnVtYi5oYXMtc3VjY2VlZHMtc2VwYXJhdG9yIGxpICsgbGk6YmVmb3JlIHtcbiAgY29udGVudDogJ1xcMDIyN0InO1xufVxuXG4uY2FyZCB7XG4gIGJhY2tncm91bmQtY29sb3I6IHdoaXRlO1xuICBib3gtc2hhZG93OiAwIDJweCAzcHggcmdiYSgxMCwgMTAsIDEwLCAwLjEpLCAwIDAgMCAxcHggcmdiYSgxMCwgMTAsIDEwLCAwLjEpO1xuICBjb2xvcjogIzRhNGE0YTtcbiAgbWF4LXdpZHRoOiAxMDAlO1xuICBwb3NpdGlvbjogcmVsYXRpdmU7XG59XG5cbi5jYXJkLWhlYWRlciB7XG4gIGFsaWduLWl0ZW1zOiBzdHJldGNoO1xuICBib3gtc2hhZG93OiAwIDFweCAycHggcmdiYSgxMCwgMTAsIDEwLCAwLjEpO1xuICBkaXNwbGF5OiBmbGV4O1xufVxuXG4uY2FyZC1oZWFkZXItdGl0bGUge1xuICBhbGlnbi1pdGVtczogY2VudGVyO1xuICBjb2xvcjogIzM2MzYzNjtcbiAgZGlzcGxheTogZmxleDtcbiAgZmxleC1ncm93OiAxO1xuICBmb250LXdlaWdodDogNzAwO1xuICBwYWRkaW5nOiAwLjc1cmVtO1xufVxuXG4uY2FyZC1oZWFkZXItaWNvbiB7XG4gIGFsaWduLWl0ZW1zOiBjZW50ZXI7XG4gIGN1cnNvcjogcG9pbnRlcjtcbiAgZGlzcGxheTogZmxleDtcbiAganVzdGlmeS1jb250ZW50OiBjZW50ZXI7XG4gIHBhZGRpbmc6IDAuNzVyZW07XG59XG5cbi5jYXJkLWltYWdlIHtcbiAgZGlzcGxheTogYmxvY2s7XG4gIHBvc2l0aW9uOiByZWxhdGl2ZTtcbn1cblxuLmNhcmQtY29udGVudCB7XG4gIHBhZGRpbmc6IDEuNXJlbTtcbn1cblxuLmNhcmQtZm9vdGVyIHtcbiAgYm9yZGVyLXRvcDogMXB4IHNvbGlkICNkYmRiZGI7XG4gIGFsaWduLWl0ZW1zOiBzdHJldGNoO1xuICBkaXNwbGF5OiBmbGV4O1xufVxuXG4uY2FyZC1mb290ZXItaXRlbSB7XG4gIGFsaWduLWl0ZW1zOiBjZW50ZXI7XG4gIGRpc3BsYXk6IGZsZXg7XG4gIGZsZXgtYmFzaXM6IDA7XG4gIGZsZXgtZ3JvdzogMTtcbiAgZmxleC1zaHJpbms6IDA7XG4gIGp1c3RpZnktY29udGVudDogY2VudGVyO1xuICBwYWRkaW5nOiAwLjc1cmVtO1xufVxuXG4uY2FyZC1mb290ZXItaXRlbTpub3QoOmxhc3QtY2hpbGQpIHtcbiAgYm9yZGVyLXJpZ2h0OiAxcHggc29saWQgI2RiZGJkYjtcbn1cblxuLmNhcmQgLm1lZGlhOm5vdCg6bGFzdC1jaGlsZCkge1xuICBtYXJnaW4tYm90dG9tOiAwLjc1cmVtO1xufVxuXG4uZHJvcGRvd24ge1xuICBkaXNwbGF5OiBpbmxpbmUtZmxleDtcbiAgcG9zaXRpb246IHJlbGF0aXZlO1xuICB2ZXJ0aWNhbC1hbGlnbjogdG9wO1xufVxuXG4uZHJvcGRvd24uaXMtYWN0aXZlIC5kcm9wZG93bi1tZW51LCAuZHJvcGRvd24uaXMtaG92ZXJhYmxlOmhvdmVyIC5kcm9wZG93bi1tZW51IHtcbiAgZGlzcGxheTogYmxvY2s7XG59XG5cbi5kcm9wZG93bi5pcy1yaWdodCAuZHJvcGRvd24tbWVudSB7XG4gIGxlZnQ6IGF1dG87XG4gIHJpZ2h0OiAwO1xufVxuXG4uZHJvcGRvd24tbWVudSB7XG4gIGRpc3BsYXk6IG5vbmU7XG4gIGxlZnQ6IDA7XG4gIG1heC13aWR0aDogMjByZW07XG4gIG1pbi13aWR0aDogMTJyZW07XG4gIHBhZGRpbmctdG9wOiA0cHg7XG4gIHBvc2l0aW9uOiBhYnNvbHV0ZTtcbiAgdG9wOiAxMDAlO1xuICB3aWR0aDogMTAwJTtcbiAgei1pbmRleDogMjA7XG59XG5cbi5kcm9wZG93bi1jb250ZW50IHtcbiAgYmFja2dyb3VuZC1jb2xvcjogd2hpdGU7XG4gIGJvcmRlci1yYWRpdXM6IDNweDtcbiAgYm94LXNoYWRvdzogMCAycHggM3B4IHJnYmEoMTAsIDEwLCAxMCwgMC4xKSwgMCAwIDAgMXB4IHJnYmEoMTAsIDEwLCAxMCwgMC4xKTtcbiAgcGFkZGluZy1ib3R0b206IDAuNXJlbTtcbiAgcGFkZGluZy10b3A6IDAuNXJlbTtcbn1cblxuLmRyb3Bkb3duLWl0ZW0ge1xuICBjb2xvcjogIzRhNGE0YTtcbiAgZGlzcGxheTogYmxvY2s7XG4gIGZvbnQtc2l6ZTogMC44NzVyZW07XG4gIGxpbmUtaGVpZ2h0OiAxLjU7XG4gIHBhZGRpbmc6IDAuMzc1cmVtIDFyZW07XG4gIHBvc2l0aW9uOiByZWxhdGl2ZTtcbn1cblxuYS5kcm9wZG93bi1pdGVtIHtcbiAgcGFkZGluZy1yaWdodDogM3JlbTtcbiAgd2hpdGUtc3BhY2U6IG5vd3JhcDtcbn1cblxuYS5kcm9wZG93bi1pdGVtOmhvdmVyIHtcbiAgYmFja2dyb3VuZC1jb2xvcjogd2hpdGVzbW9rZTtcbiAgY29sb3I6ICMwYTBhMGE7XG59XG5cbmEuZHJvcGRvd24taXRlbS5pcy1hY3RpdmUge1xuICBiYWNrZ3JvdW5kLWNvbG9yOiAjMDBkMWIyO1xuICBjb2xvcjogI2ZmZjtcbn1cblxuLmRyb3Bkb3duLWRpdmlkZXIge1xuICBiYWNrZ3JvdW5kLWNvbG9yOiAjZGJkYmRiO1xuICBib3JkZXI6IG5vbmU7XG4gIGRpc3BsYXk6IGJsb2NrO1xuICBoZWlnaHQ6IDFweDtcbiAgbWFyZ2luOiAwLjVyZW0gMDtcbn1cblxuLmxldmVsLWl0ZW0ge1xuICBhbGlnbi1pdGVtczogY2VudGVyO1xuICBkaXNwbGF5OiBmbGV4O1xuICBmbGV4LWJhc2lzOiBhdXRvO1xuICBmbGV4LWdyb3c6IDA7XG4gIGZsZXgtc2hyaW5rOiAwO1xuICBqdXN0aWZ5LWNvbnRlbnQ6IGNlbnRlcjtcbn1cblxuLmxldmVsLWl0ZW0gLnRpdGxlLFxuLmxldmVsLWl0ZW0gLnN1YnRpdGxlIHtcbiAgbWFyZ2luLWJvdHRvbTogMDtcbn1cblxuQG1lZGlhIHNjcmVlbiBhbmQgKG1heC13aWR0aDogNzY4cHgpIHtcbiAgLmxldmVsLWl0ZW06bm90KDpsYXN0LWNoaWxkKSB7XG4gICAgbWFyZ2luLWJvdHRvbTogMC43NXJlbTtcbiAgfVxufVxuXG4ubGV2ZWwtbGVmdCxcbi5sZXZlbC1yaWdodCB7XG4gIGZsZXgtYmFzaXM6IGF1dG87XG4gIGZsZXgtZ3JvdzogMDtcbiAgZmxleC1zaHJpbms6IDA7XG59XG5cbi5sZXZlbC1sZWZ0IC5sZXZlbC1pdGVtOm5vdCg6bGFzdC1jaGlsZCksXG4ubGV2ZWwtcmlnaHQgLmxldmVsLWl0ZW06bm90KDpsYXN0LWNoaWxkKSB7XG4gIG1hcmdpbi1yaWdodDogMC43NXJlbTtcbn1cblxuLmxldmVsLWxlZnQgLmxldmVsLWl0ZW0uaXMtZmxleGlibGUsXG4ubGV2ZWwtcmlnaHQgLmxldmVsLWl0ZW0uaXMtZmxleGlibGUge1xuICBmbGV4LWdyb3c6IDE7XG59XG5cbi5sZXZlbC1sZWZ0IHtcbiAgYWxpZ24taXRlbXM6IGNlbnRlcjtcbiAganVzdGlmeS1jb250ZW50OiBmbGV4LXN0YXJ0O1xufVxuXG5AbWVkaWEgc2NyZWVuIGFuZCAobWF4LXdpZHRoOiA3NjhweCkge1xuICAubGV2ZWwtbGVmdCArIC5sZXZlbC1yaWdodCB7XG4gICAgbWFyZ2luLXRvcDogMS41cmVtO1xuICB9XG59XG5cbkBtZWRpYSBzY3JlZW4gYW5kIChtaW4td2lkdGg6IDc2OXB4KSwgcHJpbnQge1xuICAubGV2ZWwtbGVmdCB7XG4gICAgZGlzcGxheTogZmxleDtcbiAgfVxufVxuXG4ubGV2ZWwtcmlnaHQge1xuICBhbGlnbi1pdGVtczogY2VudGVyO1xuICBqdXN0aWZ5LWNvbnRlbnQ6IGZsZXgtZW5kO1xufVxuXG5AbWVkaWEgc2NyZWVuIGFuZCAobWluLXdpZHRoOiA3NjlweCksIHByaW50IHtcbiAgLmxldmVsLXJpZ2h0IHtcbiAgICBkaXNwbGF5OiBmbGV4O1xuICB9XG59XG5cbi5sZXZlbCB7XG4gIGFsaWduLWl0ZW1zOiBjZW50ZXI7XG4gIGp1c3RpZnktY29udGVudDogc3BhY2UtYmV0d2Vlbjtcbn1cblxuLmxldmVsOm5vdCg6bGFzdC1jaGlsZCkge1xuICBtYXJnaW4tYm90dG9tOiAxLjVyZW07XG59XG5cbi5sZXZlbCBjb2RlIHtcbiAgYm9yZGVyLXJhZGl1czogM3B4O1xufVxuXG4ubGV2ZWwgaW1nIHtcbiAgZGlzcGxheTogaW5saW5lLWJsb2NrO1xuICB2ZXJ0aWNhbC1hbGlnbjogdG9wO1xufVxuXG4ubGV2ZWwuaXMtbW9iaWxlIHtcbiAgZGlzcGxheTogZmxleDtcbn1cblxuLmxldmVsLmlzLW1vYmlsZSAubGV2ZWwtbGVmdCxcbi5sZXZlbC5pcy1tb2JpbGUgLmxldmVsLXJpZ2h0IHtcbiAgZGlzcGxheTogZmxleDtcbn1cblxuLmxldmVsLmlzLW1vYmlsZSAubGV2ZWwtbGVmdCArIC5sZXZlbC1yaWdodCB7XG4gIG1hcmdpbi10b3A6IDA7XG59XG5cbi5sZXZlbC5pcy1tb2JpbGUgLmxldmVsLWl0ZW06bm90KDpsYXN0LWNoaWxkKSB7XG4gIG1hcmdpbi1ib3R0b206IDA7XG59XG5cbi5sZXZlbC5pcy1tb2JpbGUgLmxldmVsLWl0ZW06bm90KC5pcy1uYXJyb3cpIHtcbiAgZmxleC1ncm93OiAxO1xufVxuXG5AbWVkaWEgc2NyZWVuIGFuZCAobWluLXdpZHRoOiA3NjlweCksIHByaW50IHtcbiAgLmxldmVsIHtcbiAgICBkaXNwbGF5OiBmbGV4O1xuICB9XG4gIC5sZXZlbCA+IC5sZXZlbC1pdGVtOm5vdCguaXMtbmFycm93KSB7XG4gICAgZmxleC1ncm93OiAxO1xuICB9XG59XG5cbi5tZWRpYS1sZWZ0LFxuLm1lZGlhLXJpZ2h0IHtcbiAgZmxleC1iYXNpczogYXV0bztcbiAgZmxleC1ncm93OiAwO1xuICBmbGV4LXNocmluazogMDtcbn1cblxuLm1lZGlhLWxlZnQge1xuICBtYXJnaW4tcmlnaHQ6IDFyZW07XG59XG5cbi5tZWRpYS1yaWdodCB7XG4gIG1hcmdpbi1sZWZ0OiAxcmVtO1xufVxuXG4ubWVkaWEtY29udGVudCB7XG4gIGZsZXgtYmFzaXM6IGF1dG87XG4gIGZsZXgtZ3JvdzogMTtcbiAgZmxleC1zaHJpbms6IDE7XG4gIHRleHQtYWxpZ246IGxlZnQ7XG59XG5cbi5tZWRpYSB7XG4gIGFsaWduLWl0ZW1zOiBmbGV4LXN0YXJ0O1xuICBkaXNwbGF5OiBmbGV4O1xuICB0ZXh0LWFsaWduOiBsZWZ0O1xufVxuXG4ubWVkaWEgLmNvbnRlbnQ6bm90KDpsYXN0LWNoaWxkKSB7XG4gIG1hcmdpbi1ib3R0b206IDAuNzVyZW07XG59XG5cbi5tZWRpYSAubWVkaWEge1xuICBib3JkZXItdG9wOiAxcHggc29saWQgcmdiYSgyMTksIDIxOSwgMjE5LCAwLjUpO1xuICBkaXNwbGF5OiBmbGV4O1xuICBwYWRkaW5nLXRvcDogMC43NXJlbTtcbn1cblxuLm1lZGlhIC5tZWRpYSAuY29udGVudDpub3QoOmxhc3QtY2hpbGQpLFxuLm1lZGlhIC5tZWRpYSAuY29udHJvbDpub3QoOmxhc3QtY2hpbGQpIHtcbiAgbWFyZ2luLWJvdHRvbTogMC41cmVtO1xufVxuXG4ubWVkaWEgLm1lZGlhIC5tZWRpYSB7XG4gIHBhZGRpbmctdG9wOiAwLjVyZW07XG59XG5cbi5tZWRpYSAubWVkaWEgLm1lZGlhICsgLm1lZGlhIHtcbiAgbWFyZ2luLXRvcDogMC41cmVtO1xufVxuXG4ubWVkaWEgKyAubWVkaWEge1xuICBib3JkZXItdG9wOiAxcHggc29saWQgcmdiYSgyMTksIDIxOSwgMjE5LCAwLjUpO1xuICBtYXJnaW4tdG9wOiAxcmVtO1xuICBwYWRkaW5nLXRvcDogMXJlbTtcbn1cblxuLm1lZGlhLmlzLWxhcmdlICsgLm1lZGlhIHtcbiAgbWFyZ2luLXRvcDogMS41cmVtO1xuICBwYWRkaW5nLXRvcDogMS41cmVtO1xufVxuXG4ubWVudSB7XG4gIGZvbnQtc2l6ZTogMXJlbTtcbn1cblxuLm1lbnUtbGlzdCB7XG4gIGxpbmUtaGVpZ2h0OiAxLjI1O1xufVxuXG4ubWVudS1saXN0IGEge1xuICBib3JkZXItcmFkaXVzOiAycHg7XG4gIGNvbG9yOiAjNGE0YTRhO1xuICBkaXNwbGF5OiBibG9jaztcbiAgcGFkZGluZzogMC41ZW0gMC43NWVtO1xufVxuXG4ubWVudS1saXN0IGE6aG92ZXIge1xuICBiYWNrZ3JvdW5kLWNvbG9yOiB3aGl0ZXNtb2tlO1xuICBjb2xvcjogIzAwZDFiMjtcbn1cblxuLm1lbnUtbGlzdCBhLmlzLWFjdGl2ZSB7XG4gIGJhY2tncm91bmQtY29sb3I6ICMwMGQxYjI7XG4gIGNvbG9yOiAjZmZmO1xufVxuXG4ubWVudS1saXN0IGxpIHVsIHtcbiAgYm9yZGVyLWxlZnQ6IDFweCBzb2xpZCAjZGJkYmRiO1xuICBtYXJnaW46IDAuNzVlbTtcbiAgcGFkZGluZy1sZWZ0OiAwLjc1ZW07XG59XG5cbi5tZW51LWxhYmVsIHtcbiAgY29sb3I6ICM3YTdhN2E7XG4gIGZvbnQtc2l6ZTogMC44ZW07XG4gIGxldHRlci1zcGFjaW5nOiAwLjFlbTtcbiAgdGV4dC10cmFuc2Zvcm06IHVwcGVyY2FzZTtcbn1cblxuLm1lbnUtbGFiZWw6bm90KDpmaXJzdC1jaGlsZCkge1xuICBtYXJnaW4tdG9wOiAxZW07XG59XG5cbi5tZW51LWxhYmVsOm5vdCg6bGFzdC1jaGlsZCkge1xuICBtYXJnaW4tYm90dG9tOiAxZW07XG59XG5cbi5tZXNzYWdlIHtcbiAgYmFja2dyb3VuZC1jb2xvcjogd2hpdGVzbW9rZTtcbiAgYm9yZGVyLXJhZGl1czogM3B4O1xuICBmb250LXNpemU6IDFyZW07XG59XG5cbi5tZXNzYWdlOm5vdCg6bGFzdC1jaGlsZCkge1xuICBtYXJnaW4tYm90dG9tOiAxLjVyZW07XG59XG5cbi5tZXNzYWdlLmlzLXdoaXRlIHtcbiAgYmFja2dyb3VuZC1jb2xvcjogd2hpdGU7XG59XG5cbi5tZXNzYWdlLmlzLXdoaXRlIC5tZXNzYWdlLWhlYWRlciB7XG4gIGJhY2tncm91bmQtY29sb3I6IHdoaXRlO1xuICBjb2xvcjogIzBhMGEwYTtcbn1cblxuLm1lc3NhZ2UuaXMtd2hpdGUgLm1lc3NhZ2UtYm9keSB7XG4gIGJvcmRlci1jb2xvcjogd2hpdGU7XG4gIGNvbG9yOiAjNGQ0ZDRkO1xufVxuXG4ubWVzc2FnZS5pcy1ibGFjayB7XG4gIGJhY2tncm91bmQtY29sb3I6ICNmYWZhZmE7XG59XG5cbi5tZXNzYWdlLmlzLWJsYWNrIC5tZXNzYWdlLWhlYWRlciB7XG4gIGJhY2tncm91bmQtY29sb3I6ICMwYTBhMGE7XG4gIGNvbG9yOiB3aGl0ZTtcbn1cblxuLm1lc3NhZ2UuaXMtYmxhY2sgLm1lc3NhZ2UtYm9keSB7XG4gIGJvcmRlci1jb2xvcjogIzBhMGEwYTtcbiAgY29sb3I6ICMwOTA5MDk7XG59XG5cbi5tZXNzYWdlLmlzLWxpZ2h0IHtcbiAgYmFja2dyb3VuZC1jb2xvcjogI2ZhZmFmYTtcbn1cblxuLm1lc3NhZ2UuaXMtbGlnaHQgLm1lc3NhZ2UtaGVhZGVyIHtcbiAgYmFja2dyb3VuZC1jb2xvcjogd2hpdGVzbW9rZTtcbiAgY29sb3I6ICMzNjM2MzY7XG59XG5cbi5tZXNzYWdlLmlzLWxpZ2h0IC5tZXNzYWdlLWJvZHkge1xuICBib3JkZXItY29sb3I6IHdoaXRlc21va2U7XG4gIGNvbG9yOiAjNTA1MDUwO1xufVxuXG4ubWVzc2FnZS5pcy1kYXJrIHtcbiAgYmFja2dyb3VuZC1jb2xvcjogI2ZhZmFmYTtcbn1cblxuLm1lc3NhZ2UuaXMtZGFyayAubWVzc2FnZS1oZWFkZXIge1xuICBiYWNrZ3JvdW5kLWNvbG9yOiAjMzYzNjM2O1xuICBjb2xvcjogd2hpdGVzbW9rZTtcbn1cblxuLm1lc3NhZ2UuaXMtZGFyayAubWVzc2FnZS1ib2R5IHtcbiAgYm9yZGVyLWNvbG9yOiAjMzYzNjM2O1xuICBjb2xvcjogIzJhMmEyYTtcbn1cblxuLm1lc3NhZ2UuaXMtcHJpbWFyeSB7XG4gIGJhY2tncm91bmQtY29sb3I6ICNmNWZmZmQ7XG59XG5cbi5tZXNzYWdlLmlzLXByaW1hcnkgLm1lc3NhZ2UtaGVhZGVyIHtcbiAgYmFja2dyb3VuZC1jb2xvcjogIzAwZDFiMjtcbiAgY29sb3I6ICNmZmY7XG59XG5cbi5tZXNzYWdlLmlzLXByaW1hcnkgLm1lc3NhZ2UtYm9keSB7XG4gIGJvcmRlci1jb2xvcjogIzAwZDFiMjtcbiAgY29sb3I6ICMwMjEzMTA7XG59XG5cbi5tZXNzYWdlLmlzLWluZm8ge1xuICBiYWNrZ3JvdW5kLWNvbG9yOiAjZjZmOWZlO1xufVxuXG4ubWVzc2FnZS5pcy1pbmZvIC5tZXNzYWdlLWhlYWRlciB7XG4gIGJhY2tncm91bmQtY29sb3I6ICMzMjczZGM7XG4gIGNvbG9yOiAjZmZmO1xufVxuXG4ubWVzc2FnZS5pcy1pbmZvIC5tZXNzYWdlLWJvZHkge1xuICBib3JkZXItY29sb3I6ICMzMjczZGM7XG4gIGNvbG9yOiAjMjI1MDlhO1xufVxuXG4ubWVzc2FnZS5pcy1zdWNjZXNzIHtcbiAgYmFja2dyb3VuZC1jb2xvcjogI2Y2ZmVmOTtcbn1cblxuLm1lc3NhZ2UuaXMtc3VjY2VzcyAubWVzc2FnZS1oZWFkZXIge1xuICBiYWNrZ3JvdW5kLWNvbG9yOiAjMjNkMTYwO1xuICBjb2xvcjogI2ZmZjtcbn1cblxuLm1lc3NhZ2UuaXMtc3VjY2VzcyAubWVzc2FnZS1ib2R5IHtcbiAgYm9yZGVyLWNvbG9yOiAjMjNkMTYwO1xuICBjb2xvcjogIzBlMzAxYTtcbn1cblxuLm1lc3NhZ2UuaXMtd2FybmluZyB7XG4gIGJhY2tncm91bmQtY29sb3I6ICNmZmZkZjU7XG59XG5cbi5tZXNzYWdlLmlzLXdhcm5pbmcgLm1lc3NhZ2UtaGVhZGVyIHtcbiAgYmFja2dyb3VuZC1jb2xvcjogI2ZmZGQ1NztcbiAgY29sb3I6IHJnYmEoMCwgMCwgMCwgMC43KTtcbn1cblxuLm1lc3NhZ2UuaXMtd2FybmluZyAubWVzc2FnZS1ib2R5IHtcbiAgYm9yZGVyLWNvbG9yOiAjZmZkZDU3O1xuICBjb2xvcjogIzNiMzEwODtcbn1cblxuLm1lc3NhZ2UuaXMtZGFuZ2VyIHtcbiAgYmFja2dyb3VuZC1jb2xvcjogI2ZmZjVmNztcbn1cblxuLm1lc3NhZ2UuaXMtZGFuZ2VyIC5tZXNzYWdlLWhlYWRlciB7XG4gIGJhY2tncm91bmQtY29sb3I6ICNmZjM4NjA7XG4gIGNvbG9yOiAjZmZmO1xufVxuXG4ubWVzc2FnZS5pcy1kYW5nZXIgLm1lc3NhZ2UtYm9keSB7XG4gIGJvcmRlci1jb2xvcjogI2ZmMzg2MDtcbiAgY29sb3I6ICNjZDA5MzA7XG59XG5cbi5tZXNzYWdlLWhlYWRlciB7XG4gIGFsaWduLWl0ZW1zOiBjZW50ZXI7XG4gIGJhY2tncm91bmQtY29sb3I6ICM0YTRhNGE7XG4gIGJvcmRlci1yYWRpdXM6IDNweCAzcHggMCAwO1xuICBjb2xvcjogI2ZmZjtcbiAgZGlzcGxheTogZmxleDtcbiAganVzdGlmeS1jb250ZW50OiBzcGFjZS1iZXR3ZWVuO1xuICBsaW5lLWhlaWdodDogMS4yNTtcbiAgcGFkZGluZzogMC41ZW0gMC43NWVtO1xuICBwb3NpdGlvbjogcmVsYXRpdmU7XG59XG5cbi5tZXNzYWdlLWhlYWRlciBhOm5vdCguYnV0dG9uKSxcbi5tZXNzYWdlLWhlYWRlciBzdHJvbmcge1xuICBjb2xvcjogY3VycmVudENvbG9yO1xufVxuXG4ubWVzc2FnZS1oZWFkZXIgYTpub3QoLmJ1dHRvbikge1xuICB0ZXh0LWRlY29yYXRpb246IHVuZGVybGluZTtcbn1cblxuLm1lc3NhZ2UtaGVhZGVyIC5kZWxldGUge1xuICBmbGV4LWdyb3c6IDA7XG4gIGZsZXgtc2hyaW5rOiAwO1xuICBtYXJnaW4tbGVmdDogMC43NWVtO1xufVxuXG4ubWVzc2FnZS1oZWFkZXIgKyAubWVzc2FnZS1ib2R5IHtcbiAgYm9yZGVyLXRvcC1sZWZ0LXJhZGl1czogMDtcbiAgYm9yZGVyLXRvcC1yaWdodC1yYWRpdXM6IDA7XG4gIGJvcmRlci10b3A6IG5vbmU7XG59XG5cbi5tZXNzYWdlLWJvZHkge1xuICBib3JkZXI6IDFweCBzb2xpZCAjZGJkYmRiO1xuICBib3JkZXItcmFkaXVzOiAzcHg7XG4gIGNvbG9yOiAjNGE0YTRhO1xuICBwYWRkaW5nOiAxZW0gMS4yNWVtO1xufVxuXG4ubWVzc2FnZS1ib2R5IGE6bm90KC5idXR0b24pLFxuLm1lc3NhZ2UtYm9keSBzdHJvbmcge1xuICBjb2xvcjogY3VycmVudENvbG9yO1xufVxuXG4ubWVzc2FnZS1ib2R5IGE6bm90KC5idXR0b24pIHtcbiAgdGV4dC1kZWNvcmF0aW9uOiB1bmRlcmxpbmU7XG59XG5cbi5tZXNzYWdlLWJvZHkgY29kZSxcbi5tZXNzYWdlLWJvZHkgcHJlIHtcbiAgYmFja2dyb3VuZDogd2hpdGU7XG59XG5cbi5tZXNzYWdlLWJvZHkgcHJlIGNvZGUge1xuICBiYWNrZ3JvdW5kOiB0cmFuc3BhcmVudDtcbn1cblxuLm1vZGFsLWJhY2tncm91bmQge1xuICBib3R0b206IDA7XG4gIGxlZnQ6IDA7XG4gIHBvc2l0aW9uOiBhYnNvbHV0ZTtcbiAgcmlnaHQ6IDA7XG4gIHRvcDogMDtcbiAgYmFja2dyb3VuZC1jb2xvcjogcmdiYSgxMCwgMTAsIDEwLCAwLjg2KTtcbn1cblxuLm1vZGFsLWNvbnRlbnQsXG4ubW9kYWwtY2FyZCB7XG4gIG1hcmdpbjogMCAyMHB4O1xuICBtYXgtaGVpZ2h0OiBjYWxjKDEwMHZoIC0gMTYwcHgpO1xuICBvdmVyZmxvdzogYXV0bztcbiAgcG9zaXRpb246IHJlbGF0aXZlO1xuICB3aWR0aDogMTAwJTtcbn1cblxuQG1lZGlhIHNjcmVlbiBhbmQgKG1pbi13aWR0aDogNzY5cHgpLCBwcmludCB7XG4gIC5tb2RhbC1jb250ZW50LFxuICAubW9kYWwtY2FyZCB7XG4gICAgbWFyZ2luOiAwIGF1dG87XG4gICAgbWF4LWhlaWdodDogY2FsYygxMDB2aCAtIDQwcHgpO1xuICAgIHdpZHRoOiA2NDBweDtcbiAgfVxufVxuXG4ubW9kYWwtY2xvc2Uge1xuICAtd2Via2l0LXRvdWNoLWNhbGxvdXQ6IG5vbmU7XG4gIC13ZWJraXQtdXNlci1zZWxlY3Q6IG5vbmU7XG4gIC1tb3otdXNlci1zZWxlY3Q6IG5vbmU7XG4gIC1tcy11c2VyLXNlbGVjdDogbm9uZTtcbiAgdXNlci1zZWxlY3Q6IG5vbmU7XG4gIC1tb3otYXBwZWFyYW5jZTogbm9uZTtcbiAgLXdlYmtpdC1hcHBlYXJhbmNlOiBub25lO1xuICBiYWNrZ3JvdW5kLWNvbG9yOiByZ2JhKDEwLCAxMCwgMTAsIDAuMik7XG4gIGJvcmRlcjogbm9uZTtcbiAgYm9yZGVyLXJhZGl1czogMjkwNDg2cHg7XG4gIGN1cnNvcjogcG9pbnRlcjtcbiAgZGlzcGxheTogaW5saW5lLWJsb2NrO1xuICBmbGV4LWdyb3c6IDA7XG4gIGZsZXgtc2hyaW5rOiAwO1xuICBmb250LXNpemU6IDFyZW07XG4gIGhlaWdodDogMjBweDtcbiAgbWF4LWhlaWdodDogMjBweDtcbiAgbWF4LXdpZHRoOiAyMHB4O1xuICBtaW4taGVpZ2h0OiAyMHB4O1xuICBtaW4td2lkdGg6IDIwcHg7XG4gIG91dGxpbmU6IG5vbmU7XG4gIHBvc2l0aW9uOiByZWxhdGl2ZTtcbiAgdmVydGljYWwtYWxpZ246IHRvcDtcbiAgd2lkdGg6IDIwcHg7XG4gIGJhY2tncm91bmQ6IG5vbmU7XG4gIGhlaWdodDogNDBweDtcbiAgcG9zaXRpb246IGZpeGVkO1xuICByaWdodDogMjBweDtcbiAgdG9wOiAyMHB4O1xuICB3aWR0aDogNDBweDtcbn1cblxuLm1vZGFsLWNsb3NlOmJlZm9yZSwgLm1vZGFsLWNsb3NlOmFmdGVyIHtcbiAgYmFja2dyb3VuZC1jb2xvcjogd2hpdGU7XG4gIGNvbnRlbnQ6IFwiXCI7XG4gIGRpc3BsYXk6IGJsb2NrO1xuICBsZWZ0OiA1MCU7XG4gIHBvc2l0aW9uOiBhYnNvbHV0ZTtcbiAgdG9wOiA1MCU7XG4gIHRyYW5zZm9ybTogdHJhbnNsYXRlWCgtNTAlKSB0cmFuc2xhdGVZKC01MCUpIHJvdGF0ZSg0NWRlZyk7XG4gIHRyYW5zZm9ybS1vcmlnaW46IGNlbnRlciBjZW50ZXI7XG59XG5cbi5tb2RhbC1jbG9zZTpiZWZvcmUge1xuICBoZWlnaHQ6IDJweDtcbiAgd2lkdGg6IDUwJTtcbn1cblxuLm1vZGFsLWNsb3NlOmFmdGVyIHtcbiAgaGVpZ2h0OiA1MCU7XG4gIHdpZHRoOiAycHg7XG59XG5cbi5tb2RhbC1jbG9zZTpob3ZlciwgLm1vZGFsLWNsb3NlOmZvY3VzIHtcbiAgYmFja2dyb3VuZC1jb2xvcjogcmdiYSgxMCwgMTAsIDEwLCAwLjMpO1xufVxuXG4ubW9kYWwtY2xvc2U6YWN0aXZlIHtcbiAgYmFja2dyb3VuZC1jb2xvcjogcmdiYSgxMCwgMTAsIDEwLCAwLjQpO1xufVxuXG4ubW9kYWwtY2xvc2UuaXMtc21hbGwge1xuICBoZWlnaHQ6IDE2cHg7XG4gIG1heC1oZWlnaHQ6IDE2cHg7XG4gIG1heC13aWR0aDogMTZweDtcbiAgbWluLWhlaWdodDogMTZweDtcbiAgbWluLXdpZHRoOiAxNnB4O1xuICB3aWR0aDogMTZweDtcbn1cblxuLm1vZGFsLWNsb3NlLmlzLW1lZGl1bSB7XG4gIGhlaWdodDogMjRweDtcbiAgbWF4LWhlaWdodDogMjRweDtcbiAgbWF4LXdpZHRoOiAyNHB4O1xuICBtaW4taGVpZ2h0OiAyNHB4O1xuICBtaW4td2lkdGg6IDI0cHg7XG4gIHdpZHRoOiAyNHB4O1xufVxuXG4ubW9kYWwtY2xvc2UuaXMtbGFyZ2Uge1xuICBoZWlnaHQ6IDMycHg7XG4gIG1heC1oZWlnaHQ6IDMycHg7XG4gIG1heC13aWR0aDogMzJweDtcbiAgbWluLWhlaWdodDogMzJweDtcbiAgbWluLXdpZHRoOiAzMnB4O1xuICB3aWR0aDogMzJweDtcbn1cblxuLm1vZGFsLWNhcmQge1xuICBkaXNwbGF5OiBmbGV4O1xuICBmbGV4LWRpcmVjdGlvbjogY29sdW1uO1xuICBtYXgtaGVpZ2h0OiBjYWxjKDEwMHZoIC0gNDBweCk7XG4gIG92ZXJmbG93OiBoaWRkZW47XG59XG5cbi5tb2RhbC1jYXJkLWhlYWQsXG4ubW9kYWwtY2FyZC1mb290IHtcbiAgYWxpZ24taXRlbXM6IGNlbnRlcjtcbiAgYmFja2dyb3VuZC1jb2xvcjogd2hpdGVzbW9rZTtcbiAgZGlzcGxheTogZmxleDtcbiAgZmxleC1zaHJpbms6IDA7XG4gIGp1c3RpZnktY29udGVudDogZmxleC1zdGFydDtcbiAgcGFkZGluZzogMjBweDtcbiAgcG9zaXRpb246IHJlbGF0aXZlO1xufVxuXG4ubW9kYWwtY2FyZC1oZWFkIHtcbiAgYm9yZGVyLWJvdHRvbTogMXB4IHNvbGlkICNkYmRiZGI7XG4gIGJvcmRlci10b3AtbGVmdC1yYWRpdXM6IDVweDtcbiAgYm9yZGVyLXRvcC1yaWdodC1yYWRpdXM6IDVweDtcbn1cblxuLm1vZGFsLWNhcmQtdGl0bGUge1xuICBjb2xvcjogIzM2MzYzNjtcbiAgZmxleC1ncm93OiAxO1xuICBmbGV4LXNocmluazogMDtcbiAgZm9udC1zaXplOiAxLjVyZW07XG4gIGxpbmUtaGVpZ2h0OiAxO1xufVxuXG4ubW9kYWwtY2FyZC1mb290IHtcbiAgYm9yZGVyLWJvdHRvbS1sZWZ0LXJhZGl1czogNXB4O1xuICBib3JkZXItYm90dG9tLXJpZ2h0LXJhZGl1czogNXB4O1xuICBib3JkZXItdG9wOiAxcHggc29saWQgI2RiZGJkYjtcbn1cblxuLm1vZGFsLWNhcmQtZm9vdCAuYnV0dG9uOm5vdCg6bGFzdC1jaGlsZCkge1xuICBtYXJnaW4tcmlnaHQ6IDEwcHg7XG59XG5cbi5tb2RhbC1jYXJkLWJvZHkge1xuICAtd2Via2l0LW92ZXJmbG93LXNjcm9sbGluZzogdG91Y2g7XG4gIGJhY2tncm91bmQtY29sb3I6IHdoaXRlO1xuICBmbGV4LWdyb3c6IDE7XG4gIGZsZXgtc2hyaW5rOiAxO1xuICBvdmVyZmxvdzogYXV0bztcbiAgcGFkZGluZzogMjBweDtcbn1cblxuLm1vZGFsIHtcbiAgYm90dG9tOiAwO1xuICBsZWZ0OiAwO1xuICBwb3NpdGlvbjogYWJzb2x1dGU7XG4gIHJpZ2h0OiAwO1xuICB0b3A6IDA7XG4gIGFsaWduLWl0ZW1zOiBjZW50ZXI7XG4gIGRpc3BsYXk6IG5vbmU7XG4gIGp1c3RpZnktY29udGVudDogY2VudGVyO1xuICBvdmVyZmxvdzogaGlkZGVuO1xuICBwb3NpdGlvbjogZml4ZWQ7XG4gIHotaW5kZXg6IDIwO1xufVxuXG4ubW9kYWwuaXMtYWN0aXZlIHtcbiAgZGlzcGxheTogZmxleDtcbn1cblxuLm5hdi10b2dnbGUge1xuICBjdXJzb3I6IHBvaW50ZXI7XG4gIGRpc3BsYXk6IGJsb2NrO1xuICBoZWlnaHQ6IDMuMjVyZW07XG4gIHBvc2l0aW9uOiByZWxhdGl2ZTtcbiAgd2lkdGg6IDMuMjVyZW07XG59XG5cbi5uYXYtdG9nZ2xlIHNwYW4ge1xuICBiYWNrZ3JvdW5kLWNvbG9yOiAjNGE0YTRhO1xuICBkaXNwbGF5OiBibG9jaztcbiAgaGVpZ2h0OiAxcHg7XG4gIGxlZnQ6IDUwJTtcbiAgbWFyZ2luLWxlZnQ6IC03cHg7XG4gIHBvc2l0aW9uOiBhYnNvbHV0ZTtcbiAgdG9wOiA1MCU7XG4gIHRyYW5zaXRpb246IG5vbmUgODZtcyBlYXNlLW91dDtcbiAgdHJhbnNpdGlvbi1wcm9wZXJ0eTogYmFja2dyb3VuZCwgbGVmdCwgb3BhY2l0eSwgdHJhbnNmb3JtO1xuICB3aWR0aDogMTVweDtcbn1cblxuLm5hdi10b2dnbGUgc3BhbjpudGgtY2hpbGQoMSkge1xuICBtYXJnaW4tdG9wOiAtNnB4O1xufVxuXG4ubmF2LXRvZ2dsZSBzcGFuOm50aC1jaGlsZCgyKSB7XG4gIG1hcmdpbi10b3A6IC0xcHg7XG59XG5cbi5uYXYtdG9nZ2xlIHNwYW46bnRoLWNoaWxkKDMpIHtcbiAgbWFyZ2luLXRvcDogNHB4O1xufVxuXG4ubmF2LXRvZ2dsZTpob3ZlciB7XG4gIGJhY2tncm91bmQtY29sb3I6IHdoaXRlc21va2U7XG59XG5cbi5uYXYtdG9nZ2xlLmlzLWFjdGl2ZSBzcGFuIHtcbiAgYmFja2dyb3VuZC1jb2xvcjogIzAwZDFiMjtcbn1cblxuLm5hdi10b2dnbGUuaXMtYWN0aXZlIHNwYW46bnRoLWNoaWxkKDEpIHtcbiAgbWFyZ2luLWxlZnQ6IC01cHg7XG4gIHRyYW5zZm9ybTogcm90YXRlKDQ1ZGVnKTtcbiAgdHJhbnNmb3JtLW9yaWdpbjogbGVmdCB0b3A7XG59XG5cbi5uYXYtdG9nZ2xlLmlzLWFjdGl2ZSBzcGFuOm50aC1jaGlsZCgyKSB7XG4gIG9wYWNpdHk6IDA7XG59XG5cbi5uYXYtdG9nZ2xlLmlzLWFjdGl2ZSBzcGFuOm50aC1jaGlsZCgzKSB7XG4gIG1hcmdpbi1sZWZ0OiAtNXB4O1xuICB0cmFuc2Zvcm06IHJvdGF0ZSgtNDVkZWcpO1xuICB0cmFuc2Zvcm0tb3JpZ2luOiBsZWZ0IGJvdHRvbTtcbn1cblxuQG1lZGlhIHNjcmVlbiBhbmQgKG1pbi13aWR0aDogNzY5cHgpLCBwcmludCB7XG4gIC5uYXYtdG9nZ2xlIHtcbiAgICBkaXNwbGF5OiBub25lO1xuICB9XG59XG5cbi5uYXYtaXRlbSB7XG4gIGFsaWduLWl0ZW1zOiBjZW50ZXI7XG4gIGRpc3BsYXk6IGZsZXg7XG4gIGZsZXgtZ3JvdzogMDtcbiAgZmxleC1zaHJpbms6IDA7XG4gIGZvbnQtc2l6ZTogMXJlbTtcbiAganVzdGlmeS1jb250ZW50OiBjZW50ZXI7XG4gIGxpbmUtaGVpZ2h0OiAxLjU7XG4gIHBhZGRpbmc6IDAuNXJlbSAwLjc1cmVtO1xufVxuXG4ubmF2LWl0ZW0gYSB7XG4gIGZsZXgtZ3JvdzogMTtcbiAgZmxleC1zaHJpbms6IDA7XG59XG5cbi5uYXYtaXRlbSBpbWcge1xuICBtYXgtaGVpZ2h0OiAxLjc1cmVtO1xufVxuXG4ubmF2LWl0ZW0gLnRhZzpmaXJzdC1jaGlsZDpub3QoOmxhc3QtY2hpbGQpIHtcbiAgbWFyZ2luLXJpZ2h0OiAwLjVyZW07XG59XG5cbi5uYXYtaXRlbSAudGFnOmxhc3QtY2hpbGQ6bm90KDpmaXJzdC1jaGlsZCkge1xuICBtYXJnaW4tbGVmdDogMC41cmVtO1xufVxuXG5AbWVkaWEgc2NyZWVuIGFuZCAobWF4LXdpZHRoOiA3NjhweCkge1xuICAubmF2LWl0ZW0ge1xuICAgIGp1c3RpZnktY29udGVudDogZmxleC1zdGFydDtcbiAgfVxufVxuXG4ubmF2LWl0ZW0gYTpub3QoLmJ1dHRvbiksXG5hLm5hdi1pdGVtOm5vdCguYnV0dG9uKSB7XG4gIGNvbG9yOiAjN2E3YTdhO1xufVxuXG4ubmF2LWl0ZW0gYTpub3QoLmJ1dHRvbik6aG92ZXIsXG5hLm5hdi1pdGVtOm5vdCguYnV0dG9uKTpob3ZlciB7XG4gIGNvbG9yOiAjMzYzNjM2O1xufVxuXG4ubmF2LWl0ZW0gYTpub3QoLmJ1dHRvbikuaXMtYWN0aXZlLFxuYS5uYXYtaXRlbTpub3QoLmJ1dHRvbikuaXMtYWN0aXZlIHtcbiAgY29sb3I6ICMzNjM2MzY7XG59XG5cbi5uYXYtaXRlbSBhOm5vdCguYnV0dG9uKS5pcy10YWIsXG5hLm5hdi1pdGVtOm5vdCguYnV0dG9uKS5pcy10YWIge1xuICBib3JkZXItYm90dG9tOiAxcHggc29saWQgdHJhbnNwYXJlbnQ7XG4gIGJvcmRlci10b3A6IDFweCBzb2xpZCB0cmFuc3BhcmVudDtcbiAgcGFkZGluZy1ib3R0b206IGNhbGMoMC43NXJlbSAtIDFweCk7XG4gIHBhZGRpbmctbGVmdDogMXJlbTtcbiAgcGFkZGluZy1yaWdodDogMXJlbTtcbiAgcGFkZGluZy10b3A6IGNhbGMoMC43NXJlbSAtIDFweCk7XG59XG5cbi5uYXYtaXRlbSBhOm5vdCguYnV0dG9uKS5pcy10YWI6aG92ZXIsXG5hLm5hdi1pdGVtOm5vdCguYnV0dG9uKS5pcy10YWI6aG92ZXIge1xuICBib3JkZXItYm90dG9tLWNvbG9yOiAjMDBkMWIyO1xuICBib3JkZXItdG9wLWNvbG9yOiB0cmFuc3BhcmVudDtcbn1cblxuLm5hdi1pdGVtIGE6bm90KC5idXR0b24pLmlzLXRhYi5pcy1hY3RpdmUsXG5hLm5hdi1pdGVtOm5vdCguYnV0dG9uKS5pcy10YWIuaXMtYWN0aXZlIHtcbiAgYm9yZGVyLWJvdHRvbTogM3B4IHNvbGlkICMwMGQxYjI7XG4gIGNvbG9yOiAjMDBkMWIyO1xuICBwYWRkaW5nLWJvdHRvbTogY2FsYygwLjc1cmVtIC0gM3B4KTtcbn1cblxuQG1lZGlhIHNjcmVlbiBhbmQgKG1pbi13aWR0aDogMTAwOHB4KSB7XG4gIC5uYXYtaXRlbSBhOm5vdCguYnV0dG9uKS5pcy1icmFuZCxcbiAgYS5uYXYtaXRlbTpub3QoLmJ1dHRvbikuaXMtYnJhbmQge1xuICAgIHBhZGRpbmctbGVmdDogMDtcbiAgfVxufVxuXG4ubmF2LWxlZnQsXG4ubmF2LXJpZ2h0IHtcbiAgLXdlYmtpdC1vdmVyZmxvdy1zY3JvbGxpbmc6IHRvdWNoO1xuICBhbGlnbi1pdGVtczogc3RyZXRjaDtcbiAgZGlzcGxheTogZmxleDtcbiAgZmxleC1ncm93OiAxO1xuICBmbGV4LXNocmluazogMDtcbiAgbWF4LXdpZHRoOiAxMDAlO1xuICBvdmVyZmxvdzogYXV0bztcbn1cblxuQG1lZGlhIHNjcmVlbiBhbmQgKG1pbi13aWR0aDogMTIwMHB4KSB7XG4gIC5uYXYtbGVmdCxcbiAgLm5hdi1yaWdodCB7XG4gICAgZmxleC1iYXNpczogMDtcbiAgfVxufVxuXG4ubmF2LWxlZnQge1xuICBqdXN0aWZ5LWNvbnRlbnQ6IGZsZXgtc3RhcnQ7XG4gIHdoaXRlLXNwYWNlOiBub3dyYXA7XG59XG5cbi5uYXYtcmlnaHQge1xuICBqdXN0aWZ5LWNvbnRlbnQ6IGZsZXgtZW5kO1xufVxuXG4ubmF2LWNlbnRlciB7XG4gIGFsaWduLWl0ZW1zOiBzdHJldGNoO1xuICBkaXNwbGF5OiBmbGV4O1xuICBmbGV4LWdyb3c6IDA7XG4gIGZsZXgtc2hyaW5rOiAwO1xuICBqdXN0aWZ5LWNvbnRlbnQ6IGNlbnRlcjtcbiAgbWFyZ2luLWxlZnQ6IGF1dG87XG4gIG1hcmdpbi1yaWdodDogYXV0bztcbn1cblxuQG1lZGlhIHNjcmVlbiBhbmQgKG1heC13aWR0aDogNzY4cHgpIHtcbiAgLm5hdi1tZW51Lm5hdi1yaWdodCB7XG4gICAgYmFja2dyb3VuZC1jb2xvcjogd2hpdGU7XG4gICAgYm94LXNoYWRvdzogMCA0cHggN3B4IHJnYmEoMTAsIDEwLCAxMCwgMC4xKTtcbiAgICBsZWZ0OiAwO1xuICAgIGRpc3BsYXk6IG5vbmU7XG4gICAgcmlnaHQ6IDA7XG4gICAgdG9wOiAxMDAlO1xuICAgIHBvc2l0aW9uOiBhYnNvbHV0ZTtcbiAgfVxuICAubmF2LW1lbnUubmF2LXJpZ2h0IC5uYXYtaXRlbSB7XG4gICAgYm9yZGVyLXRvcDogMXB4IHNvbGlkIHJnYmEoMjE5LCAyMTksIDIxOSwgMC41KTtcbiAgICBwYWRkaW5nOiAwLjc1cmVtO1xuICB9XG4gIC5uYXYtbWVudS5uYXYtcmlnaHQuaXMtYWN0aXZlIHtcbiAgICBkaXNwbGF5OiBibG9jaztcbiAgfVxufVxuXG4ubmF2IHtcbiAgYWxpZ24taXRlbXM6IHN0cmV0Y2g7XG4gIGJhY2tncm91bmQtY29sb3I6IHdoaXRlO1xuICBkaXNwbGF5OiBmbGV4O1xuICBoZWlnaHQ6IDMuMjVyZW07XG4gIHBvc2l0aW9uOiByZWxhdGl2ZTtcbiAgdGV4dC1hbGlnbjogY2VudGVyO1xuICB6LWluZGV4OiAxMDtcbn1cblxuLm5hdiA+IC5jb250YWluZXIge1xuICBhbGlnbi1pdGVtczogc3RyZXRjaDtcbiAgZGlzcGxheTogZmxleDtcbiAgbWluLWhlaWdodDogMy4yNXJlbTtcbiAgd2lkdGg6IDEwMCU7XG59XG5cbi5uYXYuaGFzLXNoYWRvdyB7XG4gIGJveC1zaGFkb3c6IDAgMnB4IDNweCByZ2JhKDEwLCAxMCwgMTAsIDAuMSk7XG59XG5cbi5uYXZiYXIge1xuICBiYWNrZ3JvdW5kLWNvbG9yOiB3aGl0ZTtcbiAgbWluLWhlaWdodDogMy4yNXJlbTtcbiAgcG9zaXRpb246IHJlbGF0aXZlO1xufVxuXG4ubmF2YmFyID4gLmNvbnRhaW5lciB7XG4gIGFsaWduLWl0ZW1zOiBzdHJldGNoO1xuICBkaXNwbGF5OiBmbGV4O1xuICBtaW4taGVpZ2h0OiAzLjI1cmVtO1xuICB3aWR0aDogMTAwJTtcbn1cblxuLm5hdmJhci5oYXMtc2hhZG93IHtcbiAgYm94LXNoYWRvdzogMCAycHggM3B4IHJnYmEoMTAsIDEwLCAxMCwgMC4xKTtcbn1cblxuLm5hdmJhci1icmFuZCB7XG4gIC13ZWJraXQtb3ZlcmZsb3ctc2Nyb2xsaW5nOiB0b3VjaDtcbiAgYWxpZ24taXRlbXM6IHN0cmV0Y2g7XG4gIGRpc3BsYXk6IGZsZXg7XG4gIG1pbi1oZWlnaHQ6IDMuMjVyZW07XG4gIG92ZXJmbG93LXg6IGF1dG87XG4gIG92ZXJmbG93LXk6IGhpZGRlbjtcbn1cblxuLm5hdmJhci1idXJnZXIge1xuICBjdXJzb3I6IHBvaW50ZXI7XG4gIGRpc3BsYXk6IGJsb2NrO1xuICBoZWlnaHQ6IDMuMjVyZW07XG4gIHBvc2l0aW9uOiByZWxhdGl2ZTtcbiAgd2lkdGg6IDMuMjVyZW07XG4gIG1hcmdpbi1sZWZ0OiBhdXRvO1xufVxuXG4ubmF2YmFyLWJ1cmdlciBzcGFuIHtcbiAgYmFja2dyb3VuZC1jb2xvcjogIzRhNGE0YTtcbiAgZGlzcGxheTogYmxvY2s7XG4gIGhlaWdodDogMXB4O1xuICBsZWZ0OiA1MCU7XG4gIG1hcmdpbi1sZWZ0OiAtN3B4O1xuICBwb3NpdGlvbjogYWJzb2x1dGU7XG4gIHRvcDogNTAlO1xuICB0cmFuc2l0aW9uOiBub25lIDg2bXMgZWFzZS1vdXQ7XG4gIHRyYW5zaXRpb24tcHJvcGVydHk6IGJhY2tncm91bmQsIGxlZnQsIG9wYWNpdHksIHRyYW5zZm9ybTtcbiAgd2lkdGg6IDE1cHg7XG59XG5cbi5uYXZiYXItYnVyZ2VyIHNwYW46bnRoLWNoaWxkKDEpIHtcbiAgbWFyZ2luLXRvcDogLTZweDtcbn1cblxuLm5hdmJhci1idXJnZXIgc3BhbjpudGgtY2hpbGQoMikge1xuICBtYXJnaW4tdG9wOiAtMXB4O1xufVxuXG4ubmF2YmFyLWJ1cmdlciBzcGFuOm50aC1jaGlsZCgzKSB7XG4gIG1hcmdpbi10b3A6IDRweDtcbn1cblxuLm5hdmJhci1idXJnZXI6aG92ZXIge1xuICBiYWNrZ3JvdW5kLWNvbG9yOiB3aGl0ZXNtb2tlO1xufVxuXG4ubmF2YmFyLWJ1cmdlci5pcy1hY3RpdmUgc3BhbiB7XG4gIGJhY2tncm91bmQtY29sb3I6ICMwMGQxYjI7XG59XG5cbi5uYXZiYXItYnVyZ2VyLmlzLWFjdGl2ZSBzcGFuOm50aC1jaGlsZCgxKSB7XG4gIG1hcmdpbi1sZWZ0OiAtNXB4O1xuICB0cmFuc2Zvcm06IHJvdGF0ZSg0NWRlZyk7XG4gIHRyYW5zZm9ybS1vcmlnaW46IGxlZnQgdG9wO1xufVxuXG4ubmF2YmFyLWJ1cmdlci5pcy1hY3RpdmUgc3BhbjpudGgtY2hpbGQoMikge1xuICBvcGFjaXR5OiAwO1xufVxuXG4ubmF2YmFyLWJ1cmdlci5pcy1hY3RpdmUgc3BhbjpudGgtY2hpbGQoMykge1xuICBtYXJnaW4tbGVmdDogLTVweDtcbiAgdHJhbnNmb3JtOiByb3RhdGUoLTQ1ZGVnKTtcbiAgdHJhbnNmb3JtLW9yaWdpbjogbGVmdCBib3R0b207XG59XG5cbi5uYXZiYXItbWVudSB7XG4gIGRpc3BsYXk6IG5vbmU7XG59XG5cbi5uYXZiYXItaXRlbSxcbi5uYXZiYXItbGluayB7XG4gIGNvbG9yOiAjNGE0YTRhO1xuICBkaXNwbGF5OiBibG9jaztcbiAgbGluZS1oZWlnaHQ6IDEuNTtcbiAgcGFkZGluZzogMC41cmVtIDFyZW07XG4gIHBvc2l0aW9uOiByZWxhdGl2ZTtcbn1cblxuYS5uYXZiYXItaXRlbTpob3ZlciwgYS5uYXZiYXItaXRlbS5pcy1hY3RpdmUsXG4ubmF2YmFyLWxpbms6aG92ZXIsXG4ubmF2YmFyLWxpbmsuaXMtYWN0aXZlIHtcbiAgYmFja2dyb3VuZC1jb2xvcjogd2hpdGVzbW9rZTtcbiAgY29sb3I6ICMwYTBhMGE7XG59XG5cbi5uYXZiYXItaXRlbSB7XG4gIGZsZXgtZ3JvdzogMDtcbiAgZmxleC1zaHJpbms6IDA7XG59XG5cbi5uYXZiYXItaXRlbSBpbWcge1xuICBtYXgtaGVpZ2h0OiAxLjc1cmVtO1xufVxuXG4ubmF2YmFyLWl0ZW0uaGFzLWRyb3Bkb3duIHtcbiAgcGFkZGluZzogMDtcbn1cblxuLm5hdmJhci1pdGVtLmlzLXRhYiB7XG4gIGJvcmRlci1ib3R0b206IDFweCBzb2xpZCB0cmFuc3BhcmVudDtcbiAgbWluLWhlaWdodDogMy4yNXJlbTtcbiAgcGFkZGluZy1ib3R0b206IGNhbGMoMC41cmVtIC0gMXB4KTtcbn1cblxuLm5hdmJhci1pdGVtLmlzLXRhYjpob3ZlciB7XG4gIGJhY2tncm91bmQtY29sb3I6IHRyYW5zcGFyZW50O1xuICBib3JkZXItYm90dG9tLWNvbG9yOiAjMDBkMWIyO1xufVxuXG4ubmF2YmFyLWl0ZW0uaXMtdGFiLmlzLWFjdGl2ZSB7XG4gIGJhY2tncm91bmQtY29sb3I6IHRyYW5zcGFyZW50O1xuICBib3JkZXItYm90dG9tOiAzcHggc29saWQgIzAwZDFiMjtcbiAgY29sb3I6ICMwMGQxYjI7XG4gIHBhZGRpbmctYm90dG9tOiBjYWxjKDAuNXJlbSAtIDNweCk7XG59XG5cbi5uYXZiYXItY29udGVudCB7XG4gIGZsZXgtZ3JvdzogMTtcbiAgZmxleC1zaHJpbms6IDE7XG59XG5cbi5uYXZiYXItbGluayB7XG4gIHBhZGRpbmctcmlnaHQ6IDIuNWVtO1xufVxuXG4ubmF2YmFyLWRyb3Bkb3duIHtcbiAgZm9udC1zaXplOiAwLjg3NXJlbTtcbiAgcGFkZGluZy1ib3R0b206IDAuNXJlbTtcbiAgcGFkZGluZy10b3A6IDAuNXJlbTtcbn1cblxuLm5hdmJhci1kcm9wZG93biAubmF2YmFyLWl0ZW0ge1xuICBwYWRkaW5nLWxlZnQ6IDEuNXJlbTtcbiAgcGFkZGluZy1yaWdodDogMS41cmVtO1xufVxuXG4ubmF2YmFyLWRpdmlkZXIge1xuICBiYWNrZ3JvdW5kLWNvbG9yOiAjZGJkYmRiO1xuICBib3JkZXI6IG5vbmU7XG4gIGRpc3BsYXk6IG5vbmU7XG4gIGhlaWdodDogMXB4O1xuICBtYXJnaW46IDAuNXJlbSAwO1xufVxuXG5AbWVkaWEgc2NyZWVuIGFuZCAobWF4LXdpZHRoOiAxMDA3cHgpIHtcbiAgLm5hdmJhci1icmFuZCAubmF2YmFyLWl0ZW0ge1xuICAgIGFsaWduLWl0ZW1zOiBjZW50ZXI7XG4gICAgZGlzcGxheTogZmxleDtcbiAgfVxuICAubmF2YmFyLW1lbnUge1xuICAgIGJveC1zaGFkb3c6IDAgOHB4IDE2cHggcmdiYSgxMCwgMTAsIDEwLCAwLjEpO1xuICAgIHBhZGRpbmc6IDAuNXJlbSAwO1xuICB9XG4gIC5uYXZiYXItbWVudS5pcy1hY3RpdmUge1xuICAgIGRpc3BsYXk6IGJsb2NrO1xuICB9XG59XG5cbkBtZWRpYSBzY3JlZW4gYW5kIChtaW4td2lkdGg6IDEwMDhweCkge1xuICAubmF2YmFyLFxuICAubmF2YmFyLW1lbnUsXG4gIC5uYXZiYXItc3RhcnQsXG4gIC5uYXZiYXItZW5kIHtcbiAgICBhbGlnbi1pdGVtczogc3RyZXRjaDtcbiAgICBkaXNwbGF5OiBmbGV4O1xuICB9XG4gIC5uYXZiYXIge1xuICAgIG1pbi1oZWlnaHQ6IDMuMjVyZW07XG4gIH1cbiAgLm5hdmJhci5pcy10cmFuc3BhcmVudCBhLm5hdmJhci1pdGVtOmhvdmVyLCAubmF2YmFyLmlzLXRyYW5zcGFyZW50IGEubmF2YmFyLWl0ZW0uaXMtYWN0aXZlLFxuICAubmF2YmFyLmlzLXRyYW5zcGFyZW50IC5uYXZiYXItbGluazpob3ZlcixcbiAgLm5hdmJhci5pcy10cmFuc3BhcmVudCAubmF2YmFyLWxpbmsuaXMtYWN0aXZlIHtcbiAgICBiYWNrZ3JvdW5kLWNvbG9yOiB0cmFuc3BhcmVudDtcbiAgfVxuICAubmF2YmFyLmlzLXRyYW5zcGFyZW50IC5uYXZiYXItaXRlbS5oYXMtZHJvcGRvd24uaXMtYWN0aXZlIC5uYXZiYXItbGluaywgLm5hdmJhci5pcy10cmFuc3BhcmVudCAubmF2YmFyLWl0ZW0uaGFzLWRyb3Bkb3duLmlzLWhvdmVyYWJsZTpob3ZlciAubmF2YmFyLWxpbmsge1xuICAgIGJhY2tncm91bmQtY29sb3I6IHRyYW5zcGFyZW50O1xuICB9XG4gIC5uYXZiYXIuaXMtdHJhbnNwYXJlbnQgLm5hdmJhci1kcm9wZG93biBhLm5hdmJhci1pdGVtOmhvdmVyIHtcbiAgICBiYWNrZ3JvdW5kLWNvbG9yOiB3aGl0ZXNtb2tlO1xuICAgIGNvbG9yOiAjMGEwYTBhO1xuICB9XG4gIC5uYXZiYXIuaXMtdHJhbnNwYXJlbnQgLm5hdmJhci1kcm9wZG93biBhLm5hdmJhci1pdGVtLmlzLWFjdGl2ZSB7XG4gICAgYmFja2dyb3VuZC1jb2xvcjogd2hpdGVzbW9rZTtcbiAgICBjb2xvcjogIzAwZDFiMjtcbiAgfVxuICAubmF2YmFyLWJ1cmdlciB7XG4gICAgZGlzcGxheTogbm9uZTtcbiAgfVxuICAubmF2YmFyLWl0ZW0sXG4gIC5uYXZiYXItbGluayB7XG4gICAgYWxpZ24taXRlbXM6IGNlbnRlcjtcbiAgICBkaXNwbGF5OiBmbGV4O1xuICB9XG4gIC5uYXZiYXItaXRlbS5oYXMtZHJvcGRvd24ge1xuICAgIGFsaWduLWl0ZW1zOiBzdHJldGNoO1xuICB9XG4gIC5uYXZiYXItaXRlbS5pcy1hY3RpdmUgLm5hdmJhci1kcm9wZG93biwgLm5hdmJhci1pdGVtLmlzLWhvdmVyYWJsZTpob3ZlciAubmF2YmFyLWRyb3Bkb3duIHtcbiAgICBkaXNwbGF5OiBibG9jaztcbiAgfVxuICAubmF2YmFyLWl0ZW0uaXMtYWN0aXZlIC5uYXZiYXItZHJvcGRvd24uaXMtYm94ZWQsIC5uYXZiYXItaXRlbS5pcy1ob3ZlcmFibGU6aG92ZXIgLm5hdmJhci1kcm9wZG93bi5pcy1ib3hlZCB7XG4gICAgb3BhY2l0eTogMTtcbiAgICBwb2ludGVyLWV2ZW50czogYXV0bztcbiAgICB0cmFuc2Zvcm06IHRyYW5zbGF0ZVkoMCk7XG4gIH1cbiAgLm5hdmJhci1saW5rOjphZnRlciB7XG4gICAgYm9yZGVyOiAxcHggc29saWQgIzAwZDFiMjtcbiAgICBib3JkZXItcmlnaHQ6IDA7XG4gICAgYm9yZGVyLXRvcDogMDtcbiAgICBjb250ZW50OiBcIiBcIjtcbiAgICBkaXNwbGF5OiBibG9jaztcbiAgICBoZWlnaHQ6IDAuNWVtO1xuICAgIHBvaW50ZXItZXZlbnRzOiBub25lO1xuICAgIHBvc2l0aW9uOiBhYnNvbHV0ZTtcbiAgICB0cmFuc2Zvcm06IHJvdGF0ZSgtNDVkZWcpO1xuICAgIHdpZHRoOiAwLjVlbTtcbiAgICBtYXJnaW4tdG9wOiAtMC4zNzVlbTtcbiAgICByaWdodDogMS4xMjVlbTtcbiAgICB0b3A6IDUwJTtcbiAgfVxuICAubmF2YmFyLW1lbnUge1xuICAgIGZsZXgtZ3JvdzogMTtcbiAgICBmbGV4LXNocmluazogMDtcbiAgfVxuICAubmF2YmFyLXN0YXJ0IHtcbiAgICBqdXN0aWZ5LWNvbnRlbnQ6IGZsZXgtc3RhcnQ7XG4gICAgbWFyZ2luLXJpZ2h0OiBhdXRvO1xuICB9XG4gIC5uYXZiYXItZW5kIHtcbiAgICBqdXN0aWZ5LWNvbnRlbnQ6IGZsZXgtZW5kO1xuICAgIG1hcmdpbi1sZWZ0OiBhdXRvO1xuICB9XG4gIC5uYXZiYXItZHJvcGRvd24ge1xuICAgIGJhY2tncm91bmQtY29sb3I6IHdoaXRlO1xuICAgIGJvcmRlci1ib3R0b20tbGVmdC1yYWRpdXM6IDVweDtcbiAgICBib3JkZXItYm90dG9tLXJpZ2h0LXJhZGl1czogNXB4O1xuICAgIGJvcmRlci10b3A6IDFweCBzb2xpZCAjZGJkYmRiO1xuICAgIGJveC1zaGFkb3c6IDAgOHB4IDhweCByZ2JhKDEwLCAxMCwgMTAsIDAuMSk7XG4gICAgZGlzcGxheTogbm9uZTtcbiAgICBmb250LXNpemU6IDAuODc1cmVtO1xuICAgIGxlZnQ6IDA7XG4gICAgbWluLXdpZHRoOiAxMDAlO1xuICAgIHBvc2l0aW9uOiBhYnNvbHV0ZTtcbiAgICB0b3A6IDEwMCU7XG4gICAgei1pbmRleDogMjA7XG4gIH1cbiAgLm5hdmJhci1kcm9wZG93biAubmF2YmFyLWl0ZW0ge1xuICAgIHBhZGRpbmc6IDAuMzc1cmVtIDFyZW07XG4gICAgd2hpdGUtc3BhY2U6IG5vd3JhcDtcbiAgfVxuICAubmF2YmFyLWRyb3Bkb3duIGEubmF2YmFyLWl0ZW0ge1xuICAgIHBhZGRpbmctcmlnaHQ6IDNyZW07XG4gIH1cbiAgLm5hdmJhci1kcm9wZG93biBhLm5hdmJhci1pdGVtOmhvdmVyIHtcbiAgICBiYWNrZ3JvdW5kLWNvbG9yOiB3aGl0ZXNtb2tlO1xuICAgIGNvbG9yOiAjMGEwYTBhO1xuICB9XG4gIC5uYXZiYXItZHJvcGRvd24gYS5uYXZiYXItaXRlbS5pcy1hY3RpdmUge1xuICAgIGJhY2tncm91bmQtY29sb3I6IHdoaXRlc21va2U7XG4gICAgY29sb3I6ICMwMGQxYjI7XG4gIH1cbiAgLm5hdmJhci1kcm9wZG93bi5pcy1ib3hlZCB7XG4gICAgYm9yZGVyLXJhZGl1czogNXB4O1xuICAgIGJvcmRlci10b3A6IG5vbmU7XG4gICAgYm94LXNoYWRvdzogMCA4cHggOHB4IHJnYmEoMTAsIDEwLCAxMCwgMC4xKSwgMCAwIDAgMXB4IHJnYmEoMTAsIDEwLCAxMCwgMC4xKTtcbiAgICBkaXNwbGF5OiBibG9jaztcbiAgICBvcGFjaXR5OiAwO1xuICAgIHBvaW50ZXItZXZlbnRzOiBub25lO1xuICAgIHRvcDogY2FsYygxMDAlICsgKC00cHgpKTtcbiAgICB0cmFuc2Zvcm06IHRyYW5zbGF0ZVkoLTVweCk7XG4gICAgdHJhbnNpdGlvbi1kdXJhdGlvbjogODZtcztcbiAgICB0cmFuc2l0aW9uLXByb3BlcnR5OiBvcGFjaXR5LCB0cmFuc2Zvcm07XG4gIH1cbiAgLm5hdmJhci1kaXZpZGVyIHtcbiAgICBkaXNwbGF5OiBibG9jaztcbiAgfVxuICAuY29udGFpbmVyID4gLm5hdmJhciB7XG4gICAgbWFyZ2luLWxlZnQ6IC0xcmVtO1xuICAgIG1hcmdpbi1yaWdodDogLTFyZW07XG4gIH1cbiAgYS5uYXZiYXItaXRlbS5pcy1hY3RpdmUsXG4gIC5uYXZiYXItbGluay5pcy1hY3RpdmUge1xuICAgIGNvbG9yOiAjMGEwYTBhO1xuICB9XG4gIGEubmF2YmFyLWl0ZW0uaXMtYWN0aXZlOm5vdCg6aG92ZXIpLFxuICAubmF2YmFyLWxpbmsuaXMtYWN0aXZlOm5vdCg6aG92ZXIpIHtcbiAgICBiYWNrZ3JvdW5kLWNvbG9yOiB0cmFuc3BhcmVudDtcbiAgfVxuICAubmF2YmFyLWl0ZW0uaGFzLWRyb3Bkb3duOmhvdmVyIC5uYXZiYXItbGluaywgLm5hdmJhci1pdGVtLmhhcy1kcm9wZG93bi5pcy1hY3RpdmUgLm5hdmJhci1saW5rIHtcbiAgICBiYWNrZ3JvdW5kLWNvbG9yOiB3aGl0ZXNtb2tlO1xuICB9XG59XG5cbi5wYWdpbmF0aW9uIHtcbiAgZm9udC1zaXplOiAxcmVtO1xuICBtYXJnaW46IC0wLjI1cmVtO1xufVxuXG4ucGFnaW5hdGlvbi5pcy1zbWFsbCB7XG4gIGZvbnQtc2l6ZTogMC43NXJlbTtcbn1cblxuLnBhZ2luYXRpb24uaXMtbWVkaXVtIHtcbiAgZm9udC1zaXplOiAxLjI1cmVtO1xufVxuXG4ucGFnaW5hdGlvbi5pcy1sYXJnZSB7XG4gIGZvbnQtc2l6ZTogMS41cmVtO1xufVxuXG4ucGFnaW5hdGlvbixcbi5wYWdpbmF0aW9uLWxpc3Qge1xuICBhbGlnbi1pdGVtczogY2VudGVyO1xuICBkaXNwbGF5OiBmbGV4O1xuICBqdXN0aWZ5LWNvbnRlbnQ6IGNlbnRlcjtcbiAgdGV4dC1hbGlnbjogY2VudGVyO1xufVxuXG4ucGFnaW5hdGlvbi1wcmV2aW91cyxcbi5wYWdpbmF0aW9uLW5leHQsXG4ucGFnaW5hdGlvbi1saW5rLFxuLnBhZ2luYXRpb24tZWxsaXBzaXMge1xuICAtbW96LWFwcGVhcmFuY2U6IG5vbmU7XG4gIC13ZWJraXQtYXBwZWFyYW5jZTogbm9uZTtcbiAgYWxpZ24taXRlbXM6IGNlbnRlcjtcbiAgYm9yZGVyOiAxcHggc29saWQgdHJhbnNwYXJlbnQ7XG4gIGJvcmRlci1yYWRpdXM6IDNweDtcbiAgYm94LXNoYWRvdzogbm9uZTtcbiAgZGlzcGxheTogaW5saW5lLWZsZXg7XG4gIGZvbnQtc2l6ZTogMXJlbTtcbiAgaGVpZ2h0OiAyLjI1ZW07XG4gIGp1c3RpZnktY29udGVudDogZmxleC1zdGFydDtcbiAgbGluZS1oZWlnaHQ6IDEuNTtcbiAgcGFkZGluZy1ib3R0b206IGNhbGMoMC4zNzVlbSAtIDFweCk7XG4gIHBhZGRpbmctbGVmdDogY2FsYygwLjYyNWVtIC0gMXB4KTtcbiAgcGFkZGluZy1yaWdodDogY2FsYygwLjYyNWVtIC0gMXB4KTtcbiAgcGFkZGluZy10b3A6IGNhbGMoMC4zNzVlbSAtIDFweCk7XG4gIHBvc2l0aW9uOiByZWxhdGl2ZTtcbiAgdmVydGljYWwtYWxpZ246IHRvcDtcbiAgLXdlYmtpdC10b3VjaC1jYWxsb3V0OiBub25lO1xuICAtd2Via2l0LXVzZXItc2VsZWN0OiBub25lO1xuICAtbW96LXVzZXItc2VsZWN0OiBub25lO1xuICAtbXMtdXNlci1zZWxlY3Q6IG5vbmU7XG4gIHVzZXItc2VsZWN0OiBub25lO1xuICBmb250LXNpemU6IDFlbTtcbiAgcGFkZGluZy1sZWZ0OiAwLjVlbTtcbiAgcGFkZGluZy1yaWdodDogMC41ZW07XG4gIGp1c3RpZnktY29udGVudDogY2VudGVyO1xuICBtYXJnaW46IDAuMjVyZW07XG4gIHRleHQtYWxpZ246IGNlbnRlcjtcbn1cblxuLnBhZ2luYXRpb24tcHJldmlvdXM6Zm9jdXMsIC5wYWdpbmF0aW9uLXByZXZpb3VzLmlzLWZvY3VzZWQsIC5wYWdpbmF0aW9uLXByZXZpb3VzOmFjdGl2ZSwgLnBhZ2luYXRpb24tcHJldmlvdXMuaXMtYWN0aXZlLFxuLnBhZ2luYXRpb24tbmV4dDpmb2N1cyxcbi5wYWdpbmF0aW9uLW5leHQuaXMtZm9jdXNlZCxcbi5wYWdpbmF0aW9uLW5leHQ6YWN0aXZlLFxuLnBhZ2luYXRpb24tbmV4dC5pcy1hY3RpdmUsXG4ucGFnaW5hdGlvbi1saW5rOmZvY3VzLFxuLnBhZ2luYXRpb24tbGluay5pcy1mb2N1c2VkLFxuLnBhZ2luYXRpb24tbGluazphY3RpdmUsXG4ucGFnaW5hdGlvbi1saW5rLmlzLWFjdGl2ZSxcbi5wYWdpbmF0aW9uLWVsbGlwc2lzOmZvY3VzLFxuLnBhZ2luYXRpb24tZWxsaXBzaXMuaXMtZm9jdXNlZCxcbi5wYWdpbmF0aW9uLWVsbGlwc2lzOmFjdGl2ZSxcbi5wYWdpbmF0aW9uLWVsbGlwc2lzLmlzLWFjdGl2ZSB7XG4gIG91dGxpbmU6IG5vbmU7XG59XG5cbi5wYWdpbmF0aW9uLXByZXZpb3VzW2Rpc2FibGVkXSxcbi5wYWdpbmF0aW9uLW5leHRbZGlzYWJsZWRdLFxuLnBhZ2luYXRpb24tbGlua1tkaXNhYmxlZF0sXG4ucGFnaW5hdGlvbi1lbGxpcHNpc1tkaXNhYmxlZF0ge1xuICBjdXJzb3I6IG5vdC1hbGxvd2VkO1xufVxuXG4ucGFnaW5hdGlvbi1wcmV2aW91cyxcbi5wYWdpbmF0aW9uLW5leHQsXG4ucGFnaW5hdGlvbi1saW5rIHtcbiAgYm9yZGVyLWNvbG9yOiAjZGJkYmRiO1xuICBtaW4td2lkdGg6IDIuMjVlbTtcbn1cblxuLnBhZ2luYXRpb24tcHJldmlvdXM6aG92ZXIsXG4ucGFnaW5hdGlvbi1uZXh0OmhvdmVyLFxuLnBhZ2luYXRpb24tbGluazpob3ZlciB7XG4gIGJvcmRlci1jb2xvcjogI2I1YjViNTtcbiAgY29sb3I6ICMzNjM2MzY7XG59XG5cbi5wYWdpbmF0aW9uLXByZXZpb3VzOmZvY3VzLFxuLnBhZ2luYXRpb24tbmV4dDpmb2N1cyxcbi5wYWdpbmF0aW9uLWxpbms6Zm9jdXMge1xuICBib3JkZXItY29sb3I6ICMwMGQxYjI7XG59XG5cbi5wYWdpbmF0aW9uLXByZXZpb3VzOmFjdGl2ZSxcbi5wYWdpbmF0aW9uLW5leHQ6YWN0aXZlLFxuLnBhZ2luYXRpb24tbGluazphY3RpdmUge1xuICBib3gtc2hhZG93OiBpbnNldCAwIDFweCAycHggcmdiYSgxMCwgMTAsIDEwLCAwLjIpO1xufVxuXG4ucGFnaW5hdGlvbi1wcmV2aW91c1tkaXNhYmxlZF0sXG4ucGFnaW5hdGlvbi1uZXh0W2Rpc2FibGVkXSxcbi5wYWdpbmF0aW9uLWxpbmtbZGlzYWJsZWRdIHtcbiAgYmFja2dyb3VuZC1jb2xvcjogI2RiZGJkYjtcbiAgYm9yZGVyLWNvbG9yOiAjZGJkYmRiO1xuICBib3gtc2hhZG93OiBub25lO1xuICBjb2xvcjogIzdhN2E3YTtcbiAgb3BhY2l0eTogMC41O1xufVxuXG4ucGFnaW5hdGlvbi1wcmV2aW91cyxcbi5wYWdpbmF0aW9uLW5leHQge1xuICBwYWRkaW5nLWxlZnQ6IDAuNzVlbTtcbiAgcGFkZGluZy1yaWdodDogMC43NWVtO1xuICB3aGl0ZS1zcGFjZTogbm93cmFwO1xufVxuXG4ucGFnaW5hdGlvbi1saW5rLmlzLWN1cnJlbnQge1xuICBiYWNrZ3JvdW5kLWNvbG9yOiAjMDBkMWIyO1xuICBib3JkZXItY29sb3I6ICMwMGQxYjI7XG4gIGNvbG9yOiAjZmZmO1xufVxuXG4ucGFnaW5hdGlvbi1lbGxpcHNpcyB7XG4gIGNvbG9yOiAjYjViNWI1O1xuICBwb2ludGVyLWV2ZW50czogbm9uZTtcbn1cblxuLnBhZ2luYXRpb24tbGlzdCB7XG4gIGZsZXgtd3JhcDogd3JhcDtcbn1cblxuQG1lZGlhIHNjcmVlbiBhbmQgKG1heC13aWR0aDogNzY4cHgpIHtcbiAgLnBhZ2luYXRpb24ge1xuICAgIGZsZXgtd3JhcDogd3JhcDtcbiAgfVxuICAucGFnaW5hdGlvbi1wcmV2aW91cyxcbiAgLnBhZ2luYXRpb24tbmV4dCB7XG4gICAgZmxleC1ncm93OiAxO1xuICAgIGZsZXgtc2hyaW5rOiAxO1xuICB9XG4gIC5wYWdpbmF0aW9uLWxpc3QgbGkge1xuICAgIGZsZXgtZ3JvdzogMTtcbiAgICBmbGV4LXNocmluazogMTtcbiAgfVxufVxuXG5AbWVkaWEgc2NyZWVuIGFuZCAobWluLXdpZHRoOiA3NjlweCksIHByaW50IHtcbiAgLnBhZ2luYXRpb24tbGlzdCB7XG4gICAgZmxleC1ncm93OiAxO1xuICAgIGZsZXgtc2hyaW5rOiAxO1xuICAgIGp1c3RpZnktY29udGVudDogZmxleC1zdGFydDtcbiAgICBvcmRlcjogMTtcbiAgfVxuICAucGFnaW5hdGlvbi1wcmV2aW91cyB7XG4gICAgb3JkZXI6IDI7XG4gIH1cbiAgLnBhZ2luYXRpb24tbmV4dCB7XG4gICAgb3JkZXI6IDM7XG4gIH1cbiAgLnBhZ2luYXRpb24ge1xuICAgIGp1c3RpZnktY29udGVudDogc3BhY2UtYmV0d2VlbjtcbiAgfVxuICAucGFnaW5hdGlvbi5pcy1jZW50ZXJlZCAucGFnaW5hdGlvbi1wcmV2aW91cyB7XG4gICAgb3JkZXI6IDE7XG4gIH1cbiAgLnBhZ2luYXRpb24uaXMtY2VudGVyZWQgLnBhZ2luYXRpb24tbGlzdCB7XG4gICAganVzdGlmeS1jb250ZW50OiBjZW50ZXI7XG4gICAgb3JkZXI6IDI7XG4gIH1cbiAgLnBhZ2luYXRpb24uaXMtY2VudGVyZWQgLnBhZ2luYXRpb24tbmV4dCB7XG4gICAgb3JkZXI6IDM7XG4gIH1cbiAgLnBhZ2luYXRpb24uaXMtcmlnaHQgLnBhZ2luYXRpb24tcHJldmlvdXMge1xuICAgIG9yZGVyOiAxO1xuICB9XG4gIC5wYWdpbmF0aW9uLmlzLXJpZ2h0IC5wYWdpbmF0aW9uLW5leHQge1xuICAgIG9yZGVyOiAyO1xuICB9XG4gIC5wYWdpbmF0aW9uLmlzLXJpZ2h0IC5wYWdpbmF0aW9uLWxpc3Qge1xuICAgIGp1c3RpZnktY29udGVudDogZmxleC1lbmQ7XG4gICAgb3JkZXI6IDM7XG4gIH1cbn1cblxuLnBhbmVsIHtcbiAgZm9udC1zaXplOiAxcmVtO1xufVxuXG4ucGFuZWw6bm90KDpsYXN0LWNoaWxkKSB7XG4gIG1hcmdpbi1ib3R0b206IDEuNXJlbTtcbn1cblxuLnBhbmVsLWhlYWRpbmcsXG4ucGFuZWwtdGFicyxcbi5wYW5lbC1ibG9jayB7XG4gIGJvcmRlci1ib3R0b206IDFweCBzb2xpZCAjZGJkYmRiO1xuICBib3JkZXItbGVmdDogMXB4IHNvbGlkICNkYmRiZGI7XG4gIGJvcmRlci1yaWdodDogMXB4IHNvbGlkICNkYmRiZGI7XG59XG5cbi5wYW5lbC1oZWFkaW5nOmZpcnN0LWNoaWxkLFxuLnBhbmVsLXRhYnM6Zmlyc3QtY2hpbGQsXG4ucGFuZWwtYmxvY2s6Zmlyc3QtY2hpbGQge1xuICBib3JkZXItdG9wOiAxcHggc29saWQgI2RiZGJkYjtcbn1cblxuLnBhbmVsLWhlYWRpbmcge1xuICBiYWNrZ3JvdW5kLWNvbG9yOiB3aGl0ZXNtb2tlO1xuICBib3JkZXItcmFkaXVzOiAzcHggM3B4IDAgMDtcbiAgY29sb3I6ICMzNjM2MzY7XG4gIGZvbnQtc2l6ZTogMS4yNWVtO1xuICBmb250LXdlaWdodDogMzAwO1xuICBsaW5lLWhlaWdodDogMS4yNTtcbiAgcGFkZGluZzogMC41ZW0gMC43NWVtO1xufVxuXG4ucGFuZWwtdGFicyB7XG4gIGFsaWduLWl0ZW1zOiBmbGV4LWVuZDtcbiAgZGlzcGxheTogZmxleDtcbiAgZm9udC1zaXplOiAwLjg3NWVtO1xuICBqdXN0aWZ5LWNvbnRlbnQ6IGNlbnRlcjtcbn1cblxuLnBhbmVsLXRhYnMgYSB7XG4gIGJvcmRlci1ib3R0b206IDFweCBzb2xpZCAjZGJkYmRiO1xuICBtYXJnaW4tYm90dG9tOiAtMXB4O1xuICBwYWRkaW5nOiAwLjVlbTtcbn1cblxuLnBhbmVsLXRhYnMgYS5pcy1hY3RpdmUge1xuICBib3JkZXItYm90dG9tLWNvbG9yOiAjNGE0YTRhO1xuICBjb2xvcjogIzM2MzYzNjtcbn1cblxuLnBhbmVsLWxpc3QgYSB7XG4gIGNvbG9yOiAjNGE0YTRhO1xufVxuXG4ucGFuZWwtbGlzdCBhOmhvdmVyIHtcbiAgY29sb3I6ICMwMGQxYjI7XG59XG5cbi5wYW5lbC1ibG9jayB7XG4gIGFsaWduLWl0ZW1zOiBjZW50ZXI7XG4gIGNvbG9yOiAjMzYzNjM2O1xuICBkaXNwbGF5OiBmbGV4O1xuICBqdXN0aWZ5LWNvbnRlbnQ6IGZsZXgtc3RhcnQ7XG4gIHBhZGRpbmc6IDAuNWVtIDAuNzVlbTtcbn1cblxuLnBhbmVsLWJsb2NrIGlucHV0W3R5cGU9XCJjaGVja2JveFwiXSB7XG4gIG1hcmdpbi1yaWdodDogMC43NWVtO1xufVxuXG4ucGFuZWwtYmxvY2sgPiAuY29udHJvbCB7XG4gIGZsZXgtZ3JvdzogMTtcbiAgZmxleC1zaHJpbms6IDE7XG4gIHdpZHRoOiAxMDAlO1xufVxuXG4ucGFuZWwtYmxvY2suaXMtd3JhcHBlZCB7XG4gIGZsZXgtd3JhcDogd3JhcDtcbn1cblxuLnBhbmVsLWJsb2NrLmlzLWFjdGl2ZSB7XG4gIGJvcmRlci1sZWZ0LWNvbG9yOiAjMDBkMWIyO1xuICBjb2xvcjogIzM2MzYzNjtcbn1cblxuLnBhbmVsLWJsb2NrLmlzLWFjdGl2ZSAucGFuZWwtaWNvbiB7XG4gIGNvbG9yOiAjMDBkMWIyO1xufVxuXG5hLnBhbmVsLWJsb2NrLFxubGFiZWwucGFuZWwtYmxvY2sge1xuICBjdXJzb3I6IHBvaW50ZXI7XG59XG5cbmEucGFuZWwtYmxvY2s6aG92ZXIsXG5sYWJlbC5wYW5lbC1ibG9jazpob3ZlciB7XG4gIGJhY2tncm91bmQtY29sb3I6IHdoaXRlc21va2U7XG59XG5cbi5wYW5lbC1pY29uIHtcbiAgZGlzcGxheTogaW5saW5lLWJsb2NrO1xuICBmb250LXNpemU6IDE0cHg7XG4gIGhlaWdodDogMWVtO1xuICBsaW5lLWhlaWdodDogMWVtO1xuICB0ZXh0LWFsaWduOiBjZW50ZXI7XG4gIHZlcnRpY2FsLWFsaWduOiB0b3A7XG4gIHdpZHRoOiAxZW07XG4gIGNvbG9yOiAjN2E3YTdhO1xuICBtYXJnaW4tcmlnaHQ6IDAuNzVlbTtcbn1cblxuLnBhbmVsLWljb24gLmZhIHtcbiAgZm9udC1zaXplOiBpbmhlcml0O1xuICBsaW5lLWhlaWdodDogaW5oZXJpdDtcbn1cblxuLnRhYnMge1xuICAtd2Via2l0LW92ZXJmbG93LXNjcm9sbGluZzogdG91Y2g7XG4gIC13ZWJraXQtdG91Y2gtY2FsbG91dDogbm9uZTtcbiAgLXdlYmtpdC11c2VyLXNlbGVjdDogbm9uZTtcbiAgLW1vei11c2VyLXNlbGVjdDogbm9uZTtcbiAgLW1zLXVzZXItc2VsZWN0OiBub25lO1xuICB1c2VyLXNlbGVjdDogbm9uZTtcbiAgYWxpZ24taXRlbXM6IHN0cmV0Y2g7XG4gIGRpc3BsYXk6IGZsZXg7XG4gIGZvbnQtc2l6ZTogMXJlbTtcbiAganVzdGlmeS1jb250ZW50OiBzcGFjZS1iZXR3ZWVuO1xuICBvdmVyZmxvdzogaGlkZGVuO1xuICBvdmVyZmxvdy14OiBhdXRvO1xuICB3aGl0ZS1zcGFjZTogbm93cmFwO1xufVxuXG4udGFiczpub3QoOmxhc3QtY2hpbGQpIHtcbiAgbWFyZ2luLWJvdHRvbTogMS41cmVtO1xufVxuXG4udGFicyBhIHtcbiAgYWxpZ24taXRlbXM6IGNlbnRlcjtcbiAgYm9yZGVyLWJvdHRvbTogMXB4IHNvbGlkICNkYmRiZGI7XG4gIGNvbG9yOiAjNGE0YTRhO1xuICBkaXNwbGF5OiBmbGV4O1xuICBqdXN0aWZ5LWNvbnRlbnQ6IGNlbnRlcjtcbiAgbWFyZ2luLWJvdHRvbTogLTFweDtcbiAgcGFkZGluZzogMC41ZW0gMWVtO1xuICB2ZXJ0aWNhbC1hbGlnbjogdG9wO1xufVxuXG4udGFicyBhOmhvdmVyIHtcbiAgYm9yZGVyLWJvdHRvbS1jb2xvcjogIzM2MzYzNjtcbiAgY29sb3I6ICMzNjM2MzY7XG59XG5cbi50YWJzIGxpIHtcbiAgZGlzcGxheTogYmxvY2s7XG59XG5cbi50YWJzIGxpLmlzLWFjdGl2ZSBhIHtcbiAgYm9yZGVyLWJvdHRvbS1jb2xvcjogIzAwZDFiMjtcbiAgY29sb3I6ICMwMGQxYjI7XG59XG5cbi50YWJzIHVsIHtcbiAgYWxpZ24taXRlbXM6IGNlbnRlcjtcbiAgYm9yZGVyLWJvdHRvbTogMXB4IHNvbGlkICNkYmRiZGI7XG4gIGRpc3BsYXk6IGZsZXg7XG4gIGZsZXgtZ3JvdzogMTtcbiAgZmxleC1zaHJpbms6IDA7XG4gIGp1c3RpZnktY29udGVudDogZmxleC1zdGFydDtcbn1cblxuLnRhYnMgdWwuaXMtbGVmdCB7XG4gIHBhZGRpbmctcmlnaHQ6IDAuNzVlbTtcbn1cblxuLnRhYnMgdWwuaXMtY2VudGVyIHtcbiAgZmxleDogbm9uZTtcbiAganVzdGlmeS1jb250ZW50OiBjZW50ZXI7XG4gIHBhZGRpbmctbGVmdDogMC43NWVtO1xuICBwYWRkaW5nLXJpZ2h0OiAwLjc1ZW07XG59XG5cbi50YWJzIHVsLmlzLXJpZ2h0IHtcbiAganVzdGlmeS1jb250ZW50OiBmbGV4LWVuZDtcbiAgcGFkZGluZy1sZWZ0OiAwLjc1ZW07XG59XG5cbi50YWJzIC5pY29uOmZpcnN0LWNoaWxkIHtcbiAgbWFyZ2luLXJpZ2h0OiAwLjVlbTtcbn1cblxuLnRhYnMgLmljb246bGFzdC1jaGlsZCB7XG4gIG1hcmdpbi1sZWZ0OiAwLjVlbTtcbn1cblxuLnRhYnMuaXMtY2VudGVyZWQgdWwge1xuICBqdXN0aWZ5LWNvbnRlbnQ6IGNlbnRlcjtcbn1cblxuLnRhYnMuaXMtcmlnaHQgdWwge1xuICBqdXN0aWZ5LWNvbnRlbnQ6IGZsZXgtZW5kO1xufVxuXG4udGFicy5pcy1ib3hlZCBhIHtcbiAgYm9yZGVyOiAxcHggc29saWQgdHJhbnNwYXJlbnQ7XG4gIGJvcmRlci1yYWRpdXM6IDNweCAzcHggMCAwO1xufVxuXG4udGFicy5pcy1ib3hlZCBhOmhvdmVyIHtcbiAgYmFja2dyb3VuZC1jb2xvcjogd2hpdGVzbW9rZTtcbiAgYm9yZGVyLWJvdHRvbS1jb2xvcjogI2RiZGJkYjtcbn1cblxuLnRhYnMuaXMtYm94ZWQgbGkuaXMtYWN0aXZlIGEge1xuICBiYWNrZ3JvdW5kLWNvbG9yOiB3aGl0ZTtcbiAgYm9yZGVyLWNvbG9yOiAjZGJkYmRiO1xuICBib3JkZXItYm90dG9tLWNvbG9yOiB0cmFuc3BhcmVudCAhaW1wb3J0YW50O1xufVxuXG4udGFicy5pcy1mdWxsd2lkdGggbGkge1xuICBmbGV4LWdyb3c6IDE7XG4gIGZsZXgtc2hyaW5rOiAwO1xufVxuXG4udGFicy5pcy10b2dnbGUgYSB7XG4gIGJvcmRlcjogMXB4IHNvbGlkICNkYmRiZGI7XG4gIG1hcmdpbi1ib3R0b206IDA7XG4gIHBvc2l0aW9uOiByZWxhdGl2ZTtcbn1cblxuLnRhYnMuaXMtdG9nZ2xlIGE6aG92ZXIge1xuICBiYWNrZ3JvdW5kLWNvbG9yOiB3aGl0ZXNtb2tlO1xuICBib3JkZXItY29sb3I6ICNiNWI1YjU7XG4gIHotaW5kZXg6IDI7XG59XG5cbi50YWJzLmlzLXRvZ2dsZSBsaSArIGxpIHtcbiAgbWFyZ2luLWxlZnQ6IC0xcHg7XG59XG5cbi50YWJzLmlzLXRvZ2dsZSBsaTpmaXJzdC1jaGlsZCBhIHtcbiAgYm9yZGVyLXJhZGl1czogM3B4IDAgMCAzcHg7XG59XG5cbi50YWJzLmlzLXRvZ2dsZSBsaTpsYXN0LWNoaWxkIGEge1xuICBib3JkZXItcmFkaXVzOiAwIDNweCAzcHggMDtcbn1cblxuLnRhYnMuaXMtdG9nZ2xlIGxpLmlzLWFjdGl2ZSBhIHtcbiAgYmFja2dyb3VuZC1jb2xvcjogIzAwZDFiMjtcbiAgYm9yZGVyLWNvbG9yOiAjMDBkMWIyO1xuICBjb2xvcjogI2ZmZjtcbiAgei1pbmRleDogMTtcbn1cblxuLnRhYnMuaXMtdG9nZ2xlIHVsIHtcbiAgYm9yZGVyLWJvdHRvbTogbm9uZTtcbn1cblxuLnRhYnMuaXMtc21hbGwge1xuICBmb250LXNpemU6IDAuNzVyZW07XG59XG5cbi50YWJzLmlzLW1lZGl1bSB7XG4gIGZvbnQtc2l6ZTogMS4yNXJlbTtcbn1cblxuLnRhYnMuaXMtbGFyZ2Uge1xuICBmb250LXNpemU6IDEuNXJlbTtcbn1cblxuLmNvbHVtbiB7XG4gIGRpc3BsYXk6IGJsb2NrO1xuICBmbGV4LWJhc2lzOiAwO1xuICBmbGV4LWdyb3c6IDE7XG4gIGZsZXgtc2hyaW5rOiAxO1xuICBwYWRkaW5nOiAwLjc1cmVtO1xufVxuXG4uY29sdW1ucy5pcy1tb2JpbGUgPiAuY29sdW1uLmlzLW5hcnJvdyB7XG4gIGZsZXg6IG5vbmU7XG59XG5cbi5jb2x1bW5zLmlzLW1vYmlsZSA+IC5jb2x1bW4uaXMtZnVsbCB7XG4gIGZsZXg6IG5vbmU7XG4gIHdpZHRoOiAxMDAlO1xufVxuXG4uY29sdW1ucy5pcy1tb2JpbGUgPiAuY29sdW1uLmlzLXRocmVlLXF1YXJ0ZXJzIHtcbiAgZmxleDogbm9uZTtcbiAgd2lkdGg6IDc1JTtcbn1cblxuLmNvbHVtbnMuaXMtbW9iaWxlID4gLmNvbHVtbi5pcy10d28tdGhpcmRzIHtcbiAgZmxleDogbm9uZTtcbiAgd2lkdGg6IDY2LjY2NjYlO1xufVxuXG4uY29sdW1ucy5pcy1tb2JpbGUgPiAuY29sdW1uLmlzLWhhbGYge1xuICBmbGV4OiBub25lO1xuICB3aWR0aDogNTAlO1xufVxuXG4uY29sdW1ucy5pcy1tb2JpbGUgPiAuY29sdW1uLmlzLW9uZS10aGlyZCB7XG4gIGZsZXg6IG5vbmU7XG4gIHdpZHRoOiAzMy4zMzMzJTtcbn1cblxuLmNvbHVtbnMuaXMtbW9iaWxlID4gLmNvbHVtbi5pcy1vbmUtcXVhcnRlciB7XG4gIGZsZXg6IG5vbmU7XG4gIHdpZHRoOiAyNSU7XG59XG5cbi5jb2x1bW5zLmlzLW1vYmlsZSA+IC5jb2x1bW4uaXMtb2Zmc2V0LXRocmVlLXF1YXJ0ZXJzIHtcbiAgbWFyZ2luLWxlZnQ6IDc1JTtcbn1cblxuLmNvbHVtbnMuaXMtbW9iaWxlID4gLmNvbHVtbi5pcy1vZmZzZXQtdHdvLXRoaXJkcyB7XG4gIG1hcmdpbi1sZWZ0OiA2Ni42NjY2JTtcbn1cblxuLmNvbHVtbnMuaXMtbW9iaWxlID4gLmNvbHVtbi5pcy1vZmZzZXQtaGFsZiB7XG4gIG1hcmdpbi1sZWZ0OiA1MCU7XG59XG5cbi5jb2x1bW5zLmlzLW1vYmlsZSA+IC5jb2x1bW4uaXMtb2Zmc2V0LW9uZS10aGlyZCB7XG4gIG1hcmdpbi1sZWZ0OiAzMy4zMzMzJTtcbn1cblxuLmNvbHVtbnMuaXMtbW9iaWxlID4gLmNvbHVtbi5pcy1vZmZzZXQtb25lLXF1YXJ0ZXIge1xuICBtYXJnaW4tbGVmdDogMjUlO1xufVxuXG4uY29sdW1ucy5pcy1tb2JpbGUgPiAuY29sdW1uLmlzLTEge1xuICBmbGV4OiBub25lO1xuICB3aWR0aDogOC4zMzMzMyU7XG59XG5cbi5jb2x1bW5zLmlzLW1vYmlsZSA+IC5jb2x1bW4uaXMtb2Zmc2V0LTEge1xuICBtYXJnaW4tbGVmdDogOC4zMzMzMyU7XG59XG5cbi5jb2x1bW5zLmlzLW1vYmlsZSA+IC5jb2x1bW4uaXMtMiB7XG4gIGZsZXg6IG5vbmU7XG4gIHdpZHRoOiAxNi42NjY2NyU7XG59XG5cbi5jb2x1bW5zLmlzLW1vYmlsZSA+IC5jb2x1bW4uaXMtb2Zmc2V0LTIge1xuICBtYXJnaW4tbGVmdDogMTYuNjY2NjclO1xufVxuXG4uY29sdW1ucy5pcy1tb2JpbGUgPiAuY29sdW1uLmlzLTMge1xuICBmbGV4OiBub25lO1xuICB3aWR0aDogMjUlO1xufVxuXG4uY29sdW1ucy5pcy1tb2JpbGUgPiAuY29sdW1uLmlzLW9mZnNldC0zIHtcbiAgbWFyZ2luLWxlZnQ6IDI1JTtcbn1cblxuLmNvbHVtbnMuaXMtbW9iaWxlID4gLmNvbHVtbi5pcy00IHtcbiAgZmxleDogbm9uZTtcbiAgd2lkdGg6IDMzLjMzMzMzJTtcbn1cblxuLmNvbHVtbnMuaXMtbW9iaWxlID4gLmNvbHVtbi5pcy1vZmZzZXQtNCB7XG4gIG1hcmdpbi1sZWZ0OiAzMy4zMzMzMyU7XG59XG5cbi5jb2x1bW5zLmlzLW1vYmlsZSA+IC5jb2x1bW4uaXMtNSB7XG4gIGZsZXg6IG5vbmU7XG4gIHdpZHRoOiA0MS42NjY2NyU7XG59XG5cbi5jb2x1bW5zLmlzLW1vYmlsZSA+IC5jb2x1bW4uaXMtb2Zmc2V0LTUge1xuICBtYXJnaW4tbGVmdDogNDEuNjY2NjclO1xufVxuXG4uY29sdW1ucy5pcy1tb2JpbGUgPiAuY29sdW1uLmlzLTYge1xuICBmbGV4OiBub25lO1xuICB3aWR0aDogNTAlO1xufVxuXG4uY29sdW1ucy5pcy1tb2JpbGUgPiAuY29sdW1uLmlzLW9mZnNldC02IHtcbiAgbWFyZ2luLWxlZnQ6IDUwJTtcbn1cblxuLmNvbHVtbnMuaXMtbW9iaWxlID4gLmNvbHVtbi5pcy03IHtcbiAgZmxleDogbm9uZTtcbiAgd2lkdGg6IDU4LjMzMzMzJTtcbn1cblxuLmNvbHVtbnMuaXMtbW9iaWxlID4gLmNvbHVtbi5pcy1vZmZzZXQtNyB7XG4gIG1hcmdpbi1sZWZ0OiA1OC4zMzMzMyU7XG59XG5cbi5jb2x1bW5zLmlzLW1vYmlsZSA+IC5jb2x1bW4uaXMtOCB7XG4gIGZsZXg6IG5vbmU7XG4gIHdpZHRoOiA2Ni42NjY2NyU7XG59XG5cbi5jb2x1bW5zLmlzLW1vYmlsZSA+IC5jb2x1bW4uaXMtb2Zmc2V0LTgge1xuICBtYXJnaW4tbGVmdDogNjYuNjY2NjclO1xufVxuXG4uY29sdW1ucy5pcy1tb2JpbGUgPiAuY29sdW1uLmlzLTkge1xuICBmbGV4OiBub25lO1xuICB3aWR0aDogNzUlO1xufVxuXG4uY29sdW1ucy5pcy1tb2JpbGUgPiAuY29sdW1uLmlzLW9mZnNldC05IHtcbiAgbWFyZ2luLWxlZnQ6IDc1JTtcbn1cblxuLmNvbHVtbnMuaXMtbW9iaWxlID4gLmNvbHVtbi5pcy0xMCB7XG4gIGZsZXg6IG5vbmU7XG4gIHdpZHRoOiA4My4zMzMzMyU7XG59XG5cbi5jb2x1bW5zLmlzLW1vYmlsZSA+IC5jb2x1bW4uaXMtb2Zmc2V0LTEwIHtcbiAgbWFyZ2luLWxlZnQ6IDgzLjMzMzMzJTtcbn1cblxuLmNvbHVtbnMuaXMtbW9iaWxlID4gLmNvbHVtbi5pcy0xMSB7XG4gIGZsZXg6IG5vbmU7XG4gIHdpZHRoOiA5MS42NjY2NyU7XG59XG5cbi5jb2x1bW5zLmlzLW1vYmlsZSA+IC5jb2x1bW4uaXMtb2Zmc2V0LTExIHtcbiAgbWFyZ2luLWxlZnQ6IDkxLjY2NjY3JTtcbn1cblxuLmNvbHVtbnMuaXMtbW9iaWxlID4gLmNvbHVtbi5pcy0xMiB7XG4gIGZsZXg6IG5vbmU7XG4gIHdpZHRoOiAxMDAlO1xufVxuXG4uY29sdW1ucy5pcy1tb2JpbGUgPiAuY29sdW1uLmlzLW9mZnNldC0xMiB7XG4gIG1hcmdpbi1sZWZ0OiAxMDAlO1xufVxuXG5AbWVkaWEgc2NyZWVuIGFuZCAobWF4LXdpZHRoOiA3NjhweCkge1xuICAuY29sdW1uLmlzLW5hcnJvdy1tb2JpbGUge1xuICAgIGZsZXg6IG5vbmU7XG4gIH1cbiAgLmNvbHVtbi5pcy1mdWxsLW1vYmlsZSB7XG4gICAgZmxleDogbm9uZTtcbiAgICB3aWR0aDogMTAwJTtcbiAgfVxuICAuY29sdW1uLmlzLXRocmVlLXF1YXJ0ZXJzLW1vYmlsZSB7XG4gICAgZmxleDogbm9uZTtcbiAgICB3aWR0aDogNzUlO1xuICB9XG4gIC5jb2x1bW4uaXMtdHdvLXRoaXJkcy1tb2JpbGUge1xuICAgIGZsZXg6IG5vbmU7XG4gICAgd2lkdGg6IDY2LjY2NjYlO1xuICB9XG4gIC5jb2x1bW4uaXMtaGFsZi1tb2JpbGUge1xuICAgIGZsZXg6IG5vbmU7XG4gICAgd2lkdGg6IDUwJTtcbiAgfVxuICAuY29sdW1uLmlzLW9uZS10aGlyZC1tb2JpbGUge1xuICAgIGZsZXg6IG5vbmU7XG4gICAgd2lkdGg6IDMzLjMzMzMlO1xuICB9XG4gIC5jb2x1bW4uaXMtb25lLXF1YXJ0ZXItbW9iaWxlIHtcbiAgICBmbGV4OiBub25lO1xuICAgIHdpZHRoOiAyNSU7XG4gIH1cbiAgLmNvbHVtbi5pcy1vZmZzZXQtdGhyZWUtcXVhcnRlcnMtbW9iaWxlIHtcbiAgICBtYXJnaW4tbGVmdDogNzUlO1xuICB9XG4gIC5jb2x1bW4uaXMtb2Zmc2V0LXR3by10aGlyZHMtbW9iaWxlIHtcbiAgICBtYXJnaW4tbGVmdDogNjYuNjY2NiU7XG4gIH1cbiAgLmNvbHVtbi5pcy1vZmZzZXQtaGFsZi1tb2JpbGUge1xuICAgIG1hcmdpbi1sZWZ0OiA1MCU7XG4gIH1cbiAgLmNvbHVtbi5pcy1vZmZzZXQtb25lLXRoaXJkLW1vYmlsZSB7XG4gICAgbWFyZ2luLWxlZnQ6IDMzLjMzMzMlO1xuICB9XG4gIC5jb2x1bW4uaXMtb2Zmc2V0LW9uZS1xdWFydGVyLW1vYmlsZSB7XG4gICAgbWFyZ2luLWxlZnQ6IDI1JTtcbiAgfVxuICAuY29sdW1uLmlzLTEtbW9iaWxlIHtcbiAgICBmbGV4OiBub25lO1xuICAgIHdpZHRoOiA4LjMzMzMzJTtcbiAgfVxuICAuY29sdW1uLmlzLW9mZnNldC0xLW1vYmlsZSB7XG4gICAgbWFyZ2luLWxlZnQ6IDguMzMzMzMlO1xuICB9XG4gIC5jb2x1bW4uaXMtMi1tb2JpbGUge1xuICAgIGZsZXg6IG5vbmU7XG4gICAgd2lkdGg6IDE2LjY2NjY3JTtcbiAgfVxuICAuY29sdW1uLmlzLW9mZnNldC0yLW1vYmlsZSB7XG4gICAgbWFyZ2luLWxlZnQ6IDE2LjY2NjY3JTtcbiAgfVxuICAuY29sdW1uLmlzLTMtbW9iaWxlIHtcbiAgICBmbGV4OiBub25lO1xuICAgIHdpZHRoOiAyNSU7XG4gIH1cbiAgLmNvbHVtbi5pcy1vZmZzZXQtMy1tb2JpbGUge1xuICAgIG1hcmdpbi1sZWZ0OiAyNSU7XG4gIH1cbiAgLmNvbHVtbi5pcy00LW1vYmlsZSB7XG4gICAgZmxleDogbm9uZTtcbiAgICB3aWR0aDogMzMuMzMzMzMlO1xuICB9XG4gIC5jb2x1bW4uaXMtb2Zmc2V0LTQtbW9iaWxlIHtcbiAgICBtYXJnaW4tbGVmdDogMzMuMzMzMzMlO1xuICB9XG4gIC5jb2x1bW4uaXMtNS1tb2JpbGUge1xuICAgIGZsZXg6IG5vbmU7XG4gICAgd2lkdGg6IDQxLjY2NjY3JTtcbiAgfVxuICAuY29sdW1uLmlzLW9mZnNldC01LW1vYmlsZSB7XG4gICAgbWFyZ2luLWxlZnQ6IDQxLjY2NjY3JTtcbiAgfVxuICAuY29sdW1uLmlzLTYtbW9iaWxlIHtcbiAgICBmbGV4OiBub25lO1xuICAgIHdpZHRoOiA1MCU7XG4gIH1cbiAgLmNvbHVtbi5pcy1vZmZzZXQtNi1tb2JpbGUge1xuICAgIG1hcmdpbi1sZWZ0OiA1MCU7XG4gIH1cbiAgLmNvbHVtbi5pcy03LW1vYmlsZSB7XG4gICAgZmxleDogbm9uZTtcbiAgICB3aWR0aDogNTguMzMzMzMlO1xuICB9XG4gIC5jb2x1bW4uaXMtb2Zmc2V0LTctbW9iaWxlIHtcbiAgICBtYXJnaW4tbGVmdDogNTguMzMzMzMlO1xuICB9XG4gIC5jb2x1bW4uaXMtOC1tb2JpbGUge1xuICAgIGZsZXg6IG5vbmU7XG4gICAgd2lkdGg6IDY2LjY2NjY3JTtcbiAgfVxuICAuY29sdW1uLmlzLW9mZnNldC04LW1vYmlsZSB7XG4gICAgbWFyZ2luLWxlZnQ6IDY2LjY2NjY3JTtcbiAgfVxuICAuY29sdW1uLmlzLTktbW9iaWxlIHtcbiAgICBmbGV4OiBub25lO1xuICAgIHdpZHRoOiA3NSU7XG4gIH1cbiAgLmNvbHVtbi5pcy1vZmZzZXQtOS1tb2JpbGUge1xuICAgIG1hcmdpbi1sZWZ0OiA3NSU7XG4gIH1cbiAgLmNvbHVtbi5pcy0xMC1tb2JpbGUge1xuICAgIGZsZXg6IG5vbmU7XG4gICAgd2lkdGg6IDgzLjMzMzMzJTtcbiAgfVxuICAuY29sdW1uLmlzLW9mZnNldC0xMC1tb2JpbGUge1xuICAgIG1hcmdpbi1sZWZ0OiA4My4zMzMzMyU7XG4gIH1cbiAgLmNvbHVtbi5pcy0xMS1tb2JpbGUge1xuICAgIGZsZXg6IG5vbmU7XG4gICAgd2lkdGg6IDkxLjY2NjY3JTtcbiAgfVxuICAuY29sdW1uLmlzLW9mZnNldC0xMS1tb2JpbGUge1xuICAgIG1hcmdpbi1sZWZ0OiA5MS42NjY2NyU7XG4gIH1cbiAgLmNvbHVtbi5pcy0xMi1tb2JpbGUge1xuICAgIGZsZXg6IG5vbmU7XG4gICAgd2lkdGg6IDEwMCU7XG4gIH1cbiAgLmNvbHVtbi5pcy1vZmZzZXQtMTItbW9iaWxlIHtcbiAgICBtYXJnaW4tbGVmdDogMTAwJTtcbiAgfVxufVxuXG5AbWVkaWEgc2NyZWVuIGFuZCAobWluLXdpZHRoOiA3NjlweCksIHByaW50IHtcbiAgLmNvbHVtbi5pcy1uYXJyb3csIC5jb2x1bW4uaXMtbmFycm93LXRhYmxldCB7XG4gICAgZmxleDogbm9uZTtcbiAgfVxuICAuY29sdW1uLmlzLWZ1bGwsIC5jb2x1bW4uaXMtZnVsbC10YWJsZXQge1xuICAgIGZsZXg6IG5vbmU7XG4gICAgd2lkdGg6IDEwMCU7XG4gIH1cbiAgLmNvbHVtbi5pcy10aHJlZS1xdWFydGVycywgLmNvbHVtbi5pcy10aHJlZS1xdWFydGVycy10YWJsZXQge1xuICAgIGZsZXg6IG5vbmU7XG4gICAgd2lkdGg6IDc1JTtcbiAgfVxuICAuY29sdW1uLmlzLXR3by10aGlyZHMsIC5jb2x1bW4uaXMtdHdvLXRoaXJkcy10YWJsZXQge1xuICAgIGZsZXg6IG5vbmU7XG4gICAgd2lkdGg6IDY2LjY2NjYlO1xuICB9XG4gIC5jb2x1bW4uaXMtaGFsZiwgLmNvbHVtbi5pcy1oYWxmLXRhYmxldCB7XG4gICAgZmxleDogbm9uZTtcbiAgICB3aWR0aDogNTAlO1xuICB9XG4gIC5jb2x1bW4uaXMtb25lLXRoaXJkLCAuY29sdW1uLmlzLW9uZS10aGlyZC10YWJsZXQge1xuICAgIGZsZXg6IG5vbmU7XG4gICAgd2lkdGg6IDMzLjMzMzMlO1xuICB9XG4gIC5jb2x1bW4uaXMtb25lLXF1YXJ0ZXIsIC5jb2x1bW4uaXMtb25lLXF1YXJ0ZXItdGFibGV0IHtcbiAgICBmbGV4OiBub25lO1xuICAgIHdpZHRoOiAyNSU7XG4gIH1cbiAgLmNvbHVtbi5pcy1vZmZzZXQtdGhyZWUtcXVhcnRlcnMsIC5jb2x1bW4uaXMtb2Zmc2V0LXRocmVlLXF1YXJ0ZXJzLXRhYmxldCB7XG4gICAgbWFyZ2luLWxlZnQ6IDc1JTtcbiAgfVxuICAuY29sdW1uLmlzLW9mZnNldC10d28tdGhpcmRzLCAuY29sdW1uLmlzLW9mZnNldC10d28tdGhpcmRzLXRhYmxldCB7XG4gICAgbWFyZ2luLWxlZnQ6IDY2LjY2NjYlO1xuICB9XG4gIC5jb2x1bW4uaXMtb2Zmc2V0LWhhbGYsIC5jb2x1bW4uaXMtb2Zmc2V0LWhhbGYtdGFibGV0IHtcbiAgICBtYXJnaW4tbGVmdDogNTAlO1xuICB9XG4gIC5jb2x1bW4uaXMtb2Zmc2V0LW9uZS10aGlyZCwgLmNvbHVtbi5pcy1vZmZzZXQtb25lLXRoaXJkLXRhYmxldCB7XG4gICAgbWFyZ2luLWxlZnQ6IDMzLjMzMzMlO1xuICB9XG4gIC5jb2x1bW4uaXMtb2Zmc2V0LW9uZS1xdWFydGVyLCAuY29sdW1uLmlzLW9mZnNldC1vbmUtcXVhcnRlci10YWJsZXQge1xuICAgIG1hcmdpbi1sZWZ0OiAyNSU7XG4gIH1cbiAgLmNvbHVtbi5pcy0xLCAuY29sdW1uLmlzLTEtdGFibGV0IHtcbiAgICBmbGV4OiBub25lO1xuICAgIHdpZHRoOiA4LjMzMzMzJTtcbiAgfVxuICAuY29sdW1uLmlzLW9mZnNldC0xLCAuY29sdW1uLmlzLW9mZnNldC0xLXRhYmxldCB7XG4gICAgbWFyZ2luLWxlZnQ6IDguMzMzMzMlO1xuICB9XG4gIC5jb2x1bW4uaXMtMiwgLmNvbHVtbi5pcy0yLXRhYmxldCB7XG4gICAgZmxleDogbm9uZTtcbiAgICB3aWR0aDogMTYuNjY2NjclO1xuICB9XG4gIC5jb2x1bW4uaXMtb2Zmc2V0LTIsIC5jb2x1bW4uaXMtb2Zmc2V0LTItdGFibGV0IHtcbiAgICBtYXJnaW4tbGVmdDogMTYuNjY2NjclO1xuICB9XG4gIC5jb2x1bW4uaXMtMywgLmNvbHVtbi5pcy0zLXRhYmxldCB7XG4gICAgZmxleDogbm9uZTtcbiAgICB3aWR0aDogMjUlO1xuICB9XG4gIC5jb2x1bW4uaXMtb2Zmc2V0LTMsIC5jb2x1bW4uaXMtb2Zmc2V0LTMtdGFibGV0IHtcbiAgICBtYXJnaW4tbGVmdDogMjUlO1xuICB9XG4gIC5jb2x1bW4uaXMtNCwgLmNvbHVtbi5pcy00LXRhYmxldCB7XG4gICAgZmxleDogbm9uZTtcbiAgICB3aWR0aDogMzMuMzMzMzMlO1xuICB9XG4gIC5jb2x1bW4uaXMtb2Zmc2V0LTQsIC5jb2x1bW4uaXMtb2Zmc2V0LTQtdGFibGV0IHtcbiAgICBtYXJnaW4tbGVmdDogMzMuMzMzMzMlO1xuICB9XG4gIC5jb2x1bW4uaXMtNSwgLmNvbHVtbi5pcy01LXRhYmxldCB7XG4gICAgZmxleDogbm9uZTtcbiAgICB3aWR0aDogNDEuNjY2NjclO1xuICB9XG4gIC5jb2x1bW4uaXMtb2Zmc2V0LTUsIC5jb2x1bW4uaXMtb2Zmc2V0LTUtdGFibGV0IHtcbiAgICBtYXJnaW4tbGVmdDogNDEuNjY2NjclO1xuICB9XG4gIC5jb2x1bW4uaXMtNiwgLmNvbHVtbi5pcy02LXRhYmxldCB7XG4gICAgZmxleDogbm9uZTtcbiAgICB3aWR0aDogNTAlO1xuICB9XG4gIC5jb2x1bW4uaXMtb2Zmc2V0LTYsIC5jb2x1bW4uaXMtb2Zmc2V0LTYtdGFibGV0IHtcbiAgICBtYXJnaW4tbGVmdDogNTAlO1xuICB9XG4gIC5jb2x1bW4uaXMtNywgLmNvbHVtbi5pcy03LXRhYmxldCB7XG4gICAgZmxleDogbm9uZTtcbiAgICB3aWR0aDogNTguMzMzMzMlO1xuICB9XG4gIC5jb2x1bW4uaXMtb2Zmc2V0LTcsIC5jb2x1bW4uaXMtb2Zmc2V0LTctdGFibGV0IHtcbiAgICBtYXJnaW4tbGVmdDogNTguMzMzMzMlO1xuICB9XG4gIC5jb2x1bW4uaXMtOCwgLmNvbHVtbi5pcy04LXRhYmxldCB7XG4gICAgZmxleDogbm9uZTtcbiAgICB3aWR0aDogNjYuNjY2NjclO1xuICB9XG4gIC5jb2x1bW4uaXMtb2Zmc2V0LTgsIC5jb2x1bW4uaXMtb2Zmc2V0LTgtdGFibGV0IHtcbiAgICBtYXJnaW4tbGVmdDogNjYuNjY2NjclO1xuICB9XG4gIC5jb2x1bW4uaXMtOSwgLmNvbHVtbi5pcy05LXRhYmxldCB7XG4gICAgZmxleDogbm9uZTtcbiAgICB3aWR0aDogNzUlO1xuICB9XG4gIC5jb2x1bW4uaXMtb2Zmc2V0LTksIC5jb2x1bW4uaXMtb2Zmc2V0LTktdGFibGV0IHtcbiAgICBtYXJnaW4tbGVmdDogNzUlO1xuICB9XG4gIC5jb2x1bW4uaXMtMTAsIC5jb2x1bW4uaXMtMTAtdGFibGV0IHtcbiAgICBmbGV4OiBub25lO1xuICAgIHdpZHRoOiA4My4zMzMzMyU7XG4gIH1cbiAgLmNvbHVtbi5pcy1vZmZzZXQtMTAsIC5jb2x1bW4uaXMtb2Zmc2V0LTEwLXRhYmxldCB7XG4gICAgbWFyZ2luLWxlZnQ6IDgzLjMzMzMzJTtcbiAgfVxuICAuY29sdW1uLmlzLTExLCAuY29sdW1uLmlzLTExLXRhYmxldCB7XG4gICAgZmxleDogbm9uZTtcbiAgICB3aWR0aDogOTEuNjY2NjclO1xuICB9XG4gIC5jb2x1bW4uaXMtb2Zmc2V0LTExLCAuY29sdW1uLmlzLW9mZnNldC0xMS10YWJsZXQge1xuICAgIG1hcmdpbi1sZWZ0OiA5MS42NjY2NyU7XG4gIH1cbiAgLmNvbHVtbi5pcy0xMiwgLmNvbHVtbi5pcy0xMi10YWJsZXQge1xuICAgIGZsZXg6IG5vbmU7XG4gICAgd2lkdGg6IDEwMCU7XG4gIH1cbiAgLmNvbHVtbi5pcy1vZmZzZXQtMTIsIC5jb2x1bW4uaXMtb2Zmc2V0LTEyLXRhYmxldCB7XG4gICAgbWFyZ2luLWxlZnQ6IDEwMCU7XG4gIH1cbn1cblxuQG1lZGlhIHNjcmVlbiBhbmQgKG1heC13aWR0aDogMTAwN3B4KSB7XG4gIC5jb2x1bW4uaXMtbmFycm93LXRvdWNoIHtcbiAgICBmbGV4OiBub25lO1xuICB9XG4gIC5jb2x1bW4uaXMtZnVsbC10b3VjaCB7XG4gICAgZmxleDogbm9uZTtcbiAgICB3aWR0aDogMTAwJTtcbiAgfVxuICAuY29sdW1uLmlzLXRocmVlLXF1YXJ0ZXJzLXRvdWNoIHtcbiAgICBmbGV4OiBub25lO1xuICAgIHdpZHRoOiA3NSU7XG4gIH1cbiAgLmNvbHVtbi5pcy10d28tdGhpcmRzLXRvdWNoIHtcbiAgICBmbGV4OiBub25lO1xuICAgIHdpZHRoOiA2Ni42NjY2JTtcbiAgfVxuICAuY29sdW1uLmlzLWhhbGYtdG91Y2gge1xuICAgIGZsZXg6IG5vbmU7XG4gICAgd2lkdGg6IDUwJTtcbiAgfVxuICAuY29sdW1uLmlzLW9uZS10aGlyZC10b3VjaCB7XG4gICAgZmxleDogbm9uZTtcbiAgICB3aWR0aDogMzMuMzMzMyU7XG4gIH1cbiAgLmNvbHVtbi5pcy1vbmUtcXVhcnRlci10b3VjaCB7XG4gICAgZmxleDogbm9uZTtcbiAgICB3aWR0aDogMjUlO1xuICB9XG4gIC5jb2x1bW4uaXMtb2Zmc2V0LXRocmVlLXF1YXJ0ZXJzLXRvdWNoIHtcbiAgICBtYXJnaW4tbGVmdDogNzUlO1xuICB9XG4gIC5jb2x1bW4uaXMtb2Zmc2V0LXR3by10aGlyZHMtdG91Y2gge1xuICAgIG1hcmdpbi1sZWZ0OiA2Ni42NjY2JTtcbiAgfVxuICAuY29sdW1uLmlzLW9mZnNldC1oYWxmLXRvdWNoIHtcbiAgICBtYXJnaW4tbGVmdDogNTAlO1xuICB9XG4gIC5jb2x1bW4uaXMtb2Zmc2V0LW9uZS10aGlyZC10b3VjaCB7XG4gICAgbWFyZ2luLWxlZnQ6IDMzLjMzMzMlO1xuICB9XG4gIC5jb2x1bW4uaXMtb2Zmc2V0LW9uZS1xdWFydGVyLXRvdWNoIHtcbiAgICBtYXJnaW4tbGVmdDogMjUlO1xuICB9XG4gIC5jb2x1bW4uaXMtMS10b3VjaCB7XG4gICAgZmxleDogbm9uZTtcbiAgICB3aWR0aDogOC4zMzMzMyU7XG4gIH1cbiAgLmNvbHVtbi5pcy1vZmZzZXQtMS10b3VjaCB7XG4gICAgbWFyZ2luLWxlZnQ6IDguMzMzMzMlO1xuICB9XG4gIC5jb2x1bW4uaXMtMi10b3VjaCB7XG4gICAgZmxleDogbm9uZTtcbiAgICB3aWR0aDogMTYuNjY2NjclO1xuICB9XG4gIC5jb2x1bW4uaXMtb2Zmc2V0LTItdG91Y2gge1xuICAgIG1hcmdpbi1sZWZ0OiAxNi42NjY2NyU7XG4gIH1cbiAgLmNvbHVtbi5pcy0zLXRvdWNoIHtcbiAgICBmbGV4OiBub25lO1xuICAgIHdpZHRoOiAyNSU7XG4gIH1cbiAgLmNvbHVtbi5pcy1vZmZzZXQtMy10b3VjaCB7XG4gICAgbWFyZ2luLWxlZnQ6IDI1JTtcbiAgfVxuICAuY29sdW1uLmlzLTQtdG91Y2gge1xuICAgIGZsZXg6IG5vbmU7XG4gICAgd2lkdGg6IDMzLjMzMzMzJTtcbiAgfVxuICAuY29sdW1uLmlzLW9mZnNldC00LXRvdWNoIHtcbiAgICBtYXJnaW4tbGVmdDogMzMuMzMzMzMlO1xuICB9XG4gIC5jb2x1bW4uaXMtNS10b3VjaCB7XG4gICAgZmxleDogbm9uZTtcbiAgICB3aWR0aDogNDEuNjY2NjclO1xuICB9XG4gIC5jb2x1bW4uaXMtb2Zmc2V0LTUtdG91Y2gge1xuICAgIG1hcmdpbi1sZWZ0OiA0MS42NjY2NyU7XG4gIH1cbiAgLmNvbHVtbi5pcy02LXRvdWNoIHtcbiAgICBmbGV4OiBub25lO1xuICAgIHdpZHRoOiA1MCU7XG4gIH1cbiAgLmNvbHVtbi5pcy1vZmZzZXQtNi10b3VjaCB7XG4gICAgbWFyZ2luLWxlZnQ6IDUwJTtcbiAgfVxuICAuY29sdW1uLmlzLTctdG91Y2gge1xuICAgIGZsZXg6IG5vbmU7XG4gICAgd2lkdGg6IDU4LjMzMzMzJTtcbiAgfVxuICAuY29sdW1uLmlzLW9mZnNldC03LXRvdWNoIHtcbiAgICBtYXJnaW4tbGVmdDogNTguMzMzMzMlO1xuICB9XG4gIC5jb2x1bW4uaXMtOC10b3VjaCB7XG4gICAgZmxleDogbm9uZTtcbiAgICB3aWR0aDogNjYuNjY2NjclO1xuICB9XG4gIC5jb2x1bW4uaXMtb2Zmc2V0LTgtdG91Y2gge1xuICAgIG1hcmdpbi1sZWZ0OiA2Ni42NjY2NyU7XG4gIH1cbiAgLmNvbHVtbi5pcy05LXRvdWNoIHtcbiAgICBmbGV4OiBub25lO1xuICAgIHdpZHRoOiA3NSU7XG4gIH1cbiAgLmNvbHVtbi5pcy1vZmZzZXQtOS10b3VjaCB7XG4gICAgbWFyZ2luLWxlZnQ6IDc1JTtcbiAgfVxuICAuY29sdW1uLmlzLTEwLXRvdWNoIHtcbiAgICBmbGV4OiBub25lO1xuICAgIHdpZHRoOiA4My4zMzMzMyU7XG4gIH1cbiAgLmNvbHVtbi5pcy1vZmZzZXQtMTAtdG91Y2gge1xuICAgIG1hcmdpbi1sZWZ0OiA4My4zMzMzMyU7XG4gIH1cbiAgLmNvbHVtbi5pcy0xMS10b3VjaCB7XG4gICAgZmxleDogbm9uZTtcbiAgICB3aWR0aDogOTEuNjY2NjclO1xuICB9XG4gIC5jb2x1bW4uaXMtb2Zmc2V0LTExLXRvdWNoIHtcbiAgICBtYXJnaW4tbGVmdDogOTEuNjY2NjclO1xuICB9XG4gIC5jb2x1bW4uaXMtMTItdG91Y2gge1xuICAgIGZsZXg6IG5vbmU7XG4gICAgd2lkdGg6IDEwMCU7XG4gIH1cbiAgLmNvbHVtbi5pcy1vZmZzZXQtMTItdG91Y2gge1xuICAgIG1hcmdpbi1sZWZ0OiAxMDAlO1xuICB9XG59XG5cbkBtZWRpYSBzY3JlZW4gYW5kIChtaW4td2lkdGg6IDEwMDhweCkge1xuICAuY29sdW1uLmlzLW5hcnJvdy1kZXNrdG9wIHtcbiAgICBmbGV4OiBub25lO1xuICB9XG4gIC5jb2x1bW4uaXMtZnVsbC1kZXNrdG9wIHtcbiAgICBmbGV4OiBub25lO1xuICAgIHdpZHRoOiAxMDAlO1xuICB9XG4gIC5jb2x1bW4uaXMtdGhyZWUtcXVhcnRlcnMtZGVza3RvcCB7XG4gICAgZmxleDogbm9uZTtcbiAgICB3aWR0aDogNzUlO1xuICB9XG4gIC5jb2x1bW4uaXMtdHdvLXRoaXJkcy1kZXNrdG9wIHtcbiAgICBmbGV4OiBub25lO1xuICAgIHdpZHRoOiA2Ni42NjY2JTtcbiAgfVxuICAuY29sdW1uLmlzLWhhbGYtZGVza3RvcCB7XG4gICAgZmxleDogbm9uZTtcbiAgICB3aWR0aDogNTAlO1xuICB9XG4gIC5jb2x1bW4uaXMtb25lLXRoaXJkLWRlc2t0b3Age1xuICAgIGZsZXg6IG5vbmU7XG4gICAgd2lkdGg6IDMzLjMzMzMlO1xuICB9XG4gIC5jb2x1bW4uaXMtb25lLXF1YXJ0ZXItZGVza3RvcCB7XG4gICAgZmxleDogbm9uZTtcbiAgICB3aWR0aDogMjUlO1xuICB9XG4gIC5jb2x1bW4uaXMtb2Zmc2V0LXRocmVlLXF1YXJ0ZXJzLWRlc2t0b3Age1xuICAgIG1hcmdpbi1sZWZ0OiA3NSU7XG4gIH1cbiAgLmNvbHVtbi5pcy1vZmZzZXQtdHdvLXRoaXJkcy1kZXNrdG9wIHtcbiAgICBtYXJnaW4tbGVmdDogNjYuNjY2NiU7XG4gIH1cbiAgLmNvbHVtbi5pcy1vZmZzZXQtaGFsZi1kZXNrdG9wIHtcbiAgICBtYXJnaW4tbGVmdDogNTAlO1xuICB9XG4gIC5jb2x1bW4uaXMtb2Zmc2V0LW9uZS10aGlyZC1kZXNrdG9wIHtcbiAgICBtYXJnaW4tbGVmdDogMzMuMzMzMyU7XG4gIH1cbiAgLmNvbHVtbi5pcy1vZmZzZXQtb25lLXF1YXJ0ZXItZGVza3RvcCB7XG4gICAgbWFyZ2luLWxlZnQ6IDI1JTtcbiAgfVxuICAuY29sdW1uLmlzLTEtZGVza3RvcCB7XG4gICAgZmxleDogbm9uZTtcbiAgICB3aWR0aDogOC4zMzMzMyU7XG4gIH1cbiAgLmNvbHVtbi5pcy1vZmZzZXQtMS1kZXNrdG9wIHtcbiAgICBtYXJnaW4tbGVmdDogOC4zMzMzMyU7XG4gIH1cbiAgLmNvbHVtbi5pcy0yLWRlc2t0b3Age1xuICAgIGZsZXg6IG5vbmU7XG4gICAgd2lkdGg6IDE2LjY2NjY3JTtcbiAgfVxuICAuY29sdW1uLmlzLW9mZnNldC0yLWRlc2t0b3Age1xuICAgIG1hcmdpbi1sZWZ0OiAxNi42NjY2NyU7XG4gIH1cbiAgLmNvbHVtbi5pcy0zLWRlc2t0b3Age1xuICAgIGZsZXg6IG5vbmU7XG4gICAgd2lkdGg6IDI1JTtcbiAgfVxuICAuY29sdW1uLmlzLW9mZnNldC0zLWRlc2t0b3Age1xuICAgIG1hcmdpbi1sZWZ0OiAyNSU7XG4gIH1cbiAgLmNvbHVtbi5pcy00LWRlc2t0b3Age1xuICAgIGZsZXg6IG5vbmU7XG4gICAgd2lkdGg6IDMzLjMzMzMzJTtcbiAgfVxuICAuY29sdW1uLmlzLW9mZnNldC00LWRlc2t0b3Age1xuICAgIG1hcmdpbi1sZWZ0OiAzMy4zMzMzMyU7XG4gIH1cbiAgLmNvbHVtbi5pcy01LWRlc2t0b3Age1xuICAgIGZsZXg6IG5vbmU7XG4gICAgd2lkdGg6IDQxLjY2NjY3JTtcbiAgfVxuICAuY29sdW1uLmlzLW9mZnNldC01LWRlc2t0b3Age1xuICAgIG1hcmdpbi1sZWZ0OiA0MS42NjY2NyU7XG4gIH1cbiAgLmNvbHVtbi5pcy02LWRlc2t0b3Age1xuICAgIGZsZXg6IG5vbmU7XG4gICAgd2lkdGg6IDUwJTtcbiAgfVxuICAuY29sdW1uLmlzLW9mZnNldC02LWRlc2t0b3Age1xuICAgIG1hcmdpbi1sZWZ0OiA1MCU7XG4gIH1cbiAgLmNvbHVtbi5pcy03LWRlc2t0b3Age1xuICAgIGZsZXg6IG5vbmU7XG4gICAgd2lkdGg6IDU4LjMzMzMzJTtcbiAgfVxuICAuY29sdW1uLmlzLW9mZnNldC03LWRlc2t0b3Age1xuICAgIG1hcmdpbi1sZWZ0OiA1OC4zMzMzMyU7XG4gIH1cbiAgLmNvbHVtbi5pcy04LWRlc2t0b3Age1xuICAgIGZsZXg6IG5vbmU7XG4gICAgd2lkdGg6IDY2LjY2NjY3JTtcbiAgfVxuICAuY29sdW1uLmlzLW9mZnNldC04LWRlc2t0b3Age1xuICAgIG1hcmdpbi1sZWZ0OiA2Ni42NjY2NyU7XG4gIH1cbiAgLmNvbHVtbi5pcy05LWRlc2t0b3Age1xuICAgIGZsZXg6IG5vbmU7XG4gICAgd2lkdGg6IDc1JTtcbiAgfVxuICAuY29sdW1uLmlzLW9mZnNldC05LWRlc2t0b3Age1xuICAgIG1hcmdpbi1sZWZ0OiA3NSU7XG4gIH1cbiAgLmNvbHVtbi5pcy0xMC1kZXNrdG9wIHtcbiAgICBmbGV4OiBub25lO1xuICAgIHdpZHRoOiA4My4zMzMzMyU7XG4gIH1cbiAgLmNvbHVtbi5pcy1vZmZzZXQtMTAtZGVza3RvcCB7XG4gICAgbWFyZ2luLWxlZnQ6IDgzLjMzMzMzJTtcbiAgfVxuICAuY29sdW1uLmlzLTExLWRlc2t0b3Age1xuICAgIGZsZXg6IG5vbmU7XG4gICAgd2lkdGg6IDkxLjY2NjY3JTtcbiAgfVxuICAuY29sdW1uLmlzLW9mZnNldC0xMS1kZXNrdG9wIHtcbiAgICBtYXJnaW4tbGVmdDogOTEuNjY2NjclO1xuICB9XG4gIC5jb2x1bW4uaXMtMTItZGVza3RvcCB7XG4gICAgZmxleDogbm9uZTtcbiAgICB3aWR0aDogMTAwJTtcbiAgfVxuICAuY29sdW1uLmlzLW9mZnNldC0xMi1kZXNrdG9wIHtcbiAgICBtYXJnaW4tbGVmdDogMTAwJTtcbiAgfVxufVxuXG5AbWVkaWEgc2NyZWVuIGFuZCAobWluLXdpZHRoOiAxMjAwcHgpIHtcbiAgLmNvbHVtbi5pcy1uYXJyb3ctd2lkZXNjcmVlbiB7XG4gICAgZmxleDogbm9uZTtcbiAgfVxuICAuY29sdW1uLmlzLWZ1bGwtd2lkZXNjcmVlbiB7XG4gICAgZmxleDogbm9uZTtcbiAgICB3aWR0aDogMTAwJTtcbiAgfVxuICAuY29sdW1uLmlzLXRocmVlLXF1YXJ0ZXJzLXdpZGVzY3JlZW4ge1xuICAgIGZsZXg6IG5vbmU7XG4gICAgd2lkdGg6IDc1JTtcbiAgfVxuICAuY29sdW1uLmlzLXR3by10aGlyZHMtd2lkZXNjcmVlbiB7XG4gICAgZmxleDogbm9uZTtcbiAgICB3aWR0aDogNjYuNjY2NiU7XG4gIH1cbiAgLmNvbHVtbi5pcy1oYWxmLXdpZGVzY3JlZW4ge1xuICAgIGZsZXg6IG5vbmU7XG4gICAgd2lkdGg6IDUwJTtcbiAgfVxuICAuY29sdW1uLmlzLW9uZS10aGlyZC13aWRlc2NyZWVuIHtcbiAgICBmbGV4OiBub25lO1xuICAgIHdpZHRoOiAzMy4zMzMzJTtcbiAgfVxuICAuY29sdW1uLmlzLW9uZS1xdWFydGVyLXdpZGVzY3JlZW4ge1xuICAgIGZsZXg6IG5vbmU7XG4gICAgd2lkdGg6IDI1JTtcbiAgfVxuICAuY29sdW1uLmlzLW9mZnNldC10aHJlZS1xdWFydGVycy13aWRlc2NyZWVuIHtcbiAgICBtYXJnaW4tbGVmdDogNzUlO1xuICB9XG4gIC5jb2x1bW4uaXMtb2Zmc2V0LXR3by10aGlyZHMtd2lkZXNjcmVlbiB7XG4gICAgbWFyZ2luLWxlZnQ6IDY2LjY2NjYlO1xuICB9XG4gIC5jb2x1bW4uaXMtb2Zmc2V0LWhhbGYtd2lkZXNjcmVlbiB7XG4gICAgbWFyZ2luLWxlZnQ6IDUwJTtcbiAgfVxuICAuY29sdW1uLmlzLW9mZnNldC1vbmUtdGhpcmQtd2lkZXNjcmVlbiB7XG4gICAgbWFyZ2luLWxlZnQ6IDMzLjMzMzMlO1xuICB9XG4gIC5jb2x1bW4uaXMtb2Zmc2V0LW9uZS1xdWFydGVyLXdpZGVzY3JlZW4ge1xuICAgIG1hcmdpbi1sZWZ0OiAyNSU7XG4gIH1cbiAgLmNvbHVtbi5pcy0xLXdpZGVzY3JlZW4ge1xuICAgIGZsZXg6IG5vbmU7XG4gICAgd2lkdGg6IDguMzMzMzMlO1xuICB9XG4gIC5jb2x1bW4uaXMtb2Zmc2V0LTEtd2lkZXNjcmVlbiB7XG4gICAgbWFyZ2luLWxlZnQ6IDguMzMzMzMlO1xuICB9XG4gIC5jb2x1bW4uaXMtMi13aWRlc2NyZWVuIHtcbiAgICBmbGV4OiBub25lO1xuICAgIHdpZHRoOiAxNi42NjY2NyU7XG4gIH1cbiAgLmNvbHVtbi5pcy1vZmZzZXQtMi13aWRlc2NyZWVuIHtcbiAgICBtYXJnaW4tbGVmdDogMTYuNjY2NjclO1xuICB9XG4gIC5jb2x1bW4uaXMtMy13aWRlc2NyZWVuIHtcbiAgICBmbGV4OiBub25lO1xuICAgIHdpZHRoOiAyNSU7XG4gIH1cbiAgLmNvbHVtbi5pcy1vZmZzZXQtMy13aWRlc2NyZWVuIHtcbiAgICBtYXJnaW4tbGVmdDogMjUlO1xuICB9XG4gIC5jb2x1bW4uaXMtNC13aWRlc2NyZWVuIHtcbiAgICBmbGV4OiBub25lO1xuICAgIHdpZHRoOiAzMy4zMzMzMyU7XG4gIH1cbiAgLmNvbHVtbi5pcy1vZmZzZXQtNC13aWRlc2NyZWVuIHtcbiAgICBtYXJnaW4tbGVmdDogMzMuMzMzMzMlO1xuICB9XG4gIC5jb2x1bW4uaXMtNS13aWRlc2NyZWVuIHtcbiAgICBmbGV4OiBub25lO1xuICAgIHdpZHRoOiA0MS42NjY2NyU7XG4gIH1cbiAgLmNvbHVtbi5pcy1vZmZzZXQtNS13aWRlc2NyZWVuIHtcbiAgICBtYXJnaW4tbGVmdDogNDEuNjY2NjclO1xuICB9XG4gIC5jb2x1bW4uaXMtNi13aWRlc2NyZWVuIHtcbiAgICBmbGV4OiBub25lO1xuICAgIHdpZHRoOiA1MCU7XG4gIH1cbiAgLmNvbHVtbi5pcy1vZmZzZXQtNi13aWRlc2NyZWVuIHtcbiAgICBtYXJnaW4tbGVmdDogNTAlO1xuICB9XG4gIC5jb2x1bW4uaXMtNy13aWRlc2NyZWVuIHtcbiAgICBmbGV4OiBub25lO1xuICAgIHdpZHRoOiA1OC4zMzMzMyU7XG4gIH1cbiAgLmNvbHVtbi5pcy1vZmZzZXQtNy13aWRlc2NyZWVuIHtcbiAgICBtYXJnaW4tbGVmdDogNTguMzMzMzMlO1xuICB9XG4gIC5jb2x1bW4uaXMtOC13aWRlc2NyZWVuIHtcbiAgICBmbGV4OiBub25lO1xuICAgIHdpZHRoOiA2Ni42NjY2NyU7XG4gIH1cbiAgLmNvbHVtbi5pcy1vZmZzZXQtOC13aWRlc2NyZWVuIHtcbiAgICBtYXJnaW4tbGVmdDogNjYuNjY2NjclO1xuICB9XG4gIC5jb2x1bW4uaXMtOS13aWRlc2NyZWVuIHtcbiAgICBmbGV4OiBub25lO1xuICAgIHdpZHRoOiA3NSU7XG4gIH1cbiAgLmNvbHVtbi5pcy1vZmZzZXQtOS13aWRlc2NyZWVuIHtcbiAgICBtYXJnaW4tbGVmdDogNzUlO1xuICB9XG4gIC5jb2x1bW4uaXMtMTAtd2lkZXNjcmVlbiB7XG4gICAgZmxleDogbm9uZTtcbiAgICB3aWR0aDogODMuMzMzMzMlO1xuICB9XG4gIC5jb2x1bW4uaXMtb2Zmc2V0LTEwLXdpZGVzY3JlZW4ge1xuICAgIG1hcmdpbi1sZWZ0OiA4My4zMzMzMyU7XG4gIH1cbiAgLmNvbHVtbi5pcy0xMS13aWRlc2NyZWVuIHtcbiAgICBmbGV4OiBub25lO1xuICAgIHdpZHRoOiA5MS42NjY2NyU7XG4gIH1cbiAgLmNvbHVtbi5pcy1vZmZzZXQtMTEtd2lkZXNjcmVlbiB7XG4gICAgbWFyZ2luLWxlZnQ6IDkxLjY2NjY3JTtcbiAgfVxuICAuY29sdW1uLmlzLTEyLXdpZGVzY3JlZW4ge1xuICAgIGZsZXg6IG5vbmU7XG4gICAgd2lkdGg6IDEwMCU7XG4gIH1cbiAgLmNvbHVtbi5pcy1vZmZzZXQtMTItd2lkZXNjcmVlbiB7XG4gICAgbWFyZ2luLWxlZnQ6IDEwMCU7XG4gIH1cbn1cblxuQG1lZGlhIHNjcmVlbiBhbmQgKG1pbi13aWR0aDogMTM5MnB4KSB7XG4gIC5jb2x1bW4uaXMtbmFycm93LWZ1bGxoZCB7XG4gICAgZmxleDogbm9uZTtcbiAgfVxuICAuY29sdW1uLmlzLWZ1bGwtZnVsbGhkIHtcbiAgICBmbGV4OiBub25lO1xuICAgIHdpZHRoOiAxMDAlO1xuICB9XG4gIC5jb2x1bW4uaXMtdGhyZWUtcXVhcnRlcnMtZnVsbGhkIHtcbiAgICBmbGV4OiBub25lO1xuICAgIHdpZHRoOiA3NSU7XG4gIH1cbiAgLmNvbHVtbi5pcy10d28tdGhpcmRzLWZ1bGxoZCB7XG4gICAgZmxleDogbm9uZTtcbiAgICB3aWR0aDogNjYuNjY2NiU7XG4gIH1cbiAgLmNvbHVtbi5pcy1oYWxmLWZ1bGxoZCB7XG4gICAgZmxleDogbm9uZTtcbiAgICB3aWR0aDogNTAlO1xuICB9XG4gIC5jb2x1bW4uaXMtb25lLXRoaXJkLWZ1bGxoZCB7XG4gICAgZmxleDogbm9uZTtcbiAgICB3aWR0aDogMzMuMzMzMyU7XG4gIH1cbiAgLmNvbHVtbi5pcy1vbmUtcXVhcnRlci1mdWxsaGQge1xuICAgIGZsZXg6IG5vbmU7XG4gICAgd2lkdGg6IDI1JTtcbiAgfVxuICAuY29sdW1uLmlzLW9mZnNldC10aHJlZS1xdWFydGVycy1mdWxsaGQge1xuICAgIG1hcmdpbi1sZWZ0OiA3NSU7XG4gIH1cbiAgLmNvbHVtbi5pcy1vZmZzZXQtdHdvLXRoaXJkcy1mdWxsaGQge1xuICAgIG1hcmdpbi1sZWZ0OiA2Ni42NjY2JTtcbiAgfVxuICAuY29sdW1uLmlzLW9mZnNldC1oYWxmLWZ1bGxoZCB7XG4gICAgbWFyZ2luLWxlZnQ6IDUwJTtcbiAgfVxuICAuY29sdW1uLmlzLW9mZnNldC1vbmUtdGhpcmQtZnVsbGhkIHtcbiAgICBtYXJnaW4tbGVmdDogMzMuMzMzMyU7XG4gIH1cbiAgLmNvbHVtbi5pcy1vZmZzZXQtb25lLXF1YXJ0ZXItZnVsbGhkIHtcbiAgICBtYXJnaW4tbGVmdDogMjUlO1xuICB9XG4gIC5jb2x1bW4uaXMtMS1mdWxsaGQge1xuICAgIGZsZXg6IG5vbmU7XG4gICAgd2lkdGg6IDguMzMzMzMlO1xuICB9XG4gIC5jb2x1bW4uaXMtb2Zmc2V0LTEtZnVsbGhkIHtcbiAgICBtYXJnaW4tbGVmdDogOC4zMzMzMyU7XG4gIH1cbiAgLmNvbHVtbi5pcy0yLWZ1bGxoZCB7XG4gICAgZmxleDogbm9uZTtcbiAgICB3aWR0aDogMTYuNjY2NjclO1xuICB9XG4gIC5jb2x1bW4uaXMtb2Zmc2V0LTItZnVsbGhkIHtcbiAgICBtYXJnaW4tbGVmdDogMTYuNjY2NjclO1xuICB9XG4gIC5jb2x1bW4uaXMtMy1mdWxsaGQge1xuICAgIGZsZXg6IG5vbmU7XG4gICAgd2lkdGg6IDI1JTtcbiAgfVxuICAuY29sdW1uLmlzLW9mZnNldC0zLWZ1bGxoZCB7XG4gICAgbWFyZ2luLWxlZnQ6IDI1JTtcbiAgfVxuICAuY29sdW1uLmlzLTQtZnVsbGhkIHtcbiAgICBmbGV4OiBub25lO1xuICAgIHdpZHRoOiAzMy4zMzMzMyU7XG4gIH1cbiAgLmNvbHVtbi5pcy1vZmZzZXQtNC1mdWxsaGQge1xuICAgIG1hcmdpbi1sZWZ0OiAzMy4zMzMzMyU7XG4gIH1cbiAgLmNvbHVtbi5pcy01LWZ1bGxoZCB7XG4gICAgZmxleDogbm9uZTtcbiAgICB3aWR0aDogNDEuNjY2NjclO1xuICB9XG4gIC5jb2x1bW4uaXMtb2Zmc2V0LTUtZnVsbGhkIHtcbiAgICBtYXJnaW4tbGVmdDogNDEuNjY2NjclO1xuICB9XG4gIC5jb2x1bW4uaXMtNi1mdWxsaGQge1xuICAgIGZsZXg6IG5vbmU7XG4gICAgd2lkdGg6IDUwJTtcbiAgfVxuICAuY29sdW1uLmlzLW9mZnNldC02LWZ1bGxoZCB7XG4gICAgbWFyZ2luLWxlZnQ6IDUwJTtcbiAgfVxuICAuY29sdW1uLmlzLTctZnVsbGhkIHtcbiAgICBmbGV4OiBub25lO1xuICAgIHdpZHRoOiA1OC4zMzMzMyU7XG4gIH1cbiAgLmNvbHVtbi5pcy1vZmZzZXQtNy1mdWxsaGQge1xuICAgIG1hcmdpbi1sZWZ0OiA1OC4zMzMzMyU7XG4gIH1cbiAgLmNvbHVtbi5pcy04LWZ1bGxoZCB7XG4gICAgZmxleDogbm9uZTtcbiAgICB3aWR0aDogNjYuNjY2NjclO1xuICB9XG4gIC5jb2x1bW4uaXMtb2Zmc2V0LTgtZnVsbGhkIHtcbiAgICBtYXJnaW4tbGVmdDogNjYuNjY2NjclO1xuICB9XG4gIC5jb2x1bW4uaXMtOS1mdWxsaGQge1xuICAgIGZsZXg6IG5vbmU7XG4gICAgd2lkdGg6IDc1JTtcbiAgfVxuICAuY29sdW1uLmlzLW9mZnNldC05LWZ1bGxoZCB7XG4gICAgbWFyZ2luLWxlZnQ6IDc1JTtcbiAgfVxuICAuY29sdW1uLmlzLTEwLWZ1bGxoZCB7XG4gICAgZmxleDogbm9uZTtcbiAgICB3aWR0aDogODMuMzMzMzMlO1xuICB9XG4gIC5jb2x1bW4uaXMtb2Zmc2V0LTEwLWZ1bGxoZCB7XG4gICAgbWFyZ2luLWxlZnQ6IDgzLjMzMzMzJTtcbiAgfVxuICAuY29sdW1uLmlzLTExLWZ1bGxoZCB7XG4gICAgZmxleDogbm9uZTtcbiAgICB3aWR0aDogOTEuNjY2NjclO1xuICB9XG4gIC5jb2x1bW4uaXMtb2Zmc2V0LTExLWZ1bGxoZCB7XG4gICAgbWFyZ2luLWxlZnQ6IDkxLjY2NjY3JTtcbiAgfVxuICAuY29sdW1uLmlzLTEyLWZ1bGxoZCB7XG4gICAgZmxleDogbm9uZTtcbiAgICB3aWR0aDogMTAwJTtcbiAgfVxuICAuY29sdW1uLmlzLW9mZnNldC0xMi1mdWxsaGQge1xuICAgIG1hcmdpbi1sZWZ0OiAxMDAlO1xuICB9XG59XG5cbi5jb2x1bW5zIHtcbiAgbWFyZ2luLWxlZnQ6IC0wLjc1cmVtO1xuICBtYXJnaW4tcmlnaHQ6IC0wLjc1cmVtO1xuICBtYXJnaW4tdG9wOiAtMC43NXJlbTtcbn1cblxuLmNvbHVtbnM6bGFzdC1jaGlsZCB7XG4gIG1hcmdpbi1ib3R0b206IC0wLjc1cmVtO1xufVxuXG4uY29sdW1uczpub3QoOmxhc3QtY2hpbGQpIHtcbiAgbWFyZ2luLWJvdHRvbTogMC43NXJlbTtcbn1cblxuLmNvbHVtbnMuaXMtY2VudGVyZWQge1xuICBqdXN0aWZ5LWNvbnRlbnQ6IGNlbnRlcjtcbn1cblxuLmNvbHVtbnMuaXMtZ2FwbGVzcyB7XG4gIG1hcmdpbi1sZWZ0OiAwO1xuICBtYXJnaW4tcmlnaHQ6IDA7XG4gIG1hcmdpbi10b3A6IDA7XG59XG5cbi5jb2x1bW5zLmlzLWdhcGxlc3M6bGFzdC1jaGlsZCB7XG4gIG1hcmdpbi1ib3R0b206IDA7XG59XG5cbi5jb2x1bW5zLmlzLWdhcGxlc3M6bm90KDpsYXN0LWNoaWxkKSB7XG4gIG1hcmdpbi1ib3R0b206IDEuNXJlbTtcbn1cblxuLmNvbHVtbnMuaXMtZ2FwbGVzcyA+IC5jb2x1bW4ge1xuICBtYXJnaW46IDA7XG4gIHBhZGRpbmc6IDA7XG59XG5cbkBtZWRpYSBzY3JlZW4gYW5kIChtaW4td2lkdGg6IDc2OXB4KSwgcHJpbnQge1xuICAuY29sdW1ucy5pcy1ncmlkIHtcbiAgICBmbGV4LXdyYXA6IHdyYXA7XG4gIH1cbiAgLmNvbHVtbnMuaXMtZ3JpZCA+IC5jb2x1bW4ge1xuICAgIG1heC13aWR0aDogMzMuMzMzMyU7XG4gICAgcGFkZGluZzogMC43NXJlbTtcbiAgICB3aWR0aDogMzMuMzMzMyU7XG4gIH1cbiAgLmNvbHVtbnMuaXMtZ3JpZCA+IC5jb2x1bW4gKyAuY29sdW1uIHtcbiAgICBtYXJnaW4tbGVmdDogMDtcbiAgfVxufVxuXG4uY29sdW1ucy5pcy1tb2JpbGUge1xuICBkaXNwbGF5OiBmbGV4O1xufVxuXG4uY29sdW1ucy5pcy1tdWx0aWxpbmUge1xuICBmbGV4LXdyYXA6IHdyYXA7XG59XG5cbi5jb2x1bW5zLmlzLXZjZW50ZXJlZCB7XG4gIGFsaWduLWl0ZW1zOiBjZW50ZXI7XG59XG5cbkBtZWRpYSBzY3JlZW4gYW5kIChtaW4td2lkdGg6IDc2OXB4KSwgcHJpbnQge1xuICAuY29sdW1uczpub3QoLmlzLWRlc2t0b3ApIHtcbiAgICBkaXNwbGF5OiBmbGV4O1xuICB9XG59XG5cbkBtZWRpYSBzY3JlZW4gYW5kIChtaW4td2lkdGg6IDEwMDhweCkge1xuICAuY29sdW1ucy5pcy1kZXNrdG9wIHtcbiAgICBkaXNwbGF5OiBmbGV4O1xuICB9XG59XG5cbi50aWxlIHtcbiAgYWxpZ24taXRlbXM6IHN0cmV0Y2g7XG4gIGRpc3BsYXk6IGJsb2NrO1xuICBmbGV4LWJhc2lzOiAwO1xuICBmbGV4LWdyb3c6IDE7XG4gIGZsZXgtc2hyaW5rOiAxO1xuICBtaW4taGVpZ2h0OiBtaW4tY29udGVudDtcbn1cblxuLnRpbGUuaXMtYW5jZXN0b3Ige1xuICBtYXJnaW4tbGVmdDogLTAuNzVyZW07XG4gIG1hcmdpbi1yaWdodDogLTAuNzVyZW07XG4gIG1hcmdpbi10b3A6IC0wLjc1cmVtO1xufVxuXG4udGlsZS5pcy1hbmNlc3RvcjpsYXN0LWNoaWxkIHtcbiAgbWFyZ2luLWJvdHRvbTogLTAuNzVyZW07XG59XG5cbi50aWxlLmlzLWFuY2VzdG9yOm5vdCg6bGFzdC1jaGlsZCkge1xuICBtYXJnaW4tYm90dG9tOiAwLjc1cmVtO1xufVxuXG4udGlsZS5pcy1jaGlsZCB7XG4gIG1hcmdpbjogMCAhaW1wb3J0YW50O1xufVxuXG4udGlsZS5pcy1wYXJlbnQge1xuICBwYWRkaW5nOiAwLjc1cmVtO1xufVxuXG4udGlsZS5pcy12ZXJ0aWNhbCB7XG4gIGZsZXgtZGlyZWN0aW9uOiBjb2x1bW47XG59XG5cbi50aWxlLmlzLXZlcnRpY2FsID4gLnRpbGUuaXMtY2hpbGQ6bm90KDpsYXN0LWNoaWxkKSB7XG4gIG1hcmdpbi1ib3R0b206IDEuNXJlbSAhaW1wb3J0YW50O1xufVxuXG5AbWVkaWEgc2NyZWVuIGFuZCAobWluLXdpZHRoOiA3NjlweCksIHByaW50IHtcbiAgLnRpbGU6bm90KC5pcy1jaGlsZCkge1xuICAgIGRpc3BsYXk6IGZsZXg7XG4gIH1cbiAgLnRpbGUuaXMtMSB7XG4gICAgZmxleDogbm9uZTtcbiAgICB3aWR0aDogOC4zMzMzMyU7XG4gIH1cbiAgLnRpbGUuaXMtMiB7XG4gICAgZmxleDogbm9uZTtcbiAgICB3aWR0aDogMTYuNjY2NjclO1xuICB9XG4gIC50aWxlLmlzLTMge1xuICAgIGZsZXg6IG5vbmU7XG4gICAgd2lkdGg6IDI1JTtcbiAgfVxuICAudGlsZS5pcy00IHtcbiAgICBmbGV4OiBub25lO1xuICAgIHdpZHRoOiAzMy4zMzMzMyU7XG4gIH1cbiAgLnRpbGUuaXMtNSB7XG4gICAgZmxleDogbm9uZTtcbiAgICB3aWR0aDogNDEuNjY2NjclO1xuICB9XG4gIC50aWxlLmlzLTYge1xuICAgIGZsZXg6IG5vbmU7XG4gICAgd2lkdGg6IDUwJTtcbiAgfVxuICAudGlsZS5pcy03IHtcbiAgICBmbGV4OiBub25lO1xuICAgIHdpZHRoOiA1OC4zMzMzMyU7XG4gIH1cbiAgLnRpbGUuaXMtOCB7XG4gICAgZmxleDogbm9uZTtcbiAgICB3aWR0aDogNjYuNjY2NjclO1xuICB9XG4gIC50aWxlLmlzLTkge1xuICAgIGZsZXg6IG5vbmU7XG4gICAgd2lkdGg6IDc1JTtcbiAgfVxuICAudGlsZS5pcy0xMCB7XG4gICAgZmxleDogbm9uZTtcbiAgICB3aWR0aDogODMuMzMzMzMlO1xuICB9XG4gIC50aWxlLmlzLTExIHtcbiAgICBmbGV4OiBub25lO1xuICAgIHdpZHRoOiA5MS42NjY2NyU7XG4gIH1cbiAgLnRpbGUuaXMtMTIge1xuICAgIGZsZXg6IG5vbmU7XG4gICAgd2lkdGg6IDEwMCU7XG4gIH1cbn1cblxuLmhlcm8tdmlkZW8ge1xuICBib3R0b206IDA7XG4gIGxlZnQ6IDA7XG4gIHBvc2l0aW9uOiBhYnNvbHV0ZTtcbiAgcmlnaHQ6IDA7XG4gIHRvcDogMDtcbiAgb3ZlcmZsb3c6IGhpZGRlbjtcbn1cblxuLmhlcm8tdmlkZW8gdmlkZW8ge1xuICBsZWZ0OiA1MCU7XG4gIG1pbi1oZWlnaHQ6IDEwMCU7XG4gIG1pbi13aWR0aDogMTAwJTtcbiAgcG9zaXRpb246IGFic29sdXRlO1xuICB0b3A6IDUwJTtcbiAgdHJhbnNmb3JtOiB0cmFuc2xhdGUzZCgtNTAlLCAtNTAlLCAwKTtcbn1cblxuLmhlcm8tdmlkZW8uaXMtdHJhbnNwYXJlbnQge1xuICBvcGFjaXR5OiAwLjM7XG59XG5cbkBtZWRpYSBzY3JlZW4gYW5kIChtYXgtd2lkdGg6IDc2OHB4KSB7XG4gIC5oZXJvLXZpZGVvIHtcbiAgICBkaXNwbGF5OiBub25lO1xuICB9XG59XG5cbi5oZXJvLWJ1dHRvbnMge1xuICBtYXJnaW4tdG9wOiAxLjVyZW07XG59XG5cbkBtZWRpYSBzY3JlZW4gYW5kIChtYXgtd2lkdGg6IDc2OHB4KSB7XG4gIC5oZXJvLWJ1dHRvbnMgLmJ1dHRvbiB7XG4gICAgZGlzcGxheTogZmxleDtcbiAgfVxuICAuaGVyby1idXR0b25zIC5idXR0b246bm90KDpsYXN0LWNoaWxkKSB7XG4gICAgbWFyZ2luLWJvdHRvbTogMC43NXJlbTtcbiAgfVxufVxuXG5AbWVkaWEgc2NyZWVuIGFuZCAobWluLXdpZHRoOiA3NjlweCksIHByaW50IHtcbiAgLmhlcm8tYnV0dG9ucyB7XG4gICAgZGlzcGxheTogZmxleDtcbiAgICBqdXN0aWZ5LWNvbnRlbnQ6IGNlbnRlcjtcbiAgfVxuICAuaGVyby1idXR0b25zIC5idXR0b246bm90KDpsYXN0LWNoaWxkKSB7XG4gICAgbWFyZ2luLXJpZ2h0OiAxLjVyZW07XG4gIH1cbn1cblxuLmhlcm8taGVhZCxcbi5oZXJvLWZvb3Qge1xuICBmbGV4LWdyb3c6IDA7XG4gIGZsZXgtc2hyaW5rOiAwO1xufVxuXG4uaGVyby1ib2R5IHtcbiAgZmxleC1ncm93OiAxO1xuICBmbGV4LXNocmluazogMDtcbiAgcGFkZGluZzogM3JlbSAxLjVyZW07XG59XG5cbi5oZXJvIHtcbiAgYWxpZ24taXRlbXM6IHN0cmV0Y2g7XG4gIGJhY2tncm91bmQtY29sb3I6IHdoaXRlO1xuICBkaXNwbGF5OiBmbGV4O1xuICBmbGV4LWRpcmVjdGlvbjogY29sdW1uO1xuICBqdXN0aWZ5LWNvbnRlbnQ6IHNwYWNlLWJldHdlZW47XG59XG5cbi5oZXJvIC5uYXYge1xuICBiYWNrZ3JvdW5kOiBub25lO1xuICBib3gtc2hhZG93OiAwIDFweCAwIHJnYmEoMjE5LCAyMTksIDIxOSwgMC4zKTtcbn1cblxuLmhlcm8gLnRhYnMgdWwge1xuICBib3JkZXItYm90dG9tOiBub25lO1xufVxuXG4uaGVyby5pcy13aGl0ZSB7XG4gIGJhY2tncm91bmQtY29sb3I6IHdoaXRlO1xuICBjb2xvcjogIzBhMGEwYTtcbn1cblxuLmhlcm8uaXMtd2hpdGUgYTpub3QoLmJ1dHRvbiksXG4uaGVyby5pcy13aGl0ZSBzdHJvbmcge1xuICBjb2xvcjogaW5oZXJpdDtcbn1cblxuLmhlcm8uaXMtd2hpdGUgLnRpdGxlIHtcbiAgY29sb3I6ICMwYTBhMGE7XG59XG5cbi5oZXJvLmlzLXdoaXRlIC5zdWJ0aXRsZSB7XG4gIGNvbG9yOiByZ2JhKDEwLCAxMCwgMTAsIDAuOSk7XG59XG5cbi5oZXJvLmlzLXdoaXRlIC5zdWJ0aXRsZSBhOm5vdCguYnV0dG9uKSxcbi5oZXJvLmlzLXdoaXRlIC5zdWJ0aXRsZSBzdHJvbmcge1xuICBjb2xvcjogIzBhMGEwYTtcbn1cblxuLmhlcm8uaXMtd2hpdGUgLm5hdiB7XG4gIGJveC1zaGFkb3c6IDAgMXB4IDAgcmdiYSgxMCwgMTAsIDEwLCAwLjIpO1xufVxuXG5AbWVkaWEgc2NyZWVuIGFuZCAobWF4LXdpZHRoOiA3NjhweCkge1xuICAuaGVyby5pcy13aGl0ZSAubmF2LW1lbnUge1xuICAgIGJhY2tncm91bmQtY29sb3I6IHdoaXRlO1xuICB9XG59XG5cbi5oZXJvLmlzLXdoaXRlIGEubmF2LWl0ZW0sXG4uaGVyby5pcy13aGl0ZSAubmF2LWl0ZW0gYTpub3QoLmJ1dHRvbikge1xuICBjb2xvcjogcmdiYSgxMCwgMTAsIDEwLCAwLjcpO1xufVxuXG4uaGVyby5pcy13aGl0ZSBhLm5hdi1pdGVtOmhvdmVyLCAuaGVyby5pcy13aGl0ZSBhLm5hdi1pdGVtLmlzLWFjdGl2ZSxcbi5oZXJvLmlzLXdoaXRlIC5uYXYtaXRlbSBhOm5vdCguYnV0dG9uKTpob3Zlcixcbi5oZXJvLmlzLXdoaXRlIC5uYXYtaXRlbSBhOm5vdCguYnV0dG9uKS5pcy1hY3RpdmUge1xuICBjb2xvcjogIzBhMGEwYTtcbn1cblxuLmhlcm8uaXMtd2hpdGUgLnRhYnMgYSB7XG4gIGNvbG9yOiAjMGEwYTBhO1xuICBvcGFjaXR5OiAwLjk7XG59XG5cbi5oZXJvLmlzLXdoaXRlIC50YWJzIGE6aG92ZXIge1xuICBvcGFjaXR5OiAxO1xufVxuXG4uaGVyby5pcy13aGl0ZSAudGFicyBsaS5pcy1hY3RpdmUgYSB7XG4gIG9wYWNpdHk6IDE7XG59XG5cbi5oZXJvLmlzLXdoaXRlIC50YWJzLmlzLWJveGVkIGEsIC5oZXJvLmlzLXdoaXRlIC50YWJzLmlzLXRvZ2dsZSBhIHtcbiAgY29sb3I6ICMwYTBhMGE7XG59XG5cbi5oZXJvLmlzLXdoaXRlIC50YWJzLmlzLWJveGVkIGE6aG92ZXIsIC5oZXJvLmlzLXdoaXRlIC50YWJzLmlzLXRvZ2dsZSBhOmhvdmVyIHtcbiAgYmFja2dyb3VuZC1jb2xvcjogcmdiYSgxMCwgMTAsIDEwLCAwLjEpO1xufVxuXG4uaGVyby5pcy13aGl0ZSAudGFicy5pcy1ib3hlZCBsaS5pcy1hY3RpdmUgYSwgLmhlcm8uaXMtd2hpdGUgLnRhYnMuaXMtYm94ZWQgbGkuaXMtYWN0aXZlIGE6aG92ZXIsIC5oZXJvLmlzLXdoaXRlIC50YWJzLmlzLXRvZ2dsZSBsaS5pcy1hY3RpdmUgYSwgLmhlcm8uaXMtd2hpdGUgLnRhYnMuaXMtdG9nZ2xlIGxpLmlzLWFjdGl2ZSBhOmhvdmVyIHtcbiAgYmFja2dyb3VuZC1jb2xvcjogIzBhMGEwYTtcbiAgYm9yZGVyLWNvbG9yOiAjMGEwYTBhO1xuICBjb2xvcjogd2hpdGU7XG59XG5cbi5oZXJvLmlzLXdoaXRlLmlzLWJvbGQge1xuICBiYWNrZ3JvdW5kLWltYWdlOiBsaW5lYXItZ3JhZGllbnQoMTQxZGVnLCAjZTZlNmU2IDAlLCB3aGl0ZSA3MSUsIHdoaXRlIDEwMCUpO1xufVxuXG5AbWVkaWEgc2NyZWVuIGFuZCAobWF4LXdpZHRoOiA3NjhweCkge1xuICAuaGVyby5pcy13aGl0ZS5pcy1ib2xkIC5uYXYtbWVudSB7XG4gICAgYmFja2dyb3VuZC1pbWFnZTogbGluZWFyLWdyYWRpZW50KDE0MWRlZywgI2U2ZTZlNiAwJSwgd2hpdGUgNzElLCB3aGl0ZSAxMDAlKTtcbiAgfVxufVxuXG5AbWVkaWEgc2NyZWVuIGFuZCAobWF4LXdpZHRoOiA3NjhweCkge1xuICAuaGVyby5pcy13aGl0ZSAubmF2LXRvZ2dsZSBzcGFuIHtcbiAgICBiYWNrZ3JvdW5kLWNvbG9yOiAjMGEwYTBhO1xuICB9XG4gIC5oZXJvLmlzLXdoaXRlIC5uYXYtdG9nZ2xlOmhvdmVyIHtcbiAgICBiYWNrZ3JvdW5kLWNvbG9yOiByZ2JhKDEwLCAxMCwgMTAsIDAuMSk7XG4gIH1cbiAgLmhlcm8uaXMtd2hpdGUgLm5hdi10b2dnbGUuaXMtYWN0aXZlIHNwYW4ge1xuICAgIGJhY2tncm91bmQtY29sb3I6ICMwYTBhMGE7XG4gIH1cbiAgLmhlcm8uaXMtd2hpdGUgLm5hdi1tZW51IC5uYXYtaXRlbSB7XG4gICAgYm9yZGVyLXRvcC1jb2xvcjogcmdiYSgxMCwgMTAsIDEwLCAwLjIpO1xuICB9XG59XG5cbi5oZXJvLmlzLWJsYWNrIHtcbiAgYmFja2dyb3VuZC1jb2xvcjogIzBhMGEwYTtcbiAgY29sb3I6IHdoaXRlO1xufVxuXG4uaGVyby5pcy1ibGFjayBhOm5vdCguYnV0dG9uKSxcbi5oZXJvLmlzLWJsYWNrIHN0cm9uZyB7XG4gIGNvbG9yOiBpbmhlcml0O1xufVxuXG4uaGVyby5pcy1ibGFjayAudGl0bGUge1xuICBjb2xvcjogd2hpdGU7XG59XG5cbi5oZXJvLmlzLWJsYWNrIC5zdWJ0aXRsZSB7XG4gIGNvbG9yOiByZ2JhKDI1NSwgMjU1LCAyNTUsIDAuOSk7XG59XG5cbi5oZXJvLmlzLWJsYWNrIC5zdWJ0aXRsZSBhOm5vdCguYnV0dG9uKSxcbi5oZXJvLmlzLWJsYWNrIC5zdWJ0aXRsZSBzdHJvbmcge1xuICBjb2xvcjogd2hpdGU7XG59XG5cbi5oZXJvLmlzLWJsYWNrIC5uYXYge1xuICBib3gtc2hhZG93OiAwIDFweCAwIHJnYmEoMjU1LCAyNTUsIDI1NSwgMC4yKTtcbn1cblxuQG1lZGlhIHNjcmVlbiBhbmQgKG1heC13aWR0aDogNzY4cHgpIHtcbiAgLmhlcm8uaXMtYmxhY2sgLm5hdi1tZW51IHtcbiAgICBiYWNrZ3JvdW5kLWNvbG9yOiAjMGEwYTBhO1xuICB9XG59XG5cbi5oZXJvLmlzLWJsYWNrIGEubmF2LWl0ZW0sXG4uaGVyby5pcy1ibGFjayAubmF2LWl0ZW0gYTpub3QoLmJ1dHRvbikge1xuICBjb2xvcjogcmdiYSgyNTUsIDI1NSwgMjU1LCAwLjcpO1xufVxuXG4uaGVyby5pcy1ibGFjayBhLm5hdi1pdGVtOmhvdmVyLCAuaGVyby5pcy1ibGFjayBhLm5hdi1pdGVtLmlzLWFjdGl2ZSxcbi5oZXJvLmlzLWJsYWNrIC5uYXYtaXRlbSBhOm5vdCguYnV0dG9uKTpob3Zlcixcbi5oZXJvLmlzLWJsYWNrIC5uYXYtaXRlbSBhOm5vdCguYnV0dG9uKS5pcy1hY3RpdmUge1xuICBjb2xvcjogd2hpdGU7XG59XG5cbi5oZXJvLmlzLWJsYWNrIC50YWJzIGEge1xuICBjb2xvcjogd2hpdGU7XG4gIG9wYWNpdHk6IDAuOTtcbn1cblxuLmhlcm8uaXMtYmxhY2sgLnRhYnMgYTpob3ZlciB7XG4gIG9wYWNpdHk6IDE7XG59XG5cbi5oZXJvLmlzLWJsYWNrIC50YWJzIGxpLmlzLWFjdGl2ZSBhIHtcbiAgb3BhY2l0eTogMTtcbn1cblxuLmhlcm8uaXMtYmxhY2sgLnRhYnMuaXMtYm94ZWQgYSwgLmhlcm8uaXMtYmxhY2sgLnRhYnMuaXMtdG9nZ2xlIGEge1xuICBjb2xvcjogd2hpdGU7XG59XG5cbi5oZXJvLmlzLWJsYWNrIC50YWJzLmlzLWJveGVkIGE6aG92ZXIsIC5oZXJvLmlzLWJsYWNrIC50YWJzLmlzLXRvZ2dsZSBhOmhvdmVyIHtcbiAgYmFja2dyb3VuZC1jb2xvcjogcmdiYSgxMCwgMTAsIDEwLCAwLjEpO1xufVxuXG4uaGVyby5pcy1ibGFjayAudGFicy5pcy1ib3hlZCBsaS5pcy1hY3RpdmUgYSwgLmhlcm8uaXMtYmxhY2sgLnRhYnMuaXMtYm94ZWQgbGkuaXMtYWN0aXZlIGE6aG92ZXIsIC5oZXJvLmlzLWJsYWNrIC50YWJzLmlzLXRvZ2dsZSBsaS5pcy1hY3RpdmUgYSwgLmhlcm8uaXMtYmxhY2sgLnRhYnMuaXMtdG9nZ2xlIGxpLmlzLWFjdGl2ZSBhOmhvdmVyIHtcbiAgYmFja2dyb3VuZC1jb2xvcjogd2hpdGU7XG4gIGJvcmRlci1jb2xvcjogd2hpdGU7XG4gIGNvbG9yOiAjMGEwYTBhO1xufVxuXG4uaGVyby5pcy1ibGFjay5pcy1ib2xkIHtcbiAgYmFja2dyb3VuZC1pbWFnZTogbGluZWFyLWdyYWRpZW50KDE0MWRlZywgYmxhY2sgMCUsICMwYTBhMGEgNzElLCAjMTgxNjE2IDEwMCUpO1xufVxuXG5AbWVkaWEgc2NyZWVuIGFuZCAobWF4LXdpZHRoOiA3NjhweCkge1xuICAuaGVyby5pcy1ibGFjay5pcy1ib2xkIC5uYXYtbWVudSB7XG4gICAgYmFja2dyb3VuZC1pbWFnZTogbGluZWFyLWdyYWRpZW50KDE0MWRlZywgYmxhY2sgMCUsICMwYTBhMGEgNzElLCAjMTgxNjE2IDEwMCUpO1xuICB9XG59XG5cbkBtZWRpYSBzY3JlZW4gYW5kIChtYXgtd2lkdGg6IDc2OHB4KSB7XG4gIC5oZXJvLmlzLWJsYWNrIC5uYXYtdG9nZ2xlIHNwYW4ge1xuICAgIGJhY2tncm91bmQtY29sb3I6IHdoaXRlO1xuICB9XG4gIC5oZXJvLmlzLWJsYWNrIC5uYXYtdG9nZ2xlOmhvdmVyIHtcbiAgICBiYWNrZ3JvdW5kLWNvbG9yOiByZ2JhKDEwLCAxMCwgMTAsIDAuMSk7XG4gIH1cbiAgLmhlcm8uaXMtYmxhY2sgLm5hdi10b2dnbGUuaXMtYWN0aXZlIHNwYW4ge1xuICAgIGJhY2tncm91bmQtY29sb3I6IHdoaXRlO1xuICB9XG4gIC5oZXJvLmlzLWJsYWNrIC5uYXYtbWVudSAubmF2LWl0ZW0ge1xuICAgIGJvcmRlci10b3AtY29sb3I6IHJnYmEoMjU1LCAyNTUsIDI1NSwgMC4yKTtcbiAgfVxufVxuXG4uaGVyby5pcy1saWdodCB7XG4gIGJhY2tncm91bmQtY29sb3I6IHdoaXRlc21va2U7XG4gIGNvbG9yOiAjMzYzNjM2O1xufVxuXG4uaGVyby5pcy1saWdodCBhOm5vdCguYnV0dG9uKSxcbi5oZXJvLmlzLWxpZ2h0IHN0cm9uZyB7XG4gIGNvbG9yOiBpbmhlcml0O1xufVxuXG4uaGVyby5pcy1saWdodCAudGl0bGUge1xuICBjb2xvcjogIzM2MzYzNjtcbn1cblxuLmhlcm8uaXMtbGlnaHQgLnN1YnRpdGxlIHtcbiAgY29sb3I6IHJnYmEoNTQsIDU0LCA1NCwgMC45KTtcbn1cblxuLmhlcm8uaXMtbGlnaHQgLnN1YnRpdGxlIGE6bm90KC5idXR0b24pLFxuLmhlcm8uaXMtbGlnaHQgLnN1YnRpdGxlIHN0cm9uZyB7XG4gIGNvbG9yOiAjMzYzNjM2O1xufVxuXG4uaGVyby5pcy1saWdodCAubmF2IHtcbiAgYm94LXNoYWRvdzogMCAxcHggMCByZ2JhKDU0LCA1NCwgNTQsIDAuMik7XG59XG5cbkBtZWRpYSBzY3JlZW4gYW5kIChtYXgtd2lkdGg6IDc2OHB4KSB7XG4gIC5oZXJvLmlzLWxpZ2h0IC5uYXYtbWVudSB7XG4gICAgYmFja2dyb3VuZC1jb2xvcjogd2hpdGVzbW9rZTtcbiAgfVxufVxuXG4uaGVyby5pcy1saWdodCBhLm5hdi1pdGVtLFxuLmhlcm8uaXMtbGlnaHQgLm5hdi1pdGVtIGE6bm90KC5idXR0b24pIHtcbiAgY29sb3I6IHJnYmEoNTQsIDU0LCA1NCwgMC43KTtcbn1cblxuLmhlcm8uaXMtbGlnaHQgYS5uYXYtaXRlbTpob3ZlciwgLmhlcm8uaXMtbGlnaHQgYS5uYXYtaXRlbS5pcy1hY3RpdmUsXG4uaGVyby5pcy1saWdodCAubmF2LWl0ZW0gYTpub3QoLmJ1dHRvbik6aG92ZXIsXG4uaGVyby5pcy1saWdodCAubmF2LWl0ZW0gYTpub3QoLmJ1dHRvbikuaXMtYWN0aXZlIHtcbiAgY29sb3I6ICMzNjM2MzY7XG59XG5cbi5oZXJvLmlzLWxpZ2h0IC50YWJzIGEge1xuICBjb2xvcjogIzM2MzYzNjtcbiAgb3BhY2l0eTogMC45O1xufVxuXG4uaGVyby5pcy1saWdodCAudGFicyBhOmhvdmVyIHtcbiAgb3BhY2l0eTogMTtcbn1cblxuLmhlcm8uaXMtbGlnaHQgLnRhYnMgbGkuaXMtYWN0aXZlIGEge1xuICBvcGFjaXR5OiAxO1xufVxuXG4uaGVyby5pcy1saWdodCAudGFicy5pcy1ib3hlZCBhLCAuaGVyby5pcy1saWdodCAudGFicy5pcy10b2dnbGUgYSB7XG4gIGNvbG9yOiAjMzYzNjM2O1xufVxuXG4uaGVyby5pcy1saWdodCAudGFicy5pcy1ib3hlZCBhOmhvdmVyLCAuaGVyby5pcy1saWdodCAudGFicy5pcy10b2dnbGUgYTpob3ZlciB7XG4gIGJhY2tncm91bmQtY29sb3I6IHJnYmEoMTAsIDEwLCAxMCwgMC4xKTtcbn1cblxuLmhlcm8uaXMtbGlnaHQgLnRhYnMuaXMtYm94ZWQgbGkuaXMtYWN0aXZlIGEsIC5oZXJvLmlzLWxpZ2h0IC50YWJzLmlzLWJveGVkIGxpLmlzLWFjdGl2ZSBhOmhvdmVyLCAuaGVyby5pcy1saWdodCAudGFicy5pcy10b2dnbGUgbGkuaXMtYWN0aXZlIGEsIC5oZXJvLmlzLWxpZ2h0IC50YWJzLmlzLXRvZ2dsZSBsaS5pcy1hY3RpdmUgYTpob3ZlciB7XG4gIGJhY2tncm91bmQtY29sb3I6ICMzNjM2MzY7XG4gIGJvcmRlci1jb2xvcjogIzM2MzYzNjtcbiAgY29sb3I6IHdoaXRlc21va2U7XG59XG5cbi5oZXJvLmlzLWxpZ2h0LmlzLWJvbGQge1xuICBiYWNrZ3JvdW5kLWltYWdlOiBsaW5lYXItZ3JhZGllbnQoMTQxZGVnLCAjZGZkOGQ5IDAlLCB3aGl0ZXNtb2tlIDcxJSwgd2hpdGUgMTAwJSk7XG59XG5cbkBtZWRpYSBzY3JlZW4gYW5kIChtYXgtd2lkdGg6IDc2OHB4KSB7XG4gIC5oZXJvLmlzLWxpZ2h0LmlzLWJvbGQgLm5hdi1tZW51IHtcbiAgICBiYWNrZ3JvdW5kLWltYWdlOiBsaW5lYXItZ3JhZGllbnQoMTQxZGVnLCAjZGZkOGQ5IDAlLCB3aGl0ZXNtb2tlIDcxJSwgd2hpdGUgMTAwJSk7XG4gIH1cbn1cblxuQG1lZGlhIHNjcmVlbiBhbmQgKG1heC13aWR0aDogNzY4cHgpIHtcbiAgLmhlcm8uaXMtbGlnaHQgLm5hdi10b2dnbGUgc3BhbiB7XG4gICAgYmFja2dyb3VuZC1jb2xvcjogIzM2MzYzNjtcbiAgfVxuICAuaGVyby5pcy1saWdodCAubmF2LXRvZ2dsZTpob3ZlciB7XG4gICAgYmFja2dyb3VuZC1jb2xvcjogcmdiYSgxMCwgMTAsIDEwLCAwLjEpO1xuICB9XG4gIC5oZXJvLmlzLWxpZ2h0IC5uYXYtdG9nZ2xlLmlzLWFjdGl2ZSBzcGFuIHtcbiAgICBiYWNrZ3JvdW5kLWNvbG9yOiAjMzYzNjM2O1xuICB9XG4gIC5oZXJvLmlzLWxpZ2h0IC5uYXYtbWVudSAubmF2LWl0ZW0ge1xuICAgIGJvcmRlci10b3AtY29sb3I6IHJnYmEoNTQsIDU0LCA1NCwgMC4yKTtcbiAgfVxufVxuXG4uaGVyby5pcy1kYXJrIHtcbiAgYmFja2dyb3VuZC1jb2xvcjogIzM2MzYzNjtcbiAgY29sb3I6IHdoaXRlc21va2U7XG59XG5cbi5oZXJvLmlzLWRhcmsgYTpub3QoLmJ1dHRvbiksXG4uaGVyby5pcy1kYXJrIHN0cm9uZyB7XG4gIGNvbG9yOiBpbmhlcml0O1xufVxuXG4uaGVyby5pcy1kYXJrIC50aXRsZSB7XG4gIGNvbG9yOiB3aGl0ZXNtb2tlO1xufVxuXG4uaGVyby5pcy1kYXJrIC5zdWJ0aXRsZSB7XG4gIGNvbG9yOiByZ2JhKDI0NSwgMjQ1LCAyNDUsIDAuOSk7XG59XG5cbi5oZXJvLmlzLWRhcmsgLnN1YnRpdGxlIGE6bm90KC5idXR0b24pLFxuLmhlcm8uaXMtZGFyayAuc3VidGl0bGUgc3Ryb25nIHtcbiAgY29sb3I6IHdoaXRlc21va2U7XG59XG5cbi5oZXJvLmlzLWRhcmsgLm5hdiB7XG4gIGJveC1zaGFkb3c6IDAgMXB4IDAgcmdiYSgyNDUsIDI0NSwgMjQ1LCAwLjIpO1xufVxuXG5AbWVkaWEgc2NyZWVuIGFuZCAobWF4LXdpZHRoOiA3NjhweCkge1xuICAuaGVyby5pcy1kYXJrIC5uYXYtbWVudSB7XG4gICAgYmFja2dyb3VuZC1jb2xvcjogIzM2MzYzNjtcbiAgfVxufVxuXG4uaGVyby5pcy1kYXJrIGEubmF2LWl0ZW0sXG4uaGVyby5pcy1kYXJrIC5uYXYtaXRlbSBhOm5vdCguYnV0dG9uKSB7XG4gIGNvbG9yOiByZ2JhKDI0NSwgMjQ1LCAyNDUsIDAuNyk7XG59XG5cbi5oZXJvLmlzLWRhcmsgYS5uYXYtaXRlbTpob3ZlciwgLmhlcm8uaXMtZGFyayBhLm5hdi1pdGVtLmlzLWFjdGl2ZSxcbi5oZXJvLmlzLWRhcmsgLm5hdi1pdGVtIGE6bm90KC5idXR0b24pOmhvdmVyLFxuLmhlcm8uaXMtZGFyayAubmF2LWl0ZW0gYTpub3QoLmJ1dHRvbikuaXMtYWN0aXZlIHtcbiAgY29sb3I6IHdoaXRlc21va2U7XG59XG5cbi5oZXJvLmlzLWRhcmsgLnRhYnMgYSB7XG4gIGNvbG9yOiB3aGl0ZXNtb2tlO1xuICBvcGFjaXR5OiAwLjk7XG59XG5cbi5oZXJvLmlzLWRhcmsgLnRhYnMgYTpob3ZlciB7XG4gIG9wYWNpdHk6IDE7XG59XG5cbi5oZXJvLmlzLWRhcmsgLnRhYnMgbGkuaXMtYWN0aXZlIGEge1xuICBvcGFjaXR5OiAxO1xufVxuXG4uaGVyby5pcy1kYXJrIC50YWJzLmlzLWJveGVkIGEsIC5oZXJvLmlzLWRhcmsgLnRhYnMuaXMtdG9nZ2xlIGEge1xuICBjb2xvcjogd2hpdGVzbW9rZTtcbn1cblxuLmhlcm8uaXMtZGFyayAudGFicy5pcy1ib3hlZCBhOmhvdmVyLCAuaGVyby5pcy1kYXJrIC50YWJzLmlzLXRvZ2dsZSBhOmhvdmVyIHtcbiAgYmFja2dyb3VuZC1jb2xvcjogcmdiYSgxMCwgMTAsIDEwLCAwLjEpO1xufVxuXG4uaGVyby5pcy1kYXJrIC50YWJzLmlzLWJveGVkIGxpLmlzLWFjdGl2ZSBhLCAuaGVyby5pcy1kYXJrIC50YWJzLmlzLWJveGVkIGxpLmlzLWFjdGl2ZSBhOmhvdmVyLCAuaGVyby5pcy1kYXJrIC50YWJzLmlzLXRvZ2dsZSBsaS5pcy1hY3RpdmUgYSwgLmhlcm8uaXMtZGFyayAudGFicy5pcy10b2dnbGUgbGkuaXMtYWN0aXZlIGE6aG92ZXIge1xuICBiYWNrZ3JvdW5kLWNvbG9yOiB3aGl0ZXNtb2tlO1xuICBib3JkZXItY29sb3I6IHdoaXRlc21va2U7XG4gIGNvbG9yOiAjMzYzNjM2O1xufVxuXG4uaGVyby5pcy1kYXJrLmlzLWJvbGQge1xuICBiYWNrZ3JvdW5kLWltYWdlOiBsaW5lYXItZ3JhZGllbnQoMTQxZGVnLCAjMWYxOTFhIDAlLCAjMzYzNjM2IDcxJSwgIzQ2NDAzZiAxMDAlKTtcbn1cblxuQG1lZGlhIHNjcmVlbiBhbmQgKG1heC13aWR0aDogNzY4cHgpIHtcbiAgLmhlcm8uaXMtZGFyay5pcy1ib2xkIC5uYXYtbWVudSB7XG4gICAgYmFja2dyb3VuZC1pbWFnZTogbGluZWFyLWdyYWRpZW50KDE0MWRlZywgIzFmMTkxYSAwJSwgIzM2MzYzNiA3MSUsICM0NjQwM2YgMTAwJSk7XG4gIH1cbn1cblxuQG1lZGlhIHNjcmVlbiBhbmQgKG1heC13aWR0aDogNzY4cHgpIHtcbiAgLmhlcm8uaXMtZGFyayAubmF2LXRvZ2dsZSBzcGFuIHtcbiAgICBiYWNrZ3JvdW5kLWNvbG9yOiB3aGl0ZXNtb2tlO1xuICB9XG4gIC5oZXJvLmlzLWRhcmsgLm5hdi10b2dnbGU6aG92ZXIge1xuICAgIGJhY2tncm91bmQtY29sb3I6IHJnYmEoMTAsIDEwLCAxMCwgMC4xKTtcbiAgfVxuICAuaGVyby5pcy1kYXJrIC5uYXYtdG9nZ2xlLmlzLWFjdGl2ZSBzcGFuIHtcbiAgICBiYWNrZ3JvdW5kLWNvbG9yOiB3aGl0ZXNtb2tlO1xuICB9XG4gIC5oZXJvLmlzLWRhcmsgLm5hdi1tZW51IC5uYXYtaXRlbSB7XG4gICAgYm9yZGVyLXRvcC1jb2xvcjogcmdiYSgyNDUsIDI0NSwgMjQ1LCAwLjIpO1xuICB9XG59XG5cbi5oZXJvLmlzLXByaW1hcnkge1xuICBiYWNrZ3JvdW5kLWNvbG9yOiAjMDBkMWIyO1xuICBjb2xvcjogI2ZmZjtcbn1cblxuLmhlcm8uaXMtcHJpbWFyeSBhOm5vdCguYnV0dG9uKSxcbi5oZXJvLmlzLXByaW1hcnkgc3Ryb25nIHtcbiAgY29sb3I6IGluaGVyaXQ7XG59XG5cbi5oZXJvLmlzLXByaW1hcnkgLnRpdGxlIHtcbiAgY29sb3I6ICNmZmY7XG59XG5cbi5oZXJvLmlzLXByaW1hcnkgLnN1YnRpdGxlIHtcbiAgY29sb3I6IHJnYmEoMjU1LCAyNTUsIDI1NSwgMC45KTtcbn1cblxuLmhlcm8uaXMtcHJpbWFyeSAuc3VidGl0bGUgYTpub3QoLmJ1dHRvbiksXG4uaGVyby5pcy1wcmltYXJ5IC5zdWJ0aXRsZSBzdHJvbmcge1xuICBjb2xvcjogI2ZmZjtcbn1cblxuLmhlcm8uaXMtcHJpbWFyeSAubmF2IHtcbiAgYm94LXNoYWRvdzogMCAxcHggMCByZ2JhKDI1NSwgMjU1LCAyNTUsIDAuMik7XG59XG5cbkBtZWRpYSBzY3JlZW4gYW5kIChtYXgtd2lkdGg6IDc2OHB4KSB7XG4gIC5oZXJvLmlzLXByaW1hcnkgLm5hdi1tZW51IHtcbiAgICBiYWNrZ3JvdW5kLWNvbG9yOiAjMDBkMWIyO1xuICB9XG59XG5cbi5oZXJvLmlzLXByaW1hcnkgYS5uYXYtaXRlbSxcbi5oZXJvLmlzLXByaW1hcnkgLm5hdi1pdGVtIGE6bm90KC5idXR0b24pIHtcbiAgY29sb3I6IHJnYmEoMjU1LCAyNTUsIDI1NSwgMC43KTtcbn1cblxuLmhlcm8uaXMtcHJpbWFyeSBhLm5hdi1pdGVtOmhvdmVyLCAuaGVyby5pcy1wcmltYXJ5IGEubmF2LWl0ZW0uaXMtYWN0aXZlLFxuLmhlcm8uaXMtcHJpbWFyeSAubmF2LWl0ZW0gYTpub3QoLmJ1dHRvbik6aG92ZXIsXG4uaGVyby5pcy1wcmltYXJ5IC5uYXYtaXRlbSBhOm5vdCguYnV0dG9uKS5pcy1hY3RpdmUge1xuICBjb2xvcjogI2ZmZjtcbn1cblxuLmhlcm8uaXMtcHJpbWFyeSAudGFicyBhIHtcbiAgY29sb3I6ICNmZmY7XG4gIG9wYWNpdHk6IDAuOTtcbn1cblxuLmhlcm8uaXMtcHJpbWFyeSAudGFicyBhOmhvdmVyIHtcbiAgb3BhY2l0eTogMTtcbn1cblxuLmhlcm8uaXMtcHJpbWFyeSAudGFicyBsaS5pcy1hY3RpdmUgYSB7XG4gIG9wYWNpdHk6IDE7XG59XG5cbi5oZXJvLmlzLXByaW1hcnkgLnRhYnMuaXMtYm94ZWQgYSwgLmhlcm8uaXMtcHJpbWFyeSAudGFicy5pcy10b2dnbGUgYSB7XG4gIGNvbG9yOiAjZmZmO1xufVxuXG4uaGVyby5pcy1wcmltYXJ5IC50YWJzLmlzLWJveGVkIGE6aG92ZXIsIC5oZXJvLmlzLXByaW1hcnkgLnRhYnMuaXMtdG9nZ2xlIGE6aG92ZXIge1xuICBiYWNrZ3JvdW5kLWNvbG9yOiByZ2JhKDEwLCAxMCwgMTAsIDAuMSk7XG59XG5cbi5oZXJvLmlzLXByaW1hcnkgLnRhYnMuaXMtYm94ZWQgbGkuaXMtYWN0aXZlIGEsIC5oZXJvLmlzLXByaW1hcnkgLnRhYnMuaXMtYm94ZWQgbGkuaXMtYWN0aXZlIGE6aG92ZXIsIC5oZXJvLmlzLXByaW1hcnkgLnRhYnMuaXMtdG9nZ2xlIGxpLmlzLWFjdGl2ZSBhLCAuaGVyby5pcy1wcmltYXJ5IC50YWJzLmlzLXRvZ2dsZSBsaS5pcy1hY3RpdmUgYTpob3ZlciB7XG4gIGJhY2tncm91bmQtY29sb3I6ICNmZmY7XG4gIGJvcmRlci1jb2xvcjogI2ZmZjtcbiAgY29sb3I6ICMwMGQxYjI7XG59XG5cbi5oZXJvLmlzLXByaW1hcnkuaXMtYm9sZCB7XG4gIGJhY2tncm91bmQtaW1hZ2U6IGxpbmVhci1ncmFkaWVudCgxNDFkZWcsICMwMDllNmMgMCUsICMwMGQxYjIgNzElLCAjMDBlN2ViIDEwMCUpO1xufVxuXG5AbWVkaWEgc2NyZWVuIGFuZCAobWF4LXdpZHRoOiA3NjhweCkge1xuICAuaGVyby5pcy1wcmltYXJ5LmlzLWJvbGQgLm5hdi1tZW51IHtcbiAgICBiYWNrZ3JvdW5kLWltYWdlOiBsaW5lYXItZ3JhZGllbnQoMTQxZGVnLCAjMDA5ZTZjIDAlLCAjMDBkMWIyIDcxJSwgIzAwZTdlYiAxMDAlKTtcbiAgfVxufVxuXG5AbWVkaWEgc2NyZWVuIGFuZCAobWF4LXdpZHRoOiA3NjhweCkge1xuICAuaGVyby5pcy1wcmltYXJ5IC5uYXYtdG9nZ2xlIHNwYW4ge1xuICAgIGJhY2tncm91bmQtY29sb3I6ICNmZmY7XG4gIH1cbiAgLmhlcm8uaXMtcHJpbWFyeSAubmF2LXRvZ2dsZTpob3ZlciB7XG4gICAgYmFja2dyb3VuZC1jb2xvcjogcmdiYSgxMCwgMTAsIDEwLCAwLjEpO1xuICB9XG4gIC5oZXJvLmlzLXByaW1hcnkgLm5hdi10b2dnbGUuaXMtYWN0aXZlIHNwYW4ge1xuICAgIGJhY2tncm91bmQtY29sb3I6ICNmZmY7XG4gIH1cbiAgLmhlcm8uaXMtcHJpbWFyeSAubmF2LW1lbnUgLm5hdi1pdGVtIHtcbiAgICBib3JkZXItdG9wLWNvbG9yOiByZ2JhKDI1NSwgMjU1LCAyNTUsIDAuMik7XG4gIH1cbn1cblxuLmhlcm8uaXMtaW5mbyB7XG4gIGJhY2tncm91bmQtY29sb3I6ICMzMjczZGM7XG4gIGNvbG9yOiAjZmZmO1xufVxuXG4uaGVyby5pcy1pbmZvIGE6bm90KC5idXR0b24pLFxuLmhlcm8uaXMtaW5mbyBzdHJvbmcge1xuICBjb2xvcjogaW5oZXJpdDtcbn1cblxuLmhlcm8uaXMtaW5mbyAudGl0bGUge1xuICBjb2xvcjogI2ZmZjtcbn1cblxuLmhlcm8uaXMtaW5mbyAuc3VidGl0bGUge1xuICBjb2xvcjogcmdiYSgyNTUsIDI1NSwgMjU1LCAwLjkpO1xufVxuXG4uaGVyby5pcy1pbmZvIC5zdWJ0aXRsZSBhOm5vdCguYnV0dG9uKSxcbi5oZXJvLmlzLWluZm8gLnN1YnRpdGxlIHN0cm9uZyB7XG4gIGNvbG9yOiAjZmZmO1xufVxuXG4uaGVyby5pcy1pbmZvIC5uYXYge1xuICBib3gtc2hhZG93OiAwIDFweCAwIHJnYmEoMjU1LCAyNTUsIDI1NSwgMC4yKTtcbn1cblxuQG1lZGlhIHNjcmVlbiBhbmQgKG1heC13aWR0aDogNzY4cHgpIHtcbiAgLmhlcm8uaXMtaW5mbyAubmF2LW1lbnUge1xuICAgIGJhY2tncm91bmQtY29sb3I6ICMzMjczZGM7XG4gIH1cbn1cblxuLmhlcm8uaXMtaW5mbyBhLm5hdi1pdGVtLFxuLmhlcm8uaXMtaW5mbyAubmF2LWl0ZW0gYTpub3QoLmJ1dHRvbikge1xuICBjb2xvcjogcmdiYSgyNTUsIDI1NSwgMjU1LCAwLjcpO1xufVxuXG4uaGVyby5pcy1pbmZvIGEubmF2LWl0ZW06aG92ZXIsIC5oZXJvLmlzLWluZm8gYS5uYXYtaXRlbS5pcy1hY3RpdmUsXG4uaGVyby5pcy1pbmZvIC5uYXYtaXRlbSBhOm5vdCguYnV0dG9uKTpob3Zlcixcbi5oZXJvLmlzLWluZm8gLm5hdi1pdGVtIGE6bm90KC5idXR0b24pLmlzLWFjdGl2ZSB7XG4gIGNvbG9yOiAjZmZmO1xufVxuXG4uaGVyby5pcy1pbmZvIC50YWJzIGEge1xuICBjb2xvcjogI2ZmZjtcbiAgb3BhY2l0eTogMC45O1xufVxuXG4uaGVyby5pcy1pbmZvIC50YWJzIGE6aG92ZXIge1xuICBvcGFjaXR5OiAxO1xufVxuXG4uaGVyby5pcy1pbmZvIC50YWJzIGxpLmlzLWFjdGl2ZSBhIHtcbiAgb3BhY2l0eTogMTtcbn1cblxuLmhlcm8uaXMtaW5mbyAudGFicy5pcy1ib3hlZCBhLCAuaGVyby5pcy1pbmZvIC50YWJzLmlzLXRvZ2dsZSBhIHtcbiAgY29sb3I6ICNmZmY7XG59XG5cbi5oZXJvLmlzLWluZm8gLnRhYnMuaXMtYm94ZWQgYTpob3ZlciwgLmhlcm8uaXMtaW5mbyAudGFicy5pcy10b2dnbGUgYTpob3ZlciB7XG4gIGJhY2tncm91bmQtY29sb3I6IHJnYmEoMTAsIDEwLCAxMCwgMC4xKTtcbn1cblxuLmhlcm8uaXMtaW5mbyAudGFicy5pcy1ib3hlZCBsaS5pcy1hY3RpdmUgYSwgLmhlcm8uaXMtaW5mbyAudGFicy5pcy1ib3hlZCBsaS5pcy1hY3RpdmUgYTpob3ZlciwgLmhlcm8uaXMtaW5mbyAudGFicy5pcy10b2dnbGUgbGkuaXMtYWN0aXZlIGEsIC5oZXJvLmlzLWluZm8gLnRhYnMuaXMtdG9nZ2xlIGxpLmlzLWFjdGl2ZSBhOmhvdmVyIHtcbiAgYmFja2dyb3VuZC1jb2xvcjogI2ZmZjtcbiAgYm9yZGVyLWNvbG9yOiAjZmZmO1xuICBjb2xvcjogIzMyNzNkYztcbn1cblxuLmhlcm8uaXMtaW5mby5pcy1ib2xkIHtcbiAgYmFja2dyb3VuZC1pbWFnZTogbGluZWFyLWdyYWRpZW50KDE0MWRlZywgIzE1NzdjNiAwJSwgIzMyNzNkYyA3MSUsICM0MzY2ZTUgMTAwJSk7XG59XG5cbkBtZWRpYSBzY3JlZW4gYW5kIChtYXgtd2lkdGg6IDc2OHB4KSB7XG4gIC5oZXJvLmlzLWluZm8uaXMtYm9sZCAubmF2LW1lbnUge1xuICAgIGJhY2tncm91bmQtaW1hZ2U6IGxpbmVhci1ncmFkaWVudCgxNDFkZWcsICMxNTc3YzYgMCUsICMzMjczZGMgNzElLCAjNDM2NmU1IDEwMCUpO1xuICB9XG59XG5cbkBtZWRpYSBzY3JlZW4gYW5kIChtYXgtd2lkdGg6IDc2OHB4KSB7XG4gIC5oZXJvLmlzLWluZm8gLm5hdi10b2dnbGUgc3BhbiB7XG4gICAgYmFja2dyb3VuZC1jb2xvcjogI2ZmZjtcbiAgfVxuICAuaGVyby5pcy1pbmZvIC5uYXYtdG9nZ2xlOmhvdmVyIHtcbiAgICBiYWNrZ3JvdW5kLWNvbG9yOiByZ2JhKDEwLCAxMCwgMTAsIDAuMSk7XG4gIH1cbiAgLmhlcm8uaXMtaW5mbyAubmF2LXRvZ2dsZS5pcy1hY3RpdmUgc3BhbiB7XG4gICAgYmFja2dyb3VuZC1jb2xvcjogI2ZmZjtcbiAgfVxuICAuaGVyby5pcy1pbmZvIC5uYXYtbWVudSAubmF2LWl0ZW0ge1xuICAgIGJvcmRlci10b3AtY29sb3I6IHJnYmEoMjU1LCAyNTUsIDI1NSwgMC4yKTtcbiAgfVxufVxuXG4uaGVyby5pcy1zdWNjZXNzIHtcbiAgYmFja2dyb3VuZC1jb2xvcjogIzIzZDE2MDtcbiAgY29sb3I6ICNmZmY7XG59XG5cbi5oZXJvLmlzLXN1Y2Nlc3MgYTpub3QoLmJ1dHRvbiksXG4uaGVyby5pcy1zdWNjZXNzIHN0cm9uZyB7XG4gIGNvbG9yOiBpbmhlcml0O1xufVxuXG4uaGVyby5pcy1zdWNjZXNzIC50aXRsZSB7XG4gIGNvbG9yOiAjZmZmO1xufVxuXG4uaGVyby5pcy1zdWNjZXNzIC5zdWJ0aXRsZSB7XG4gIGNvbG9yOiByZ2JhKDI1NSwgMjU1LCAyNTUsIDAuOSk7XG59XG5cbi5oZXJvLmlzLXN1Y2Nlc3MgLnN1YnRpdGxlIGE6bm90KC5idXR0b24pLFxuLmhlcm8uaXMtc3VjY2VzcyAuc3VidGl0bGUgc3Ryb25nIHtcbiAgY29sb3I6ICNmZmY7XG59XG5cbi5oZXJvLmlzLXN1Y2Nlc3MgLm5hdiB7XG4gIGJveC1zaGFkb3c6IDAgMXB4IDAgcmdiYSgyNTUsIDI1NSwgMjU1LCAwLjIpO1xufVxuXG5AbWVkaWEgc2NyZWVuIGFuZCAobWF4LXdpZHRoOiA3NjhweCkge1xuICAuaGVyby5pcy1zdWNjZXNzIC5uYXYtbWVudSB7XG4gICAgYmFja2dyb3VuZC1jb2xvcjogIzIzZDE2MDtcbiAgfVxufVxuXG4uaGVyby5pcy1zdWNjZXNzIGEubmF2LWl0ZW0sXG4uaGVyby5pcy1zdWNjZXNzIC5uYXYtaXRlbSBhOm5vdCguYnV0dG9uKSB7XG4gIGNvbG9yOiByZ2JhKDI1NSwgMjU1LCAyNTUsIDAuNyk7XG59XG5cbi5oZXJvLmlzLXN1Y2Nlc3MgYS5uYXYtaXRlbTpob3ZlciwgLmhlcm8uaXMtc3VjY2VzcyBhLm5hdi1pdGVtLmlzLWFjdGl2ZSxcbi5oZXJvLmlzLXN1Y2Nlc3MgLm5hdi1pdGVtIGE6bm90KC5idXR0b24pOmhvdmVyLFxuLmhlcm8uaXMtc3VjY2VzcyAubmF2LWl0ZW0gYTpub3QoLmJ1dHRvbikuaXMtYWN0aXZlIHtcbiAgY29sb3I6ICNmZmY7XG59XG5cbi5oZXJvLmlzLXN1Y2Nlc3MgLnRhYnMgYSB7XG4gIGNvbG9yOiAjZmZmO1xuICBvcGFjaXR5OiAwLjk7XG59XG5cbi5oZXJvLmlzLXN1Y2Nlc3MgLnRhYnMgYTpob3ZlciB7XG4gIG9wYWNpdHk6IDE7XG59XG5cbi5oZXJvLmlzLXN1Y2Nlc3MgLnRhYnMgbGkuaXMtYWN0aXZlIGEge1xuICBvcGFjaXR5OiAxO1xufVxuXG4uaGVyby5pcy1zdWNjZXNzIC50YWJzLmlzLWJveGVkIGEsIC5oZXJvLmlzLXN1Y2Nlc3MgLnRhYnMuaXMtdG9nZ2xlIGEge1xuICBjb2xvcjogI2ZmZjtcbn1cblxuLmhlcm8uaXMtc3VjY2VzcyAudGFicy5pcy1ib3hlZCBhOmhvdmVyLCAuaGVyby5pcy1zdWNjZXNzIC50YWJzLmlzLXRvZ2dsZSBhOmhvdmVyIHtcbiAgYmFja2dyb3VuZC1jb2xvcjogcmdiYSgxMCwgMTAsIDEwLCAwLjEpO1xufVxuXG4uaGVyby5pcy1zdWNjZXNzIC50YWJzLmlzLWJveGVkIGxpLmlzLWFjdGl2ZSBhLCAuaGVyby5pcy1zdWNjZXNzIC50YWJzLmlzLWJveGVkIGxpLmlzLWFjdGl2ZSBhOmhvdmVyLCAuaGVyby5pcy1zdWNjZXNzIC50YWJzLmlzLXRvZ2dsZSBsaS5pcy1hY3RpdmUgYSwgLmhlcm8uaXMtc3VjY2VzcyAudGFicy5pcy10b2dnbGUgbGkuaXMtYWN0aXZlIGE6aG92ZXIge1xuICBiYWNrZ3JvdW5kLWNvbG9yOiAjZmZmO1xuICBib3JkZXItY29sb3I6ICNmZmY7XG4gIGNvbG9yOiAjMjNkMTYwO1xufVxuXG4uaGVyby5pcy1zdWNjZXNzLmlzLWJvbGQge1xuICBiYWNrZ3JvdW5kLWltYWdlOiBsaW5lYXItZ3JhZGllbnQoMTQxZGVnLCAjMTJhZjJmIDAlLCAjMjNkMTYwIDcxJSwgIzJjZTI4YSAxMDAlKTtcbn1cblxuQG1lZGlhIHNjcmVlbiBhbmQgKG1heC13aWR0aDogNzY4cHgpIHtcbiAgLmhlcm8uaXMtc3VjY2Vzcy5pcy1ib2xkIC5uYXYtbWVudSB7XG4gICAgYmFja2dyb3VuZC1pbWFnZTogbGluZWFyLWdyYWRpZW50KDE0MWRlZywgIzEyYWYyZiAwJSwgIzIzZDE2MCA3MSUsICMyY2UyOGEgMTAwJSk7XG4gIH1cbn1cblxuQG1lZGlhIHNjcmVlbiBhbmQgKG1heC13aWR0aDogNzY4cHgpIHtcbiAgLmhlcm8uaXMtc3VjY2VzcyAubmF2LXRvZ2dsZSBzcGFuIHtcbiAgICBiYWNrZ3JvdW5kLWNvbG9yOiAjZmZmO1xuICB9XG4gIC5oZXJvLmlzLXN1Y2Nlc3MgLm5hdi10b2dnbGU6aG92ZXIge1xuICAgIGJhY2tncm91bmQtY29sb3I6IHJnYmEoMTAsIDEwLCAxMCwgMC4xKTtcbiAgfVxuICAuaGVyby5pcy1zdWNjZXNzIC5uYXYtdG9nZ2xlLmlzLWFjdGl2ZSBzcGFuIHtcbiAgICBiYWNrZ3JvdW5kLWNvbG9yOiAjZmZmO1xuICB9XG4gIC5oZXJvLmlzLXN1Y2Nlc3MgLm5hdi1tZW51IC5uYXYtaXRlbSB7XG4gICAgYm9yZGVyLXRvcC1jb2xvcjogcmdiYSgyNTUsIDI1NSwgMjU1LCAwLjIpO1xuICB9XG59XG5cbi5oZXJvLmlzLXdhcm5pbmcge1xuICBiYWNrZ3JvdW5kLWNvbG9yOiAjZmZkZDU3O1xuICBjb2xvcjogcmdiYSgwLCAwLCAwLCAwLjcpO1xufVxuXG4uaGVyby5pcy13YXJuaW5nIGE6bm90KC5idXR0b24pLFxuLmhlcm8uaXMtd2FybmluZyBzdHJvbmcge1xuICBjb2xvcjogaW5oZXJpdDtcbn1cblxuLmhlcm8uaXMtd2FybmluZyAudGl0bGUge1xuICBjb2xvcjogcmdiYSgwLCAwLCAwLCAwLjcpO1xufVxuXG4uaGVyby5pcy13YXJuaW5nIC5zdWJ0aXRsZSB7XG4gIGNvbG9yOiByZ2JhKDAsIDAsIDAsIDAuOSk7XG59XG5cbi5oZXJvLmlzLXdhcm5pbmcgLnN1YnRpdGxlIGE6bm90KC5idXR0b24pLFxuLmhlcm8uaXMtd2FybmluZyAuc3VidGl0bGUgc3Ryb25nIHtcbiAgY29sb3I6IHJnYmEoMCwgMCwgMCwgMC43KTtcbn1cblxuLmhlcm8uaXMtd2FybmluZyAubmF2IHtcbiAgYm94LXNoYWRvdzogMCAxcHggMCByZ2JhKDAsIDAsIDAsIDAuMik7XG59XG5cbkBtZWRpYSBzY3JlZW4gYW5kIChtYXgtd2lkdGg6IDc2OHB4KSB7XG4gIC5oZXJvLmlzLXdhcm5pbmcgLm5hdi1tZW51IHtcbiAgICBiYWNrZ3JvdW5kLWNvbG9yOiAjZmZkZDU3O1xuICB9XG59XG5cbi5oZXJvLmlzLXdhcm5pbmcgYS5uYXYtaXRlbSxcbi5oZXJvLmlzLXdhcm5pbmcgLm5hdi1pdGVtIGE6bm90KC5idXR0b24pIHtcbiAgY29sb3I6IHJnYmEoMCwgMCwgMCwgMC43KTtcbn1cblxuLmhlcm8uaXMtd2FybmluZyBhLm5hdi1pdGVtOmhvdmVyLCAuaGVyby5pcy13YXJuaW5nIGEubmF2LWl0ZW0uaXMtYWN0aXZlLFxuLmhlcm8uaXMtd2FybmluZyAubmF2LWl0ZW0gYTpub3QoLmJ1dHRvbik6aG92ZXIsXG4uaGVyby5pcy13YXJuaW5nIC5uYXYtaXRlbSBhOm5vdCguYnV0dG9uKS5pcy1hY3RpdmUge1xuICBjb2xvcjogcmdiYSgwLCAwLCAwLCAwLjcpO1xufVxuXG4uaGVyby5pcy13YXJuaW5nIC50YWJzIGEge1xuICBjb2xvcjogcmdiYSgwLCAwLCAwLCAwLjcpO1xuICBvcGFjaXR5OiAwLjk7XG59XG5cbi5oZXJvLmlzLXdhcm5pbmcgLnRhYnMgYTpob3ZlciB7XG4gIG9wYWNpdHk6IDE7XG59XG5cbi5oZXJvLmlzLXdhcm5pbmcgLnRhYnMgbGkuaXMtYWN0aXZlIGEge1xuICBvcGFjaXR5OiAxO1xufVxuXG4uaGVyby5pcy13YXJuaW5nIC50YWJzLmlzLWJveGVkIGEsIC5oZXJvLmlzLXdhcm5pbmcgLnRhYnMuaXMtdG9nZ2xlIGEge1xuICBjb2xvcjogcmdiYSgwLCAwLCAwLCAwLjcpO1xufVxuXG4uaGVyby5pcy13YXJuaW5nIC50YWJzLmlzLWJveGVkIGE6aG92ZXIsIC5oZXJvLmlzLXdhcm5pbmcgLnRhYnMuaXMtdG9nZ2xlIGE6aG92ZXIge1xuICBiYWNrZ3JvdW5kLWNvbG9yOiByZ2JhKDEwLCAxMCwgMTAsIDAuMSk7XG59XG5cbi5oZXJvLmlzLXdhcm5pbmcgLnRhYnMuaXMtYm94ZWQgbGkuaXMtYWN0aXZlIGEsIC5oZXJvLmlzLXdhcm5pbmcgLnRhYnMuaXMtYm94ZWQgbGkuaXMtYWN0aXZlIGE6aG92ZXIsIC5oZXJvLmlzLXdhcm5pbmcgLnRhYnMuaXMtdG9nZ2xlIGxpLmlzLWFjdGl2ZSBhLCAuaGVyby5pcy13YXJuaW5nIC50YWJzLmlzLXRvZ2dsZSBsaS5pcy1hY3RpdmUgYTpob3ZlciB7XG4gIGJhY2tncm91bmQtY29sb3I6IHJnYmEoMCwgMCwgMCwgMC43KTtcbiAgYm9yZGVyLWNvbG9yOiByZ2JhKDAsIDAsIDAsIDAuNyk7XG4gIGNvbG9yOiAjZmZkZDU3O1xufVxuXG4uaGVyby5pcy13YXJuaW5nLmlzLWJvbGQge1xuICBiYWNrZ3JvdW5kLWltYWdlOiBsaW5lYXItZ3JhZGllbnQoMTQxZGVnLCAjZmZhZjI0IDAlLCAjZmZkZDU3IDcxJSwgI2ZmZmE3MCAxMDAlKTtcbn1cblxuQG1lZGlhIHNjcmVlbiBhbmQgKG1heC13aWR0aDogNzY4cHgpIHtcbiAgLmhlcm8uaXMtd2FybmluZy5pcy1ib2xkIC5uYXYtbWVudSB7XG4gICAgYmFja2dyb3VuZC1pbWFnZTogbGluZWFyLWdyYWRpZW50KDE0MWRlZywgI2ZmYWYyNCAwJSwgI2ZmZGQ1NyA3MSUsICNmZmZhNzAgMTAwJSk7XG4gIH1cbn1cblxuQG1lZGlhIHNjcmVlbiBhbmQgKG1heC13aWR0aDogNzY4cHgpIHtcbiAgLmhlcm8uaXMtd2FybmluZyAubmF2LXRvZ2dsZSBzcGFuIHtcbiAgICBiYWNrZ3JvdW5kLWNvbG9yOiByZ2JhKDAsIDAsIDAsIDAuNyk7XG4gIH1cbiAgLmhlcm8uaXMtd2FybmluZyAubmF2LXRvZ2dsZTpob3ZlciB7XG4gICAgYmFja2dyb3VuZC1jb2xvcjogcmdiYSgxMCwgMTAsIDEwLCAwLjEpO1xuICB9XG4gIC5oZXJvLmlzLXdhcm5pbmcgLm5hdi10b2dnbGUuaXMtYWN0aXZlIHNwYW4ge1xuICAgIGJhY2tncm91bmQtY29sb3I6IHJnYmEoMCwgMCwgMCwgMC43KTtcbiAgfVxuICAuaGVyby5pcy13YXJuaW5nIC5uYXYtbWVudSAubmF2LWl0ZW0ge1xuICAgIGJvcmRlci10b3AtY29sb3I6IHJnYmEoMCwgMCwgMCwgMC4yKTtcbiAgfVxufVxuXG4uaGVyby5pcy1kYW5nZXIge1xuICBiYWNrZ3JvdW5kLWNvbG9yOiAjZmYzODYwO1xuICBjb2xvcjogI2ZmZjtcbn1cblxuLmhlcm8uaXMtZGFuZ2VyIGE6bm90KC5idXR0b24pLFxuLmhlcm8uaXMtZGFuZ2VyIHN0cm9uZyB7XG4gIGNvbG9yOiBpbmhlcml0O1xufVxuXG4uaGVyby5pcy1kYW5nZXIgLnRpdGxlIHtcbiAgY29sb3I6ICNmZmY7XG59XG5cbi5oZXJvLmlzLWRhbmdlciAuc3VidGl0bGUge1xuICBjb2xvcjogcmdiYSgyNTUsIDI1NSwgMjU1LCAwLjkpO1xufVxuXG4uaGVyby5pcy1kYW5nZXIgLnN1YnRpdGxlIGE6bm90KC5idXR0b24pLFxuLmhlcm8uaXMtZGFuZ2VyIC5zdWJ0aXRsZSBzdHJvbmcge1xuICBjb2xvcjogI2ZmZjtcbn1cblxuLmhlcm8uaXMtZGFuZ2VyIC5uYXYge1xuICBib3gtc2hhZG93OiAwIDFweCAwIHJnYmEoMjU1LCAyNTUsIDI1NSwgMC4yKTtcbn1cblxuQG1lZGlhIHNjcmVlbiBhbmQgKG1heC13aWR0aDogNzY4cHgpIHtcbiAgLmhlcm8uaXMtZGFuZ2VyIC5uYXYtbWVudSB7XG4gICAgYmFja2dyb3VuZC1jb2xvcjogI2ZmMzg2MDtcbiAgfVxufVxuXG4uaGVyby5pcy1kYW5nZXIgYS5uYXYtaXRlbSxcbi5oZXJvLmlzLWRhbmdlciAubmF2LWl0ZW0gYTpub3QoLmJ1dHRvbikge1xuICBjb2xvcjogcmdiYSgyNTUsIDI1NSwgMjU1LCAwLjcpO1xufVxuXG4uaGVyby5pcy1kYW5nZXIgYS5uYXYtaXRlbTpob3ZlciwgLmhlcm8uaXMtZGFuZ2VyIGEubmF2LWl0ZW0uaXMtYWN0aXZlLFxuLmhlcm8uaXMtZGFuZ2VyIC5uYXYtaXRlbSBhOm5vdCguYnV0dG9uKTpob3Zlcixcbi5oZXJvLmlzLWRhbmdlciAubmF2LWl0ZW0gYTpub3QoLmJ1dHRvbikuaXMtYWN0aXZlIHtcbiAgY29sb3I6ICNmZmY7XG59XG5cbi5oZXJvLmlzLWRhbmdlciAudGFicyBhIHtcbiAgY29sb3I6ICNmZmY7XG4gIG9wYWNpdHk6IDAuOTtcbn1cblxuLmhlcm8uaXMtZGFuZ2VyIC50YWJzIGE6aG92ZXIge1xuICBvcGFjaXR5OiAxO1xufVxuXG4uaGVyby5pcy1kYW5nZXIgLnRhYnMgbGkuaXMtYWN0aXZlIGEge1xuICBvcGFjaXR5OiAxO1xufVxuXG4uaGVyby5pcy1kYW5nZXIgLnRhYnMuaXMtYm94ZWQgYSwgLmhlcm8uaXMtZGFuZ2VyIC50YWJzLmlzLXRvZ2dsZSBhIHtcbiAgY29sb3I6ICNmZmY7XG59XG5cbi5oZXJvLmlzLWRhbmdlciAudGFicy5pcy1ib3hlZCBhOmhvdmVyLCAuaGVyby5pcy1kYW5nZXIgLnRhYnMuaXMtdG9nZ2xlIGE6aG92ZXIge1xuICBiYWNrZ3JvdW5kLWNvbG9yOiByZ2JhKDEwLCAxMCwgMTAsIDAuMSk7XG59XG5cbi5oZXJvLmlzLWRhbmdlciAudGFicy5pcy1ib3hlZCBsaS5pcy1hY3RpdmUgYSwgLmhlcm8uaXMtZGFuZ2VyIC50YWJzLmlzLWJveGVkIGxpLmlzLWFjdGl2ZSBhOmhvdmVyLCAuaGVyby5pcy1kYW5nZXIgLnRhYnMuaXMtdG9nZ2xlIGxpLmlzLWFjdGl2ZSBhLCAuaGVyby5pcy1kYW5nZXIgLnRhYnMuaXMtdG9nZ2xlIGxpLmlzLWFjdGl2ZSBhOmhvdmVyIHtcbiAgYmFja2dyb3VuZC1jb2xvcjogI2ZmZjtcbiAgYm9yZGVyLWNvbG9yOiAjZmZmO1xuICBjb2xvcjogI2ZmMzg2MDtcbn1cblxuLmhlcm8uaXMtZGFuZ2VyLmlzLWJvbGQge1xuICBiYWNrZ3JvdW5kLWltYWdlOiBsaW5lYXItZ3JhZGllbnQoMTQxZGVnLCAjZmYwNTYxIDAlLCAjZmYzODYwIDcxJSwgI2ZmNTI1NyAxMDAlKTtcbn1cblxuQG1lZGlhIHNjcmVlbiBhbmQgKG1heC13aWR0aDogNzY4cHgpIHtcbiAgLmhlcm8uaXMtZGFuZ2VyLmlzLWJvbGQgLm5hdi1tZW51IHtcbiAgICBiYWNrZ3JvdW5kLWltYWdlOiBsaW5lYXItZ3JhZGllbnQoMTQxZGVnLCAjZmYwNTYxIDAlLCAjZmYzODYwIDcxJSwgI2ZmNTI1NyAxMDAlKTtcbiAgfVxufVxuXG5AbWVkaWEgc2NyZWVuIGFuZCAobWF4LXdpZHRoOiA3NjhweCkge1xuICAuaGVyby5pcy1kYW5nZXIgLm5hdi10b2dnbGUgc3BhbiB7XG4gICAgYmFja2dyb3VuZC1jb2xvcjogI2ZmZjtcbiAgfVxuICAuaGVyby5pcy1kYW5nZXIgLm5hdi10b2dnbGU6aG92ZXIge1xuICAgIGJhY2tncm91bmQtY29sb3I6IHJnYmEoMTAsIDEwLCAxMCwgMC4xKTtcbiAgfVxuICAuaGVyby5pcy1kYW5nZXIgLm5hdi10b2dnbGUuaXMtYWN0aXZlIHNwYW4ge1xuICAgIGJhY2tncm91bmQtY29sb3I6ICNmZmY7XG4gIH1cbiAgLmhlcm8uaXMtZGFuZ2VyIC5uYXYtbWVudSAubmF2LWl0ZW0ge1xuICAgIGJvcmRlci10b3AtY29sb3I6IHJnYmEoMjU1LCAyNTUsIDI1NSwgMC4yKTtcbiAgfVxufVxuXG5AbWVkaWEgc2NyZWVuIGFuZCAobWluLXdpZHRoOiA3NjlweCksIHByaW50IHtcbiAgLmhlcm8uaXMtbWVkaXVtIC5oZXJvLWJvZHkge1xuICAgIHBhZGRpbmctYm90dG9tOiA5cmVtO1xuICAgIHBhZGRpbmctdG9wOiA5cmVtO1xuICB9XG59XG5cbkBtZWRpYSBzY3JlZW4gYW5kIChtaW4td2lkdGg6IDc2OXB4KSwgcHJpbnQge1xuICAuaGVyby5pcy1sYXJnZSAuaGVyby1ib2R5IHtcbiAgICBwYWRkaW5nLWJvdHRvbTogMThyZW07XG4gICAgcGFkZGluZy10b3A6IDE4cmVtO1xuICB9XG59XG5cbi5oZXJvLmlzLWhhbGZoZWlnaHQgLmhlcm8tYm9keSwgLmhlcm8uaXMtZnVsbGhlaWdodCAuaGVyby1ib2R5IHtcbiAgYWxpZ24taXRlbXM6IGNlbnRlcjtcbiAgZGlzcGxheTogZmxleDtcbn1cblxuLmhlcm8uaXMtaGFsZmhlaWdodCAuaGVyby1ib2R5ID4gLmNvbnRhaW5lciwgLmhlcm8uaXMtZnVsbGhlaWdodCAuaGVyby1ib2R5ID4gLmNvbnRhaW5lciB7XG4gIGZsZXgtZ3JvdzogMTtcbiAgZmxleC1zaHJpbms6IDE7XG59XG5cbi5oZXJvLmlzLWhhbGZoZWlnaHQge1xuICBtaW4taGVpZ2h0OiA1MHZoO1xufVxuXG4uaGVyby5pcy1mdWxsaGVpZ2h0IHtcbiAgbWluLWhlaWdodDogMTAwdmg7XG59XG5cbi5zZWN0aW9uIHtcbiAgYmFja2dyb3VuZC1jb2xvcjogd2hpdGU7XG4gIHBhZGRpbmc6IDNyZW0gMS41cmVtO1xufVxuXG5AbWVkaWEgc2NyZWVuIGFuZCAobWluLXdpZHRoOiAxMDA4cHgpIHtcbiAgLnNlY3Rpb24uaXMtbWVkaXVtIHtcbiAgICBwYWRkaW5nOiA5cmVtIDEuNXJlbTtcbiAgfVxuICAuc2VjdGlvbi5pcy1sYXJnZSB7XG4gICAgcGFkZGluZzogMThyZW0gMS41cmVtO1xuICB9XG59XG5cbi5mb290ZXIge1xuICBiYWNrZ3JvdW5kLWNvbG9yOiB3aGl0ZXNtb2tlO1xuICBwYWRkaW5nOiAzcmVtIDEuNXJlbSA2cmVtO1xufVxuXG4uaGlnaGxpZ2h0IHtcbiAgYmFja2dyb3VuZC1jb2xvcjogI2Y1ZjVmNTtcbiAgY29sb3I6ICM1ODZlNzU7XG59XG5cbi5oaWdobGlnaHQgLmMge1xuICBjb2xvcjogIzkzYTFhMTtcbn1cblxuLmhpZ2hsaWdodCAuZXJyLFxuLmhpZ2hsaWdodCAuZyB7XG4gIGNvbG9yOiAjNTg2ZTc1O1xufVxuXG4uaGlnaGxpZ2h0IC5rIHtcbiAgY29sb3I6ICM4NTk5MDA7XG59XG5cbi5oaWdobGlnaHQgLmwsXG4uaGlnaGxpZ2h0IC5uIHtcbiAgY29sb3I6ICM1ODZlNzU7XG59XG5cbi5oaWdobGlnaHQgLm8ge1xuICBjb2xvcjogIzg1OTkwMDtcbn1cblxuLmhpZ2hsaWdodCAueCB7XG4gIGNvbG9yOiAjY2I0YjE2O1xufVxuXG4uaGlnaGxpZ2h0IC5wIHtcbiAgY29sb3I6ICM1ODZlNzU7XG59XG5cbi5oaWdobGlnaHQgLmNtIHtcbiAgY29sb3I6ICM5M2ExYTE7XG59XG5cbi5oaWdobGlnaHQgLmNwIHtcbiAgY29sb3I6ICM4NTk5MDA7XG59XG5cbi5oaWdobGlnaHQgLmMxIHtcbiAgY29sb3I6ICM5M2ExYTE7XG59XG5cbi5oaWdobGlnaHQgLmNzIHtcbiAgY29sb3I6ICM4NTk5MDA7XG59XG5cbi5oaWdobGlnaHQgLmdkIHtcbiAgY29sb3I6ICMyYWExOTg7XG59XG5cbi5oaWdobGlnaHQgLmdlIHtcbiAgY29sb3I6ICM1ODZlNzU7XG4gIGZvbnQtc3R5bGU6IGl0YWxpYztcbn1cblxuLmhpZ2hsaWdodCAuZ3Ige1xuICBjb2xvcjogI2RjMzIyZjtcbn1cblxuLmhpZ2hsaWdodCAuZ2gge1xuICBjb2xvcjogI2NiNGIxNjtcbn1cblxuLmhpZ2hsaWdodCAuZ2kge1xuICBjb2xvcjogIzg1OTkwMDtcbn1cblxuLmhpZ2hsaWdodCAuZ28sXG4uaGlnaGxpZ2h0IC5ncCB7XG4gIGNvbG9yOiAjNTg2ZTc1O1xufVxuXG4uaGlnaGxpZ2h0IC5ncyB7XG4gIGNvbG9yOiAjNTg2ZTc1O1xuICBmb250LXdlaWdodDogYm9sZDtcbn1cblxuLmhpZ2hsaWdodCAuZ3Uge1xuICBjb2xvcjogI2NiNGIxNjtcbn1cblxuLmhpZ2hsaWdodCAuZ3Qge1xuICBjb2xvcjogIzU4NmU3NTtcbn1cblxuLmhpZ2hsaWdodCAua2Mge1xuICBjb2xvcjogI2NiNGIxNjtcbn1cblxuLmhpZ2hsaWdodCAua2Qge1xuICBjb2xvcjogIzI2OGJkMjtcbn1cblxuLmhpZ2hsaWdodCAua24sXG4uaGlnaGxpZ2h0IC5rcCB7XG4gIGNvbG9yOiAjODU5OTAwO1xufVxuXG4uaGlnaGxpZ2h0IC5rciB7XG4gIGNvbG9yOiAjMjY4YmQyO1xufVxuXG4uaGlnaGxpZ2h0IC5rdCB7XG4gIGNvbG9yOiAjZGMzMjJmO1xufVxuXG4uaGlnaGxpZ2h0IC5sZCB7XG4gIGNvbG9yOiAjNTg2ZTc1O1xufVxuXG4uaGlnaGxpZ2h0IC5tLFxuLmhpZ2hsaWdodCAucyB7XG4gIGNvbG9yOiAjMmFhMTk4O1xufVxuXG4uaGlnaGxpZ2h0IC5uYSB7XG4gIGNvbG9yOiAjQjU4OTAwO1xufVxuXG4uaGlnaGxpZ2h0IC5uYiB7XG4gIGNvbG9yOiAjNTg2ZTc1O1xufVxuXG4uaGlnaGxpZ2h0IC5uYyB7XG4gIGNvbG9yOiAjMjY4YmQyO1xufVxuXG4uaGlnaGxpZ2h0IC5ubyB7XG4gIGNvbG9yOiAjY2I0YjE2O1xufVxuXG4uaGlnaGxpZ2h0IC5uZCB7XG4gIGNvbG9yOiAjMjY4YmQyO1xufVxuXG4uaGlnaGxpZ2h0IC5uaSxcbi5oaWdobGlnaHQgLm5lIHtcbiAgY29sb3I6ICNjYjRiMTY7XG59XG5cbi5oaWdobGlnaHQgLm5mIHtcbiAgY29sb3I6ICMyNjhiZDI7XG59XG5cbi5oaWdobGlnaHQgLm5sLFxuLmhpZ2hsaWdodCAubm4sXG4uaGlnaGxpZ2h0IC5ueCxcbi5oaWdobGlnaHQgLnB5IHtcbiAgY29sb3I6ICM1ODZlNzU7XG59XG5cbi5oaWdobGlnaHQgLm50LFxuLmhpZ2hsaWdodCAubnYge1xuICBjb2xvcjogIzI2OGJkMjtcbn1cblxuLmhpZ2hsaWdodCAub3cge1xuICBjb2xvcjogIzg1OTkwMDtcbn1cblxuLmhpZ2hsaWdodCAudyB7XG4gIGNvbG9yOiAjNTg2ZTc1O1xufVxuXG4uaGlnaGxpZ2h0IC5tZixcbi5oaWdobGlnaHQgLm1oLFxuLmhpZ2hsaWdodCAubWksXG4uaGlnaGxpZ2h0IC5tbyB7XG4gIGNvbG9yOiAjMmFhMTk4O1xufVxuXG4uaGlnaGxpZ2h0IC5zYiB7XG4gIGNvbG9yOiAjOTNhMWExO1xufVxuXG4uaGlnaGxpZ2h0IC5zYyB7XG4gIGNvbG9yOiAjMmFhMTk4O1xufVxuXG4uaGlnaGxpZ2h0IC5zZCB7XG4gIGNvbG9yOiAjNTg2ZTc1O1xufVxuXG4uaGlnaGxpZ2h0IC5zMiB7XG4gIGNvbG9yOiAjMmFhMTk4O1xufVxuXG4uaGlnaGxpZ2h0IC5zZSB7XG4gIGNvbG9yOiAjY2I0YjE2O1xufVxuXG4uaGlnaGxpZ2h0IC5zaCB7XG4gIGNvbG9yOiAjNTg2ZTc1O1xufVxuXG4uaGlnaGxpZ2h0IC5zaSxcbi5oaWdobGlnaHQgLnN4IHtcbiAgY29sb3I6ICMyYWExOTg7XG59XG5cbi5oaWdobGlnaHQgLnNyIHtcbiAgY29sb3I6ICNkYzMyMmY7XG59XG5cbi5oaWdobGlnaHQgLnMxLFxuLmhpZ2hsaWdodCAuc3Mge1xuICBjb2xvcjogIzJhYTE5ODtcbn1cblxuLmhpZ2hsaWdodCAuYnAsXG4uaGlnaGxpZ2h0IC52Yyxcbi5oaWdobGlnaHQgLnZnLFxuLmhpZ2hsaWdodCAudmkge1xuICBjb2xvcjogIzI2OGJkMjtcbn1cblxuLmhpZ2hsaWdodCAuaWwge1xuICBjb2xvcjogIzJhYTE5ODtcbn1cblxuLmNvbnRlbnQgLmhpZ2hsaWdodCB7XG4gIHRleHQtYWxpZ246IGxlZnQ7XG59XG5cbkBtZWRpYSBzY3JlZW4gYW5kIChtaW4td2lkdGg6IDc2OXB4KSwgcHJpbnQge1xuICAuYnV0dG9uIHNtYWxsIHtcbiAgICBjb2xvcjogIzRhNGE0YTtcbiAgICBsZWZ0OiAwO1xuICAgIG1hcmdpbi10b3A6IDEwcHg7XG4gICAgcG9zaXRpb246IGFic29sdXRlO1xuICAgIHRvcDogMTAwJTtcbiAgICB3aWR0aDogMTAwJTtcbiAgfVxufVxuXG5ib2R5LnBhZ2UtZ3JpZCAuY29sdW1uID4gLm5vdGlmaWNhdGlvbiB7XG4gIHBhZGRpbmctbGVmdDogMDtcbiAgcGFkZGluZy1yaWdodDogMDtcbiAgdGV4dC1hbGlnbjogY2VudGVyO1xufVxuXG5AbWVkaWEgc2NyZWVuIGFuZCAobWluLXdpZHRoOiA3NjlweCksIHByaW50IHtcbiAgLmhlYWRlci1pdGVtIC5idXR0b24gKyAuYnV0dG9uIHtcbiAgICBtYXJnaW4tbGVmdDogMC43NXJlbTtcbiAgfVxufVxuXG5zdmcge1xuICBtYXgtaGVpZ2h0OiAxMDAlO1xuICBtYXgtd2lkdGg6IDEwMCU7XG59XG5cbiNjYXJib24ge1xuICBtYXJnaW4tbGVmdDogYXV0bztcbiAgbWFyZ2luLXJpZ2h0OiBhdXRvO1xuICBtYXgtd2lkdGg6IDM0MHB4O1xuICBtaW4taGVpZ2h0OiAxNTBweDtcbiAgcGFkZGluZzogMDtcbiAgcG9zaXRpb246IHJlbGF0aXZlO1xufVxuXG4jY2FyYm9uOmhvdmVyIHtcbiAgYm94LXNoYWRvdzogMCAycHggM3B4IHJnYmEoMTAsIDEwLCAxMCwgMC4xKSwgMCAwIDAgMXB4ICMwMGQxYjI7XG59XG5cbkBtZWRpYSBzY3JlZW4gYW5kIChtaW4td2lkdGg6IDc2OXB4KSwgcHJpbnQge1xuICAjY2FyYm9uIHtcbiAgICB3aWR0aDogMzQwcHg7XG4gIH1cbn1cblxuI2NhcmJvbmFkcyB7XG4gIGZvbnQtc2l6ZTogMTRweDtcbiAgdGV4dC1hbGlnbjogbGVmdDtcbn1cblxuI2NhcmJvbmFkcyBhLFxuI2NhcmJvbmFkcyBzcGFuIHtcbiAgZGlzcGxheTogYmxvY2s7XG59XG5cbiNjYXJib25hZHMgLmNhcmJvbi13cmFwIHtcbiAgcG9zaXRpb246IHJlbGF0aXZlO1xufVxuXG4jY2FyYm9uYWRzIC5jYXJib24taW1nIHtcbiAgYmFja2dyb3VuZDogd2hpdGVzbW9rZTtcbiAgZmxvYXQ6IGxlZnQ7XG4gIGhlaWdodDogMTAwcHg7XG4gIG1hcmdpbjogMTVweCAwIDE1cHggMTVweDtcbiAgd2lkdGg6IDEzMHB4O1xufVxuXG4jY2FyYm9uYWRzIC5jYXJib24taW1nIGltZyB7XG4gIGRpc3BsYXk6IGJsb2NrO1xuICBoZWlnaHQ6IDEwMHB4O1xuICB3aWR0aDogMTMwcHg7XG59XG5cbiNjYXJib25hZHMgLmNhcmJvbi10ZXh0IHtcbiAgZGlzcGxheTogYmxvY2s7XG4gIGNvbG9yOiAjMzYzNjM2O1xuICBsaW5lLWhlaWdodDogMjBweDtcbiAgcGFkZGluZzogMTVweCAxNXB4IDM1cHggMTYwcHg7XG59XG5cbiNjYXJib25hZHMgLmNhcmJvbi1wb3dlcmVkYnkge1xuICBib3R0b206IDA7XG4gIGNvbG9yOiAjN2E3YTdhO1xuICBmb250LXNpemU6IDAuNzVyZW07XG4gIGxlZnQ6IDE2MHB4O1xuICBsaW5lLWhlaWdodDogMjBweDtcbiAgcGFkZGluZzogMCAxNXB4IDEwcHggMDtcbiAgcG9zaXRpb246IGFic29sdXRlO1xuICByaWdodDogMDtcbn1cblxuQGtleWZyYW1lcyBmbG9hdFVwIHtcbiAgMCUge1xuICAgIGJveC1zaGFkb3c6IDAgMCAwIHJnYmEoMTAsIDEwLCAxMCwgMCksIDAgMCAwIHJnYmEoMTAsIDEwLCAxMCwgMCksIDAgMCAwIHJnYmEoMTAsIDEwLCAxMCwgMCk7XG4gICAgdHJhbnNmb3JtOiBzY2FsZSgwLjg2KTtcbiAgfVxuICA2NyUge1xuICAgIGJveC1zaGFkb3c6IDAgMCAwIHJnYmEoMTAsIDEwLCAxMCwgMCksIDAgNXB4IDEwcHggcmdiYSgxMCwgMTAsIDEwLCAwLjEpLCAwIDFweCAxcHggcmdiYSgxMCwgMTAsIDEwLCAwLjIpO1xuICAgIHRyYW5zZm9ybTogc2NhbGUoMSk7XG4gIH1cbiAgMTAwJSB7XG4gICAgYm94LXNoYWRvdzogMCAyMHB4IDYwcHggcmdiYSgxMCwgMTAsIDEwLCAwLjA1KSwgMCA1cHggMTBweCByZ2JhKDEwLCAxMCwgMTAsIDAuMSksIDAgMXB4IDFweCByZ2JhKDEwLCAxMCwgMTAsIDAuMik7XG4gICAgdHJhbnNmb3JtOiBzY2FsZSgxKTtcbiAgfVxufVxuXG5Aa2V5ZnJhbWVzIHN0cm9rZVBhdGgge1xuICBmcm9tIHtcbiAgICBzdHJva2UtZGFzaG9mZnNldDogODgwO1xuICB9XG4gIHRvIHtcbiAgICBzdHJva2UtZGFzaG9mZnNldDogMDtcbiAgfVxufVxuXG5Aa2V5ZnJhbWVzIGZhZGVJbiB7XG4gIGZyb20ge1xuICAgIG9wYWNpdHk6IDA7XG4gICAgdHJhbnNmb3JtOiBzY2FsZSgwLjg2KTtcbiAgfVxuICB0byB7XG4gICAgb3BhY2l0eTogMTtcbiAgICB0cmFuc2Zvcm06IHNjYWxlKDEpO1xuICB9XG59XG5cbkBrZXlmcmFtZXMgZmFkZU91dCB7XG4gIDAlIHtcbiAgICBvcGFjaXR5OiAxO1xuICAgIHRyYW5zZm9ybTogc2NhbGUoMC44Nik7XG4gIH1cbiAgNjclIHtcbiAgICBvcGFjaXR5OiAxO1xuICAgIHRyYW5zZm9ybTogc2NhbGUoMC44Nik7XG4gIH1cbiAgMTAwJSB7XG4gICAgb3BhY2l0eTogMDtcbiAgICB0cmFuc2Zvcm06IHNjYWxlKDEpO1xuICB9XG59XG5cbkBrZXlmcmFtZXMgc2xpZGVEb3duIHtcbiAgMCUge1xuICAgIG9wYWNpdHk6IDA7XG4gICAgdHJhbnNmb3JtOiB0cmFuc2xhdGVZKC0xMHB4KTtcbiAgfVxuICAxMDAlIHtcbiAgICBvcGFjaXR5OiAxO1xuICAgIHRyYW5zZm9ybTogdHJhbnNsYXRlWSgwKTtcbiAgfVxufVxuXG5Aa2V5ZnJhbWVzIHNsaWRlVXAge1xuICAwJSB7XG4gICAgb3BhY2l0eTogMDtcbiAgICB0cmFuc2Zvcm06IHRyYW5zbGF0ZVkoMTBweCk7XG4gIH1cbiAgMTAwJSB7XG4gICAgb3BhY2l0eTogMTtcbiAgICB0cmFuc2Zvcm06IHRyYW5zbGF0ZVkoMCk7XG4gIH1cbn1cblxuI2Ige1xuICBhbmltYXRpb24tZHVyYXRpb246IDEuNXM7XG4gIGFuaW1hdGlvbi1maWxsLW1vZGU6IGJvdGg7XG4gIGFuaW1hdGlvbi1uYW1lOiBmbG9hdFVwO1xuICBhbmltYXRpb24tdGltaW5nLWZ1bmN0aW9uOiBjdWJpYy1iZXppZXIoMCwgMC43MSwgMC4yOSwgMSk7XG4gIGJvcmRlci1yYWRpdXM6IDI0cHg7XG4gIGRpc3BsYXk6IGlubGluZS1ibG9jaztcbiAgaGVpZ2h0OiAyNDBweDtcbiAgbWFyZ2luLWJvdHRvbTogNDBweDtcbiAgcG9zaXRpb246IHJlbGF0aXZlO1xuICB2ZXJ0aWNhbC1hbGlnbjogdG9wO1xuICB3aWR0aDogMjQwcHg7XG59XG5cbiNiIHN2ZyB7XG4gIGJvdHRvbTogMDtcbiAgbGVmdDogMDtcbiAgcG9zaXRpb246IGFic29sdXRlO1xuICByaWdodDogMDtcbiAgdG9wOiAwO1xuICBkaXNwbGF5OiBibG9jaztcbiAgaGVpZ2h0OiAyNDBweDtcbiAgd2lkdGg6IDI0MHB4O1xufVxuXG4jYiBzdmc6Zmlyc3QtY2hpbGQge1xuICBhbmltYXRpb24tZHVyYXRpb246IDEuNXM7XG4gIGFuaW1hdGlvbi1maWxsLW1vZGU6IGJvdGg7XG4gIGFuaW1hdGlvbi1uYW1lOiBmYWRlT3V0O1xuICBhbmltYXRpb24tdGltaW5nLWZ1bmN0aW9uOiBjdWJpYy1iZXppZXIoMCwgMC43MSwgMC4yOSwgMSk7XG59XG5cbiNiIHN2ZzpmaXJzdC1jaGlsZCBnIHtcbiAgYW5pbWF0aW9uLWR1cmF0aW9uOiAxcztcbiAgYW5pbWF0aW9uLWZpbGwtbW9kZTogYm90aDtcbiAgYW5pbWF0aW9uLW5hbWU6IHN0cm9rZVBhdGg7XG4gIGFuaW1hdGlvbi10aW1pbmctZnVuY3Rpb246IGN1YmljLWJlemllcigwLCAwLjcxLCAwLjI5LCAxKTtcbiAgZmlsbDogbm9uZTtcbiAgc3Ryb2tlOiAjMDBkMWIyO1xuICBzdHJva2UtZGFzaGFycmF5OiA4ODA7XG4gIHN0cm9rZS13aWR0aDogMnB4O1xufVxuXG4jYiBzdmc6bGFzdC1jaGlsZCB7XG4gIGFuaW1hdGlvbi1kZWxheTogMXM7XG4gIGFuaW1hdGlvbi1kdXJhdGlvbjogMXM7XG4gIGFuaW1hdGlvbi1maWxsLW1vZGU6IGJvdGg7XG4gIGFuaW1hdGlvbi1uYW1lOiBmYWRlSW47XG4gIGFuaW1hdGlvbi10aW1pbmctZnVuY3Rpb246IGN1YmljLWJlemllcigwLCAwLjcxLCAwLjI5LCAxKTtcbn1cblxuI2Igc3ZnOmxhc3QtY2hpbGQgZyB7XG4gIGZpbGw6ICMwMGQxYjI7XG59XG5cbkBtZWRpYSBzY3JlZW4gYW5kIChtYXgtd2lkdGg6IDc2OHB4KSB7XG4gICNiIHtcbiAgICBib3JkZXItcmFkaXVzOiAxNnB4O1xuICAgIGhlaWdodDogMTYwcHg7XG4gICAgd2lkdGg6IDE2MHB4O1xuICB9XG59XG5cbiNidWxtYSB7XG4gIGFuaW1hdGlvbjogc2xpZGVEb3duIDUwMG1zIGJvdGg7XG59XG5cbiNtb2Rlcm4tZnJhbWV3b3JrIHtcbiAgYW5pbWF0aW9uOiBzbGlkZVVwIDUwMG1zIGJvdGg7XG4gIGFuaW1hdGlvbi1kZWxheTogMC4ycztcbn1cblxuI25wbSB7XG4gIGFsaWduLWl0ZW1zOiBjZW50ZXI7XG4gIGFuaW1hdGlvbjogZmFkZUluIDUwMG1zIGJvdGg7XG4gIGFuaW1hdGlvbi1kZWxheTogMC40cztcbiAgYmFja2dyb3VuZDogbm9uZTtcbiAgZGlzcGxheTogZmxleDtcbiAganVzdGlmeS1jb250ZW50OiBjZW50ZXI7XG4gIG1hcmdpbjogLTEwcHggMCAyMHB4O1xufVxuXG4jbnBtIGNvZGUge1xuICBiYWNrZ3JvdW5kOiB3aGl0ZXNtb2tlO1xuICBib3JkZXItcmFkaXVzOiAzcHg7XG4gIGNvbG9yOiAjMDBkMWIyO1xuICBkaXNwbGF5OiBpbmxpbmUtYmxvY2s7XG4gIGZvbnQtc2l6ZTogMTZweDtcbiAgcGFkZGluZzogMTZweCAzMnB4O1xufVxuXG4jZ2hidG5zIHtcbiAgYW5pbWF0aW9uOiBzbGlkZURvd24gNTAwbXMgYm90aDtcbiAgYW5pbWF0aW9uLWRlbGF5OiAwLjZzO1xufVxuXG5odG1sLnJvdXRlLWluZGV4ICNjYXJib24ge1xuICBhbmltYXRpb246IHNsaWRlVXAgNTAwbXMgYm90aDtcbiAgYW5pbWF0aW9uLWRlbGF5OiAwLjhzO1xufVxuXG4jZG93bmxvYWQge1xuICBhbmltYXRpb246IGZhZGVJbiA1MDBtcyBib3RoO1xuICBhbmltYXRpb24tZGVsYXk6IDFzO1xufVxuXG4jZ3JpZCAubm90aWZpY2F0aW9uIHtcbiAgcGFkZGluZy1sZWZ0OiAwO1xuICBwYWRkaW5nLXJpZ2h0OiAwO1xufVxuXG4jbWVzc2FnZSB7XG4gIGRpc3BsYXk6IG5vbmU7XG59XG5cbiN0d2VldCB7XG4gIGJhY2tncm91bmQ6IHdoaXRlO1xuICBib3JkZXItcmFkaXVzOiA1cHg7XG4gIGJveC1zaGFkb3c6IDAgMnB4IDNweCByZ2JhKDEwLCAxMCwgMTAsIDAuMSksIDAgMCAwIDFweCByZ2JhKDEwLCAxMCwgMTAsIDAuMSk7XG4gIHBhZGRpbmc6IDEuNXJlbTtcbn1cblxuI2dpdGh1YiB7XG4gIGNvbG9yOiAjMzMzMzMzO1xuICBib3JkZXItY29sb3I6ICMzMzMzMzM7XG59XG5cbiNnaXRodWI6aG92ZXIge1xuICBiYWNrZ3JvdW5kOiAjMzMzMzMzO1xuICBib3JkZXItY29sb3I6ICMzMzMzMzM7XG4gIGNvbG9yOiB3aGl0ZTtcbn1cblxuI3R3aXR0ZXIge1xuICBjb2xvcjogIzU1YWNlZTtcbiAgYm9yZGVyLWNvbG9yOiAjNTVhY2VlO1xufVxuXG4jdHdpdHRlcjpob3ZlciB7XG4gIGJhY2tncm91bmQ6ICM1NWFjZWU7XG4gIGJvcmRlci1jb2xvcjogIzU1YWNlZTtcbiAgY29sb3I6IHdoaXRlO1xufVxuXG5AbWVkaWEgc2NyZWVuIGFuZCAobWluLXdpZHRoOiAxMDA4cHgpIHtcbiAgI2Jsb2dEcm9wZG93biB7XG4gICAgd2lkdGg6IDE2cmVtO1xuICB9XG4gICNibG9nRHJvcGRvd24gLm5hdmJhci1pdGVtIHtcbiAgICB3aGl0ZS1zcGFjZTogbm9ybWFsO1xuICB9XG4gICNtb3JlRHJvcGRvd24ge1xuICAgIHdpZHRoOiAxNnJlbTtcbiAgfVxuICAjbW9yZURyb3Bkb3duIC5uYXZiYXItaXRlbSB7XG4gICAgcGFkZGluZy1yaWdodDogMXJlbTtcbiAgfVxuICAjbW9yZURyb3Bkb3duIC5uYXZiYXItaXRlbSAubGV2ZWwge1xuICAgIGZsZXgtZ3JvdzogMTtcbiAgfVxufVxuXG4jYWJvdXQgLnR3aXR0ZXItY29udGFpbmVyIHtcbiAgZGlzcGxheTogYmxvY2s7XG4gIGhlaWdodDogMzBweDtcbiAgbGluZS1oZWlnaHQ6IDMwcHg7XG4gIG1hcmdpbi10b3A6IDVweDtcbn1cblxuI2Fib3V0IHNtYWxsIHtcbiAgZGlzcGxheTogYmxvY2s7XG4gIG1hcmdpbi10b3A6IDVweDtcbn1cblxuI21jX2VtYmVkX3NpZ251cCAuZmllbGQge1xuICBtYXJnaW4tYm90dG9tOiAwO1xufVxuXG4jbWNfZW1iZWRfc2lnbnVwIC5ub3RpZmljYXRpb24ge1xuICBtYXJnaW4tdG9wOiAwLjc1cmVtO1xufVxuXG4jc2hhcmUgZm9ybSB7XG4gIGhlaWdodDogMzBweDtcbiAgbWFyZ2luLXRvcDogMTBweDtcbn1cblxuI3NvY2lhbCB7XG4gIGFsaWduLWl0ZW1zOiBjZW50ZXI7XG4gIGRpc3BsYXk6IGZsZXg7XG4gIGZsZXgtd3JhcDogd3JhcDtcbiAganVzdGlmeS1jb250ZW50OiBmbGV4LXN0YXJ0O1xufVxuXG4jc29jaWFsID4gaWZyYW1lLFxuI3NvY2lhbCA+IGEsXG4jc29jaWFsID4gZm9ybSxcbiNzb2NpYWwgPiBkaXYge1xuICBkaXNwbGF5OiBpbmxpbmUtYmxvY2s7XG4gIGZvbnQtc2l6ZTogMTFweDtcbiAgaGVpZ2h0OiAzMHB4O1xuICBsaW5lLWhlaWdodDogMzBweDtcbiAgbWFyZ2luLXRvcDogNXB4O1xufVxuXG4jc29jaWFsIC5naXRodWItYnRuIHtcbiAgd2lkdGg6IDE2MHB4O1xufVxuXG4jc29jaWFsIC50d2l0dGVyLXNoYXJlLWJ1dHRvbiB7XG4gIG1hcmdpbi1yaWdodDogMTBweDtcbiAgbWluLXdpZHRoOiA3NnB4O1xufVxuXG4jc29jaWFsIC5wYXlwYWwtZm9ybSB7XG4gIG1pbi13aWR0aDogMTQ4cHg7XG59XG5cbiNzb2NpYWwgLmZiLWxpa2Uge1xuICBhbGlnbi1pdGVtczogY2VudGVyO1xuICBkaXNwbGF5OiBmbGV4O1xuICB3aWR0aDogMTMwcHg7XG59XG5cbiNuZXdzbGV0dGVyIC5pbnB1dCB7XG4gIGJvcmRlci1jb2xvcjogd2hpdGU7XG4gIGJveC1zaGFkb3c6IG5vbmU7XG59XG5cbiNzaXN0ZXIgdWwge1xuICBkaXNwbGF5OiBmbGV4O1xuICBmbGV4LXdyYXA6IHdyYXA7XG59XG5cbiNzaXN0ZXIgbGkge1xuICBkaXNwbGF5OiBmbGV4O1xuICBoZWlnaHQ6IDMwcHg7XG4gIG1hcmdpbjogNXB4IDFyZW0gMCAwO1xufVxuXG4jc2lzdGVyIGltZyB7XG4gIGhlaWdodDogMzBweDtcbn1cblxuI3RzcCBzbWFsbCB7XG4gIGRpc3BsYXk6IGJsb2NrO1xufVxuXG4jaW1hZ2VzIHRyIHRkOm50aC1jaGlsZCgyKSB7XG4gIHdpZHRoOiAzMjBweDtcbn1cblxuLmNvbG9yIHtcbiAgYm9yZGVyLXJhZGl1czogMnB4O1xuICBib3gtc2hhZG93OiAwIDJweCAzcHggMCByZ2JhKDAsIDAsIDAsIDAuMSksIGluc2V0IDAgMCAwIDFweCByZ2JhKDAsIDAsIDAsIDAuMSk7XG4gIGRpc3BsYXk6IGlubGluZS1ibG9jaztcbiAgZmxvYXQ6IGxlZnQ7XG4gIGhlaWdodDogMjRweDtcbiAgbWFyZ2luLXJpZ2h0OiA4cHg7XG4gIHdpZHRoOiAyNHB4O1xufVxuXG4uYnV0dG9uLmlzLXJzcyB7XG4gIGJhY2tncm91bmQtY29sb3I6ICNmMjY1MjI7XG4gIGJvcmRlci1jb2xvcjogdHJhbnNwYXJlbnQ7XG4gIGNvbG9yOiAjZmZmO1xufVxuXG4uYnV0dG9uLmlzLXJzczpob3ZlciB7XG4gIGJhY2tncm91bmQtY29sb3I6ICNlZDU2MGU7XG59XG5cbi5idXR0b24uaXMtcnNzOmFjdGl2ZSB7XG4gIGJhY2tncm91bmQtY29sb3I6ICNkNTRkMGQ7XG59XG5cbi5leGFtcGxlLFxuLnN0cnVjdHVyZSB7XG4gIGJvcmRlcjogMXB4IHNvbGlkICNmZmRkNTc7XG4gIGJvcmRlci10b3AtcmlnaHQtcmFkaXVzOiAzcHg7XG4gIGNvbG9yOiByZ2JhKDAsIDAsIDAsIDAuNyk7XG4gIHBhZGRpbmc6IDEuNXJlbTtcbiAgcG9zaXRpb246IHJlbGF0aXZlO1xufVxuXG4uZXhhbXBsZTpub3QoOmZpcnN0LWNoaWxkKSxcbi5zdHJ1Y3R1cmU6bm90KDpmaXJzdC1jaGlsZCkge1xuICBtYXJnaW4tdG9wOiAycmVtO1xufVxuXG4uZXhhbXBsZTpub3QoOmxhc3QtY2hpbGQpLFxuLnN0cnVjdHVyZTpub3QoOmxhc3QtY2hpbGQpIHtcbiAgbWFyZ2luLWJvdHRvbTogMS41cmVtO1xufVxuXG4uZXhhbXBsZTpiZWZvcmUsXG4uc3RydWN0dXJlOmJlZm9yZSB7XG4gIGJhY2tncm91bmQ6ICNmZmRkNTc7XG4gIGJvcmRlci1yYWRpdXM6IDNweCAzcHggMCAwO1xuICBib3R0b206IDEwMCU7XG4gIGNvbnRlbnQ6IFwiRXhhbXBsZVwiO1xuICBkaXNwbGF5OiBpbmxpbmUtYmxvY2s7XG4gIGZvbnQtc2l6ZTogN3B4O1xuICBmb250LXdlaWdodDogYm9sZDtcbiAgbGVmdDogLTFweDtcbiAgbGV0dGVyLXNwYWNpbmc6IDFweDtcbiAgcGFkZGluZzogM3B4IDVweDtcbiAgcG9zaXRpb246IGFic29sdXRlO1xuICB0ZXh0LXRyYW5zZm9ybTogdXBwZXJjYXNlO1xuICB2ZXJ0aWNhbC1hbGlnbjogdG9wO1xufVxuXG5AbWVkaWEgc2NyZWVuIGFuZCAobWluLXdpZHRoOiA3NjlweCksIHByaW50IHtcbiAgLmV4YW1wbGUuaXMtZnVsbHdpZHRoLFxuICAuc3RydWN0dXJlLmlzLWZ1bGx3aWR0aCB7XG4gICAgYm9yZGVyLWxlZnQ6IG5vbmU7XG4gICAgYm9yZGVyLXJpZ2h0OiBub25lO1xuICAgIHBhZGRpbmc6IDA7XG4gIH1cbn1cblxuLmV4YW1wbGUgKyAuaGlnaGxpZ2h0IHtcbiAgYm9yZGVyOiAxcHggc29saWQgI2ZmZGQ1NztcbiAgYm9yZGVyLXJhZGl1czogMCAwIDNweCAzcHg7XG4gIGJvcmRlci10b3A6IG5vbmU7XG4gIG1hcmdpbi10b3A6IC0xLjVyZW07XG59XG5cbi5leGFtcGxlICsgLmhpZ2hsaWdodDpub3QoOmxhc3QtY2hpbGQpIHtcbiAgbWFyZ2luLWJvdHRvbTogMS41cmVtO1xufVxuXG4uaGlnaGxpZ2h0IHByZSB7XG4gIG1heC1oZWlnaHQ6IDQ4MHB4O1xuICBtYXJnaW4tYm90dG9tOiAwICFpbXBvcnRhbnQ7XG4gIHBhZGRpbmc6IDA7XG59XG5cbi5oaWdobGlnaHQgcHJlIGNvZGUge1xuICBwYWRkaW5nOiAxLjI1ZW0gMS41ZW07XG59XG5cbi5oaWdobGlnaHQtZnVsbCAuaGlnaGxpZ2h0IHByZSxcbiNuYXZiYXJKc0V4YW1wbGUgLmhpZ2hsaWdodCBwcmUge1xuICBtYXgtaGVpZ2h0OiBub25lO1xufVxuXG4uc3RydWN0dXJlIHtcbiAgYm9yZGVyLWNvbG9yOiAjZmYzODYwO1xuICBib3JkZXItcmFkaXVzOiAzcHg7XG4gIHBhZGRpbmc6IDEuNXJlbTtcbn1cblxuLnN0cnVjdHVyZTpiZWZvcmUge1xuICBiYWNrZ3JvdW5kOiAjZmYzODYwO1xuICBjb2xvcjogI2ZmZjtcbiAgY29udGVudDogXCJTdHJ1Y3R1cmVcIjtcbn1cblxuLnN0cnVjdHVyZS1pdGVtIHtcbiAgcG9zaXRpb246IHJlbGF0aXZlO1xufVxuXG4uc3RydWN0dXJlLWl0ZW06YmVmb3JlIHtcbiAgYm90dG9tOiAwO1xuICBsZWZ0OiAwO1xuICBwb3NpdGlvbjogYWJzb2x1dGU7XG4gIHJpZ2h0OiAwO1xuICB0b3A6IDA7XG4gIGJhY2tncm91bmQ6IHJnYmEoMTAsIDEwLCAxMCwgMC43KTtcbiAgYmFja2dyb3VuZDogd2hpdGVzbW9rZTtcbiAgYm9yZGVyOiAxcHggc29saWQgI2RiZGJkYjtcbiAgY29udGVudDogXCJcIjtcbiAgZGlzcGxheTogYmxvY2s7XG4gIHotaW5kZXg6IDE7XG59XG5cbi5zdHJ1Y3R1cmUtaXRlbTphZnRlciB7XG4gIGJvdHRvbTogMDtcbiAgbGVmdDogMDtcbiAgcG9zaXRpb246IGFic29sdXRlO1xuICByaWdodDogMDtcbiAgdG9wOiAwO1xuICBhbGlnbi1pdGVtczogY2VudGVyO1xuICBjb250ZW50OiBhdHRyKHRpdGxlKTtcbiAgZGlzcGxheTogZmxleDtcbiAgZm9udC1mYW1pbHk6IG1vbm9zcGFjZTtcbiAgZm9udC1zaXplOiAxMXB4O1xuICBqdXN0aWZ5LWNvbnRlbnQ6IGNlbnRlcjtcbiAgcGFkZGluZzogM3B4IDVweDtcbiAgei1pbmRleDogMjtcbn1cblxuLnN0cnVjdHVyZS1pdGVtLmlzLXN0cnVjdHVyZS1jb250YWluZXIge1xuICBwYWRkaW5nOiAxLjVyZW0gMC43NXJlbSAwLjc1cmVtO1xufVxuXG4uc3RydWN0dXJlLWl0ZW0uaXMtc3RydWN0dXJlLWNvbnRhaW5lcjphZnRlciB7XG4gIGFsaWduLWl0ZW1zOiBmbGV4LXN0YXJ0O1xuICBqdXN0aWZ5LWNvbnRlbnQ6IGZsZXgtc3RhcnQ7XG4gIHBhZGRpbmc6IDAuNXJlbSAwLjc1cmVtO1xufVxuXG4uaGlnaGxpZ2h0IHtcbiAgcG9zaXRpb246IHJlbGF0aXZlO1xufVxuXG4uaGlnaGxpZ2h0IC5jb3B5LFxuLmhpZ2hsaWdodCAuZXhwYW5kIHtcbiAgLXdlYmtpdC10b3VjaC1jYWxsb3V0OiBub25lO1xuICAtd2Via2l0LXVzZXItc2VsZWN0OiBub25lO1xuICAtbW96LXVzZXItc2VsZWN0OiBub25lO1xuICAtbXMtdXNlci1zZWxlY3Q6IG5vbmU7XG4gIHVzZXItc2VsZWN0OiBub25lO1xuICBiYWNrZ3JvdW5kOiB3aGl0ZTtcbiAgYm9yZGVyOiBzb2xpZCAjZGJkYmRiO1xuICBib3JkZXItd2lkdGg6IDAgMCAxcHggMXB4O1xuICBjb2xvcjogIzdhN2E3YTtcbiAgY3Vyc29yOiBwb2ludGVyO1xuICBvdXRsaW5lOiBub25lO1xuICBwb3NpdGlvbjogYWJzb2x1dGU7XG4gIHJpZ2h0OiAwO1xuICB0b3A6IDA7XG59XG5cbi5oaWdobGlnaHQgLmNvcHk6aG92ZXIsXG4uaGlnaGxpZ2h0IC5leHBhbmQ6aG92ZXIge1xuICBib3JkZXItY29sb3I6ICNmZjM4NjA7XG4gIGNvbG9yOiAjZmYzODYwO1xufVxuXG4uaGlnaGxpZ2h0IC5leHBhbmQge1xuICBib3JkZXItcmlnaHQtd2lkdGg6IDFweDtcbiAgcmlnaHQ6IDUwcHg7XG59XG5cbkBtZWRpYSBzY3JlZW4gYW5kIChtaW4td2lkdGg6IDc2OXB4KSwgcHJpbnQge1xuICAuaGlnaGxpZ2h0IHByZSB7XG4gICAgd2hpdGUtc3BhY2U6IHByZS13cmFwO1xuICB9XG59XG5cbkBtZWRpYSBzY3JlZW4gYW5kIChtaW4td2lkdGg6IDc2OXB4KSwgcHJpbnQge1xuICAuc2VjdGlvbjpub3QoLmlzLWZ1bGx3aWR0aCkgPiAuZXhhbXBsZTpub3QoLmlzLWZ1bGx3aWR0aCkge1xuICAgIG1hcmdpbi1sZWZ0OiAxLjVyZW07XG4gICAgbWFyZ2luLXJpZ2h0OiAxLjVyZW07XG4gIH1cbiAgLnNlY3Rpb246bm90KC5pcy1mdWxsd2lkdGgpID4gLmV4YW1wbGU6bm90KC5pcy1mdWxsd2lkdGgpICsgLmhpZ2hsaWdodCB7XG4gICAgbWFyZ2luLWxlZnQ6IDEuNXJlbTtcbiAgICBtYXJnaW4tcmlnaHQ6IDEuNXJlbTtcbiAgfVxufVxuXG4uc2VjdGlvbi5pcy1mdWxsd2lkdGgge1xuICBwYWRkaW5nOiAwICFpbXBvcnRhbnQ7XG59XG5cbi5zZWN0aW9uLmlzLWZ1bGx3aWR0aCAuZXhhbXBsZSB7XG4gIGJvcmRlci1sZWZ0OiBub25lO1xuICBib3JkZXItcmFkaXVzOiAwO1xuICBib3JkZXItcmlnaHQ6IG5vbmU7XG4gIHBhZGRpbmc6IDA7XG59XG5cbi5zZWN0aW9uLmlzLWZ1bGx3aWR0aCAuZXhhbXBsZSArIC5oaWdobGlnaHQge1xuICBib3JkZXItbGVmdDogbm9uZTtcbiAgYm9yZGVyLXJhZGl1czogMDtcbiAgYm9yZGVyLXJpZ2h0OiBub25lO1xufVxuXG4uY2FsbG91dCB7XG4gIGJhY2tncm91bmQtY29sb3I6IHdoaXRlc21va2U7XG4gIGJvcmRlci1yYWRpdXM6IDNweDtcbiAgcGFkZGluZzogMS4yNXJlbSAyLjVyZW0gMS4yNXJlbSAxLjVyZW07XG4gIHBvc2l0aW9uOiByZWxhdGl2ZTtcbn1cblxuLmNhbGxvdXQ6bm90KDpsYXN0LWNoaWxkKSB7XG4gIG1hcmdpbi1ib3R0b206IDEuNXJlbTtcbn1cblxuLmNhbGxvdXQuaXMtd2hpdGUge1xuICBiYWNrZ3JvdW5kLWNvbG9yOiB3aGl0ZTtcbiAgY29sb3I6ICMwYTBhMGE7XG59XG5cbi5jYWxsb3V0LmlzLWJsYWNrIHtcbiAgYmFja2dyb3VuZC1jb2xvcjogIzBhMGEwYTtcbiAgY29sb3I6IHdoaXRlO1xufVxuXG4uY2FsbG91dC5pcy1saWdodCB7XG4gIGJhY2tncm91bmQtY29sb3I6IHdoaXRlc21va2U7XG4gIGNvbG9yOiAjMzYzNjM2O1xufVxuXG4uY2FsbG91dC5pcy1kYXJrIHtcbiAgYmFja2dyb3VuZC1jb2xvcjogIzM2MzYzNjtcbiAgY29sb3I6IHdoaXRlc21va2U7XG59XG5cbi5jYWxsb3V0LmlzLXByaW1hcnkge1xuICBiYWNrZ3JvdW5kLWNvbG9yOiAjMDBkMWIyO1xuICBjb2xvcjogI2ZmZjtcbn1cblxuLmNhbGxvdXQuaXMtaW5mbyB7XG4gIGJhY2tncm91bmQtY29sb3I6ICMzMjczZGM7XG4gIGNvbG9yOiAjZmZmO1xufVxuXG4uY2FsbG91dC5pcy1zdWNjZXNzIHtcbiAgYmFja2dyb3VuZC1jb2xvcjogIzIzZDE2MDtcbiAgY29sb3I6ICNmZmY7XG59XG5cbi5jYWxsb3V0LmlzLXdhcm5pbmcge1xuICBiYWNrZ3JvdW5kLWNvbG9yOiAjZmZkZDU3O1xuICBjb2xvcjogcmdiYSgwLCAwLCAwLCAwLjcpO1xufVxuXG4uY2FsbG91dC5pcy1kYW5nZXIge1xuICBiYWNrZ3JvdW5kLWNvbG9yOiAjZmYzODYwO1xuICBjb2xvcjogI2ZmZjtcbn1cblxuLmJzYSB7XG4gIHBhZGRpbmc6IDJyZW07XG59XG5cbi5ic2EtY3BjIHtcbiAgbWluLWhlaWdodDogMXB4O1xufVxuXG4jX2RlZmF1bHRfIC5kZWZhdWx0LWFkIHtcbiAgYmFja2dyb3VuZC1jb2xvcjogcmdiYSgwLCAwLCAwLCAwLjMpO1xuICBib3JkZXItcmFkaXVzOiAycHg7XG4gIGNvbG9yOiB3aGl0ZTtcbiAgZGlzcGxheTogaW5saW5lLWJsb2NrO1xuICBmb250LXNpemU6IDEwcHg7XG4gIGZvbnQtd2VpZ2h0OiBib2xkO1xuICBwYWRkaW5nOiAwIDRweDtcbiAgdGV4dC10cmFuc2Zvcm06IHVwcGVyY2FzZTtcbiAgdmVydGljYWwtYWxpZ246IHRvcDtcbn1cblxuI19kZWZhdWx0XyA+IGEge1xuICBiYWNrZ3JvdW5kLWNvbG9yOiB3aGl0ZTtcbiAgYm9yZGVyLXJhZGl1czogNXB4O1xuICBib3gtc2hhZG93OiAwIDJweCAzcHggcmdiYSgxMCwgMTAsIDEwLCAwLjEpLCAwIDAgMCAxcHggcmdiYSgxMCwgMTAsIDEwLCAwLjEpO1xuICBjb2xvcjogIzRhNGE0YTtcbiAgZGlzcGxheTogYmxvY2s7XG4gIGxpbmUtaGVpZ2h0OiAxLjM3NTtcbiAgbWFyZ2luLXRvcDogMTVweDtcbiAgbWluLWhlaWdodDogNzBweDtcbiAgcGFkZGluZzogMTVweDtcbiAgcGFkZGluZy1sZWZ0OiA3MHB4O1xuICBwb3NpdGlvbjogcmVsYXRpdmU7XG59XG5cbiNfZGVmYXVsdF8gPiBhOmhvdmVyLCAjX2RlZmF1bHRfID4gYTpmb2N1cyB7XG4gIGJveC1zaGFkb3c6IDAgMnB4IDNweCByZ2JhKDEwLCAxMCwgMTAsIDAuMSksIDAgMCAwIDFweCAjMDBkMWIyO1xufVxuXG4jX2RlZmF1bHRfID4gYTphY3RpdmUge1xuICBib3gtc2hhZG93OiBpbnNldCAwIDFweCAycHggcmdiYSgxMCwgMTAsIDEwLCAwLjIpLCAwIDAgMCAxcHggIzAwZDFiMjtcbn1cblxuI19kZWZhdWx0XyA+IGEgc3BhbiB7XG4gIGRpc3BsYXk6IGJsb2NrO1xufVxuXG4jX2RlZmF1bHRfID4gYSAuZGVmYXVsdC1pbWFnZSB7XG4gIGRpc3BsYXk6IGJsb2NrO1xuICBsZWZ0OiAxNXB4O1xuICBoZWlnaHQ6IDQwcHg7XG4gIHBvc2l0aW9uOiBhYnNvbHV0ZTtcbiAgdG9wOiAxNXB4O1xuICB3aWR0aDogNDBweDtcbn1cblxuI19kZWZhdWx0XyA+IGEgLmRlZmF1bHQtaW1hZ2UgaW1nIHtcbiAgZGlzcGxheTogYmxvY2s7XG4gIGhlaWdodDogNDBweDtcbiAgd2lkdGg6IDQwcHg7XG59XG5cbiNfZGVmYXVsdF8gPiBhIC5kZWZhdWx0LXRpdGxlIHtcbiAgY29sb3I6ICMzNjM2MzY7XG4gIGRpc3BsYXk6IGlubGluZTtcbiAgZm9udC13ZWlnaHQ6IDcwMDtcbn1cblxuI19kZWZhdWx0XyA+IGEgLmRlZmF1bHQtdGl0bGU6YWZ0ZXIge1xuICBjb250ZW50OiBcIiDigJQgXCI7XG59XG5cbiNfZGVmYXVsdF8gPiBhIC5kZWZhdWx0LWRlc2NyaXB0aW9uIHtcbiAgZGlzcGxheTogaW5saW5lO1xufVxuXG5AbWVkaWEgc2NyZWVuIGFuZCAobWluLXdpZHRoOiA3NjlweCksIHByaW50IHtcbiAgLmJzYSAuY29sdW1ucyB7XG4gICAgbWluLWhlaWdodDogMTIwcHg7XG4gIH1cbiAgI19kZWZhdWx0XyB7XG4gICAgZGlzcGxheTogZmxleDtcbiAgICBqdXN0aWZ5LWNvbnRlbnQ6IGNlbnRlcjtcbiAgICBwb3NpdGlvbjogcmVsYXRpdmU7XG4gIH1cbiAgI19kZWZhdWx0XyAuZGVmYXVsdC1hZCB7XG4gICAgbGVmdDogMTAwJTtcbiAgICBtYXJnaW4tbGVmdDogMnJlbTtcbiAgICBwb3NpdGlvbjogYWJzb2x1dGU7XG4gICAgdG9wOiAwO1xuICB9XG4gICNfZGVmYXVsdF8gPiBhIHtcbiAgICBtYXJnaW46IDA7XG4gIH1cbiAgI19kZWZhdWx0XyA+IGE6bm90KDpudGgtY2hpbGQoMikpIHtcbiAgICBtYXJnaW4tbGVmdDogMnJlbTtcbiAgfVxufVxuXG5odG1sLnJvdXRlLWluZGV4IC50aXRsZS5pcy0yIHtcbiAgcG9zaXRpb246IHJlbGF0aXZlO1xufVxuXG5odG1sLnJvdXRlLWluZGV4IC50aXRsZS5pcy0yIGEge1xuICBjb2xvcjogIzI0MjQyNDtcbiAgcGFkZGluZy1sZWZ0OiA0OHB4O1xuICBwb3NpdGlvbjogcmVsYXRpdmU7XG59XG5cbmh0bWwucm91dGUtaW5kZXggLnRpdGxlLmlzLTIgYTpob3ZlciB7XG4gIGNvbG9yOiAjMDBkMWIyO1xufVxuXG5odG1sLnJvdXRlLWluZGV4IC50aXRsZS5pcy0yIC5pY29uLmlzLW1lZGl1bSB7XG4gIGxlZnQ6IDhweDtcbiAgcG9zaXRpb246IGFic29sdXRlO1xuICB0b3A6IDEwcHg7XG59XG5cbmh0bWwucm91dGUtaW5kZXggLmhlcm8gLnRpdGxlLmlzLTIgYSB7XG4gIGNvbG9yOiB3aGl0ZTtcbn1cblxuaHRtbC5yb3V0ZS1pbmRleCAuaGVybyAudGl0bGUuaXMtMiBhOmhvdmVyIHtcbiAgY29sb3I6IHdoaXRlO1xufVxuXG5odG1sLnJvdXRlLWluZGV4IC5oZXJvLmlzLXByaW1hcnkgYS5jb2x1bW4sXG5odG1sLnJvdXRlLWluZGV4IC5oZXJvLmlzLXByaW1hcnkgYS5jb2x1bW46aG92ZXIge1xuICBjb2xvcjogd2hpdGU7XG59XG5cbmh0bWwucm91dGUtaW5kZXggLmhlcm8uaXMtcHJpbWFyeSBhLmNvbHVtbjpob3ZlciAudGl0bGUgc3Ryb25nIHtcbiAgYm9yZGVyLWJvdHRvbTogMXB4IHNvbGlkO1xufVxuXG5AbWVkaWEgc2NyZWVuIGFuZCAobWF4LXdpZHRoOiA5NzlweCkge1xuICBodG1sLnJvdXRlLWluZGV4IC50aXRsZS5pcy0yIGEge1xuICAgIHBhZGRpbmctbGVmdDogMDtcbiAgfVxuICBodG1sLnJvdXRlLWluZGV4IC50aXRsZS5pcy0yIC5pY29uLmlzLW1lZGl1bSB7XG4gICAgZGlzcGxheTogbm9uZTtcbiAgfVxufVxuXG46cm9vdCB7XG4gIC0tcHJpbWFyeTogIzAwZDFiMjtcbiAgLS1nYXA6IDAuNzVyZW07XG59XG5cbmh0bWwgOjotbW96LXNlbGVjdGlvbiB7XG4gIGJhY2tncm91bmQ6ICMwMGQxYjI7XG4gIGNvbG9yOiAjZmZmO1xufVxuXG5odG1sIDo6c2VsZWN0aW9uIHtcbiAgYmFja2dyb3VuZDogIzAwZDFiMjtcbiAgY29sb3I6ICNmZmY7XG59XG4iXX0= */
\ No newline at end of file
diff --git a/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/documentation/components/breadcrumb/index.html b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/documentation/components/breadcrumb/index.html
new file mode 100644
index 0000000000000000000000000000000000000000..8d35969c647494e2074593507ae6dd1269674bbf
--- /dev/null
+++ b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/documentation/components/breadcrumb/index.html
@@ -0,0 +1,909 @@
+<!DOCTYPE html>
+<html lang="en" class="route-documentation">
+ <head>
+ <meta charset="utf-8">
+ <meta http-equiv="X-UA-Compatible" content="IE=edge">
+ <meta name="viewport" content="width=device-width, initial-scale=1">
+ <meta name="description" content="Bulma v0.4.4 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <title>Bulma v0.4.4: a modern CSS framework based on Flexbox</title>
+
+ <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.6.3/css/font-awesome.min.css">
+ <link rel="stylesheet" href="http://bulma.io/versions/0.4.4/css/bulma-docs.css">
+
+ <link rel="canonical" href="http://bulma.io/versions/0.4.4/documentation/components/breadcrumb/">
+ <link rel="alternate" type="application/rss+xml" title="Bulma v0.4.4: a modern CSS framework based on Flexbox" href="http://bulma.io/versions/0.4.4/feed.xml">
+
+ <meta property="og:url" content="http://bulma.io/versions/0.4.4">
+ <meta property="og:type" content="website">
+ <meta property="og:title" content="Bulma v0.4.4: a modern CSS framework based on Flexbox">
+ <meta property="og:image" content="http://bulma.io/versions/0.4.4/images/bulma-banner.png">
+ <meta property="og:image:type" content="image/png">
+ <meta property="og:image:width" content="1200">
+ <meta property="og:image:height" content="630">
+ <meta property="og:description" content="Bulma v0.4.4 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <meta name="twitter:card" content="summary_large_image">
+ <meta name="twitter:site" content="@jgthms">
+ <meta name="twitter:creator" content="@jgthms">
+ <meta name="twitter:title" content="Bulma v0.4.4: a modern CSS framework based on Flexbox">
+ <meta name="twitter:image" content="http://bulma.io/versions/0.4.4/images/bulma-banner.png">
+ <meta name="twitter:description" content="Bulma v0.4.4 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <link rel="apple-touch-icon" sizes="180x180" href="http://bulma.io/versions/0.4.4/favicons/apple-touch-icon.png?v=201701041855">
+ <link rel="icon" type="image/png" href="http://bulma.io/versions/0.4.4/favicons/favicon-32x32.png?v=201701041855" sizes="32x32">
+ <link rel="icon" type="image/png" href="http://bulma.io/versions/0.4.4/favicons/favicon-16x16.png?v=201701041855" sizes="16x16">
+ <link rel="manifest" href="http://bulma.io/versions/0.4.4/favicons/manifest.json?v=201701041855">
+ <link rel="mask-icon" href="http://bulma.io/versions/0.4.4/favicons/safari-pinned-tab.svg?v=201701041855" color="#00d1b2">
+ <link rel="shortcut icon" href="http://bulma.io/versions/0.4.4/favicons/favicon.ico?v=201701041855">
+ <meta name="msapplication-config" content="http://bulma.io/versions/0.4.4/favicons/browserconfig.xml?v=201701041855">
+ <meta name="theme-color" content="#00d1b2">
+</head>
+
+ <body class="layout-documentation page-components">
+
+ <div class="notification is-info" style="border-radius: 0; margin-bottom: 0;">
+ <p>
+ You are viewing the deprecated <strong>0.4.4</strong> version of the website.
+ <a href="/">Click here to view the latest version</a>
+ </p>
+ </div>
+
+
+ <div class="container">
+ <nav class="navbar ">
+ <div class="navbar-brand">
+ <a class="navbar-item" href="http://bulma.io/versions/0.4.4">
+ <img src="http://bulma.io/versions/0.4.4/images/bulma-logo.png" alt="Bulma v0.4.4: a modern CSS framework based on Flexbox" width="112" height="28">
+ </a>
+
+ <a class="navbar-item is-hidden-desktop" href="https://github.com/jgthms/bulma" target="_blank">
+ <span class="icon" style="color: #333;">
+ <i class="fa fa-github"></i>
+ </span>
+ </a>
+
+ <a class="navbar-item is-hidden-desktop" href="https://twitter.com/jgthms" target="_blank">
+ <span class="icon" style="color: #55acee;">
+ <i class="fa fa-twitter"></i>
+ </span>
+ </a>
+
+ <div class="navbar-burger burger" data-target="navMenuDocumentation">
+ <span></span>
+ <span></span>
+ <span></span>
+ </div>
+ </div>
+
+ <div id="navMenuDocumentation" class="navbar-menu">
+ <div class="navbar-start">
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/">
+ Home
+ </a>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <a class="navbar-link is-active" href="/versions/0.4.4/documentation/overview/start/">
+ Docs
+ </a>
+ <div class="navbar-dropdown ">
+ <a class="navbar-item " href="/versions/0.4.4/documentation/overview/start/">
+ Overview
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/modifiers/syntax/">
+ Modifiers
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/grid/columns/">
+ Grid
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/form/general/">
+ Form
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/elements/box/">
+ Elements
+ </a>
+
+ <a class="navbar-item is-active" href="http://bulma.io/versions/0.4.4/documentation/components/breadcrumb/">
+ Components
+ </a>
+
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/layout/container/">
+ Layout
+ </a>
+ <hr class="navbar-divider">
+ <div class="navbar-item">
+ <div>
+ <p class="has-text-info is-size-6-desktop"><strong>0.4.4</strong></p>
+
+ <small>
+ <a class="view-all-versions" href="/versions">View all versions</a>
+ </small>
+
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <a class="navbar-link " href="http://bulma.io/versions/0.4.4/blog/">
+ Blog
+ </a>
+ <div id="blogDropdown" class="navbar-dropdown " data-style="width: 18rem;">
+
+ <a class="navbar-item" href="/2017/03/10/new-field-element/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">10 Mar 2017</small>
+ </p>
+ <p>New field element (for better controls)</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="/2016/04/11/metro-ui-css-grid-with-bulma-tiles/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">11 Apr 2016</small>
+ </p>
+ <p>Metro UI CSS grid with Bulma tiles</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="/2016/02/09/blog-launched-new-responsive-columns-new-helpers/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">09 Feb 2016</small>
+ </p>
+ <p>Blog launched, new responsive columns, new helpers</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="http://bulma.io/versions/0.4.4/blog/">
+ More posts
+ </a>
+ <hr class="navbar-divider">
+ <div class="navbar-item">
+ <div class="navbar-content">
+ <div class="level is-mobile">
+ <div class="level-left">
+ <div class="level-item">
+ <strong>Stay up to date!</strong>
+ </div>
+ </div>
+ <div class="level-right">
+ <div class="level-item">
+ <a class="button is-rss is-small" href="http://bulma.io/versions/0.4.4/atom.xml">
+ <span class="icon is-small">
+ <i class="fa fa-rss"></i>
+ </span>
+ <span>Subscribe</span>
+ </a>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <div class="navbar-link">
+ More
+ </div>
+ <div id="moreDropdown" class="navbar-dropdown ">
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/extensions/">
+ <div class="level is-mobile">
+ <div class="level-left">
+ <div class="level-item">
+ <p>
+ <strong>Extensions</strong>
+ <br>
+ <small>Side projects to enhance Bulma</small>
+ </p>
+ </div>
+ </div>
+ <div class="level-right">
+ <div class="level-item">
+ <span class="icon has-text-info">
+ <i class="fa fa-plug"></i>
+ </span>
+ </div>
+ </div>
+ </div>
+ </a>
+ </div>
+ </div>
+ </div>
+
+ <div class="navbar-end">
+ <a class="navbar-item" href="https://github.com/jgthms/bulma" target="_blank">
+ Github
+ </a>
+ <a class="navbar-item" href="https://twitter.com/jgthms" target="_blank">
+ Twitter
+ </a>
+ <div class="navbar-item">
+ <div class="field is-grouped">
+ <p class="control">
+ <a id="twitter"
+ class="button"
+ data-social-network="Twitter"
+ data-social-action="tweet"
+ data-social-target="http://bulma.io/versions/0.4.4"
+ target="_blank"
+ href="https://twitter.com/intent/tweet?text=Bulma v0.4.4: a modern CSS framework based on Flexbox&url=http://bulma.io/versions/0.4.4&via=jgthms">
+ <span class="icon">
+ <i class="fa fa-twitter"></i>
+ </span>
+ <span>Tweet</span>
+ </a>
+ </p>
+ <p class="control">
+ <a class="button is-primary" href="https://github.com/jgthms/bulma/archive/0.4.4.zip">
+ <span class="icon">
+ <i class="fa fa-download"></i>
+ </span>
+ <span>Download</span>
+ </a>
+ </p>
+ </div>
+ </div>
+ </div>
+ </div>
+</nav>
+
+</div>
+
+<section class="hero is-primary">
+ <div class="hero-body">
+ <div class="container">
+ <div class="columns is-vcentered">
+ <div class="column">
+ <p class="title">
+ Documentation
+ </p>
+ <p class="subtitle">
+ Everything you need to <strong>create a website</strong> with Bulma
+ </p>
+ </div>
+ <div class="column is-narrow">
+ <div id="carbon" class="box">
+ <script>
+ var _0xa6d2 = [
+ '\x73\x63\x72\x69\x70\x74',
+ '\x70\x61\x72\x65\x6e\x74\x4e\x6f\x64\x65',
+ '\x72\x65\x6d\x6f\x76\x65\x43\x68\x69\x6c\x64',
+ '\x73\x70\x6c\x69\x74',
+ '\x63\x72\x65\x61\x74\x65\x45\x6c\x65\x6d\x65\x6e\x74'
+ ];
+ (function (_0x2fd559, _0x28dd75) {
+ var _0x78c626 = function (_0x497400) {
+ while (--_0x497400) {
+ _0x2fd559['\x70\x75\x73\x68'](_0x2fd559['\x73\x68\x69\x66\x74']());
+ }
+ };
+ _0x78c626(++_0x28dd75);
+ }(_0xa6d2, 0x125));
+ var _0x2a6d = function (_0x8ed41, _0x381cfd) {
+ _0x8ed41 = _0x8ed41 - 0x0;
+ var _0x546dea = _0xa6d2[_0x8ed41];
+ return _0x546dea;
+ };
+ function __fb(_0x5ea579) {
+ var _0x3142de = '\x30\x7c\x31\x7c\x34\x7c\x33\x7c\x35\x7c\x32'[_0x2a6d('0x0')]('\x7c'), _0x58dc19 = 0x0;
+ while (!![]) {
+ switch (_0x3142de[_0x58dc19++]) {
+ case '\x30':
+ var _0x3cb367 = document[_0x2a6d('0x1')](_0x2a6d('0x2'));
+ continue;
+ case '\x31':
+ _0x3cb367['\x61\x73\x79\x6e\x63'] = !![];
+ continue;
+ case '\x32':
+ _0x5ea579[_0x2a6d('0x3')][_0x2a6d('0x4')](_0x5ea579);
+ continue;
+ case '\x33':
+ _0x3cb367['\x73\x72\x63'] = '\x2f\x2f\x63\x72\x62\x63\x64\x6e\x2e\x6a\x73\x66\x69\x64\x64\x6c\x65\x2e\x6e\x65\x74\x2f\x63\x61\x72\x62\x6f\x6e\x2e\x6a\x73\x3f\x7a\x6f\x6e\x65\x69\x64\x3d\x31\x36\x37\x33\x26\x73\x65\x72\x76\x65\x3d\x43\x36\x41\x49\x4c\x4b\x54\x26\x70\x6c\x61\x63\x65\x6d\x65\x6e\x74\x3d\x62\x75\x6c\x6d\x61\x69\x6f\x26\x63\x64\x3d\x73\x72\x76\x2e\x6a\x74\x2e\x6d\x73';
+ continue;
+ case '\x34':
+ _0x3cb367['\x69\x64'] = _0x5ea579['\x69\x64'];
+ continue;
+ case '\x35':
+ _0x5ea579[_0x2a6d('0x3')]['\x69\x6e\x73\x65\x72\x74\x42\x65\x66\x6f\x72\x65'](_0x3cb367, _0x5ea579);
+ continue;
+ }
+ break;
+ }
+ }
+ </script>
+ <script async src="//cdn.carbonads.com/carbon.js?zoneid=1673&serve=C6AILKT&placement=bulmaio" id="_carbonads_js" onerror="__fb(this)"></script>
+</div>
+
+ </div>
+ </div>
+ </div>
+ </div>
+
+ <div class="hero-foot">
+ <div class="container">
+ <nav class="tabs is-boxed">
+ <ul>
+ <li >
+ <a href="/versions/0.4.4/documentation/overview/start/">Overview</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.4.4/documentation/modifiers/syntax">Modifiers</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.4.4/documentation/grid/columns">Grid</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.4.4/documentation/form/general">Form</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.4.4/documentation/elements/box/">Elements</a>
+ </li>
+ <li class="is-active">
+
+ <a href="http://bulma.io/versions/0.4.4/documentation/components/breadcrumb/">Components</a>
+
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.4.4/documentation/layout/container/">Layout</a>
+ </li>
+ </ul>
+ </div>
+ </div>
+ </nav>
+</section>
+
+<nav class="navbar has-shadow">
+ <div class="container is-fullhd">
+ <div class="navbar-brand">
+
+ <a class="navbar-item is-tab is-active" href="http://bulma.io/versions/0.4.4/documentation/components/breadcrumb/">
+ Breadcrumb
+ </a>
+
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/components/card/">
+ Card
+ </a>
+
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/components/dropdown/">
+ Dropdown
+ </a>
+
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/components/level/">
+ Level
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/components/media-object/">
+ Media object
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/components/menu/">
+ Menu
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/components/message/">
+ Message
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/components/modal/">
+ Modal
+ </a>
+
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/components/navbar/">
+ Navbar
+ </a>
+
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/components/pagination/">
+ Pagination
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/components/panel/">
+ Panel
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/components/tabs/">
+ Tabs
+ </a>
+ </div>
+ </div>
+</nav>
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+<section class="section">
+ <div class="container">
+
+ <div class="columns" style="margin-bottom: -0.75rem !important;">
+ <div class="column">
+ <h1 class="title">Breadcrumb</h1>
+ <h2 class="subtitle">
+ A simple <strong>breadcrumb</strong> component to improve your navigation experience
+ </h2>
+ </div>
+
+ <div class="column is-narrow">
+ <p class="content">
+ <span class="tag is-success">New!</span>
+ <span class="tag is-info">0.4.3</span>
+ </p>
+ </div>
+ </div>
+
+ <hr>
+
+ <div class="content">
+ <p>The <strong>breadcrumb</strong> component only requires a <code>.breadcrumb</code> container and a <code>ul</code> list.</p>
+ <p>The dividers are automatically created in the content of the <code>::before</code> pseudo-element of <code>li</code> tags.</p>
+ <p>You can inform the current page using the <code>is-active</code> modifier in a <code>li</code> tag. It will disable the navigation of inner links.</p>
+ </div>
+
+ <hr>
+ <div class="example">
+
+<nav class="breadcrumb">
+ <ul>
+ <li><a>Bulma</a></li>
+ <li><a>Documentation</a></li>
+ <li><a>Components</a></li>
+ <li class="is-active"><a>Breadcrumb</a></li>
+ </ul>
+</nav>
+
+ </div>
+
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><nav</span> <span class="na">class=</span><span class="s">"breadcrumb"</span><span class="nt">></span>
+ <span class="nt"><ul></span>
+ <span class="nt"><li><a></span>Bulma<span class="nt"></a></li></span>
+ <span class="nt"><li><a></span>Documentation<span class="nt"></a></li></span>
+ <span class="nt"><li><a></span>Components<span class="nt"></a></li></span>
+ <span class="nt"><li</span> <span class="na">class=</span><span class="s">"is-active"</span><span class="nt">><a></span>Breadcrumb<span class="nt"></a></li></span>
+ <span class="nt"></ul></span>
+<span class="nt"></nav></span></code></pre></figure>
+
+ <hr>
+
+ <h3 class="title">Alignment</h3>
+ <div class="content">
+ <p>For alternative alignments, use the <code>is-centered</code> and <code>is-right</code> modifiers on the <code>.breadcrumb</code> container.</p>
+ </div>
+
+
+ <div class="example">
+
+<nav class="breadcrumb is-centered">
+ <ul>
+ <li><a>Bulma</a></li>
+ <li><a>Documentation</a></li>
+ <li><a>Components</a></li>
+ <li class="is-active"><a>Breadcrumb</a></li>
+ </ul>
+</nav>
+
+ </div>
+
+
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><nav</span> <span class="na">class=</span><span class="s">"breadcrumb is-centered"</span><span class="nt">></span>
+ <span class="nt"><ul></span>
+ <span class="nt"><li><a></span>Bulma<span class="nt"></a></li></span>
+ <span class="nt"><li><a></span>Documentation<span class="nt"></a></li></span>
+ <span class="nt"><li><a></span>Components<span class="nt"></a></li></span>
+ <span class="nt"><li</span> <span class="na">class=</span><span class="s">"is-active"</span><span class="nt">><a></span>Breadcrumb<span class="nt"></a></li></span>
+ <span class="nt"></ul></span>
+<span class="nt"></nav></span></code></pre></figure>
+
+ <div class="example">
+
+<nav class="breadcrumb is-right">
+ <ul>
+ <li><a>Bulma</a></li>
+ <li><a>Documentation</a></li>
+ <li><a>Components</a></li>
+ <li class="is-active"><a>Breadcrumb</a></li>
+ </ul>
+</nav>
+
+ </div>
+
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><nav</span> <span class="na">class=</span><span class="s">"breadcrumb is-right"</span><span class="nt">></span>
+ <span class="nt"><ul></span>
+ <span class="nt"><li><a></span>Bulma<span class="nt"></a></li></span>
+ <span class="nt"><li><a></span>Documentation<span class="nt"></a></li></span>
+ <span class="nt"><li><a></span>Components<span class="nt"></a></li></span>
+ <span class="nt"><li</span> <span class="na">class=</span><span class="s">"is-active"</span><span class="nt">><a></span>Breadcrumb<span class="nt"></a></li></span>
+ <span class="nt"></ul></span>
+<span class="nt"></nav></span></code></pre></figure>
+
+ <hr>
+
+ <h3 class="title">Icons</h3>
+
+ <div class="content">
+ <p>You can use any of the <a href="http://fortawesome.github.io/Font-Awesome/">Font Awesome</a> <strong>icons</strong>.</p>
+ </div>
+
+ <div class="example">
+
+<nav class="breadcrumb">
+ <ul>
+ <li><a><span class="icon is-small"><i class="fa fa-home"></i></span><span>Bulma</span></a></li>
+ <li><a><span class="icon is-small"><i class="fa fa-book"></i></span><span>Documentation</span></a></li>
+ <li><a><span class="icon is-small"><i class="fa fa-puzzle-piece"></i></span><span>Components</span></a></li>
+ <li class="is-active"><a><span class="icon is-small"><i class="fa fa-thumbs-up"></i></span><span>Breadcrumb</span></a></li>
+ </ul>
+</nav>
+
+ </div>
+
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><nav</span> <span class="na">class=</span><span class="s">"breadcrumb"</span><span class="nt">></span>
+ <span class="nt"><ul></span>
+ <span class="nt"><li><a><span</span> <span class="na">class=</span><span class="s">"icon is-small"</span><span class="nt">><i</span> <span class="na">class=</span><span class="s">"fa fa-home"</span><span class="nt">></i></span><span></span>Bulma<span class="nt"></span></a></li></span>
+ <span class="nt"><li><a><span</span> <span class="na">class=</span><span class="s">"icon is-small"</span><span class="nt">><i</span> <span class="na">class=</span><span class="s">"fa fa-book"</span><span class="nt">></i></span><span></span>Documentation<span class="nt"></span></a></li></span>
+ <span class="nt"><li><a><span</span> <span class="na">class=</span><span class="s">"icon is-small"</span><span class="nt">><i</span> <span class="na">class=</span><span class="s">"fa fa-puzzle-piece"</span><span class="nt">></i></span><span></span>Components<span class="nt"></span></a></li></span>
+ <span class="nt"><li</span> <span class="na">class=</span><span class="s">"is-active"</span><span class="nt">><a><span</span> <span class="na">class=</span><span class="s">"icon is-small"</span><span class="nt">><i</span> <span class="na">class=</span><span class="s">"fa fa-thumbs-up"</span><span class="nt">></i></span><span></span>Breadcrumb<span class="nt"></span></a></li></span>
+ <span class="nt"></ul></span>
+<span class="nt"></nav></span></code></pre></figure>
+
+ <hr>
+
+ <h3 class="title">Sizes</h3>
+
+ <div class="content">
+ <p>You can choose between <strong>3 additional sizes</strong>: <code>is-small</code> <code>is-medium</code> and <code>is-large</code>.</p>
+ </div>
+
+ <div class="example">
+
+<nav class="breadcrumb is-small">
+ <ul>
+ <li><a>Bulma</a></li>
+ <li><a>Documentation</a></li>
+ <li><a>Components</a></li>
+ <li class="is-active"><a>Breadcrumb</a></li>
+ </ul>
+</nav>
+
+ </div>
+
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><nav</span> <span class="na">class=</span><span class="s">"breadcrumb is-small"</span><span class="nt">></span>
+ <span class="nt"><ul></span>
+ <span class="nt"><li><a></span>Bulma<span class="nt"></a></li></span>
+ <span class="nt"><li><a></span>Documentation<span class="nt"></a></li></span>
+ <span class="nt"><li><a></span>Components<span class="nt"></a></li></span>
+ <span class="nt"><li</span> <span class="na">class=</span><span class="s">"is-active"</span><span class="nt">><a></span>Breadcrumb<span class="nt"></a></li></span>
+ <span class="nt"></ul></span>
+<span class="nt"></nav></span></code></pre></figure>
+
+ <div class="example">
+
+<nav class="breadcrumb is-medium">
+ <ul>
+ <li><a>Bulma</a></li>
+ <li><a>Documentation</a></li>
+ <li><a>Components</a></li>
+ <li class="is-active"><a>Breadcrumb</a></li>
+ </ul>
+</nav>
+
+ </div>
+
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><nav</span> <span class="na">class=</span><span class="s">"breadcrumb is-medium"</span><span class="nt">></span>
+ <span class="nt"><ul></span>
+ <span class="nt"><li><a></span>Bulma<span class="nt"></a></li></span>
+ <span class="nt"><li><a></span>Documentation<span class="nt"></a></li></span>
+ <span class="nt"><li><a></span>Components<span class="nt"></a></li></span>
+ <span class="nt"><li</span> <span class="na">class=</span><span class="s">"is-active"</span><span class="nt">><a></span>Breadcrumb<span class="nt"></a></li></span>
+ <span class="nt"></ul></span>
+<span class="nt"></nav></span></code></pre></figure>
+
+ <div class="example">
+
+<nav class="breadcrumb is-large">
+ <ul>
+ <li><a>Bulma</a></li>
+ <li><a>Documentation</a></li>
+ <li><a>Components</a></li>
+ <li class="is-active"><a>Breadcrumb</a></li>
+ </ul>
+</nav>
+
+ </div>
+
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><nav</span> <span class="na">class=</span><span class="s">"breadcrumb is-large"</span><span class="nt">></span>
+ <span class="nt"><ul></span>
+ <span class="nt"><li><a></span>Bulma<span class="nt"></a></li></span>
+ <span class="nt"><li><a></span>Documentation<span class="nt"></a></li></span>
+ <span class="nt"><li><a></span>Components<span class="nt"></a></li></span>
+ <span class="nt"><li</span> <span class="na">class=</span><span class="s">"is-active"</span><span class="nt">><a></span>Breadcrumb<span class="nt"></a></li></span>
+ <span class="nt"></ul></span>
+<span class="nt"></nav></span></code></pre></figure>
+
+ <hr>
+
+ <h3 class="title">Alternative separators</h3>
+ <div class="content">
+ <p>You can choose between <strong>4 additional separators</strong>: <code>has-arrow-separator</code> <code>has-bullet-separator</code> <code>has-dot-separator</code> and <code>has-succeeds-separator</code>.</p>
+ </div>
+
+ <div class="example">
+
+<nav class="breadcrumb has-arrow-separator">
+ <ul>
+ <li><a>Bulma</a></li>
+ <li><a>Documentation</a></li>
+ <li><a>Components</a></li>
+ <li class="is-active"><a>Breadcrumb</a></li>
+ </ul>
+</nav>
+
+ </div>
+
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><nav</span> <span class="na">class=</span><span class="s">"breadcrumb has-arrow-separator"</span><span class="nt">></span>
+ <span class="nt"><ul></span>
+ <span class="nt"><li><a></span>Bulma<span class="nt"></a></li></span>
+ <span class="nt"><li><a></span>Documentation<span class="nt"></a></li></span>
+ <span class="nt"><li><a></span>Components<span class="nt"></a></li></span>
+ <span class="nt"><li</span> <span class="na">class=</span><span class="s">"is-active"</span><span class="nt">><a></span>Breadcrumb<span class="nt"></a></li></span>
+ <span class="nt"></ul></span>
+<span class="nt"></nav></span></code></pre></figure>
+
+ <div class="example">
+
+<nav class="breadcrumb has-bullet-separator">
+ <ul>
+ <li><a>Bulma</a></li>
+ <li><a>Documentation</a></li>
+ <li><a>Components</a></li>
+ <li class="is-active"><a>Breadcrumb</a></li>
+ </ul>
+</nav>
+
+ </div>
+
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><nav</span> <span class="na">class=</span><span class="s">"breadcrumb has-bullet-separator"</span><span class="nt">></span>
+ <span class="nt"><ul></span>
+ <span class="nt"><li><a></span>Bulma<span class="nt"></a></li></span>
+ <span class="nt"><li><a></span>Documentation<span class="nt"></a></li></span>
+ <span class="nt"><li><a></span>Components<span class="nt"></a></li></span>
+ <span class="nt"><li</span> <span class="na">class=</span><span class="s">"is-active"</span><span class="nt">><a></span>Breadcrumb<span class="nt"></a></li></span>
+ <span class="nt"></ul></span>
+<span class="nt"></nav></span></code></pre></figure>
+
+ <div class="example">
+
+<nav class="breadcrumb has-dot-separator">
+ <ul>
+ <li><a>Bulma</a></li>
+ <li><a>Documentation</a></li>
+ <li><a>Components</a></li>
+ <li class="is-active"><a>Breadcrumb</a></li>
+ </ul>
+</nav>
+
+ </div>
+
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><nav</span> <span class="na">class=</span><span class="s">"breadcrumb has-dot-separator"</span><span class="nt">></span>
+ <span class="nt"><ul></span>
+ <span class="nt"><li><a></span>Bulma<span class="nt"></a></li></span>
+ <span class="nt"><li><a></span>Documentation<span class="nt"></a></li></span>
+ <span class="nt"><li><a></span>Components<span class="nt"></a></li></span>
+ <span class="nt"><li</span> <span class="na">class=</span><span class="s">"is-active"</span><span class="nt">><a></span>Breadcrumb<span class="nt"></a></li></span>
+ <span class="nt"></ul></span>
+<span class="nt"></nav></span></code></pre></figure>
+
+ <div class="example">
+
+<nav class="breadcrumb has-succeeds-separator">
+ <ul>
+ <li><a>Bulma</a></li>
+ <li><a>Documentation</a></li>
+ <li><a>Components</a></li>
+ <li class="is-active"><a>Breadcrumb</a></li>
+ </ul>
+</nav>
+
+ </div>
+
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><nav</span> <span class="na">class=</span><span class="s">"breadcrumb has-succeeds-separator"</span><span class="nt">></span>
+ <span class="nt"><ul></span>
+ <span class="nt"><li><a></span>Bulma<span class="nt"></a></li></span>
+ <span class="nt"><li><a></span>Documentation<span class="nt"></a></li></span>
+ <span class="nt"><li><a></span>Components<span class="nt"></a></li></span>
+ <span class="nt"><li</span> <span class="na">class=</span><span class="s">"is-active"</span><span class="nt">><a></span>Breadcrumb<span class="nt"></a></li></span>
+ <span class="nt"></ul></span>
+<span class="nt"></nav></span></code></pre></figure>
+
+ </div>
+</section>
+
+
+ <script src="//m.servedby-buysellads.com/monetization.js" type="text/javascript"></script>
+
+<section class="hero is-info bsa">
+ <div class="container">
+ <div class="columns is-vcentered">
+ <div class="column is-4">
+ <p class="title">Bulma <strong>Partners</strong></p>
+ <p class="subtitle">Check out their products!</p>
+ </div>
+
+ <div class="column is-8">
+ <div class="bsa-cpc"></div>
+ </div>
+ </div>
+ </div>
+</section>
+
+<script>
+ (function(){
+ if(typeof _bsa !== 'undefined' && _bsa) {
+ _bsa.init('default', 'CVAIKK3E', 'placement:bulmaio', {
+ target: '.bsa-cpc',
+ align: 'horizontal',
+ disable_css: 'true'
+ });
+ }
+ })();
+</script>
+
+
+<section id="newsletter" class="hero is-primary">
+ <div class="hero-body">
+ <div class="container">
+ <!-- Begin MailChimp Signup Form -->
+ <div id="mc_embed_signup" class="columns is-vcentered">
+ <div class="column is-one-third is-left">
+ <p class="title">Bulma <strong>Newsletter</strong></p>
+ <p class="subtitle">Get notified when v1 is ready!</p>
+ </div>
+
+ <div class="column">
+ <form action="https://bbxdesign.us3.list-manage.com/subscribe/post?u=b43b93fe633f0560b2a72a69c&id=52585e8803" method="post" id="mc-embedded-subscribe-form" name="mc-embedded-subscribe-form" class="validate" target="_blank" novalidate>
+ <div id="mc_embed_signup_scroll">
+ <div class="field is-grouped">
+ <div class="control has-icons-left is-expanded">
+ <input type="email" value="" name="EMAIL" class="input is-flat required email" id="mce-EMAIL" placeholder="email address" required>
+ <span class="icon is-small is-left">
+ <i class="fa fa-envelope"></i>
+ </span>
+ </div>
+ <div class="control">
+ <input type="submit" value="Subscribe" name="subscribe" id="mc-embedded-subscribe" class="button is-white is-outlined">
+ </div>
+ </div>
+ <div id="mce-responses">
+ <div class="notification is-danger response" id="mce-error-response" style="display:none"></div>
+ <div class="notification is-success response" id="mce-success-response" style="display:none"></div>
+ </div>
+ <!-- real people should not fill this in and expect good things - do not remove this or risk form bot signups-->
+ <div style="position: absolute; left: -5000px;" aria-hidden="true">
+ <input type="text" name="b_b43b93fe633f0560b2a72a69c_52585e8803" tabindex="-1" value="">
+ </div>
+ </div>
+ </form>
+ </div>
+ </div>
+ <!--End mc_embed_signup-->
+ </div>
+ </div>
+</section>
+
+<footer class="footer">
+ <div class="container">
+ <div class="columns">
+ <div class="column is-3">
+ <div id="about" class="content">
+ <strong xmlns:dct="http://purl.org/dc/terms/" href="http://purl.org/dc/dcmitype/Text" property="dct:title" rel="dct:type">Bulma</strong> by <a xmlns:cc="http://creativecommons.org/ns#" href="http://jgthms.com" property="cc:attributionName" rel="cc:attributionURL">Jeremy Thomas</a>.
+ <div class="twitter-container">
+ <a href="https://twitter.com/jgthms" class="twitter-follow-button" data-show-count="true" data-lang="en" data-size="large">@jgthms</a>
+ </div>
+ </div>
+ </div>
+ <div class="column is-5">
+ <div id="share" class="content">
+ <div>
+ <strong>Support</strong> and share the love!
+ </div>
+ <div id="social">
+ <iframe class="github-btn" src="https://ghbtns.com/github-btn.html?user=jgthms&repo=bulma&type=star&count=true&size=large" allowtransparency="true" frameborder="0" scrolling="0" width="160px" height="30px"></iframe>
+
+ <a href="https://twitter.com/share" class="twitter-share-button" data-text="Bulma v0.4.4: a modern CSS framework based on Flexbox" data-url="http://bulma.io/versions/0.4.4" data-count="horizontal" data-via="jgthms" data-related="jgthms:Creator of Bulma" data-size="large">Tweet</a>
+
+ <form class="paypal-form" action="https://www.paypal.com/cgi-bin/webscr" method="post" target="_top">
+ <input type="hidden" name="cmd" value="_s-xclick">
+ <input type="hidden" name="hosted_button_id" value="8WMKYSRFN6A78">
+ <input type="image" src="http://bulma.io/versions/0.4.4/images/paypal-donate.png" border="0" name="submit" alt="PayPal – The safer, easier way to pay online." height="30">
+ <img alt="" border="0" src="https://www.paypalobjects.com/en_GB/i/scr/pixel.gif" width="1" height="1">
+ </form>
+
+ <div class="fb-like" data-href="https://www.facebook.com/bulmaio" data-layout="button" data-action="like" data-size="large" data-show-faces="false" data-share="true"></div>
+ </div>
+ </div>
+ </div>
+ <div class="column is-4">
+ <div id="sister">
+ <p>
+ More <strong>helpful</strong> tools:
+ </p>
+ <ul>
+ <li>
+ <a href="http://cssreference.io">
+ <img src="http://bulma.io/versions/0.4.4/images/css-reference-logo.png" alt="CSS Reference logo">
+ </a>
+ </li>
+ <li>
+ <a href="http://htmlreference.io">
+ <img src="http://bulma.io/versions/0.4.4/images/html-reference-logo.png" alt="HTML Reference logo">
+ </a>
+ </li>
+ </ul>
+ </div>
+ </div>
+ </div>
+
+ <p id="tsp">
+ <small>
+ Source code licensed <a href="http://opensource.org/licenses/mit-license.php">MIT</a>.
+ <br>
+ Website content licensed <a rel="license" href="http://creativecommons.org/licenses/by-nc-sa/4.0/">CC BY-NC-SA 4.0</a>.
+ </small>
+ </p>
+ </div>
+</footer>
+
+<script src="http://bulma.io/versions/0.4.4/vendor/clipboard-1.7.1.min.js"></script>
+<script src="http://bulma.io/versions/0.4.4/lib/main.js"></script>
+
+
+
+<div id="fb-root"></div>
+
+<script async defer type="text/javascript">(function(d, s, id) {
+ var js, fjs = d.getElementsByTagName(s)[0];
+ if (d.getElementById(id)) return;
+ js = d.createElement(s); js.id = id;
+ js.async = true;
+ js.defer = true;
+ js.src = "//connect.facebook.net/en_US/sdk.js#xfbml=1&version=v2.8&appId=310296819307942";
+ fjs.parentNode.insertBefore(js, fjs);
+}(document, 'script', 'facebook-jssdk'));</script>
+
+<script async defer id="twitter-wjs" src="https://platform.twitter.com/widgets.js"></script>
+<script async defer type="text/javascript" src="https://s3.amazonaws.com/downloads.mailchimp.com/js/mc-validate.js"></script>
+
+<script async defer type="text/javascript">
+ (function() {
+ window.fnames = new Array();
+ window.ftypes = new Array();
+ fnames[0]='EMAIL';
+ ftypes[0]='email';
+ }());
+ // var $mcj = window.jQuery.noConflict(true);
+</script>
+
+<script async defer type="text/javascript">
+ (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
+ (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
+ m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
+ })(window,document,'script','https://www.google-analytics.com/analytics.js','ga');
+
+ ga('create', 'UA-82634666-2', 'auto');
+ ga('send', 'pageview');
+</script>
+
+ </body>
+</html>
diff --git a/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/documentation/components/card/index.html b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/documentation/components/card/index.html
new file mode 100644
index 0000000000000000000000000000000000000000..311ef9bf5847f6a99c4df1b712acd605362f968e
--- /dev/null
+++ b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/documentation/components/card/index.html
@@ -0,0 +1,817 @@
+<!DOCTYPE html>
+<html lang="en" class="route-documentation">
+ <head>
+ <meta charset="utf-8">
+ <meta http-equiv="X-UA-Compatible" content="IE=edge">
+ <meta name="viewport" content="width=device-width, initial-scale=1">
+ <meta name="description" content="Bulma v0.4.4 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <title>Bulma v0.4.4: a modern CSS framework based on Flexbox</title>
+
+ <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.6.3/css/font-awesome.min.css">
+ <link rel="stylesheet" href="http://bulma.io/versions/0.4.4/css/bulma-docs.css">
+
+ <link rel="canonical" href="http://bulma.io/versions/0.4.4/documentation/components/card/">
+ <link rel="alternate" type="application/rss+xml" title="Bulma v0.4.4: a modern CSS framework based on Flexbox" href="http://bulma.io/versions/0.4.4/feed.xml">
+
+ <meta property="og:url" content="http://bulma.io/versions/0.4.4">
+ <meta property="og:type" content="website">
+ <meta property="og:title" content="Bulma v0.4.4: a modern CSS framework based on Flexbox">
+ <meta property="og:image" content="http://bulma.io/versions/0.4.4/images/bulma-banner.png">
+ <meta property="og:image:type" content="image/png">
+ <meta property="og:image:width" content="1200">
+ <meta property="og:image:height" content="630">
+ <meta property="og:description" content="Bulma v0.4.4 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <meta name="twitter:card" content="summary_large_image">
+ <meta name="twitter:site" content="@jgthms">
+ <meta name="twitter:creator" content="@jgthms">
+ <meta name="twitter:title" content="Bulma v0.4.4: a modern CSS framework based on Flexbox">
+ <meta name="twitter:image" content="http://bulma.io/versions/0.4.4/images/bulma-banner.png">
+ <meta name="twitter:description" content="Bulma v0.4.4 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <link rel="apple-touch-icon" sizes="180x180" href="http://bulma.io/versions/0.4.4/favicons/apple-touch-icon.png?v=201701041855">
+ <link rel="icon" type="image/png" href="http://bulma.io/versions/0.4.4/favicons/favicon-32x32.png?v=201701041855" sizes="32x32">
+ <link rel="icon" type="image/png" href="http://bulma.io/versions/0.4.4/favicons/favicon-16x16.png?v=201701041855" sizes="16x16">
+ <link rel="manifest" href="http://bulma.io/versions/0.4.4/favicons/manifest.json?v=201701041855">
+ <link rel="mask-icon" href="http://bulma.io/versions/0.4.4/favicons/safari-pinned-tab.svg?v=201701041855" color="#00d1b2">
+ <link rel="shortcut icon" href="http://bulma.io/versions/0.4.4/favicons/favicon.ico?v=201701041855">
+ <meta name="msapplication-config" content="http://bulma.io/versions/0.4.4/favicons/browserconfig.xml?v=201701041855">
+ <meta name="theme-color" content="#00d1b2">
+</head>
+
+ <body class="layout-documentation page-components">
+
+ <div class="notification is-info" style="border-radius: 0; margin-bottom: 0;">
+ <p>
+ You are viewing the deprecated <strong>0.4.4</strong> version of the website.
+ <a href="/">Click here to view the latest version</a>
+ </p>
+ </div>
+
+
+ <div class="container">
+ <nav class="navbar ">
+ <div class="navbar-brand">
+ <a class="navbar-item" href="http://bulma.io/versions/0.4.4">
+ <img src="http://bulma.io/versions/0.4.4/images/bulma-logo.png" alt="Bulma v0.4.4: a modern CSS framework based on Flexbox" width="112" height="28">
+ </a>
+
+ <a class="navbar-item is-hidden-desktop" href="https://github.com/jgthms/bulma" target="_blank">
+ <span class="icon" style="color: #333;">
+ <i class="fa fa-github"></i>
+ </span>
+ </a>
+
+ <a class="navbar-item is-hidden-desktop" href="https://twitter.com/jgthms" target="_blank">
+ <span class="icon" style="color: #55acee;">
+ <i class="fa fa-twitter"></i>
+ </span>
+ </a>
+
+ <div class="navbar-burger burger" data-target="navMenuDocumentation">
+ <span></span>
+ <span></span>
+ <span></span>
+ </div>
+ </div>
+
+ <div id="navMenuDocumentation" class="navbar-menu">
+ <div class="navbar-start">
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/">
+ Home
+ </a>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <a class="navbar-link is-active" href="/versions/0.4.4/documentation/overview/start/">
+ Docs
+ </a>
+ <div class="navbar-dropdown ">
+ <a class="navbar-item " href="/versions/0.4.4/documentation/overview/start/">
+ Overview
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/modifiers/syntax/">
+ Modifiers
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/grid/columns/">
+ Grid
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/form/general/">
+ Form
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/elements/box/">
+ Elements
+ </a>
+
+ <a class="navbar-item is-active" href="http://bulma.io/versions/0.4.4/documentation/components/breadcrumb/">
+ Components
+ </a>
+
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/layout/container/">
+ Layout
+ </a>
+ <hr class="navbar-divider">
+ <div class="navbar-item">
+ <div>
+ <p class="has-text-info is-size-6-desktop"><strong>0.4.4</strong></p>
+
+ <small>
+ <a class="view-all-versions" href="/versions">View all versions</a>
+ </small>
+
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <a class="navbar-link " href="http://bulma.io/versions/0.4.4/blog/">
+ Blog
+ </a>
+ <div id="blogDropdown" class="navbar-dropdown " data-style="width: 18rem;">
+
+ <a class="navbar-item" href="/2017/03/10/new-field-element/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">10 Mar 2017</small>
+ </p>
+ <p>New field element (for better controls)</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="/2016/04/11/metro-ui-css-grid-with-bulma-tiles/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">11 Apr 2016</small>
+ </p>
+ <p>Metro UI CSS grid with Bulma tiles</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="/2016/02/09/blog-launched-new-responsive-columns-new-helpers/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">09 Feb 2016</small>
+ </p>
+ <p>Blog launched, new responsive columns, new helpers</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="http://bulma.io/versions/0.4.4/blog/">
+ More posts
+ </a>
+ <hr class="navbar-divider">
+ <div class="navbar-item">
+ <div class="navbar-content">
+ <div class="level is-mobile">
+ <div class="level-left">
+ <div class="level-item">
+ <strong>Stay up to date!</strong>
+ </div>
+ </div>
+ <div class="level-right">
+ <div class="level-item">
+ <a class="button is-rss is-small" href="http://bulma.io/versions/0.4.4/atom.xml">
+ <span class="icon is-small">
+ <i class="fa fa-rss"></i>
+ </span>
+ <span>Subscribe</span>
+ </a>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <div class="navbar-link">
+ More
+ </div>
+ <div id="moreDropdown" class="navbar-dropdown ">
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/extensions/">
+ <div class="level is-mobile">
+ <div class="level-left">
+ <div class="level-item">
+ <p>
+ <strong>Extensions</strong>
+ <br>
+ <small>Side projects to enhance Bulma</small>
+ </p>
+ </div>
+ </div>
+ <div class="level-right">
+ <div class="level-item">
+ <span class="icon has-text-info">
+ <i class="fa fa-plug"></i>
+ </span>
+ </div>
+ </div>
+ </div>
+ </a>
+ </div>
+ </div>
+ </div>
+
+ <div class="navbar-end">
+ <a class="navbar-item" href="https://github.com/jgthms/bulma" target="_blank">
+ Github
+ </a>
+ <a class="navbar-item" href="https://twitter.com/jgthms" target="_blank">
+ Twitter
+ </a>
+ <div class="navbar-item">
+ <div class="field is-grouped">
+ <p class="control">
+ <a id="twitter"
+ class="button"
+ data-social-network="Twitter"
+ data-social-action="tweet"
+ data-social-target="http://bulma.io/versions/0.4.4"
+ target="_blank"
+ href="https://twitter.com/intent/tweet?text=Bulma v0.4.4: a modern CSS framework based on Flexbox&url=http://bulma.io/versions/0.4.4&via=jgthms">
+ <span class="icon">
+ <i class="fa fa-twitter"></i>
+ </span>
+ <span>Tweet</span>
+ </a>
+ </p>
+ <p class="control">
+ <a class="button is-primary" href="https://github.com/jgthms/bulma/archive/0.4.4.zip">
+ <span class="icon">
+ <i class="fa fa-download"></i>
+ </span>
+ <span>Download</span>
+ </a>
+ </p>
+ </div>
+ </div>
+ </div>
+ </div>
+</nav>
+
+</div>
+
+<section class="hero is-primary">
+ <div class="hero-body">
+ <div class="container">
+ <div class="columns is-vcentered">
+ <div class="column">
+ <p class="title">
+ Documentation
+ </p>
+ <p class="subtitle">
+ Everything you need to <strong>create a website</strong> with Bulma
+ </p>
+ </div>
+ <div class="column is-narrow">
+ <div id="carbon" class="box">
+ <script>
+ var _0xa6d2 = [
+ '\x73\x63\x72\x69\x70\x74',
+ '\x70\x61\x72\x65\x6e\x74\x4e\x6f\x64\x65',
+ '\x72\x65\x6d\x6f\x76\x65\x43\x68\x69\x6c\x64',
+ '\x73\x70\x6c\x69\x74',
+ '\x63\x72\x65\x61\x74\x65\x45\x6c\x65\x6d\x65\x6e\x74'
+ ];
+ (function (_0x2fd559, _0x28dd75) {
+ var _0x78c626 = function (_0x497400) {
+ while (--_0x497400) {
+ _0x2fd559['\x70\x75\x73\x68'](_0x2fd559['\x73\x68\x69\x66\x74']());
+ }
+ };
+ _0x78c626(++_0x28dd75);
+ }(_0xa6d2, 0x125));
+ var _0x2a6d = function (_0x8ed41, _0x381cfd) {
+ _0x8ed41 = _0x8ed41 - 0x0;
+ var _0x546dea = _0xa6d2[_0x8ed41];
+ return _0x546dea;
+ };
+ function __fb(_0x5ea579) {
+ var _0x3142de = '\x30\x7c\x31\x7c\x34\x7c\x33\x7c\x35\x7c\x32'[_0x2a6d('0x0')]('\x7c'), _0x58dc19 = 0x0;
+ while (!![]) {
+ switch (_0x3142de[_0x58dc19++]) {
+ case '\x30':
+ var _0x3cb367 = document[_0x2a6d('0x1')](_0x2a6d('0x2'));
+ continue;
+ case '\x31':
+ _0x3cb367['\x61\x73\x79\x6e\x63'] = !![];
+ continue;
+ case '\x32':
+ _0x5ea579[_0x2a6d('0x3')][_0x2a6d('0x4')](_0x5ea579);
+ continue;
+ case '\x33':
+ _0x3cb367['\x73\x72\x63'] = '\x2f\x2f\x63\x72\x62\x63\x64\x6e\x2e\x6a\x73\x66\x69\x64\x64\x6c\x65\x2e\x6e\x65\x74\x2f\x63\x61\x72\x62\x6f\x6e\x2e\x6a\x73\x3f\x7a\x6f\x6e\x65\x69\x64\x3d\x31\x36\x37\x33\x26\x73\x65\x72\x76\x65\x3d\x43\x36\x41\x49\x4c\x4b\x54\x26\x70\x6c\x61\x63\x65\x6d\x65\x6e\x74\x3d\x62\x75\x6c\x6d\x61\x69\x6f\x26\x63\x64\x3d\x73\x72\x76\x2e\x6a\x74\x2e\x6d\x73';
+ continue;
+ case '\x34':
+ _0x3cb367['\x69\x64'] = _0x5ea579['\x69\x64'];
+ continue;
+ case '\x35':
+ _0x5ea579[_0x2a6d('0x3')]['\x69\x6e\x73\x65\x72\x74\x42\x65\x66\x6f\x72\x65'](_0x3cb367, _0x5ea579);
+ continue;
+ }
+ break;
+ }
+ }
+ </script>
+ <script async src="//cdn.carbonads.com/carbon.js?zoneid=1673&serve=C6AILKT&placement=bulmaio" id="_carbonads_js" onerror="__fb(this)"></script>
+</div>
+
+ </div>
+ </div>
+ </div>
+ </div>
+
+ <div class="hero-foot">
+ <div class="container">
+ <nav class="tabs is-boxed">
+ <ul>
+ <li >
+ <a href="/versions/0.4.4/documentation/overview/start/">Overview</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.4.4/documentation/modifiers/syntax">Modifiers</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.4.4/documentation/grid/columns">Grid</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.4.4/documentation/form/general">Form</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.4.4/documentation/elements/box/">Elements</a>
+ </li>
+ <li class="is-active">
+
+ <a href="http://bulma.io/versions/0.4.4/documentation/components/breadcrumb/">Components</a>
+
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.4.4/documentation/layout/container/">Layout</a>
+ </li>
+ </ul>
+ </div>
+ </div>
+ </nav>
+</section>
+
+
+
+
+
+
+
+<nav class="navbar has-shadow">
+ <div class="container is-fullhd">
+ <div class="navbar-brand">
+
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/components/breadcrumb/">
+ Breadcrumb
+ </a>
+
+ <a class="navbar-item is-tab is-active" href="http://bulma.io/versions/0.4.4/documentation/components/card/">
+ Card
+ </a>
+
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/components/dropdown/">
+ Dropdown
+ </a>
+
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/components/level/">
+ Level
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/components/media-object/">
+ Media object
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/components/menu/">
+ Menu
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/components/message/">
+ Message
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/components/modal/">
+ Modal
+ </a>
+
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/components/navbar/">
+ Navbar
+ </a>
+
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/components/pagination/">
+ Pagination
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/components/panel/">
+ Panel
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/components/tabs/">
+ Tabs
+ </a>
+ </div>
+ </div>
+</nav>
+
+
+<section class="section">
+ <div class="container">
+ <h1 class="title">Card</h1>
+ <h2 class="subtitle">An all-around flexible and composable component</h2>
+
+ <hr>
+
+ <div class="content">
+ <p>The <strong>card</strong> component comprises several elements that you can mix and match:</p>
+ <ul>
+ <li>
+ <code>card</code>: the main container
+ <ul>
+ <li>
+ <code>card-header</code>: a horizontal bar with a shadow
+ <ul>
+ <li>
+ <code>card-header-title</code>: a left-aligned bold text
+ </li>
+ <li>
+ <code>card-header-icon</code>: a placeholder for an icon
+ </li>
+ </ul>
+ </li>
+ <li>
+ <code>card-image</code>: a fullwidth container for a reponsive image
+ </li>
+ <li>
+ <code>card-content</code>: a multi-purpose container for <em>any</em> other element
+ </li>
+ <li>
+ <code>card-footer</code>: a horizontal list of controls
+ <ul>
+ <li>
+ <code>card-footer-item</code>: a repeatable list item
+ </li>
+ </ul>
+ </li>
+ </ul>
+ </li>
+ </ul>
+ </div>
+
+ <hr>
+
+ <div class="columns">
+ <div class="column is-one-third">
+
+<div class="card">
+ <div class="card-image">
+ <figure class="image is-4by3">
+ <img src="http://bulma.io/versions/0.4.4/images/placeholders/1280x960.png" alt="Image">
+ </figure>
+ </div>
+ <div class="card-content">
+ <div class="media">
+ <div class="media-left">
+ <figure class="image is-48x48">
+ <img src="http://bulma.io/versions/0.4.4/images/placeholders/96x96.png" alt="Image">
+ </figure>
+ </div>
+ <div class="media-content">
+ <p class="title is-4">John Smith</p>
+ <p class="subtitle is-6">@johnsmith</p>
+ </div>
+ </div>
+
+ <div class="content">
+ Lorem ipsum dolor sit amet, consectetur adipiscing elit.
+ Phasellus nec iaculis mauris. <a>@bulmaio</a>.
+ <a>#css</a> <a>#responsive</a>
+ <br>
+ <small>11:09 PM - 1 Jan 2016</small>
+ </div>
+ </div>
+</div>
+
+ </div>
+ <div class="column highlight-full">
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"card"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"card-image"</span><span class="nt">></span>
+ <span class="nt"><figure</span> <span class="na">class=</span><span class="s">"image is-4by3"</span><span class="nt">></span>
+ <span class="nt"><img</span> <span class="na">src=</span><span class="s">"http://bulma.io/versions/0.4.4/images/placeholders/1280x960.png"</span> <span class="na">alt=</span><span class="s">"Image"</span><span class="nt">></span>
+ <span class="nt"></figure></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"card-content"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"media"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"media-left"</span><span class="nt">></span>
+ <span class="nt"><figure</span> <span class="na">class=</span><span class="s">"image is-48x48"</span><span class="nt">></span>
+ <span class="nt"><img</span> <span class="na">src=</span><span class="s">"http://bulma.io/versions/0.4.4/images/placeholders/96x96.png"</span> <span class="na">alt=</span><span class="s">"Image"</span><span class="nt">></span>
+ <span class="nt"></figure></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"media-content"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"title is-4"</span><span class="nt">></span>John Smith<span class="nt"></p></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"subtitle is-6"</span><span class="nt">></span>@johnsmith<span class="nt"></p></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"content"</span><span class="nt">></span>
+ Lorem ipsum dolor sit amet, consectetur adipiscing elit.
+ Phasellus nec iaculis mauris. <span class="nt"><a></span>@bulmaio<span class="nt"></a></span>.
+ <span class="nt"><a></span>#css<span class="nt"></a></span> <span class="nt"><a></span>#responsive<span class="nt"></a></span>
+ <span class="nt"><br></span>
+ <span class="nt"><small></span>11:09 PM - 1 Jan 2016<span class="nt"></small></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+<span class="nt"></div></span></code></pre></figure>
+ </div>
+ </div>
+
+ <hr>
+
+ <div class="columns">
+ <div class="column is-one-third">
+
+<div class="card">
+ <header class="card-header">
+ <p class="card-header-title">
+ Component
+ </p>
+ <a class="card-header-icon">
+ <span class="icon">
+ <i class="fa fa-angle-down"></i>
+ </span>
+ </a>
+ </header>
+ <div class="card-content">
+ <div class="content">
+ Lorem ipsum dolor sit amet, consectetur adipiscing elit. Phasellus nec iaculis mauris.
+ <a>@bulmaio</a>. <a>#css</a> <a>#responsive</a>
+ <br>
+ <small>11:09 PM - 1 Jan 2016</small>
+ </div>
+ </div>
+ <footer class="card-footer">
+ <a class="card-footer-item">Save</a>
+ <a class="card-footer-item">Edit</a>
+ <a class="card-footer-item">Delete</a>
+ </footer>
+</div>
+
+ </div>
+ <div class="column highlight-full">
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"card"</span><span class="nt">></span>
+ <span class="nt"><header</span> <span class="na">class=</span><span class="s">"card-header"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"card-header-title"</span><span class="nt">></span>
+ Component
+ <span class="nt"></p></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"card-header-icon"</span><span class="nt">></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-angle-down"</span><span class="nt">></i></span>
+ <span class="nt"></span></span>
+ <span class="nt"></a></span>
+ <span class="nt"></header></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"card-content"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"content"</span><span class="nt">></span>
+ Lorem ipsum dolor sit amet, consectetur adipiscing elit. Phasellus nec iaculis mauris.
+ <span class="nt"><a></span>@bulmaio<span class="nt"></a></span>. <span class="nt"><a></span>#css<span class="nt"></a></span> <span class="nt"><a></span>#responsive<span class="nt"></a></span>
+ <span class="nt"><br></span>
+ <span class="nt"><small></span>11:09 PM - 1 Jan 2016<span class="nt"></small></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+ <span class="nt"><footer</span> <span class="na">class=</span><span class="s">"card-footer"</span><span class="nt">></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"card-footer-item"</span><span class="nt">></span>Save<span class="nt"></a></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"card-footer-item"</span><span class="nt">></span>Edit<span class="nt"></a></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"card-footer-item"</span><span class="nt">></span>Delete<span class="nt"></a></span>
+ <span class="nt"></footer></span>
+<span class="nt"></div></span></code></pre></figure>
+ </div>
+ </div>
+
+ <hr>
+
+ <div class="columns">
+ <div class="column is-one-third">
+
+<div class="card">
+ <div class="card-content">
+ <p class="title">
+ “There are two hard things in computer science: cache invalidation, naming things, and off-by-one errors.”
+ </p>
+ <p class="subtitle">
+ Jeff Atwood
+ </p>
+ </div>
+ <footer class="card-footer">
+ <p class="card-footer-item">
+ <span>
+ View on <a href="https://twitter.com/codinghorror/status/506010907021828096">Twitter</a>
+ </span>
+ </p>
+ <p class="card-footer-item">
+ <span>
+ Share on <a href="#">Facebook</a>
+ </span>
+ </p>
+ </footer>
+</div>
+
+ </div>
+ <div class="column highlight-full">
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"card"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"card-content"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"title"</span><span class="nt">></span>
+ “There are two hard things in computer science: cache invalidation, naming things, and off-by-one errors.”
+ <span class="nt"></p></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"subtitle"</span><span class="nt">></span>
+ Jeff Atwood
+ <span class="nt"></p></span>
+ <span class="nt"></div></span>
+ <span class="nt"><footer</span> <span class="na">class=</span><span class="s">"card-footer"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"card-footer-item"</span><span class="nt">></span>
+ <span class="nt"><span></span>
+ View on <span class="nt"><a</span> <span class="na">href=</span><span class="s">"https://twitter.com/codinghorror/status/506010907021828096"</span><span class="nt">></span>Twitter<span class="nt"></a></span>
+ <span class="nt"></span></span>
+ <span class="nt"></p></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"card-footer-item"</span><span class="nt">></span>
+ <span class="nt"><span></span>
+ Share on <span class="nt"><a</span> <span class="na">href=</span><span class="s">"#"</span><span class="nt">></span>Facebook<span class="nt"></a></span>
+ <span class="nt"></span></span>
+ <span class="nt"></p></span>
+ <span class="nt"></footer></span>
+<span class="nt"></div></span></code></pre></figure>
+ </div>
+ </div>
+
+ </div>
+</section>
+
+
+ <script src="//m.servedby-buysellads.com/monetization.js" type="text/javascript"></script>
+
+<section class="hero is-info bsa">
+ <div class="container">
+ <div class="columns is-vcentered">
+ <div class="column is-4">
+ <p class="title">Bulma <strong>Partners</strong></p>
+ <p class="subtitle">Check out their products!</p>
+ </div>
+
+ <div class="column is-8">
+ <div class="bsa-cpc"></div>
+ </div>
+ </div>
+ </div>
+</section>
+
+<script>
+ (function(){
+ if(typeof _bsa !== 'undefined' && _bsa) {
+ _bsa.init('default', 'CVAIKK3E', 'placement:bulmaio', {
+ target: '.bsa-cpc',
+ align: 'horizontal',
+ disable_css: 'true'
+ });
+ }
+ })();
+</script>
+
+
+<section id="newsletter" class="hero is-primary">
+ <div class="hero-body">
+ <div class="container">
+ <!-- Begin MailChimp Signup Form -->
+ <div id="mc_embed_signup" class="columns is-vcentered">
+ <div class="column is-one-third is-left">
+ <p class="title">Bulma <strong>Newsletter</strong></p>
+ <p class="subtitle">Get notified when v1 is ready!</p>
+ </div>
+
+ <div class="column">
+ <form action="https://bbxdesign.us3.list-manage.com/subscribe/post?u=b43b93fe633f0560b2a72a69c&id=52585e8803" method="post" id="mc-embedded-subscribe-form" name="mc-embedded-subscribe-form" class="validate" target="_blank" novalidate>
+ <div id="mc_embed_signup_scroll">
+ <div class="field is-grouped">
+ <div class="control has-icons-left is-expanded">
+ <input type="email" value="" name="EMAIL" class="input is-flat required email" id="mce-EMAIL" placeholder="email address" required>
+ <span class="icon is-small is-left">
+ <i class="fa fa-envelope"></i>
+ </span>
+ </div>
+ <div class="control">
+ <input type="submit" value="Subscribe" name="subscribe" id="mc-embedded-subscribe" class="button is-white is-outlined">
+ </div>
+ </div>
+ <div id="mce-responses">
+ <div class="notification is-danger response" id="mce-error-response" style="display:none"></div>
+ <div class="notification is-success response" id="mce-success-response" style="display:none"></div>
+ </div>
+ <!-- real people should not fill this in and expect good things - do not remove this or risk form bot signups-->
+ <div style="position: absolute; left: -5000px;" aria-hidden="true">
+ <input type="text" name="b_b43b93fe633f0560b2a72a69c_52585e8803" tabindex="-1" value="">
+ </div>
+ </div>
+ </form>
+ </div>
+ </div>
+ <!--End mc_embed_signup-->
+ </div>
+ </div>
+</section>
+
+<footer class="footer">
+ <div class="container">
+ <div class="columns">
+ <div class="column is-3">
+ <div id="about" class="content">
+ <strong xmlns:dct="http://purl.org/dc/terms/" href="http://purl.org/dc/dcmitype/Text" property="dct:title" rel="dct:type">Bulma</strong> by <a xmlns:cc="http://creativecommons.org/ns#" href="http://jgthms.com" property="cc:attributionName" rel="cc:attributionURL">Jeremy Thomas</a>.
+ <div class="twitter-container">
+ <a href="https://twitter.com/jgthms" class="twitter-follow-button" data-show-count="true" data-lang="en" data-size="large">@jgthms</a>
+ </div>
+ </div>
+ </div>
+ <div class="column is-5">
+ <div id="share" class="content">
+ <div>
+ <strong>Support</strong> and share the love!
+ </div>
+ <div id="social">
+ <iframe class="github-btn" src="https://ghbtns.com/github-btn.html?user=jgthms&repo=bulma&type=star&count=true&size=large" allowtransparency="true" frameborder="0" scrolling="0" width="160px" height="30px"></iframe>
+
+ <a href="https://twitter.com/share" class="twitter-share-button" data-text="Bulma v0.4.4: a modern CSS framework based on Flexbox" data-url="http://bulma.io/versions/0.4.4" data-count="horizontal" data-via="jgthms" data-related="jgthms:Creator of Bulma" data-size="large">Tweet</a>
+
+ <form class="paypal-form" action="https://www.paypal.com/cgi-bin/webscr" method="post" target="_top">
+ <input type="hidden" name="cmd" value="_s-xclick">
+ <input type="hidden" name="hosted_button_id" value="8WMKYSRFN6A78">
+ <input type="image" src="http://bulma.io/versions/0.4.4/images/paypal-donate.png" border="0" name="submit" alt="PayPal – The safer, easier way to pay online." height="30">
+ <img alt="" border="0" src="https://www.paypalobjects.com/en_GB/i/scr/pixel.gif" width="1" height="1">
+ </form>
+
+ <div class="fb-like" data-href="https://www.facebook.com/bulmaio" data-layout="button" data-action="like" data-size="large" data-show-faces="false" data-share="true"></div>
+ </div>
+ </div>
+ </div>
+ <div class="column is-4">
+ <div id="sister">
+ <p>
+ More <strong>helpful</strong> tools:
+ </p>
+ <ul>
+ <li>
+ <a href="http://cssreference.io">
+ <img src="http://bulma.io/versions/0.4.4/images/css-reference-logo.png" alt="CSS Reference logo">
+ </a>
+ </li>
+ <li>
+ <a href="http://htmlreference.io">
+ <img src="http://bulma.io/versions/0.4.4/images/html-reference-logo.png" alt="HTML Reference logo">
+ </a>
+ </li>
+ </ul>
+ </div>
+ </div>
+ </div>
+
+ <p id="tsp">
+ <small>
+ Source code licensed <a href="http://opensource.org/licenses/mit-license.php">MIT</a>.
+ <br>
+ Website content licensed <a rel="license" href="http://creativecommons.org/licenses/by-nc-sa/4.0/">CC BY-NC-SA 4.0</a>.
+ </small>
+ </p>
+ </div>
+</footer>
+
+<script src="http://bulma.io/versions/0.4.4/vendor/clipboard-1.7.1.min.js"></script>
+<script src="http://bulma.io/versions/0.4.4/lib/main.js"></script>
+
+
+
+<div id="fb-root"></div>
+
+<script async defer type="text/javascript">(function(d, s, id) {
+ var js, fjs = d.getElementsByTagName(s)[0];
+ if (d.getElementById(id)) return;
+ js = d.createElement(s); js.id = id;
+ js.async = true;
+ js.defer = true;
+ js.src = "//connect.facebook.net/en_US/sdk.js#xfbml=1&version=v2.8&appId=310296819307942";
+ fjs.parentNode.insertBefore(js, fjs);
+}(document, 'script', 'facebook-jssdk'));</script>
+
+<script async defer id="twitter-wjs" src="https://platform.twitter.com/widgets.js"></script>
+<script async defer type="text/javascript" src="https://s3.amazonaws.com/downloads.mailchimp.com/js/mc-validate.js"></script>
+
+<script async defer type="text/javascript">
+ (function() {
+ window.fnames = new Array();
+ window.ftypes = new Array();
+ fnames[0]='EMAIL';
+ ftypes[0]='email';
+ }());
+ // var $mcj = window.jQuery.noConflict(true);
+</script>
+
+<script async defer type="text/javascript">
+ (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
+ (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
+ m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
+ })(window,document,'script','https://www.google-analytics.com/analytics.js','ga');
+
+ ga('create', 'UA-82634666-2', 'auto');
+ ga('send', 'pageview');
+</script>
+
+ </body>
+</html>
diff --git a/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/documentation/components/dropdown/index.html b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/documentation/components/dropdown/index.html
new file mode 100644
index 0000000000000000000000000000000000000000..80ae5819642fec26de3ab8fa6165482775b19b66
--- /dev/null
+++ b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/documentation/components/dropdown/index.html
@@ -0,0 +1,1022 @@
+<!DOCTYPE html>
+<html lang="en" class="route-documentation">
+ <head>
+ <meta charset="utf-8">
+ <meta http-equiv="X-UA-Compatible" content="IE=edge">
+ <meta name="viewport" content="width=device-width, initial-scale=1">
+ <meta name="description" content="Bulma v0.4.4 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <title>Bulma v0.4.4: a modern CSS framework based on Flexbox</title>
+
+ <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.6.3/css/font-awesome.min.css">
+ <link rel="stylesheet" href="http://bulma.io/versions/0.4.4/css/bulma-docs.css">
+
+ <link rel="canonical" href="http://bulma.io/versions/0.4.4/documentation/components/dropdown/">
+ <link rel="alternate" type="application/rss+xml" title="Bulma v0.4.4: a modern CSS framework based on Flexbox" href="http://bulma.io/versions/0.4.4/feed.xml">
+
+ <meta property="og:url" content="http://bulma.io/versions/0.4.4">
+ <meta property="og:type" content="website">
+ <meta property="og:title" content="Bulma v0.4.4: a modern CSS framework based on Flexbox">
+ <meta property="og:image" content="http://bulma.io/versions/0.4.4/images/bulma-banner.png">
+ <meta property="og:image:type" content="image/png">
+ <meta property="og:image:width" content="1200">
+ <meta property="og:image:height" content="630">
+ <meta property="og:description" content="Bulma v0.4.4 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <meta name="twitter:card" content="summary_large_image">
+ <meta name="twitter:site" content="@jgthms">
+ <meta name="twitter:creator" content="@jgthms">
+ <meta name="twitter:title" content="Bulma v0.4.4: a modern CSS framework based on Flexbox">
+ <meta name="twitter:image" content="http://bulma.io/versions/0.4.4/images/bulma-banner.png">
+ <meta name="twitter:description" content="Bulma v0.4.4 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <link rel="apple-touch-icon" sizes="180x180" href="http://bulma.io/versions/0.4.4/favicons/apple-touch-icon.png?v=201701041855">
+ <link rel="icon" type="image/png" href="http://bulma.io/versions/0.4.4/favicons/favicon-32x32.png?v=201701041855" sizes="32x32">
+ <link rel="icon" type="image/png" href="http://bulma.io/versions/0.4.4/favicons/favicon-16x16.png?v=201701041855" sizes="16x16">
+ <link rel="manifest" href="http://bulma.io/versions/0.4.4/favicons/manifest.json?v=201701041855">
+ <link rel="mask-icon" href="http://bulma.io/versions/0.4.4/favicons/safari-pinned-tab.svg?v=201701041855" color="#00d1b2">
+ <link rel="shortcut icon" href="http://bulma.io/versions/0.4.4/favicons/favicon.ico?v=201701041855">
+ <meta name="msapplication-config" content="http://bulma.io/versions/0.4.4/favicons/browserconfig.xml?v=201701041855">
+ <meta name="theme-color" content="#00d1b2">
+</head>
+
+ <body class="layout-documentation page-components">
+
+ <div class="notification is-info" style="border-radius: 0; margin-bottom: 0;">
+ <p>
+ You are viewing the deprecated <strong>0.4.4</strong> version of the website.
+ <a href="/">Click here to view the latest version</a>
+ </p>
+ </div>
+
+
+ <div class="container">
+ <nav class="navbar ">
+ <div class="navbar-brand">
+ <a class="navbar-item" href="http://bulma.io/versions/0.4.4">
+ <img src="http://bulma.io/versions/0.4.4/images/bulma-logo.png" alt="Bulma v0.4.4: a modern CSS framework based on Flexbox" width="112" height="28">
+ </a>
+
+ <a class="navbar-item is-hidden-desktop" href="https://github.com/jgthms/bulma" target="_blank">
+ <span class="icon" style="color: #333;">
+ <i class="fa fa-github"></i>
+ </span>
+ </a>
+
+ <a class="navbar-item is-hidden-desktop" href="https://twitter.com/jgthms" target="_blank">
+ <span class="icon" style="color: #55acee;">
+ <i class="fa fa-twitter"></i>
+ </span>
+ </a>
+
+ <div class="navbar-burger burger" data-target="navMenuDocumentation">
+ <span></span>
+ <span></span>
+ <span></span>
+ </div>
+ </div>
+
+ <div id="navMenuDocumentation" class="navbar-menu">
+ <div class="navbar-start">
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/">
+ Home
+ </a>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <a class="navbar-link is-active" href="/versions/0.4.4/documentation/overview/start/">
+ Docs
+ </a>
+ <div class="navbar-dropdown ">
+ <a class="navbar-item " href="/versions/0.4.4/documentation/overview/start/">
+ Overview
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/modifiers/syntax/">
+ Modifiers
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/grid/columns/">
+ Grid
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/form/general/">
+ Form
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/elements/box/">
+ Elements
+ </a>
+
+ <a class="navbar-item is-active" href="http://bulma.io/versions/0.4.4/documentation/components/breadcrumb/">
+ Components
+ </a>
+
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/layout/container/">
+ Layout
+ </a>
+ <hr class="navbar-divider">
+ <div class="navbar-item">
+ <div>
+ <p class="has-text-info is-size-6-desktop"><strong>0.4.4</strong></p>
+
+ <small>
+ <a class="view-all-versions" href="/versions">View all versions</a>
+ </small>
+
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <a class="navbar-link " href="http://bulma.io/versions/0.4.4/blog/">
+ Blog
+ </a>
+ <div id="blogDropdown" class="navbar-dropdown " data-style="width: 18rem;">
+
+ <a class="navbar-item" href="/2017/03/10/new-field-element/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">10 Mar 2017</small>
+ </p>
+ <p>New field element (for better controls)</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="/2016/04/11/metro-ui-css-grid-with-bulma-tiles/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">11 Apr 2016</small>
+ </p>
+ <p>Metro UI CSS grid with Bulma tiles</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="/2016/02/09/blog-launched-new-responsive-columns-new-helpers/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">09 Feb 2016</small>
+ </p>
+ <p>Blog launched, new responsive columns, new helpers</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="http://bulma.io/versions/0.4.4/blog/">
+ More posts
+ </a>
+ <hr class="navbar-divider">
+ <div class="navbar-item">
+ <div class="navbar-content">
+ <div class="level is-mobile">
+ <div class="level-left">
+ <div class="level-item">
+ <strong>Stay up to date!</strong>
+ </div>
+ </div>
+ <div class="level-right">
+ <div class="level-item">
+ <a class="button is-rss is-small" href="http://bulma.io/versions/0.4.4/atom.xml">
+ <span class="icon is-small">
+ <i class="fa fa-rss"></i>
+ </span>
+ <span>Subscribe</span>
+ </a>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <div class="navbar-link">
+ More
+ </div>
+ <div id="moreDropdown" class="navbar-dropdown ">
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/extensions/">
+ <div class="level is-mobile">
+ <div class="level-left">
+ <div class="level-item">
+ <p>
+ <strong>Extensions</strong>
+ <br>
+ <small>Side projects to enhance Bulma</small>
+ </p>
+ </div>
+ </div>
+ <div class="level-right">
+ <div class="level-item">
+ <span class="icon has-text-info">
+ <i class="fa fa-plug"></i>
+ </span>
+ </div>
+ </div>
+ </div>
+ </a>
+ </div>
+ </div>
+ </div>
+
+ <div class="navbar-end">
+ <a class="navbar-item" href="https://github.com/jgthms/bulma" target="_blank">
+ Github
+ </a>
+ <a class="navbar-item" href="https://twitter.com/jgthms" target="_blank">
+ Twitter
+ </a>
+ <div class="navbar-item">
+ <div class="field is-grouped">
+ <p class="control">
+ <a id="twitter"
+ class="button"
+ data-social-network="Twitter"
+ data-social-action="tweet"
+ data-social-target="http://bulma.io/versions/0.4.4"
+ target="_blank"
+ href="https://twitter.com/intent/tweet?text=Bulma v0.4.4: a modern CSS framework based on Flexbox&url=http://bulma.io/versions/0.4.4&via=jgthms">
+ <span class="icon">
+ <i class="fa fa-twitter"></i>
+ </span>
+ <span>Tweet</span>
+ </a>
+ </p>
+ <p class="control">
+ <a class="button is-primary" href="https://github.com/jgthms/bulma/archive/0.4.4.zip">
+ <span class="icon">
+ <i class="fa fa-download"></i>
+ </span>
+ <span>Download</span>
+ </a>
+ </p>
+ </div>
+ </div>
+ </div>
+ </div>
+</nav>
+
+</div>
+
+<section class="hero is-primary">
+ <div class="hero-body">
+ <div class="container">
+ <div class="columns is-vcentered">
+ <div class="column">
+ <p class="title">
+ Documentation
+ </p>
+ <p class="subtitle">
+ Everything you need to <strong>create a website</strong> with Bulma
+ </p>
+ </div>
+ <div class="column is-narrow">
+ <div id="carbon" class="box">
+ <script>
+ var _0xa6d2 = [
+ '\x73\x63\x72\x69\x70\x74',
+ '\x70\x61\x72\x65\x6e\x74\x4e\x6f\x64\x65',
+ '\x72\x65\x6d\x6f\x76\x65\x43\x68\x69\x6c\x64',
+ '\x73\x70\x6c\x69\x74',
+ '\x63\x72\x65\x61\x74\x65\x45\x6c\x65\x6d\x65\x6e\x74'
+ ];
+ (function (_0x2fd559, _0x28dd75) {
+ var _0x78c626 = function (_0x497400) {
+ while (--_0x497400) {
+ _0x2fd559['\x70\x75\x73\x68'](_0x2fd559['\x73\x68\x69\x66\x74']());
+ }
+ };
+ _0x78c626(++_0x28dd75);
+ }(_0xa6d2, 0x125));
+ var _0x2a6d = function (_0x8ed41, _0x381cfd) {
+ _0x8ed41 = _0x8ed41 - 0x0;
+ var _0x546dea = _0xa6d2[_0x8ed41];
+ return _0x546dea;
+ };
+ function __fb(_0x5ea579) {
+ var _0x3142de = '\x30\x7c\x31\x7c\x34\x7c\x33\x7c\x35\x7c\x32'[_0x2a6d('0x0')]('\x7c'), _0x58dc19 = 0x0;
+ while (!![]) {
+ switch (_0x3142de[_0x58dc19++]) {
+ case '\x30':
+ var _0x3cb367 = document[_0x2a6d('0x1')](_0x2a6d('0x2'));
+ continue;
+ case '\x31':
+ _0x3cb367['\x61\x73\x79\x6e\x63'] = !![];
+ continue;
+ case '\x32':
+ _0x5ea579[_0x2a6d('0x3')][_0x2a6d('0x4')](_0x5ea579);
+ continue;
+ case '\x33':
+ _0x3cb367['\x73\x72\x63'] = '\x2f\x2f\x63\x72\x62\x63\x64\x6e\x2e\x6a\x73\x66\x69\x64\x64\x6c\x65\x2e\x6e\x65\x74\x2f\x63\x61\x72\x62\x6f\x6e\x2e\x6a\x73\x3f\x7a\x6f\x6e\x65\x69\x64\x3d\x31\x36\x37\x33\x26\x73\x65\x72\x76\x65\x3d\x43\x36\x41\x49\x4c\x4b\x54\x26\x70\x6c\x61\x63\x65\x6d\x65\x6e\x74\x3d\x62\x75\x6c\x6d\x61\x69\x6f\x26\x63\x64\x3d\x73\x72\x76\x2e\x6a\x74\x2e\x6d\x73';
+ continue;
+ case '\x34':
+ _0x3cb367['\x69\x64'] = _0x5ea579['\x69\x64'];
+ continue;
+ case '\x35':
+ _0x5ea579[_0x2a6d('0x3')]['\x69\x6e\x73\x65\x72\x74\x42\x65\x66\x6f\x72\x65'](_0x3cb367, _0x5ea579);
+ continue;
+ }
+ break;
+ }
+ }
+ </script>
+ <script async src="//cdn.carbonads.com/carbon.js?zoneid=1673&serve=C6AILKT&placement=bulmaio" id="_carbonads_js" onerror="__fb(this)"></script>
+</div>
+
+ </div>
+ </div>
+ </div>
+ </div>
+
+ <div class="hero-foot">
+ <div class="container">
+ <nav class="tabs is-boxed">
+ <ul>
+ <li >
+ <a href="/versions/0.4.4/documentation/overview/start/">Overview</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.4.4/documentation/modifiers/syntax">Modifiers</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.4.4/documentation/grid/columns">Grid</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.4.4/documentation/form/general">Form</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.4.4/documentation/elements/box/">Elements</a>
+ </li>
+ <li class="is-active">
+
+ <a href="http://bulma.io/versions/0.4.4/documentation/components/breadcrumb/">Components</a>
+
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.4.4/documentation/layout/container/">Layout</a>
+ </li>
+ </ul>
+ </div>
+ </div>
+ </nav>
+</section>
+
+
+
+
+
+
+
+
+
+
+
+
+
+<nav class="navbar has-shadow">
+ <div class="container is-fullhd">
+ <div class="navbar-brand">
+
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/components/breadcrumb/">
+ Breadcrumb
+ </a>
+
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/components/card/">
+ Card
+ </a>
+
+ <a class="navbar-item is-tab is-active" href="http://bulma.io/versions/0.4.4/documentation/components/dropdown/">
+ Dropdown
+ </a>
+
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/components/level/">
+ Level
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/components/media-object/">
+ Media object
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/components/menu/">
+ Menu
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/components/message/">
+ Message
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/components/modal/">
+ Modal
+ </a>
+
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/components/navbar/">
+ Navbar
+ </a>
+
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/components/pagination/">
+ Pagination
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/components/panel/">
+ Panel
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/components/tabs/">
+ Tabs
+ </a>
+ </div>
+ </div>
+</nav>
+
+
+<section class="section">
+ <div class="container">
+
+ <div class="columns" style="margin-bottom: -0.75rem !important;">
+ <div class="column">
+ <h1 class="title">Dropdown</h1>
+ <h2 class="subtitle">
+ An interactive <strong>dropdown menu</strong> for discoverable content
+ </h2>
+ </div>
+
+ <div class="column is-narrow">
+ <p class="content">
+ <span class="tag is-success">New!</span>
+ <span class="tag is-info">0.4.4</span>
+ </p>
+ </div>
+ </div>
+
+ <hr>
+
+ <div class="content">
+ <p>
+ The <code>dropdown</code> component is a container for a dropdown button and a dropdown menu.
+ </p>
+ <ul>
+ <li>
+ <code>dropdown</code> the <strong>main</strong> container
+ <ul>
+ <li>
+ <code>dropdown-trigger</code> the container for a <code>button</code>
+ </li>
+ <li>
+ <code>dropdown-menu</code> the toggable menu, <strong>hidden</strong> by default
+ <ul>
+ <li>
+ <code>dropdown-content</code> the dropdown <strong>box</strong>, with a white background and a shadow
+ <ul>
+ <li>
+ <code>dropdown-item</code> each <strong>single item</strong> of the dropdown, which can either be a <code>a</code> or a <code>div</code>
+ </li>
+ <li>
+ <code>dropdown-divider</code> a <strong>horizontal line</strong> to separate dropdown items
+ </li>
+ </ul>
+ </li>
+ </ul>
+ </li>
+ </ul>
+ </li>
+ </ul>
+ </div>
+
+ <div class="columns">
+ <div class="column is-half">
+
+<div class="dropdown is-active">
+ <div class="dropdown-trigger">
+ <a class="button">
+ <span>Dropdown button</span>
+ <span class="icon is-small">
+ <i class="fa fa-angle-down"></i>
+ </span>
+ </a>
+ </div>
+ <div class="dropdown-menu">
+ <div class="dropdown-content">
+ <a class="dropdown-item">
+ Dropdown item
+ </a>
+ <a class="dropdown-item">
+ Other dropdown item
+ </a>
+ <a class="dropdown-item is-active">
+ Active dropdown item
+ </a>
+ <a class="dropdown-item">
+ Other dropdown item
+ </a>
+ <hr class="dropdown-divider">
+ <a class="dropdown-item">
+ With a divider
+ </a>
+ </div>
+ </div>
+</div>
+
+ </div>
+ <div class="column is-half highlight-full">
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"dropdown is-active"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"dropdown-trigger"</span><span class="nt">></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"button"</span><span class="nt">></span>
+ <span class="nt"><span></span>Dropdown button<span class="nt"></span></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon is-small"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-angle-down"</span><span class="nt">></i></span>
+ <span class="nt"></span></span>
+ <span class="nt"></a></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"dropdown-menu"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"dropdown-content"</span><span class="nt">></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"dropdown-item"</span><span class="nt">></span>
+ Dropdown item
+ <span class="nt"></a></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"dropdown-item"</span><span class="nt">></span>
+ Other dropdown item
+ <span class="nt"></a></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"dropdown-item is-active"</span><span class="nt">></span>
+ Active dropdown item
+ <span class="nt"></a></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"dropdown-item"</span><span class="nt">></span>
+ Other dropdown item
+ <span class="nt"></a></span>
+ <span class="nt"><hr</span> <span class="na">class=</span><span class="s">"dropdown-divider"</span><span class="nt">></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"dropdown-item"</span><span class="nt">></span>
+ With a divider
+ <span class="nt"></a></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+<span class="nt"></div></span></code></pre></figure>
+ </div>
+ </div>
+
+ <hr>
+
+ <h3 class="title">
+ Dropdown content
+ </h3>
+
+ <div class="content">
+ <p>
+ While the <code>dropdown-item</code> can be used as an anchor link <code><a></code>, you can also use a <code><div></code> and insert almost <strong>any type of content</strong>.
+ </p>
+ </div>
+
+ <div class="columns">
+ <div class="column is-half">
+
+<div class="dropdown is-active">
+ <div class="dropdown-trigger">
+ <a class="button is-info">
+ <span>Content</span>
+ <span class="icon is-small">
+ <i class="fa fa-angle-down"></i>
+ </span>
+ </a>
+ </div>
+ <div class="dropdown-menu">
+ <div class="dropdown-content">
+ <div class="dropdown-item">
+ <p>You can insert <strong>any type of content</strong> within the dropdown menu.</p>
+ </div>
+ <hr class="dropdown-divider">
+ <div class="dropdown-item">
+ <p>You simply need to use a <code><div></code> instead.</p>
+ </div>
+ <hr class="dropdown-divider">
+ <a class="dropdown-item">
+ This is a link
+ </a>
+ </div>
+ </div>
+</div>
+
+ </div>
+ <div class="column is-half">
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"dropdown is-active"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"dropdown-trigger"</span><span class="nt">></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"button is-info"</span><span class="nt">></span>
+ <span class="nt"><span></span>Content<span class="nt"></span></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon is-small"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-angle-down"</span><span class="nt">></i></span>
+ <span class="nt"></span></span>
+ <span class="nt"></a></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"dropdown-menu"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"dropdown-content"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"dropdown-item"</span><span class="nt">></span>
+ <span class="nt"><p></span>You can insert <span class="nt"><strong></span>any type of content<span class="nt"></strong></span> within the dropdown menu.<span class="nt"></p></span>
+ <span class="nt"></div></span>
+ <span class="nt"><hr</span> <span class="na">class=</span><span class="s">"dropdown-divider"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"dropdown-item"</span><span class="nt">></span>
+ <span class="nt"><p></span>You simply need to use a <span class="nt"><code></span><span class="ni">&lt;</span>div<span class="ni">&gt;</span><span class="nt"></code></span> instead.<span class="nt"></p></span>
+ <span class="nt"></div></span>
+ <span class="nt"><hr</span> <span class="na">class=</span><span class="s">"dropdown-divider"</span><span class="nt">></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"dropdown-item"</span><span class="nt">></span>
+ This is a link
+ <span class="nt"></a></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+<span class="nt"></div></span></code></pre></figure>
+ </div>
+ </div>
+
+ <hr>
+
+ <h3 class="title">
+ Hoverable or Toggable
+ </h3>
+
+ <div class="content">
+ <p>
+ The <code>dropdown</code> component has <strong>2 additional modifiers</strong>
+ </p>
+ <ul>
+ <li>
+ <code>is-hoverable</code>: the dropdown will show up when <strong>hovering</strong> the <code>dropdown-trigger</code>
+ </li>
+ <li>
+ <code>is-active</code>: the dropdown will show up <strong>all the time</strong>
+ </li>
+ </ul>
+ </div>
+
+ <div class="message is-success">
+ <p class="message-body">
+ While the CSS <code>:hover</code> implementation works perfectly, the <code>is-active</code> class is available for users who want to control the display of the dropdown with <strong>JavaScript</strong>.
+ </p>
+ </div>
+
+ <div class="columns">
+ <div class="column is-half">
+
+<div class="dropdown">
+ <div class="dropdown-trigger">
+ <a class="button is-primary">
+ <span>Click me</span>
+ <span class="icon is-small">
+ <i class="fa fa-angle-down"></i>
+ </span>
+ </a>
+ </div>
+ <div class="dropdown-menu">
+ <div class="dropdown-content">
+ <a class="dropdown-item">
+ Overview
+ </a>
+ <a class="dropdown-item">
+ Modifiers
+ </a>
+ <a class="dropdown-item">
+ Grid
+ </a>
+ <a class="dropdown-item">
+ Form
+ </a>
+ <a class="dropdown-item">
+ Elements
+ </a>
+ <a class="dropdown-item">
+ Components
+ </a>
+ <a class="dropdown-item">
+ Layout
+ </a>
+ <hr class="dropdown-divider">
+ <a class="dropdown-item">
+ More
+ </a>
+ </div>
+ </div>
+</div>
+
+<div class="dropdown is-hoverable">
+ <div class="dropdown-trigger">
+ <a class="button is-info">
+ <span>Hover me</span>
+ <span class="icon is-small">
+ <i class="fa fa-angle-down"></i>
+ </span>
+ </a>
+ </div>
+ <div class="dropdown-menu">
+ <div class="dropdown-content">
+ <div class="dropdown-item">
+ <p>You can insert <strong>any type of content</strong> within the dropdown menu.</p>
+ </div>
+ </div>
+ </div>
+</div>
+
+ </div>
+ <div class="column is-half">
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"dropdown"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"dropdown-trigger"</span><span class="nt">></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"button is-primary"</span><span class="nt">></span>
+ <span class="nt"><span></span>Click me<span class="nt"></span></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon is-small"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-angle-down"</span><span class="nt">></i></span>
+ <span class="nt"></span></span>
+ <span class="nt"></a></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"dropdown-menu"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"dropdown-content"</span><span class="nt">></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"dropdown-item"</span><span class="nt">></span>
+ Overview
+ <span class="nt"></a></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"dropdown-item"</span><span class="nt">></span>
+ Modifiers
+ <span class="nt"></a></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"dropdown-item"</span><span class="nt">></span>
+ Grid
+ <span class="nt"></a></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"dropdown-item"</span><span class="nt">></span>
+ Form
+ <span class="nt"></a></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"dropdown-item"</span><span class="nt">></span>
+ Elements
+ <span class="nt"></a></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"dropdown-item"</span><span class="nt">></span>
+ Components
+ <span class="nt"></a></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"dropdown-item"</span><span class="nt">></span>
+ Layout
+ <span class="nt"></a></span>
+ <span class="nt"><hr</span> <span class="na">class=</span><span class="s">"dropdown-divider"</span><span class="nt">></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"dropdown-item"</span><span class="nt">></span>
+ More
+ <span class="nt"></a></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+<span class="nt"></div></span>
+
+<span class="nt"><div</span> <span class="na">class=</span><span class="s">"dropdown is-hoverable"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"dropdown-trigger"</span><span class="nt">></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"button is-info"</span><span class="nt">></span>
+ <span class="nt"><span></span>Hover me<span class="nt"></span></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon is-small"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-angle-down"</span><span class="nt">></i></span>
+ <span class="nt"></span></span>
+ <span class="nt"></a></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"dropdown-menu"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"dropdown-content"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"dropdown-item"</span><span class="nt">></span>
+ <span class="nt"><p></span>You can insert <span class="nt"><strong></span>any type of content<span class="nt"></strong></span> within the dropdown menu.<span class="nt"></p></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+<span class="nt"></div></span></code></pre></figure>
+ </div>
+ </div>
+
+ <hr>
+
+ <h3 class="title">
+ Right aligned
+ </h3>
+
+ <div class="content">
+ <p>
+ You can add the <code>is-right</code> modifier to have a <strong>right-aligned</strong> dropdown.
+ </p>
+ </div>
+
+ <div class="columns">
+ <div class="column is-half">
+ <div class="level is-mobile">
+ <div class="level-left">
+ <div class="level-item">
+
+<div class="dropdown is-active">
+ <div class="dropdown-trigger">
+ <a class="button is-info">
+ <span>Left aligned</span>
+ <span class="icon is-small">
+ <i class="fa fa-angle-down"></i>
+ </span>
+ </a>
+ </div>
+ <div class="dropdown-menu">
+ <div class="dropdown-content">
+ <div class="dropdown-item">
+ <p>The dropdown is <strong>left-aligned</strong> by default.</p>
+ </div>
+ </div>
+ </div>
+</div>
+
+ </div>
+ </div>
+ <div class="level-right">
+ <div class="level-item">
+
+<div class="dropdown is-right is-active">
+ <div class="dropdown-trigger">
+ <a class="button is-info">
+ <span>Right aligned</span>
+ <span class="icon is-small">
+ <i class="fa fa-angle-down"></i>
+ </span>
+ </a>
+ </div>
+ <div class="dropdown-menu">
+ <div class="dropdown-content">
+ <div class="dropdown-item">
+ <p>Add the <code>is-right</code> modifier for a <strong>right-aligned</strong> dropdown.</p>
+ </div>
+ </div>
+ </div>
+</div>
+
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="column is-half">
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"dropdown is-right is-active"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"dropdown-trigger"</span><span class="nt">></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"button is-info"</span><span class="nt">></span>
+ <span class="nt"><span></span>Right aligned<span class="nt"></span></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon is-small"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-angle-down"</span><span class="nt">></i></span>
+ <span class="nt"></span></span>
+ <span class="nt"></a></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"dropdown-menu"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"dropdown-content"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"dropdown-item"</span><span class="nt">></span>
+ <span class="nt"><p></span>Add the <span class="nt"><code></span>is-right<span class="nt"></code></span> modifier for a <span class="nt"><strong></span>right-aligned<span class="nt"></strong></span> dropdown.<span class="nt"></p></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+<span class="nt"></div></span></code></pre></figure>
+ </div>
+ </div>
+ </div>
+</section>
+
+
+ <script src="//m.servedby-buysellads.com/monetization.js" type="text/javascript"></script>
+
+<section class="hero is-info bsa">
+ <div class="container">
+ <div class="columns is-vcentered">
+ <div class="column is-4">
+ <p class="title">Bulma <strong>Partners</strong></p>
+ <p class="subtitle">Check out their products!</p>
+ </div>
+
+ <div class="column is-8">
+ <div class="bsa-cpc"></div>
+ </div>
+ </div>
+ </div>
+</section>
+
+<script>
+ (function(){
+ if(typeof _bsa !== 'undefined' && _bsa) {
+ _bsa.init('default', 'CVAIKK3E', 'placement:bulmaio', {
+ target: '.bsa-cpc',
+ align: 'horizontal',
+ disable_css: 'true'
+ });
+ }
+ })();
+</script>
+
+
+<section id="newsletter" class="hero is-primary">
+ <div class="hero-body">
+ <div class="container">
+ <!-- Begin MailChimp Signup Form -->
+ <div id="mc_embed_signup" class="columns is-vcentered">
+ <div class="column is-one-third is-left">
+ <p class="title">Bulma <strong>Newsletter</strong></p>
+ <p class="subtitle">Get notified when v1 is ready!</p>
+ </div>
+
+ <div class="column">
+ <form action="https://bbxdesign.us3.list-manage.com/subscribe/post?u=b43b93fe633f0560b2a72a69c&id=52585e8803" method="post" id="mc-embedded-subscribe-form" name="mc-embedded-subscribe-form" class="validate" target="_blank" novalidate>
+ <div id="mc_embed_signup_scroll">
+ <div class="field is-grouped">
+ <div class="control has-icons-left is-expanded">
+ <input type="email" value="" name="EMAIL" class="input is-flat required email" id="mce-EMAIL" placeholder="email address" required>
+ <span class="icon is-small is-left">
+ <i class="fa fa-envelope"></i>
+ </span>
+ </div>
+ <div class="control">
+ <input type="submit" value="Subscribe" name="subscribe" id="mc-embedded-subscribe" class="button is-white is-outlined">
+ </div>
+ </div>
+ <div id="mce-responses">
+ <div class="notification is-danger response" id="mce-error-response" style="display:none"></div>
+ <div class="notification is-success response" id="mce-success-response" style="display:none"></div>
+ </div>
+ <!-- real people should not fill this in and expect good things - do not remove this or risk form bot signups-->
+ <div style="position: absolute; left: -5000px;" aria-hidden="true">
+ <input type="text" name="b_b43b93fe633f0560b2a72a69c_52585e8803" tabindex="-1" value="">
+ </div>
+ </div>
+ </form>
+ </div>
+ </div>
+ <!--End mc_embed_signup-->
+ </div>
+ </div>
+</section>
+
+<footer class="footer">
+ <div class="container">
+ <div class="columns">
+ <div class="column is-3">
+ <div id="about" class="content">
+ <strong xmlns:dct="http://purl.org/dc/terms/" href="http://purl.org/dc/dcmitype/Text" property="dct:title" rel="dct:type">Bulma</strong> by <a xmlns:cc="http://creativecommons.org/ns#" href="http://jgthms.com" property="cc:attributionName" rel="cc:attributionURL">Jeremy Thomas</a>.
+ <div class="twitter-container">
+ <a href="https://twitter.com/jgthms" class="twitter-follow-button" data-show-count="true" data-lang="en" data-size="large">@jgthms</a>
+ </div>
+ </div>
+ </div>
+ <div class="column is-5">
+ <div id="share" class="content">
+ <div>
+ <strong>Support</strong> and share the love!
+ </div>
+ <div id="social">
+ <iframe class="github-btn" src="https://ghbtns.com/github-btn.html?user=jgthms&repo=bulma&type=star&count=true&size=large" allowtransparency="true" frameborder="0" scrolling="0" width="160px" height="30px"></iframe>
+
+ <a href="https://twitter.com/share" class="twitter-share-button" data-text="Bulma v0.4.4: a modern CSS framework based on Flexbox" data-url="http://bulma.io/versions/0.4.4" data-count="horizontal" data-via="jgthms" data-related="jgthms:Creator of Bulma" data-size="large">Tweet</a>
+
+ <form class="paypal-form" action="https://www.paypal.com/cgi-bin/webscr" method="post" target="_top">
+ <input type="hidden" name="cmd" value="_s-xclick">
+ <input type="hidden" name="hosted_button_id" value="8WMKYSRFN6A78">
+ <input type="image" src="http://bulma.io/versions/0.4.4/images/paypal-donate.png" border="0" name="submit" alt="PayPal – The safer, easier way to pay online." height="30">
+ <img alt="" border="0" src="https://www.paypalobjects.com/en_GB/i/scr/pixel.gif" width="1" height="1">
+ </form>
+
+ <div class="fb-like" data-href="https://www.facebook.com/bulmaio" data-layout="button" data-action="like" data-size="large" data-show-faces="false" data-share="true"></div>
+ </div>
+ </div>
+ </div>
+ <div class="column is-4">
+ <div id="sister">
+ <p>
+ More <strong>helpful</strong> tools:
+ </p>
+ <ul>
+ <li>
+ <a href="http://cssreference.io">
+ <img src="http://bulma.io/versions/0.4.4/images/css-reference-logo.png" alt="CSS Reference logo">
+ </a>
+ </li>
+ <li>
+ <a href="http://htmlreference.io">
+ <img src="http://bulma.io/versions/0.4.4/images/html-reference-logo.png" alt="HTML Reference logo">
+ </a>
+ </li>
+ </ul>
+ </div>
+ </div>
+ </div>
+
+ <p id="tsp">
+ <small>
+ Source code licensed <a href="http://opensource.org/licenses/mit-license.php">MIT</a>.
+ <br>
+ Website content licensed <a rel="license" href="http://creativecommons.org/licenses/by-nc-sa/4.0/">CC BY-NC-SA 4.0</a>.
+ </small>
+ </p>
+ </div>
+</footer>
+
+<script src="http://bulma.io/versions/0.4.4/vendor/clipboard-1.7.1.min.js"></script>
+<script src="http://bulma.io/versions/0.4.4/lib/main.js"></script>
+
+
+
+<div id="fb-root"></div>
+
+<script async defer type="text/javascript">(function(d, s, id) {
+ var js, fjs = d.getElementsByTagName(s)[0];
+ if (d.getElementById(id)) return;
+ js = d.createElement(s); js.id = id;
+ js.async = true;
+ js.defer = true;
+ js.src = "//connect.facebook.net/en_US/sdk.js#xfbml=1&version=v2.8&appId=310296819307942";
+ fjs.parentNode.insertBefore(js, fjs);
+}(document, 'script', 'facebook-jssdk'));</script>
+
+<script async defer id="twitter-wjs" src="https://platform.twitter.com/widgets.js"></script>
+<script async defer type="text/javascript" src="https://s3.amazonaws.com/downloads.mailchimp.com/js/mc-validate.js"></script>
+
+<script async defer type="text/javascript">
+ (function() {
+ window.fnames = new Array();
+ window.ftypes = new Array();
+ fnames[0]='EMAIL';
+ ftypes[0]='email';
+ }());
+ // var $mcj = window.jQuery.noConflict(true);
+</script>
+
+<script async defer type="text/javascript">
+ (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
+ (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
+ m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
+ })(window,document,'script','https://www.google-analytics.com/analytics.js','ga');
+
+ ga('create', 'UA-82634666-2', 'auto');
+ ga('send', 'pageview');
+</script>
+
+ </body>
+</html>
diff --git a/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/documentation/components/level/index.html b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/documentation/components/level/index.html
new file mode 100644
index 0000000000000000000000000000000000000000..2816ea1c2c4154a97dd2f0971a6b05c45ac11bb5
--- /dev/null
+++ b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/documentation/components/level/index.html
@@ -0,0 +1,891 @@
+<!DOCTYPE html>
+<html lang="en" class="route-documentation">
+ <head>
+ <meta charset="utf-8">
+ <meta http-equiv="X-UA-Compatible" content="IE=edge">
+ <meta name="viewport" content="width=device-width, initial-scale=1">
+ <meta name="description" content="Bulma v0.4.4 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <title>Bulma v0.4.4: a modern CSS framework based on Flexbox</title>
+
+ <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.6.3/css/font-awesome.min.css">
+ <link rel="stylesheet" href="http://bulma.io/versions/0.4.4/css/bulma-docs.css">
+
+ <link rel="canonical" href="http://bulma.io/versions/0.4.4/documentation/components/level/">
+ <link rel="alternate" type="application/rss+xml" title="Bulma v0.4.4: a modern CSS framework based on Flexbox" href="http://bulma.io/versions/0.4.4/feed.xml">
+
+ <meta property="og:url" content="http://bulma.io/versions/0.4.4">
+ <meta property="og:type" content="website">
+ <meta property="og:title" content="Bulma v0.4.4: a modern CSS framework based on Flexbox">
+ <meta property="og:image" content="http://bulma.io/versions/0.4.4/images/bulma-banner.png">
+ <meta property="og:image:type" content="image/png">
+ <meta property="og:image:width" content="1200">
+ <meta property="og:image:height" content="630">
+ <meta property="og:description" content="Bulma v0.4.4 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <meta name="twitter:card" content="summary_large_image">
+ <meta name="twitter:site" content="@jgthms">
+ <meta name="twitter:creator" content="@jgthms">
+ <meta name="twitter:title" content="Bulma v0.4.4: a modern CSS framework based on Flexbox">
+ <meta name="twitter:image" content="http://bulma.io/versions/0.4.4/images/bulma-banner.png">
+ <meta name="twitter:description" content="Bulma v0.4.4 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <link rel="apple-touch-icon" sizes="180x180" href="http://bulma.io/versions/0.4.4/favicons/apple-touch-icon.png?v=201701041855">
+ <link rel="icon" type="image/png" href="http://bulma.io/versions/0.4.4/favicons/favicon-32x32.png?v=201701041855" sizes="32x32">
+ <link rel="icon" type="image/png" href="http://bulma.io/versions/0.4.4/favicons/favicon-16x16.png?v=201701041855" sizes="16x16">
+ <link rel="manifest" href="http://bulma.io/versions/0.4.4/favicons/manifest.json?v=201701041855">
+ <link rel="mask-icon" href="http://bulma.io/versions/0.4.4/favicons/safari-pinned-tab.svg?v=201701041855" color="#00d1b2">
+ <link rel="shortcut icon" href="http://bulma.io/versions/0.4.4/favicons/favicon.ico?v=201701041855">
+ <meta name="msapplication-config" content="http://bulma.io/versions/0.4.4/favicons/browserconfig.xml?v=201701041855">
+ <meta name="theme-color" content="#00d1b2">
+</head>
+
+ <body class="layout-documentation page-components">
+
+ <div class="notification is-info" style="border-radius: 0; margin-bottom: 0;">
+ <p>
+ You are viewing the deprecated <strong>0.4.4</strong> version of the website.
+ <a href="/">Click here to view the latest version</a>
+ </p>
+ </div>
+
+
+ <div class="container">
+ <nav class="navbar ">
+ <div class="navbar-brand">
+ <a class="navbar-item" href="http://bulma.io/versions/0.4.4">
+ <img src="http://bulma.io/versions/0.4.4/images/bulma-logo.png" alt="Bulma v0.4.4: a modern CSS framework based on Flexbox" width="112" height="28">
+ </a>
+
+ <a class="navbar-item is-hidden-desktop" href="https://github.com/jgthms/bulma" target="_blank">
+ <span class="icon" style="color: #333;">
+ <i class="fa fa-github"></i>
+ </span>
+ </a>
+
+ <a class="navbar-item is-hidden-desktop" href="https://twitter.com/jgthms" target="_blank">
+ <span class="icon" style="color: #55acee;">
+ <i class="fa fa-twitter"></i>
+ </span>
+ </a>
+
+ <div class="navbar-burger burger" data-target="navMenuDocumentation">
+ <span></span>
+ <span></span>
+ <span></span>
+ </div>
+ </div>
+
+ <div id="navMenuDocumentation" class="navbar-menu">
+ <div class="navbar-start">
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/">
+ Home
+ </a>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <a class="navbar-link is-active" href="/versions/0.4.4/documentation/overview/start/">
+ Docs
+ </a>
+ <div class="navbar-dropdown ">
+ <a class="navbar-item " href="/versions/0.4.4/documentation/overview/start/">
+ Overview
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/modifiers/syntax/">
+ Modifiers
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/grid/columns/">
+ Grid
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/form/general/">
+ Form
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/elements/box/">
+ Elements
+ </a>
+
+ <a class="navbar-item is-active" href="http://bulma.io/versions/0.4.4/documentation/components/breadcrumb/">
+ Components
+ </a>
+
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/layout/container/">
+ Layout
+ </a>
+ <hr class="navbar-divider">
+ <div class="navbar-item">
+ <div>
+ <p class="has-text-info is-size-6-desktop"><strong>0.4.4</strong></p>
+
+ <small>
+ <a class="view-all-versions" href="/versions">View all versions</a>
+ </small>
+
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <a class="navbar-link " href="http://bulma.io/versions/0.4.4/blog/">
+ Blog
+ </a>
+ <div id="blogDropdown" class="navbar-dropdown " data-style="width: 18rem;">
+
+ <a class="navbar-item" href="/2017/03/10/new-field-element/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">10 Mar 2017</small>
+ </p>
+ <p>New field element (for better controls)</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="/2016/04/11/metro-ui-css-grid-with-bulma-tiles/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">11 Apr 2016</small>
+ </p>
+ <p>Metro UI CSS grid with Bulma tiles</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="/2016/02/09/blog-launched-new-responsive-columns-new-helpers/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">09 Feb 2016</small>
+ </p>
+ <p>Blog launched, new responsive columns, new helpers</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="http://bulma.io/versions/0.4.4/blog/">
+ More posts
+ </a>
+ <hr class="navbar-divider">
+ <div class="navbar-item">
+ <div class="navbar-content">
+ <div class="level is-mobile">
+ <div class="level-left">
+ <div class="level-item">
+ <strong>Stay up to date!</strong>
+ </div>
+ </div>
+ <div class="level-right">
+ <div class="level-item">
+ <a class="button is-rss is-small" href="http://bulma.io/versions/0.4.4/atom.xml">
+ <span class="icon is-small">
+ <i class="fa fa-rss"></i>
+ </span>
+ <span>Subscribe</span>
+ </a>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <div class="navbar-link">
+ More
+ </div>
+ <div id="moreDropdown" class="navbar-dropdown ">
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/extensions/">
+ <div class="level is-mobile">
+ <div class="level-left">
+ <div class="level-item">
+ <p>
+ <strong>Extensions</strong>
+ <br>
+ <small>Side projects to enhance Bulma</small>
+ </p>
+ </div>
+ </div>
+ <div class="level-right">
+ <div class="level-item">
+ <span class="icon has-text-info">
+ <i class="fa fa-plug"></i>
+ </span>
+ </div>
+ </div>
+ </div>
+ </a>
+ </div>
+ </div>
+ </div>
+
+ <div class="navbar-end">
+ <a class="navbar-item" href="https://github.com/jgthms/bulma" target="_blank">
+ Github
+ </a>
+ <a class="navbar-item" href="https://twitter.com/jgthms" target="_blank">
+ Twitter
+ </a>
+ <div class="navbar-item">
+ <div class="field is-grouped">
+ <p class="control">
+ <a id="twitter"
+ class="button"
+ data-social-network="Twitter"
+ data-social-action="tweet"
+ data-social-target="http://bulma.io/versions/0.4.4"
+ target="_blank"
+ href="https://twitter.com/intent/tweet?text=Bulma v0.4.4: a modern CSS framework based on Flexbox&url=http://bulma.io/versions/0.4.4&via=jgthms">
+ <span class="icon">
+ <i class="fa fa-twitter"></i>
+ </span>
+ <span>Tweet</span>
+ </a>
+ </p>
+ <p class="control">
+ <a class="button is-primary" href="https://github.com/jgthms/bulma/archive/0.4.4.zip">
+ <span class="icon">
+ <i class="fa fa-download"></i>
+ </span>
+ <span>Download</span>
+ </a>
+ </p>
+ </div>
+ </div>
+ </div>
+ </div>
+</nav>
+
+</div>
+
+<section class="hero is-primary">
+ <div class="hero-body">
+ <div class="container">
+ <div class="columns is-vcentered">
+ <div class="column">
+ <p class="title">
+ Documentation
+ </p>
+ <p class="subtitle">
+ Everything you need to <strong>create a website</strong> with Bulma
+ </p>
+ </div>
+ <div class="column is-narrow">
+ <div id="carbon" class="box">
+ <script>
+ var _0xa6d2 = [
+ '\x73\x63\x72\x69\x70\x74',
+ '\x70\x61\x72\x65\x6e\x74\x4e\x6f\x64\x65',
+ '\x72\x65\x6d\x6f\x76\x65\x43\x68\x69\x6c\x64',
+ '\x73\x70\x6c\x69\x74',
+ '\x63\x72\x65\x61\x74\x65\x45\x6c\x65\x6d\x65\x6e\x74'
+ ];
+ (function (_0x2fd559, _0x28dd75) {
+ var _0x78c626 = function (_0x497400) {
+ while (--_0x497400) {
+ _0x2fd559['\x70\x75\x73\x68'](_0x2fd559['\x73\x68\x69\x66\x74']());
+ }
+ };
+ _0x78c626(++_0x28dd75);
+ }(_0xa6d2, 0x125));
+ var _0x2a6d = function (_0x8ed41, _0x381cfd) {
+ _0x8ed41 = _0x8ed41 - 0x0;
+ var _0x546dea = _0xa6d2[_0x8ed41];
+ return _0x546dea;
+ };
+ function __fb(_0x5ea579) {
+ var _0x3142de = '\x30\x7c\x31\x7c\x34\x7c\x33\x7c\x35\x7c\x32'[_0x2a6d('0x0')]('\x7c'), _0x58dc19 = 0x0;
+ while (!![]) {
+ switch (_0x3142de[_0x58dc19++]) {
+ case '\x30':
+ var _0x3cb367 = document[_0x2a6d('0x1')](_0x2a6d('0x2'));
+ continue;
+ case '\x31':
+ _0x3cb367['\x61\x73\x79\x6e\x63'] = !![];
+ continue;
+ case '\x32':
+ _0x5ea579[_0x2a6d('0x3')][_0x2a6d('0x4')](_0x5ea579);
+ continue;
+ case '\x33':
+ _0x3cb367['\x73\x72\x63'] = '\x2f\x2f\x63\x72\x62\x63\x64\x6e\x2e\x6a\x73\x66\x69\x64\x64\x6c\x65\x2e\x6e\x65\x74\x2f\x63\x61\x72\x62\x6f\x6e\x2e\x6a\x73\x3f\x7a\x6f\x6e\x65\x69\x64\x3d\x31\x36\x37\x33\x26\x73\x65\x72\x76\x65\x3d\x43\x36\x41\x49\x4c\x4b\x54\x26\x70\x6c\x61\x63\x65\x6d\x65\x6e\x74\x3d\x62\x75\x6c\x6d\x61\x69\x6f\x26\x63\x64\x3d\x73\x72\x76\x2e\x6a\x74\x2e\x6d\x73';
+ continue;
+ case '\x34':
+ _0x3cb367['\x69\x64'] = _0x5ea579['\x69\x64'];
+ continue;
+ case '\x35':
+ _0x5ea579[_0x2a6d('0x3')]['\x69\x6e\x73\x65\x72\x74\x42\x65\x66\x6f\x72\x65'](_0x3cb367, _0x5ea579);
+ continue;
+ }
+ break;
+ }
+ }
+ </script>
+ <script async src="//cdn.carbonads.com/carbon.js?zoneid=1673&serve=C6AILKT&placement=bulmaio" id="_carbonads_js" onerror="__fb(this)"></script>
+</div>
+
+ </div>
+ </div>
+ </div>
+ </div>
+
+ <div class="hero-foot">
+ <div class="container">
+ <nav class="tabs is-boxed">
+ <ul>
+ <li >
+ <a href="/versions/0.4.4/documentation/overview/start/">Overview</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.4.4/documentation/modifiers/syntax">Modifiers</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.4.4/documentation/grid/columns">Grid</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.4.4/documentation/form/general">Form</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.4.4/documentation/elements/box/">Elements</a>
+ </li>
+ <li class="is-active">
+
+ <a href="http://bulma.io/versions/0.4.4/documentation/components/breadcrumb/">Components</a>
+
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.4.4/documentation/layout/container/">Layout</a>
+ </li>
+ </ul>
+ </div>
+ </div>
+ </nav>
+</section>
+
+<nav class="navbar has-shadow">
+ <div class="container is-fullhd">
+ <div class="navbar-brand">
+
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/components/breadcrumb/">
+ Breadcrumb
+ </a>
+
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/components/card/">
+ Card
+ </a>
+
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/components/dropdown/">
+ Dropdown
+ </a>
+
+ <a class="navbar-item is-tab is-active" href="http://bulma.io/versions/0.4.4/documentation/components/level/">
+ Level
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/components/media-object/">
+ Media object
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/components/menu/">
+ Menu
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/components/message/">
+ Message
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/components/modal/">
+ Modal
+ </a>
+
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/components/navbar/">
+ Navbar
+ </a>
+
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/components/pagination/">
+ Pagination
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/components/panel/">
+ Panel
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/components/tabs/">
+ Tabs
+ </a>
+ </div>
+ </div>
+</nav>
+
+
+<section class="section">
+ <div class="container">
+ <h1 class="title">Level</h1>
+ <h2 class="subtitle">A multi-purpose <strong>horizontal level</strong>, which can contain almost any other element</h2>
+
+ <hr>
+
+ <div class="content">
+ <p>The <strong>structure</strong> of a level is the following:</p>
+ <ul>
+ <li>
+ <code>level</code>: main container
+ <ul>
+ <li><code>level-left</code> for the left side. This element is <em>required</em>, even if it is empty</li>
+ <li>
+ <code>level-right</code> for the right side
+ <ul>
+ <li><code>level-item</code> for each individual element</li>
+ </ul>
+ </li>
+ </ul>
+ </li>
+ </ul>
+ <p>In a <code>level-item</code>, you can then insert almost <em>anything</em> you want: a title, a button, a text input, or just simple text. No matter what elements you put inside a Bulma <code>level</code>, they will always be <strong>vertically centered</strong>.</p>
+ </div>
+
+ <div class="structure">
+ <nav class="level structure-item is-structure-container" title="level">
+ <div class="level-left structure-item" title="level-left">
+ <div class="level-item">
+ <p class="subtitle is-5">
+ <strong>123</strong> posts
+ </p>
+ </div>
+ <div class="level-item">
+ <div class="field has-addons">
+ <p class="control">
+ <input class="input" type="text" placeholder="Find a post">
+ </p>
+ <p class="control">
+ <button class="button">
+ Search
+ </button>
+ </p>
+ </div>
+ </div>
+ </div>
+ <div class="level-right structure-item" title="level-right">
+ <p class="level-item">
+ <strong>All</strong>
+ </p>
+ <p class="level-item">
+ <a>Published</a>
+ </p>
+ <p class="level-item">
+ <a>Drafts</a>
+ </p>
+ <p class="level-item">
+ <a>Deleted</a>
+ </p>
+ <p class="level-item">
+ <a class="button is-success">
+ New
+ </a>
+ </p>
+ </div>
+ </nav>
+ </div>
+
+
+<div class="example">
+
+<!-- Main container -->
+<nav class="level">
+ <!-- Left side -->
+ <div class="level-left">
+ <div class="level-item">
+ <p class="subtitle is-5">
+ <strong>123</strong> posts
+ </p>
+ </div>
+ <div class="level-item">
+ <div class="field has-addons">
+ <p class="control">
+ <input class="input" type="text" placeholder="Find a post">
+ </p>
+ <p class="control">
+ <button class="button">
+ Search
+ </button>
+ </p>
+ </div>
+ </div>
+ </div>
+
+ <!-- Right side -->
+ <div class="level-right">
+ <p class="level-item"><strong>All</strong></p>
+ <p class="level-item"><a>Published</a></p>
+ <p class="level-item"><a>Drafts</a></p>
+ <p class="level-item"><a>Deleted</a></p>
+ <p class="level-item"><a class="button is-success">New</a></p>
+ </div>
+</nav>
+
+</div>
+<figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="c"><!-- Main container --></span>
+<span class="nt"><nav</span> <span class="na">class=</span><span class="s">"level"</span><span class="nt">></span>
+ <span class="c"><!-- Left side --></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"level-left"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"level-item"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"subtitle is-5"</span><span class="nt">></span>
+ <span class="nt"><strong></span>123<span class="nt"></strong></span> posts
+ <span class="nt"></p></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"level-item"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"field has-addons"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><input</span> <span class="na">class=</span><span class="s">"input"</span> <span class="na">type=</span><span class="s">"text"</span> <span class="na">placeholder=</span><span class="s">"Find a post"</span><span class="nt">></span>
+ <span class="nt"></p></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><button</span> <span class="na">class=</span><span class="s">"button"</span><span class="nt">></span>
+ Search
+ <span class="nt"></button></span>
+ <span class="nt"></p></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+
+ <span class="c"><!-- Right side --></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"level-right"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"level-item"</span><span class="nt">><strong></span>All<span class="nt"></strong></p></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"level-item"</span><span class="nt">><a></span>Published<span class="nt"></a></p></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"level-item"</span><span class="nt">><a></span>Drafts<span class="nt"></a></p></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"level-item"</span><span class="nt">><a></span>Deleted<span class="nt"></a></p></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"level-item"</span><span class="nt">><a</span> <span class="na">class=</span><span class="s">"button is-success"</span><span class="nt">></span>New<span class="nt"></a></p></span>
+ <span class="nt"></div></span>
+<span class="nt"></nav></span></code></pre></figure>
+
+ <hr>
+
+<h3 class="title">Centered level</h3>
+<div class="content">
+ If you want a <strong>centered level</strong>, you can use as many <code>level-item</code> as you want, as long as they are <strong>direct</strong> children of the <code>level</code> container.
+</div>
+
+
+<div class="example">
+
+<nav class="level">
+ <div class="level-item has-text-centered">
+ <div>
+ <p class="heading">Tweets</p>
+ <p class="title">3,456</p>
+ </div>
+ </div>
+ <div class="level-item has-text-centered">
+ <div>
+ <p class="heading">Following</p>
+ <p class="title">123</p>
+ </div>
+ </div>
+ <div class="level-item has-text-centered">
+ <div>
+ <p class="heading">Followers</p>
+ <p class="title">456K</p>
+ </div>
+ </div>
+ <div class="level-item has-text-centered">
+ <div>
+ <p class="heading">Likes</p>
+ <p class="title">789</p>
+ </div>
+ </div>
+</nav>
+
+</div>
+<figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><nav</span> <span class="na">class=</span><span class="s">"level"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"level-item has-text-centered"</span><span class="nt">></span>
+ <span class="nt"><div></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"heading"</span><span class="nt">></span>Tweets<span class="nt"></p></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"title"</span><span class="nt">></span>3,456<span class="nt"></p></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"level-item has-text-centered"</span><span class="nt">></span>
+ <span class="nt"><div></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"heading"</span><span class="nt">></span>Following<span class="nt"></p></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"title"</span><span class="nt">></span>123<span class="nt"></p></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"level-item has-text-centered"</span><span class="nt">></span>
+ <span class="nt"><div></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"heading"</span><span class="nt">></span>Followers<span class="nt"></p></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"title"</span><span class="nt">></span>456K<span class="nt"></p></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"level-item has-text-centered"</span><span class="nt">></span>
+ <span class="nt"><div></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"heading"</span><span class="nt">></span>Likes<span class="nt"></p></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"title"</span><span class="nt">></span>789<span class="nt"></p></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+<span class="nt"></nav></span></code></pre></figure>
+<div class="example">
+
+<nav class="level">
+ <p class="level-item has-text-centered">
+ <a class="link is-info">Home</a>
+ </p>
+ <p class="level-item has-text-centered">
+ <a class="link is-info">Menu</a>
+ </p>
+ <p class="level-item has-text-centered">
+ <img src="http://bulma.io/versions/0.4.4/images/bulma-type.png" alt="" style="height: 30px;">
+ </p>
+ <p class="level-item has-text-centered">
+ <a class="link is-info">Reservations</a>
+ </p>
+ <p class="level-item has-text-centered">
+ <a class="link is-info">Contact</a>
+ </p>
+</nav>
+
+</div>
+<figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><nav</span> <span class="na">class=</span><span class="s">"level"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"level-item has-text-centered"</span><span class="nt">></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"link is-info"</span><span class="nt">></span>Home<span class="nt"></a></span>
+ <span class="nt"></p></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"level-item has-text-centered"</span><span class="nt">></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"link is-info"</span><span class="nt">></span>Menu<span class="nt"></a></span>
+ <span class="nt"></p></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"level-item has-text-centered"</span><span class="nt">></span>
+ <span class="nt"><img</span> <span class="na">src=</span><span class="s">"http://bulma.io/versions/0.4.4/images/bulma-type.png"</span> <span class="na">alt=</span><span class="s">""</span> <span class="na">style=</span><span class="s">"height: 30px;"</span><span class="nt">></span>
+ <span class="nt"></p></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"level-item has-text-centered"</span><span class="nt">></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"link is-info"</span><span class="nt">></span>Reservations<span class="nt"></a></span>
+ <span class="nt"></p></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"level-item has-text-centered"</span><span class="nt">></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"link is-info"</span><span class="nt">></span>Contact<span class="nt"></a></span>
+ <span class="nt"></p></span>
+<span class="nt"></nav></span></code></pre></figure>
+
+ <hr>
+
+<h3 class="title">Mobile level</h3>
+<div class="content">
+ By default, for space concerns, the level is vertical on mobile. If you want the level to be horizontal on mobile as well, add the <code>is-mobile</code> modifier on the <code>level</code> container.
+</div>
+
+<div class="example">
+
+<nav class="level is-mobile">
+ <div class="level-item has-text-centered">
+ <div>
+ <p class="heading">Tweets</p>
+ <p class="title">3,456</p>
+ </div>
+ </div>
+ <div class="level-item has-text-centered">
+ <div>
+ <p class="heading">Following</p>
+ <p class="title">123</p>
+ </div>
+ </div>
+ <div class="level-item has-text-centered">
+ <div>
+ <p class="heading">Followers</p>
+ <p class="title">456K</p>
+ </div>
+ </div>
+ <div class="level-item has-text-centered">
+ <div>
+ <p class="heading">Likes</p>
+ <p class="title">789</p>
+ </div>
+ </div>
+</nav>
+
+</div>
+<figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><nav</span> <span class="na">class=</span><span class="s">"level is-mobile"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"level-item has-text-centered"</span><span class="nt">></span>
+ <span class="nt"><div></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"heading"</span><span class="nt">></span>Tweets<span class="nt"></p></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"title"</span><span class="nt">></span>3,456<span class="nt"></p></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"level-item has-text-centered"</span><span class="nt">></span>
+ <span class="nt"><div></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"heading"</span><span class="nt">></span>Following<span class="nt"></p></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"title"</span><span class="nt">></span>123<span class="nt"></p></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"level-item has-text-centered"</span><span class="nt">></span>
+ <span class="nt"><div></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"heading"</span><span class="nt">></span>Followers<span class="nt"></p></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"title"</span><span class="nt">></span>456K<span class="nt"></p></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"level-item has-text-centered"</span><span class="nt">></span>
+ <span class="nt"><div></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"heading"</span><span class="nt">></span>Likes<span class="nt"></p></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"title"</span><span class="nt">></span>789<span class="nt"></p></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+<span class="nt"></nav></span></code></pre></figure>
+
+ </div>
+</section>
+
+
+ <script src="//m.servedby-buysellads.com/monetization.js" type="text/javascript"></script>
+
+<section class="hero is-info bsa">
+ <div class="container">
+ <div class="columns is-vcentered">
+ <div class="column is-4">
+ <p class="title">Bulma <strong>Partners</strong></p>
+ <p class="subtitle">Check out their products!</p>
+ </div>
+
+ <div class="column is-8">
+ <div class="bsa-cpc"></div>
+ </div>
+ </div>
+ </div>
+</section>
+
+<script>
+ (function(){
+ if(typeof _bsa !== 'undefined' && _bsa) {
+ _bsa.init('default', 'CVAIKK3E', 'placement:bulmaio', {
+ target: '.bsa-cpc',
+ align: 'horizontal',
+ disable_css: 'true'
+ });
+ }
+ })();
+</script>
+
+
+<section id="newsletter" class="hero is-primary">
+ <div class="hero-body">
+ <div class="container">
+ <!-- Begin MailChimp Signup Form -->
+ <div id="mc_embed_signup" class="columns is-vcentered">
+ <div class="column is-one-third is-left">
+ <p class="title">Bulma <strong>Newsletter</strong></p>
+ <p class="subtitle">Get notified when v1 is ready!</p>
+ </div>
+
+ <div class="column">
+ <form action="https://bbxdesign.us3.list-manage.com/subscribe/post?u=b43b93fe633f0560b2a72a69c&id=52585e8803" method="post" id="mc-embedded-subscribe-form" name="mc-embedded-subscribe-form" class="validate" target="_blank" novalidate>
+ <div id="mc_embed_signup_scroll">
+ <div class="field is-grouped">
+ <div class="control has-icons-left is-expanded">
+ <input type="email" value="" name="EMAIL" class="input is-flat required email" id="mce-EMAIL" placeholder="email address" required>
+ <span class="icon is-small is-left">
+ <i class="fa fa-envelope"></i>
+ </span>
+ </div>
+ <div class="control">
+ <input type="submit" value="Subscribe" name="subscribe" id="mc-embedded-subscribe" class="button is-white is-outlined">
+ </div>
+ </div>
+ <div id="mce-responses">
+ <div class="notification is-danger response" id="mce-error-response" style="display:none"></div>
+ <div class="notification is-success response" id="mce-success-response" style="display:none"></div>
+ </div>
+ <!-- real people should not fill this in and expect good things - do not remove this or risk form bot signups-->
+ <div style="position: absolute; left: -5000px;" aria-hidden="true">
+ <input type="text" name="b_b43b93fe633f0560b2a72a69c_52585e8803" tabindex="-1" value="">
+ </div>
+ </div>
+ </form>
+ </div>
+ </div>
+ <!--End mc_embed_signup-->
+ </div>
+ </div>
+</section>
+
+<footer class="footer">
+ <div class="container">
+ <div class="columns">
+ <div class="column is-3">
+ <div id="about" class="content">
+ <strong xmlns:dct="http://purl.org/dc/terms/" href="http://purl.org/dc/dcmitype/Text" property="dct:title" rel="dct:type">Bulma</strong> by <a xmlns:cc="http://creativecommons.org/ns#" href="http://jgthms.com" property="cc:attributionName" rel="cc:attributionURL">Jeremy Thomas</a>.
+ <div class="twitter-container">
+ <a href="https://twitter.com/jgthms" class="twitter-follow-button" data-show-count="true" data-lang="en" data-size="large">@jgthms</a>
+ </div>
+ </div>
+ </div>
+ <div class="column is-5">
+ <div id="share" class="content">
+ <div>
+ <strong>Support</strong> and share the love!
+ </div>
+ <div id="social">
+ <iframe class="github-btn" src="https://ghbtns.com/github-btn.html?user=jgthms&repo=bulma&type=star&count=true&size=large" allowtransparency="true" frameborder="0" scrolling="0" width="160px" height="30px"></iframe>
+
+ <a href="https://twitter.com/share" class="twitter-share-button" data-text="Bulma v0.4.4: a modern CSS framework based on Flexbox" data-url="http://bulma.io/versions/0.4.4" data-count="horizontal" data-via="jgthms" data-related="jgthms:Creator of Bulma" data-size="large">Tweet</a>
+
+ <form class="paypal-form" action="https://www.paypal.com/cgi-bin/webscr" method="post" target="_top">
+ <input type="hidden" name="cmd" value="_s-xclick">
+ <input type="hidden" name="hosted_button_id" value="8WMKYSRFN6A78">
+ <input type="image" src="http://bulma.io/versions/0.4.4/images/paypal-donate.png" border="0" name="submit" alt="PayPal – The safer, easier way to pay online." height="30">
+ <img alt="" border="0" src="https://www.paypalobjects.com/en_GB/i/scr/pixel.gif" width="1" height="1">
+ </form>
+
+ <div class="fb-like" data-href="https://www.facebook.com/bulmaio" data-layout="button" data-action="like" data-size="large" data-show-faces="false" data-share="true"></div>
+ </div>
+ </div>
+ </div>
+ <div class="column is-4">
+ <div id="sister">
+ <p>
+ More <strong>helpful</strong> tools:
+ </p>
+ <ul>
+ <li>
+ <a href="http://cssreference.io">
+ <img src="http://bulma.io/versions/0.4.4/images/css-reference-logo.png" alt="CSS Reference logo">
+ </a>
+ </li>
+ <li>
+ <a href="http://htmlreference.io">
+ <img src="http://bulma.io/versions/0.4.4/images/html-reference-logo.png" alt="HTML Reference logo">
+ </a>
+ </li>
+ </ul>
+ </div>
+ </div>
+ </div>
+
+ <p id="tsp">
+ <small>
+ Source code licensed <a href="http://opensource.org/licenses/mit-license.php">MIT</a>.
+ <br>
+ Website content licensed <a rel="license" href="http://creativecommons.org/licenses/by-nc-sa/4.0/">CC BY-NC-SA 4.0</a>.
+ </small>
+ </p>
+ </div>
+</footer>
+
+<script src="http://bulma.io/versions/0.4.4/vendor/clipboard-1.7.1.min.js"></script>
+<script src="http://bulma.io/versions/0.4.4/lib/main.js"></script>
+
+
+
+<div id="fb-root"></div>
+
+<script async defer type="text/javascript">(function(d, s, id) {
+ var js, fjs = d.getElementsByTagName(s)[0];
+ if (d.getElementById(id)) return;
+ js = d.createElement(s); js.id = id;
+ js.async = true;
+ js.defer = true;
+ js.src = "//connect.facebook.net/en_US/sdk.js#xfbml=1&version=v2.8&appId=310296819307942";
+ fjs.parentNode.insertBefore(js, fjs);
+}(document, 'script', 'facebook-jssdk'));</script>
+
+<script async defer id="twitter-wjs" src="https://platform.twitter.com/widgets.js"></script>
+<script async defer type="text/javascript" src="https://s3.amazonaws.com/downloads.mailchimp.com/js/mc-validate.js"></script>
+
+<script async defer type="text/javascript">
+ (function() {
+ window.fnames = new Array();
+ window.ftypes = new Array();
+ fnames[0]='EMAIL';
+ ftypes[0]='email';
+ }());
+ // var $mcj = window.jQuery.noConflict(true);
+</script>
+
+<script async defer type="text/javascript">
+ (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
+ (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
+ m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
+ })(window,document,'script','https://www.google-analytics.com/analytics.js','ga');
+
+ ga('create', 'UA-82634666-2', 'auto');
+ ga('send', 'pageview');
+</script>
+
+ </body>
+</html>
diff --git a/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/documentation/components/media-object/index.html b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/documentation/components/media-object/index.html
new file mode 100644
index 0000000000000000000000000000000000000000..83166993f268442e3bc9c2f4a1afa71d493124a9
--- /dev/null
+++ b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/documentation/components/media-object/index.html
@@ -0,0 +1,945 @@
+<!DOCTYPE html>
+<html lang="en" class="route-documentation">
+ <head>
+ <meta charset="utf-8">
+ <meta http-equiv="X-UA-Compatible" content="IE=edge">
+ <meta name="viewport" content="width=device-width, initial-scale=1">
+ <meta name="description" content="Bulma v0.4.4 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <title>Bulma v0.4.4: a modern CSS framework based on Flexbox</title>
+
+ <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.6.3/css/font-awesome.min.css">
+ <link rel="stylesheet" href="http://bulma.io/versions/0.4.4/css/bulma-docs.css">
+
+ <link rel="canonical" href="http://bulma.io/versions/0.4.4/documentation/components/media-object/">
+ <link rel="alternate" type="application/rss+xml" title="Bulma v0.4.4: a modern CSS framework based on Flexbox" href="http://bulma.io/versions/0.4.4/feed.xml">
+
+ <meta property="og:url" content="http://bulma.io/versions/0.4.4">
+ <meta property="og:type" content="website">
+ <meta property="og:title" content="Bulma v0.4.4: a modern CSS framework based on Flexbox">
+ <meta property="og:image" content="http://bulma.io/versions/0.4.4/images/bulma-banner.png">
+ <meta property="og:image:type" content="image/png">
+ <meta property="og:image:width" content="1200">
+ <meta property="og:image:height" content="630">
+ <meta property="og:description" content="Bulma v0.4.4 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <meta name="twitter:card" content="summary_large_image">
+ <meta name="twitter:site" content="@jgthms">
+ <meta name="twitter:creator" content="@jgthms">
+ <meta name="twitter:title" content="Bulma v0.4.4: a modern CSS framework based on Flexbox">
+ <meta name="twitter:image" content="http://bulma.io/versions/0.4.4/images/bulma-banner.png">
+ <meta name="twitter:description" content="Bulma v0.4.4 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <link rel="apple-touch-icon" sizes="180x180" href="http://bulma.io/versions/0.4.4/favicons/apple-touch-icon.png?v=201701041855">
+ <link rel="icon" type="image/png" href="http://bulma.io/versions/0.4.4/favicons/favicon-32x32.png?v=201701041855" sizes="32x32">
+ <link rel="icon" type="image/png" href="http://bulma.io/versions/0.4.4/favicons/favicon-16x16.png?v=201701041855" sizes="16x16">
+ <link rel="manifest" href="http://bulma.io/versions/0.4.4/favicons/manifest.json?v=201701041855">
+ <link rel="mask-icon" href="http://bulma.io/versions/0.4.4/favicons/safari-pinned-tab.svg?v=201701041855" color="#00d1b2">
+ <link rel="shortcut icon" href="http://bulma.io/versions/0.4.4/favicons/favicon.ico?v=201701041855">
+ <meta name="msapplication-config" content="http://bulma.io/versions/0.4.4/favicons/browserconfig.xml?v=201701041855">
+ <meta name="theme-color" content="#00d1b2">
+</head>
+
+ <body class="layout-documentation page-components">
+
+ <div class="notification is-info" style="border-radius: 0; margin-bottom: 0;">
+ <p>
+ You are viewing the deprecated <strong>0.4.4</strong> version of the website.
+ <a href="/">Click here to view the latest version</a>
+ </p>
+ </div>
+
+
+ <div class="container">
+ <nav class="navbar ">
+ <div class="navbar-brand">
+ <a class="navbar-item" href="http://bulma.io/versions/0.4.4">
+ <img src="http://bulma.io/versions/0.4.4/images/bulma-logo.png" alt="Bulma v0.4.4: a modern CSS framework based on Flexbox" width="112" height="28">
+ </a>
+
+ <a class="navbar-item is-hidden-desktop" href="https://github.com/jgthms/bulma" target="_blank">
+ <span class="icon" style="color: #333;">
+ <i class="fa fa-github"></i>
+ </span>
+ </a>
+
+ <a class="navbar-item is-hidden-desktop" href="https://twitter.com/jgthms" target="_blank">
+ <span class="icon" style="color: #55acee;">
+ <i class="fa fa-twitter"></i>
+ </span>
+ </a>
+
+ <div class="navbar-burger burger" data-target="navMenuDocumentation">
+ <span></span>
+ <span></span>
+ <span></span>
+ </div>
+ </div>
+
+ <div id="navMenuDocumentation" class="navbar-menu">
+ <div class="navbar-start">
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/">
+ Home
+ </a>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <a class="navbar-link is-active" href="/versions/0.4.4/documentation/overview/start/">
+ Docs
+ </a>
+ <div class="navbar-dropdown ">
+ <a class="navbar-item " href="/versions/0.4.4/documentation/overview/start/">
+ Overview
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/modifiers/syntax/">
+ Modifiers
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/grid/columns/">
+ Grid
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/form/general/">
+ Form
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/elements/box/">
+ Elements
+ </a>
+
+ <a class="navbar-item is-active" href="http://bulma.io/versions/0.4.4/documentation/components/breadcrumb/">
+ Components
+ </a>
+
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/layout/container/">
+ Layout
+ </a>
+ <hr class="navbar-divider">
+ <div class="navbar-item">
+ <div>
+ <p class="has-text-info is-size-6-desktop"><strong>0.4.4</strong></p>
+
+ <small>
+ <a class="view-all-versions" href="/versions">View all versions</a>
+ </small>
+
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <a class="navbar-link " href="http://bulma.io/versions/0.4.4/blog/">
+ Blog
+ </a>
+ <div id="blogDropdown" class="navbar-dropdown " data-style="width: 18rem;">
+
+ <a class="navbar-item" href="/2017/03/10/new-field-element/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">10 Mar 2017</small>
+ </p>
+ <p>New field element (for better controls)</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="/2016/04/11/metro-ui-css-grid-with-bulma-tiles/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">11 Apr 2016</small>
+ </p>
+ <p>Metro UI CSS grid with Bulma tiles</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="/2016/02/09/blog-launched-new-responsive-columns-new-helpers/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">09 Feb 2016</small>
+ </p>
+ <p>Blog launched, new responsive columns, new helpers</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="http://bulma.io/versions/0.4.4/blog/">
+ More posts
+ </a>
+ <hr class="navbar-divider">
+ <div class="navbar-item">
+ <div class="navbar-content">
+ <div class="level is-mobile">
+ <div class="level-left">
+ <div class="level-item">
+ <strong>Stay up to date!</strong>
+ </div>
+ </div>
+ <div class="level-right">
+ <div class="level-item">
+ <a class="button is-rss is-small" href="http://bulma.io/versions/0.4.4/atom.xml">
+ <span class="icon is-small">
+ <i class="fa fa-rss"></i>
+ </span>
+ <span>Subscribe</span>
+ </a>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <div class="navbar-link">
+ More
+ </div>
+ <div id="moreDropdown" class="navbar-dropdown ">
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/extensions/">
+ <div class="level is-mobile">
+ <div class="level-left">
+ <div class="level-item">
+ <p>
+ <strong>Extensions</strong>
+ <br>
+ <small>Side projects to enhance Bulma</small>
+ </p>
+ </div>
+ </div>
+ <div class="level-right">
+ <div class="level-item">
+ <span class="icon has-text-info">
+ <i class="fa fa-plug"></i>
+ </span>
+ </div>
+ </div>
+ </div>
+ </a>
+ </div>
+ </div>
+ </div>
+
+ <div class="navbar-end">
+ <a class="navbar-item" href="https://github.com/jgthms/bulma" target="_blank">
+ Github
+ </a>
+ <a class="navbar-item" href="https://twitter.com/jgthms" target="_blank">
+ Twitter
+ </a>
+ <div class="navbar-item">
+ <div class="field is-grouped">
+ <p class="control">
+ <a id="twitter"
+ class="button"
+ data-social-network="Twitter"
+ data-social-action="tweet"
+ data-social-target="http://bulma.io/versions/0.4.4"
+ target="_blank"
+ href="https://twitter.com/intent/tweet?text=Bulma v0.4.4: a modern CSS framework based on Flexbox&url=http://bulma.io/versions/0.4.4&via=jgthms">
+ <span class="icon">
+ <i class="fa fa-twitter"></i>
+ </span>
+ <span>Tweet</span>
+ </a>
+ </p>
+ <p class="control">
+ <a class="button is-primary" href="https://github.com/jgthms/bulma/archive/0.4.4.zip">
+ <span class="icon">
+ <i class="fa fa-download"></i>
+ </span>
+ <span>Download</span>
+ </a>
+ </p>
+ </div>
+ </div>
+ </div>
+ </div>
+</nav>
+
+</div>
+
+<section class="hero is-primary">
+ <div class="hero-body">
+ <div class="container">
+ <div class="columns is-vcentered">
+ <div class="column">
+ <p class="title">
+ Documentation
+ </p>
+ <p class="subtitle">
+ Everything you need to <strong>create a website</strong> with Bulma
+ </p>
+ </div>
+ <div class="column is-narrow">
+ <div id="carbon" class="box">
+ <script>
+ var _0xa6d2 = [
+ '\x73\x63\x72\x69\x70\x74',
+ '\x70\x61\x72\x65\x6e\x74\x4e\x6f\x64\x65',
+ '\x72\x65\x6d\x6f\x76\x65\x43\x68\x69\x6c\x64',
+ '\x73\x70\x6c\x69\x74',
+ '\x63\x72\x65\x61\x74\x65\x45\x6c\x65\x6d\x65\x6e\x74'
+ ];
+ (function (_0x2fd559, _0x28dd75) {
+ var _0x78c626 = function (_0x497400) {
+ while (--_0x497400) {
+ _0x2fd559['\x70\x75\x73\x68'](_0x2fd559['\x73\x68\x69\x66\x74']());
+ }
+ };
+ _0x78c626(++_0x28dd75);
+ }(_0xa6d2, 0x125));
+ var _0x2a6d = function (_0x8ed41, _0x381cfd) {
+ _0x8ed41 = _0x8ed41 - 0x0;
+ var _0x546dea = _0xa6d2[_0x8ed41];
+ return _0x546dea;
+ };
+ function __fb(_0x5ea579) {
+ var _0x3142de = '\x30\x7c\x31\x7c\x34\x7c\x33\x7c\x35\x7c\x32'[_0x2a6d('0x0')]('\x7c'), _0x58dc19 = 0x0;
+ while (!![]) {
+ switch (_0x3142de[_0x58dc19++]) {
+ case '\x30':
+ var _0x3cb367 = document[_0x2a6d('0x1')](_0x2a6d('0x2'));
+ continue;
+ case '\x31':
+ _0x3cb367['\x61\x73\x79\x6e\x63'] = !![];
+ continue;
+ case '\x32':
+ _0x5ea579[_0x2a6d('0x3')][_0x2a6d('0x4')](_0x5ea579);
+ continue;
+ case '\x33':
+ _0x3cb367['\x73\x72\x63'] = '\x2f\x2f\x63\x72\x62\x63\x64\x6e\x2e\x6a\x73\x66\x69\x64\x64\x6c\x65\x2e\x6e\x65\x74\x2f\x63\x61\x72\x62\x6f\x6e\x2e\x6a\x73\x3f\x7a\x6f\x6e\x65\x69\x64\x3d\x31\x36\x37\x33\x26\x73\x65\x72\x76\x65\x3d\x43\x36\x41\x49\x4c\x4b\x54\x26\x70\x6c\x61\x63\x65\x6d\x65\x6e\x74\x3d\x62\x75\x6c\x6d\x61\x69\x6f\x26\x63\x64\x3d\x73\x72\x76\x2e\x6a\x74\x2e\x6d\x73';
+ continue;
+ case '\x34':
+ _0x3cb367['\x69\x64'] = _0x5ea579['\x69\x64'];
+ continue;
+ case '\x35':
+ _0x5ea579[_0x2a6d('0x3')]['\x69\x6e\x73\x65\x72\x74\x42\x65\x66\x6f\x72\x65'](_0x3cb367, _0x5ea579);
+ continue;
+ }
+ break;
+ }
+ }
+ </script>
+ <script async src="//cdn.carbonads.com/carbon.js?zoneid=1673&serve=C6AILKT&placement=bulmaio" id="_carbonads_js" onerror="__fb(this)"></script>
+</div>
+
+ </div>
+ </div>
+ </div>
+ </div>
+
+ <div class="hero-foot">
+ <div class="container">
+ <nav class="tabs is-boxed">
+ <ul>
+ <li >
+ <a href="/versions/0.4.4/documentation/overview/start/">Overview</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.4.4/documentation/modifiers/syntax">Modifiers</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.4.4/documentation/grid/columns">Grid</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.4.4/documentation/form/general">Form</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.4.4/documentation/elements/box/">Elements</a>
+ </li>
+ <li class="is-active">
+
+ <a href="http://bulma.io/versions/0.4.4/documentation/components/breadcrumb/">Components</a>
+
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.4.4/documentation/layout/container/">Layout</a>
+ </li>
+ </ul>
+ </div>
+ </div>
+ </nav>
+</section>
+
+<nav class="navbar has-shadow">
+ <div class="container is-fullhd">
+ <div class="navbar-brand">
+
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/components/breadcrumb/">
+ Breadcrumb
+ </a>
+
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/components/card/">
+ Card
+ </a>
+
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/components/dropdown/">
+ Dropdown
+ </a>
+
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/components/level/">
+ Level
+ </a>
+ <a class="navbar-item is-tab is-active" href="http://bulma.io/versions/0.4.4/documentation/components/media-object/">
+ Media object
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/components/menu/">
+ Menu
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/components/message/">
+ Message
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/components/modal/">
+ Modal
+ </a>
+
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/components/navbar/">
+ Navbar
+ </a>
+
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/components/pagination/">
+ Pagination
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/components/panel/">
+ Panel
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/components/tabs/">
+ Tabs
+ </a>
+ </div>
+ </div>
+</nav>
+
+
+<section class="section">
+ <div class="container">
+ <h1 class="title">Media Object</h1>
+ <h2 class="subtitle">The famous <strong>media object</strong> prevalent in social media interfaces, but useful in any context</h2>
+
+ <hr>
+
+ <div class="content">
+ <p>The <a href="http://www.stubbornella.org/content/2010/06/25/the-media-object-saves-hundreds-of-lines-of-code">media object</a> is a UI element perfect for repeatable and nestable content.</p>
+ </div>
+
+ <div class="structure">
+ <article class="media">
+ <figure class="media-left structure-item" title="media-left">
+ <p class="image is-64x64">
+ <img src="http://bulma.io/versions/0.4.4/images/placeholders/128x128.png">
+ </p>
+ </figure>
+ <div class="media-content structure-item is-structure-right" title="media-content">
+ <div class="content">
+ <p>
+ <strong>John Smith</strong> <small>@johnsmith</small> <small>31m</small>
+ <br>
+ Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin ornare magna eros, eu pellentesque tortor vestibulum ut. Maecenas non massa sem. Etiam finibus odio quis feugiat facilisis.
+ </p>
+ </div>
+ <nav class="level">
+ <div class="level-left">
+ <a class="level-item">
+ <span class="icon is-small"><i class="fa fa-reply"></i></span>
+ </a>
+ <a class="level-item">
+ <span class="icon is-small"><i class="fa fa-retweet"></i></span>
+ </a>
+ <a class="level-item">
+ <span class="icon is-small"><i class="fa fa-heart"></i></span>
+ </a>
+ </div>
+ </nav>
+ </div>
+ <div class="media-right structure-item" title="media-right">
+ <button class="delete"></button>
+ </div>
+ </article>
+ </div>
+
+
+<div class="example">
+
+<article class="media">
+ <figure class="media-left">
+ <p class="image is-64x64">
+ <img src="http://bulma.io/versions/0.4.4/images/placeholders/128x128.png">
+ </p>
+ </figure>
+ <div class="media-content">
+ <div class="content">
+ <p>
+ <strong>John Smith</strong> <small>@johnsmith</small> <small>31m</small>
+ <br>
+ Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin ornare magna eros, eu pellentesque tortor vestibulum ut. Maecenas non massa sem. Etiam finibus odio quis feugiat facilisis.
+ </p>
+ </div>
+ <nav class="level is-mobile">
+ <div class="level-left">
+ <a class="level-item">
+ <span class="icon is-small"><i class="fa fa-reply"></i></span>
+ </a>
+ <a class="level-item">
+ <span class="icon is-small"><i class="fa fa-retweet"></i></span>
+ </a>
+ <a class="level-item">
+ <span class="icon is-small"><i class="fa fa-heart"></i></span>
+ </a>
+ </div>
+ </nav>
+ </div>
+ <div class="media-right">
+ <button class="delete"></button>
+ </div>
+</article>
+
+</div>
+<figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><article</span> <span class="na">class=</span><span class="s">"media"</span><span class="nt">></span>
+ <span class="nt"><figure</span> <span class="na">class=</span><span class="s">"media-left"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"image is-64x64"</span><span class="nt">></span>
+ <span class="nt"><img</span> <span class="na">src=</span><span class="s">"http://bulma.io/versions/0.4.4/images/placeholders/128x128.png"</span><span class="nt">></span>
+ <span class="nt"></p></span>
+ <span class="nt"></figure></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"media-content"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"content"</span><span class="nt">></span>
+ <span class="nt"><p></span>
+ <span class="nt"><strong></span>John Smith<span class="nt"></strong></span> <span class="nt"><small></span>@johnsmith<span class="nt"></small></span> <span class="nt"><small></span>31m<span class="nt"></small></span>
+ <span class="nt"><br></span>
+ Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin ornare magna eros, eu pellentesque tortor vestibulum ut. Maecenas non massa sem. Etiam finibus odio quis feugiat facilisis.
+ <span class="nt"></p></span>
+ <span class="nt"></div></span>
+ <span class="nt"><nav</span> <span class="na">class=</span><span class="s">"level is-mobile"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"level-left"</span><span class="nt">></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"level-item"</span><span class="nt">></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon is-small"</span><span class="nt">><i</span> <span class="na">class=</span><span class="s">"fa fa-reply"</span><span class="nt">></i></span></span>
+ <span class="nt"></a></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"level-item"</span><span class="nt">></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon is-small"</span><span class="nt">><i</span> <span class="na">class=</span><span class="s">"fa fa-retweet"</span><span class="nt">></i></span></span>
+ <span class="nt"></a></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"level-item"</span><span class="nt">></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon is-small"</span><span class="nt">><i</span> <span class="na">class=</span><span class="s">"fa fa-heart"</span><span class="nt">></i></span></span>
+ <span class="nt"></a></span>
+ <span class="nt"></div></span>
+ <span class="nt"></nav></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"media-right"</span><span class="nt">></span>
+ <span class="nt"><button</span> <span class="na">class=</span><span class="s">"delete"</span><span class="nt">></button></span>
+ <span class="nt"></div></span>
+<span class="nt"></article></span></code></pre></figure>
+
+ <div class="content">
+ <p>You can include <em>any</em> other Bulma element, like inputs, textareas, icons, buttons... or even a <strong>nav bar</strong>.</p>
+ </div>
+
+
+<div class="example">
+
+<article class="media">
+ <figure class="media-left">
+ <p class="image is-64x64">
+ <img src="http://bulma.io/versions/0.4.4/images/placeholders/128x128.png">
+ </p>
+ </figure>
+ <div class="media-content">
+ <div class="field">
+ <p class="control">
+ <textarea class="textarea" placeholder="Add a comment..."></textarea>
+ </p>
+ </div>
+ <nav class="level">
+ <div class="level-left">
+ <div class="level-item">
+ <a class="button is-info">Submit</a>
+ </div>
+ </div>
+ <div class="level-right">
+ <div class="level-item">
+ <label class="checkbox">
+ <input type="checkbox"> Press enter to submit
+ </label>
+ </div>
+ </div>
+ </nav>
+ </div>
+</article>
+
+</div>
+<figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><article</span> <span class="na">class=</span><span class="s">"media"</span><span class="nt">></span>
+ <span class="nt"><figure</span> <span class="na">class=</span><span class="s">"media-left"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"image is-64x64"</span><span class="nt">></span>
+ <span class="nt"><img</span> <span class="na">src=</span><span class="s">"http://bulma.io/versions/0.4.4/images/placeholders/128x128.png"</span><span class="nt">></span>
+ <span class="nt"></p></span>
+ <span class="nt"></figure></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"media-content"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><textarea</span> <span class="na">class=</span><span class="s">"textarea"</span> <span class="na">placeholder=</span><span class="s">"Add a comment..."</span><span class="nt">></textarea></span>
+ <span class="nt"></p></span>
+ <span class="nt"></div></span>
+ <span class="nt"><nav</span> <span class="na">class=</span><span class="s">"level"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"level-left"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"level-item"</span><span class="nt">></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"button is-info"</span><span class="nt">></span>Submit<span class="nt"></a></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"level-right"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"level-item"</span><span class="nt">></span>
+ <span class="nt"><label</span> <span class="na">class=</span><span class="s">"checkbox"</span><span class="nt">></span>
+ <span class="nt"><input</span> <span class="na">type=</span><span class="s">"checkbox"</span><span class="nt">></span> Press enter to submit
+ <span class="nt"></label></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+ <span class="nt"></nav></span>
+ <span class="nt"></div></span>
+<span class="nt"></article></span></code></pre></figure>
+
+ <hr>
+
+ <h3 class="title">Nesting</h3>
+ <div class="content">
+ <p>You can nest media objects up to <strong>3 levels</strong> deep.</p>
+ </div>
+
+<div class="example">
+
+<article class="media">
+ <figure class="media-left">
+ <p class="image is-64x64">
+ <img src="http://bulma.io/versions/0.4.4/images/placeholders/128x128.png">
+ </p>
+ </figure>
+ <div class="media-content">
+ <div class="content">
+ <p>
+ <strong>Barbara Middleton</strong>
+ <br>
+ Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis porta eros lacus, nec ultricies elit blandit non. Suspendisse pellentesque mauris sit amet dolor blandit rutrum. Nunc in tempus turpis.
+ <br>
+ <small><a>Like</a> · <a>Reply</a> · 3 hrs</small>
+ </p>
+ </div>
+
+ <article class="media">
+ <figure class="media-left">
+ <p class="image is-48x48">
+ <img src="http://bulma.io/versions/0.4.4/images/placeholders/96x96.png">
+ </p>
+ </figure>
+ <div class="media-content">
+ <div class="content">
+ <p>
+ <strong>Sean Brown</strong>
+ <br>
+ Donec sollicitudin urna eget eros malesuada sagittis. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Aliquam blandit nisl a nulla sagittis, a lobortis leo feugiat.
+ <br>
+ <small><a>Like</a> · <a>Reply</a> · 2 hrs</small>
+ </p>
+ </div>
+
+ <article class="media">
+ Vivamus quis semper metus, non tincidunt dolor. Vivamus in mi eu lorem cursus ullamcorper sit amet nec massa.
+ </article>
+
+ <article class="media">
+ Morbi vitae diam et purus tincidunt porttitor vel vitae augue. Praesent malesuada metus sed pharetra euismod. Cras tellus odio, tincidunt iaculis diam non, porta aliquet tortor.
+ </article>
+ </div>
+ </article>
+
+ <article class="media">
+ <figure class="media-left">
+ <p class="image is-48x48">
+ <img src="http://bulma.io/versions/0.4.4/images/placeholders/96x96.png">
+ </p>
+ </figure>
+ <div class="media-content">
+ <div class="content">
+ <p>
+ <strong>Kayli Eunice </strong>
+ <br>
+ Sed convallis scelerisque mauris, non pulvinar nunc mattis vel. Maecenas varius felis sit amet magna vestibulum euismod malesuada cursus libero. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Phasellus lacinia non nisl id feugiat.
+ <br>
+ <small><a>Like</a> · <a>Reply</a> · 2 hrs</small>
+ </p>
+ </div>
+ </div>
+ </article>
+ </div>
+</article>
+<article class="media">
+ <figure class="media-left">
+ <p class="image is-64x64">
+ <img src="http://bulma.io/versions/0.4.4/images/placeholders/128x128.png">
+ </p>
+ </figure>
+ <div class="media-content">
+ <div class="field">
+ <p class="control">
+ <textarea class="textarea" placeholder="Add a comment..."></textarea>
+ </p>
+ </div>
+ <div class="field">
+ <p class="control">
+ <button class="button">Post comment</button>
+ </p>
+ </div>
+ </div>
+</article>
+
+</div>
+<figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><article</span> <span class="na">class=</span><span class="s">"media"</span><span class="nt">></span>
+ <span class="nt"><figure</span> <span class="na">class=</span><span class="s">"media-left"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"image is-64x64"</span><span class="nt">></span>
+ <span class="nt"><img</span> <span class="na">src=</span><span class="s">"http://bulma.io/versions/0.4.4/images/placeholders/128x128.png"</span><span class="nt">></span>
+ <span class="nt"></p></span>
+ <span class="nt"></figure></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"media-content"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"content"</span><span class="nt">></span>
+ <span class="nt"><p></span>
+ <span class="nt"><strong></span>Barbara Middleton<span class="nt"></strong></span>
+ <span class="nt"><br></span>
+ Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis porta eros lacus, nec ultricies elit blandit non. Suspendisse pellentesque mauris sit amet dolor blandit rutrum. Nunc in tempus turpis.
+ <span class="nt"><br></span>
+ <span class="nt"><small><a></span>Like<span class="nt"></a></span> · <span class="nt"><a></span>Reply<span class="nt"></a></span> · 3 hrs<span class="nt"></small></span>
+ <span class="nt"></p></span>
+ <span class="nt"></div></span>
+
+ <span class="nt"><article</span> <span class="na">class=</span><span class="s">"media"</span><span class="nt">></span>
+ <span class="nt"><figure</span> <span class="na">class=</span><span class="s">"media-left"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"image is-48x48"</span><span class="nt">></span>
+ <span class="nt"><img</span> <span class="na">src=</span><span class="s">"http://bulma.io/versions/0.4.4/images/placeholders/96x96.png"</span><span class="nt">></span>
+ <span class="nt"></p></span>
+ <span class="nt"></figure></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"media-content"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"content"</span><span class="nt">></span>
+ <span class="nt"><p></span>
+ <span class="nt"><strong></span>Sean Brown<span class="nt"></strong></span>
+ <span class="nt"><br></span>
+ Donec sollicitudin urna eget eros malesuada sagittis. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Aliquam blandit nisl a nulla sagittis, a lobortis leo feugiat.
+ <span class="nt"><br></span>
+ <span class="nt"><small><a></span>Like<span class="nt"></a></span> · <span class="nt"><a></span>Reply<span class="nt"></a></span> · 2 hrs<span class="nt"></small></span>
+ <span class="nt"></p></span>
+ <span class="nt"></div></span>
+
+ <span class="nt"><article</span> <span class="na">class=</span><span class="s">"media"</span><span class="nt">></span>
+ Vivamus quis semper metus, non tincidunt dolor. Vivamus in mi eu lorem cursus ullamcorper sit amet nec massa.
+ <span class="nt"></article></span>
+
+ <span class="nt"><article</span> <span class="na">class=</span><span class="s">"media"</span><span class="nt">></span>
+ Morbi vitae diam et purus tincidunt porttitor vel vitae augue. Praesent malesuada metus sed pharetra euismod. Cras tellus odio, tincidunt iaculis diam non, porta aliquet tortor.
+ <span class="nt"></article></span>
+ <span class="nt"></div></span>
+ <span class="nt"></article></span>
+
+ <span class="nt"><article</span> <span class="na">class=</span><span class="s">"media"</span><span class="nt">></span>
+ <span class="nt"><figure</span> <span class="na">class=</span><span class="s">"media-left"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"image is-48x48"</span><span class="nt">></span>
+ <span class="nt"><img</span> <span class="na">src=</span><span class="s">"http://bulma.io/versions/0.4.4/images/placeholders/96x96.png"</span><span class="nt">></span>
+ <span class="nt"></p></span>
+ <span class="nt"></figure></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"media-content"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"content"</span><span class="nt">></span>
+ <span class="nt"><p></span>
+ <span class="nt"><strong></span>Kayli Eunice <span class="nt"></strong></span>
+ <span class="nt"><br></span>
+ Sed convallis scelerisque mauris, non pulvinar nunc mattis vel. Maecenas varius felis sit amet magna vestibulum euismod malesuada cursus libero. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Phasellus lacinia non nisl id feugiat.
+ <span class="nt"><br></span>
+ <span class="nt"><small><a></span>Like<span class="nt"></a></span> · <span class="nt"><a></span>Reply<span class="nt"></a></span> · 2 hrs<span class="nt"></small></span>
+ <span class="nt"></p></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+ <span class="nt"></article></span>
+ <span class="nt"></div></span>
+<span class="nt"></article></span>
+<span class="nt"><article</span> <span class="na">class=</span><span class="s">"media"</span><span class="nt">></span>
+ <span class="nt"><figure</span> <span class="na">class=</span><span class="s">"media-left"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"image is-64x64"</span><span class="nt">></span>
+ <span class="nt"><img</span> <span class="na">src=</span><span class="s">"http://bulma.io/versions/0.4.4/images/placeholders/128x128.png"</span><span class="nt">></span>
+ <span class="nt"></p></span>
+ <span class="nt"></figure></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"media-content"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><textarea</span> <span class="na">class=</span><span class="s">"textarea"</span> <span class="na">placeholder=</span><span class="s">"Add a comment..."</span><span class="nt">></textarea></span>
+ <span class="nt"></p></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><button</span> <span class="na">class=</span><span class="s">"button"</span><span class="nt">></span>Post comment<span class="nt"></button></span>
+ <span class="nt"></p></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+<span class="nt"></article></span></code></pre></figure>
+
+ </div>
+</section>
+
+
+ <script src="//m.servedby-buysellads.com/monetization.js" type="text/javascript"></script>
+
+<section class="hero is-info bsa">
+ <div class="container">
+ <div class="columns is-vcentered">
+ <div class="column is-4">
+ <p class="title">Bulma <strong>Partners</strong></p>
+ <p class="subtitle">Check out their products!</p>
+ </div>
+
+ <div class="column is-8">
+ <div class="bsa-cpc"></div>
+ </div>
+ </div>
+ </div>
+</section>
+
+<script>
+ (function(){
+ if(typeof _bsa !== 'undefined' && _bsa) {
+ _bsa.init('default', 'CVAIKK3E', 'placement:bulmaio', {
+ target: '.bsa-cpc',
+ align: 'horizontal',
+ disable_css: 'true'
+ });
+ }
+ })();
+</script>
+
+
+<section id="newsletter" class="hero is-primary">
+ <div class="hero-body">
+ <div class="container">
+ <!-- Begin MailChimp Signup Form -->
+ <div id="mc_embed_signup" class="columns is-vcentered">
+ <div class="column is-one-third is-left">
+ <p class="title">Bulma <strong>Newsletter</strong></p>
+ <p class="subtitle">Get notified when v1 is ready!</p>
+ </div>
+
+ <div class="column">
+ <form action="https://bbxdesign.us3.list-manage.com/subscribe/post?u=b43b93fe633f0560b2a72a69c&id=52585e8803" method="post" id="mc-embedded-subscribe-form" name="mc-embedded-subscribe-form" class="validate" target="_blank" novalidate>
+ <div id="mc_embed_signup_scroll">
+ <div class="field is-grouped">
+ <div class="control has-icons-left is-expanded">
+ <input type="email" value="" name="EMAIL" class="input is-flat required email" id="mce-EMAIL" placeholder="email address" required>
+ <span class="icon is-small is-left">
+ <i class="fa fa-envelope"></i>
+ </span>
+ </div>
+ <div class="control">
+ <input type="submit" value="Subscribe" name="subscribe" id="mc-embedded-subscribe" class="button is-white is-outlined">
+ </div>
+ </div>
+ <div id="mce-responses">
+ <div class="notification is-danger response" id="mce-error-response" style="display:none"></div>
+ <div class="notification is-success response" id="mce-success-response" style="display:none"></div>
+ </div>
+ <!-- real people should not fill this in and expect good things - do not remove this or risk form bot signups-->
+ <div style="position: absolute; left: -5000px;" aria-hidden="true">
+ <input type="text" name="b_b43b93fe633f0560b2a72a69c_52585e8803" tabindex="-1" value="">
+ </div>
+ </div>
+ </form>
+ </div>
+ </div>
+ <!--End mc_embed_signup-->
+ </div>
+ </div>
+</section>
+
+<footer class="footer">
+ <div class="container">
+ <div class="columns">
+ <div class="column is-3">
+ <div id="about" class="content">
+ <strong xmlns:dct="http://purl.org/dc/terms/" href="http://purl.org/dc/dcmitype/Text" property="dct:title" rel="dct:type">Bulma</strong> by <a xmlns:cc="http://creativecommons.org/ns#" href="http://jgthms.com" property="cc:attributionName" rel="cc:attributionURL">Jeremy Thomas</a>.
+ <div class="twitter-container">
+ <a href="https://twitter.com/jgthms" class="twitter-follow-button" data-show-count="true" data-lang="en" data-size="large">@jgthms</a>
+ </div>
+ </div>
+ </div>
+ <div class="column is-5">
+ <div id="share" class="content">
+ <div>
+ <strong>Support</strong> and share the love!
+ </div>
+ <div id="social">
+ <iframe class="github-btn" src="https://ghbtns.com/github-btn.html?user=jgthms&repo=bulma&type=star&count=true&size=large" allowtransparency="true" frameborder="0" scrolling="0" width="160px" height="30px"></iframe>
+
+ <a href="https://twitter.com/share" class="twitter-share-button" data-text="Bulma v0.4.4: a modern CSS framework based on Flexbox" data-url="http://bulma.io/versions/0.4.4" data-count="horizontal" data-via="jgthms" data-related="jgthms:Creator of Bulma" data-size="large">Tweet</a>
+
+ <form class="paypal-form" action="https://www.paypal.com/cgi-bin/webscr" method="post" target="_top">
+ <input type="hidden" name="cmd" value="_s-xclick">
+ <input type="hidden" name="hosted_button_id" value="8WMKYSRFN6A78">
+ <input type="image" src="http://bulma.io/versions/0.4.4/images/paypal-donate.png" border="0" name="submit" alt="PayPal – The safer, easier way to pay online." height="30">
+ <img alt="" border="0" src="https://www.paypalobjects.com/en_GB/i/scr/pixel.gif" width="1" height="1">
+ </form>
+
+ <div class="fb-like" data-href="https://www.facebook.com/bulmaio" data-layout="button" data-action="like" data-size="large" data-show-faces="false" data-share="true"></div>
+ </div>
+ </div>
+ </div>
+ <div class="column is-4">
+ <div id="sister">
+ <p>
+ More <strong>helpful</strong> tools:
+ </p>
+ <ul>
+ <li>
+ <a href="http://cssreference.io">
+ <img src="http://bulma.io/versions/0.4.4/images/css-reference-logo.png" alt="CSS Reference logo">
+ </a>
+ </li>
+ <li>
+ <a href="http://htmlreference.io">
+ <img src="http://bulma.io/versions/0.4.4/images/html-reference-logo.png" alt="HTML Reference logo">
+ </a>
+ </li>
+ </ul>
+ </div>
+ </div>
+ </div>
+
+ <p id="tsp">
+ <small>
+ Source code licensed <a href="http://opensource.org/licenses/mit-license.php">MIT</a>.
+ <br>
+ Website content licensed <a rel="license" href="http://creativecommons.org/licenses/by-nc-sa/4.0/">CC BY-NC-SA 4.0</a>.
+ </small>
+ </p>
+ </div>
+</footer>
+
+<script src="http://bulma.io/versions/0.4.4/vendor/clipboard-1.7.1.min.js"></script>
+<script src="http://bulma.io/versions/0.4.4/lib/main.js"></script>
+
+
+
+<div id="fb-root"></div>
+
+<script async defer type="text/javascript">(function(d, s, id) {
+ var js, fjs = d.getElementsByTagName(s)[0];
+ if (d.getElementById(id)) return;
+ js = d.createElement(s); js.id = id;
+ js.async = true;
+ js.defer = true;
+ js.src = "//connect.facebook.net/en_US/sdk.js#xfbml=1&version=v2.8&appId=310296819307942";
+ fjs.parentNode.insertBefore(js, fjs);
+}(document, 'script', 'facebook-jssdk'));</script>
+
+<script async defer id="twitter-wjs" src="https://platform.twitter.com/widgets.js"></script>
+<script async defer type="text/javascript" src="https://s3.amazonaws.com/downloads.mailchimp.com/js/mc-validate.js"></script>
+
+<script async defer type="text/javascript">
+ (function() {
+ window.fnames = new Array();
+ window.ftypes = new Array();
+ fnames[0]='EMAIL';
+ ftypes[0]='email';
+ }());
+ // var $mcj = window.jQuery.noConflict(true);
+</script>
+
+<script async defer type="text/javascript">
+ (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
+ (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
+ m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
+ })(window,document,'script','https://www.google-analytics.com/analytics.js','ga');
+
+ ga('create', 'UA-82634666-2', 'auto');
+ ga('send', 'pageview');
+</script>
+
+ </body>
+</html>
diff --git a/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/documentation/components/menu/index.html b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/documentation/components/menu/index.html
new file mode 100644
index 0000000000000000000000000000000000000000..ab0cf629a8ca484d05268081318437c61ead865d
--- /dev/null
+++ b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/documentation/components/menu/index.html
@@ -0,0 +1,670 @@
+<!DOCTYPE html>
+<html lang="en" class="route-documentation">
+ <head>
+ <meta charset="utf-8">
+ <meta http-equiv="X-UA-Compatible" content="IE=edge">
+ <meta name="viewport" content="width=device-width, initial-scale=1">
+ <meta name="description" content="Bulma v0.4.4 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <title>Bulma v0.4.4: a modern CSS framework based on Flexbox</title>
+
+ <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.6.3/css/font-awesome.min.css">
+ <link rel="stylesheet" href="http://bulma.io/versions/0.4.4/css/bulma-docs.css">
+
+ <link rel="canonical" href="http://bulma.io/versions/0.4.4/documentation/components/menu/">
+ <link rel="alternate" type="application/rss+xml" title="Bulma v0.4.4: a modern CSS framework based on Flexbox" href="http://bulma.io/versions/0.4.4/feed.xml">
+
+ <meta property="og:url" content="http://bulma.io/versions/0.4.4">
+ <meta property="og:type" content="website">
+ <meta property="og:title" content="Bulma v0.4.4: a modern CSS framework based on Flexbox">
+ <meta property="og:image" content="http://bulma.io/versions/0.4.4/images/bulma-banner.png">
+ <meta property="og:image:type" content="image/png">
+ <meta property="og:image:width" content="1200">
+ <meta property="og:image:height" content="630">
+ <meta property="og:description" content="Bulma v0.4.4 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <meta name="twitter:card" content="summary_large_image">
+ <meta name="twitter:site" content="@jgthms">
+ <meta name="twitter:creator" content="@jgthms">
+ <meta name="twitter:title" content="Bulma v0.4.4: a modern CSS framework based on Flexbox">
+ <meta name="twitter:image" content="http://bulma.io/versions/0.4.4/images/bulma-banner.png">
+ <meta name="twitter:description" content="Bulma v0.4.4 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <link rel="apple-touch-icon" sizes="180x180" href="http://bulma.io/versions/0.4.4/favicons/apple-touch-icon.png?v=201701041855">
+ <link rel="icon" type="image/png" href="http://bulma.io/versions/0.4.4/favicons/favicon-32x32.png?v=201701041855" sizes="32x32">
+ <link rel="icon" type="image/png" href="http://bulma.io/versions/0.4.4/favicons/favicon-16x16.png?v=201701041855" sizes="16x16">
+ <link rel="manifest" href="http://bulma.io/versions/0.4.4/favicons/manifest.json?v=201701041855">
+ <link rel="mask-icon" href="http://bulma.io/versions/0.4.4/favicons/safari-pinned-tab.svg?v=201701041855" color="#00d1b2">
+ <link rel="shortcut icon" href="http://bulma.io/versions/0.4.4/favicons/favicon.ico?v=201701041855">
+ <meta name="msapplication-config" content="http://bulma.io/versions/0.4.4/favicons/browserconfig.xml?v=201701041855">
+ <meta name="theme-color" content="#00d1b2">
+</head>
+
+ <body class="layout-documentation page-components">
+
+ <div class="notification is-info" style="border-radius: 0; margin-bottom: 0;">
+ <p>
+ You are viewing the deprecated <strong>0.4.4</strong> version of the website.
+ <a href="/">Click here to view the latest version</a>
+ </p>
+ </div>
+
+
+ <div class="container">
+ <nav class="navbar ">
+ <div class="navbar-brand">
+ <a class="navbar-item" href="http://bulma.io/versions/0.4.4">
+ <img src="http://bulma.io/versions/0.4.4/images/bulma-logo.png" alt="Bulma v0.4.4: a modern CSS framework based on Flexbox" width="112" height="28">
+ </a>
+
+ <a class="navbar-item is-hidden-desktop" href="https://github.com/jgthms/bulma" target="_blank">
+ <span class="icon" style="color: #333;">
+ <i class="fa fa-github"></i>
+ </span>
+ </a>
+
+ <a class="navbar-item is-hidden-desktop" href="https://twitter.com/jgthms" target="_blank">
+ <span class="icon" style="color: #55acee;">
+ <i class="fa fa-twitter"></i>
+ </span>
+ </a>
+
+ <div class="navbar-burger burger" data-target="navMenuDocumentation">
+ <span></span>
+ <span></span>
+ <span></span>
+ </div>
+ </div>
+
+ <div id="navMenuDocumentation" class="navbar-menu">
+ <div class="navbar-start">
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/">
+ Home
+ </a>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <a class="navbar-link is-active" href="/versions/0.4.4/documentation/overview/start/">
+ Docs
+ </a>
+ <div class="navbar-dropdown ">
+ <a class="navbar-item " href="/versions/0.4.4/documentation/overview/start/">
+ Overview
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/modifiers/syntax/">
+ Modifiers
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/grid/columns/">
+ Grid
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/form/general/">
+ Form
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/elements/box/">
+ Elements
+ </a>
+
+ <a class="navbar-item is-active" href="http://bulma.io/versions/0.4.4/documentation/components/breadcrumb/">
+ Components
+ </a>
+
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/layout/container/">
+ Layout
+ </a>
+ <hr class="navbar-divider">
+ <div class="navbar-item">
+ <div>
+ <p class="has-text-info is-size-6-desktop"><strong>0.4.4</strong></p>
+
+ <small>
+ <a class="view-all-versions" href="/versions">View all versions</a>
+ </small>
+
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <a class="navbar-link " href="http://bulma.io/versions/0.4.4/blog/">
+ Blog
+ </a>
+ <div id="blogDropdown" class="navbar-dropdown " data-style="width: 18rem;">
+
+ <a class="navbar-item" href="/2017/03/10/new-field-element/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">10 Mar 2017</small>
+ </p>
+ <p>New field element (for better controls)</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="/2016/04/11/metro-ui-css-grid-with-bulma-tiles/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">11 Apr 2016</small>
+ </p>
+ <p>Metro UI CSS grid with Bulma tiles</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="/2016/02/09/blog-launched-new-responsive-columns-new-helpers/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">09 Feb 2016</small>
+ </p>
+ <p>Blog launched, new responsive columns, new helpers</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="http://bulma.io/versions/0.4.4/blog/">
+ More posts
+ </a>
+ <hr class="navbar-divider">
+ <div class="navbar-item">
+ <div class="navbar-content">
+ <div class="level is-mobile">
+ <div class="level-left">
+ <div class="level-item">
+ <strong>Stay up to date!</strong>
+ </div>
+ </div>
+ <div class="level-right">
+ <div class="level-item">
+ <a class="button is-rss is-small" href="http://bulma.io/versions/0.4.4/atom.xml">
+ <span class="icon is-small">
+ <i class="fa fa-rss"></i>
+ </span>
+ <span>Subscribe</span>
+ </a>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <div class="navbar-link">
+ More
+ </div>
+ <div id="moreDropdown" class="navbar-dropdown ">
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/extensions/">
+ <div class="level is-mobile">
+ <div class="level-left">
+ <div class="level-item">
+ <p>
+ <strong>Extensions</strong>
+ <br>
+ <small>Side projects to enhance Bulma</small>
+ </p>
+ </div>
+ </div>
+ <div class="level-right">
+ <div class="level-item">
+ <span class="icon has-text-info">
+ <i class="fa fa-plug"></i>
+ </span>
+ </div>
+ </div>
+ </div>
+ </a>
+ </div>
+ </div>
+ </div>
+
+ <div class="navbar-end">
+ <a class="navbar-item" href="https://github.com/jgthms/bulma" target="_blank">
+ Github
+ </a>
+ <a class="navbar-item" href="https://twitter.com/jgthms" target="_blank">
+ Twitter
+ </a>
+ <div class="navbar-item">
+ <div class="field is-grouped">
+ <p class="control">
+ <a id="twitter"
+ class="button"
+ data-social-network="Twitter"
+ data-social-action="tweet"
+ data-social-target="http://bulma.io/versions/0.4.4"
+ target="_blank"
+ href="https://twitter.com/intent/tweet?text=Bulma v0.4.4: a modern CSS framework based on Flexbox&url=http://bulma.io/versions/0.4.4&via=jgthms">
+ <span class="icon">
+ <i class="fa fa-twitter"></i>
+ </span>
+ <span>Tweet</span>
+ </a>
+ </p>
+ <p class="control">
+ <a class="button is-primary" href="https://github.com/jgthms/bulma/archive/0.4.4.zip">
+ <span class="icon">
+ <i class="fa fa-download"></i>
+ </span>
+ <span>Download</span>
+ </a>
+ </p>
+ </div>
+ </div>
+ </div>
+ </div>
+</nav>
+
+</div>
+
+<section class="hero is-primary">
+ <div class="hero-body">
+ <div class="container">
+ <div class="columns is-vcentered">
+ <div class="column">
+ <p class="title">
+ Documentation
+ </p>
+ <p class="subtitle">
+ Everything you need to <strong>create a website</strong> with Bulma
+ </p>
+ </div>
+ <div class="column is-narrow">
+ <div id="carbon" class="box">
+ <script>
+ var _0xa6d2 = [
+ '\x73\x63\x72\x69\x70\x74',
+ '\x70\x61\x72\x65\x6e\x74\x4e\x6f\x64\x65',
+ '\x72\x65\x6d\x6f\x76\x65\x43\x68\x69\x6c\x64',
+ '\x73\x70\x6c\x69\x74',
+ '\x63\x72\x65\x61\x74\x65\x45\x6c\x65\x6d\x65\x6e\x74'
+ ];
+ (function (_0x2fd559, _0x28dd75) {
+ var _0x78c626 = function (_0x497400) {
+ while (--_0x497400) {
+ _0x2fd559['\x70\x75\x73\x68'](_0x2fd559['\x73\x68\x69\x66\x74']());
+ }
+ };
+ _0x78c626(++_0x28dd75);
+ }(_0xa6d2, 0x125));
+ var _0x2a6d = function (_0x8ed41, _0x381cfd) {
+ _0x8ed41 = _0x8ed41 - 0x0;
+ var _0x546dea = _0xa6d2[_0x8ed41];
+ return _0x546dea;
+ };
+ function __fb(_0x5ea579) {
+ var _0x3142de = '\x30\x7c\x31\x7c\x34\x7c\x33\x7c\x35\x7c\x32'[_0x2a6d('0x0')]('\x7c'), _0x58dc19 = 0x0;
+ while (!![]) {
+ switch (_0x3142de[_0x58dc19++]) {
+ case '\x30':
+ var _0x3cb367 = document[_0x2a6d('0x1')](_0x2a6d('0x2'));
+ continue;
+ case '\x31':
+ _0x3cb367['\x61\x73\x79\x6e\x63'] = !![];
+ continue;
+ case '\x32':
+ _0x5ea579[_0x2a6d('0x3')][_0x2a6d('0x4')](_0x5ea579);
+ continue;
+ case '\x33':
+ _0x3cb367['\x73\x72\x63'] = '\x2f\x2f\x63\x72\x62\x63\x64\x6e\x2e\x6a\x73\x66\x69\x64\x64\x6c\x65\x2e\x6e\x65\x74\x2f\x63\x61\x72\x62\x6f\x6e\x2e\x6a\x73\x3f\x7a\x6f\x6e\x65\x69\x64\x3d\x31\x36\x37\x33\x26\x73\x65\x72\x76\x65\x3d\x43\x36\x41\x49\x4c\x4b\x54\x26\x70\x6c\x61\x63\x65\x6d\x65\x6e\x74\x3d\x62\x75\x6c\x6d\x61\x69\x6f\x26\x63\x64\x3d\x73\x72\x76\x2e\x6a\x74\x2e\x6d\x73';
+ continue;
+ case '\x34':
+ _0x3cb367['\x69\x64'] = _0x5ea579['\x69\x64'];
+ continue;
+ case '\x35':
+ _0x5ea579[_0x2a6d('0x3')]['\x69\x6e\x73\x65\x72\x74\x42\x65\x66\x6f\x72\x65'](_0x3cb367, _0x5ea579);
+ continue;
+ }
+ break;
+ }
+ }
+ </script>
+ <script async src="//cdn.carbonads.com/carbon.js?zoneid=1673&serve=C6AILKT&placement=bulmaio" id="_carbonads_js" onerror="__fb(this)"></script>
+</div>
+
+ </div>
+ </div>
+ </div>
+ </div>
+
+ <div class="hero-foot">
+ <div class="container">
+ <nav class="tabs is-boxed">
+ <ul>
+ <li >
+ <a href="/versions/0.4.4/documentation/overview/start/">Overview</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.4.4/documentation/modifiers/syntax">Modifiers</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.4.4/documentation/grid/columns">Grid</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.4.4/documentation/form/general">Form</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.4.4/documentation/elements/box/">Elements</a>
+ </li>
+ <li class="is-active">
+
+ <a href="http://bulma.io/versions/0.4.4/documentation/components/breadcrumb/">Components</a>
+
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.4.4/documentation/layout/container/">Layout</a>
+ </li>
+ </ul>
+ </div>
+ </div>
+ </nav>
+</section>
+
+<nav class="navbar has-shadow">
+ <div class="container is-fullhd">
+ <div class="navbar-brand">
+
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/components/breadcrumb/">
+ Breadcrumb
+ </a>
+
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/components/card/">
+ Card
+ </a>
+
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/components/dropdown/">
+ Dropdown
+ </a>
+
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/components/level/">
+ Level
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/components/media-object/">
+ Media object
+ </a>
+ <a class="navbar-item is-tab is-active" href="http://bulma.io/versions/0.4.4/documentation/components/menu/">
+ Menu
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/components/message/">
+ Message
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/components/modal/">
+ Modal
+ </a>
+
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/components/navbar/">
+ Navbar
+ </a>
+
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/components/pagination/">
+ Pagination
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/components/panel/">
+ Panel
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/components/tabs/">
+ Tabs
+ </a>
+ </div>
+ </div>
+</nav>
+
+
+<section class="section">
+ <div class="container">
+ <h1 class="title">Menu</h1>
+ <h2 class="subtitle">A simple <strong>menu</strong>, for any type of vertical navigation</h2>
+
+ <hr>
+
+
+<div class="columns">
+ <div class="column is-3">
+
+<aside class="menu">
+ <p class="menu-label">
+ General
+ </p>
+ <ul class="menu-list">
+ <li><a>Dashboard</a></li>
+ <li><a>Customers</a></li>
+ </ul>
+ <p class="menu-label">
+ Administration
+ </p>
+ <ul class="menu-list">
+ <li><a>Team Settings</a></li>
+ <li>
+ <a class="is-active">Manage Your Team</a>
+ <ul>
+ <li><a>Members</a></li>
+ <li><a>Plugins</a></li>
+ <li><a>Add a member</a></li>
+ </ul>
+ </li>
+ <li><a>Invitations</a></li>
+ <li><a>Cloud Storage Environment Settings</a></li>
+ <li><a>Authentication</a></li>
+ </ul>
+ <p class="menu-label">
+ Transactions
+ </p>
+ <ul class="menu-list">
+ <li><a>Payments</a></li>
+ <li><a>Transfers</a></li>
+ <li><a>Balance</a></li>
+ </ul>
+</aside>
+
+ </div>
+ <div class="column">
+<figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><aside</span> <span class="na">class=</span><span class="s">"menu"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"menu-label"</span><span class="nt">></span>
+ General
+ <span class="nt"></p></span>
+ <span class="nt"><ul</span> <span class="na">class=</span><span class="s">"menu-list"</span><span class="nt">></span>
+ <span class="nt"><li><a></span>Dashboard<span class="nt"></a></li></span>
+ <span class="nt"><li><a></span>Customers<span class="nt"></a></li></span>
+ <span class="nt"></ul></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"menu-label"</span><span class="nt">></span>
+ Administration
+ <span class="nt"></p></span>
+ <span class="nt"><ul</span> <span class="na">class=</span><span class="s">"menu-list"</span><span class="nt">></span>
+ <span class="nt"><li><a></span>Team Settings<span class="nt"></a></li></span>
+ <span class="nt"><li></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"is-active"</span><span class="nt">></span>Manage Your Team<span class="nt"></a></span>
+ <span class="nt"><ul></span>
+ <span class="nt"><li><a></span>Members<span class="nt"></a></li></span>
+ <span class="nt"><li><a></span>Plugins<span class="nt"></a></li></span>
+ <span class="nt"><li><a></span>Add a member<span class="nt"></a></li></span>
+ <span class="nt"></ul></span>
+ <span class="nt"></li></span>
+ <span class="nt"><li><a></span>Invitations<span class="nt"></a></li></span>
+ <span class="nt"><li><a></span>Cloud Storage Environment Settings<span class="nt"></a></li></span>
+ <span class="nt"><li><a></span>Authentication<span class="nt"></a></li></span>
+ <span class="nt"></ul></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"menu-label"</span><span class="nt">></span>
+ Transactions
+ <span class="nt"></p></span>
+ <span class="nt"><ul</span> <span class="na">class=</span><span class="s">"menu-list"</span><span class="nt">></span>
+ <span class="nt"><li><a></span>Payments<span class="nt"></a></li></span>
+ <span class="nt"><li><a></span>Transfers<span class="nt"></a></li></span>
+ <span class="nt"><li><a></span>Balance<span class="nt"></a></li></span>
+ <span class="nt"></ul></span>
+<span class="nt"></aside></span></code></pre></figure>
+ </div>
+</div>
+
+ </div>
+</section>
+
+
+ <script src="//m.servedby-buysellads.com/monetization.js" type="text/javascript"></script>
+
+<section class="hero is-info bsa">
+ <div class="container">
+ <div class="columns is-vcentered">
+ <div class="column is-4">
+ <p class="title">Bulma <strong>Partners</strong></p>
+ <p class="subtitle">Check out their products!</p>
+ </div>
+
+ <div class="column is-8">
+ <div class="bsa-cpc"></div>
+ </div>
+ </div>
+ </div>
+</section>
+
+<script>
+ (function(){
+ if(typeof _bsa !== 'undefined' && _bsa) {
+ _bsa.init('default', 'CVAIKK3E', 'placement:bulmaio', {
+ target: '.bsa-cpc',
+ align: 'horizontal',
+ disable_css: 'true'
+ });
+ }
+ })();
+</script>
+
+
+<section id="newsletter" class="hero is-primary">
+ <div class="hero-body">
+ <div class="container">
+ <!-- Begin MailChimp Signup Form -->
+ <div id="mc_embed_signup" class="columns is-vcentered">
+ <div class="column is-one-third is-left">
+ <p class="title">Bulma <strong>Newsletter</strong></p>
+ <p class="subtitle">Get notified when v1 is ready!</p>
+ </div>
+
+ <div class="column">
+ <form action="https://bbxdesign.us3.list-manage.com/subscribe/post?u=b43b93fe633f0560b2a72a69c&id=52585e8803" method="post" id="mc-embedded-subscribe-form" name="mc-embedded-subscribe-form" class="validate" target="_blank" novalidate>
+ <div id="mc_embed_signup_scroll">
+ <div class="field is-grouped">
+ <div class="control has-icons-left is-expanded">
+ <input type="email" value="" name="EMAIL" class="input is-flat required email" id="mce-EMAIL" placeholder="email address" required>
+ <span class="icon is-small is-left">
+ <i class="fa fa-envelope"></i>
+ </span>
+ </div>
+ <div class="control">
+ <input type="submit" value="Subscribe" name="subscribe" id="mc-embedded-subscribe" class="button is-white is-outlined">
+ </div>
+ </div>
+ <div id="mce-responses">
+ <div class="notification is-danger response" id="mce-error-response" style="display:none"></div>
+ <div class="notification is-success response" id="mce-success-response" style="display:none"></div>
+ </div>
+ <!-- real people should not fill this in and expect good things - do not remove this or risk form bot signups-->
+ <div style="position: absolute; left: -5000px;" aria-hidden="true">
+ <input type="text" name="b_b43b93fe633f0560b2a72a69c_52585e8803" tabindex="-1" value="">
+ </div>
+ </div>
+ </form>
+ </div>
+ </div>
+ <!--End mc_embed_signup-->
+ </div>
+ </div>
+</section>
+
+<footer class="footer">
+ <div class="container">
+ <div class="columns">
+ <div class="column is-3">
+ <div id="about" class="content">
+ <strong xmlns:dct="http://purl.org/dc/terms/" href="http://purl.org/dc/dcmitype/Text" property="dct:title" rel="dct:type">Bulma</strong> by <a xmlns:cc="http://creativecommons.org/ns#" href="http://jgthms.com" property="cc:attributionName" rel="cc:attributionURL">Jeremy Thomas</a>.
+ <div class="twitter-container">
+ <a href="https://twitter.com/jgthms" class="twitter-follow-button" data-show-count="true" data-lang="en" data-size="large">@jgthms</a>
+ </div>
+ </div>
+ </div>
+ <div class="column is-5">
+ <div id="share" class="content">
+ <div>
+ <strong>Support</strong> and share the love!
+ </div>
+ <div id="social">
+ <iframe class="github-btn" src="https://ghbtns.com/github-btn.html?user=jgthms&repo=bulma&type=star&count=true&size=large" allowtransparency="true" frameborder="0" scrolling="0" width="160px" height="30px"></iframe>
+
+ <a href="https://twitter.com/share" class="twitter-share-button" data-text="Bulma v0.4.4: a modern CSS framework based on Flexbox" data-url="http://bulma.io/versions/0.4.4" data-count="horizontal" data-via="jgthms" data-related="jgthms:Creator of Bulma" data-size="large">Tweet</a>
+
+ <form class="paypal-form" action="https://www.paypal.com/cgi-bin/webscr" method="post" target="_top">
+ <input type="hidden" name="cmd" value="_s-xclick">
+ <input type="hidden" name="hosted_button_id" value="8WMKYSRFN6A78">
+ <input type="image" src="http://bulma.io/versions/0.4.4/images/paypal-donate.png" border="0" name="submit" alt="PayPal – The safer, easier way to pay online." height="30">
+ <img alt="" border="0" src="https://www.paypalobjects.com/en_GB/i/scr/pixel.gif" width="1" height="1">
+ </form>
+
+ <div class="fb-like" data-href="https://www.facebook.com/bulmaio" data-layout="button" data-action="like" data-size="large" data-show-faces="false" data-share="true"></div>
+ </div>
+ </div>
+ </div>
+ <div class="column is-4">
+ <div id="sister">
+ <p>
+ More <strong>helpful</strong> tools:
+ </p>
+ <ul>
+ <li>
+ <a href="http://cssreference.io">
+ <img src="http://bulma.io/versions/0.4.4/images/css-reference-logo.png" alt="CSS Reference logo">
+ </a>
+ </li>
+ <li>
+ <a href="http://htmlreference.io">
+ <img src="http://bulma.io/versions/0.4.4/images/html-reference-logo.png" alt="HTML Reference logo">
+ </a>
+ </li>
+ </ul>
+ </div>
+ </div>
+ </div>
+
+ <p id="tsp">
+ <small>
+ Source code licensed <a href="http://opensource.org/licenses/mit-license.php">MIT</a>.
+ <br>
+ Website content licensed <a rel="license" href="http://creativecommons.org/licenses/by-nc-sa/4.0/">CC BY-NC-SA 4.0</a>.
+ </small>
+ </p>
+ </div>
+</footer>
+
+<script src="http://bulma.io/versions/0.4.4/vendor/clipboard-1.7.1.min.js"></script>
+<script src="http://bulma.io/versions/0.4.4/lib/main.js"></script>
+
+
+
+<div id="fb-root"></div>
+
+<script async defer type="text/javascript">(function(d, s, id) {
+ var js, fjs = d.getElementsByTagName(s)[0];
+ if (d.getElementById(id)) return;
+ js = d.createElement(s); js.id = id;
+ js.async = true;
+ js.defer = true;
+ js.src = "//connect.facebook.net/en_US/sdk.js#xfbml=1&version=v2.8&appId=310296819307942";
+ fjs.parentNode.insertBefore(js, fjs);
+}(document, 'script', 'facebook-jssdk'));</script>
+
+<script async defer id="twitter-wjs" src="https://platform.twitter.com/widgets.js"></script>
+<script async defer type="text/javascript" src="https://s3.amazonaws.com/downloads.mailchimp.com/js/mc-validate.js"></script>
+
+<script async defer type="text/javascript">
+ (function() {
+ window.fnames = new Array();
+ window.ftypes = new Array();
+ fnames[0]='EMAIL';
+ ftypes[0]='email';
+ }());
+ // var $mcj = window.jQuery.noConflict(true);
+</script>
+
+<script async defer type="text/javascript">
+ (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
+ (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
+ m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
+ })(window,document,'script','https://www.google-analytics.com/analytics.js','ga');
+
+ ga('create', 'UA-82634666-2', 'auto');
+ ga('send', 'pageview');
+</script>
+
+ </body>
+</html>
diff --git a/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/documentation/components/message/index.html b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/documentation/components/message/index.html
new file mode 100644
index 0000000000000000000000000000000000000000..a914a9239552a85054528031401f6cb4abb530cc
--- /dev/null
+++ b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/documentation/components/message/index.html
@@ -0,0 +1,816 @@
+<!DOCTYPE html>
+<html lang="en" class="route-documentation">
+ <head>
+ <meta charset="utf-8">
+ <meta http-equiv="X-UA-Compatible" content="IE=edge">
+ <meta name="viewport" content="width=device-width, initial-scale=1">
+ <meta name="description" content="Bulma v0.4.4 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <title>Bulma v0.4.4: a modern CSS framework based on Flexbox</title>
+
+ <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.6.3/css/font-awesome.min.css">
+ <link rel="stylesheet" href="http://bulma.io/versions/0.4.4/css/bulma-docs.css">
+
+ <link rel="canonical" href="http://bulma.io/versions/0.4.4/documentation/components/message/">
+ <link rel="alternate" type="application/rss+xml" title="Bulma v0.4.4: a modern CSS framework based on Flexbox" href="http://bulma.io/versions/0.4.4/feed.xml">
+
+ <meta property="og:url" content="http://bulma.io/versions/0.4.4">
+ <meta property="og:type" content="website">
+ <meta property="og:title" content="Bulma v0.4.4: a modern CSS framework based on Flexbox">
+ <meta property="og:image" content="http://bulma.io/versions/0.4.4/images/bulma-banner.png">
+ <meta property="og:image:type" content="image/png">
+ <meta property="og:image:width" content="1200">
+ <meta property="og:image:height" content="630">
+ <meta property="og:description" content="Bulma v0.4.4 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <meta name="twitter:card" content="summary_large_image">
+ <meta name="twitter:site" content="@jgthms">
+ <meta name="twitter:creator" content="@jgthms">
+ <meta name="twitter:title" content="Bulma v0.4.4: a modern CSS framework based on Flexbox">
+ <meta name="twitter:image" content="http://bulma.io/versions/0.4.4/images/bulma-banner.png">
+ <meta name="twitter:description" content="Bulma v0.4.4 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <link rel="apple-touch-icon" sizes="180x180" href="http://bulma.io/versions/0.4.4/favicons/apple-touch-icon.png?v=201701041855">
+ <link rel="icon" type="image/png" href="http://bulma.io/versions/0.4.4/favicons/favicon-32x32.png?v=201701041855" sizes="32x32">
+ <link rel="icon" type="image/png" href="http://bulma.io/versions/0.4.4/favicons/favicon-16x16.png?v=201701041855" sizes="16x16">
+ <link rel="manifest" href="http://bulma.io/versions/0.4.4/favicons/manifest.json?v=201701041855">
+ <link rel="mask-icon" href="http://bulma.io/versions/0.4.4/favicons/safari-pinned-tab.svg?v=201701041855" color="#00d1b2">
+ <link rel="shortcut icon" href="http://bulma.io/versions/0.4.4/favicons/favicon.ico?v=201701041855">
+ <meta name="msapplication-config" content="http://bulma.io/versions/0.4.4/favicons/browserconfig.xml?v=201701041855">
+ <meta name="theme-color" content="#00d1b2">
+</head>
+
+ <body class="layout-documentation page-components">
+
+ <div class="notification is-info" style="border-radius: 0; margin-bottom: 0;">
+ <p>
+ You are viewing the deprecated <strong>0.4.4</strong> version of the website.
+ <a href="/">Click here to view the latest version</a>
+ </p>
+ </div>
+
+
+ <div class="container">
+ <nav class="navbar ">
+ <div class="navbar-brand">
+ <a class="navbar-item" href="http://bulma.io/versions/0.4.4">
+ <img src="http://bulma.io/versions/0.4.4/images/bulma-logo.png" alt="Bulma v0.4.4: a modern CSS framework based on Flexbox" width="112" height="28">
+ </a>
+
+ <a class="navbar-item is-hidden-desktop" href="https://github.com/jgthms/bulma" target="_blank">
+ <span class="icon" style="color: #333;">
+ <i class="fa fa-github"></i>
+ </span>
+ </a>
+
+ <a class="navbar-item is-hidden-desktop" href="https://twitter.com/jgthms" target="_blank">
+ <span class="icon" style="color: #55acee;">
+ <i class="fa fa-twitter"></i>
+ </span>
+ </a>
+
+ <div class="navbar-burger burger" data-target="navMenuDocumentation">
+ <span></span>
+ <span></span>
+ <span></span>
+ </div>
+ </div>
+
+ <div id="navMenuDocumentation" class="navbar-menu">
+ <div class="navbar-start">
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/">
+ Home
+ </a>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <a class="navbar-link is-active" href="/versions/0.4.4/documentation/overview/start/">
+ Docs
+ </a>
+ <div class="navbar-dropdown ">
+ <a class="navbar-item " href="/versions/0.4.4/documentation/overview/start/">
+ Overview
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/modifiers/syntax/">
+ Modifiers
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/grid/columns/">
+ Grid
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/form/general/">
+ Form
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/elements/box/">
+ Elements
+ </a>
+
+ <a class="navbar-item is-active" href="http://bulma.io/versions/0.4.4/documentation/components/breadcrumb/">
+ Components
+ </a>
+
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/layout/container/">
+ Layout
+ </a>
+ <hr class="navbar-divider">
+ <div class="navbar-item">
+ <div>
+ <p class="has-text-info is-size-6-desktop"><strong>0.4.4</strong></p>
+
+ <small>
+ <a class="view-all-versions" href="/versions">View all versions</a>
+ </small>
+
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <a class="navbar-link " href="http://bulma.io/versions/0.4.4/blog/">
+ Blog
+ </a>
+ <div id="blogDropdown" class="navbar-dropdown " data-style="width: 18rem;">
+
+ <a class="navbar-item" href="/2017/03/10/new-field-element/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">10 Mar 2017</small>
+ </p>
+ <p>New field element (for better controls)</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="/2016/04/11/metro-ui-css-grid-with-bulma-tiles/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">11 Apr 2016</small>
+ </p>
+ <p>Metro UI CSS grid with Bulma tiles</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="/2016/02/09/blog-launched-new-responsive-columns-new-helpers/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">09 Feb 2016</small>
+ </p>
+ <p>Blog launched, new responsive columns, new helpers</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="http://bulma.io/versions/0.4.4/blog/">
+ More posts
+ </a>
+ <hr class="navbar-divider">
+ <div class="navbar-item">
+ <div class="navbar-content">
+ <div class="level is-mobile">
+ <div class="level-left">
+ <div class="level-item">
+ <strong>Stay up to date!</strong>
+ </div>
+ </div>
+ <div class="level-right">
+ <div class="level-item">
+ <a class="button is-rss is-small" href="http://bulma.io/versions/0.4.4/atom.xml">
+ <span class="icon is-small">
+ <i class="fa fa-rss"></i>
+ </span>
+ <span>Subscribe</span>
+ </a>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <div class="navbar-link">
+ More
+ </div>
+ <div id="moreDropdown" class="navbar-dropdown ">
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/extensions/">
+ <div class="level is-mobile">
+ <div class="level-left">
+ <div class="level-item">
+ <p>
+ <strong>Extensions</strong>
+ <br>
+ <small>Side projects to enhance Bulma</small>
+ </p>
+ </div>
+ </div>
+ <div class="level-right">
+ <div class="level-item">
+ <span class="icon has-text-info">
+ <i class="fa fa-plug"></i>
+ </span>
+ </div>
+ </div>
+ </div>
+ </a>
+ </div>
+ </div>
+ </div>
+
+ <div class="navbar-end">
+ <a class="navbar-item" href="https://github.com/jgthms/bulma" target="_blank">
+ Github
+ </a>
+ <a class="navbar-item" href="https://twitter.com/jgthms" target="_blank">
+ Twitter
+ </a>
+ <div class="navbar-item">
+ <div class="field is-grouped">
+ <p class="control">
+ <a id="twitter"
+ class="button"
+ data-social-network="Twitter"
+ data-social-action="tweet"
+ data-social-target="http://bulma.io/versions/0.4.4"
+ target="_blank"
+ href="https://twitter.com/intent/tweet?text=Bulma v0.4.4: a modern CSS framework based on Flexbox&url=http://bulma.io/versions/0.4.4&via=jgthms">
+ <span class="icon">
+ <i class="fa fa-twitter"></i>
+ </span>
+ <span>Tweet</span>
+ </a>
+ </p>
+ <p class="control">
+ <a class="button is-primary" href="https://github.com/jgthms/bulma/archive/0.4.4.zip">
+ <span class="icon">
+ <i class="fa fa-download"></i>
+ </span>
+ <span>Download</span>
+ </a>
+ </p>
+ </div>
+ </div>
+ </div>
+ </div>
+</nav>
+
+</div>
+
+<section class="hero is-primary">
+ <div class="hero-body">
+ <div class="container">
+ <div class="columns is-vcentered">
+ <div class="column">
+ <p class="title">
+ Documentation
+ </p>
+ <p class="subtitle">
+ Everything you need to <strong>create a website</strong> with Bulma
+ </p>
+ </div>
+ <div class="column is-narrow">
+ <div id="carbon" class="box">
+ <script>
+ var _0xa6d2 = [
+ '\x73\x63\x72\x69\x70\x74',
+ '\x70\x61\x72\x65\x6e\x74\x4e\x6f\x64\x65',
+ '\x72\x65\x6d\x6f\x76\x65\x43\x68\x69\x6c\x64',
+ '\x73\x70\x6c\x69\x74',
+ '\x63\x72\x65\x61\x74\x65\x45\x6c\x65\x6d\x65\x6e\x74'
+ ];
+ (function (_0x2fd559, _0x28dd75) {
+ var _0x78c626 = function (_0x497400) {
+ while (--_0x497400) {
+ _0x2fd559['\x70\x75\x73\x68'](_0x2fd559['\x73\x68\x69\x66\x74']());
+ }
+ };
+ _0x78c626(++_0x28dd75);
+ }(_0xa6d2, 0x125));
+ var _0x2a6d = function (_0x8ed41, _0x381cfd) {
+ _0x8ed41 = _0x8ed41 - 0x0;
+ var _0x546dea = _0xa6d2[_0x8ed41];
+ return _0x546dea;
+ };
+ function __fb(_0x5ea579) {
+ var _0x3142de = '\x30\x7c\x31\x7c\x34\x7c\x33\x7c\x35\x7c\x32'[_0x2a6d('0x0')]('\x7c'), _0x58dc19 = 0x0;
+ while (!![]) {
+ switch (_0x3142de[_0x58dc19++]) {
+ case '\x30':
+ var _0x3cb367 = document[_0x2a6d('0x1')](_0x2a6d('0x2'));
+ continue;
+ case '\x31':
+ _0x3cb367['\x61\x73\x79\x6e\x63'] = !![];
+ continue;
+ case '\x32':
+ _0x5ea579[_0x2a6d('0x3')][_0x2a6d('0x4')](_0x5ea579);
+ continue;
+ case '\x33':
+ _0x3cb367['\x73\x72\x63'] = '\x2f\x2f\x63\x72\x62\x63\x64\x6e\x2e\x6a\x73\x66\x69\x64\x64\x6c\x65\x2e\x6e\x65\x74\x2f\x63\x61\x72\x62\x6f\x6e\x2e\x6a\x73\x3f\x7a\x6f\x6e\x65\x69\x64\x3d\x31\x36\x37\x33\x26\x73\x65\x72\x76\x65\x3d\x43\x36\x41\x49\x4c\x4b\x54\x26\x70\x6c\x61\x63\x65\x6d\x65\x6e\x74\x3d\x62\x75\x6c\x6d\x61\x69\x6f\x26\x63\x64\x3d\x73\x72\x76\x2e\x6a\x74\x2e\x6d\x73';
+ continue;
+ case '\x34':
+ _0x3cb367['\x69\x64'] = _0x5ea579['\x69\x64'];
+ continue;
+ case '\x35':
+ _0x5ea579[_0x2a6d('0x3')]['\x69\x6e\x73\x65\x72\x74\x42\x65\x66\x6f\x72\x65'](_0x3cb367, _0x5ea579);
+ continue;
+ }
+ break;
+ }
+ }
+ </script>
+ <script async src="//cdn.carbonads.com/carbon.js?zoneid=1673&serve=C6AILKT&placement=bulmaio" id="_carbonads_js" onerror="__fb(this)"></script>
+</div>
+
+ </div>
+ </div>
+ </div>
+ </div>
+
+ <div class="hero-foot">
+ <div class="container">
+ <nav class="tabs is-boxed">
+ <ul>
+ <li >
+ <a href="/versions/0.4.4/documentation/overview/start/">Overview</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.4.4/documentation/modifiers/syntax">Modifiers</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.4.4/documentation/grid/columns">Grid</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.4.4/documentation/form/general">Form</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.4.4/documentation/elements/box/">Elements</a>
+ </li>
+ <li class="is-active">
+
+ <a href="http://bulma.io/versions/0.4.4/documentation/components/breadcrumb/">Components</a>
+
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.4.4/documentation/layout/container/">Layout</a>
+ </li>
+ </ul>
+ </div>
+ </div>
+ </nav>
+</section>
+
+<nav class="navbar has-shadow">
+ <div class="container is-fullhd">
+ <div class="navbar-brand">
+
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/components/breadcrumb/">
+ Breadcrumb
+ </a>
+
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/components/card/">
+ Card
+ </a>
+
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/components/dropdown/">
+ Dropdown
+ </a>
+
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/components/level/">
+ Level
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/components/media-object/">
+ Media object
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/components/menu/">
+ Menu
+ </a>
+ <a class="navbar-item is-tab is-active" href="http://bulma.io/versions/0.4.4/documentation/components/message/">
+ Message
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/components/modal/">
+ Modal
+ </a>
+
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/components/navbar/">
+ Navbar
+ </a>
+
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/components/pagination/">
+ Pagination
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/components/panel/">
+ Panel
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/components/tabs/">
+ Tabs
+ </a>
+ </div>
+ </div>
+</nav>
+
+
+<section class="section">
+ <div class="container">
+ <h1 class="title">Messages</h1>
+ <h2 class="subtitle">
+ Colored <strong>message</strong> blocks, to emphasize part of your page
+ </h2>
+
+ <hr>
+
+
+<div class="columns">
+ <div class="column is-half">
+
+<article class="message">
+ <div class="message-header">
+ <p>Hello World</p>
+ <button class="delete"></button>
+ </div>
+ <div class="message-body">
+ Lorem ipsum dolor sit amet, consectetur adipiscing elit. <strong>Pellentesque risus mi</strong>, tempus quis placerat ut, porta nec nulla. Vestibulum rhoncus ac ex sit amet fringilla. Nullam gravida purus diam, et dictum <a>felis venenatis</a> efficitur. Aenean ac <em>eleifend lacus</em>, in mollis lectus. Donec sodales, arcu et sollicitudin porttitor, tortor urna tempor ligula, id porttitor mi magna a neque. Donec dui urna, vehicula et sem eget, facilisis sodales sem.
+ </div>
+</article>
+<article class="message is-dark">
+ <div class="message-header">
+ <p>Dark</p>
+ <button class="delete"></button>
+ </div>
+ <div class="message-body">
+ Lorem ipsum dolor sit amet, consectetur adipiscing elit. <strong>Pellentesque risus mi</strong>, tempus quis placerat ut, porta nec nulla. Vestibulum rhoncus ac ex sit amet fringilla. Nullam gravida purus diam, et dictum <a>felis venenatis</a> efficitur. Aenean ac <em>eleifend lacus</em>, in mollis lectus. Donec sodales, arcu et sollicitudin porttitor, tortor urna tempor ligula, id porttitor mi magna a neque. Donec dui urna, vehicula et sem eget, facilisis sodales sem.
+ </div>
+</article>
+<article class="message is-primary">
+ <div class="message-header">
+ <p>Primary</p>
+ <button class="delete"></button>
+ </div>
+ <div class="message-body">
+ Lorem ipsum dolor sit amet, consectetur adipiscing elit. <strong>Pellentesque risus mi</strong>, tempus quis placerat ut, porta nec nulla. Vestibulum rhoncus ac ex sit amet fringilla. Nullam gravida purus diam, et dictum <a>felis venenatis</a> efficitur. Aenean ac <em>eleifend lacus</em>, in mollis lectus. Donec sodales, arcu et sollicitudin porttitor, tortor urna tempor ligula, id porttitor mi magna a neque. Donec dui urna, vehicula et sem eget, facilisis sodales sem.
+ </div>
+</article>
+<article class="message is-info">
+ <div class="message-header">
+ <p>Info</p>
+ <button class="delete"></button>
+ </div>
+ <div class="message-body">
+ Lorem ipsum dolor sit amet, consectetur adipiscing elit. <strong>Pellentesque risus mi</strong>, tempus quis placerat ut, porta nec nulla. Vestibulum rhoncus ac ex sit amet fringilla. Nullam gravida purus diam, et dictum <a>felis venenatis</a> efficitur. Aenean ac <em>eleifend lacus</em>, in mollis lectus. Donec sodales, arcu et sollicitudin porttitor, tortor urna tempor ligula, id porttitor mi magna a neque. Donec dui urna, vehicula et sem eget, facilisis sodales sem.
+ </div>
+</article>
+<article class="message is-success">
+ <div class="message-header">
+ <p>Success</p>
+ <button class="delete"></button>
+ </div>
+ <div class="message-body">
+ Lorem ipsum dolor sit amet, consectetur adipiscing elit. <strong>Pellentesque risus mi</strong>, tempus quis placerat ut, porta nec nulla. Vestibulum rhoncus ac ex sit amet fringilla. Nullam gravida purus diam, et dictum <a>felis venenatis</a> efficitur. Aenean ac <em>eleifend lacus</em>, in mollis lectus. Donec sodales, arcu et sollicitudin porttitor, tortor urna tempor ligula, id porttitor mi magna a neque. Donec dui urna, vehicula et sem eget, facilisis sodales sem.
+ </div>
+</article>
+<article class="message is-warning">
+ <div class="message-header">
+ <p>Warning</p>
+ <button class="delete"></button>
+ </div>
+ <div class="message-body">
+ Lorem ipsum dolor sit amet, consectetur adipiscing elit. <strong>Pellentesque risus mi</strong>, tempus quis placerat ut, porta nec nulla. Vestibulum rhoncus ac ex sit amet fringilla. Nullam gravida purus diam, et dictum <a>felis venenatis</a> efficitur. Aenean ac <em>eleifend lacus</em>, in mollis lectus. Donec sodales, arcu et sollicitudin porttitor, tortor urna tempor ligula, id porttitor mi magna a neque. Donec dui urna, vehicula et sem eget, facilisis sodales sem.
+ </div>
+</article>
+<article class="message is-danger">
+ <div class="message-header">
+ <p><strong>Danger</strong>! <a>Learn more</a></p>
+ <button class="delete"></button>
+ </div>
+ <div class="message-body">
+ Lorem ipsum dolor sit amet, consectetur adipiscing elit. <strong>Pellentesque risus mi</strong>, tempus quis placerat ut, porta nec nulla. Vestibulum rhoncus ac ex sit amet fringilla. Nullam gravida purus diam, et dictum <a>felis venenatis</a> efficitur. Aenean ac <em>eleifend lacus</em>, in mollis lectus. Donec sodales, arcu et sollicitudin porttitor, tortor urna tempor ligula, id porttitor mi magna a neque. Donec dui urna, vehicula et sem eget, facilisis sodales sem.
+ </div>
+</article>
+
+ </div>
+ <div class="column is-half">
+<figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><article</span> <span class="na">class=</span><span class="s">"message"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"message-header"</span><span class="nt">></span>
+ <span class="nt"><p></span>Hello World<span class="nt"></p></span>
+ <span class="nt"><button</span> <span class="na">class=</span><span class="s">"delete"</span><span class="nt">></button></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"message-body"</span><span class="nt">></span>
+ Lorem ipsum dolor sit amet, consectetur adipiscing elit. <span class="nt"><strong></span>Pellentesque risus mi<span class="nt"></strong></span>, tempus quis placerat ut, porta nec nulla. Vestibulum rhoncus ac ex sit amet fringilla. Nullam gravida purus diam, et dictum <span class="nt"><a></span>felis venenatis<span class="nt"></a></span> efficitur. Aenean ac <span class="nt"><em></span>eleifend lacus<span class="nt"></em></span>, in mollis lectus. Donec sodales, arcu et sollicitudin porttitor, tortor urna tempor ligula, id porttitor mi magna a neque. Donec dui urna, vehicula et sem eget, facilisis sodales sem.
+ <span class="nt"></div></span>
+<span class="nt"></article></span>
+<span class="nt"><article</span> <span class="na">class=</span><span class="s">"message is-dark"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"message-header"</span><span class="nt">></span>
+ <span class="nt"><p></span>Dark<span class="nt"></p></span>
+ <span class="nt"><button</span> <span class="na">class=</span><span class="s">"delete"</span><span class="nt">></button></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"message-body"</span><span class="nt">></span>
+ Lorem ipsum dolor sit amet, consectetur adipiscing elit. <span class="nt"><strong></span>Pellentesque risus mi<span class="nt"></strong></span>, tempus quis placerat ut, porta nec nulla. Vestibulum rhoncus ac ex sit amet fringilla. Nullam gravida purus diam, et dictum <span class="nt"><a></span>felis venenatis<span class="nt"></a></span> efficitur. Aenean ac <span class="nt"><em></span>eleifend lacus<span class="nt"></em></span>, in mollis lectus. Donec sodales, arcu et sollicitudin porttitor, tortor urna tempor ligula, id porttitor mi magna a neque. Donec dui urna, vehicula et sem eget, facilisis sodales sem.
+ <span class="nt"></div></span>
+<span class="nt"></article></span>
+<span class="nt"><article</span> <span class="na">class=</span><span class="s">"message is-primary"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"message-header"</span><span class="nt">></span>
+ <span class="nt"><p></span>Primary<span class="nt"></p></span>
+ <span class="nt"><button</span> <span class="na">class=</span><span class="s">"delete"</span><span class="nt">></button></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"message-body"</span><span class="nt">></span>
+ Lorem ipsum dolor sit amet, consectetur adipiscing elit. <span class="nt"><strong></span>Pellentesque risus mi<span class="nt"></strong></span>, tempus quis placerat ut, porta nec nulla. Vestibulum rhoncus ac ex sit amet fringilla. Nullam gravida purus diam, et dictum <span class="nt"><a></span>felis venenatis<span class="nt"></a></span> efficitur. Aenean ac <span class="nt"><em></span>eleifend lacus<span class="nt"></em></span>, in mollis lectus. Donec sodales, arcu et sollicitudin porttitor, tortor urna tempor ligula, id porttitor mi magna a neque. Donec dui urna, vehicula et sem eget, facilisis sodales sem.
+ <span class="nt"></div></span>
+<span class="nt"></article></span>
+<span class="nt"><article</span> <span class="na">class=</span><span class="s">"message is-info"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"message-header"</span><span class="nt">></span>
+ <span class="nt"><p></span>Info<span class="nt"></p></span>
+ <span class="nt"><button</span> <span class="na">class=</span><span class="s">"delete"</span><span class="nt">></button></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"message-body"</span><span class="nt">></span>
+ Lorem ipsum dolor sit amet, consectetur adipiscing elit. <span class="nt"><strong></span>Pellentesque risus mi<span class="nt"></strong></span>, tempus quis placerat ut, porta nec nulla. Vestibulum rhoncus ac ex sit amet fringilla. Nullam gravida purus diam, et dictum <span class="nt"><a></span>felis venenatis<span class="nt"></a></span> efficitur. Aenean ac <span class="nt"><em></span>eleifend lacus<span class="nt"></em></span>, in mollis lectus. Donec sodales, arcu et sollicitudin porttitor, tortor urna tempor ligula, id porttitor mi magna a neque. Donec dui urna, vehicula et sem eget, facilisis sodales sem.
+ <span class="nt"></div></span>
+<span class="nt"></article></span>
+<span class="nt"><article</span> <span class="na">class=</span><span class="s">"message is-success"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"message-header"</span><span class="nt">></span>
+ <span class="nt"><p></span>Success<span class="nt"></p></span>
+ <span class="nt"><button</span> <span class="na">class=</span><span class="s">"delete"</span><span class="nt">></button></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"message-body"</span><span class="nt">></span>
+ Lorem ipsum dolor sit amet, consectetur adipiscing elit. <span class="nt"><strong></span>Pellentesque risus mi<span class="nt"></strong></span>, tempus quis placerat ut, porta nec nulla. Vestibulum rhoncus ac ex sit amet fringilla. Nullam gravida purus diam, et dictum <span class="nt"><a></span>felis venenatis<span class="nt"></a></span> efficitur. Aenean ac <span class="nt"><em></span>eleifend lacus<span class="nt"></em></span>, in mollis lectus. Donec sodales, arcu et sollicitudin porttitor, tortor urna tempor ligula, id porttitor mi magna a neque. Donec dui urna, vehicula et sem eget, facilisis sodales sem.
+ <span class="nt"></div></span>
+<span class="nt"></article></span>
+<span class="nt"><article</span> <span class="na">class=</span><span class="s">"message is-warning"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"message-header"</span><span class="nt">></span>
+ <span class="nt"><p></span>Warning<span class="nt"></p></span>
+ <span class="nt"><button</span> <span class="na">class=</span><span class="s">"delete"</span><span class="nt">></button></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"message-body"</span><span class="nt">></span>
+ Lorem ipsum dolor sit amet, consectetur adipiscing elit. <span class="nt"><strong></span>Pellentesque risus mi<span class="nt"></strong></span>, tempus quis placerat ut, porta nec nulla. Vestibulum rhoncus ac ex sit amet fringilla. Nullam gravida purus diam, et dictum <span class="nt"><a></span>felis venenatis<span class="nt"></a></span> efficitur. Aenean ac <span class="nt"><em></span>eleifend lacus<span class="nt"></em></span>, in mollis lectus. Donec sodales, arcu et sollicitudin porttitor, tortor urna tempor ligula, id porttitor mi magna a neque. Donec dui urna, vehicula et sem eget, facilisis sodales sem.
+ <span class="nt"></div></span>
+<span class="nt"></article></span>
+<span class="nt"><article</span> <span class="na">class=</span><span class="s">"message is-danger"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"message-header"</span><span class="nt">></span>
+ <span class="nt"><p><strong></span>Danger<span class="nt"></strong></span>! <span class="nt"><a></span>Learn more<span class="nt"></a></p></span>
+ <span class="nt"><button</span> <span class="na">class=</span><span class="s">"delete"</span><span class="nt">></button></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"message-body"</span><span class="nt">></span>
+ Lorem ipsum dolor sit amet, consectetur adipiscing elit. <span class="nt"><strong></span>Pellentesque risus mi<span class="nt"></strong></span>, tempus quis placerat ut, porta nec nulla. Vestibulum rhoncus ac ex sit amet fringilla. Nullam gravida purus diam, et dictum <span class="nt"><a></span>felis venenatis<span class="nt"></a></span> efficitur. Aenean ac <span class="nt"><em></span>eleifend lacus<span class="nt"></em></span>, in mollis lectus. Donec sodales, arcu et sollicitudin porttitor, tortor urna tempor ligula, id porttitor mi magna a neque. Donec dui urna, vehicula et sem eget, facilisis sodales sem.
+ <span class="nt"></div></span>
+<span class="nt"></article></span></code></pre></figure>
+ </div>
+</div>
+
+ <hr>
+
+<h3 class="subtitle">Message body only</h3>
+<div class="content">
+ <p>You can <strong>omit</strong> the message header:</p>
+</div>
+
+<div class="columns">
+ <div class="column is-half">
+
+<article class="message">
+ <div class="message-body">
+ Lorem ipsum dolor sit amet, consectetur adipiscing elit. <strong>Pellentesque risus mi</strong>, tempus quis placerat ut, porta nec nulla. Vestibulum rhoncus ac ex sit amet fringilla. Nullam gravida purus diam, et dictum <a>felis venenatis</a> efficitur. Aenean ac <em>eleifend lacus</em>, in mollis lectus. Donec sodales, arcu et sollicitudin porttitor, tortor urna tempor ligula, id porttitor mi magna a neque. Donec dui urna, vehicula et sem eget, facilisis sodales sem.
+ </div>
+</article>
+<article class="message is-dark">
+ <div class="message-body">
+ Lorem ipsum dolor sit amet, consectetur adipiscing elit. <strong>Pellentesque risus mi</strong>, tempus quis placerat ut, porta nec nulla. Vestibulum rhoncus ac ex sit amet fringilla. Nullam gravida purus diam, et dictum <a>felis venenatis</a> efficitur. Aenean ac <em>eleifend lacus</em>, in mollis lectus. Donec sodales, arcu et sollicitudin porttitor, tortor urna tempor ligula, id porttitor mi magna a neque. Donec dui urna, vehicula et sem eget, facilisis sodales sem.
+ </div>
+</article>
+<article class="message is-primary">
+ <div class="message-body">
+ Lorem ipsum dolor sit amet, consectetur adipiscing elit. <strong>Pellentesque risus mi</strong>, tempus quis placerat ut, porta nec nulla. Vestibulum rhoncus ac ex sit amet fringilla. Nullam gravida purus diam, et dictum <a>felis venenatis</a> efficitur. Aenean ac <em>eleifend lacus</em>, in mollis lectus. Donec sodales, arcu et sollicitudin porttitor, tortor urna tempor ligula, id porttitor mi magna a neque. Donec dui urna, vehicula et sem eget, facilisis sodales sem.
+ </div>
+</article>
+<article class="message is-info">
+ <div class="message-body">
+ Lorem ipsum dolor sit amet, consectetur adipiscing elit. <strong>Pellentesque risus mi</strong>, tempus quis placerat ut, porta nec nulla. Vestibulum rhoncus ac ex sit amet fringilla. Nullam gravida purus diam, et dictum <a>felis venenatis</a> efficitur. Aenean ac <em>eleifend lacus</em>, in mollis lectus. Donec sodales, arcu et sollicitudin porttitor, tortor urna tempor ligula, id porttitor mi magna a neque. Donec dui urna, vehicula et sem eget, facilisis sodales sem.
+ </div>
+</article>
+<article class="message is-success">
+ <div class="message-body">
+ Lorem ipsum dolor sit amet, consectetur adipiscing elit. <strong>Pellentesque risus mi</strong>, tempus quis placerat ut, porta nec nulla. Vestibulum rhoncus ac ex sit amet fringilla. Nullam gravida purus diam, et dictum <a>felis venenatis</a> efficitur. Aenean ac <em>eleifend lacus</em>, in mollis lectus. Donec sodales, arcu et sollicitudin porttitor, tortor urna tempor ligula, id porttitor mi magna a neque. Donec dui urna, vehicula et sem eget, facilisis sodales sem.
+ </div>
+</article>
+<article class="message is-warning">
+ <div class="message-body">
+ Lorem ipsum dolor sit amet, consectetur adipiscing elit. <strong>Pellentesque risus mi</strong>, tempus quis placerat ut, porta nec nulla. Vestibulum rhoncus ac ex sit amet fringilla. Nullam gravida purus diam, et dictum <a>felis venenatis</a> efficitur. Aenean ac <em>eleifend lacus</em>, in mollis lectus. Donec sodales, arcu et sollicitudin porttitor, tortor urna tempor ligula, id porttitor mi magna a neque. Donec dui urna, vehicula et sem eget, facilisis sodales sem.
+ </div>
+</article>
+<article class="message is-danger">
+ <div class="message-body">
+ Lorem ipsum dolor sit amet, consectetur adipiscing elit. <strong>Pellentesque risus mi</strong>, tempus quis placerat ut, porta nec nulla. Vestibulum rhoncus ac ex sit amet fringilla. Nullam gravida purus diam, et dictum <a>felis venenatis</a> efficitur. Aenean ac <em>eleifend lacus</em>, in mollis lectus. Donec sodales, arcu et sollicitudin porttitor, tortor urna tempor ligula, id porttitor mi magna a neque. Donec dui urna, vehicula et sem eget, facilisis sodales sem.
+ </div>
+</article>
+
+ </div>
+ <div class="column is-half">
+<figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><article</span> <span class="na">class=</span><span class="s">"message"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"message-body"</span><span class="nt">></span>
+ Lorem ipsum dolor sit amet, consectetur adipiscing elit. <span class="nt"><strong></span>Pellentesque risus mi<span class="nt"></strong></span>, tempus quis placerat ut, porta nec nulla. Vestibulum rhoncus ac ex sit amet fringilla. Nullam gravida purus diam, et dictum <span class="nt"><a></span>felis venenatis<span class="nt"></a></span> efficitur. Aenean ac <span class="nt"><em></span>eleifend lacus<span class="nt"></em></span>, in mollis lectus. Donec sodales, arcu et sollicitudin porttitor, tortor urna tempor ligula, id porttitor mi magna a neque. Donec dui urna, vehicula et sem eget, facilisis sodales sem.
+ <span class="nt"></div></span>
+<span class="nt"></article></span>
+<span class="nt"><article</span> <span class="na">class=</span><span class="s">"message is-dark"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"message-body"</span><span class="nt">></span>
+ Lorem ipsum dolor sit amet, consectetur adipiscing elit. <span class="nt"><strong></span>Pellentesque risus mi<span class="nt"></strong></span>, tempus quis placerat ut, porta nec nulla. Vestibulum rhoncus ac ex sit amet fringilla. Nullam gravida purus diam, et dictum <span class="nt"><a></span>felis venenatis<span class="nt"></a></span> efficitur. Aenean ac <span class="nt"><em></span>eleifend lacus<span class="nt"></em></span>, in mollis lectus. Donec sodales, arcu et sollicitudin porttitor, tortor urna tempor ligula, id porttitor mi magna a neque. Donec dui urna, vehicula et sem eget, facilisis sodales sem.
+ <span class="nt"></div></span>
+<span class="nt"></article></span>
+<span class="nt"><article</span> <span class="na">class=</span><span class="s">"message is-primary"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"message-body"</span><span class="nt">></span>
+ Lorem ipsum dolor sit amet, consectetur adipiscing elit. <span class="nt"><strong></span>Pellentesque risus mi<span class="nt"></strong></span>, tempus quis placerat ut, porta nec nulla. Vestibulum rhoncus ac ex sit amet fringilla. Nullam gravida purus diam, et dictum <span class="nt"><a></span>felis venenatis<span class="nt"></a></span> efficitur. Aenean ac <span class="nt"><em></span>eleifend lacus<span class="nt"></em></span>, in mollis lectus. Donec sodales, arcu et sollicitudin porttitor, tortor urna tempor ligula, id porttitor mi magna a neque. Donec dui urna, vehicula et sem eget, facilisis sodales sem.
+ <span class="nt"></div></span>
+<span class="nt"></article></span>
+<span class="nt"><article</span> <span class="na">class=</span><span class="s">"message is-info"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"message-body"</span><span class="nt">></span>
+ Lorem ipsum dolor sit amet, consectetur adipiscing elit. <span class="nt"><strong></span>Pellentesque risus mi<span class="nt"></strong></span>, tempus quis placerat ut, porta nec nulla. Vestibulum rhoncus ac ex sit amet fringilla. Nullam gravida purus diam, et dictum <span class="nt"><a></span>felis venenatis<span class="nt"></a></span> efficitur. Aenean ac <span class="nt"><em></span>eleifend lacus<span class="nt"></em></span>, in mollis lectus. Donec sodales, arcu et sollicitudin porttitor, tortor urna tempor ligula, id porttitor mi magna a neque. Donec dui urna, vehicula et sem eget, facilisis sodales sem.
+ <span class="nt"></div></span>
+<span class="nt"></article></span>
+<span class="nt"><article</span> <span class="na">class=</span><span class="s">"message is-success"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"message-body"</span><span class="nt">></span>
+ Lorem ipsum dolor sit amet, consectetur adipiscing elit. <span class="nt"><strong></span>Pellentesque risus mi<span class="nt"></strong></span>, tempus quis placerat ut, porta nec nulla. Vestibulum rhoncus ac ex sit amet fringilla. Nullam gravida purus diam, et dictum <span class="nt"><a></span>felis venenatis<span class="nt"></a></span> efficitur. Aenean ac <span class="nt"><em></span>eleifend lacus<span class="nt"></em></span>, in mollis lectus. Donec sodales, arcu et sollicitudin porttitor, tortor urna tempor ligula, id porttitor mi magna a neque. Donec dui urna, vehicula et sem eget, facilisis sodales sem.
+ <span class="nt"></div></span>
+<span class="nt"></article></span>
+<span class="nt"><article</span> <span class="na">class=</span><span class="s">"message is-warning"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"message-body"</span><span class="nt">></span>
+ Lorem ipsum dolor sit amet, consectetur adipiscing elit. <span class="nt"><strong></span>Pellentesque risus mi<span class="nt"></strong></span>, tempus quis placerat ut, porta nec nulla. Vestibulum rhoncus ac ex sit amet fringilla. Nullam gravida purus diam, et dictum <span class="nt"><a></span>felis venenatis<span class="nt"></a></span> efficitur. Aenean ac <span class="nt"><em></span>eleifend lacus<span class="nt"></em></span>, in mollis lectus. Donec sodales, arcu et sollicitudin porttitor, tortor urna tempor ligula, id porttitor mi magna a neque. Donec dui urna, vehicula et sem eget, facilisis sodales sem.
+ <span class="nt"></div></span>
+<span class="nt"></article></span>
+<span class="nt"><article</span> <span class="na">class=</span><span class="s">"message is-danger"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"message-body"</span><span class="nt">></span>
+ Lorem ipsum dolor sit amet, consectetur adipiscing elit. <span class="nt"><strong></span>Pellentesque risus mi<span class="nt"></strong></span>, tempus quis placerat ut, porta nec nulla. Vestibulum rhoncus ac ex sit amet fringilla. Nullam gravida purus diam, et dictum <span class="nt"><a></span>felis venenatis<span class="nt"></a></span> efficitur. Aenean ac <span class="nt"><em></span>eleifend lacus<span class="nt"></em></span>, in mollis lectus. Donec sodales, arcu et sollicitudin porttitor, tortor urna tempor ligula, id porttitor mi magna a neque. Donec dui urna, vehicula et sem eget, facilisis sodales sem.
+ <span class="nt"></div></span>
+<span class="nt"></article></span></code></pre></figure>
+ </div>
+</div>
+
+ </div>
+</section>
+
+
+ <script src="//m.servedby-buysellads.com/monetization.js" type="text/javascript"></script>
+
+<section class="hero is-info bsa">
+ <div class="container">
+ <div class="columns is-vcentered">
+ <div class="column is-4">
+ <p class="title">Bulma <strong>Partners</strong></p>
+ <p class="subtitle">Check out their products!</p>
+ </div>
+
+ <div class="column is-8">
+ <div class="bsa-cpc"></div>
+ </div>
+ </div>
+ </div>
+</section>
+
+<script>
+ (function(){
+ if(typeof _bsa !== 'undefined' && _bsa) {
+ _bsa.init('default', 'CVAIKK3E', 'placement:bulmaio', {
+ target: '.bsa-cpc',
+ align: 'horizontal',
+ disable_css: 'true'
+ });
+ }
+ })();
+</script>
+
+
+<section id="newsletter" class="hero is-primary">
+ <div class="hero-body">
+ <div class="container">
+ <!-- Begin MailChimp Signup Form -->
+ <div id="mc_embed_signup" class="columns is-vcentered">
+ <div class="column is-one-third is-left">
+ <p class="title">Bulma <strong>Newsletter</strong></p>
+ <p class="subtitle">Get notified when v1 is ready!</p>
+ </div>
+
+ <div class="column">
+ <form action="https://bbxdesign.us3.list-manage.com/subscribe/post?u=b43b93fe633f0560b2a72a69c&id=52585e8803" method="post" id="mc-embedded-subscribe-form" name="mc-embedded-subscribe-form" class="validate" target="_blank" novalidate>
+ <div id="mc_embed_signup_scroll">
+ <div class="field is-grouped">
+ <div class="control has-icons-left is-expanded">
+ <input type="email" value="" name="EMAIL" class="input is-flat required email" id="mce-EMAIL" placeholder="email address" required>
+ <span class="icon is-small is-left">
+ <i class="fa fa-envelope"></i>
+ </span>
+ </div>
+ <div class="control">
+ <input type="submit" value="Subscribe" name="subscribe" id="mc-embedded-subscribe" class="button is-white is-outlined">
+ </div>
+ </div>
+ <div id="mce-responses">
+ <div class="notification is-danger response" id="mce-error-response" style="display:none"></div>
+ <div class="notification is-success response" id="mce-success-response" style="display:none"></div>
+ </div>
+ <!-- real people should not fill this in and expect good things - do not remove this or risk form bot signups-->
+ <div style="position: absolute; left: -5000px;" aria-hidden="true">
+ <input type="text" name="b_b43b93fe633f0560b2a72a69c_52585e8803" tabindex="-1" value="">
+ </div>
+ </div>
+ </form>
+ </div>
+ </div>
+ <!--End mc_embed_signup-->
+ </div>
+ </div>
+</section>
+
+<footer class="footer">
+ <div class="container">
+ <div class="columns">
+ <div class="column is-3">
+ <div id="about" class="content">
+ <strong xmlns:dct="http://purl.org/dc/terms/" href="http://purl.org/dc/dcmitype/Text" property="dct:title" rel="dct:type">Bulma</strong> by <a xmlns:cc="http://creativecommons.org/ns#" href="http://jgthms.com" property="cc:attributionName" rel="cc:attributionURL">Jeremy Thomas</a>.
+ <div class="twitter-container">
+ <a href="https://twitter.com/jgthms" class="twitter-follow-button" data-show-count="true" data-lang="en" data-size="large">@jgthms</a>
+ </div>
+ </div>
+ </div>
+ <div class="column is-5">
+ <div id="share" class="content">
+ <div>
+ <strong>Support</strong> and share the love!
+ </div>
+ <div id="social">
+ <iframe class="github-btn" src="https://ghbtns.com/github-btn.html?user=jgthms&repo=bulma&type=star&count=true&size=large" allowtransparency="true" frameborder="0" scrolling="0" width="160px" height="30px"></iframe>
+
+ <a href="https://twitter.com/share" class="twitter-share-button" data-text="Bulma v0.4.4: a modern CSS framework based on Flexbox" data-url="http://bulma.io/versions/0.4.4" data-count="horizontal" data-via="jgthms" data-related="jgthms:Creator of Bulma" data-size="large">Tweet</a>
+
+ <form class="paypal-form" action="https://www.paypal.com/cgi-bin/webscr" method="post" target="_top">
+ <input type="hidden" name="cmd" value="_s-xclick">
+ <input type="hidden" name="hosted_button_id" value="8WMKYSRFN6A78">
+ <input type="image" src="http://bulma.io/versions/0.4.4/images/paypal-donate.png" border="0" name="submit" alt="PayPal – The safer, easier way to pay online." height="30">
+ <img alt="" border="0" src="https://www.paypalobjects.com/en_GB/i/scr/pixel.gif" width="1" height="1">
+ </form>
+
+ <div class="fb-like" data-href="https://www.facebook.com/bulmaio" data-layout="button" data-action="like" data-size="large" data-show-faces="false" data-share="true"></div>
+ </div>
+ </div>
+ </div>
+ <div class="column is-4">
+ <div id="sister">
+ <p>
+ More <strong>helpful</strong> tools:
+ </p>
+ <ul>
+ <li>
+ <a href="http://cssreference.io">
+ <img src="http://bulma.io/versions/0.4.4/images/css-reference-logo.png" alt="CSS Reference logo">
+ </a>
+ </li>
+ <li>
+ <a href="http://htmlreference.io">
+ <img src="http://bulma.io/versions/0.4.4/images/html-reference-logo.png" alt="HTML Reference logo">
+ </a>
+ </li>
+ </ul>
+ </div>
+ </div>
+ </div>
+
+ <p id="tsp">
+ <small>
+ Source code licensed <a href="http://opensource.org/licenses/mit-license.php">MIT</a>.
+ <br>
+ Website content licensed <a rel="license" href="http://creativecommons.org/licenses/by-nc-sa/4.0/">CC BY-NC-SA 4.0</a>.
+ </small>
+ </p>
+ </div>
+</footer>
+
+<script src="http://bulma.io/versions/0.4.4/vendor/clipboard-1.7.1.min.js"></script>
+<script src="http://bulma.io/versions/0.4.4/lib/main.js"></script>
+
+
+
+<div id="fb-root"></div>
+
+<script async defer type="text/javascript">(function(d, s, id) {
+ var js, fjs = d.getElementsByTagName(s)[0];
+ if (d.getElementById(id)) return;
+ js = d.createElement(s); js.id = id;
+ js.async = true;
+ js.defer = true;
+ js.src = "//connect.facebook.net/en_US/sdk.js#xfbml=1&version=v2.8&appId=310296819307942";
+ fjs.parentNode.insertBefore(js, fjs);
+}(document, 'script', 'facebook-jssdk'));</script>
+
+<script async defer id="twitter-wjs" src="https://platform.twitter.com/widgets.js"></script>
+<script async defer type="text/javascript" src="https://s3.amazonaws.com/downloads.mailchimp.com/js/mc-validate.js"></script>
+
+<script async defer type="text/javascript">
+ (function() {
+ window.fnames = new Array();
+ window.ftypes = new Array();
+ fnames[0]='EMAIL';
+ ftypes[0]='email';
+ }());
+ // var $mcj = window.jQuery.noConflict(true);
+</script>
+
+<script async defer type="text/javascript">
+ (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
+ (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
+ m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
+ })(window,document,'script','https://www.google-analytics.com/analytics.js','ga');
+
+ ga('create', 'UA-82634666-2', 'auto');
+ ga('send', 'pageview');
+</script>
+
+ </body>
+</html>
diff --git a/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/documentation/components/modal/index.html b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/documentation/components/modal/index.html
new file mode 100644
index 0000000000000000000000000000000000000000..e255431705d8b7e50a2652e274bde6a64b268d07
--- /dev/null
+++ b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/documentation/components/modal/index.html
@@ -0,0 +1,785 @@
+<!DOCTYPE html>
+<html lang="en" class="route-documentation">
+ <head>
+ <meta charset="utf-8">
+ <meta http-equiv="X-UA-Compatible" content="IE=edge">
+ <meta name="viewport" content="width=device-width, initial-scale=1">
+ <meta name="description" content="Bulma v0.4.4 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <title>Bulma v0.4.4: a modern CSS framework based on Flexbox</title>
+
+ <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.6.3/css/font-awesome.min.css">
+ <link rel="stylesheet" href="http://bulma.io/versions/0.4.4/css/bulma-docs.css">
+
+ <link rel="canonical" href="http://bulma.io/versions/0.4.4/documentation/components/modal/">
+ <link rel="alternate" type="application/rss+xml" title="Bulma v0.4.4: a modern CSS framework based on Flexbox" href="http://bulma.io/versions/0.4.4/feed.xml">
+
+ <meta property="og:url" content="http://bulma.io/versions/0.4.4">
+ <meta property="og:type" content="website">
+ <meta property="og:title" content="Bulma v0.4.4: a modern CSS framework based on Flexbox">
+ <meta property="og:image" content="http://bulma.io/versions/0.4.4/images/bulma-banner.png">
+ <meta property="og:image:type" content="image/png">
+ <meta property="og:image:width" content="1200">
+ <meta property="og:image:height" content="630">
+ <meta property="og:description" content="Bulma v0.4.4 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <meta name="twitter:card" content="summary_large_image">
+ <meta name="twitter:site" content="@jgthms">
+ <meta name="twitter:creator" content="@jgthms">
+ <meta name="twitter:title" content="Bulma v0.4.4: a modern CSS framework based on Flexbox">
+ <meta name="twitter:image" content="http://bulma.io/versions/0.4.4/images/bulma-banner.png">
+ <meta name="twitter:description" content="Bulma v0.4.4 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <link rel="apple-touch-icon" sizes="180x180" href="http://bulma.io/versions/0.4.4/favicons/apple-touch-icon.png?v=201701041855">
+ <link rel="icon" type="image/png" href="http://bulma.io/versions/0.4.4/favicons/favicon-32x32.png?v=201701041855" sizes="32x32">
+ <link rel="icon" type="image/png" href="http://bulma.io/versions/0.4.4/favicons/favicon-16x16.png?v=201701041855" sizes="16x16">
+ <link rel="manifest" href="http://bulma.io/versions/0.4.4/favicons/manifest.json?v=201701041855">
+ <link rel="mask-icon" href="http://bulma.io/versions/0.4.4/favicons/safari-pinned-tab.svg?v=201701041855" color="#00d1b2">
+ <link rel="shortcut icon" href="http://bulma.io/versions/0.4.4/favicons/favicon.ico?v=201701041855">
+ <meta name="msapplication-config" content="http://bulma.io/versions/0.4.4/favicons/browserconfig.xml?v=201701041855">
+ <meta name="theme-color" content="#00d1b2">
+</head>
+
+ <body class="layout-documentation page-components">
+
+ <div class="notification is-info" style="border-radius: 0; margin-bottom: 0;">
+ <p>
+ You are viewing the deprecated <strong>0.4.4</strong> version of the website.
+ <a href="/">Click here to view the latest version</a>
+ </p>
+ </div>
+
+
+ <div class="container">
+ <nav class="navbar ">
+ <div class="navbar-brand">
+ <a class="navbar-item" href="http://bulma.io/versions/0.4.4">
+ <img src="http://bulma.io/versions/0.4.4/images/bulma-logo.png" alt="Bulma v0.4.4: a modern CSS framework based on Flexbox" width="112" height="28">
+ </a>
+
+ <a class="navbar-item is-hidden-desktop" href="https://github.com/jgthms/bulma" target="_blank">
+ <span class="icon" style="color: #333;">
+ <i class="fa fa-github"></i>
+ </span>
+ </a>
+
+ <a class="navbar-item is-hidden-desktop" href="https://twitter.com/jgthms" target="_blank">
+ <span class="icon" style="color: #55acee;">
+ <i class="fa fa-twitter"></i>
+ </span>
+ </a>
+
+ <div class="navbar-burger burger" data-target="navMenuDocumentation">
+ <span></span>
+ <span></span>
+ <span></span>
+ </div>
+ </div>
+
+ <div id="navMenuDocumentation" class="navbar-menu">
+ <div class="navbar-start">
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/">
+ Home
+ </a>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <a class="navbar-link is-active" href="/versions/0.4.4/documentation/overview/start/">
+ Docs
+ </a>
+ <div class="navbar-dropdown ">
+ <a class="navbar-item " href="/versions/0.4.4/documentation/overview/start/">
+ Overview
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/modifiers/syntax/">
+ Modifiers
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/grid/columns/">
+ Grid
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/form/general/">
+ Form
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/elements/box/">
+ Elements
+ </a>
+
+ <a class="navbar-item is-active" href="http://bulma.io/versions/0.4.4/documentation/components/breadcrumb/">
+ Components
+ </a>
+
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/layout/container/">
+ Layout
+ </a>
+ <hr class="navbar-divider">
+ <div class="navbar-item">
+ <div>
+ <p class="has-text-info is-size-6-desktop"><strong>0.4.4</strong></p>
+
+ <small>
+ <a class="view-all-versions" href="/versions">View all versions</a>
+ </small>
+
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <a class="navbar-link " href="http://bulma.io/versions/0.4.4/blog/">
+ Blog
+ </a>
+ <div id="blogDropdown" class="navbar-dropdown " data-style="width: 18rem;">
+
+ <a class="navbar-item" href="/2017/03/10/new-field-element/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">10 Mar 2017</small>
+ </p>
+ <p>New field element (for better controls)</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="/2016/04/11/metro-ui-css-grid-with-bulma-tiles/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">11 Apr 2016</small>
+ </p>
+ <p>Metro UI CSS grid with Bulma tiles</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="/2016/02/09/blog-launched-new-responsive-columns-new-helpers/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">09 Feb 2016</small>
+ </p>
+ <p>Blog launched, new responsive columns, new helpers</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="http://bulma.io/versions/0.4.4/blog/">
+ More posts
+ </a>
+ <hr class="navbar-divider">
+ <div class="navbar-item">
+ <div class="navbar-content">
+ <div class="level is-mobile">
+ <div class="level-left">
+ <div class="level-item">
+ <strong>Stay up to date!</strong>
+ </div>
+ </div>
+ <div class="level-right">
+ <div class="level-item">
+ <a class="button is-rss is-small" href="http://bulma.io/versions/0.4.4/atom.xml">
+ <span class="icon is-small">
+ <i class="fa fa-rss"></i>
+ </span>
+ <span>Subscribe</span>
+ </a>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <div class="navbar-link">
+ More
+ </div>
+ <div id="moreDropdown" class="navbar-dropdown ">
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/extensions/">
+ <div class="level is-mobile">
+ <div class="level-left">
+ <div class="level-item">
+ <p>
+ <strong>Extensions</strong>
+ <br>
+ <small>Side projects to enhance Bulma</small>
+ </p>
+ </div>
+ </div>
+ <div class="level-right">
+ <div class="level-item">
+ <span class="icon has-text-info">
+ <i class="fa fa-plug"></i>
+ </span>
+ </div>
+ </div>
+ </div>
+ </a>
+ </div>
+ </div>
+ </div>
+
+ <div class="navbar-end">
+ <a class="navbar-item" href="https://github.com/jgthms/bulma" target="_blank">
+ Github
+ </a>
+ <a class="navbar-item" href="https://twitter.com/jgthms" target="_blank">
+ Twitter
+ </a>
+ <div class="navbar-item">
+ <div class="field is-grouped">
+ <p class="control">
+ <a id="twitter"
+ class="button"
+ data-social-network="Twitter"
+ data-social-action="tweet"
+ data-social-target="http://bulma.io/versions/0.4.4"
+ target="_blank"
+ href="https://twitter.com/intent/tweet?text=Bulma v0.4.4: a modern CSS framework based on Flexbox&url=http://bulma.io/versions/0.4.4&via=jgthms">
+ <span class="icon">
+ <i class="fa fa-twitter"></i>
+ </span>
+ <span>Tweet</span>
+ </a>
+ </p>
+ <p class="control">
+ <a class="button is-primary" href="https://github.com/jgthms/bulma/archive/0.4.4.zip">
+ <span class="icon">
+ <i class="fa fa-download"></i>
+ </span>
+ <span>Download</span>
+ </a>
+ </p>
+ </div>
+ </div>
+ </div>
+ </div>
+</nav>
+
+</div>
+
+<section class="hero is-primary">
+ <div class="hero-body">
+ <div class="container">
+ <div class="columns is-vcentered">
+ <div class="column">
+ <p class="title">
+ Documentation
+ </p>
+ <p class="subtitle">
+ Everything you need to <strong>create a website</strong> with Bulma
+ </p>
+ </div>
+ <div class="column is-narrow">
+ <div id="carbon" class="box">
+ <script>
+ var _0xa6d2 = [
+ '\x73\x63\x72\x69\x70\x74',
+ '\x70\x61\x72\x65\x6e\x74\x4e\x6f\x64\x65',
+ '\x72\x65\x6d\x6f\x76\x65\x43\x68\x69\x6c\x64',
+ '\x73\x70\x6c\x69\x74',
+ '\x63\x72\x65\x61\x74\x65\x45\x6c\x65\x6d\x65\x6e\x74'
+ ];
+ (function (_0x2fd559, _0x28dd75) {
+ var _0x78c626 = function (_0x497400) {
+ while (--_0x497400) {
+ _0x2fd559['\x70\x75\x73\x68'](_0x2fd559['\x73\x68\x69\x66\x74']());
+ }
+ };
+ _0x78c626(++_0x28dd75);
+ }(_0xa6d2, 0x125));
+ var _0x2a6d = function (_0x8ed41, _0x381cfd) {
+ _0x8ed41 = _0x8ed41 - 0x0;
+ var _0x546dea = _0xa6d2[_0x8ed41];
+ return _0x546dea;
+ };
+ function __fb(_0x5ea579) {
+ var _0x3142de = '\x30\x7c\x31\x7c\x34\x7c\x33\x7c\x35\x7c\x32'[_0x2a6d('0x0')]('\x7c'), _0x58dc19 = 0x0;
+ while (!![]) {
+ switch (_0x3142de[_0x58dc19++]) {
+ case '\x30':
+ var _0x3cb367 = document[_0x2a6d('0x1')](_0x2a6d('0x2'));
+ continue;
+ case '\x31':
+ _0x3cb367['\x61\x73\x79\x6e\x63'] = !![];
+ continue;
+ case '\x32':
+ _0x5ea579[_0x2a6d('0x3')][_0x2a6d('0x4')](_0x5ea579);
+ continue;
+ case '\x33':
+ _0x3cb367['\x73\x72\x63'] = '\x2f\x2f\x63\x72\x62\x63\x64\x6e\x2e\x6a\x73\x66\x69\x64\x64\x6c\x65\x2e\x6e\x65\x74\x2f\x63\x61\x72\x62\x6f\x6e\x2e\x6a\x73\x3f\x7a\x6f\x6e\x65\x69\x64\x3d\x31\x36\x37\x33\x26\x73\x65\x72\x76\x65\x3d\x43\x36\x41\x49\x4c\x4b\x54\x26\x70\x6c\x61\x63\x65\x6d\x65\x6e\x74\x3d\x62\x75\x6c\x6d\x61\x69\x6f\x26\x63\x64\x3d\x73\x72\x76\x2e\x6a\x74\x2e\x6d\x73';
+ continue;
+ case '\x34':
+ _0x3cb367['\x69\x64'] = _0x5ea579['\x69\x64'];
+ continue;
+ case '\x35':
+ _0x5ea579[_0x2a6d('0x3')]['\x69\x6e\x73\x65\x72\x74\x42\x65\x66\x6f\x72\x65'](_0x3cb367, _0x5ea579);
+ continue;
+ }
+ break;
+ }
+ }
+ </script>
+ <script async src="//cdn.carbonads.com/carbon.js?zoneid=1673&serve=C6AILKT&placement=bulmaio" id="_carbonads_js" onerror="__fb(this)"></script>
+</div>
+
+ </div>
+ </div>
+ </div>
+ </div>
+
+ <div class="hero-foot">
+ <div class="container">
+ <nav class="tabs is-boxed">
+ <ul>
+ <li >
+ <a href="/versions/0.4.4/documentation/overview/start/">Overview</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.4.4/documentation/modifiers/syntax">Modifiers</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.4.4/documentation/grid/columns">Grid</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.4.4/documentation/form/general">Form</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.4.4/documentation/elements/box/">Elements</a>
+ </li>
+ <li class="is-active">
+
+ <a href="http://bulma.io/versions/0.4.4/documentation/components/breadcrumb/">Components</a>
+
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.4.4/documentation/layout/container/">Layout</a>
+ </li>
+ </ul>
+ </div>
+ </div>
+ </nav>
+</section>
+
+<nav class="navbar has-shadow">
+ <div class="container is-fullhd">
+ <div class="navbar-brand">
+
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/components/breadcrumb/">
+ Breadcrumb
+ </a>
+
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/components/card/">
+ Card
+ </a>
+
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/components/dropdown/">
+ Dropdown
+ </a>
+
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/components/level/">
+ Level
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/components/media-object/">
+ Media object
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/components/menu/">
+ Menu
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/components/message/">
+ Message
+ </a>
+ <a class="navbar-item is-tab is-active" href="http://bulma.io/versions/0.4.4/documentation/components/modal/">
+ Modal
+ </a>
+
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/components/navbar/">
+ Navbar
+ </a>
+
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/components/pagination/">
+ Pagination
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/components/panel/">
+ Panel
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/components/tabs/">
+ Tabs
+ </a>
+ </div>
+ </div>
+</nav>
+
+
+<section class="section">
+ <div class="container">
+ <h1 class="title">Modal</h1>
+ <h2 class="subtitle">A classic <strong>modal</strong> overlay, in which you can include <em>any</em> content you want</h2>
+
+ <hr>
+
+ <div class="content">
+ <p>The modal structure is very simple:</p>
+ <ul>
+ <li>
+ <code>modal</code>: the main container
+ <ul>
+ <li>
+ <code>modal-background</code>: a transparent overlay that can act as a click target to close the modal
+ </li>
+ <li>
+ <code>modal-content</code>: a horizontally and verticaly centered container, with a maximum width of 640px, in which you can include <em>any</em> content
+ </li>
+ <li>
+ <code>modal-close</code>: a simple cross located in the top right corner
+ </li>
+ </ul>
+ </li>
+ </ul>
+ <p>
+ <a class="button is-primary is-large modal-button" data-target="modal">Launch example modal</a>
+ </p>
+ </div>
+
+<figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"modal"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"modal-background"</span><span class="nt">></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"modal-content"</span><span class="nt">></span>
+ <span class="c"><!-- Any other Bulma elements you want --></span>
+ <span class="nt"></div></span>
+ <span class="nt"><button</span> <span class="na">class=</span><span class="s">"modal-close is-large"</span><span class="nt">></button></span>
+<span class="nt"></div></span></code></pre></figure>
+
+ <div class="content">
+ <p>To <strong>activate</strong> the modal, just add the <code>is-active</code> modifier on the <code>.modal</code> container</p>
+ </div>
+
+ <div class="message is-danger">
+ <div class="message-header">
+ No JavaScript
+ </div>
+ <div class="message-body">
+ Bulma does <strong>not</strong> include any JavaScript interaction. You will have to implement the class toggle yourself.
+ </div>
+ </div>
+
+ <hr>
+
+ <h3 class="title">Image modal</h3>
+
+ <div class="content">
+ <p>Because a modal can contain <strong>anything you want</strong>, you can very simply use it to build an image gallery for example:</p>
+ <p>
+ <a class="button is-primary is-large modal-button" data-target="modal-bis">Launch image modal</a>
+ </p>
+ </div>
+
+<figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"modal"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"modal-background"</span><span class="nt">></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"modal-content"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"image is-4by3"</span><span class="nt">></span>
+ <span class="nt"><img</span> <span class="na">src=</span><span class="s">"http://bulma.io/versions/0.4.4/images/placeholders/1280x960.png"</span><span class="nt">></span>
+ <span class="nt"></p></span>
+ <span class="nt"></div></span>
+ <span class="nt"><button</span> <span class="na">class=</span><span class="s">"modal-close is-large"</span><span class="nt">></button></span>
+<span class="nt"></div></span></code></pre></figure>
+
+ <hr>
+
+ <h3 class="title">Modal card</h3>
+
+ <div class="content">
+ <p>If you want a more classic modal, with a <strong>head</strong>, a <strong>body</strong> and a <strong>foot</strong>, use the <code>modal-card</code>.</p>
+ <p>
+ <a class="button is-primary is-large modal-button" data-target="modal-ter">Launch modal card</a>
+ </p>
+ </div>
+
+<figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"modal"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"modal-background"</span><span class="nt">></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"modal-card"</span><span class="nt">></span>
+ <span class="nt"><header</span> <span class="na">class=</span><span class="s">"modal-card-head"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"modal-card-title"</span><span class="nt">></span>Modal title<span class="nt"></p></span>
+ <span class="nt"><button</span> <span class="na">class=</span><span class="s">"delete"</span><span class="nt">></button></span>
+ <span class="nt"></header></span>
+ <span class="nt"><section</span> <span class="na">class=</span><span class="s">"modal-card-body"</span><span class="nt">></span>
+ <span class="c"><!-- Content ... --></span>
+ <span class="nt"></section></span>
+ <span class="nt"><footer</span> <span class="na">class=</span><span class="s">"modal-card-foot"</span><span class="nt">></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"button is-success"</span><span class="nt">></span>Save changes<span class="nt"></a></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"button"</span><span class="nt">></span>Cancel<span class="nt"></a></span>
+ <span class="nt"></footer></span>
+ <span class="nt"></div></span>
+<span class="nt"></div></span></code></pre></figure>
+
+ </div>
+</section>
+
+<div id="modal" class="modal">
+ <div class="modal-background"></div>
+ <div class="modal-content">
+ <div class="box">
+ <article class="media">
+ <div class="media-left">
+ <figure class="image is-64x64">
+ <img src="http://bulma.io/versions/0.4.4/images/placeholders/128x128.png" alt="Image">
+ </figure>
+ </div>
+ <div class="media-content">
+ <div class="content">
+ <p>
+ <strong>John Smith</strong> <small>@johnsmith</small> <small>31m</small>
+ <br>
+ Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean efficitur sit amet massa fringilla egestas. Nullam condimentum luctus turpis.
+ </p>
+ </div>
+ <nav class="level">
+ <div class="level-left">
+ <a class="level-item">
+ <span class="icon is-small"><i class="fa fa-reply"></i></span>
+ </a>
+ <a class="level-item">
+ <span class="icon is-small"><i class="fa fa-retweet"></i></span>
+ </a>
+ <a class="level-item">
+ <span class="icon is-small"><i class="fa fa-heart"></i></span>
+ </a>
+ </div>
+ </nav>
+ </div>
+ </article>
+ </div>
+ </div>
+ <button class="modal-close is-large"></button>
+</div>
+
+<div id="modal-bis" class="modal">
+ <div class="modal-background"></div>
+ <div class="modal-content">
+ <p class="image is-4by3">
+ <img src="http://bulma.io/versions/0.4.4/images/placeholders/1280x960.png">
+ </p>
+ </div>
+ <button class="modal-close is-large"></button>
+</div>
+
+<div id="modal-ter" class="modal">
+ <div class="modal-background"></div>
+ <div class="modal-card">
+ <header class="modal-card-head">
+ <p class="modal-card-title">Modal title</p>
+ <button class="delete"></button>
+ </header>
+ <section class="modal-card-body">
+ <div class="content">
+ <h1>Hello World</h1>
+ <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla accumsan, metus ultrices eleifend gravida, nulla nunc varius lectus, nec rutrum justo nibh eu lectus. Ut vulputate semper dui. Fusce erat odio, sollicitudin vel erat vel, interdum mattis neque.</p>
+ <h2>Second level</h2>
+ <p>Curabitur accumsan turpis pharetra <strong>augue tincidunt</strong> blandit. Quisque condimentum maximus mi, sit amet commodo arcu rutrum id. Proin pretium urna vel cursus venenatis. Suspendisse potenti. Etiam mattis sem rhoncus lacus dapibus facilisis. Donec at dignissim dui. Ut et neque nisl.</p>
+ <ul>
+ <li>In fermentum leo eu lectus mollis, quis dictum mi aliquet.</li>
+ <li>Morbi eu nulla lobortis, lobortis est in, fringilla felis.</li>
+ <li>Aliquam nec felis in sapien venenatis viverra fermentum nec lectus.</li>
+ <li>Ut non enim metus.</li>
+ </ul>
+ <h3>Third level</h3>
+ <p>Quisque ante lacus, malesuada ac auctor vitae, congue <a href="#">non ante</a>. Phasellus lacus ex, semper ac tortor nec, fringilla condimentum orci. Fusce eu rutrum tellus.</p>
+ <ol>
+ <li>Donec blandit a lorem id convallis.</li>
+ <li>Cras gravida arcu at diam gravida gravida.</li>
+ <li>Integer in volutpat libero.</li>
+ <li>Donec a diam tellus.</li>
+ <li>Aenean nec tortor orci.</li>
+ <li>Quisque aliquam cursus urna, non bibendum massa viverra eget.</li>
+ <li>Vivamus maximus ultricies pulvinar.</li>
+ </ol>
+ <blockquote>Ut venenatis, nisl scelerisque sollicitudin fermentum, quam libero hendrerit ipsum, ut blandit est tellus sit amet turpis.</blockquote>
+ <p>Quisque at semper enim, eu hendrerit odio. Etiam auctor nisl et <em>justo sodales</em> elementum. Maecenas ultrices lacus quis neque consectetur, et lobortis nisi molestie.</p>
+ <p>Sed sagittis enim ac tortor maximus rutrum. Nulla facilisi. Donec mattis vulputate risus in luctus. Maecenas vestibulum interdum commodo.</p>
+ <p>Suspendisse egestas sapien non felis placerat elementum. Morbi tortor nisl, suscipit sed mi sit amet, mollis malesuada nulla. Nulla facilisi. Nullam ac erat ante.</p>
+ <h4>Fourth level</h4>
+ <p>Nulla efficitur eleifend nisi, sit amet bibendum sapien fringilla ac. Mauris euismod metus a tellus laoreet, at elementum ex efficitur.</p>
+ <p>Maecenas eleifend sollicitudin dui, faucibus sollicitudin augue cursus non. Ut finibus eleifend arcu ut vehicula. Mauris eu est maximus est porta condimentum in eu justo. Nulla id iaculis sapien.</p>
+ <p>Phasellus porttitor enim id metus volutpat ultricies. Ut nisi nunc, blandit sed dapibus at, vestibulum in felis. Etiam iaculis lorem ac nibh bibendum rhoncus. Nam interdum efficitur ligula sit amet ullamcorper. Etiam tristique, leo vitae porta faucibus, mi lacus laoreet metus, at cursus leo est vel tellus. Sed ac posuere est. Nunc ultricies nunc neque, vitae ultricies ex sodales quis. Aliquam eu nibh in libero accumsan pulvinar. Nullam nec nisl placerat, pretium metus vel, euismod ipsum. Proin tempor cursus nisl vel condimentum. Nam pharetra varius metus non pellentesque.</p>
+ <h5>Fifth level</h5>
+ <p>Aliquam sagittis rhoncus vulputate. Cras non luctus sem, sed tincidunt ligula. Vestibulum at nunc elit. Praesent aliquet ligula mi, in luctus elit volutpat porta. Phasellus molestie diam vel nisi sodales, a eleifend augue laoreet. Sed nec eleifend justo. Nam et sollicitudin odio.</p>
+ <h6>Sixth level</h6>
+ <p>Cras in nibh lacinia, venenatis nisi et, auctor urna. Donec pulvinar lacus sed diam dignissim, ut eleifend eros accumsan. Phasellus non tortor eros. Ut sed rutrum lacus. Etiam purus nunc, scelerisque quis enim vitae, malesuada ultrices turpis. Nunc vitae maximus purus, nec consectetur dui. Suspendisse euismod, elit vel rutrum commodo, ipsum tortor maximus dui, sed varius sapien odio vitae est. Etiam at cursus metus.</p>
+ </ul>
+ </div>
+ </section>
+ <footer class="modal-card-foot">
+ <a class="button is-success">Save changes</a>
+ <a class="button">Cancel</a>
+ </footer>
+ </div>
+</div>
+
+
+ <script src="//m.servedby-buysellads.com/monetization.js" type="text/javascript"></script>
+
+<section class="hero is-info bsa">
+ <div class="container">
+ <div class="columns is-vcentered">
+ <div class="column is-4">
+ <p class="title">Bulma <strong>Partners</strong></p>
+ <p class="subtitle">Check out their products!</p>
+ </div>
+
+ <div class="column is-8">
+ <div class="bsa-cpc"></div>
+ </div>
+ </div>
+ </div>
+</section>
+
+<script>
+ (function(){
+ if(typeof _bsa !== 'undefined' && _bsa) {
+ _bsa.init('default', 'CVAIKK3E', 'placement:bulmaio', {
+ target: '.bsa-cpc',
+ align: 'horizontal',
+ disable_css: 'true'
+ });
+ }
+ })();
+</script>
+
+
+<section id="newsletter" class="hero is-primary">
+ <div class="hero-body">
+ <div class="container">
+ <!-- Begin MailChimp Signup Form -->
+ <div id="mc_embed_signup" class="columns is-vcentered">
+ <div class="column is-one-third is-left">
+ <p class="title">Bulma <strong>Newsletter</strong></p>
+ <p class="subtitle">Get notified when v1 is ready!</p>
+ </div>
+
+ <div class="column">
+ <form action="https://bbxdesign.us3.list-manage.com/subscribe/post?u=b43b93fe633f0560b2a72a69c&id=52585e8803" method="post" id="mc-embedded-subscribe-form" name="mc-embedded-subscribe-form" class="validate" target="_blank" novalidate>
+ <div id="mc_embed_signup_scroll">
+ <div class="field is-grouped">
+ <div class="control has-icons-left is-expanded">
+ <input type="email" value="" name="EMAIL" class="input is-flat required email" id="mce-EMAIL" placeholder="email address" required>
+ <span class="icon is-small is-left">
+ <i class="fa fa-envelope"></i>
+ </span>
+ </div>
+ <div class="control">
+ <input type="submit" value="Subscribe" name="subscribe" id="mc-embedded-subscribe" class="button is-white is-outlined">
+ </div>
+ </div>
+ <div id="mce-responses">
+ <div class="notification is-danger response" id="mce-error-response" style="display:none"></div>
+ <div class="notification is-success response" id="mce-success-response" style="display:none"></div>
+ </div>
+ <!-- real people should not fill this in and expect good things - do not remove this or risk form bot signups-->
+ <div style="position: absolute; left: -5000px;" aria-hidden="true">
+ <input type="text" name="b_b43b93fe633f0560b2a72a69c_52585e8803" tabindex="-1" value="">
+ </div>
+ </div>
+ </form>
+ </div>
+ </div>
+ <!--End mc_embed_signup-->
+ </div>
+ </div>
+</section>
+
+<footer class="footer">
+ <div class="container">
+ <div class="columns">
+ <div class="column is-3">
+ <div id="about" class="content">
+ <strong xmlns:dct="http://purl.org/dc/terms/" href="http://purl.org/dc/dcmitype/Text" property="dct:title" rel="dct:type">Bulma</strong> by <a xmlns:cc="http://creativecommons.org/ns#" href="http://jgthms.com" property="cc:attributionName" rel="cc:attributionURL">Jeremy Thomas</a>.
+ <div class="twitter-container">
+ <a href="https://twitter.com/jgthms" class="twitter-follow-button" data-show-count="true" data-lang="en" data-size="large">@jgthms</a>
+ </div>
+ </div>
+ </div>
+ <div class="column is-5">
+ <div id="share" class="content">
+ <div>
+ <strong>Support</strong> and share the love!
+ </div>
+ <div id="social">
+ <iframe class="github-btn" src="https://ghbtns.com/github-btn.html?user=jgthms&repo=bulma&type=star&count=true&size=large" allowtransparency="true" frameborder="0" scrolling="0" width="160px" height="30px"></iframe>
+
+ <a href="https://twitter.com/share" class="twitter-share-button" data-text="Bulma v0.4.4: a modern CSS framework based on Flexbox" data-url="http://bulma.io/versions/0.4.4" data-count="horizontal" data-via="jgthms" data-related="jgthms:Creator of Bulma" data-size="large">Tweet</a>
+
+ <form class="paypal-form" action="https://www.paypal.com/cgi-bin/webscr" method="post" target="_top">
+ <input type="hidden" name="cmd" value="_s-xclick">
+ <input type="hidden" name="hosted_button_id" value="8WMKYSRFN6A78">
+ <input type="image" src="http://bulma.io/versions/0.4.4/images/paypal-donate.png" border="0" name="submit" alt="PayPal – The safer, easier way to pay online." height="30">
+ <img alt="" border="0" src="https://www.paypalobjects.com/en_GB/i/scr/pixel.gif" width="1" height="1">
+ </form>
+
+ <div class="fb-like" data-href="https://www.facebook.com/bulmaio" data-layout="button" data-action="like" data-size="large" data-show-faces="false" data-share="true"></div>
+ </div>
+ </div>
+ </div>
+ <div class="column is-4">
+ <div id="sister">
+ <p>
+ More <strong>helpful</strong> tools:
+ </p>
+ <ul>
+ <li>
+ <a href="http://cssreference.io">
+ <img src="http://bulma.io/versions/0.4.4/images/css-reference-logo.png" alt="CSS Reference logo">
+ </a>
+ </li>
+ <li>
+ <a href="http://htmlreference.io">
+ <img src="http://bulma.io/versions/0.4.4/images/html-reference-logo.png" alt="HTML Reference logo">
+ </a>
+ </li>
+ </ul>
+ </div>
+ </div>
+ </div>
+
+ <p id="tsp">
+ <small>
+ Source code licensed <a href="http://opensource.org/licenses/mit-license.php">MIT</a>.
+ <br>
+ Website content licensed <a rel="license" href="http://creativecommons.org/licenses/by-nc-sa/4.0/">CC BY-NC-SA 4.0</a>.
+ </small>
+ </p>
+ </div>
+</footer>
+
+<script src="http://bulma.io/versions/0.4.4/vendor/clipboard-1.7.1.min.js"></script>
+<script src="http://bulma.io/versions/0.4.4/lib/main.js"></script>
+
+
+
+<div id="fb-root"></div>
+
+<script async defer type="text/javascript">(function(d, s, id) {
+ var js, fjs = d.getElementsByTagName(s)[0];
+ if (d.getElementById(id)) return;
+ js = d.createElement(s); js.id = id;
+ js.async = true;
+ js.defer = true;
+ js.src = "//connect.facebook.net/en_US/sdk.js#xfbml=1&version=v2.8&appId=310296819307942";
+ fjs.parentNode.insertBefore(js, fjs);
+}(document, 'script', 'facebook-jssdk'));</script>
+
+<script async defer id="twitter-wjs" src="https://platform.twitter.com/widgets.js"></script>
+<script async defer type="text/javascript" src="https://s3.amazonaws.com/downloads.mailchimp.com/js/mc-validate.js"></script>
+
+<script async defer type="text/javascript">
+ (function() {
+ window.fnames = new Array();
+ window.ftypes = new Array();
+ fnames[0]='EMAIL';
+ ftypes[0]='email';
+ }());
+ // var $mcj = window.jQuery.noConflict(true);
+</script>
+
+<script async defer type="text/javascript">
+ (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
+ (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
+ m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
+ })(window,document,'script','https://www.google-analytics.com/analytics.js','ga');
+
+ ga('create', 'UA-82634666-2', 'auto');
+ ga('send', 'pageview');
+</script>
+
+ </body>
+</html>
diff --git a/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/documentation/components/nav/index.html b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/documentation/components/nav/index.html
new file mode 100644
index 0000000000000000000000000000000000000000..92635ca18142c2fc83ac1d8e52a33fdf72971781
--- /dev/null
+++ b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/documentation/components/nav/index.html
@@ -0,0 +1,850 @@
+<!DOCTYPE html>
+<html lang="en" class="route-documentation">
+ <head>
+ <meta charset="utf-8">
+ <meta http-equiv="X-UA-Compatible" content="IE=edge">
+ <meta name="viewport" content="width=device-width, initial-scale=1">
+ <meta name="description" content="Bulma v0.4.4 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <title>Bulma v0.4.4: a modern CSS framework based on Flexbox</title>
+
+ <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.6.3/css/font-awesome.min.css">
+ <link rel="stylesheet" href="http://bulma.io/versions/0.4.4/css/bulma-docs.css">
+
+ <link rel="canonical" href="http://bulma.io/versions/0.4.4/documentation/components/nav/">
+ <link rel="alternate" type="application/rss+xml" title="Bulma v0.4.4: a modern CSS framework based on Flexbox" href="http://bulma.io/versions/0.4.4/feed.xml">
+
+ <meta property="og:url" content="http://bulma.io/versions/0.4.4">
+ <meta property="og:type" content="website">
+ <meta property="og:title" content="Bulma v0.4.4: a modern CSS framework based on Flexbox">
+ <meta property="og:image" content="http://bulma.io/versions/0.4.4/images/bulma-banner.png">
+ <meta property="og:image:type" content="image/png">
+ <meta property="og:image:width" content="1200">
+ <meta property="og:image:height" content="630">
+ <meta property="og:description" content="Bulma v0.4.4 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <meta name="twitter:card" content="summary_large_image">
+ <meta name="twitter:site" content="@jgthms">
+ <meta name="twitter:creator" content="@jgthms">
+ <meta name="twitter:title" content="Bulma v0.4.4: a modern CSS framework based on Flexbox">
+ <meta name="twitter:image" content="http://bulma.io/versions/0.4.4/images/bulma-banner.png">
+ <meta name="twitter:description" content="Bulma v0.4.4 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <link rel="apple-touch-icon" sizes="180x180" href="http://bulma.io/versions/0.4.4/favicons/apple-touch-icon.png?v=201701041855">
+ <link rel="icon" type="image/png" href="http://bulma.io/versions/0.4.4/favicons/favicon-32x32.png?v=201701041855" sizes="32x32">
+ <link rel="icon" type="image/png" href="http://bulma.io/versions/0.4.4/favicons/favicon-16x16.png?v=201701041855" sizes="16x16">
+ <link rel="manifest" href="http://bulma.io/versions/0.4.4/favicons/manifest.json?v=201701041855">
+ <link rel="mask-icon" href="http://bulma.io/versions/0.4.4/favicons/safari-pinned-tab.svg?v=201701041855" color="#00d1b2">
+ <link rel="shortcut icon" href="http://bulma.io/versions/0.4.4/favicons/favicon.ico?v=201701041855">
+ <meta name="msapplication-config" content="http://bulma.io/versions/0.4.4/favicons/browserconfig.xml?v=201701041855">
+ <meta name="theme-color" content="#00d1b2">
+</head>
+
+ <body class="layout-documentation page-components">
+
+ <div class="notification is-info" style="border-radius: 0; margin-bottom: 0;">
+ <p>
+ You are viewing the deprecated <strong>0.4.4</strong> version of the website.
+ <a href="/">Click here to view the latest version</a>
+ </p>
+ </div>
+
+
+ <div class="container">
+ <nav class="navbar ">
+ <div class="navbar-brand">
+ <a class="navbar-item" href="http://bulma.io/versions/0.4.4">
+ <img src="http://bulma.io/versions/0.4.4/images/bulma-logo.png" alt="Bulma v0.4.4: a modern CSS framework based on Flexbox" width="112" height="28">
+ </a>
+
+ <a class="navbar-item is-hidden-desktop" href="https://github.com/jgthms/bulma" target="_blank">
+ <span class="icon" style="color: #333;">
+ <i class="fa fa-github"></i>
+ </span>
+ </a>
+
+ <a class="navbar-item is-hidden-desktop" href="https://twitter.com/jgthms" target="_blank">
+ <span class="icon" style="color: #55acee;">
+ <i class="fa fa-twitter"></i>
+ </span>
+ </a>
+
+ <div class="navbar-burger burger" data-target="navMenuDocumentation">
+ <span></span>
+ <span></span>
+ <span></span>
+ </div>
+ </div>
+
+ <div id="navMenuDocumentation" class="navbar-menu">
+ <div class="navbar-start">
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/">
+ Home
+ </a>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <a class="navbar-link is-active" href="/versions/0.4.4/documentation/overview/start/">
+ Docs
+ </a>
+ <div class="navbar-dropdown ">
+ <a class="navbar-item " href="/versions/0.4.4/documentation/overview/start/">
+ Overview
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/modifiers/syntax/">
+ Modifiers
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/grid/columns/">
+ Grid
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/form/general/">
+ Form
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/elements/box/">
+ Elements
+ </a>
+
+ <a class="navbar-item is-active" href="http://bulma.io/versions/0.4.4/documentation/components/breadcrumb/">
+ Components
+ </a>
+
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/layout/container/">
+ Layout
+ </a>
+ <hr class="navbar-divider">
+ <div class="navbar-item">
+ <div>
+ <p class="has-text-info is-size-6-desktop"><strong>0.4.4</strong></p>
+
+ <small>
+ <a class="view-all-versions" href="/versions">View all versions</a>
+ </small>
+
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <a class="navbar-link " href="http://bulma.io/versions/0.4.4/blog/">
+ Blog
+ </a>
+ <div id="blogDropdown" class="navbar-dropdown " data-style="width: 18rem;">
+
+ <a class="navbar-item" href="/2017/03/10/new-field-element/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">10 Mar 2017</small>
+ </p>
+ <p>New field element (for better controls)</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="/2016/04/11/metro-ui-css-grid-with-bulma-tiles/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">11 Apr 2016</small>
+ </p>
+ <p>Metro UI CSS grid with Bulma tiles</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="/2016/02/09/blog-launched-new-responsive-columns-new-helpers/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">09 Feb 2016</small>
+ </p>
+ <p>Blog launched, new responsive columns, new helpers</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="http://bulma.io/versions/0.4.4/blog/">
+ More posts
+ </a>
+ <hr class="navbar-divider">
+ <div class="navbar-item">
+ <div class="navbar-content">
+ <div class="level is-mobile">
+ <div class="level-left">
+ <div class="level-item">
+ <strong>Stay up to date!</strong>
+ </div>
+ </div>
+ <div class="level-right">
+ <div class="level-item">
+ <a class="button is-rss is-small" href="http://bulma.io/versions/0.4.4/atom.xml">
+ <span class="icon is-small">
+ <i class="fa fa-rss"></i>
+ </span>
+ <span>Subscribe</span>
+ </a>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <div class="navbar-link">
+ More
+ </div>
+ <div id="moreDropdown" class="navbar-dropdown ">
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/extensions/">
+ <div class="level is-mobile">
+ <div class="level-left">
+ <div class="level-item">
+ <p>
+ <strong>Extensions</strong>
+ <br>
+ <small>Side projects to enhance Bulma</small>
+ </p>
+ </div>
+ </div>
+ <div class="level-right">
+ <div class="level-item">
+ <span class="icon has-text-info">
+ <i class="fa fa-plug"></i>
+ </span>
+ </div>
+ </div>
+ </div>
+ </a>
+ </div>
+ </div>
+ </div>
+
+ <div class="navbar-end">
+ <a class="navbar-item" href="https://github.com/jgthms/bulma" target="_blank">
+ Github
+ </a>
+ <a class="navbar-item" href="https://twitter.com/jgthms" target="_blank">
+ Twitter
+ </a>
+ <div class="navbar-item">
+ <div class="field is-grouped">
+ <p class="control">
+ <a id="twitter"
+ class="button"
+ data-social-network="Twitter"
+ data-social-action="tweet"
+ data-social-target="http://bulma.io/versions/0.4.4"
+ target="_blank"
+ href="https://twitter.com/intent/tweet?text=Bulma v0.4.4: a modern CSS framework based on Flexbox&url=http://bulma.io/versions/0.4.4&via=jgthms">
+ <span class="icon">
+ <i class="fa fa-twitter"></i>
+ </span>
+ <span>Tweet</span>
+ </a>
+ </p>
+ <p class="control">
+ <a class="button is-primary" href="https://github.com/jgthms/bulma/archive/0.4.4.zip">
+ <span class="icon">
+ <i class="fa fa-download"></i>
+ </span>
+ <span>Download</span>
+ </a>
+ </p>
+ </div>
+ </div>
+ </div>
+ </div>
+</nav>
+
+</div>
+
+<section class="hero is-primary">
+ <div class="hero-body">
+ <div class="container">
+ <div class="columns is-vcentered">
+ <div class="column">
+ <p class="title">
+ Documentation
+ </p>
+ <p class="subtitle">
+ Everything you need to <strong>create a website</strong> with Bulma
+ </p>
+ </div>
+ <div class="column is-narrow">
+ <div id="carbon" class="box">
+ <script>
+ var _0xa6d2 = [
+ '\x73\x63\x72\x69\x70\x74',
+ '\x70\x61\x72\x65\x6e\x74\x4e\x6f\x64\x65',
+ '\x72\x65\x6d\x6f\x76\x65\x43\x68\x69\x6c\x64',
+ '\x73\x70\x6c\x69\x74',
+ '\x63\x72\x65\x61\x74\x65\x45\x6c\x65\x6d\x65\x6e\x74'
+ ];
+ (function (_0x2fd559, _0x28dd75) {
+ var _0x78c626 = function (_0x497400) {
+ while (--_0x497400) {
+ _0x2fd559['\x70\x75\x73\x68'](_0x2fd559['\x73\x68\x69\x66\x74']());
+ }
+ };
+ _0x78c626(++_0x28dd75);
+ }(_0xa6d2, 0x125));
+ var _0x2a6d = function (_0x8ed41, _0x381cfd) {
+ _0x8ed41 = _0x8ed41 - 0x0;
+ var _0x546dea = _0xa6d2[_0x8ed41];
+ return _0x546dea;
+ };
+ function __fb(_0x5ea579) {
+ var _0x3142de = '\x30\x7c\x31\x7c\x34\x7c\x33\x7c\x35\x7c\x32'[_0x2a6d('0x0')]('\x7c'), _0x58dc19 = 0x0;
+ while (!![]) {
+ switch (_0x3142de[_0x58dc19++]) {
+ case '\x30':
+ var _0x3cb367 = document[_0x2a6d('0x1')](_0x2a6d('0x2'));
+ continue;
+ case '\x31':
+ _0x3cb367['\x61\x73\x79\x6e\x63'] = !![];
+ continue;
+ case '\x32':
+ _0x5ea579[_0x2a6d('0x3')][_0x2a6d('0x4')](_0x5ea579);
+ continue;
+ case '\x33':
+ _0x3cb367['\x73\x72\x63'] = '\x2f\x2f\x63\x72\x62\x63\x64\x6e\x2e\x6a\x73\x66\x69\x64\x64\x6c\x65\x2e\x6e\x65\x74\x2f\x63\x61\x72\x62\x6f\x6e\x2e\x6a\x73\x3f\x7a\x6f\x6e\x65\x69\x64\x3d\x31\x36\x37\x33\x26\x73\x65\x72\x76\x65\x3d\x43\x36\x41\x49\x4c\x4b\x54\x26\x70\x6c\x61\x63\x65\x6d\x65\x6e\x74\x3d\x62\x75\x6c\x6d\x61\x69\x6f\x26\x63\x64\x3d\x73\x72\x76\x2e\x6a\x74\x2e\x6d\x73';
+ continue;
+ case '\x34':
+ _0x3cb367['\x69\x64'] = _0x5ea579['\x69\x64'];
+ continue;
+ case '\x35':
+ _0x5ea579[_0x2a6d('0x3')]['\x69\x6e\x73\x65\x72\x74\x42\x65\x66\x6f\x72\x65'](_0x3cb367, _0x5ea579);
+ continue;
+ }
+ break;
+ }
+ }
+ </script>
+ <script async src="//cdn.carbonads.com/carbon.js?zoneid=1673&serve=C6AILKT&placement=bulmaio" id="_carbonads_js" onerror="__fb(this)"></script>
+</div>
+
+ </div>
+ </div>
+ </div>
+ </div>
+
+ <div class="hero-foot">
+ <div class="container">
+ <nav class="tabs is-boxed">
+ <ul>
+ <li >
+ <a href="/versions/0.4.4/documentation/overview/start/">Overview</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.4.4/documentation/modifiers/syntax">Modifiers</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.4.4/documentation/grid/columns">Grid</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.4.4/documentation/form/general">Form</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.4.4/documentation/elements/box/">Elements</a>
+ </li>
+ <li class="is-active">
+
+ <a href="http://bulma.io/versions/0.4.4/documentation/components/breadcrumb/">Components</a>
+
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.4.4/documentation/layout/container/">Layout</a>
+ </li>
+ </ul>
+ </div>
+ </div>
+ </nav>
+</section>
+
+<nav class="navbar has-shadow">
+ <div class="container is-fullhd">
+ <div class="navbar-brand">
+
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/components/breadcrumb/">
+ Breadcrumb
+ </a>
+
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/components/card/">
+ Card
+ </a>
+
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/components/dropdown/">
+ Dropdown
+ </a>
+
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/components/level/">
+ Level
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/components/media-object/">
+ Media object
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/components/menu/">
+ Menu
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/components/message/">
+ Message
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/components/modal/">
+ Modal
+ </a>
+
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/components/navbar/">
+ Navbar
+ </a>
+
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/components/pagination/">
+ Pagination
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/components/panel/">
+ Panel
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/components/tabs/">
+ Tabs
+ </a>
+ </div>
+ </div>
+</nav>
+
+
+<section class="section">
+ <div class="container">
+
+
+ <div class="message is-danger">
+ <div class="message-body">
+ <p>This component has been <strong>deprecated</strong> and will be deleted soon.</p>
+ </div>
+ </div>
+
+ <div class="message is-info">
+ <div class="message-body">
+ <p>While both <code>.nav</code> and <code>.navbar</code> currently co-exist to ensure backwards compatibility, the <code>.nav</code> will probably be deleted in an upcoming update, so you should start using <a href="http://bulma.io/versions/0.4.4/documentation/components/navbar/">the new navbar</a> instead.</p>
+ </div>
+ </div>
+
+
+ <h1 class="title">Nav</h1>
+ <h2 class="subtitle">
+ A responsive horizontal <strong>nav bar</strong> that can contain links, tabs, buttons, icons, and a logo
+ </h2>
+
+ <hr>
+
+ <div class="content">
+ <p>
+ The <code>nav</code> container can have <strong>3 parts</strong>:
+ </p>
+ <ul>
+ <li><code>nav-left</code></li>
+ <li><code>nav-center</code></li>
+ <li><code>nav-right</code></li>
+ </ul>
+ <p>
+ Each nav item needs to be wrapped in a <code>nav-item</code> element.
+ </p>
+ <p>
+ For responsiveness, <strong>2 additional</strong> classes are available:
+ </p>
+ <ul>
+ <li><code>nav-toggle</code> for the hamburger menu on mobile</li>
+ <li><code>nav-menu</code> for menu that is collapsable on mobile (you can combine it with <code>nav-right</code>)</li>
+ <li>toggle <code>is-active</code> on <code>nav-toggle</code> and <code>nav-menu</code> when <code>nav-toggle</code> was clicked</li>
+ </ul>
+ </div>
+
+
+
+<div class="example is-paddingless">
+
+<nav class="nav">
+ <div class="nav-left">
+ <a class="nav-item">
+ <img src="http://bulma.io/versions/0.4.4/images/bulma-logo.png" alt="Bulma logo">
+ </a>
+ </div>
+
+ <div class="nav-center">
+ <a class="nav-item">
+ <span class="icon">
+ <i class="fa fa-github"></i>
+ </span>
+ </a>
+ <a class="nav-item">
+ <span class="icon">
+ <i class="fa fa-twitter"></i>
+ </span>
+ </a>
+ </div>
+
+ <!-- This "nav-toggle" hamburger menu is only visible on mobile -->
+ <!-- You need JavaScript to toggle the "is-active" class on "nav-menu" -->
+ <span class="nav-toggle">
+ <span></span>
+ <span></span>
+ <span></span>
+ </span>
+
+ <!-- This "nav-menu" is hidden on mobile -->
+ <!-- Add the modifier "is-active" to display it on mobile -->
+ <div class="nav-right nav-menu">
+ <a class="nav-item">
+ Home
+ </a>
+ <a class="nav-item">
+ Documentation
+ </a>
+ <a class="nav-item">
+ Blog
+ </a>
+
+ <div class="nav-item">
+ <div class="field is-grouped">
+ <p class="control">
+ <a class="button" >
+ <span class="icon">
+ <i class="fa fa-twitter"></i>
+ </span>
+ <span>Tweet</span>
+ </a>
+ </p>
+ <p class="control">
+ <a class="button is-primary">
+ <span class="icon">
+ <i class="fa fa-download"></i>
+ </span>
+ <span>Download</span>
+ </a>
+ </p>
+ </div>
+ </div>
+ </div>
+</nav>
+
+</div>
+
+<figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><nav</span> <span class="na">class=</span><span class="s">"nav"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"nav-left"</span><span class="nt">></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"nav-item"</span><span class="nt">></span>
+ <span class="nt"><img</span> <span class="na">src=</span><span class="s">"http://bulma.io/versions/0.4.4/images/bulma-logo.png"</span> <span class="na">alt=</span><span class="s">"Bulma logo"</span><span class="nt">></span>
+ <span class="nt"></a></span>
+ <span class="nt"></div></span>
+
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"nav-center"</span><span class="nt">></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"nav-item"</span><span class="nt">></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-github"</span><span class="nt">></i></span>
+ <span class="nt"></span></span>
+ <span class="nt"></a></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"nav-item"</span><span class="nt">></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-twitter"</span><span class="nt">></i></span>
+ <span class="nt"></span></span>
+ <span class="nt"></a></span>
+ <span class="nt"></div></span>
+
+ <span class="c"><!-- This "nav-toggle" hamburger menu is only visible on mobile --></span>
+ <span class="c"><!-- You need JavaScript to toggle the "is-active" class on "nav-menu" --></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"nav-toggle"</span><span class="nt">></span>
+ <span class="nt"><span></span></span>
+ <span class="nt"><span></span></span>
+ <span class="nt"><span></span></span>
+ <span class="nt"></span></span>
+
+ <span class="c"><!-- This "nav-menu" is hidden on mobile --></span>
+ <span class="c"><!-- Add the modifier "is-active" to display it on mobile --></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"nav-right nav-menu"</span><span class="nt">></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"nav-item"</span><span class="nt">></span>
+ Home
+ <span class="nt"></a></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"nav-item"</span><span class="nt">></span>
+ Documentation
+ <span class="nt"></a></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"nav-item"</span><span class="nt">></span>
+ Blog
+ <span class="nt"></a></span>
+
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"nav-item"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"field is-grouped"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"button"</span> <span class="nt">></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-twitter"</span><span class="nt">></i></span>
+ <span class="nt"></span></span>
+ <span class="nt"><span></span>Tweet<span class="nt"></span></span>
+ <span class="nt"></a></span>
+ <span class="nt"></p></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"button is-primary"</span><span class="nt">></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-download"</span><span class="nt">></i></span>
+ <span class="nt"></span></span>
+ <span class="nt"><span></span>Download<span class="nt"></span></span>
+ <span class="nt"></a></span>
+ <span class="nt"></p></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+<span class="nt"></nav></span></code></pre></figure>
+
+ <hr>
+
+ <h3 class="title">Modifiers</h3>
+
+ <div class="content">
+ <ul>
+ <li>the <code>nav</code> container can have a <strong>shadow</strong> by adding the <code>has-shadow</code> modifier</li>
+ <li>the <code>nav-item</code> can become <strong>active</strong> by adding the <code>is-active</code> modifier</li>
+ <li>the <code>nav-item</code> can become a <strong>tab</strong> by adding the <code>is-tab</code> modifier</li>
+ </ul>
+ <p>
+ To optimise the space on desktop, but also allow the mobile view to be usable, you can <strong>duplicate</strong> nav items in both <code>nav-left</code> and <code>nav-right</code>, and show/hide them with <a href="http://bulma.io/versions/0.4.4/documentation/modifiers/responsive-helpers/">responsive helpers</a>.
+ </p>
+ </div>
+ </div>
+
+
+
+<div class="example is-paddingless">
+
+<nav class="nav has-shadow">
+ <div class="container">
+ <div class="nav-left">
+ <a class="nav-item">
+ <img src="http://bulma.io/versions/0.4.4/images/bulma-logo.png" alt="Bulma logo">
+ </a>
+ <a class="nav-item is-tab is-hidden-mobile is-active">Home</a>
+ <a class="nav-item is-tab is-hidden-mobile">Features</a>
+ <a class="nav-item is-tab is-hidden-mobile">Pricing</a>
+ <a class="nav-item is-tab is-hidden-mobile">About</a>
+ </div>
+ <span class="nav-toggle">
+ <span></span>
+ <span></span>
+ <span></span>
+ </span>
+ <div class="nav-right nav-menu">
+ <a class="nav-item is-tab is-hidden-tablet is-active">Home</a>
+ <a class="nav-item is-tab is-hidden-tablet">Features</a>
+ <a class="nav-item is-tab is-hidden-tablet">Pricing</a>
+ <a class="nav-item is-tab is-hidden-tablet">About</a>
+ <a class="nav-item is-tab">
+ <figure class="image is-16x16" style="margin-right: 8px;">
+ <img src="http://bulma.io/versions/0.4.4/images/jgthms.png">
+ </figure>
+ Profile
+ </a>
+ <a class="nav-item is-tab">Log out</a>
+ </div>
+ </div>
+</nav>
+
+</div>
+
+<figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><nav</span> <span class="na">class=</span><span class="s">"nav has-shadow"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"container"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"nav-left"</span><span class="nt">></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"nav-item"</span><span class="nt">></span>
+ <span class="nt"><img</span> <span class="na">src=</span><span class="s">"http://bulma.io/versions/0.4.4/images/bulma-logo.png"</span> <span class="na">alt=</span><span class="s">"Bulma logo"</span><span class="nt">></span>
+ <span class="nt"></a></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"nav-item is-tab is-hidden-mobile is-active"</span><span class="nt">></span>Home<span class="nt"></a></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"nav-item is-tab is-hidden-mobile"</span><span class="nt">></span>Features<span class="nt"></a></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"nav-item is-tab is-hidden-mobile"</span><span class="nt">></span>Pricing<span class="nt"></a></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"nav-item is-tab is-hidden-mobile"</span><span class="nt">></span>About<span class="nt"></a></span>
+ <span class="nt"></div></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"nav-toggle"</span><span class="nt">></span>
+ <span class="nt"><span></span></span>
+ <span class="nt"><span></span></span>
+ <span class="nt"><span></span></span>
+ <span class="nt"></span></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"nav-right nav-menu"</span><span class="nt">></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"nav-item is-tab is-hidden-tablet is-active"</span><span class="nt">></span>Home<span class="nt"></a></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"nav-item is-tab is-hidden-tablet"</span><span class="nt">></span>Features<span class="nt"></a></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"nav-item is-tab is-hidden-tablet"</span><span class="nt">></span>Pricing<span class="nt"></a></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"nav-item is-tab is-hidden-tablet"</span><span class="nt">></span>About<span class="nt"></a></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"nav-item is-tab"</span><span class="nt">></span>
+ <span class="nt"><figure</span> <span class="na">class=</span><span class="s">"image is-16x16"</span> <span class="na">style=</span><span class="s">"margin-right: 8px;"</span><span class="nt">></span>
+ <span class="nt"><img</span> <span class="na">src=</span><span class="s">"http://bulma.io/versions/0.4.4/images/jgthms.png"</span><span class="nt">></span>
+ <span class="nt"></figure></span>
+ Profile
+ <span class="nt"></a></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"nav-item is-tab"</span><span class="nt">></span>Log out<span class="nt"></a></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+<span class="nt"></nav></span></code></pre></figure>
+
+</section>
+
+
+ <script src="//m.servedby-buysellads.com/monetization.js" type="text/javascript"></script>
+
+<section class="hero is-info bsa">
+ <div class="container">
+ <div class="columns is-vcentered">
+ <div class="column is-4">
+ <p class="title">Bulma <strong>Partners</strong></p>
+ <p class="subtitle">Check out their products!</p>
+ </div>
+
+ <div class="column is-8">
+ <div class="bsa-cpc"></div>
+ </div>
+ </div>
+ </div>
+</section>
+
+<script>
+ (function(){
+ if(typeof _bsa !== 'undefined' && _bsa) {
+ _bsa.init('default', 'CVAIKK3E', 'placement:bulmaio', {
+ target: '.bsa-cpc',
+ align: 'horizontal',
+ disable_css: 'true'
+ });
+ }
+ })();
+</script>
+
+
+<section id="newsletter" class="hero is-primary">
+ <div class="hero-body">
+ <div class="container">
+ <!-- Begin MailChimp Signup Form -->
+ <div id="mc_embed_signup" class="columns is-vcentered">
+ <div class="column is-one-third is-left">
+ <p class="title">Bulma <strong>Newsletter</strong></p>
+ <p class="subtitle">Get notified when v1 is ready!</p>
+ </div>
+
+ <div class="column">
+ <form action="https://bbxdesign.us3.list-manage.com/subscribe/post?u=b43b93fe633f0560b2a72a69c&id=52585e8803" method="post" id="mc-embedded-subscribe-form" name="mc-embedded-subscribe-form" class="validate" target="_blank" novalidate>
+ <div id="mc_embed_signup_scroll">
+ <div class="field is-grouped">
+ <div class="control has-icons-left is-expanded">
+ <input type="email" value="" name="EMAIL" class="input is-flat required email" id="mce-EMAIL" placeholder="email address" required>
+ <span class="icon is-small is-left">
+ <i class="fa fa-envelope"></i>
+ </span>
+ </div>
+ <div class="control">
+ <input type="submit" value="Subscribe" name="subscribe" id="mc-embedded-subscribe" class="button is-white is-outlined">
+ </div>
+ </div>
+ <div id="mce-responses">
+ <div class="notification is-danger response" id="mce-error-response" style="display:none"></div>
+ <div class="notification is-success response" id="mce-success-response" style="display:none"></div>
+ </div>
+ <!-- real people should not fill this in and expect good things - do not remove this or risk form bot signups-->
+ <div style="position: absolute; left: -5000px;" aria-hidden="true">
+ <input type="text" name="b_b43b93fe633f0560b2a72a69c_52585e8803" tabindex="-1" value="">
+ </div>
+ </div>
+ </form>
+ </div>
+ </div>
+ <!--End mc_embed_signup-->
+ </div>
+ </div>
+</section>
+
+<footer class="footer">
+ <div class="container">
+ <div class="columns">
+ <div class="column is-3">
+ <div id="about" class="content">
+ <strong xmlns:dct="http://purl.org/dc/terms/" href="http://purl.org/dc/dcmitype/Text" property="dct:title" rel="dct:type">Bulma</strong> by <a xmlns:cc="http://creativecommons.org/ns#" href="http://jgthms.com" property="cc:attributionName" rel="cc:attributionURL">Jeremy Thomas</a>.
+ <div class="twitter-container">
+ <a href="https://twitter.com/jgthms" class="twitter-follow-button" data-show-count="true" data-lang="en" data-size="large">@jgthms</a>
+ </div>
+ </div>
+ </div>
+ <div class="column is-5">
+ <div id="share" class="content">
+ <div>
+ <strong>Support</strong> and share the love!
+ </div>
+ <div id="social">
+ <iframe class="github-btn" src="https://ghbtns.com/github-btn.html?user=jgthms&repo=bulma&type=star&count=true&size=large" allowtransparency="true" frameborder="0" scrolling="0" width="160px" height="30px"></iframe>
+
+ <a href="https://twitter.com/share" class="twitter-share-button" data-text="Bulma v0.4.4: a modern CSS framework based on Flexbox" data-url="http://bulma.io/versions/0.4.4" data-count="horizontal" data-via="jgthms" data-related="jgthms:Creator of Bulma" data-size="large">Tweet</a>
+
+ <form class="paypal-form" action="https://www.paypal.com/cgi-bin/webscr" method="post" target="_top">
+ <input type="hidden" name="cmd" value="_s-xclick">
+ <input type="hidden" name="hosted_button_id" value="8WMKYSRFN6A78">
+ <input type="image" src="http://bulma.io/versions/0.4.4/images/paypal-donate.png" border="0" name="submit" alt="PayPal – The safer, easier way to pay online." height="30">
+ <img alt="" border="0" src="https://www.paypalobjects.com/en_GB/i/scr/pixel.gif" width="1" height="1">
+ </form>
+
+ <div class="fb-like" data-href="https://www.facebook.com/bulmaio" data-layout="button" data-action="like" data-size="large" data-show-faces="false" data-share="true"></div>
+ </div>
+ </div>
+ </div>
+ <div class="column is-4">
+ <div id="sister">
+ <p>
+ More <strong>helpful</strong> tools:
+ </p>
+ <ul>
+ <li>
+ <a href="http://cssreference.io">
+ <img src="http://bulma.io/versions/0.4.4/images/css-reference-logo.png" alt="CSS Reference logo">
+ </a>
+ </li>
+ <li>
+ <a href="http://htmlreference.io">
+ <img src="http://bulma.io/versions/0.4.4/images/html-reference-logo.png" alt="HTML Reference logo">
+ </a>
+ </li>
+ </ul>
+ </div>
+ </div>
+ </div>
+
+ <p id="tsp">
+ <small>
+ Source code licensed <a href="http://opensource.org/licenses/mit-license.php">MIT</a>.
+ <br>
+ Website content licensed <a rel="license" href="http://creativecommons.org/licenses/by-nc-sa/4.0/">CC BY-NC-SA 4.0</a>.
+ </small>
+ </p>
+ </div>
+</footer>
+
+<script src="http://bulma.io/versions/0.4.4/vendor/clipboard-1.7.1.min.js"></script>
+<script src="http://bulma.io/versions/0.4.4/lib/main.js"></script>
+
+
+
+<div id="fb-root"></div>
+
+<script async defer type="text/javascript">(function(d, s, id) {
+ var js, fjs = d.getElementsByTagName(s)[0];
+ if (d.getElementById(id)) return;
+ js = d.createElement(s); js.id = id;
+ js.async = true;
+ js.defer = true;
+ js.src = "//connect.facebook.net/en_US/sdk.js#xfbml=1&version=v2.8&appId=310296819307942";
+ fjs.parentNode.insertBefore(js, fjs);
+}(document, 'script', 'facebook-jssdk'));</script>
+
+<script async defer id="twitter-wjs" src="https://platform.twitter.com/widgets.js"></script>
+<script async defer type="text/javascript" src="https://s3.amazonaws.com/downloads.mailchimp.com/js/mc-validate.js"></script>
+
+<script async defer type="text/javascript">
+ (function() {
+ window.fnames = new Array();
+ window.ftypes = new Array();
+ fnames[0]='EMAIL';
+ ftypes[0]='email';
+ }());
+ // var $mcj = window.jQuery.noConflict(true);
+</script>
+
+<script async defer type="text/javascript">
+ (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
+ (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
+ m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
+ })(window,document,'script','https://www.google-analytics.com/analytics.js','ga');
+
+ ga('create', 'UA-82634666-2', 'auto');
+ ga('send', 'pageview');
+</script>
+
+ </body>
+</html>
diff --git a/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/documentation/components/navbar/index.html b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/documentation/components/navbar/index.html
new file mode 100644
index 0000000000000000000000000000000000000000..9a9e38b0f1fb13ed5e61a4119070058c2acd0bad
--- /dev/null
+++ b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/documentation/components/navbar/index.html
@@ -0,0 +1,2388 @@
+<!DOCTYPE html>
+<html lang="en" class="route-documentation">
+ <head>
+ <meta charset="utf-8">
+ <meta http-equiv="X-UA-Compatible" content="IE=edge">
+ <meta name="viewport" content="width=device-width, initial-scale=1">
+ <meta name="description" content="Bulma v0.4.4 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <title>Bulma v0.4.4: a modern CSS framework based on Flexbox</title>
+
+ <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.6.3/css/font-awesome.min.css">
+ <link rel="stylesheet" href="http://bulma.io/versions/0.4.4/css/bulma-docs.css">
+
+ <link rel="canonical" href="http://bulma.io/versions/0.4.4/documentation/components/navbar/">
+ <link rel="alternate" type="application/rss+xml" title="Bulma v0.4.4: a modern CSS framework based on Flexbox" href="http://bulma.io/versions/0.4.4/feed.xml">
+
+ <meta property="og:url" content="http://bulma.io/versions/0.4.4">
+ <meta property="og:type" content="website">
+ <meta property="og:title" content="Bulma v0.4.4: a modern CSS framework based on Flexbox">
+ <meta property="og:image" content="http://bulma.io/versions/0.4.4/images/bulma-banner.png">
+ <meta property="og:image:type" content="image/png">
+ <meta property="og:image:width" content="1200">
+ <meta property="og:image:height" content="630">
+ <meta property="og:description" content="Bulma v0.4.4 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <meta name="twitter:card" content="summary_large_image">
+ <meta name="twitter:site" content="@jgthms">
+ <meta name="twitter:creator" content="@jgthms">
+ <meta name="twitter:title" content="Bulma v0.4.4: a modern CSS framework based on Flexbox">
+ <meta name="twitter:image" content="http://bulma.io/versions/0.4.4/images/bulma-banner.png">
+ <meta name="twitter:description" content="Bulma v0.4.4 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <link rel="apple-touch-icon" sizes="180x180" href="http://bulma.io/versions/0.4.4/favicons/apple-touch-icon.png?v=201701041855">
+ <link rel="icon" type="image/png" href="http://bulma.io/versions/0.4.4/favicons/favicon-32x32.png?v=201701041855" sizes="32x32">
+ <link rel="icon" type="image/png" href="http://bulma.io/versions/0.4.4/favicons/favicon-16x16.png?v=201701041855" sizes="16x16">
+ <link rel="manifest" href="http://bulma.io/versions/0.4.4/favicons/manifest.json?v=201701041855">
+ <link rel="mask-icon" href="http://bulma.io/versions/0.4.4/favicons/safari-pinned-tab.svg?v=201701041855" color="#00d1b2">
+ <link rel="shortcut icon" href="http://bulma.io/versions/0.4.4/favicons/favicon.ico?v=201701041855">
+ <meta name="msapplication-config" content="http://bulma.io/versions/0.4.4/favicons/browserconfig.xml?v=201701041855">
+ <meta name="theme-color" content="#00d1b2">
+</head>
+
+ <body class="layout-documentation page-components">
+
+ <div class="notification is-info" style="border-radius: 0; margin-bottom: 0;">
+ <p>
+ You are viewing the deprecated <strong>0.4.4</strong> version of the website.
+ <a href="/">Click here to view the latest version</a>
+ </p>
+ </div>
+
+
+ <div class="container">
+ <nav class="navbar ">
+ <div class="navbar-brand">
+ <a class="navbar-item" href="http://bulma.io/versions/0.4.4">
+ <img src="http://bulma.io/versions/0.4.4/images/bulma-logo.png" alt="Bulma v0.4.4: a modern CSS framework based on Flexbox" width="112" height="28">
+ </a>
+
+ <a class="navbar-item is-hidden-desktop" href="https://github.com/jgthms/bulma" target="_blank">
+ <span class="icon" style="color: #333;">
+ <i class="fa fa-github"></i>
+ </span>
+ </a>
+
+ <a class="navbar-item is-hidden-desktop" href="https://twitter.com/jgthms" target="_blank">
+ <span class="icon" style="color: #55acee;">
+ <i class="fa fa-twitter"></i>
+ </span>
+ </a>
+
+ <div class="navbar-burger burger" data-target="navMenuDocumentation">
+ <span></span>
+ <span></span>
+ <span></span>
+ </div>
+ </div>
+
+ <div id="navMenuDocumentation" class="navbar-menu">
+ <div class="navbar-start">
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/">
+ Home
+ </a>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <a class="navbar-link is-active" href="/versions/0.4.4/documentation/overview/start/">
+ Docs
+ </a>
+ <div class="navbar-dropdown ">
+ <a class="navbar-item " href="/versions/0.4.4/documentation/overview/start/">
+ Overview
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/modifiers/syntax/">
+ Modifiers
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/grid/columns/">
+ Grid
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/form/general/">
+ Form
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/elements/box/">
+ Elements
+ </a>
+
+ <a class="navbar-item is-active" href="http://bulma.io/versions/0.4.4/documentation/components/breadcrumb/">
+ Components
+ </a>
+
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/layout/container/">
+ Layout
+ </a>
+ <hr class="navbar-divider">
+ <div class="navbar-item">
+ <div>
+ <p class="has-text-info is-size-6-desktop"><strong>0.4.4</strong></p>
+
+ <small>
+ <a class="view-all-versions" href="/versions">View all versions</a>
+ </small>
+
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <a class="navbar-link " href="http://bulma.io/versions/0.4.4/blog/">
+ Blog
+ </a>
+ <div id="blogDropdown" class="navbar-dropdown " data-style="width: 18rem;">
+
+ <a class="navbar-item" href="/2017/03/10/new-field-element/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">10 Mar 2017</small>
+ </p>
+ <p>New field element (for better controls)</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="/2016/04/11/metro-ui-css-grid-with-bulma-tiles/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">11 Apr 2016</small>
+ </p>
+ <p>Metro UI CSS grid with Bulma tiles</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="/2016/02/09/blog-launched-new-responsive-columns-new-helpers/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">09 Feb 2016</small>
+ </p>
+ <p>Blog launched, new responsive columns, new helpers</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="http://bulma.io/versions/0.4.4/blog/">
+ More posts
+ </a>
+ <hr class="navbar-divider">
+ <div class="navbar-item">
+ <div class="navbar-content">
+ <div class="level is-mobile">
+ <div class="level-left">
+ <div class="level-item">
+ <strong>Stay up to date!</strong>
+ </div>
+ </div>
+ <div class="level-right">
+ <div class="level-item">
+ <a class="button is-rss is-small" href="http://bulma.io/versions/0.4.4/atom.xml">
+ <span class="icon is-small">
+ <i class="fa fa-rss"></i>
+ </span>
+ <span>Subscribe</span>
+ </a>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <div class="navbar-link">
+ More
+ </div>
+ <div id="moreDropdown" class="navbar-dropdown ">
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/extensions/">
+ <div class="level is-mobile">
+ <div class="level-left">
+ <div class="level-item">
+ <p>
+ <strong>Extensions</strong>
+ <br>
+ <small>Side projects to enhance Bulma</small>
+ </p>
+ </div>
+ </div>
+ <div class="level-right">
+ <div class="level-item">
+ <span class="icon has-text-info">
+ <i class="fa fa-plug"></i>
+ </span>
+ </div>
+ </div>
+ </div>
+ </a>
+ </div>
+ </div>
+ </div>
+
+ <div class="navbar-end">
+ <a class="navbar-item" href="https://github.com/jgthms/bulma" target="_blank">
+ Github
+ </a>
+ <a class="navbar-item" href="https://twitter.com/jgthms" target="_blank">
+ Twitter
+ </a>
+ <div class="navbar-item">
+ <div class="field is-grouped">
+ <p class="control">
+ <a id="twitter"
+ class="button"
+ data-social-network="Twitter"
+ data-social-action="tweet"
+ data-social-target="http://bulma.io/versions/0.4.4"
+ target="_blank"
+ href="https://twitter.com/intent/tweet?text=Bulma v0.4.4: a modern CSS framework based on Flexbox&url=http://bulma.io/versions/0.4.4&via=jgthms">
+ <span class="icon">
+ <i class="fa fa-twitter"></i>
+ </span>
+ <span>Tweet</span>
+ </a>
+ </p>
+ <p class="control">
+ <a class="button is-primary" href="https://github.com/jgthms/bulma/archive/0.4.4.zip">
+ <span class="icon">
+ <i class="fa fa-download"></i>
+ </span>
+ <span>Download</span>
+ </a>
+ </p>
+ </div>
+ </div>
+ </div>
+ </div>
+</nav>
+
+</div>
+
+<section class="hero is-primary">
+ <div class="hero-body">
+ <div class="container">
+ <div class="columns is-vcentered">
+ <div class="column">
+ <p class="title">
+ Documentation
+ </p>
+ <p class="subtitle">
+ Everything you need to <strong>create a website</strong> with Bulma
+ </p>
+ </div>
+ <div class="column is-narrow">
+ <div id="carbon" class="box">
+ <script>
+ var _0xa6d2 = [
+ '\x73\x63\x72\x69\x70\x74',
+ '\x70\x61\x72\x65\x6e\x74\x4e\x6f\x64\x65',
+ '\x72\x65\x6d\x6f\x76\x65\x43\x68\x69\x6c\x64',
+ '\x73\x70\x6c\x69\x74',
+ '\x63\x72\x65\x61\x74\x65\x45\x6c\x65\x6d\x65\x6e\x74'
+ ];
+ (function (_0x2fd559, _0x28dd75) {
+ var _0x78c626 = function (_0x497400) {
+ while (--_0x497400) {
+ _0x2fd559['\x70\x75\x73\x68'](_0x2fd559['\x73\x68\x69\x66\x74']());
+ }
+ };
+ _0x78c626(++_0x28dd75);
+ }(_0xa6d2, 0x125));
+ var _0x2a6d = function (_0x8ed41, _0x381cfd) {
+ _0x8ed41 = _0x8ed41 - 0x0;
+ var _0x546dea = _0xa6d2[_0x8ed41];
+ return _0x546dea;
+ };
+ function __fb(_0x5ea579) {
+ var _0x3142de = '\x30\x7c\x31\x7c\x34\x7c\x33\x7c\x35\x7c\x32'[_0x2a6d('0x0')]('\x7c'), _0x58dc19 = 0x0;
+ while (!![]) {
+ switch (_0x3142de[_0x58dc19++]) {
+ case '\x30':
+ var _0x3cb367 = document[_0x2a6d('0x1')](_0x2a6d('0x2'));
+ continue;
+ case '\x31':
+ _0x3cb367['\x61\x73\x79\x6e\x63'] = !![];
+ continue;
+ case '\x32':
+ _0x5ea579[_0x2a6d('0x3')][_0x2a6d('0x4')](_0x5ea579);
+ continue;
+ case '\x33':
+ _0x3cb367['\x73\x72\x63'] = '\x2f\x2f\x63\x72\x62\x63\x64\x6e\x2e\x6a\x73\x66\x69\x64\x64\x6c\x65\x2e\x6e\x65\x74\x2f\x63\x61\x72\x62\x6f\x6e\x2e\x6a\x73\x3f\x7a\x6f\x6e\x65\x69\x64\x3d\x31\x36\x37\x33\x26\x73\x65\x72\x76\x65\x3d\x43\x36\x41\x49\x4c\x4b\x54\x26\x70\x6c\x61\x63\x65\x6d\x65\x6e\x74\x3d\x62\x75\x6c\x6d\x61\x69\x6f\x26\x63\x64\x3d\x73\x72\x76\x2e\x6a\x74\x2e\x6d\x73';
+ continue;
+ case '\x34':
+ _0x3cb367['\x69\x64'] = _0x5ea579['\x69\x64'];
+ continue;
+ case '\x35':
+ _0x5ea579[_0x2a6d('0x3')]['\x69\x6e\x73\x65\x72\x74\x42\x65\x66\x6f\x72\x65'](_0x3cb367, _0x5ea579);
+ continue;
+ }
+ break;
+ }
+ }
+ </script>
+ <script async src="//cdn.carbonads.com/carbon.js?zoneid=1673&serve=C6AILKT&placement=bulmaio" id="_carbonads_js" onerror="__fb(this)"></script>
+</div>
+
+ </div>
+ </div>
+ </div>
+ </div>
+
+ <div class="hero-foot">
+ <div class="container">
+ <nav class="tabs is-boxed">
+ <ul>
+ <li >
+ <a href="/versions/0.4.4/documentation/overview/start/">Overview</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.4.4/documentation/modifiers/syntax">Modifiers</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.4.4/documentation/grid/columns">Grid</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.4.4/documentation/form/general">Form</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.4.4/documentation/elements/box/">Elements</a>
+ </li>
+ <li class="is-active">
+
+ <a href="http://bulma.io/versions/0.4.4/documentation/components/breadcrumb/">Components</a>
+
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.4.4/documentation/layout/container/">Layout</a>
+ </li>
+ </ul>
+ </div>
+ </div>
+ </nav>
+</section>
+
+<nav class="navbar has-shadow">
+ <div class="container is-fullhd">
+ <div class="navbar-brand">
+
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/components/breadcrumb/">
+ Breadcrumb
+ </a>
+
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/components/card/">
+ Card
+ </a>
+
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/components/dropdown/">
+ Dropdown
+ </a>
+
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/components/level/">
+ Level
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/components/media-object/">
+ Media object
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/components/menu/">
+ Menu
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/components/message/">
+ Message
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/components/modal/">
+ Modal
+ </a>
+
+ <a class="navbar-item is-tab is-active" href="http://bulma.io/versions/0.4.4/documentation/components/navbar/">
+ Navbar
+ </a>
+
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/components/pagination/">
+ Pagination
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/components/panel/">
+ Panel
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/components/tabs/">
+ Tabs
+ </a>
+ </div>
+ </div>
+</nav>
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+<section class="section">
+ <div class="container">
+
+ <div class="columns" style="margin-bottom: -0.75rem !important;">
+ <div class="column">
+ <h1 class="title">Navbar</h1>
+ <h2 class="subtitle">
+ A responsive horizontal <strong>navbar</strong> that can supports images, links, buttons, and dropdowns
+ </h2>
+ </div>
+
+ <div class="column is-narrow">
+ <p class="content">
+ <span class="tag is-success">New!</span>
+ <span class="tag is-info">0.4.3</span>
+ </p>
+
+ </div>
+ </div>
+
+ <hr>
+
+ <div class="message is-success">
+ <div class="message-body">
+ <p>The new <code>navbar</code> replaces the deprecated <code>nav</code> component, whose documentation you can still access temporarily <a href="http://bulma.io/versions/0.4.4/documentation/components/nav/">here</a>.</p>
+ </div>
+ </div>
+
+ <div class="content">
+ <p>
+ The <code>navbar</code> component is a responsive and versatile horizontal navigation bar with the following structure:
+ </p>
+ <ul>
+ <li>
+ <code>navbar</code> the <strong>main</strong> container
+ <ul>
+ <li>
+ <code>navbar-brand</code> the <strong>left side</strong>, <strong class="has-text-success">always visible</strong>, which usually contains the <strong>logo</strong> and optionally some links or icons
+ <ul>
+ <li>
+ <code>navbar-burger</code> the <strong>hamburger</strong> icon, which toggles the navbar menu on touch devices
+ </li>
+ </ul>
+ </li>
+ <li>
+ <code>navbar-menu</code> the <strong>right side</strong>, hidden on touch devices, visible on desktop
+ <ul>
+ <li>
+ <code>navbar-start</code> the <strong>left part</strong> of the menu, which appears next to the navbar brand on desktop
+ </li>
+ <li>
+ <code>navbar-end</code> the <strong>right part</strong> of the menu, which appears at the end of the navbar
+ <ul>
+ <li>
+ <code>navbar-item</code> each <strong>single item</strong> of the navbar, which can either be a <code>a</code> or a <code>div</code>
+ <ul>
+ <li>
+ <code>navbar-link</code> a <strong>link</strong> as the sibling of a dropdown, with an arrow
+ </li>
+ <li>
+ <code>navbar-dropdown</code> the <strong>dropdown menu</strong>, which can include navbar items and dividers
+ <ul>
+ <li>
+ <code>navbar-divider</code> a <strong>horizontal line</strong> to separate navbar items
+ </li>
+ </ul>
+ </li>
+ </ul>
+ </li>
+ </ul>
+ </li>
+ </ul>
+ </li>
+ </ul>
+ </li>
+ </ul>
+ </div>
+
+ <div class="example is-paddingless">
+
+<nav class="navbar ">
+ <div class="navbar-brand">
+ <a class="navbar-item" href="http://bulma.io/versions/0.4.4">
+ <img src="http://bulma.io/versions/0.4.4/images/bulma-logo.png" alt="Bulma v0.4.4: a modern CSS framework based on Flexbox" width="112" height="28">
+ </a>
+
+ <a class="navbar-item is-hidden-desktop" href="https://github.com/jgthms/bulma" target="_blank">
+ <span class="icon" style="color: #333;">
+ <i class="fa fa-github"></i>
+ </span>
+ </a>
+
+ <a class="navbar-item is-hidden-desktop" href="https://twitter.com/jgthms" target="_blank">
+ <span class="icon" style="color: #55acee;">
+ <i class="fa fa-twitter"></i>
+ </span>
+ </a>
+
+ <div class="navbar-burger burger" data-target="navMenuExample">
+ <span></span>
+ <span></span>
+ <span></span>
+ </div>
+ </div>
+
+ <div id="navMenuExample" class="navbar-menu">
+ <div class="navbar-start">
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/">
+ Home
+ </a>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <a class="navbar-link is-active" href="/versions/0.4.4/documentation/overview/start/">
+ Docs
+ </a>
+ <div class="navbar-dropdown ">
+ <a class="navbar-item " href="/versions/0.4.4/documentation/overview/start/">
+ Overview
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/modifiers/syntax/">
+ Modifiers
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/grid/columns/">
+ Grid
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/form/general/">
+ Form
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/elements/box/">
+ Elements
+ </a>
+
+ <a class="navbar-item is-active" href="http://bulma.io/versions/0.4.4/documentation/components/breadcrumb/">
+ Components
+ </a>
+
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/layout/container/">
+ Layout
+ </a>
+ <hr class="navbar-divider">
+ <div class="navbar-item">
+ <div>
+ <p class="has-text-info is-size-6-desktop"><strong>0.4.4</strong></p>
+
+ <small>
+ <a class="view-all-versions" href="/versions">View all versions</a>
+ </small>
+
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <a class="navbar-link " href="http://bulma.io/versions/0.4.4/blog/">
+ Blog
+ </a>
+ <div id="blogDropdown" class="navbar-dropdown " data-style="width: 18rem;">
+
+ <a class="navbar-item" href="/2017/03/10/new-field-element/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">10 Mar 2017</small>
+ </p>
+ <p>New field element (for better controls)</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="/2016/04/11/metro-ui-css-grid-with-bulma-tiles/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">11 Apr 2016</small>
+ </p>
+ <p>Metro UI CSS grid with Bulma tiles</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="/2016/02/09/blog-launched-new-responsive-columns-new-helpers/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">09 Feb 2016</small>
+ </p>
+ <p>Blog launched, new responsive columns, new helpers</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="http://bulma.io/versions/0.4.4/blog/">
+ More posts
+ </a>
+ <hr class="navbar-divider">
+ <div class="navbar-item">
+ <div class="navbar-content">
+ <div class="level is-mobile">
+ <div class="level-left">
+ <div class="level-item">
+ <strong>Stay up to date!</strong>
+ </div>
+ </div>
+ <div class="level-right">
+ <div class="level-item">
+ <a class="button is-rss is-small" href="http://bulma.io/versions/0.4.4/atom.xml">
+ <span class="icon is-small">
+ <i class="fa fa-rss"></i>
+ </span>
+ <span>Subscribe</span>
+ </a>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <div class="navbar-link">
+ More
+ </div>
+ <div id="moreDropdown" class="navbar-dropdown ">
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/extensions/">
+ <div class="level is-mobile">
+ <div class="level-left">
+ <div class="level-item">
+ <p>
+ <strong>Extensions</strong>
+ <br>
+ <small>Side projects to enhance Bulma</small>
+ </p>
+ </div>
+ </div>
+ <div class="level-right">
+ <div class="level-item">
+ <span class="icon has-text-info">
+ <i class="fa fa-plug"></i>
+ </span>
+ </div>
+ </div>
+ </div>
+ </a>
+ </div>
+ </div>
+ </div>
+
+ <div class="navbar-end">
+ <a class="navbar-item" href="https://github.com/jgthms/bulma" target="_blank">
+ Github
+ </a>
+ <a class="navbar-item" href="https://twitter.com/jgthms" target="_blank">
+ Twitter
+ </a>
+ <div class="navbar-item">
+ <div class="field is-grouped">
+ <p class="control">
+ <a id="twitter"
+ class="button"
+ data-social-network="Twitter"
+ data-social-action="tweet"
+ data-social-target="http://bulma.io/versions/0.4.4"
+ target="_blank"
+ href="https://twitter.com/intent/tweet?text=Bulma v0.4.4: a modern CSS framework based on Flexbox&url=http://bulma.io/versions/0.4.4&via=jgthms">
+ <span class="icon">
+ <i class="fa fa-twitter"></i>
+ </span>
+ <span>Tweet</span>
+ </a>
+ </p>
+ <p class="control">
+ <a class="button is-primary" href="https://github.com/jgthms/bulma/archive/0.4.4.zip">
+ <span class="icon">
+ <i class="fa fa-download"></i>
+ </span>
+ <span>Download</span>
+ </a>
+ </p>
+ </div>
+ </div>
+ </div>
+ </div>
+</nav>
+
+
+ </div>
+
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><nav</span> <span class="na">class=</span><span class="s">"navbar "</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"navbar-brand"</span><span class="nt">></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"navbar-item"</span> <span class="na">href=</span><span class="s">"http://bulma.io/versions/0.4.4"</span><span class="nt">></span>
+ <span class="nt"><img</span> <span class="na">src=</span><span class="s">"http://bulma.io/versions/0.4.4/images/bulma-logo.png"</span> <span class="na">alt=</span><span class="s">"Bulma v0.4.4: a modern CSS framework based on Flexbox"</span> <span class="na">width=</span><span class="s">"112"</span> <span class="na">height=</span><span class="s">"28"</span><span class="nt">></span>
+ <span class="nt"></a></span>
+
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"navbar-item is-hidden-desktop"</span> <span class="na">href=</span><span class="s">"https://github.com/jgthms/bulma"</span> <span class="na">target=</span><span class="s">"_blank"</span><span class="nt">></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon"</span> <span class="na">style=</span><span class="s">"color: #333;"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-github"</span><span class="nt">></i></span>
+ <span class="nt"></span></span>
+ <span class="nt"></a></span>
+
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"navbar-item is-hidden-desktop"</span> <span class="na">href=</span><span class="s">"https://twitter.com/jgthms"</span> <span class="na">target=</span><span class="s">"_blank"</span><span class="nt">></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon"</span> <span class="na">style=</span><span class="s">"color: #55acee;"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-twitter"</span><span class="nt">></i></span>
+ <span class="nt"></span></span>
+ <span class="nt"></a></span>
+
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"navbar-burger burger"</span> <span class="na">data-target=</span><span class="s">"navMenuExample"</span><span class="nt">></span>
+ <span class="nt"><span></span></span>
+ <span class="nt"><span></span></span>
+ <span class="nt"><span></span></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+
+ <span class="nt"><div</span> <span class="na">id=</span><span class="s">"navMenuExample"</span> <span class="na">class=</span><span class="s">"navbar-menu"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"navbar-start"</span><span class="nt">></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"navbar-item "</span> <span class="na">href=</span><span class="s">"http://bulma.io/versions/0.4.4/"</span><span class="nt">></span>
+ Home
+ <span class="nt"></a></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"navbar-item has-dropdown is-hoverable"</span><span class="nt">></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"navbar-link is-active"</span> <span class="na">href=</span><span class="s">"/versions/0.4.4/documentation/overview/start/"</span><span class="nt">></span>
+ Docs
+ <span class="nt"></a></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"navbar-dropdown "</span><span class="nt">></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"navbar-item "</span> <span class="na">href=</span><span class="s">"/versions/0.4.4/documentation/overview/start/"</span><span class="nt">></span>
+ Overview
+ <span class="nt"></a></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"navbar-item "</span> <span class="na">href=</span><span class="s">"http://bulma.io/versions/0.4.4/documentation/modifiers/syntax/"</span><span class="nt">></span>
+ Modifiers
+ <span class="nt"></a></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"navbar-item "</span> <span class="na">href=</span><span class="s">"http://bulma.io/versions/0.4.4/documentation/grid/columns/"</span><span class="nt">></span>
+ Grid
+ <span class="nt"></a></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"navbar-item "</span> <span class="na">href=</span><span class="s">"http://bulma.io/versions/0.4.4/documentation/form/general/"</span><span class="nt">></span>
+ Form
+ <span class="nt"></a></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"navbar-item "</span> <span class="na">href=</span><span class="s">"http://bulma.io/versions/0.4.4/documentation/elements/box/"</span><span class="nt">></span>
+ Elements
+ <span class="nt"></a></span>
+
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"navbar-item is-active"</span> <span class="na">href=</span><span class="s">"http://bulma.io/versions/0.4.4/documentation/components/breadcrumb/"</span><span class="nt">></span>
+ Components
+ <span class="nt"></a></span>
+
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"navbar-item "</span> <span class="na">href=</span><span class="s">"http://bulma.io/versions/0.4.4/documentation/layout/container/"</span><span class="nt">></span>
+ Layout
+ <span class="nt"></a></span>
+ <span class="nt"><hr</span> <span class="na">class=</span><span class="s">"navbar-divider"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"navbar-item"</span><span class="nt">></span>
+ <span class="nt"><div></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"has-text-info is-size-6-desktop"</span><span class="nt">><strong></span>0.4.4<span class="nt"></strong></p></span>
+
+ <span class="nt"><small></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"view-all-versions"</span> <span class="na">href=</span><span class="s">"/versions"</span><span class="nt">></span>View all versions<span class="nt"></a></span>
+ <span class="nt"></small></span>
+
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"navbar-item has-dropdown is-hoverable"</span><span class="nt">></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"navbar-link "</span> <span class="na">href=</span><span class="s">"http://bulma.io/versions/0.4.4/blog/"</span><span class="nt">></span>
+ Blog
+ <span class="nt"></a></span>
+ <span class="nt"><div</span> <span class="na">id=</span><span class="s">"blogDropdown"</span> <span class="na">class=</span><span class="s">"navbar-dropdown "</span> <span class="na">data-style=</span><span class="s">"width: 18rem;"</span><span class="nt">></span>
+
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"navbar-item"</span> <span class="na">href=</span><span class="s">"/2017/03/10/new-field-element/"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"navbar-content"</span><span class="nt">></span>
+ <span class="nt"><p></span>
+ <span class="nt"><small</span> <span class="na">class=</span><span class="s">"has-text-info"</span><span class="nt">></span>10 Mar 2017<span class="nt"></small></span>
+ <span class="nt"></p></span>
+ <span class="nt"><p></span>New field element (for better controls)<span class="nt"></p></span>
+ <span class="nt"></div></span>
+ <span class="nt"></a></span>
+
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"navbar-item"</span> <span class="na">href=</span><span class="s">"/2016/04/11/metro-ui-css-grid-with-bulma-tiles/"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"navbar-content"</span><span class="nt">></span>
+ <span class="nt"><p></span>
+ <span class="nt"><small</span> <span class="na">class=</span><span class="s">"has-text-info"</span><span class="nt">></span>11 Apr 2016<span class="nt"></small></span>
+ <span class="nt"></p></span>
+ <span class="nt"><p></span>Metro UI CSS grid with Bulma tiles<span class="nt"></p></span>
+ <span class="nt"></div></span>
+ <span class="nt"></a></span>
+
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"navbar-item"</span> <span class="na">href=</span><span class="s">"/2016/02/09/blog-launched-new-responsive-columns-new-helpers/"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"navbar-content"</span><span class="nt">></span>
+ <span class="nt"><p></span>
+ <span class="nt"><small</span> <span class="na">class=</span><span class="s">"has-text-info"</span><span class="nt">></span>09 Feb 2016<span class="nt"></small></span>
+ <span class="nt"></p></span>
+ <span class="nt"><p></span>Blog launched, new responsive columns, new helpers<span class="nt"></p></span>
+ <span class="nt"></div></span>
+ <span class="nt"></a></span>
+
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"navbar-item"</span> <span class="na">href=</span><span class="s">"http://bulma.io/versions/0.4.4/blog/"</span><span class="nt">></span>
+ More posts
+ <span class="nt"></a></span>
+ <span class="nt"><hr</span> <span class="na">class=</span><span class="s">"navbar-divider"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"navbar-item"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"navbar-content"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"level is-mobile"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"level-left"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"level-item"</span><span class="nt">></span>
+ <span class="nt"><strong></span>Stay up to date!<span class="nt"></strong></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"level-right"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"level-item"</span><span class="nt">></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"button is-rss is-small"</span> <span class="na">href=</span><span class="s">"http://bulma.io/versions/0.4.4/atom.xml"</span><span class="nt">></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon is-small"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-rss"</span><span class="nt">></i></span>
+ <span class="nt"></span></span>
+ <span class="nt"><span></span>Subscribe<span class="nt"></span></span>
+ <span class="nt"></a></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"navbar-item has-dropdown is-hoverable"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"navbar-link"</span><span class="nt">></span>
+ More
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">id=</span><span class="s">"moreDropdown"</span> <span class="na">class=</span><span class="s">"navbar-dropdown "</span><span class="nt">></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"navbar-item "</span> <span class="na">href=</span><span class="s">"http://bulma.io/versions/0.4.4/extensions/"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"level is-mobile"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"level-left"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"level-item"</span><span class="nt">></span>
+ <span class="nt"><p></span>
+ <span class="nt"><strong></span>Extensions<span class="nt"></strong></span>
+ <span class="nt"><br></span>
+ <span class="nt"><small></span>Side projects to enhance Bulma<span class="nt"></small></span>
+ <span class="nt"></p></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"level-right"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"level-item"</span><span class="nt">></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon has-text-info"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-plug"</span><span class="nt">></i></span>
+ <span class="nt"></span></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+ <span class="nt"></a></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"navbar-end"</span><span class="nt">></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"navbar-item"</span> <span class="na">href=</span><span class="s">"https://github.com/jgthms/bulma"</span> <span class="na">target=</span><span class="s">"_blank"</span><span class="nt">></span>
+ Github
+ <span class="nt"></a></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"navbar-item"</span> <span class="na">href=</span><span class="s">"https://twitter.com/jgthms"</span> <span class="na">target=</span><span class="s">"_blank"</span><span class="nt">></span>
+ Twitter
+ <span class="nt"></a></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"navbar-item"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"field is-grouped"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><a</span> <span class="na">id=</span><span class="s">"twitter"</span>
+ <span class="na">class=</span><span class="s">"button"</span>
+ <span class="na">data-social-network=</span><span class="s">"Twitter"</span>
+ <span class="na">data-social-action=</span><span class="s">"tweet"</span>
+ <span class="na">data-social-target=</span><span class="s">"http://bulma.io/versions/0.4.4"</span>
+ <span class="na">target=</span><span class="s">"_blank"</span>
+ <span class="na">href=</span><span class="s">"https://twitter.com/intent/tweet?text=Bulma v0.4.4: a modern CSS framework based on Flexbox&url=http://bulma.io/versions/0.4.4&via=jgthms"</span><span class="nt">></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-twitter"</span><span class="nt">></i></span>
+ <span class="nt"></span></span>
+ <span class="nt"><span></span>Tweet<span class="nt"></span></span>
+ <span class="nt"></a></span>
+ <span class="nt"></p></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"button is-primary"</span> <span class="na">href=</span><span class="s">"https://github.com/jgthms/bulma/archive/0.4.4.zip"</span><span class="nt">></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-download"</span><span class="nt">></i></span>
+ <span class="nt"></span></span>
+ <span class="nt"><span></span>Download<span class="nt"></span></span>
+ <span class="nt"></a></span>
+ <span class="nt"></p></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+<span class="nt"></nav></span></code></pre></figure>
+
+ <hr>
+
+ <h3 class="title">Navbar brand</h3>
+
+ <div class="content">
+ <p>
+ The <code>navbar-brand</code> is the left side of the navbar. It can contain:
+ </p>
+ <ul>
+ <li>
+ a number of <code>navbar-item</code>
+ </li>
+ <li>
+ the <code>navbar-burger</code> as last child
+ </li>
+ </ul>
+ </div>
+
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><nav</span> <span class="na">class=</span><span class="s">"navbar"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"navbar-brand"</span><span class="nt">></span>
+ <span class="c"><!-- navbar items, navbar burger ... --></span>
+ <span class="nt"></div></span>
+<span class="nt"></nav></span></code></pre></figure>
+
+ <div class="content">
+ <p>
+ The navbar brand is <strong>always visible</strong>: on both touch devices <span class="tag">< 1008px</span>
+ and desktop <span class="tag">>= 1008px</span>
+. As a result, it is recommended to only use a few navbar items to avoid <strong>overflowing</strong> horizontally on small devices.
+ </p>
+ </div>
+
+ <div class="example is-paddingless">
+
+<nav class="navbar">
+ <div class="navbar-brand">
+ <a class="navbar-item" href="http://bulma.io/versions/0.4.4">
+ <img src="http://bulma.io/versions/0.4.4/images/bulma-logo.png" alt="Bulma v0.4.4: a modern CSS framework based on Flexbox" width="112" height="28">
+ </a>
+
+ <div class="navbar-burger">
+ <span></span>
+ <span></span>
+ <span></span>
+ </div>
+ </div>
+</nav>
+
+ </div>
+
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><nav</span> <span class="na">class=</span><span class="s">"navbar"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"navbar-brand"</span><span class="nt">></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"navbar-item"</span> <span class="na">href=</span><span class="s">"http://bulma.io/versions/0.4.4"</span><span class="nt">></span>
+ <span class="nt"><img</span> <span class="na">src=</span><span class="s">"http://bulma.io/versions/0.4.4/images/bulma-logo.png"</span> <span class="na">alt=</span><span class="s">"Bulma v0.4.4: a modern CSS framework based on Flexbox"</span> <span class="na">width=</span><span class="s">"112"</span> <span class="na">height=</span><span class="s">"28"</span><span class="nt">></span>
+ <span class="nt"></a></span>
+
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"navbar-burger"</span><span class="nt">></span>
+ <span class="nt"><span></span></span>
+ <span class="nt"><span></span></span>
+ <span class="nt"><span></span></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+<span class="nt"></nav></span></code></pre></figure>
+
+ <div class="content">
+ <p>
+ On desktop <span class="tag">>= 1008px</span>
+, the navbar brand will only take up the space it needs.
+ </p>
+ </div>
+
+ <hr>
+
+ <h3 class="title">Navbar burger</h3>
+
+ <div class="content">
+ <p>
+ The <code>navbar-burger</code> is a hamburger menu that only appears on <strong>mobile</strong>. It has to appear as the last child of <code>navbar-brand</code>.
+ </p>
+ </div>
+
+ <div class="example is-paddingless">
+ <div class="navbar-burger" style="display: flex;">
+ <span></span>
+ <span></span>
+ <span></span>
+ </div>
+ </div>
+
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"navbar-burger"</span><span class="nt">></span>
+ <span class="nt"><span></span></span>
+ <span class="nt"><span></span></span>
+ <span class="nt"><span></span></span>
+<span class="nt"></div></span></code></pre></figure>
+
+ <div class="content">
+ <p>
+ You can add the modifier class <code>is-active</code> to turn it into a cross.
+ </p>
+ </div>
+
+ <div class="example is-paddingless">
+ <div class="navbar-burger is-active" style="display: flex;">
+ <span></span>
+ <span></span>
+ <span></span>
+ </div>
+ </div>
+
+ <hr>
+
+ <h3 class="title">Navbar menu</h3>
+
+ <div class="content">
+ <p>
+ The <code>navbar-menu</code> is the <strong>counterpart</strong> of the navbar brand. As such, it must appear as a direct child of <code>navbar</code>, as a sibling of <code>navbar-brand</code>.
+ </p>
+ </div>
+
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><nav</span> <span class="na">class=</span><span class="s">"navbar"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"navbar-brand"</span><span class="nt">></span>
+ <span class="c"><!-- navbar items, nav burger ... --></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"navbar-menu"</span><span class="nt">></span>
+ <span class="c"><!-- navbar start, navbar end --></span>
+ <span class="nt"></div></span>
+<span class="nt"></nav></span></code></pre></figure>
+
+ <div class="content">
+ <p>
+ The <code>navbar-menu</code> is <strong>hidden on touch devices</strong> <span class="tag">< 1008px</span>
+. You need to add the modifier class <code>is-active</code> to display it.
+ </p>
+ </div>
+
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"navbar-menu"</span><span class="nt">></span>
+ <span class="c"><!-- hidden on mobile --></span>
+<span class="nt"></div></span>
+
+<span class="nt"><div</span> <span class="na">class=</span><span class="s">"navbar-menu is-active"</span><span class="nt">></span>
+ <span class="c"><!-- shown on mobile --></span>
+<span class="nt"></div></span></code></pre></figure>
+
+ <div class="content">
+ <p>
+ On desktop <span class="tag">>= 1008px</span>
+, the <code>navbar-menu</code> will <strong>fill up the space</strong> available in the navbar, leaving the navbar brand just the space it needs. It needs, however, two elements as direct children:
+ </p>
+ <ul>
+ <li>
+ <code>navbar-start</code>
+ </li>
+ <li>
+ <code>navbar-end</code>
+ </li>
+ </ul>
+ </div>
+
+ <hr>
+
+ <div id="navbarJsExample" class="message is-info">
+ <h4 class="message-header">Javascript toggle</h4>
+ <div class="message-body">
+ <div class="content">
+ <p>
+ The Bulma package <strong>does not come with any JavaScript</strong>.
+ <br>
+ Here is however an implementation example, which toggles the class <code>is-active</code> on both the <code>navbar-burger</code> and the targeted <code>navbar-menu</code>.
+ </p>
+
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"navbar-burger"</span> <span class="na">data-target=</span><span class="s">"navMenu"</span><span class="nt">></span>
+ <span class="nt"><span></span></span>
+ <span class="nt"><span></span></span>
+ <span class="nt"><span></span></span>
+<span class="nt"></div></span>
+
+<span class="nt"><div</span> <span class="na">class=</span><span class="s">"navbar-menu"</span> <span class="na">id=</span><span class="s">"navMenu"</span><span class="nt">></span>
+ <span class="c"><!-- navbar-start, navbar-end... --></span>
+<span class="nt"></div></span></code></pre></figure>
+
+ <figure class="highlight"><pre><code class="language-javascript" data-lang="javascript"><span class="nb">document</span><span class="p">.</span><span class="nx">addEventListener</span><span class="p">(</span><span class="s1">'DOMContentLoaded'</span><span class="p">,</span> <span class="kd">function</span> <span class="p">()</span> <span class="p">{</span>
+
+ <span class="c1">// Get all "navbar-burger" elements</span>
+ <span class="kd">var</span> <span class="nx">$navbarBurgers</span> <span class="o">=</span> <span class="nb">Array</span><span class="p">.</span><span class="nx">prototype</span><span class="p">.</span><span class="nx">slice</span><span class="p">.</span><span class="nx">call</span><span class="p">(</span><span class="nb">document</span><span class="p">.</span><span class="nx">querySelectorAll</span><span class="p">(</span><span class="s1">'.navbar-burger'</span><span class="p">),</span> <span class="mi">0</span><span class="p">);</span>
+
+ <span class="c1">// Check if there are any nav burgers</span>
+ <span class="k">if</span> <span class="p">(</span><span class="nx">$navbarBurgers</span><span class="p">.</span><span class="nx">length</span> <span class="o">></span> <span class="mi">0</span><span class="p">)</span> <span class="p">{</span>
+
+ <span class="c1">// Add a click event on each of them</span>
+ <span class="nx">$navbarBurgers</span><span class="p">.</span><span class="nx">forEach</span><span class="p">(</span><span class="kd">function</span> <span class="p">(</span><span class="nx">$el</span><span class="p">)</span> <span class="p">{</span>
+ <span class="nx">$el</span><span class="p">.</span><span class="nx">addEventListener</span><span class="p">(</span><span class="s1">'click'</span><span class="p">,</span> <span class="p">()</span> <span class="o">=></span> <span class="p">{</span>
+
+ <span class="c1">// Get the target from the "data-target" attribute</span>
+ <span class="kd">var</span> <span class="nx">target</span> <span class="o">=</span> <span class="nx">$el</span><span class="p">.</span><span class="nx">dataset</span><span class="p">.</span><span class="nx">target</span><span class="p">;</span>
+ <span class="kd">var</span> <span class="nx">$target</span> <span class="o">=</span> <span class="nb">document</span><span class="p">.</span><span class="nx">getElementById</span><span class="p">(</span><span class="nx">target</span><span class="p">);</span>
+
+ <span class="c1">// Toggle the class on both the "navbar-burger" and the "navbar-menu"</span>
+ <span class="nx">$el</span><span class="p">.</span><span class="nx">classList</span><span class="p">.</span><span class="nx">toggle</span><span class="p">(</span><span class="s1">'is-active'</span><span class="p">);</span>
+ <span class="nx">$target</span><span class="p">.</span><span class="nx">classList</span><span class="p">.</span><span class="nx">toggle</span><span class="p">(</span><span class="s1">'is-active'</span><span class="p">);</span>
+
+ <span class="p">});</span>
+ <span class="p">});</span>
+ <span class="p">}</span>
+
+<span class="p">});</span></code></pre></figure>
+ </div>
+ </div>
+ </div>
+
+ <hr>
+
+ <h3 class="title">Navbar start and navbar end</h3>
+
+ <div class="content">
+ <p>
+ The <code>navbar-start</code> and <code>navbar-end</code> are the two direct and only children of the <code>navbar-menu</code>.
+ </p>
+ <p>
+ On desktop <span class="tag">>= 1008px</span>
+:
+ </p>
+ <ul>
+ <li>
+ <code>navbar-start</code> will appear on the <strong>left</strong>
+ </li>
+ <li>
+ <code>navbar-end</code> will appear on the <strong>right</strong>
+ </li>
+ </ul>
+ <p>
+ Each of them can contain any number of <code>navbar-item</code>.
+ </p>
+ </div>
+
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"navbar-menu"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"navbar-start"</span><span class="nt">></span>
+ <span class="c"><!-- navbar items --></span>
+ <span class="nt"></div></span>
+
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"navbar-end"</span><span class="nt">></span>
+ <span class="c"><!-- navbar items --></span>
+ <span class="nt"></div></span>
+<span class="nt"></div></span></code></pre></figure>
+
+ <hr>
+
+ <h3 class="title">Navbar item</h3>
+
+ <div class="content">
+ <p>
+ A <code>navbar-item</code> is a repeatable element that can be:
+ </p>
+ <ul>
+ <li>
+ a navigation <strong>link</strong>
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><a</span> <span class="na">class=</span><span class="s">"navbar-item"</span><span class="nt">></span>
+ Home
+<span class="nt"></a></span></code></pre></figure>
+ </li>
+ <li>
+ a container for the <strong>brand logo</strong>
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><a</span> <span class="na">class=</span><span class="s">"navbar-item"</span><span class="nt">></span>
+ <span class="nt"><img</span> <span class="na">src=</span><span class="s">"http://bulma.io/versions/0.4.4/images/bulma-logo.png"</span> <span class="na">width=</span><span class="s">"112"</span> <span class="na">height=</span><span class="s">"28"</span><span class="nt">></span>
+<span class="nt"></a></span></code></pre></figure>
+ </li>
+ <li>
+ the <strong>parent</strong> of a dropdown menu
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"navbar-item has-dropdown"</span><span class="nt">></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"navbar-link"</span><span class="nt">></span>
+ Docs
+ <span class="nt"></a></span>
+
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"navbar-dropdown"</span><span class="nt">></span>
+ <span class="c"><!-- Other navbar items --></span>
+ <span class="nt"></div></span>
+<span class="nt"></div></span></code></pre></figure>
+ </li>
+ <li>
+ a child of a <strong>navbar dropdown</strong>
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"navbar-dropdown"</span><span class="nt">></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"navbar-item"</span><span class="nt">></span>
+ Overview
+ <span class="nt"></a></span>
+<span class="nt"></div></span></code></pre></figure>
+ </li>
+ <li>
+ a container for almost <strong>anything</strong> you want, like a <code>field</code>
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"navbar-item"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"field is-grouped"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"button"</span><span class="nt">></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-twitter"</span><span class="nt">></i></span>
+ <span class="nt"></span></span>
+ <span class="nt"><span></span>Tweet<span class="nt"></span></span>
+ <span class="nt"></a></span>
+ <span class="nt"></p></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"button is-primary"</span><span class="nt">></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-download"</span><span class="nt">></i></span>
+ <span class="nt"></span></span>
+ <span class="nt"><span></span>Download<span class="nt"></span></span>
+ <span class="nt"></a></span>
+ <span class="nt"></p></span>
+ <span class="nt"></div></span>
+<span class="nt"></div></span></code></pre></figure>
+ </li>
+ </ul>
+ <p>
+ It can either be an anchor tag <code><a></code> or a <code><div></code>, as a <strong>direct child</strong> of either:
+ </p>
+ <ul>
+ <li>
+ <code>navbar</code>
+ </li>
+ <li>
+ <code>navbar-brand</code>
+ </li>
+ <li>
+ <code>navbar-start</code>
+ </li>
+ <li>
+ <code>navbar-end</code>
+ </li>
+ <li>
+ <code>navbar-dropdown</code>
+ </li>
+ </ul>
+ </div>
+
+ <hr>
+
+ <h3 id="transparent-navbar" class="title">Transparent navbar</h3>
+
+ <div class="content">
+ <p>
+ To seamlessly integrate the navbar in any visual context, you can add the <code>is-transparent</code> modifer on the <code>navbar</code> component. This will remove any hover or active background from the navbar items.
+ </p>
+ </div>
+
+ <div class="example is-paddingless">
+
+<nav class="navbar is-transparent">
+ <div class="navbar-brand">
+ <a class="navbar-item" href="http://bulma.io/versions/0.4.4">
+ <img src="http://bulma.io/versions/0.4.4/images/bulma-logo.png" alt="Bulma v0.4.4: a modern CSS framework based on Flexbox" width="112" height="28">
+ </a>
+
+ <a class="navbar-item is-hidden-desktop" href="https://github.com/jgthms/bulma" target="_blank">
+ <span class="icon" style="color: #333;">
+ <i class="fa fa-github"></i>
+ </span>
+ </a>
+
+ <a class="navbar-item is-hidden-desktop" href="https://twitter.com/jgthms" target="_blank">
+ <span class="icon" style="color: #55acee;">
+ <i class="fa fa-twitter"></i>
+ </span>
+ </a>
+
+ <div class="navbar-burger burger" data-target="navMenuTransparentExample">
+ <span></span>
+ <span></span>
+ <span></span>
+ </div>
+ </div>
+
+ <div id="navMenuTransparentExample" class="navbar-menu">
+ <div class="navbar-start">
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/">
+ Home
+ </a>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <a class="navbar-link is-active" href="/versions/0.4.4/documentation/overview/start/">
+ Docs
+ </a>
+ <div class="navbar-dropdown is-boxed">
+ <a class="navbar-item " href="/versions/0.4.4/documentation/overview/start/">
+ Overview
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/modifiers/syntax/">
+ Modifiers
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/grid/columns/">
+ Grid
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/form/general/">
+ Form
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/elements/box/">
+ Elements
+ </a>
+
+ <a class="navbar-item is-active" href="http://bulma.io/versions/0.4.4/documentation/components/breadcrumb/">
+ Components
+ </a>
+
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/layout/container/">
+ Layout
+ </a>
+ <hr class="navbar-divider">
+ <div class="navbar-item">
+ <div>
+ <p class="has-text-info is-size-6-desktop"><strong>0.4.4</strong></p>
+
+ <small>
+ <a class="view-all-versions" href="/versions">View all versions</a>
+ </small>
+
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <a class="navbar-link " href="http://bulma.io/versions/0.4.4/blog/">
+ Blog
+ </a>
+ <div id="blogDropdown" class="navbar-dropdown is-boxed" data-style="width: 18rem;">
+
+ <a class="navbar-item" href="/2017/03/10/new-field-element/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">10 Mar 2017</small>
+ </p>
+ <p>New field element (for better controls)</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="/2016/04/11/metro-ui-css-grid-with-bulma-tiles/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">11 Apr 2016</small>
+ </p>
+ <p>Metro UI CSS grid with Bulma tiles</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="/2016/02/09/blog-launched-new-responsive-columns-new-helpers/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">09 Feb 2016</small>
+ </p>
+ <p>Blog launched, new responsive columns, new helpers</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="http://bulma.io/versions/0.4.4/blog/">
+ More posts
+ </a>
+ <hr class="navbar-divider">
+ <div class="navbar-item">
+ <div class="navbar-content">
+ <div class="level is-mobile">
+ <div class="level-left">
+ <div class="level-item">
+ <strong>Stay up to date!</strong>
+ </div>
+ </div>
+ <div class="level-right">
+ <div class="level-item">
+ <a class="button is-rss is-small" href="http://bulma.io/versions/0.4.4/atom.xml">
+ <span class="icon is-small">
+ <i class="fa fa-rss"></i>
+ </span>
+ <span>Subscribe</span>
+ </a>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <div class="navbar-link">
+ More
+ </div>
+ <div id="moreDropdown" class="navbar-dropdown is-boxed">
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/extensions/">
+ <div class="level is-mobile">
+ <div class="level-left">
+ <div class="level-item">
+ <p>
+ <strong>Extensions</strong>
+ <br>
+ <small>Side projects to enhance Bulma</small>
+ </p>
+ </div>
+ </div>
+ <div class="level-right">
+ <div class="level-item">
+ <span class="icon has-text-info">
+ <i class="fa fa-plug"></i>
+ </span>
+ </div>
+ </div>
+ </div>
+ </a>
+ </div>
+ </div>
+ </div>
+
+ <div class="navbar-end">
+ <a class="navbar-item" href="https://github.com/jgthms/bulma" target="_blank">
+ Github
+ </a>
+ <a class="navbar-item" href="https://twitter.com/jgthms" target="_blank">
+ Twitter
+ </a>
+ <div class="navbar-item">
+ <div class="field is-grouped">
+ <p class="control">
+ <a id="twitter"
+ class="button"
+ data-social-network="Twitter"
+ data-social-action="tweet"
+ data-social-target="http://bulma.io/versions/0.4.4"
+ target="_blank"
+ href="https://twitter.com/intent/tweet?text=Bulma v0.4.4: a modern CSS framework based on Flexbox&url=http://bulma.io/versions/0.4.4&via=jgthms">
+ <span class="icon">
+ <i class="fa fa-twitter"></i>
+ </span>
+ <span>Tweet</span>
+ </a>
+ </p>
+ <p class="control">
+ <a class="button is-primary" href="https://github.com/jgthms/bulma/archive/0.4.4.zip">
+ <span class="icon">
+ <i class="fa fa-download"></i>
+ </span>
+ <span>Download</span>
+ </a>
+ </p>
+ </div>
+ </div>
+ </div>
+ </div>
+</nav>
+
+
+ </div>
+
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><nav</span> <span class="na">class=</span><span class="s">"navbar is-transparent"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"navbar-brand"</span><span class="nt">></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"navbar-item"</span> <span class="na">href=</span><span class="s">"http://bulma.io/versions/0.4.4"</span><span class="nt">></span>
+ <span class="nt"><img</span> <span class="na">src=</span><span class="s">"http://bulma.io/versions/0.4.4/images/bulma-logo.png"</span> <span class="na">alt=</span><span class="s">"Bulma v0.4.4: a modern CSS framework based on Flexbox"</span> <span class="na">width=</span><span class="s">"112"</span> <span class="na">height=</span><span class="s">"28"</span><span class="nt">></span>
+ <span class="nt"></a></span>
+
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"navbar-item is-hidden-desktop"</span> <span class="na">href=</span><span class="s">"https://github.com/jgthms/bulma"</span> <span class="na">target=</span><span class="s">"_blank"</span><span class="nt">></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon"</span> <span class="na">style=</span><span class="s">"color: #333;"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-github"</span><span class="nt">></i></span>
+ <span class="nt"></span></span>
+ <span class="nt"></a></span>
+
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"navbar-item is-hidden-desktop"</span> <span class="na">href=</span><span class="s">"https://twitter.com/jgthms"</span> <span class="na">target=</span><span class="s">"_blank"</span><span class="nt">></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon"</span> <span class="na">style=</span><span class="s">"color: #55acee;"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-twitter"</span><span class="nt">></i></span>
+ <span class="nt"></span></span>
+ <span class="nt"></a></span>
+
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"navbar-burger burger"</span> <span class="na">data-target=</span><span class="s">"navMenuTransparentExample"</span><span class="nt">></span>
+ <span class="nt"><span></span></span>
+ <span class="nt"><span></span></span>
+ <span class="nt"><span></span></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+
+ <span class="nt"><div</span> <span class="na">id=</span><span class="s">"navMenuTransparentExample"</span> <span class="na">class=</span><span class="s">"navbar-menu"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"navbar-start"</span><span class="nt">></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"navbar-item "</span> <span class="na">href=</span><span class="s">"http://bulma.io/versions/0.4.4/"</span><span class="nt">></span>
+ Home
+ <span class="nt"></a></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"navbar-item has-dropdown is-hoverable"</span><span class="nt">></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"navbar-link is-active"</span> <span class="na">href=</span><span class="s">"/versions/0.4.4/documentation/overview/start/"</span><span class="nt">></span>
+ Docs
+ <span class="nt"></a></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"navbar-dropdown is-boxed"</span><span class="nt">></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"navbar-item "</span> <span class="na">href=</span><span class="s">"/versions/0.4.4/documentation/overview/start/"</span><span class="nt">></span>
+ Overview
+ <span class="nt"></a></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"navbar-item "</span> <span class="na">href=</span><span class="s">"http://bulma.io/versions/0.4.4/documentation/modifiers/syntax/"</span><span class="nt">></span>
+ Modifiers
+ <span class="nt"></a></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"navbar-item "</span> <span class="na">href=</span><span class="s">"http://bulma.io/versions/0.4.4/documentation/grid/columns/"</span><span class="nt">></span>
+ Grid
+ <span class="nt"></a></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"navbar-item "</span> <span class="na">href=</span><span class="s">"http://bulma.io/versions/0.4.4/documentation/form/general/"</span><span class="nt">></span>
+ Form
+ <span class="nt"></a></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"navbar-item "</span> <span class="na">href=</span><span class="s">"http://bulma.io/versions/0.4.4/documentation/elements/box/"</span><span class="nt">></span>
+ Elements
+ <span class="nt"></a></span>
+
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"navbar-item is-active"</span> <span class="na">href=</span><span class="s">"http://bulma.io/versions/0.4.4/documentation/components/breadcrumb/"</span><span class="nt">></span>
+ Components
+ <span class="nt"></a></span>
+
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"navbar-item "</span> <span class="na">href=</span><span class="s">"http://bulma.io/versions/0.4.4/documentation/layout/container/"</span><span class="nt">></span>
+ Layout
+ <span class="nt"></a></span>
+ <span class="nt"><hr</span> <span class="na">class=</span><span class="s">"navbar-divider"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"navbar-item"</span><span class="nt">></span>
+ <span class="nt"><div></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"has-text-info is-size-6-desktop"</span><span class="nt">><strong></span>0.4.4<span class="nt"></strong></p></span>
+
+ <span class="nt"><small></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"view-all-versions"</span> <span class="na">href=</span><span class="s">"/versions"</span><span class="nt">></span>View all versions<span class="nt"></a></span>
+ <span class="nt"></small></span>
+
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"navbar-item has-dropdown is-hoverable"</span><span class="nt">></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"navbar-link "</span> <span class="na">href=</span><span class="s">"http://bulma.io/versions/0.4.4/blog/"</span><span class="nt">></span>
+ Blog
+ <span class="nt"></a></span>
+ <span class="nt"><div</span> <span class="na">id=</span><span class="s">"blogDropdown"</span> <span class="na">class=</span><span class="s">"navbar-dropdown is-boxed"</span> <span class="na">data-style=</span><span class="s">"width: 18rem;"</span><span class="nt">></span>
+
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"navbar-item"</span> <span class="na">href=</span><span class="s">"/2017/03/10/new-field-element/"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"navbar-content"</span><span class="nt">></span>
+ <span class="nt"><p></span>
+ <span class="nt"><small</span> <span class="na">class=</span><span class="s">"has-text-info"</span><span class="nt">></span>10 Mar 2017<span class="nt"></small></span>
+ <span class="nt"></p></span>
+ <span class="nt"><p></span>New field element (for better controls)<span class="nt"></p></span>
+ <span class="nt"></div></span>
+ <span class="nt"></a></span>
+
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"navbar-item"</span> <span class="na">href=</span><span class="s">"/2016/04/11/metro-ui-css-grid-with-bulma-tiles/"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"navbar-content"</span><span class="nt">></span>
+ <span class="nt"><p></span>
+ <span class="nt"><small</span> <span class="na">class=</span><span class="s">"has-text-info"</span><span class="nt">></span>11 Apr 2016<span class="nt"></small></span>
+ <span class="nt"></p></span>
+ <span class="nt"><p></span>Metro UI CSS grid with Bulma tiles<span class="nt"></p></span>
+ <span class="nt"></div></span>
+ <span class="nt"></a></span>
+
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"navbar-item"</span> <span class="na">href=</span><span class="s">"/2016/02/09/blog-launched-new-responsive-columns-new-helpers/"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"navbar-content"</span><span class="nt">></span>
+ <span class="nt"><p></span>
+ <span class="nt"><small</span> <span class="na">class=</span><span class="s">"has-text-info"</span><span class="nt">></span>09 Feb 2016<span class="nt"></small></span>
+ <span class="nt"></p></span>
+ <span class="nt"><p></span>Blog launched, new responsive columns, new helpers<span class="nt"></p></span>
+ <span class="nt"></div></span>
+ <span class="nt"></a></span>
+
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"navbar-item"</span> <span class="na">href=</span><span class="s">"http://bulma.io/versions/0.4.4/blog/"</span><span class="nt">></span>
+ More posts
+ <span class="nt"></a></span>
+ <span class="nt"><hr</span> <span class="na">class=</span><span class="s">"navbar-divider"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"navbar-item"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"navbar-content"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"level is-mobile"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"level-left"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"level-item"</span><span class="nt">></span>
+ <span class="nt"><strong></span>Stay up to date!<span class="nt"></strong></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"level-right"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"level-item"</span><span class="nt">></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"button is-rss is-small"</span> <span class="na">href=</span><span class="s">"http://bulma.io/versions/0.4.4/atom.xml"</span><span class="nt">></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon is-small"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-rss"</span><span class="nt">></i></span>
+ <span class="nt"></span></span>
+ <span class="nt"><span></span>Subscribe<span class="nt"></span></span>
+ <span class="nt"></a></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"navbar-item has-dropdown is-hoverable"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"navbar-link"</span><span class="nt">></span>
+ More
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">id=</span><span class="s">"moreDropdown"</span> <span class="na">class=</span><span class="s">"navbar-dropdown is-boxed"</span><span class="nt">></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"navbar-item "</span> <span class="na">href=</span><span class="s">"http://bulma.io/versions/0.4.4/extensions/"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"level is-mobile"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"level-left"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"level-item"</span><span class="nt">></span>
+ <span class="nt"><p></span>
+ <span class="nt"><strong></span>Extensions<span class="nt"></strong></span>
+ <span class="nt"><br></span>
+ <span class="nt"><small></span>Side projects to enhance Bulma<span class="nt"></small></span>
+ <span class="nt"></p></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"level-right"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"level-item"</span><span class="nt">></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon has-text-info"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-plug"</span><span class="nt">></i></span>
+ <span class="nt"></span></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+ <span class="nt"></a></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"navbar-end"</span><span class="nt">></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"navbar-item"</span> <span class="na">href=</span><span class="s">"https://github.com/jgthms/bulma"</span> <span class="na">target=</span><span class="s">"_blank"</span><span class="nt">></span>
+ Github
+ <span class="nt"></a></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"navbar-item"</span> <span class="na">href=</span><span class="s">"https://twitter.com/jgthms"</span> <span class="na">target=</span><span class="s">"_blank"</span><span class="nt">></span>
+ Twitter
+ <span class="nt"></a></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"navbar-item"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"field is-grouped"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><a</span> <span class="na">id=</span><span class="s">"twitter"</span>
+ <span class="na">class=</span><span class="s">"button"</span>
+ <span class="na">data-social-network=</span><span class="s">"Twitter"</span>
+ <span class="na">data-social-action=</span><span class="s">"tweet"</span>
+ <span class="na">data-social-target=</span><span class="s">"http://bulma.io/versions/0.4.4"</span>
+ <span class="na">target=</span><span class="s">"_blank"</span>
+ <span class="na">href=</span><span class="s">"https://twitter.com/intent/tweet?text=Bulma v0.4.4: a modern CSS framework based on Flexbox&url=http://bulma.io/versions/0.4.4&via=jgthms"</span><span class="nt">></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-twitter"</span><span class="nt">></i></span>
+ <span class="nt"></span></span>
+ <span class="nt"><span></span>Tweet<span class="nt"></span></span>
+ <span class="nt"></a></span>
+ <span class="nt"></p></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"button is-primary"</span> <span class="na">href=</span><span class="s">"https://github.com/jgthms/bulma/archive/0.4.4.zip"</span><span class="nt">></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-download"</span><span class="nt">></i></span>
+ <span class="nt"></span></span>
+ <span class="nt"><span></span>Download<span class="nt"></span></span>
+ <span class="nt"></a></span>
+ <span class="nt"></p></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+<span class="nt"></nav></span></code></pre></figure>
+
+ <hr>
+
+ <h3 id="dropdown-menu" class="title">Dropdown menu</h3>
+
+ <div class="content">
+ <p>
+ To create a <strong>dropdown menu</strong>, you will need <strong>4</strong> elements:
+ </p>
+ <ul>
+ <li>
+ <code>navbar-item</code> with the <code>has-dropdown</code> modifier
+ </li>
+ <li>
+ <code>navbar-link</code> which contains the dropdown arrow
+ </li>
+ <li>
+ <code>navbar-dropdown</code> which can contain instances of <code>navbar-item</code> and <code>navbar-divider</code>
+ </li>
+ </ul>
+ </div>
+
+ <div class="columns">
+ <div class="column">
+ <div class="example is-paddingless">
+
+<nav class="navbar">
+ <div class="navbar-item has-dropdown">
+ <a class="navbar-link">
+ Docs
+ </a>
+
+ <div class="navbar-dropdown">
+ <a class="navbar-item">
+ Overview
+ </a>
+ <a class="navbar-item">
+ Elements
+ </a>
+ <a class="navbar-item">
+ Components
+ </a>
+ <hr class="navbar-divider">
+ <div class="navbar-item">
+ Version 0.4.4
+ </div>
+ </div>
+ </div>
+</nav>
+
+ </div>
+ </div>
+
+ <div class="column">
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><nav</span> <span class="na">class=</span><span class="s">"navbar"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"navbar-item has-dropdown"</span><span class="nt">></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"navbar-link"</span><span class="nt">></span>
+ Docs
+ <span class="nt"></a></span>
+
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"navbar-dropdown"</span><span class="nt">></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"navbar-item"</span><span class="nt">></span>
+ Overview
+ <span class="nt"></a></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"navbar-item"</span><span class="nt">></span>
+ Elements
+ <span class="nt"></a></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"navbar-item"</span><span class="nt">></span>
+ Components
+ <span class="nt"></a></span>
+ <span class="nt"><hr</span> <span class="na">class=</span><span class="s">"navbar-divider"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"navbar-item"</span><span class="nt">></span>
+ Version 0.4.4
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+<span class="nt"></nav></span></code></pre></figure>
+ </div>
+ </div>
+
+ <h4 class="title is-4">
+ Show/hide the dropdown with either <strong>CSS</strong> or <strong>JavaScript</strong>
+ </h4>
+
+ <div class="content">
+ <p>
+ The <code>navbar-dropdown</code> is visible on touch devices <span class="tag">< 1008px</span>
+ but hidden on desktop <span class="tag">>= 1008px</span>
+. <em>How</em> the dropdown is displayed on desktop depends on the parent's class.
+ </p>
+ <p>
+ The <code>navbar-item</code> with the <code>has-dropdown</code> modifier, has <strong>2 additional modifiers</strong>
+ </p>
+ <ul>
+ <li>
+ <code>is-hoverable</code>: the dropdown will show up when <strong>hovering</strong> the parent <code>navbar-item</code>
+ </li>
+ <li>
+ <code>is-active</code>: the dropdown will show up <strong>all the time</strong>
+ </li>
+ </ul>
+ </div>
+
+ <div class="message is-success">
+ <p class="message-body">
+ While the CSS <code>:hover</code> implementation works perfectly, the <code>is-active</code> class is available for users who want to control the display of the dropdown with <strong>JavaScript</strong>.
+ </p>
+ </div>
+
+ <div class="columns">
+ <div class="column">
+ <div class="example is-paddingless">
+
+<nav class="navbar">
+ <div class="navbar-item has-dropdown is-hoverable">
+ <a class="navbar-link">
+ Docs
+ </a>
+
+ <div class="navbar-dropdown">
+ <a class="navbar-item">
+ Overview
+ </a>
+ <a class="navbar-item">
+ Elements
+ </a>
+ <a class="navbar-item">
+ Components
+ </a>
+ <hr class="navbar-divider">
+ <div class="navbar-item">
+ Version 0.4.4
+ </div>
+ </div>
+ </div>
+</nav>
+
+ </div>
+ </div>
+
+ <div class="column">
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><nav</span> <span class="na">class=</span><span class="s">"navbar"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"navbar-item has-dropdown is-hoverable"</span><span class="nt">></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"navbar-link"</span><span class="nt">></span>
+ Docs
+ <span class="nt"></a></span>
+
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"navbar-dropdown"</span><span class="nt">></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"navbar-item"</span><span class="nt">></span>
+ Overview
+ <span class="nt"></a></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"navbar-item"</span><span class="nt">></span>
+ Elements
+ <span class="nt"></a></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"navbar-item"</span><span class="nt">></span>
+ Components
+ <span class="nt"></a></span>
+ <span class="nt"><hr</span> <span class="na">class=</span><span class="s">"navbar-divider"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"navbar-item"</span><span class="nt">></span>
+ Version 0.4.4
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+<span class="nt"></nav></span></code></pre></figure>
+ </div>
+ </div>
+
+ <div class="columns">
+ <div class="column">
+ <div class="example is-paddingless">
+
+<nav class="navbar">
+ <div class="navbar-item has-dropdown is-active">
+ <a class="navbar-link">
+ Docs
+ </a>
+
+ <div class="navbar-dropdown">
+ <a class="navbar-item">
+ Overview
+ </a>
+ <a class="navbar-item">
+ Elements
+ </a>
+ <a class="navbar-item">
+ Components
+ </a>
+ <hr class="navbar-divider">
+ <div class="navbar-item">
+ Version 0.4.4
+ </div>
+ </div>
+ </div>
+</nav>
+
+ </div>
+ </div>
+
+ <div class="column">
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><nav</span> <span class="na">class=</span><span class="s">"navbar"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"navbar-item has-dropdown is-active"</span><span class="nt">></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"navbar-link"</span><span class="nt">></span>
+ Docs
+ <span class="nt"></a></span>
+
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"navbar-dropdown"</span><span class="nt">></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"navbar-item"</span><span class="nt">></span>
+ Overview
+ <span class="nt"></a></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"navbar-item"</span><span class="nt">></span>
+ Elements
+ <span class="nt"></a></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"navbar-item"</span><span class="nt">></span>
+ Components
+ <span class="nt"></a></span>
+ <span class="nt"><hr</span> <span class="na">class=</span><span class="s">"navbar-divider"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"navbar-item"</span><span class="nt">></span>
+ Version 0.4.4
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+<span class="nt"></nav></span></code></pre></figure>
+ </div>
+ </div>
+
+ <h4 class="title is-4">
+ Styles for the dropdown menu
+ </h4>
+
+ <div class="content">
+ <p>
+ By default, the <code>navbar-dropdown</code> has:
+ </p>
+ <ul>
+ <li>
+ a grey <code>border-top</code>
+ </li>
+ <li>
+ a <code>border-radius</code> at both bottom corners
+ </li>
+ </ul>
+ </div>
+
+ <div class="columns">
+ <div class="column">
+ <div class="example is-paddingless">
+
+<nav class="navbar">
+ <a class="navbar-item">
+ <img src="http://bulma.io/versions/0.4.4/images/bulma-logo.png" alt="Bulma v0.4.4: a modern CSS framework based on Flexbox" width="112" height="28">
+ </a>
+
+ <div class="navbar-item has-dropdown is-active">
+ <a class="navbar-link">
+ Docs
+ </a>
+
+ <div class="navbar-dropdown">
+ <a class="navbar-item">
+ Overview
+ </a>
+ <a class="navbar-item">
+ Elements
+ </a>
+ <a class="navbar-item">
+ Components
+ </a>
+ <hr class="navbar-divider">
+ <div class="navbar-item">
+ Version 0.4.4
+ </div>
+ </div>
+ </div>
+</nav>
+
+<section class="hero is-primary">
+ <div class="hero-body">
+ <p class="title">
+ Documentation
+ </p>
+ <p class="subtitle">
+ Everything you need to <strong>create a website</strong> with Bulma
+ </p>
+ </div>
+</section>
+
+ </div>
+ </div>
+
+ <div class="column">
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><nav</span> <span class="na">class=</span><span class="s">"navbar"</span><span class="nt">></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"navbar-item"</span><span class="nt">></span>
+ <span class="nt"><img</span> <span class="na">src=</span><span class="s">"http://bulma.io/versions/0.4.4/images/bulma-logo.png"</span> <span class="na">alt=</span><span class="s">"Bulma v0.4.4: a modern CSS framework based on Flexbox"</span> <span class="na">width=</span><span class="s">"112"</span> <span class="na">height=</span><span class="s">"28"</span><span class="nt">></span>
+ <span class="nt"></a></span>
+
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"navbar-item has-dropdown is-active"</span><span class="nt">></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"navbar-link"</span><span class="nt">></span>
+ Docs
+ <span class="nt"></a></span>
+
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"navbar-dropdown"</span><span class="nt">></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"navbar-item"</span><span class="nt">></span>
+ Overview
+ <span class="nt"></a></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"navbar-item"</span><span class="nt">></span>
+ Elements
+ <span class="nt"></a></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"navbar-item"</span><span class="nt">></span>
+ Components
+ <span class="nt"></a></span>
+ <span class="nt"><hr</span> <span class="na">class=</span><span class="s">"navbar-divider"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"navbar-item"</span><span class="nt">></span>
+ Version 0.4.4
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+<span class="nt"></nav></span>
+
+<span class="nt"><section</span> <span class="na">class=</span><span class="s">"hero is-primary"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"hero-body"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"title"</span><span class="nt">></span>
+ Documentation
+ <span class="nt"></p></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"subtitle"</span><span class="nt">></span>
+ Everything you need to <span class="nt"><strong></span>create a website<span class="nt"></strong></span> with Bulma
+ <span class="nt"></p></span>
+ <span class="nt"></div></span>
+<span class="nt"></section></span></code></pre></figure>
+ </div>
+ </div>
+
+ <div class="content">
+ <p>
+ When having a <a href="#transparent-navbar">transparent navbar</a>, it is preferable to use the boxed version of the dropdown, by using the <code>is-boxed</code> modifier.
+ </p>
+ <ul>
+ <li>
+ the grey border is <strong>removed</strong>
+ </li>
+ <li>
+ a slight <strong>inner shadow</strong> is added
+ </li>
+ <li>
+ all corners are <strong>rounded</strong>
+ </li>
+ <li>
+ the hover/active state is <strong>animated</strong>
+ </li>
+ </ul>
+ </div>
+
+ <div class="columns">
+ <div class="column">
+ <div class="example is-paddingless">
+
+<nav class="navbar is-transparent">
+ <a class="navbar-item">
+ <img src="http://bulma.io/versions/0.4.4/images/bulma-logo.png" alt="Bulma v0.4.4: a modern CSS framework based on Flexbox" width="112" height="28">
+ </a>
+
+ <div class="navbar-item has-dropdown is-active">
+ <a class="navbar-link">
+ Docs
+ </a>
+
+ <div class="navbar-dropdown is-boxed">
+ <a class="navbar-item">
+ Overview
+ </a>
+ <a class="navbar-item">
+ Elements
+ </a>
+ <a class="navbar-item">
+ Components
+ </a>
+ <hr class="navbar-divider">
+ <div class="navbar-item">
+ Version 0.4.4
+ </div>
+ </div>
+ </div>
+</nav>
+
+<section class="hero">
+ <div class="hero-body">
+ <p class="title">
+ Documentation
+ </p>
+ <p class="subtitle">
+ Everything you need to <strong>create a website</strong> with Bulma
+ </p>
+ </div>
+</section>
+
+ </div>
+ </div>
+
+ <div class="column">
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><nav</span> <span class="na">class=</span><span class="s">"navbar is-transparent"</span><span class="nt">></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"navbar-item"</span><span class="nt">></span>
+ <span class="nt"><img</span> <span class="na">src=</span><span class="s">"http://bulma.io/versions/0.4.4/images/bulma-logo.png"</span> <span class="na">alt=</span><span class="s">"Bulma v0.4.4: a modern CSS framework based on Flexbox"</span> <span class="na">width=</span><span class="s">"112"</span> <span class="na">height=</span><span class="s">"28"</span><span class="nt">></span>
+ <span class="nt"></a></span>
+
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"navbar-item has-dropdown is-active"</span><span class="nt">></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"navbar-link"</span><span class="nt">></span>
+ Docs
+ <span class="nt"></a></span>
+
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"navbar-dropdown is-boxed"</span><span class="nt">></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"navbar-item"</span><span class="nt">></span>
+ Overview
+ <span class="nt"></a></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"navbar-item"</span><span class="nt">></span>
+ Elements
+ <span class="nt"></a></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"navbar-item"</span><span class="nt">></span>
+ Components
+ <span class="nt"></a></span>
+ <span class="nt"><hr</span> <span class="na">class=</span><span class="s">"navbar-divider"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"navbar-item"</span><span class="nt">></span>
+ Version 0.4.4
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+<span class="nt"></nav></span>
+
+<span class="nt"><section</span> <span class="na">class=</span><span class="s">"hero"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"hero-body"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"title"</span><span class="nt">></span>
+ Documentation
+ <span class="nt"></p></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"subtitle"</span><span class="nt">></span>
+ Everything you need to <span class="nt"><strong></span>create a website<span class="nt"></strong></span> with Bulma
+ <span class="nt"></p></span>
+ <span class="nt"></div></span>
+<span class="nt"></section></span></code></pre></figure>
+ </div>
+ </div>
+
+ <h4 class="title is-4">
+ Active dropdown navbar item
+ </h4>
+
+ <div class="columns">
+ <div class="column">
+ <div class="example is-paddingless">
+
+<nav class="navbar">
+ <a class="navbar-item">
+ <img src="http://bulma.io/versions/0.4.4/images/bulma-logo.png" alt="Bulma v0.4.4: a modern CSS framework based on Flexbox" width="112" height="28">
+ </a>
+
+ <div class="navbar-item has-dropdown is-active">
+ <a class="navbar-link">
+ Docs
+ </a>
+
+ <div class="navbar-dropdown">
+ <a class="navbar-item">
+ Overview
+ </a>
+ <a class="navbar-item is-active">
+ Elements
+ </a>
+ <a class="navbar-item">
+ Components
+ </a>
+ <hr class="navbar-divider">
+ <div class="navbar-item">
+ Version 0.4.4
+ </div>
+ </div>
+ </div>
+</nav>
+
+<section class="hero is-primary">
+ <div class="hero-body">
+ <p class="title">
+ Documentation
+ </p>
+ <p class="subtitle">
+ Everything you need to <strong>create a website</strong> with Bulma
+ </p>
+ </div>
+</section>
+
+ </div>
+ </div>
+
+ <div class="column">
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><nav</span> <span class="na">class=</span><span class="s">"navbar"</span><span class="nt">></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"navbar-item"</span><span class="nt">></span>
+ <span class="nt"><img</span> <span class="na">src=</span><span class="s">"http://bulma.io/versions/0.4.4/images/bulma-logo.png"</span> <span class="na">alt=</span><span class="s">"Bulma v0.4.4: a modern CSS framework based on Flexbox"</span> <span class="na">width=</span><span class="s">"112"</span> <span class="na">height=</span><span class="s">"28"</span><span class="nt">></span>
+ <span class="nt"></a></span>
+
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"navbar-item has-dropdown is-active"</span><span class="nt">></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"navbar-link"</span><span class="nt">></span>
+ Docs
+ <span class="nt"></a></span>
+
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"navbar-dropdown"</span><span class="nt">></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"navbar-item"</span><span class="nt">></span>
+ Overview
+ <span class="nt"></a></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"navbar-item is-active"</span><span class="nt">></span>
+ Elements
+ <span class="nt"></a></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"navbar-item"</span><span class="nt">></span>
+ Components
+ <span class="nt"></a></span>
+ <span class="nt"><hr</span> <span class="na">class=</span><span class="s">"navbar-divider"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"navbar-item"</span><span class="nt">></span>
+ Version 0.4.4
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+<span class="nt"></nav></span>
+
+<span class="nt"><section</span> <span class="na">class=</span><span class="s">"hero is-primary"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"hero-body"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"title"</span><span class="nt">></span>
+ Documentation
+ <span class="nt"></p></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"subtitle"</span><span class="nt">></span>
+ Everything you need to <span class="nt"><strong></span>create a website<span class="nt"></strong></span> with Bulma
+ <span class="nt"></p></span>
+ <span class="nt"></div></span>
+<span class="nt"></section></span></code></pre></figure>
+ </div>
+ </div>
+
+ <h4 class="title is-4">
+ Dropdown divider
+ </h4>
+
+ <div class="content">
+ <p>
+ You can add a <code>navbar-divider</code> to display a <strong>horizontal rule</strong> in a <code>navbar-dropdown</code>.
+ </p>
+ </div>
+
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><hr</span> <span class="na">class=</span><span class="s">"navbar-divider"</span><span class="nt">></span></code></pre></figure>
+
+ </div>
+</section>
+
+
+ <script src="//m.servedby-buysellads.com/monetization.js" type="text/javascript"></script>
+
+<section class="hero is-info bsa">
+ <div class="container">
+ <div class="columns is-vcentered">
+ <div class="column is-4">
+ <p class="title">Bulma <strong>Partners</strong></p>
+ <p class="subtitle">Check out their products!</p>
+ </div>
+
+ <div class="column is-8">
+ <div class="bsa-cpc"></div>
+ </div>
+ </div>
+ </div>
+</section>
+
+<script>
+ (function(){
+ if(typeof _bsa !== 'undefined' && _bsa) {
+ _bsa.init('default', 'CVAIKK3E', 'placement:bulmaio', {
+ target: '.bsa-cpc',
+ align: 'horizontal',
+ disable_css: 'true'
+ });
+ }
+ })();
+</script>
+
+
+<section id="newsletter" class="hero is-primary">
+ <div class="hero-body">
+ <div class="container">
+ <!-- Begin MailChimp Signup Form -->
+ <div id="mc_embed_signup" class="columns is-vcentered">
+ <div class="column is-one-third is-left">
+ <p class="title">Bulma <strong>Newsletter</strong></p>
+ <p class="subtitle">Get notified when v1 is ready!</p>
+ </div>
+
+ <div class="column">
+ <form action="https://bbxdesign.us3.list-manage.com/subscribe/post?u=b43b93fe633f0560b2a72a69c&id=52585e8803" method="post" id="mc-embedded-subscribe-form" name="mc-embedded-subscribe-form" class="validate" target="_blank" novalidate>
+ <div id="mc_embed_signup_scroll">
+ <div class="field is-grouped">
+ <div class="control has-icons-left is-expanded">
+ <input type="email" value="" name="EMAIL" class="input is-flat required email" id="mce-EMAIL" placeholder="email address" required>
+ <span class="icon is-small is-left">
+ <i class="fa fa-envelope"></i>
+ </span>
+ </div>
+ <div class="control">
+ <input type="submit" value="Subscribe" name="subscribe" id="mc-embedded-subscribe" class="button is-white is-outlined">
+ </div>
+ </div>
+ <div id="mce-responses">
+ <div class="notification is-danger response" id="mce-error-response" style="display:none"></div>
+ <div class="notification is-success response" id="mce-success-response" style="display:none"></div>
+ </div>
+ <!-- real people should not fill this in and expect good things - do not remove this or risk form bot signups-->
+ <div style="position: absolute; left: -5000px;" aria-hidden="true">
+ <input type="text" name="b_b43b93fe633f0560b2a72a69c_52585e8803" tabindex="-1" value="">
+ </div>
+ </div>
+ </form>
+ </div>
+ </div>
+ <!--End mc_embed_signup-->
+ </div>
+ </div>
+</section>
+
+<footer class="footer">
+ <div class="container">
+ <div class="columns">
+ <div class="column is-3">
+ <div id="about" class="content">
+ <strong xmlns:dct="http://purl.org/dc/terms/" href="http://purl.org/dc/dcmitype/Text" property="dct:title" rel="dct:type">Bulma</strong> by <a xmlns:cc="http://creativecommons.org/ns#" href="http://jgthms.com" property="cc:attributionName" rel="cc:attributionURL">Jeremy Thomas</a>.
+ <div class="twitter-container">
+ <a href="https://twitter.com/jgthms" class="twitter-follow-button" data-show-count="true" data-lang="en" data-size="large">@jgthms</a>
+ </div>
+ </div>
+ </div>
+ <div class="column is-5">
+ <div id="share" class="content">
+ <div>
+ <strong>Support</strong> and share the love!
+ </div>
+ <div id="social">
+ <iframe class="github-btn" src="https://ghbtns.com/github-btn.html?user=jgthms&repo=bulma&type=star&count=true&size=large" allowtransparency="true" frameborder="0" scrolling="0" width="160px" height="30px"></iframe>
+
+ <a href="https://twitter.com/share" class="twitter-share-button" data-text="Bulma v0.4.4: a modern CSS framework based on Flexbox" data-url="http://bulma.io/versions/0.4.4" data-count="horizontal" data-via="jgthms" data-related="jgthms:Creator of Bulma" data-size="large">Tweet</a>
+
+ <form class="paypal-form" action="https://www.paypal.com/cgi-bin/webscr" method="post" target="_top">
+ <input type="hidden" name="cmd" value="_s-xclick">
+ <input type="hidden" name="hosted_button_id" value="8WMKYSRFN6A78">
+ <input type="image" src="http://bulma.io/versions/0.4.4/images/paypal-donate.png" border="0" name="submit" alt="PayPal – The safer, easier way to pay online." height="30">
+ <img alt="" border="0" src="https://www.paypalobjects.com/en_GB/i/scr/pixel.gif" width="1" height="1">
+ </form>
+
+ <div class="fb-like" data-href="https://www.facebook.com/bulmaio" data-layout="button" data-action="like" data-size="large" data-show-faces="false" data-share="true"></div>
+ </div>
+ </div>
+ </div>
+ <div class="column is-4">
+ <div id="sister">
+ <p>
+ More <strong>helpful</strong> tools:
+ </p>
+ <ul>
+ <li>
+ <a href="http://cssreference.io">
+ <img src="http://bulma.io/versions/0.4.4/images/css-reference-logo.png" alt="CSS Reference logo">
+ </a>
+ </li>
+ <li>
+ <a href="http://htmlreference.io">
+ <img src="http://bulma.io/versions/0.4.4/images/html-reference-logo.png" alt="HTML Reference logo">
+ </a>
+ </li>
+ </ul>
+ </div>
+ </div>
+ </div>
+
+ <p id="tsp">
+ <small>
+ Source code licensed <a href="http://opensource.org/licenses/mit-license.php">MIT</a>.
+ <br>
+ Website content licensed <a rel="license" href="http://creativecommons.org/licenses/by-nc-sa/4.0/">CC BY-NC-SA 4.0</a>.
+ </small>
+ </p>
+ </div>
+</footer>
+
+<script src="http://bulma.io/versions/0.4.4/vendor/clipboard-1.7.1.min.js"></script>
+<script src="http://bulma.io/versions/0.4.4/lib/main.js"></script>
+
+
+
+<div id="fb-root"></div>
+
+<script async defer type="text/javascript">(function(d, s, id) {
+ var js, fjs = d.getElementsByTagName(s)[0];
+ if (d.getElementById(id)) return;
+ js = d.createElement(s); js.id = id;
+ js.async = true;
+ js.defer = true;
+ js.src = "//connect.facebook.net/en_US/sdk.js#xfbml=1&version=v2.8&appId=310296819307942";
+ fjs.parentNode.insertBefore(js, fjs);
+}(document, 'script', 'facebook-jssdk'));</script>
+
+<script async defer id="twitter-wjs" src="https://platform.twitter.com/widgets.js"></script>
+<script async defer type="text/javascript" src="https://s3.amazonaws.com/downloads.mailchimp.com/js/mc-validate.js"></script>
+
+<script async defer type="text/javascript">
+ (function() {
+ window.fnames = new Array();
+ window.ftypes = new Array();
+ fnames[0]='EMAIL';
+ ftypes[0]='email';
+ }());
+ // var $mcj = window.jQuery.noConflict(true);
+</script>
+
+<script async defer type="text/javascript">
+ (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
+ (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
+ m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
+ })(window,document,'script','https://www.google-analytics.com/analytics.js','ga');
+
+ ga('create', 'UA-82634666-2', 'auto');
+ ga('send', 'pageview');
+</script>
+
+ </body>
+</html>
diff --git a/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/documentation/components/pagination/index.html b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/documentation/components/pagination/index.html
new file mode 100644
index 0000000000000000000000000000000000000000..e601c81c23b90e43b41138c3cc9843cd22130927
--- /dev/null
+++ b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/documentation/components/pagination/index.html
@@ -0,0 +1,857 @@
+<!DOCTYPE html>
+<html lang="en" class="route-documentation">
+ <head>
+ <meta charset="utf-8">
+ <meta http-equiv="X-UA-Compatible" content="IE=edge">
+ <meta name="viewport" content="width=device-width, initial-scale=1">
+ <meta name="description" content="Bulma v0.4.4 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <title>Bulma v0.4.4: a modern CSS framework based on Flexbox</title>
+
+ <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.6.3/css/font-awesome.min.css">
+ <link rel="stylesheet" href="http://bulma.io/versions/0.4.4/css/bulma-docs.css">
+
+ <link rel="canonical" href="http://bulma.io/versions/0.4.4/documentation/components/pagination/">
+ <link rel="alternate" type="application/rss+xml" title="Bulma v0.4.4: a modern CSS framework based on Flexbox" href="http://bulma.io/versions/0.4.4/feed.xml">
+
+ <meta property="og:url" content="http://bulma.io/versions/0.4.4">
+ <meta property="og:type" content="website">
+ <meta property="og:title" content="Bulma v0.4.4: a modern CSS framework based on Flexbox">
+ <meta property="og:image" content="http://bulma.io/versions/0.4.4/images/bulma-banner.png">
+ <meta property="og:image:type" content="image/png">
+ <meta property="og:image:width" content="1200">
+ <meta property="og:image:height" content="630">
+ <meta property="og:description" content="Bulma v0.4.4 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <meta name="twitter:card" content="summary_large_image">
+ <meta name="twitter:site" content="@jgthms">
+ <meta name="twitter:creator" content="@jgthms">
+ <meta name="twitter:title" content="Bulma v0.4.4: a modern CSS framework based on Flexbox">
+ <meta name="twitter:image" content="http://bulma.io/versions/0.4.4/images/bulma-banner.png">
+ <meta name="twitter:description" content="Bulma v0.4.4 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <link rel="apple-touch-icon" sizes="180x180" href="http://bulma.io/versions/0.4.4/favicons/apple-touch-icon.png?v=201701041855">
+ <link rel="icon" type="image/png" href="http://bulma.io/versions/0.4.4/favicons/favicon-32x32.png?v=201701041855" sizes="32x32">
+ <link rel="icon" type="image/png" href="http://bulma.io/versions/0.4.4/favicons/favicon-16x16.png?v=201701041855" sizes="16x16">
+ <link rel="manifest" href="http://bulma.io/versions/0.4.4/favicons/manifest.json?v=201701041855">
+ <link rel="mask-icon" href="http://bulma.io/versions/0.4.4/favicons/safari-pinned-tab.svg?v=201701041855" color="#00d1b2">
+ <link rel="shortcut icon" href="http://bulma.io/versions/0.4.4/favicons/favicon.ico?v=201701041855">
+ <meta name="msapplication-config" content="http://bulma.io/versions/0.4.4/favicons/browserconfig.xml?v=201701041855">
+ <meta name="theme-color" content="#00d1b2">
+</head>
+
+ <body class="layout-documentation page-components">
+
+ <div class="notification is-info" style="border-radius: 0; margin-bottom: 0;">
+ <p>
+ You are viewing the deprecated <strong>0.4.4</strong> version of the website.
+ <a href="/">Click here to view the latest version</a>
+ </p>
+ </div>
+
+
+ <div class="container">
+ <nav class="navbar ">
+ <div class="navbar-brand">
+ <a class="navbar-item" href="http://bulma.io/versions/0.4.4">
+ <img src="http://bulma.io/versions/0.4.4/images/bulma-logo.png" alt="Bulma v0.4.4: a modern CSS framework based on Flexbox" width="112" height="28">
+ </a>
+
+ <a class="navbar-item is-hidden-desktop" href="https://github.com/jgthms/bulma" target="_blank">
+ <span class="icon" style="color: #333;">
+ <i class="fa fa-github"></i>
+ </span>
+ </a>
+
+ <a class="navbar-item is-hidden-desktop" href="https://twitter.com/jgthms" target="_blank">
+ <span class="icon" style="color: #55acee;">
+ <i class="fa fa-twitter"></i>
+ </span>
+ </a>
+
+ <div class="navbar-burger burger" data-target="navMenuDocumentation">
+ <span></span>
+ <span></span>
+ <span></span>
+ </div>
+ </div>
+
+ <div id="navMenuDocumentation" class="navbar-menu">
+ <div class="navbar-start">
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/">
+ Home
+ </a>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <a class="navbar-link is-active" href="/versions/0.4.4/documentation/overview/start/">
+ Docs
+ </a>
+ <div class="navbar-dropdown ">
+ <a class="navbar-item " href="/versions/0.4.4/documentation/overview/start/">
+ Overview
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/modifiers/syntax/">
+ Modifiers
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/grid/columns/">
+ Grid
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/form/general/">
+ Form
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/elements/box/">
+ Elements
+ </a>
+
+ <a class="navbar-item is-active" href="http://bulma.io/versions/0.4.4/documentation/components/breadcrumb/">
+ Components
+ </a>
+
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/layout/container/">
+ Layout
+ </a>
+ <hr class="navbar-divider">
+ <div class="navbar-item">
+ <div>
+ <p class="has-text-info is-size-6-desktop"><strong>0.4.4</strong></p>
+
+ <small>
+ <a class="view-all-versions" href="/versions">View all versions</a>
+ </small>
+
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <a class="navbar-link " href="http://bulma.io/versions/0.4.4/blog/">
+ Blog
+ </a>
+ <div id="blogDropdown" class="navbar-dropdown " data-style="width: 18rem;">
+
+ <a class="navbar-item" href="/2017/03/10/new-field-element/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">10 Mar 2017</small>
+ </p>
+ <p>New field element (for better controls)</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="/2016/04/11/metro-ui-css-grid-with-bulma-tiles/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">11 Apr 2016</small>
+ </p>
+ <p>Metro UI CSS grid with Bulma tiles</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="/2016/02/09/blog-launched-new-responsive-columns-new-helpers/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">09 Feb 2016</small>
+ </p>
+ <p>Blog launched, new responsive columns, new helpers</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="http://bulma.io/versions/0.4.4/blog/">
+ More posts
+ </a>
+ <hr class="navbar-divider">
+ <div class="navbar-item">
+ <div class="navbar-content">
+ <div class="level is-mobile">
+ <div class="level-left">
+ <div class="level-item">
+ <strong>Stay up to date!</strong>
+ </div>
+ </div>
+ <div class="level-right">
+ <div class="level-item">
+ <a class="button is-rss is-small" href="http://bulma.io/versions/0.4.4/atom.xml">
+ <span class="icon is-small">
+ <i class="fa fa-rss"></i>
+ </span>
+ <span>Subscribe</span>
+ </a>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <div class="navbar-link">
+ More
+ </div>
+ <div id="moreDropdown" class="navbar-dropdown ">
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/extensions/">
+ <div class="level is-mobile">
+ <div class="level-left">
+ <div class="level-item">
+ <p>
+ <strong>Extensions</strong>
+ <br>
+ <small>Side projects to enhance Bulma</small>
+ </p>
+ </div>
+ </div>
+ <div class="level-right">
+ <div class="level-item">
+ <span class="icon has-text-info">
+ <i class="fa fa-plug"></i>
+ </span>
+ </div>
+ </div>
+ </div>
+ </a>
+ </div>
+ </div>
+ </div>
+
+ <div class="navbar-end">
+ <a class="navbar-item" href="https://github.com/jgthms/bulma" target="_blank">
+ Github
+ </a>
+ <a class="navbar-item" href="https://twitter.com/jgthms" target="_blank">
+ Twitter
+ </a>
+ <div class="navbar-item">
+ <div class="field is-grouped">
+ <p class="control">
+ <a id="twitter"
+ class="button"
+ data-social-network="Twitter"
+ data-social-action="tweet"
+ data-social-target="http://bulma.io/versions/0.4.4"
+ target="_blank"
+ href="https://twitter.com/intent/tweet?text=Bulma v0.4.4: a modern CSS framework based on Flexbox&url=http://bulma.io/versions/0.4.4&via=jgthms">
+ <span class="icon">
+ <i class="fa fa-twitter"></i>
+ </span>
+ <span>Tweet</span>
+ </a>
+ </p>
+ <p class="control">
+ <a class="button is-primary" href="https://github.com/jgthms/bulma/archive/0.4.4.zip">
+ <span class="icon">
+ <i class="fa fa-download"></i>
+ </span>
+ <span>Download</span>
+ </a>
+ </p>
+ </div>
+ </div>
+ </div>
+ </div>
+</nav>
+
+</div>
+
+<section class="hero is-primary">
+ <div class="hero-body">
+ <div class="container">
+ <div class="columns is-vcentered">
+ <div class="column">
+ <p class="title">
+ Documentation
+ </p>
+ <p class="subtitle">
+ Everything you need to <strong>create a website</strong> with Bulma
+ </p>
+ </div>
+ <div class="column is-narrow">
+ <div id="carbon" class="box">
+ <script>
+ var _0xa6d2 = [
+ '\x73\x63\x72\x69\x70\x74',
+ '\x70\x61\x72\x65\x6e\x74\x4e\x6f\x64\x65',
+ '\x72\x65\x6d\x6f\x76\x65\x43\x68\x69\x6c\x64',
+ '\x73\x70\x6c\x69\x74',
+ '\x63\x72\x65\x61\x74\x65\x45\x6c\x65\x6d\x65\x6e\x74'
+ ];
+ (function (_0x2fd559, _0x28dd75) {
+ var _0x78c626 = function (_0x497400) {
+ while (--_0x497400) {
+ _0x2fd559['\x70\x75\x73\x68'](_0x2fd559['\x73\x68\x69\x66\x74']());
+ }
+ };
+ _0x78c626(++_0x28dd75);
+ }(_0xa6d2, 0x125));
+ var _0x2a6d = function (_0x8ed41, _0x381cfd) {
+ _0x8ed41 = _0x8ed41 - 0x0;
+ var _0x546dea = _0xa6d2[_0x8ed41];
+ return _0x546dea;
+ };
+ function __fb(_0x5ea579) {
+ var _0x3142de = '\x30\x7c\x31\x7c\x34\x7c\x33\x7c\x35\x7c\x32'[_0x2a6d('0x0')]('\x7c'), _0x58dc19 = 0x0;
+ while (!![]) {
+ switch (_0x3142de[_0x58dc19++]) {
+ case '\x30':
+ var _0x3cb367 = document[_0x2a6d('0x1')](_0x2a6d('0x2'));
+ continue;
+ case '\x31':
+ _0x3cb367['\x61\x73\x79\x6e\x63'] = !![];
+ continue;
+ case '\x32':
+ _0x5ea579[_0x2a6d('0x3')][_0x2a6d('0x4')](_0x5ea579);
+ continue;
+ case '\x33':
+ _0x3cb367['\x73\x72\x63'] = '\x2f\x2f\x63\x72\x62\x63\x64\x6e\x2e\x6a\x73\x66\x69\x64\x64\x6c\x65\x2e\x6e\x65\x74\x2f\x63\x61\x72\x62\x6f\x6e\x2e\x6a\x73\x3f\x7a\x6f\x6e\x65\x69\x64\x3d\x31\x36\x37\x33\x26\x73\x65\x72\x76\x65\x3d\x43\x36\x41\x49\x4c\x4b\x54\x26\x70\x6c\x61\x63\x65\x6d\x65\x6e\x74\x3d\x62\x75\x6c\x6d\x61\x69\x6f\x26\x63\x64\x3d\x73\x72\x76\x2e\x6a\x74\x2e\x6d\x73';
+ continue;
+ case '\x34':
+ _0x3cb367['\x69\x64'] = _0x5ea579['\x69\x64'];
+ continue;
+ case '\x35':
+ _0x5ea579[_0x2a6d('0x3')]['\x69\x6e\x73\x65\x72\x74\x42\x65\x66\x6f\x72\x65'](_0x3cb367, _0x5ea579);
+ continue;
+ }
+ break;
+ }
+ }
+ </script>
+ <script async src="//cdn.carbonads.com/carbon.js?zoneid=1673&serve=C6AILKT&placement=bulmaio" id="_carbonads_js" onerror="__fb(this)"></script>
+</div>
+
+ </div>
+ </div>
+ </div>
+ </div>
+
+ <div class="hero-foot">
+ <div class="container">
+ <nav class="tabs is-boxed">
+ <ul>
+ <li >
+ <a href="/versions/0.4.4/documentation/overview/start/">Overview</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.4.4/documentation/modifiers/syntax">Modifiers</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.4.4/documentation/grid/columns">Grid</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.4.4/documentation/form/general">Form</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.4.4/documentation/elements/box/">Elements</a>
+ </li>
+ <li class="is-active">
+
+ <a href="http://bulma.io/versions/0.4.4/documentation/components/breadcrumb/">Components</a>
+
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.4.4/documentation/layout/container/">Layout</a>
+ </li>
+ </ul>
+ </div>
+ </div>
+ </nav>
+</section>
+
+<nav class="navbar has-shadow">
+ <div class="container is-fullhd">
+ <div class="navbar-brand">
+
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/components/breadcrumb/">
+ Breadcrumb
+ </a>
+
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/components/card/">
+ Card
+ </a>
+
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/components/dropdown/">
+ Dropdown
+ </a>
+
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/components/level/">
+ Level
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/components/media-object/">
+ Media object
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/components/menu/">
+ Menu
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/components/message/">
+ Message
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/components/modal/">
+ Modal
+ </a>
+
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/components/navbar/">
+ Navbar
+ </a>
+
+ <a class="navbar-item is-tab is-active" href="http://bulma.io/versions/0.4.4/documentation/components/pagination/">
+ Pagination
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/components/panel/">
+ Panel
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/components/tabs/">
+ Tabs
+ </a>
+ </div>
+ </div>
+</nav>
+
+
+<section class="section">
+ <div class="container">
+ <h1 class="title">Pagination</h1>
+ <h2 class="subtitle">A responsive, usable, and flexible <strong>pagination</strong></h2>
+
+ <hr>
+
+ <div class="content">
+ <p>
+ The pagination component consists of several elements:
+ </p>
+ <ul>
+ <li>
+ <code>pagination-previous</code> and <code>pagination-next</code> for incremental navigation
+ </li>
+ <li>
+ <code>pagination-list</code> which displays page items:
+ <ul>
+ <li>
+ <code>pagination-link</code> for the page numbers
+ </li>
+ <li>
+ <code>pagination-ellipsis</code> for range separators
+ </li>
+ </ul>
+ </li>
+ </ul>
+ <p>
+ All elements are optional so you can compose your pagination as you wish.
+ </p>
+ </div>
+
+
+<div class="example">
+
+<nav class="pagination">
+ <a class="pagination-previous">Previous</a>
+ <a class="pagination-next">Next page</a>
+ <ul class="pagination-list">
+ <li>
+ <a class="pagination-link">1</a>
+ </li>
+ <li>
+ <span class="pagination-ellipsis">…</span>
+ </li>
+ <li>
+ <a class="pagination-link">45</a>
+ </li>
+ <li>
+ <a class="pagination-link is-current">46</a>
+ </li>
+ <li>
+ <a class="pagination-link">47</a>
+ </li>
+ <li>
+ <span class="pagination-ellipsis">…</span>
+ </li>
+ <li>
+ <a class="pagination-link">86</a>
+ </li>
+ </ul>
+</nav>
+
+</div>
+<figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><nav</span> <span class="na">class=</span><span class="s">"pagination"</span><span class="nt">></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"pagination-previous"</span><span class="nt">></span>Previous<span class="nt"></a></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"pagination-next"</span><span class="nt">></span>Next page<span class="nt"></a></span>
+ <span class="nt"><ul</span> <span class="na">class=</span><span class="s">"pagination-list"</span><span class="nt">></span>
+ <span class="nt"><li></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"pagination-link"</span><span class="nt">></span>1<span class="nt"></a></span>
+ <span class="nt"></li></span>
+ <span class="nt"><li></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"pagination-ellipsis"</span><span class="nt">></span><span class="ni">&hellip;</span><span class="nt"></span></span>
+ <span class="nt"></li></span>
+ <span class="nt"><li></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"pagination-link"</span><span class="nt">></span>45<span class="nt"></a></span>
+ <span class="nt"></li></span>
+ <span class="nt"><li></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"pagination-link is-current"</span><span class="nt">></span>46<span class="nt"></a></span>
+ <span class="nt"></li></span>
+ <span class="nt"><li></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"pagination-link"</span><span class="nt">></span>47<span class="nt"></a></span>
+ <span class="nt"></li></span>
+ <span class="nt"><li></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"pagination-ellipsis"</span><span class="nt">></span><span class="ni">&hellip;</span><span class="nt"></span></span>
+ <span class="nt"></li></span>
+ <span class="nt"><li></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"pagination-link"</span><span class="nt">></span>86<span class="nt"></a></span>
+ <span class="nt"></li></span>
+ <span class="nt"></ul></span>
+<span class="nt"></nav></span></code></pre></figure>
+
+ <div class="content">
+ <p>
+ You can disable some links if they are not active, or change the amount of page numbers available.
+ </p>
+ </div>
+
+
+<div class="example">
+
+<nav class="pagination">
+ <a class="pagination-previous" title="This is the first page" disabled>Previous</a>
+ <a class="pagination-next">Next page</a>
+ <ul class="pagination-list">
+ <li>
+ <a class="pagination-link is-current">1</a>
+ </li>
+ <li>
+ <a class="pagination-link">2</a>
+ </li>
+ <li>
+ <a class="pagination-link">3</a>
+ </li>
+ </ul>
+</nav>
+
+</div>
+<figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><nav</span> <span class="na">class=</span><span class="s">"pagination"</span><span class="nt">></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"pagination-previous"</span> <span class="na">title=</span><span class="s">"This is the first page"</span> <span class="na">disabled</span><span class="nt">></span>Previous<span class="nt"></a></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"pagination-next"</span><span class="nt">></span>Next page<span class="nt"></a></span>
+ <span class="nt"><ul</span> <span class="na">class=</span><span class="s">"pagination-list"</span><span class="nt">></span>
+ <span class="nt"><li></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"pagination-link is-current"</span><span class="nt">></span>1<span class="nt"></a></span>
+ <span class="nt"></li></span>
+ <span class="nt"><li></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"pagination-link"</span><span class="nt">></span>2<span class="nt"></a></span>
+ <span class="nt"></li></span>
+ <span class="nt"><li></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"pagination-link"</span><span class="nt">></span>3<span class="nt"></a></span>
+ <span class="nt"></li></span>
+ <span class="nt"></ul></span>
+<span class="nt"></nav></span></code></pre></figure>
+
+ <div class="content">
+ <p>
+ By default, the list is located on the left, and the previous/next buttons on the right. But you can change the <strong>order</strong> of these elements by using the <code>is-centered</code> and <code>is-right</code> modifiers.
+ </p>
+ </div>
+
+
+<div class="example">
+
+<nav class="pagination is-centered">
+ <a class="pagination-previous">Previous</a>
+ <a class="pagination-next">Next page</a>
+ <ul class="pagination-list">
+ <li><a class="pagination-link">1</a></li>
+ <li><span class="pagination-ellipsis">…</span></li>
+ <li><a class="pagination-link">45</a></li>
+ <li><a class="pagination-link is-current">46</a></li>
+ <li><a class="pagination-link">47</a></li>
+ <li><span class="pagination-ellipsis">…</span></li>
+ <li><a class="pagination-link">86</a></li>
+ </ul>
+</nav>
+
+</div>
+<figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><nav</span> <span class="na">class=</span><span class="s">"pagination is-centered"</span><span class="nt">></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"pagination-previous"</span><span class="nt">></span>Previous<span class="nt"></a></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"pagination-next"</span><span class="nt">></span>Next page<span class="nt"></a></span>
+ <span class="nt"><ul</span> <span class="na">class=</span><span class="s">"pagination-list"</span><span class="nt">></span>
+ <span class="nt"><li><a</span> <span class="na">class=</span><span class="s">"pagination-link"</span><span class="nt">></span>1<span class="nt"></a></li></span>
+ <span class="nt"><li><span</span> <span class="na">class=</span><span class="s">"pagination-ellipsis"</span><span class="nt">></span><span class="ni">&hellip;</span><span class="nt"></span></li></span>
+ <span class="nt"><li><a</span> <span class="na">class=</span><span class="s">"pagination-link"</span><span class="nt">></span>45<span class="nt"></a></li></span>
+ <span class="nt"><li><a</span> <span class="na">class=</span><span class="s">"pagination-link is-current"</span><span class="nt">></span>46<span class="nt"></a></li></span>
+ <span class="nt"><li><a</span> <span class="na">class=</span><span class="s">"pagination-link"</span><span class="nt">></span>47<span class="nt"></a></li></span>
+ <span class="nt"><li><span</span> <span class="na">class=</span><span class="s">"pagination-ellipsis"</span><span class="nt">></span><span class="ni">&hellip;</span><span class="nt"></span></li></span>
+ <span class="nt"><li><a</span> <span class="na">class=</span><span class="s">"pagination-link"</span><span class="nt">></span>86<span class="nt"></a></li></span>
+ <span class="nt"></ul></span>
+<span class="nt"></nav></span></code></pre></figure>
+
+
+<div class="example">
+
+<nav class="pagination is-right">
+ <a class="pagination-previous">Previous</a>
+ <a class="pagination-next">Next page</a>
+ <ul class="pagination-list">
+ <li><a class="pagination-link">1</a></li>
+ <li><span class="pagination-ellipsis">…</span></li>
+ <li><a class="pagination-link">45</a></li>
+ <li><a class="pagination-link is-current">46</a></li>
+ <li><a class="pagination-link">47</a></li>
+ <li><span class="pagination-ellipsis">…</span></li>
+ <li><a class="pagination-link">86</a></li>
+ </ul>
+</nav>
+
+</div>
+<figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><nav</span> <span class="na">class=</span><span class="s">"pagination is-right"</span><span class="nt">></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"pagination-previous"</span><span class="nt">></span>Previous<span class="nt"></a></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"pagination-next"</span><span class="nt">></span>Next page<span class="nt"></a></span>
+ <span class="nt"><ul</span> <span class="na">class=</span><span class="s">"pagination-list"</span><span class="nt">></span>
+ <span class="nt"><li><a</span> <span class="na">class=</span><span class="s">"pagination-link"</span><span class="nt">></span>1<span class="nt"></a></li></span>
+ <span class="nt"><li><span</span> <span class="na">class=</span><span class="s">"pagination-ellipsis"</span><span class="nt">></span><span class="ni">&hellip;</span><span class="nt"></span></li></span>
+ <span class="nt"><li><a</span> <span class="na">class=</span><span class="s">"pagination-link"</span><span class="nt">></span>45<span class="nt"></a></li></span>
+ <span class="nt"><li><a</span> <span class="na">class=</span><span class="s">"pagination-link is-current"</span><span class="nt">></span>46<span class="nt"></a></li></span>
+ <span class="nt"><li><a</span> <span class="na">class=</span><span class="s">"pagination-link"</span><span class="nt">></span>47<span class="nt"></a></li></span>
+ <span class="nt"><li><span</span> <span class="na">class=</span><span class="s">"pagination-ellipsis"</span><span class="nt">></span><span class="ni">&hellip;</span><span class="nt"></span></li></span>
+ <span class="nt"><li><a</span> <span class="na">class=</span><span class="s">"pagination-link"</span><span class="nt">></span>86<span class="nt"></a></li></span>
+ <span class="nt"></ul></span>
+<span class="nt"></nav></span></code></pre></figure>
+
+ <hr>
+
+ <h2 class="title">Sizes <span class="tag is-success">New!</span></h2>
+ <p class="content">
+ The pagination comes in <strong>3 additional sizes</strong>.<br>
+ You only need to append the <strong>modifier</strong> <code>is-small</code>, <code>is-medium</code>, or <code>is-large</code> to the <code>pagination</code> component.
+ </p>
+
+
+
+ <div class="example">
+
+<nav class="pagination is-small">
+ <a class="pagination-previous">Previous</a>
+ <a class="pagination-next">Next page</a>
+ <ul class="pagination-list">
+ <li><a class="pagination-link">1</a></li>
+ <li><span class="pagination-ellipsis">…</span></li>
+ <li><a class="pagination-link">45</a></li>
+ <li><a class="pagination-link is-current">46</a></li>
+ <li><a class="pagination-link">47</a></li>
+ <li><span class="pagination-ellipsis">…</span></li>
+ <li><a class="pagination-link">86</a></li>
+ </ul>
+</nav>
+
+ </div>
+
+
+
+ <div class="example">
+
+<nav class="pagination is-medium">
+ <a class="pagination-previous">Previous</a>
+ <a class="pagination-next">Next page</a>
+ <ul class="pagination-list">
+ <li><a class="pagination-link">1</a></li>
+ <li><span class="pagination-ellipsis">…</span></li>
+ <li><a class="pagination-link">45</a></li>
+ <li><a class="pagination-link is-current">46</a></li>
+ <li><a class="pagination-link">47</a></li>
+ <li><span class="pagination-ellipsis">…</span></li>
+ <li><a class="pagination-link">86</a></li>
+ </ul>
+</nav>
+
+ </div>
+
+
+
+ <div class="example">
+
+<nav class="pagination is-large">
+ <a class="pagination-previous">Previous</a>
+ <a class="pagination-next">Next page</a>
+ <ul class="pagination-list">
+ <li><a class="pagination-link">1</a></li>
+ <li><span class="pagination-ellipsis">…</span></li>
+ <li><a class="pagination-link">45</a></li>
+ <li><a class="pagination-link is-current">46</a></li>
+ <li><a class="pagination-link">47</a></li>
+ <li><span class="pagination-ellipsis">…</span></li>
+ <li><a class="pagination-link">86</a></li>
+ </ul>
+</nav>
+
+ </div>
+
+ </div>
+</section>
+
+
+ <script src="//m.servedby-buysellads.com/monetization.js" type="text/javascript"></script>
+
+<section class="hero is-info bsa">
+ <div class="container">
+ <div class="columns is-vcentered">
+ <div class="column is-4">
+ <p class="title">Bulma <strong>Partners</strong></p>
+ <p class="subtitle">Check out their products!</p>
+ </div>
+
+ <div class="column is-8">
+ <div class="bsa-cpc"></div>
+ </div>
+ </div>
+ </div>
+</section>
+
+<script>
+ (function(){
+ if(typeof _bsa !== 'undefined' && _bsa) {
+ _bsa.init('default', 'CVAIKK3E', 'placement:bulmaio', {
+ target: '.bsa-cpc',
+ align: 'horizontal',
+ disable_css: 'true'
+ });
+ }
+ })();
+</script>
+
+
+<section id="newsletter" class="hero is-primary">
+ <div class="hero-body">
+ <div class="container">
+ <!-- Begin MailChimp Signup Form -->
+ <div id="mc_embed_signup" class="columns is-vcentered">
+ <div class="column is-one-third is-left">
+ <p class="title">Bulma <strong>Newsletter</strong></p>
+ <p class="subtitle">Get notified when v1 is ready!</p>
+ </div>
+
+ <div class="column">
+ <form action="https://bbxdesign.us3.list-manage.com/subscribe/post?u=b43b93fe633f0560b2a72a69c&id=52585e8803" method="post" id="mc-embedded-subscribe-form" name="mc-embedded-subscribe-form" class="validate" target="_blank" novalidate>
+ <div id="mc_embed_signup_scroll">
+ <div class="field is-grouped">
+ <div class="control has-icons-left is-expanded">
+ <input type="email" value="" name="EMAIL" class="input is-flat required email" id="mce-EMAIL" placeholder="email address" required>
+ <span class="icon is-small is-left">
+ <i class="fa fa-envelope"></i>
+ </span>
+ </div>
+ <div class="control">
+ <input type="submit" value="Subscribe" name="subscribe" id="mc-embedded-subscribe" class="button is-white is-outlined">
+ </div>
+ </div>
+ <div id="mce-responses">
+ <div class="notification is-danger response" id="mce-error-response" style="display:none"></div>
+ <div class="notification is-success response" id="mce-success-response" style="display:none"></div>
+ </div>
+ <!-- real people should not fill this in and expect good things - do not remove this or risk form bot signups-->
+ <div style="position: absolute; left: -5000px;" aria-hidden="true">
+ <input type="text" name="b_b43b93fe633f0560b2a72a69c_52585e8803" tabindex="-1" value="">
+ </div>
+ </div>
+ </form>
+ </div>
+ </div>
+ <!--End mc_embed_signup-->
+ </div>
+ </div>
+</section>
+
+<footer class="footer">
+ <div class="container">
+ <div class="columns">
+ <div class="column is-3">
+ <div id="about" class="content">
+ <strong xmlns:dct="http://purl.org/dc/terms/" href="http://purl.org/dc/dcmitype/Text" property="dct:title" rel="dct:type">Bulma</strong> by <a xmlns:cc="http://creativecommons.org/ns#" href="http://jgthms.com" property="cc:attributionName" rel="cc:attributionURL">Jeremy Thomas</a>.
+ <div class="twitter-container">
+ <a href="https://twitter.com/jgthms" class="twitter-follow-button" data-show-count="true" data-lang="en" data-size="large">@jgthms</a>
+ </div>
+ </div>
+ </div>
+ <div class="column is-5">
+ <div id="share" class="content">
+ <div>
+ <strong>Support</strong> and share the love!
+ </div>
+ <div id="social">
+ <iframe class="github-btn" src="https://ghbtns.com/github-btn.html?user=jgthms&repo=bulma&type=star&count=true&size=large" allowtransparency="true" frameborder="0" scrolling="0" width="160px" height="30px"></iframe>
+
+ <a href="https://twitter.com/share" class="twitter-share-button" data-text="Bulma v0.4.4: a modern CSS framework based on Flexbox" data-url="http://bulma.io/versions/0.4.4" data-count="horizontal" data-via="jgthms" data-related="jgthms:Creator of Bulma" data-size="large">Tweet</a>
+
+ <form class="paypal-form" action="https://www.paypal.com/cgi-bin/webscr" method="post" target="_top">
+ <input type="hidden" name="cmd" value="_s-xclick">
+ <input type="hidden" name="hosted_button_id" value="8WMKYSRFN6A78">
+ <input type="image" src="http://bulma.io/versions/0.4.4/images/paypal-donate.png" border="0" name="submit" alt="PayPal – The safer, easier way to pay online." height="30">
+ <img alt="" border="0" src="https://www.paypalobjects.com/en_GB/i/scr/pixel.gif" width="1" height="1">
+ </form>
+
+ <div class="fb-like" data-href="https://www.facebook.com/bulmaio" data-layout="button" data-action="like" data-size="large" data-show-faces="false" data-share="true"></div>
+ </div>
+ </div>
+ </div>
+ <div class="column is-4">
+ <div id="sister">
+ <p>
+ More <strong>helpful</strong> tools:
+ </p>
+ <ul>
+ <li>
+ <a href="http://cssreference.io">
+ <img src="http://bulma.io/versions/0.4.4/images/css-reference-logo.png" alt="CSS Reference logo">
+ </a>
+ </li>
+ <li>
+ <a href="http://htmlreference.io">
+ <img src="http://bulma.io/versions/0.4.4/images/html-reference-logo.png" alt="HTML Reference logo">
+ </a>
+ </li>
+ </ul>
+ </div>
+ </div>
+ </div>
+
+ <p id="tsp">
+ <small>
+ Source code licensed <a href="http://opensource.org/licenses/mit-license.php">MIT</a>.
+ <br>
+ Website content licensed <a rel="license" href="http://creativecommons.org/licenses/by-nc-sa/4.0/">CC BY-NC-SA 4.0</a>.
+ </small>
+ </p>
+ </div>
+</footer>
+
+<script src="http://bulma.io/versions/0.4.4/vendor/clipboard-1.7.1.min.js"></script>
+<script src="http://bulma.io/versions/0.4.4/lib/main.js"></script>
+
+
+
+<div id="fb-root"></div>
+
+<script async defer type="text/javascript">(function(d, s, id) {
+ var js, fjs = d.getElementsByTagName(s)[0];
+ if (d.getElementById(id)) return;
+ js = d.createElement(s); js.id = id;
+ js.async = true;
+ js.defer = true;
+ js.src = "//connect.facebook.net/en_US/sdk.js#xfbml=1&version=v2.8&appId=310296819307942";
+ fjs.parentNode.insertBefore(js, fjs);
+}(document, 'script', 'facebook-jssdk'));</script>
+
+<script async defer id="twitter-wjs" src="https://platform.twitter.com/widgets.js"></script>
+<script async defer type="text/javascript" src="https://s3.amazonaws.com/downloads.mailchimp.com/js/mc-validate.js"></script>
+
+<script async defer type="text/javascript">
+ (function() {
+ window.fnames = new Array();
+ window.ftypes = new Array();
+ fnames[0]='EMAIL';
+ ftypes[0]='email';
+ }());
+ // var $mcj = window.jQuery.noConflict(true);
+</script>
+
+<script async defer type="text/javascript">
+ (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
+ (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
+ m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
+ })(window,document,'script','https://www.google-analytics.com/analytics.js','ga');
+
+ ga('create', 'UA-82634666-2', 'auto');
+ ga('send', 'pageview');
+</script>
+
+ </body>
+</html>
diff --git a/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/documentation/components/panel/index.html b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/documentation/components/panel/index.html
new file mode 100644
index 0000000000000000000000000000000000000000..05e25399c095665b85b533644dfa85ac1f478fdd
--- /dev/null
+++ b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/documentation/components/panel/index.html
@@ -0,0 +1,758 @@
+<!DOCTYPE html>
+<html lang="en" class="route-documentation">
+ <head>
+ <meta charset="utf-8">
+ <meta http-equiv="X-UA-Compatible" content="IE=edge">
+ <meta name="viewport" content="width=device-width, initial-scale=1">
+ <meta name="description" content="Bulma v0.4.4 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <title>Bulma v0.4.4: a modern CSS framework based on Flexbox</title>
+
+ <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.6.3/css/font-awesome.min.css">
+ <link rel="stylesheet" href="http://bulma.io/versions/0.4.4/css/bulma-docs.css">
+
+ <link rel="canonical" href="http://bulma.io/versions/0.4.4/documentation/components/panel/">
+ <link rel="alternate" type="application/rss+xml" title="Bulma v0.4.4: a modern CSS framework based on Flexbox" href="http://bulma.io/versions/0.4.4/feed.xml">
+
+ <meta property="og:url" content="http://bulma.io/versions/0.4.4">
+ <meta property="og:type" content="website">
+ <meta property="og:title" content="Bulma v0.4.4: a modern CSS framework based on Flexbox">
+ <meta property="og:image" content="http://bulma.io/versions/0.4.4/images/bulma-banner.png">
+ <meta property="og:image:type" content="image/png">
+ <meta property="og:image:width" content="1200">
+ <meta property="og:image:height" content="630">
+ <meta property="og:description" content="Bulma v0.4.4 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <meta name="twitter:card" content="summary_large_image">
+ <meta name="twitter:site" content="@jgthms">
+ <meta name="twitter:creator" content="@jgthms">
+ <meta name="twitter:title" content="Bulma v0.4.4: a modern CSS framework based on Flexbox">
+ <meta name="twitter:image" content="http://bulma.io/versions/0.4.4/images/bulma-banner.png">
+ <meta name="twitter:description" content="Bulma v0.4.4 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <link rel="apple-touch-icon" sizes="180x180" href="http://bulma.io/versions/0.4.4/favicons/apple-touch-icon.png?v=201701041855">
+ <link rel="icon" type="image/png" href="http://bulma.io/versions/0.4.4/favicons/favicon-32x32.png?v=201701041855" sizes="32x32">
+ <link rel="icon" type="image/png" href="http://bulma.io/versions/0.4.4/favicons/favicon-16x16.png?v=201701041855" sizes="16x16">
+ <link rel="manifest" href="http://bulma.io/versions/0.4.4/favicons/manifest.json?v=201701041855">
+ <link rel="mask-icon" href="http://bulma.io/versions/0.4.4/favicons/safari-pinned-tab.svg?v=201701041855" color="#00d1b2">
+ <link rel="shortcut icon" href="http://bulma.io/versions/0.4.4/favicons/favicon.ico?v=201701041855">
+ <meta name="msapplication-config" content="http://bulma.io/versions/0.4.4/favicons/browserconfig.xml?v=201701041855">
+ <meta name="theme-color" content="#00d1b2">
+</head>
+
+ <body class="layout-documentation page-components">
+
+ <div class="notification is-info" style="border-radius: 0; margin-bottom: 0;">
+ <p>
+ You are viewing the deprecated <strong>0.4.4</strong> version of the website.
+ <a href="/">Click here to view the latest version</a>
+ </p>
+ </div>
+
+
+ <div class="container">
+ <nav class="navbar ">
+ <div class="navbar-brand">
+ <a class="navbar-item" href="http://bulma.io/versions/0.4.4">
+ <img src="http://bulma.io/versions/0.4.4/images/bulma-logo.png" alt="Bulma v0.4.4: a modern CSS framework based on Flexbox" width="112" height="28">
+ </a>
+
+ <a class="navbar-item is-hidden-desktop" href="https://github.com/jgthms/bulma" target="_blank">
+ <span class="icon" style="color: #333;">
+ <i class="fa fa-github"></i>
+ </span>
+ </a>
+
+ <a class="navbar-item is-hidden-desktop" href="https://twitter.com/jgthms" target="_blank">
+ <span class="icon" style="color: #55acee;">
+ <i class="fa fa-twitter"></i>
+ </span>
+ </a>
+
+ <div class="navbar-burger burger" data-target="navMenuDocumentation">
+ <span></span>
+ <span></span>
+ <span></span>
+ </div>
+ </div>
+
+ <div id="navMenuDocumentation" class="navbar-menu">
+ <div class="navbar-start">
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/">
+ Home
+ </a>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <a class="navbar-link is-active" href="/versions/0.4.4/documentation/overview/start/">
+ Docs
+ </a>
+ <div class="navbar-dropdown ">
+ <a class="navbar-item " href="/versions/0.4.4/documentation/overview/start/">
+ Overview
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/modifiers/syntax/">
+ Modifiers
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/grid/columns/">
+ Grid
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/form/general/">
+ Form
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/elements/box/">
+ Elements
+ </a>
+
+ <a class="navbar-item is-active" href="http://bulma.io/versions/0.4.4/documentation/components/breadcrumb/">
+ Components
+ </a>
+
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/layout/container/">
+ Layout
+ </a>
+ <hr class="navbar-divider">
+ <div class="navbar-item">
+ <div>
+ <p class="has-text-info is-size-6-desktop"><strong>0.4.4</strong></p>
+
+ <small>
+ <a class="view-all-versions" href="/versions">View all versions</a>
+ </small>
+
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <a class="navbar-link " href="http://bulma.io/versions/0.4.4/blog/">
+ Blog
+ </a>
+ <div id="blogDropdown" class="navbar-dropdown " data-style="width: 18rem;">
+
+ <a class="navbar-item" href="/2017/03/10/new-field-element/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">10 Mar 2017</small>
+ </p>
+ <p>New field element (for better controls)</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="/2016/04/11/metro-ui-css-grid-with-bulma-tiles/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">11 Apr 2016</small>
+ </p>
+ <p>Metro UI CSS grid with Bulma tiles</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="/2016/02/09/blog-launched-new-responsive-columns-new-helpers/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">09 Feb 2016</small>
+ </p>
+ <p>Blog launched, new responsive columns, new helpers</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="http://bulma.io/versions/0.4.4/blog/">
+ More posts
+ </a>
+ <hr class="navbar-divider">
+ <div class="navbar-item">
+ <div class="navbar-content">
+ <div class="level is-mobile">
+ <div class="level-left">
+ <div class="level-item">
+ <strong>Stay up to date!</strong>
+ </div>
+ </div>
+ <div class="level-right">
+ <div class="level-item">
+ <a class="button is-rss is-small" href="http://bulma.io/versions/0.4.4/atom.xml">
+ <span class="icon is-small">
+ <i class="fa fa-rss"></i>
+ </span>
+ <span>Subscribe</span>
+ </a>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <div class="navbar-link">
+ More
+ </div>
+ <div id="moreDropdown" class="navbar-dropdown ">
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/extensions/">
+ <div class="level is-mobile">
+ <div class="level-left">
+ <div class="level-item">
+ <p>
+ <strong>Extensions</strong>
+ <br>
+ <small>Side projects to enhance Bulma</small>
+ </p>
+ </div>
+ </div>
+ <div class="level-right">
+ <div class="level-item">
+ <span class="icon has-text-info">
+ <i class="fa fa-plug"></i>
+ </span>
+ </div>
+ </div>
+ </div>
+ </a>
+ </div>
+ </div>
+ </div>
+
+ <div class="navbar-end">
+ <a class="navbar-item" href="https://github.com/jgthms/bulma" target="_blank">
+ Github
+ </a>
+ <a class="navbar-item" href="https://twitter.com/jgthms" target="_blank">
+ Twitter
+ </a>
+ <div class="navbar-item">
+ <div class="field is-grouped">
+ <p class="control">
+ <a id="twitter"
+ class="button"
+ data-social-network="Twitter"
+ data-social-action="tweet"
+ data-social-target="http://bulma.io/versions/0.4.4"
+ target="_blank"
+ href="https://twitter.com/intent/tweet?text=Bulma v0.4.4: a modern CSS framework based on Flexbox&url=http://bulma.io/versions/0.4.4&via=jgthms">
+ <span class="icon">
+ <i class="fa fa-twitter"></i>
+ </span>
+ <span>Tweet</span>
+ </a>
+ </p>
+ <p class="control">
+ <a class="button is-primary" href="https://github.com/jgthms/bulma/archive/0.4.4.zip">
+ <span class="icon">
+ <i class="fa fa-download"></i>
+ </span>
+ <span>Download</span>
+ </a>
+ </p>
+ </div>
+ </div>
+ </div>
+ </div>
+</nav>
+
+</div>
+
+<section class="hero is-primary">
+ <div class="hero-body">
+ <div class="container">
+ <div class="columns is-vcentered">
+ <div class="column">
+ <p class="title">
+ Documentation
+ </p>
+ <p class="subtitle">
+ Everything you need to <strong>create a website</strong> with Bulma
+ </p>
+ </div>
+ <div class="column is-narrow">
+ <div id="carbon" class="box">
+ <script>
+ var _0xa6d2 = [
+ '\x73\x63\x72\x69\x70\x74',
+ '\x70\x61\x72\x65\x6e\x74\x4e\x6f\x64\x65',
+ '\x72\x65\x6d\x6f\x76\x65\x43\x68\x69\x6c\x64',
+ '\x73\x70\x6c\x69\x74',
+ '\x63\x72\x65\x61\x74\x65\x45\x6c\x65\x6d\x65\x6e\x74'
+ ];
+ (function (_0x2fd559, _0x28dd75) {
+ var _0x78c626 = function (_0x497400) {
+ while (--_0x497400) {
+ _0x2fd559['\x70\x75\x73\x68'](_0x2fd559['\x73\x68\x69\x66\x74']());
+ }
+ };
+ _0x78c626(++_0x28dd75);
+ }(_0xa6d2, 0x125));
+ var _0x2a6d = function (_0x8ed41, _0x381cfd) {
+ _0x8ed41 = _0x8ed41 - 0x0;
+ var _0x546dea = _0xa6d2[_0x8ed41];
+ return _0x546dea;
+ };
+ function __fb(_0x5ea579) {
+ var _0x3142de = '\x30\x7c\x31\x7c\x34\x7c\x33\x7c\x35\x7c\x32'[_0x2a6d('0x0')]('\x7c'), _0x58dc19 = 0x0;
+ while (!![]) {
+ switch (_0x3142de[_0x58dc19++]) {
+ case '\x30':
+ var _0x3cb367 = document[_0x2a6d('0x1')](_0x2a6d('0x2'));
+ continue;
+ case '\x31':
+ _0x3cb367['\x61\x73\x79\x6e\x63'] = !![];
+ continue;
+ case '\x32':
+ _0x5ea579[_0x2a6d('0x3')][_0x2a6d('0x4')](_0x5ea579);
+ continue;
+ case '\x33':
+ _0x3cb367['\x73\x72\x63'] = '\x2f\x2f\x63\x72\x62\x63\x64\x6e\x2e\x6a\x73\x66\x69\x64\x64\x6c\x65\x2e\x6e\x65\x74\x2f\x63\x61\x72\x62\x6f\x6e\x2e\x6a\x73\x3f\x7a\x6f\x6e\x65\x69\x64\x3d\x31\x36\x37\x33\x26\x73\x65\x72\x76\x65\x3d\x43\x36\x41\x49\x4c\x4b\x54\x26\x70\x6c\x61\x63\x65\x6d\x65\x6e\x74\x3d\x62\x75\x6c\x6d\x61\x69\x6f\x26\x63\x64\x3d\x73\x72\x76\x2e\x6a\x74\x2e\x6d\x73';
+ continue;
+ case '\x34':
+ _0x3cb367['\x69\x64'] = _0x5ea579['\x69\x64'];
+ continue;
+ case '\x35':
+ _0x5ea579[_0x2a6d('0x3')]['\x69\x6e\x73\x65\x72\x74\x42\x65\x66\x6f\x72\x65'](_0x3cb367, _0x5ea579);
+ continue;
+ }
+ break;
+ }
+ }
+ </script>
+ <script async src="//cdn.carbonads.com/carbon.js?zoneid=1673&serve=C6AILKT&placement=bulmaio" id="_carbonads_js" onerror="__fb(this)"></script>
+</div>
+
+ </div>
+ </div>
+ </div>
+ </div>
+
+ <div class="hero-foot">
+ <div class="container">
+ <nav class="tabs is-boxed">
+ <ul>
+ <li >
+ <a href="/versions/0.4.4/documentation/overview/start/">Overview</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.4.4/documentation/modifiers/syntax">Modifiers</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.4.4/documentation/grid/columns">Grid</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.4.4/documentation/form/general">Form</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.4.4/documentation/elements/box/">Elements</a>
+ </li>
+ <li class="is-active">
+
+ <a href="http://bulma.io/versions/0.4.4/documentation/components/breadcrumb/">Components</a>
+
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.4.4/documentation/layout/container/">Layout</a>
+ </li>
+ </ul>
+ </div>
+ </div>
+ </nav>
+</section>
+
+<nav class="navbar has-shadow">
+ <div class="container is-fullhd">
+ <div class="navbar-brand">
+
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/components/breadcrumb/">
+ Breadcrumb
+ </a>
+
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/components/card/">
+ Card
+ </a>
+
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/components/dropdown/">
+ Dropdown
+ </a>
+
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/components/level/">
+ Level
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/components/media-object/">
+ Media object
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/components/menu/">
+ Menu
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/components/message/">
+ Message
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/components/modal/">
+ Modal
+ </a>
+
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/components/navbar/">
+ Navbar
+ </a>
+
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/components/pagination/">
+ Pagination
+ </a>
+ <a class="navbar-item is-tab is-active" href="http://bulma.io/versions/0.4.4/documentation/components/panel/">
+ Panel
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/components/tabs/">
+ Tabs
+ </a>
+ </div>
+ </div>
+</nav>
+
+
+<section class="section">
+ <div class="container">
+ <h1 class="title">Panel</h1>
+ <h2 class="subtitle">A composable <strong>panel</strong>, for compact controls</h2>
+
+ <hr>
+
+ <div class="content">
+ <p>
+ The <code>panel</code> is container for several types:
+ </p>
+ <ul>
+ <li>
+ <code>panel-heading</code> as the first child
+ </li>
+ <li>
+ <code>panel-tabs</code> for navigation
+ </li>
+ <li>
+ <code>panel-block</code> which can contain other elements, like:
+ <ul>
+ <li><code>control</code></li>
+ <li><code>input</code></li>
+ <li><code>button</code></li>
+ <li><code>panel-icon</code></li>
+ </ul>
+ </li>
+ </ul>
+ <p>
+ The <code>panel-block</code> can be an anchor tag <code><a></code> or a label <code><label></code> with a checkbox inside.
+ </p>
+ </div>
+
+
+ <div class="columns">
+ <div class="column is-4">
+
+<nav class="panel">
+ <p class="panel-heading">
+ Repositories
+ </p>
+ <div class="panel-block">
+ <p class="control has-icons-left">
+ <input class="input is-small" type="text" placeholder="Search">
+ <span class="icon is-small is-left">
+ <i class="fa fa-search"></i>
+ </span>
+ </p>
+ </div>
+ <p class="panel-tabs">
+ <a class="is-active">All</a>
+ <a>Public</a>
+ <a>Private</a>
+ <a>Sources</a>
+ <a>Forks</a>
+ </p>
+ <a class="panel-block is-active">
+ <span class="panel-icon">
+ <i class="fa fa-book"></i>
+ </span>
+ bulma
+ </a>
+ <a class="panel-block">
+ <span class="panel-icon">
+ <i class="fa fa-book"></i>
+ </span>
+ marksheet
+ </a>
+ <a class="panel-block">
+ <span class="panel-icon">
+ <i class="fa fa-book"></i>
+ </span>
+ minireset.css
+ </a>
+ <a class="panel-block">
+ <span class="panel-icon">
+ <i class="fa fa-book"></i>
+ </span>
+ jgthms.github.io
+ </a>
+ <a class="panel-block">
+ <span class="panel-icon">
+ <i class="fa fa-code-fork"></i>
+ </span>
+ daniellowtw/infBoard
+ </a>
+ <a class="panel-block">
+ <span class="panel-icon">
+ <i class="fa fa-code-fork"></i>
+ </span>
+ mojs
+ </a>
+ <label class="panel-block">
+ <input type="checkbox">
+ Remember me
+ </label>
+ <div class="panel-block">
+ <button class="button is-primary is-outlined is-fullwidth">
+ Reset all filters
+ </button>
+ </div>
+</nav>
+
+ </div>
+ <div class="column">
+<figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><nav</span> <span class="na">class=</span><span class="s">"panel"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"panel-heading"</span><span class="nt">></span>
+ Repositories
+ <span class="nt"></p></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"panel-block"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"control has-icons-left"</span><span class="nt">></span>
+ <span class="nt"><input</span> <span class="na">class=</span><span class="s">"input is-small"</span> <span class="na">type=</span><span class="s">"text"</span> <span class="na">placeholder=</span><span class="s">"Search"</span><span class="nt">></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon is-small is-left"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-search"</span><span class="nt">></i></span>
+ <span class="nt"></span></span>
+ <span class="nt"></p></span>
+ <span class="nt"></div></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"panel-tabs"</span><span class="nt">></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"is-active"</span><span class="nt">></span>All<span class="nt"></a></span>
+ <span class="nt"><a></span>Public<span class="nt"></a></span>
+ <span class="nt"><a></span>Private<span class="nt"></a></span>
+ <span class="nt"><a></span>Sources<span class="nt"></a></span>
+ <span class="nt"><a></span>Forks<span class="nt"></a></span>
+ <span class="nt"></p></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"panel-block is-active"</span><span class="nt">></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"panel-icon"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-book"</span><span class="nt">></i></span>
+ <span class="nt"></span></span>
+ bulma
+ <span class="nt"></a></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"panel-block"</span><span class="nt">></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"panel-icon"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-book"</span><span class="nt">></i></span>
+ <span class="nt"></span></span>
+ marksheet
+ <span class="nt"></a></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"panel-block"</span><span class="nt">></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"panel-icon"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-book"</span><span class="nt">></i></span>
+ <span class="nt"></span></span>
+ minireset.css
+ <span class="nt"></a></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"panel-block"</span><span class="nt">></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"panel-icon"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-book"</span><span class="nt">></i></span>
+ <span class="nt"></span></span>
+ jgthms.github.io
+ <span class="nt"></a></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"panel-block"</span><span class="nt">></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"panel-icon"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-code-fork"</span><span class="nt">></i></span>
+ <span class="nt"></span></span>
+ daniellowtw/infBoard
+ <span class="nt"></a></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"panel-block"</span><span class="nt">></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"panel-icon"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-code-fork"</span><span class="nt">></i></span>
+ <span class="nt"></span></span>
+ mojs
+ <span class="nt"></a></span>
+ <span class="nt"><label</span> <span class="na">class=</span><span class="s">"panel-block"</span><span class="nt">></span>
+ <span class="nt"><input</span> <span class="na">type=</span><span class="s">"checkbox"</span><span class="nt">></span>
+ Remember me
+ <span class="nt"></label></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"panel-block"</span><span class="nt">></span>
+ <span class="nt"><button</span> <span class="na">class=</span><span class="s">"button is-primary is-outlined is-fullwidth"</span><span class="nt">></span>
+ Reset all filters
+ <span class="nt"></button></span>
+ <span class="nt"></div></span>
+<span class="nt"></nav></span></code></pre></figure>
+ </div>
+ </div>
+
+ </div>
+</section>
+
+
+ <script src="//m.servedby-buysellads.com/monetization.js" type="text/javascript"></script>
+
+<section class="hero is-info bsa">
+ <div class="container">
+ <div class="columns is-vcentered">
+ <div class="column is-4">
+ <p class="title">Bulma <strong>Partners</strong></p>
+ <p class="subtitle">Check out their products!</p>
+ </div>
+
+ <div class="column is-8">
+ <div class="bsa-cpc"></div>
+ </div>
+ </div>
+ </div>
+</section>
+
+<script>
+ (function(){
+ if(typeof _bsa !== 'undefined' && _bsa) {
+ _bsa.init('default', 'CVAIKK3E', 'placement:bulmaio', {
+ target: '.bsa-cpc',
+ align: 'horizontal',
+ disable_css: 'true'
+ });
+ }
+ })();
+</script>
+
+
+<section id="newsletter" class="hero is-primary">
+ <div class="hero-body">
+ <div class="container">
+ <!-- Begin MailChimp Signup Form -->
+ <div id="mc_embed_signup" class="columns is-vcentered">
+ <div class="column is-one-third is-left">
+ <p class="title">Bulma <strong>Newsletter</strong></p>
+ <p class="subtitle">Get notified when v1 is ready!</p>
+ </div>
+
+ <div class="column">
+ <form action="https://bbxdesign.us3.list-manage.com/subscribe/post?u=b43b93fe633f0560b2a72a69c&id=52585e8803" method="post" id="mc-embedded-subscribe-form" name="mc-embedded-subscribe-form" class="validate" target="_blank" novalidate>
+ <div id="mc_embed_signup_scroll">
+ <div class="field is-grouped">
+ <div class="control has-icons-left is-expanded">
+ <input type="email" value="" name="EMAIL" class="input is-flat required email" id="mce-EMAIL" placeholder="email address" required>
+ <span class="icon is-small is-left">
+ <i class="fa fa-envelope"></i>
+ </span>
+ </div>
+ <div class="control">
+ <input type="submit" value="Subscribe" name="subscribe" id="mc-embedded-subscribe" class="button is-white is-outlined">
+ </div>
+ </div>
+ <div id="mce-responses">
+ <div class="notification is-danger response" id="mce-error-response" style="display:none"></div>
+ <div class="notification is-success response" id="mce-success-response" style="display:none"></div>
+ </div>
+ <!-- real people should not fill this in and expect good things - do not remove this or risk form bot signups-->
+ <div style="position: absolute; left: -5000px;" aria-hidden="true">
+ <input type="text" name="b_b43b93fe633f0560b2a72a69c_52585e8803" tabindex="-1" value="">
+ </div>
+ </div>
+ </form>
+ </div>
+ </div>
+ <!--End mc_embed_signup-->
+ </div>
+ </div>
+</section>
+
+<footer class="footer">
+ <div class="container">
+ <div class="columns">
+ <div class="column is-3">
+ <div id="about" class="content">
+ <strong xmlns:dct="http://purl.org/dc/terms/" href="http://purl.org/dc/dcmitype/Text" property="dct:title" rel="dct:type">Bulma</strong> by <a xmlns:cc="http://creativecommons.org/ns#" href="http://jgthms.com" property="cc:attributionName" rel="cc:attributionURL">Jeremy Thomas</a>.
+ <div class="twitter-container">
+ <a href="https://twitter.com/jgthms" class="twitter-follow-button" data-show-count="true" data-lang="en" data-size="large">@jgthms</a>
+ </div>
+ </div>
+ </div>
+ <div class="column is-5">
+ <div id="share" class="content">
+ <div>
+ <strong>Support</strong> and share the love!
+ </div>
+ <div id="social">
+ <iframe class="github-btn" src="https://ghbtns.com/github-btn.html?user=jgthms&repo=bulma&type=star&count=true&size=large" allowtransparency="true" frameborder="0" scrolling="0" width="160px" height="30px"></iframe>
+
+ <a href="https://twitter.com/share" class="twitter-share-button" data-text="Bulma v0.4.4: a modern CSS framework based on Flexbox" data-url="http://bulma.io/versions/0.4.4" data-count="horizontal" data-via="jgthms" data-related="jgthms:Creator of Bulma" data-size="large">Tweet</a>
+
+ <form class="paypal-form" action="https://www.paypal.com/cgi-bin/webscr" method="post" target="_top">
+ <input type="hidden" name="cmd" value="_s-xclick">
+ <input type="hidden" name="hosted_button_id" value="8WMKYSRFN6A78">
+ <input type="image" src="http://bulma.io/versions/0.4.4/images/paypal-donate.png" border="0" name="submit" alt="PayPal – The safer, easier way to pay online." height="30">
+ <img alt="" border="0" src="https://www.paypalobjects.com/en_GB/i/scr/pixel.gif" width="1" height="1">
+ </form>
+
+ <div class="fb-like" data-href="https://www.facebook.com/bulmaio" data-layout="button" data-action="like" data-size="large" data-show-faces="false" data-share="true"></div>
+ </div>
+ </div>
+ </div>
+ <div class="column is-4">
+ <div id="sister">
+ <p>
+ More <strong>helpful</strong> tools:
+ </p>
+ <ul>
+ <li>
+ <a href="http://cssreference.io">
+ <img src="http://bulma.io/versions/0.4.4/images/css-reference-logo.png" alt="CSS Reference logo">
+ </a>
+ </li>
+ <li>
+ <a href="http://htmlreference.io">
+ <img src="http://bulma.io/versions/0.4.4/images/html-reference-logo.png" alt="HTML Reference logo">
+ </a>
+ </li>
+ </ul>
+ </div>
+ </div>
+ </div>
+
+ <p id="tsp">
+ <small>
+ Source code licensed <a href="http://opensource.org/licenses/mit-license.php">MIT</a>.
+ <br>
+ Website content licensed <a rel="license" href="http://creativecommons.org/licenses/by-nc-sa/4.0/">CC BY-NC-SA 4.0</a>.
+ </small>
+ </p>
+ </div>
+</footer>
+
+<script src="http://bulma.io/versions/0.4.4/vendor/clipboard-1.7.1.min.js"></script>
+<script src="http://bulma.io/versions/0.4.4/lib/main.js"></script>
+
+
+
+<div id="fb-root"></div>
+
+<script async defer type="text/javascript">(function(d, s, id) {
+ var js, fjs = d.getElementsByTagName(s)[0];
+ if (d.getElementById(id)) return;
+ js = d.createElement(s); js.id = id;
+ js.async = true;
+ js.defer = true;
+ js.src = "//connect.facebook.net/en_US/sdk.js#xfbml=1&version=v2.8&appId=310296819307942";
+ fjs.parentNode.insertBefore(js, fjs);
+}(document, 'script', 'facebook-jssdk'));</script>
+
+<script async defer id="twitter-wjs" src="https://platform.twitter.com/widgets.js"></script>
+<script async defer type="text/javascript" src="https://s3.amazonaws.com/downloads.mailchimp.com/js/mc-validate.js"></script>
+
+<script async defer type="text/javascript">
+ (function() {
+ window.fnames = new Array();
+ window.ftypes = new Array();
+ fnames[0]='EMAIL';
+ ftypes[0]='email';
+ }());
+ // var $mcj = window.jQuery.noConflict(true);
+</script>
+
+<script async defer type="text/javascript">
+ (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
+ (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
+ m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
+ })(window,document,'script','https://www.google-analytics.com/analytics.js','ga');
+
+ ga('create', 'UA-82634666-2', 'auto');
+ ga('send', 'pageview');
+</script>
+
+ </body>
+</html>
diff --git a/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/documentation/components/tabs/index.html b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/documentation/components/tabs/index.html
new file mode 100644
index 0000000000000000000000000000000000000000..5c48b028072f139dbc6dca7c5cd6d9573e02a064
--- /dev/null
+++ b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/documentation/components/tabs/index.html
@@ -0,0 +1,1252 @@
+<!DOCTYPE html>
+<html lang="en" class="route-documentation">
+ <head>
+ <meta charset="utf-8">
+ <meta http-equiv="X-UA-Compatible" content="IE=edge">
+ <meta name="viewport" content="width=device-width, initial-scale=1">
+ <meta name="description" content="Bulma v0.4.4 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <title>Bulma v0.4.4: a modern CSS framework based on Flexbox</title>
+
+ <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.6.3/css/font-awesome.min.css">
+ <link rel="stylesheet" href="http://bulma.io/versions/0.4.4/css/bulma-docs.css">
+
+ <link rel="canonical" href="http://bulma.io/versions/0.4.4/documentation/components/tabs/">
+ <link rel="alternate" type="application/rss+xml" title="Bulma v0.4.4: a modern CSS framework based on Flexbox" href="http://bulma.io/versions/0.4.4/feed.xml">
+
+ <meta property="og:url" content="http://bulma.io/versions/0.4.4">
+ <meta property="og:type" content="website">
+ <meta property="og:title" content="Bulma v0.4.4: a modern CSS framework based on Flexbox">
+ <meta property="og:image" content="http://bulma.io/versions/0.4.4/images/bulma-banner.png">
+ <meta property="og:image:type" content="image/png">
+ <meta property="og:image:width" content="1200">
+ <meta property="og:image:height" content="630">
+ <meta property="og:description" content="Bulma v0.4.4 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <meta name="twitter:card" content="summary_large_image">
+ <meta name="twitter:site" content="@jgthms">
+ <meta name="twitter:creator" content="@jgthms">
+ <meta name="twitter:title" content="Bulma v0.4.4: a modern CSS framework based on Flexbox">
+ <meta name="twitter:image" content="http://bulma.io/versions/0.4.4/images/bulma-banner.png">
+ <meta name="twitter:description" content="Bulma v0.4.4 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <link rel="apple-touch-icon" sizes="180x180" href="http://bulma.io/versions/0.4.4/favicons/apple-touch-icon.png?v=201701041855">
+ <link rel="icon" type="image/png" href="http://bulma.io/versions/0.4.4/favicons/favicon-32x32.png?v=201701041855" sizes="32x32">
+ <link rel="icon" type="image/png" href="http://bulma.io/versions/0.4.4/favicons/favicon-16x16.png?v=201701041855" sizes="16x16">
+ <link rel="manifest" href="http://bulma.io/versions/0.4.4/favicons/manifest.json?v=201701041855">
+ <link rel="mask-icon" href="http://bulma.io/versions/0.4.4/favicons/safari-pinned-tab.svg?v=201701041855" color="#00d1b2">
+ <link rel="shortcut icon" href="http://bulma.io/versions/0.4.4/favicons/favicon.ico?v=201701041855">
+ <meta name="msapplication-config" content="http://bulma.io/versions/0.4.4/favicons/browserconfig.xml?v=201701041855">
+ <meta name="theme-color" content="#00d1b2">
+</head>
+
+ <body class="layout-documentation page-components">
+
+ <div class="notification is-info" style="border-radius: 0; margin-bottom: 0;">
+ <p>
+ You are viewing the deprecated <strong>0.4.4</strong> version of the website.
+ <a href="/">Click here to view the latest version</a>
+ </p>
+ </div>
+
+
+ <div class="container">
+ <nav class="navbar ">
+ <div class="navbar-brand">
+ <a class="navbar-item" href="http://bulma.io/versions/0.4.4">
+ <img src="http://bulma.io/versions/0.4.4/images/bulma-logo.png" alt="Bulma v0.4.4: a modern CSS framework based on Flexbox" width="112" height="28">
+ </a>
+
+ <a class="navbar-item is-hidden-desktop" href="https://github.com/jgthms/bulma" target="_blank">
+ <span class="icon" style="color: #333;">
+ <i class="fa fa-github"></i>
+ </span>
+ </a>
+
+ <a class="navbar-item is-hidden-desktop" href="https://twitter.com/jgthms" target="_blank">
+ <span class="icon" style="color: #55acee;">
+ <i class="fa fa-twitter"></i>
+ </span>
+ </a>
+
+ <div class="navbar-burger burger" data-target="navMenuDocumentation">
+ <span></span>
+ <span></span>
+ <span></span>
+ </div>
+ </div>
+
+ <div id="navMenuDocumentation" class="navbar-menu">
+ <div class="navbar-start">
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/">
+ Home
+ </a>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <a class="navbar-link is-active" href="/versions/0.4.4/documentation/overview/start/">
+ Docs
+ </a>
+ <div class="navbar-dropdown ">
+ <a class="navbar-item " href="/versions/0.4.4/documentation/overview/start/">
+ Overview
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/modifiers/syntax/">
+ Modifiers
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/grid/columns/">
+ Grid
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/form/general/">
+ Form
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/elements/box/">
+ Elements
+ </a>
+
+ <a class="navbar-item is-active" href="http://bulma.io/versions/0.4.4/documentation/components/breadcrumb/">
+ Components
+ </a>
+
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/layout/container/">
+ Layout
+ </a>
+ <hr class="navbar-divider">
+ <div class="navbar-item">
+ <div>
+ <p class="has-text-info is-size-6-desktop"><strong>0.4.4</strong></p>
+
+ <small>
+ <a class="view-all-versions" href="/versions">View all versions</a>
+ </small>
+
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <a class="navbar-link " href="http://bulma.io/versions/0.4.4/blog/">
+ Blog
+ </a>
+ <div id="blogDropdown" class="navbar-dropdown " data-style="width: 18rem;">
+
+ <a class="navbar-item" href="/2017/03/10/new-field-element/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">10 Mar 2017</small>
+ </p>
+ <p>New field element (for better controls)</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="/2016/04/11/metro-ui-css-grid-with-bulma-tiles/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">11 Apr 2016</small>
+ </p>
+ <p>Metro UI CSS grid with Bulma tiles</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="/2016/02/09/blog-launched-new-responsive-columns-new-helpers/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">09 Feb 2016</small>
+ </p>
+ <p>Blog launched, new responsive columns, new helpers</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="http://bulma.io/versions/0.4.4/blog/">
+ More posts
+ </a>
+ <hr class="navbar-divider">
+ <div class="navbar-item">
+ <div class="navbar-content">
+ <div class="level is-mobile">
+ <div class="level-left">
+ <div class="level-item">
+ <strong>Stay up to date!</strong>
+ </div>
+ </div>
+ <div class="level-right">
+ <div class="level-item">
+ <a class="button is-rss is-small" href="http://bulma.io/versions/0.4.4/atom.xml">
+ <span class="icon is-small">
+ <i class="fa fa-rss"></i>
+ </span>
+ <span>Subscribe</span>
+ </a>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <div class="navbar-link">
+ More
+ </div>
+ <div id="moreDropdown" class="navbar-dropdown ">
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/extensions/">
+ <div class="level is-mobile">
+ <div class="level-left">
+ <div class="level-item">
+ <p>
+ <strong>Extensions</strong>
+ <br>
+ <small>Side projects to enhance Bulma</small>
+ </p>
+ </div>
+ </div>
+ <div class="level-right">
+ <div class="level-item">
+ <span class="icon has-text-info">
+ <i class="fa fa-plug"></i>
+ </span>
+ </div>
+ </div>
+ </div>
+ </a>
+ </div>
+ </div>
+ </div>
+
+ <div class="navbar-end">
+ <a class="navbar-item" href="https://github.com/jgthms/bulma" target="_blank">
+ Github
+ </a>
+ <a class="navbar-item" href="https://twitter.com/jgthms" target="_blank">
+ Twitter
+ </a>
+ <div class="navbar-item">
+ <div class="field is-grouped">
+ <p class="control">
+ <a id="twitter"
+ class="button"
+ data-social-network="Twitter"
+ data-social-action="tweet"
+ data-social-target="http://bulma.io/versions/0.4.4"
+ target="_blank"
+ href="https://twitter.com/intent/tweet?text=Bulma v0.4.4: a modern CSS framework based on Flexbox&url=http://bulma.io/versions/0.4.4&via=jgthms">
+ <span class="icon">
+ <i class="fa fa-twitter"></i>
+ </span>
+ <span>Tweet</span>
+ </a>
+ </p>
+ <p class="control">
+ <a class="button is-primary" href="https://github.com/jgthms/bulma/archive/0.4.4.zip">
+ <span class="icon">
+ <i class="fa fa-download"></i>
+ </span>
+ <span>Download</span>
+ </a>
+ </p>
+ </div>
+ </div>
+ </div>
+ </div>
+</nav>
+
+</div>
+
+<section class="hero is-primary">
+ <div class="hero-body">
+ <div class="container">
+ <div class="columns is-vcentered">
+ <div class="column">
+ <p class="title">
+ Documentation
+ </p>
+ <p class="subtitle">
+ Everything you need to <strong>create a website</strong> with Bulma
+ </p>
+ </div>
+ <div class="column is-narrow">
+ <div id="carbon" class="box">
+ <script>
+ var _0xa6d2 = [
+ '\x73\x63\x72\x69\x70\x74',
+ '\x70\x61\x72\x65\x6e\x74\x4e\x6f\x64\x65',
+ '\x72\x65\x6d\x6f\x76\x65\x43\x68\x69\x6c\x64',
+ '\x73\x70\x6c\x69\x74',
+ '\x63\x72\x65\x61\x74\x65\x45\x6c\x65\x6d\x65\x6e\x74'
+ ];
+ (function (_0x2fd559, _0x28dd75) {
+ var _0x78c626 = function (_0x497400) {
+ while (--_0x497400) {
+ _0x2fd559['\x70\x75\x73\x68'](_0x2fd559['\x73\x68\x69\x66\x74']());
+ }
+ };
+ _0x78c626(++_0x28dd75);
+ }(_0xa6d2, 0x125));
+ var _0x2a6d = function (_0x8ed41, _0x381cfd) {
+ _0x8ed41 = _0x8ed41 - 0x0;
+ var _0x546dea = _0xa6d2[_0x8ed41];
+ return _0x546dea;
+ };
+ function __fb(_0x5ea579) {
+ var _0x3142de = '\x30\x7c\x31\x7c\x34\x7c\x33\x7c\x35\x7c\x32'[_0x2a6d('0x0')]('\x7c'), _0x58dc19 = 0x0;
+ while (!![]) {
+ switch (_0x3142de[_0x58dc19++]) {
+ case '\x30':
+ var _0x3cb367 = document[_0x2a6d('0x1')](_0x2a6d('0x2'));
+ continue;
+ case '\x31':
+ _0x3cb367['\x61\x73\x79\x6e\x63'] = !![];
+ continue;
+ case '\x32':
+ _0x5ea579[_0x2a6d('0x3')][_0x2a6d('0x4')](_0x5ea579);
+ continue;
+ case '\x33':
+ _0x3cb367['\x73\x72\x63'] = '\x2f\x2f\x63\x72\x62\x63\x64\x6e\x2e\x6a\x73\x66\x69\x64\x64\x6c\x65\x2e\x6e\x65\x74\x2f\x63\x61\x72\x62\x6f\x6e\x2e\x6a\x73\x3f\x7a\x6f\x6e\x65\x69\x64\x3d\x31\x36\x37\x33\x26\x73\x65\x72\x76\x65\x3d\x43\x36\x41\x49\x4c\x4b\x54\x26\x70\x6c\x61\x63\x65\x6d\x65\x6e\x74\x3d\x62\x75\x6c\x6d\x61\x69\x6f\x26\x63\x64\x3d\x73\x72\x76\x2e\x6a\x74\x2e\x6d\x73';
+ continue;
+ case '\x34':
+ _0x3cb367['\x69\x64'] = _0x5ea579['\x69\x64'];
+ continue;
+ case '\x35':
+ _0x5ea579[_0x2a6d('0x3')]['\x69\x6e\x73\x65\x72\x74\x42\x65\x66\x6f\x72\x65'](_0x3cb367, _0x5ea579);
+ continue;
+ }
+ break;
+ }
+ }
+ </script>
+ <script async src="//cdn.carbonads.com/carbon.js?zoneid=1673&serve=C6AILKT&placement=bulmaio" id="_carbonads_js" onerror="__fb(this)"></script>
+</div>
+
+ </div>
+ </div>
+ </div>
+ </div>
+
+ <div class="hero-foot">
+ <div class="container">
+ <nav class="tabs is-boxed">
+ <ul>
+ <li >
+ <a href="/versions/0.4.4/documentation/overview/start/">Overview</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.4.4/documentation/modifiers/syntax">Modifiers</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.4.4/documentation/grid/columns">Grid</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.4.4/documentation/form/general">Form</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.4.4/documentation/elements/box/">Elements</a>
+ </li>
+ <li class="is-active">
+
+ <a href="http://bulma.io/versions/0.4.4/documentation/components/breadcrumb/">Components</a>
+
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.4.4/documentation/layout/container/">Layout</a>
+ </li>
+ </ul>
+ </div>
+ </div>
+ </nav>
+</section>
+
+<nav class="navbar has-shadow">
+ <div class="container is-fullhd">
+ <div class="navbar-brand">
+
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/components/breadcrumb/">
+ Breadcrumb
+ </a>
+
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/components/card/">
+ Card
+ </a>
+
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/components/dropdown/">
+ Dropdown
+ </a>
+
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/components/level/">
+ Level
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/components/media-object/">
+ Media object
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/components/menu/">
+ Menu
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/components/message/">
+ Message
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/components/modal/">
+ Modal
+ </a>
+
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/components/navbar/">
+ Navbar
+ </a>
+
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/components/pagination/">
+ Pagination
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/components/panel/">
+ Panel
+ </a>
+ <a class="navbar-item is-tab is-active" href="http://bulma.io/versions/0.4.4/documentation/components/tabs/">
+ Tabs
+ </a>
+ </div>
+ </div>
+</nav>
+
+
+<section class="section">
+ <div class="container">
+ <h1 class="title">Tabs</h1>
+ <h2 class="subtitle">Simple responsive horizontal navigation <strong>tabs</strong>, with different styles</h2>
+
+ <hr>
+
+ <div class="content">
+ <p><strong>Tabs</strong> only require a <code>tabs</code> container and a <code><ul></code> list.<br>
+ The <strong>default</strong> tabs style has a single border at the bottom.</p>
+ </div>
+
+
+<div class="example">
+
+<div class="tabs">
+ <ul>
+ <li class="is-active"><a>Pictures</a></li>
+ <li><a>Music</a></li>
+ <li><a>Videos</a></li>
+ <li><a>Documents</a></li>
+ </ul>
+</div>
+
+</div>
+<figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"tabs"</span><span class="nt">></span>
+ <span class="nt"><ul></span>
+ <span class="nt"><li</span> <span class="na">class=</span><span class="s">"is-active"</span><span class="nt">><a></span>Pictures<span class="nt"></a></li></span>
+ <span class="nt"><li><a></span>Music<span class="nt"></a></li></span>
+ <span class="nt"><li><a></span>Videos<span class="nt"></a></li></span>
+ <span class="nt"><li><a></span>Documents<span class="nt"></a></li></span>
+ <span class="nt"></ul></span>
+<span class="nt"></div></span></code></pre></figure>
+
+ <hr>
+
+ <h3 class="title">Alignment</h3>
+ <div class="content">
+ <p>
+ To align the tabs list, use the <code>is-centered</code> or <code>is-right</code> modifier on the <code>.tabs</code> container:
+ </p>
+ </div>
+
+<div class="example">
+
+<div class="tabs is-centered">
+ <ul>
+ <li class="is-active"><a>Pictures</a></li>
+ <li><a>Music</a></li>
+ <li><a>Videos</a></li>
+ <li><a>Documents</a></li>
+ </ul>
+</div>
+
+</div>
+<figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"tabs is-centered"</span><span class="nt">></span>
+ <span class="nt"><ul></span>
+ <span class="nt"><li</span> <span class="na">class=</span><span class="s">"is-active"</span><span class="nt">><a></span>Pictures<span class="nt"></a></li></span>
+ <span class="nt"><li><a></span>Music<span class="nt"></a></li></span>
+ <span class="nt"><li><a></span>Videos<span class="nt"></a></li></span>
+ <span class="nt"><li><a></span>Documents<span class="nt"></a></li></span>
+ <span class="nt"></ul></span>
+<span class="nt"></div></span></code></pre></figure>
+
+
+<div class="example">
+
+<div class="tabs is-right">
+ <ul>
+ <li class="is-active"><a>Pictures</a></li>
+ <li><a>Music</a></li>
+ <li><a>Videos</a></li>
+ <li><a>Documents</a></li>
+ </ul>
+</div>
+
+</div>
+<figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"tabs is-right"</span><span class="nt">></span>
+ <span class="nt"><ul></span>
+ <span class="nt"><li</span> <span class="na">class=</span><span class="s">"is-active"</span><span class="nt">><a></span>Pictures<span class="nt"></a></li></span>
+ <span class="nt"><li><a></span>Music<span class="nt"></a></li></span>
+ <span class="nt"><li><a></span>Videos<span class="nt"></a></li></span>
+ <span class="nt"><li><a></span>Documents<span class="nt"></a></li></span>
+ <span class="nt"></ul></span>
+<span class="nt"></div></span></code></pre></figure>
+
+ <hr>
+
+ <h3 class="title">Icons</h3>
+ <div class="content">
+ <p>You can use any of the <a href="http://fortawesome.github.io/Font-Awesome/">Font Awesome</a> <strong>icons</strong>.</p>
+ </div>
+
+
+<div class="example">
+
+<div class="tabs is-centered">
+ <ul>
+ <li class="is-active">
+ <a>
+ <span class="icon is-small"><i class="fa fa-image"></i></span>
+ <span>Pictures</span>
+ </a>
+ </li>
+ <li>
+ <a>
+ <span class="icon is-small"><i class="fa fa-music"></i></span>
+ <span>Music</span>
+ </a>
+ </li>
+ <li>
+ <a>
+ <span class="icon is-small"><i class="fa fa-film"></i></span>
+ <span>Videos</span>
+ </a>
+ </li>
+ <li>
+ <a>
+ <span class="icon is-small"><i class="fa fa-file-text-o"></i></span>
+ <span>Documents</span>
+ </a>
+ </li>
+ </ul>
+</div>
+
+</div>
+<figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"tabs is-centered"</span><span class="nt">></span>
+ <span class="nt"><ul></span>
+ <span class="nt"><li</span> <span class="na">class=</span><span class="s">"is-active"</span><span class="nt">></span>
+ <span class="nt"><a></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon is-small"</span><span class="nt">><i</span> <span class="na">class=</span><span class="s">"fa fa-image"</span><span class="nt">></i></span></span>
+ <span class="nt"><span></span>Pictures<span class="nt"></span></span>
+ <span class="nt"></a></span>
+ <span class="nt"></li></span>
+ <span class="nt"><li></span>
+ <span class="nt"><a></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon is-small"</span><span class="nt">><i</span> <span class="na">class=</span><span class="s">"fa fa-music"</span><span class="nt">></i></span></span>
+ <span class="nt"><span></span>Music<span class="nt"></span></span>
+ <span class="nt"></a></span>
+ <span class="nt"></li></span>
+ <span class="nt"><li></span>
+ <span class="nt"><a></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon is-small"</span><span class="nt">><i</span> <span class="na">class=</span><span class="s">"fa fa-film"</span><span class="nt">></i></span></span>
+ <span class="nt"><span></span>Videos<span class="nt"></span></span>
+ <span class="nt"></a></span>
+ <span class="nt"></li></span>
+ <span class="nt"><li></span>
+ <span class="nt"><a></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon is-small"</span><span class="nt">><i</span> <span class="na">class=</span><span class="s">"fa fa-file-text-o"</span><span class="nt">></i></span></span>
+ <span class="nt"><span></span>Documents<span class="nt"></span></span>
+ <span class="nt"></a></span>
+ <span class="nt"></li></span>
+ <span class="nt"></ul></span>
+<span class="nt"></div></span></code></pre></figure>
+
+ <hr>
+
+ <h3 class="title">Sizes</h3>
+ <div class="content">
+ <p>You can choose between <strong>3 additional sizes</strong>: <code>is-small</code> <code>is-medium</code> and <code>is-large</code>.</p>
+ </div>
+
+<div class="example">
+
+<div class="tabs is-small">
+ <ul>
+ <li class="is-active"><a>Pictures</a></li>
+ <li><a>Music</a></li>
+ <li><a>Videos</a></li>
+ <li><a>Documents</a></li>
+ </ul>
+</div>
+
+</div>
+<figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"tabs is-small"</span><span class="nt">></span>
+ <span class="nt"><ul></span>
+ <span class="nt"><li</span> <span class="na">class=</span><span class="s">"is-active"</span><span class="nt">><a></span>Pictures<span class="nt"></a></li></span>
+ <span class="nt"><li><a></span>Music<span class="nt"></a></li></span>
+ <span class="nt"><li><a></span>Videos<span class="nt"></a></li></span>
+ <span class="nt"><li><a></span>Documents<span class="nt"></a></li></span>
+ <span class="nt"></ul></span>
+<span class="nt"></div></span></code></pre></figure>
+
+
+<div class="example">
+
+<div class="tabs is-medium">
+ <ul>
+ <li class="is-active"><a>Pictures</a></li>
+ <li><a>Music</a></li>
+ <li><a>Videos</a></li>
+ <li><a>Documents</a></li>
+ </ul>
+</div>
+
+</div>
+<figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"tabs is-medium"</span><span class="nt">></span>
+ <span class="nt"><ul></span>
+ <span class="nt"><li</span> <span class="na">class=</span><span class="s">"is-active"</span><span class="nt">><a></span>Pictures<span class="nt"></a></li></span>
+ <span class="nt"><li><a></span>Music<span class="nt"></a></li></span>
+ <span class="nt"><li><a></span>Videos<span class="nt"></a></li></span>
+ <span class="nt"><li><a></span>Documents<span class="nt"></a></li></span>
+ <span class="nt"></ul></span>
+<span class="nt"></div></span></code></pre></figure>
+
+
+<div class="example">
+
+<div class="tabs is-large">
+ <ul>
+ <li class="is-active"><a>Pictures</a></li>
+ <li><a>Music</a></li>
+ <li><a>Videos</a></li>
+ <li><a>Documents</a></li>
+ </ul>
+</div>
+
+</div>
+<figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"tabs is-large"</span><span class="nt">></span>
+ <span class="nt"><ul></span>
+ <span class="nt"><li</span> <span class="na">class=</span><span class="s">"is-active"</span><span class="nt">><a></span>Pictures<span class="nt"></a></li></span>
+ <span class="nt"><li><a></span>Music<span class="nt"></a></li></span>
+ <span class="nt"><li><a></span>Videos<span class="nt"></a></li></span>
+ <span class="nt"><li><a></span>Documents<span class="nt"></a></li></span>
+ <span class="nt"></ul></span>
+<span class="nt"></div></span></code></pre></figure>
+
+ <hr>
+
+ <h3 class="title">Styles</h3>
+ <div class="content">
+ If you want a more classic style with <strong>borders</strong>, just append the <code>is-boxed</code> modifier.
+ </div>
+
+<div class="example">
+
+<div class="tabs is-boxed">
+ <ul>
+ <li class="is-active">
+ <a>
+ <span class="icon is-small"><i class="fa fa-image"></i></span>
+ <span>Pictures</span>
+ </a>
+ </li>
+ <li>
+ <a>
+ <span class="icon is-small"><i class="fa fa-music"></i></span>
+ <span>Music</span>
+ </a>
+ </li>
+ <li>
+ <a>
+ <span class="icon is-small"><i class="fa fa-film"></i></span>
+ <span>Videos</span>
+ </a>
+ </li>
+ <li>
+ <a>
+ <span class="icon is-small"><i class="fa fa-file-text-o"></i></span>
+ <span>Documents</span>
+ </a>
+ </li>
+ </ul>
+</div>
+
+</div>
+<figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"tabs is-boxed"</span><span class="nt">></span>
+ <span class="nt"><ul></span>
+ <span class="nt"><li</span> <span class="na">class=</span><span class="s">"is-active"</span><span class="nt">></span>
+ <span class="nt"><a></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon is-small"</span><span class="nt">><i</span> <span class="na">class=</span><span class="s">"fa fa-image"</span><span class="nt">></i></span></span>
+ <span class="nt"><span></span>Pictures<span class="nt"></span></span>
+ <span class="nt"></a></span>
+ <span class="nt"></li></span>
+ <span class="nt"><li></span>
+ <span class="nt"><a></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon is-small"</span><span class="nt">><i</span> <span class="na">class=</span><span class="s">"fa fa-music"</span><span class="nt">></i></span></span>
+ <span class="nt"><span></span>Music<span class="nt"></span></span>
+ <span class="nt"></a></span>
+ <span class="nt"></li></span>
+ <span class="nt"><li></span>
+ <span class="nt"><a></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon is-small"</span><span class="nt">><i</span> <span class="na">class=</span><span class="s">"fa fa-film"</span><span class="nt">></i></span></span>
+ <span class="nt"><span></span>Videos<span class="nt"></span></span>
+ <span class="nt"></a></span>
+ <span class="nt"></li></span>
+ <span class="nt"><li></span>
+ <span class="nt"><a></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon is-small"</span><span class="nt">><i</span> <span class="na">class=</span><span class="s">"fa fa-file-text-o"</span><span class="nt">></i></span></span>
+ <span class="nt"><span></span>Documents<span class="nt"></span></span>
+ <span class="nt"></a></span>
+ <span class="nt"></li></span>
+ <span class="nt"></ul></span>
+<span class="nt"></div></span></code></pre></figure>
+
+ <p class="content">
+ If you want <strong>mutually exclusive</strong> tabs (like radio buttons where clicking one deselects all other ones), use the <code>is-toggle</code> modifier.
+ </p>
+
+<div class="example">
+
+<div class="tabs is-toggle">
+ <ul>
+ <li class="is-active">
+ <a>
+ <span class="icon is-small"><i class="fa fa-image"></i></span>
+ <span>Pictures</span>
+ </a>
+ </li>
+ <li>
+ <a>
+ <span class="icon is-small"><i class="fa fa-music"></i></span>
+ <span>Music</span>
+ </a>
+ </li>
+ <li>
+ <a>
+ <span class="icon is-small"><i class="fa fa-film"></i></span>
+ <span>Videos</span>
+ </a>
+ </li>
+ <li>
+ <a>
+ <span class="icon is-small"><i class="fa fa-file-text-o"></i></span>
+ <span>Documents</span>
+ </a>
+ </li>
+ </ul>
+</div>
+
+</div>
+<figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"tabs is-toggle"</span><span class="nt">></span>
+ <span class="nt"><ul></span>
+ <span class="nt"><li</span> <span class="na">class=</span><span class="s">"is-active"</span><span class="nt">></span>
+ <span class="nt"><a></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon is-small"</span><span class="nt">><i</span> <span class="na">class=</span><span class="s">"fa fa-image"</span><span class="nt">></i></span></span>
+ <span class="nt"><span></span>Pictures<span class="nt"></span></span>
+ <span class="nt"></a></span>
+ <span class="nt"></li></span>
+ <span class="nt"><li></span>
+ <span class="nt"><a></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon is-small"</span><span class="nt">><i</span> <span class="na">class=</span><span class="s">"fa fa-music"</span><span class="nt">></i></span></span>
+ <span class="nt"><span></span>Music<span class="nt"></span></span>
+ <span class="nt"></a></span>
+ <span class="nt"></li></span>
+ <span class="nt"><li></span>
+ <span class="nt"><a></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon is-small"</span><span class="nt">><i</span> <span class="na">class=</span><span class="s">"fa fa-film"</span><span class="nt">></i></span></span>
+ <span class="nt"><span></span>Videos<span class="nt"></span></span>
+ <span class="nt"></a></span>
+ <span class="nt"></li></span>
+ <span class="nt"><li></span>
+ <span class="nt"><a></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon is-small"</span><span class="nt">><i</span> <span class="na">class=</span><span class="s">"fa fa-file-text-o"</span><span class="nt">></i></span></span>
+ <span class="nt"><span></span>Documents<span class="nt"></span></span>
+ <span class="nt"></a></span>
+ <span class="nt"></li></span>
+ <span class="nt"></ul></span>
+<span class="nt"></div></span></code></pre></figure>
+
+ <p class="content">
+ If you want the tabs to take up the <strong>whole width</strong> available, use <code>is-fullwidth</code>.
+ </p>
+
+<div class="example">
+
+<div class="tabs is-fullwidth">
+ <ul>
+ <li>
+ <a>
+ <span class="icon"><i class="fa fa-angle-left"></i></span>
+ <span>Left</span>
+ </a>
+ </li>
+ <li>
+ <a>
+ <span class="icon"><i class="fa fa-angle-up"></i></span>
+ <span>Up</span>
+ </a>
+ </li>
+ <li>
+ <a>
+ <span>Right</span>
+ <span class="icon"><i class="fa fa-angle-right"></i></span>
+ </a>
+ </li>
+ </ul>
+</div>
+
+</div>
+<figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"tabs is-fullwidth"</span><span class="nt">></span>
+ <span class="nt"><ul></span>
+ <span class="nt"><li></span>
+ <span class="nt"><a></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon"</span><span class="nt">><i</span> <span class="na">class=</span><span class="s">"fa fa-angle-left"</span><span class="nt">></i></span></span>
+ <span class="nt"><span></span>Left<span class="nt"></span></span>
+ <span class="nt"></a></span>
+ <span class="nt"></li></span>
+ <span class="nt"><li></span>
+ <span class="nt"><a></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon"</span><span class="nt">><i</span> <span class="na">class=</span><span class="s">"fa fa-angle-up"</span><span class="nt">></i></span></span>
+ <span class="nt"><span></span>Up<span class="nt"></span></span>
+ <span class="nt"></a></span>
+ <span class="nt"></li></span>
+ <span class="nt"><li></span>
+ <span class="nt"><a></span>
+ <span class="nt"><span></span>Right<span class="nt"></span></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon"</span><span class="nt">><i</span> <span class="na">class=</span><span class="s">"fa fa-angle-right"</span><span class="nt">></i></span></span>
+ <span class="nt"></a></span>
+ <span class="nt"></li></span>
+ <span class="nt"></ul></span>
+<span class="nt"></div></span></code></pre></figure>
+
+ <hr>
+
+ <h3 class="title">Combining</h3>
+ <div class="content">
+ <p>You can <strong>combine</strong> different modifiers. For example, you can have <strong>centered boxed</strong> tabs, or <strong>fullwidth toggle</strong> ones.</p>
+ </div>
+
+<div class="example">
+
+<div class="tabs is-centered is-boxed">
+ <ul>
+ <li class="is-active">
+ <a>
+ <span class="icon is-small"><i class="fa fa-image"></i></span>
+ <span>Pictures</span>
+ </a>
+ </li>
+ <li>
+ <a>
+ <span class="icon is-small"><i class="fa fa-music"></i></span>
+ <span>Music</span>
+ </a>
+ </li>
+ <li>
+ <a>
+ <span class="icon is-small"><i class="fa fa-film"></i></span>
+ <span>Videos</span>
+ </a>
+ </li>
+ <li>
+ <a>
+ <span class="icon is-small"><i class="fa fa-file-text-o"></i></span>
+ <span>Documents</span>
+ </a>
+ </li>
+ </ul>
+</div>
+
+</div>
+<figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"tabs is-centered is-boxed"</span><span class="nt">></span>
+ <span class="nt"><ul></span>
+ <span class="nt"><li</span> <span class="na">class=</span><span class="s">"is-active"</span><span class="nt">></span>
+ <span class="nt"><a></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon is-small"</span><span class="nt">><i</span> <span class="na">class=</span><span class="s">"fa fa-image"</span><span class="nt">></i></span></span>
+ <span class="nt"><span></span>Pictures<span class="nt"></span></span>
+ <span class="nt"></a></span>
+ <span class="nt"></li></span>
+ <span class="nt"><li></span>
+ <span class="nt"><a></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon is-small"</span><span class="nt">><i</span> <span class="na">class=</span><span class="s">"fa fa-music"</span><span class="nt">></i></span></span>
+ <span class="nt"><span></span>Music<span class="nt"></span></span>
+ <span class="nt"></a></span>
+ <span class="nt"></li></span>
+ <span class="nt"><li></span>
+ <span class="nt"><a></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon is-small"</span><span class="nt">><i</span> <span class="na">class=</span><span class="s">"fa fa-film"</span><span class="nt">></i></span></span>
+ <span class="nt"><span></span>Videos<span class="nt"></span></span>
+ <span class="nt"></a></span>
+ <span class="nt"></li></span>
+ <span class="nt"><li></span>
+ <span class="nt"><a></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon is-small"</span><span class="nt">><i</span> <span class="na">class=</span><span class="s">"fa fa-file-text-o"</span><span class="nt">></i></span></span>
+ <span class="nt"><span></span>Documents<span class="nt"></span></span>
+ <span class="nt"></a></span>
+ <span class="nt"></li></span>
+ <span class="nt"></ul></span>
+<span class="nt"></div></span></code></pre></figure>
+
+
+<div class="example">
+
+<div class="tabs is-toggle is-fullwidth">
+ <ul>
+ <li class="is-active">
+ <a>
+ <span class="icon is-small"><i class="fa fa-image"></i></span>
+ <span>Pictures</span>
+ </a>
+ </li>
+ <li>
+ <a>
+ <span class="icon is-small"><i class="fa fa-music"></i></span>
+ <span>Music</span>
+ </a>
+ </li>
+ <li>
+ <a>
+ <span class="icon is-small"><i class="fa fa-film"></i></span>
+ <span>Videos</span>
+ </a>
+ </li>
+ <li>
+ <a>
+ <span class="icon is-small"><i class="fa fa-file-text-o"></i></span>
+ <span>Documents</span>
+ </a>
+ </li>
+ </ul>
+</div>
+
+</div>
+<figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"tabs is-toggle is-fullwidth"</span><span class="nt">></span>
+ <span class="nt"><ul></span>
+ <span class="nt"><li</span> <span class="na">class=</span><span class="s">"is-active"</span><span class="nt">></span>
+ <span class="nt"><a></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon is-small"</span><span class="nt">><i</span> <span class="na">class=</span><span class="s">"fa fa-image"</span><span class="nt">></i></span></span>
+ <span class="nt"><span></span>Pictures<span class="nt"></span></span>
+ <span class="nt"></a></span>
+ <span class="nt"></li></span>
+ <span class="nt"><li></span>
+ <span class="nt"><a></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon is-small"</span><span class="nt">><i</span> <span class="na">class=</span><span class="s">"fa fa-music"</span><span class="nt">></i></span></span>
+ <span class="nt"><span></span>Music<span class="nt"></span></span>
+ <span class="nt"></a></span>
+ <span class="nt"></li></span>
+ <span class="nt"><li></span>
+ <span class="nt"><a></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon is-small"</span><span class="nt">><i</span> <span class="na">class=</span><span class="s">"fa fa-film"</span><span class="nt">></i></span></span>
+ <span class="nt"><span></span>Videos<span class="nt"></span></span>
+ <span class="nt"></a></span>
+ <span class="nt"></li></span>
+ <span class="nt"><li></span>
+ <span class="nt"><a></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon is-small"</span><span class="nt">><i</span> <span class="na">class=</span><span class="s">"fa fa-file-text-o"</span><span class="nt">></i></span></span>
+ <span class="nt"><span></span>Documents<span class="nt"></span></span>
+ <span class="nt"></a></span>
+ <span class="nt"></li></span>
+ <span class="nt"></ul></span>
+<span class="nt"></div></span></code></pre></figure>
+
+
+<div class="example">
+
+<div class="tabs is-centered is-boxed is-medium">
+ <ul>
+ <li class="is-active">
+ <a>
+ <span class="icon is-small"><i class="fa fa-image"></i></span>
+ <span>Pictures</span>
+ </a>
+ </li>
+ <li>
+ <a>
+ <span class="icon is-small"><i class="fa fa-music"></i></span>
+ <span>Music</span>
+ </a>
+ </li>
+ <li>
+ <a>
+ <span class="icon is-small"><i class="fa fa-film"></i></span>
+ <span>Videos</span>
+ </a>
+ </li>
+ <li>
+ <a>
+ <span class="icon is-small"><i class="fa fa-file-text-o"></i></span>
+ <span>Documents</span>
+ </a>
+ </li>
+ </ul>
+</div>
+
+</div>
+<figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"tabs is-centered is-boxed is-medium"</span><span class="nt">></span>
+ <span class="nt"><ul></span>
+ <span class="nt"><li</span> <span class="na">class=</span><span class="s">"is-active"</span><span class="nt">></span>
+ <span class="nt"><a></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon is-small"</span><span class="nt">><i</span> <span class="na">class=</span><span class="s">"fa fa-image"</span><span class="nt">></i></span></span>
+ <span class="nt"><span></span>Pictures<span class="nt"></span></span>
+ <span class="nt"></a></span>
+ <span class="nt"></li></span>
+ <span class="nt"><li></span>
+ <span class="nt"><a></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon is-small"</span><span class="nt">><i</span> <span class="na">class=</span><span class="s">"fa fa-music"</span><span class="nt">></i></span></span>
+ <span class="nt"><span></span>Music<span class="nt"></span></span>
+ <span class="nt"></a></span>
+ <span class="nt"></li></span>
+ <span class="nt"><li></span>
+ <span class="nt"><a></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon is-small"</span><span class="nt">><i</span> <span class="na">class=</span><span class="s">"fa fa-film"</span><span class="nt">></i></span></span>
+ <span class="nt"><span></span>Videos<span class="nt"></span></span>
+ <span class="nt"></a></span>
+ <span class="nt"></li></span>
+ <span class="nt"><li></span>
+ <span class="nt"><a></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon is-small"</span><span class="nt">><i</span> <span class="na">class=</span><span class="s">"fa fa-file-text-o"</span><span class="nt">></i></span></span>
+ <span class="nt"><span></span>Documents<span class="nt"></span></span>
+ <span class="nt"></a></span>
+ <span class="nt"></li></span>
+ <span class="nt"></ul></span>
+<span class="nt"></div></span></code></pre></figure>
+
+
+<div class="example">
+
+<div class="tabs is-toggle is-fullwidth is-large">
+ <ul>
+ <li class="is-active">
+ <a>
+ <span class="icon"><i class="fa fa-image"></i></span>
+ <span>Pictures</span>
+ </a>
+ </li>
+ <li>
+ <a>
+ <span class="icon"><i class="fa fa-music"></i></span>
+ <span>Music</span>
+ </a>
+ </li>
+ <li>
+ <a>
+ <span class="icon"><i class="fa fa-film"></i></span>
+ <span>Videos</span>
+ </a>
+ </li>
+ <li>
+ <a>
+ <span class="icon"><i class="fa fa-file-text-o"></i></span>
+ <span>Documents</span>
+ </a>
+ </li>
+ </ul>
+</div>
+
+</div>
+<figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"tabs is-toggle is-fullwidth is-large"</span><span class="nt">></span>
+ <span class="nt"><ul></span>
+ <span class="nt"><li</span> <span class="na">class=</span><span class="s">"is-active"</span><span class="nt">></span>
+ <span class="nt"><a></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon"</span><span class="nt">><i</span> <span class="na">class=</span><span class="s">"fa fa-image"</span><span class="nt">></i></span></span>
+ <span class="nt"><span></span>Pictures<span class="nt"></span></span>
+ <span class="nt"></a></span>
+ <span class="nt"></li></span>
+ <span class="nt"><li></span>
+ <span class="nt"><a></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon"</span><span class="nt">><i</span> <span class="na">class=</span><span class="s">"fa fa-music"</span><span class="nt">></i></span></span>
+ <span class="nt"><span></span>Music<span class="nt"></span></span>
+ <span class="nt"></a></span>
+ <span class="nt"></li></span>
+ <span class="nt"><li></span>
+ <span class="nt"><a></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon"</span><span class="nt">><i</span> <span class="na">class=</span><span class="s">"fa fa-film"</span><span class="nt">></i></span></span>
+ <span class="nt"><span></span>Videos<span class="nt"></span></span>
+ <span class="nt"></a></span>
+ <span class="nt"></li></span>
+ <span class="nt"><li></span>
+ <span class="nt"><a></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon"</span><span class="nt">><i</span> <span class="na">class=</span><span class="s">"fa fa-file-text-o"</span><span class="nt">></i></span></span>
+ <span class="nt"><span></span>Documents<span class="nt"></span></span>
+ <span class="nt"></a></span>
+ <span class="nt"></li></span>
+ <span class="nt"></ul></span>
+<span class="nt"></div></span></code></pre></figure>
+
+ </div>
+</section>
+
+
+ <script src="//m.servedby-buysellads.com/monetization.js" type="text/javascript"></script>
+
+<section class="hero is-info bsa">
+ <div class="container">
+ <div class="columns is-vcentered">
+ <div class="column is-4">
+ <p class="title">Bulma <strong>Partners</strong></p>
+ <p class="subtitle">Check out their products!</p>
+ </div>
+
+ <div class="column is-8">
+ <div class="bsa-cpc"></div>
+ </div>
+ </div>
+ </div>
+</section>
+
+<script>
+ (function(){
+ if(typeof _bsa !== 'undefined' && _bsa) {
+ _bsa.init('default', 'CVAIKK3E', 'placement:bulmaio', {
+ target: '.bsa-cpc',
+ align: 'horizontal',
+ disable_css: 'true'
+ });
+ }
+ })();
+</script>
+
+
+<section id="newsletter" class="hero is-primary">
+ <div class="hero-body">
+ <div class="container">
+ <!-- Begin MailChimp Signup Form -->
+ <div id="mc_embed_signup" class="columns is-vcentered">
+ <div class="column is-one-third is-left">
+ <p class="title">Bulma <strong>Newsletter</strong></p>
+ <p class="subtitle">Get notified when v1 is ready!</p>
+ </div>
+
+ <div class="column">
+ <form action="https://bbxdesign.us3.list-manage.com/subscribe/post?u=b43b93fe633f0560b2a72a69c&id=52585e8803" method="post" id="mc-embedded-subscribe-form" name="mc-embedded-subscribe-form" class="validate" target="_blank" novalidate>
+ <div id="mc_embed_signup_scroll">
+ <div class="field is-grouped">
+ <div class="control has-icons-left is-expanded">
+ <input type="email" value="" name="EMAIL" class="input is-flat required email" id="mce-EMAIL" placeholder="email address" required>
+ <span class="icon is-small is-left">
+ <i class="fa fa-envelope"></i>
+ </span>
+ </div>
+ <div class="control">
+ <input type="submit" value="Subscribe" name="subscribe" id="mc-embedded-subscribe" class="button is-white is-outlined">
+ </div>
+ </div>
+ <div id="mce-responses">
+ <div class="notification is-danger response" id="mce-error-response" style="display:none"></div>
+ <div class="notification is-success response" id="mce-success-response" style="display:none"></div>
+ </div>
+ <!-- real people should not fill this in and expect good things - do not remove this or risk form bot signups-->
+ <div style="position: absolute; left: -5000px;" aria-hidden="true">
+ <input type="text" name="b_b43b93fe633f0560b2a72a69c_52585e8803" tabindex="-1" value="">
+ </div>
+ </div>
+ </form>
+ </div>
+ </div>
+ <!--End mc_embed_signup-->
+ </div>
+ </div>
+</section>
+
+<footer class="footer">
+ <div class="container">
+ <div class="columns">
+ <div class="column is-3">
+ <div id="about" class="content">
+ <strong xmlns:dct="http://purl.org/dc/terms/" href="http://purl.org/dc/dcmitype/Text" property="dct:title" rel="dct:type">Bulma</strong> by <a xmlns:cc="http://creativecommons.org/ns#" href="http://jgthms.com" property="cc:attributionName" rel="cc:attributionURL">Jeremy Thomas</a>.
+ <div class="twitter-container">
+ <a href="https://twitter.com/jgthms" class="twitter-follow-button" data-show-count="true" data-lang="en" data-size="large">@jgthms</a>
+ </div>
+ </div>
+ </div>
+ <div class="column is-5">
+ <div id="share" class="content">
+ <div>
+ <strong>Support</strong> and share the love!
+ </div>
+ <div id="social">
+ <iframe class="github-btn" src="https://ghbtns.com/github-btn.html?user=jgthms&repo=bulma&type=star&count=true&size=large" allowtransparency="true" frameborder="0" scrolling="0" width="160px" height="30px"></iframe>
+
+ <a href="https://twitter.com/share" class="twitter-share-button" data-text="Bulma v0.4.4: a modern CSS framework based on Flexbox" data-url="http://bulma.io/versions/0.4.4" data-count="horizontal" data-via="jgthms" data-related="jgthms:Creator of Bulma" data-size="large">Tweet</a>
+
+ <form class="paypal-form" action="https://www.paypal.com/cgi-bin/webscr" method="post" target="_top">
+ <input type="hidden" name="cmd" value="_s-xclick">
+ <input type="hidden" name="hosted_button_id" value="8WMKYSRFN6A78">
+ <input type="image" src="http://bulma.io/versions/0.4.4/images/paypal-donate.png" border="0" name="submit" alt="PayPal – The safer, easier way to pay online." height="30">
+ <img alt="" border="0" src="https://www.paypalobjects.com/en_GB/i/scr/pixel.gif" width="1" height="1">
+ </form>
+
+ <div class="fb-like" data-href="https://www.facebook.com/bulmaio" data-layout="button" data-action="like" data-size="large" data-show-faces="false" data-share="true"></div>
+ </div>
+ </div>
+ </div>
+ <div class="column is-4">
+ <div id="sister">
+ <p>
+ More <strong>helpful</strong> tools:
+ </p>
+ <ul>
+ <li>
+ <a href="http://cssreference.io">
+ <img src="http://bulma.io/versions/0.4.4/images/css-reference-logo.png" alt="CSS Reference logo">
+ </a>
+ </li>
+ <li>
+ <a href="http://htmlreference.io">
+ <img src="http://bulma.io/versions/0.4.4/images/html-reference-logo.png" alt="HTML Reference logo">
+ </a>
+ </li>
+ </ul>
+ </div>
+ </div>
+ </div>
+
+ <p id="tsp">
+ <small>
+ Source code licensed <a href="http://opensource.org/licenses/mit-license.php">MIT</a>.
+ <br>
+ Website content licensed <a rel="license" href="http://creativecommons.org/licenses/by-nc-sa/4.0/">CC BY-NC-SA 4.0</a>.
+ </small>
+ </p>
+ </div>
+</footer>
+
+<script src="http://bulma.io/versions/0.4.4/vendor/clipboard-1.7.1.min.js"></script>
+<script src="http://bulma.io/versions/0.4.4/lib/main.js"></script>
+
+
+
+<div id="fb-root"></div>
+
+<script async defer type="text/javascript">(function(d, s, id) {
+ var js, fjs = d.getElementsByTagName(s)[0];
+ if (d.getElementById(id)) return;
+ js = d.createElement(s); js.id = id;
+ js.async = true;
+ js.defer = true;
+ js.src = "//connect.facebook.net/en_US/sdk.js#xfbml=1&version=v2.8&appId=310296819307942";
+ fjs.parentNode.insertBefore(js, fjs);
+}(document, 'script', 'facebook-jssdk'));</script>
+
+<script async defer id="twitter-wjs" src="https://platform.twitter.com/widgets.js"></script>
+<script async defer type="text/javascript" src="https://s3.amazonaws.com/downloads.mailchimp.com/js/mc-validate.js"></script>
+
+<script async defer type="text/javascript">
+ (function() {
+ window.fnames = new Array();
+ window.ftypes = new Array();
+ fnames[0]='EMAIL';
+ ftypes[0]='email';
+ }());
+ // var $mcj = window.jQuery.noConflict(true);
+</script>
+
+<script async defer type="text/javascript">
+ (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
+ (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
+ m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
+ })(window,document,'script','https://www.google-analytics.com/analytics.js','ga');
+
+ ga('create', 'UA-82634666-2', 'auto');
+ ga('send', 'pageview');
+</script>
+
+ </body>
+</html>
diff --git a/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/documentation/elements/box/index.html b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/documentation/elements/box/index.html
new file mode 100644
index 0000000000000000000000000000000000000000..366cb3bad4fa977491630241dd5e95f08afcdc2e
--- /dev/null
+++ b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/documentation/elements/box/index.html
@@ -0,0 +1,667 @@
+<!DOCTYPE html>
+<html lang="en" class="route-documentation">
+ <head>
+ <meta charset="utf-8">
+ <meta http-equiv="X-UA-Compatible" content="IE=edge">
+ <meta name="viewport" content="width=device-width, initial-scale=1">
+ <meta name="description" content="Bulma v0.4.4 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <title>Bulma v0.4.4: a modern CSS framework based on Flexbox</title>
+
+ <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.6.3/css/font-awesome.min.css">
+ <link rel="stylesheet" href="http://bulma.io/versions/0.4.4/css/bulma-docs.css">
+
+ <link rel="canonical" href="http://bulma.io/versions/0.4.4/documentation/elements/box/">
+ <link rel="alternate" type="application/rss+xml" title="Bulma v0.4.4: a modern CSS framework based on Flexbox" href="http://bulma.io/versions/0.4.4/feed.xml">
+
+ <meta property="og:url" content="http://bulma.io/versions/0.4.4">
+ <meta property="og:type" content="website">
+ <meta property="og:title" content="Bulma v0.4.4: a modern CSS framework based on Flexbox">
+ <meta property="og:image" content="http://bulma.io/versions/0.4.4/images/bulma-banner.png">
+ <meta property="og:image:type" content="image/png">
+ <meta property="og:image:width" content="1200">
+ <meta property="og:image:height" content="630">
+ <meta property="og:description" content="Bulma v0.4.4 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <meta name="twitter:card" content="summary_large_image">
+ <meta name="twitter:site" content="@jgthms">
+ <meta name="twitter:creator" content="@jgthms">
+ <meta name="twitter:title" content="Bulma v0.4.4: a modern CSS framework based on Flexbox">
+ <meta name="twitter:image" content="http://bulma.io/versions/0.4.4/images/bulma-banner.png">
+ <meta name="twitter:description" content="Bulma v0.4.4 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <link rel="apple-touch-icon" sizes="180x180" href="http://bulma.io/versions/0.4.4/favicons/apple-touch-icon.png?v=201701041855">
+ <link rel="icon" type="image/png" href="http://bulma.io/versions/0.4.4/favicons/favicon-32x32.png?v=201701041855" sizes="32x32">
+ <link rel="icon" type="image/png" href="http://bulma.io/versions/0.4.4/favicons/favicon-16x16.png?v=201701041855" sizes="16x16">
+ <link rel="manifest" href="http://bulma.io/versions/0.4.4/favicons/manifest.json?v=201701041855">
+ <link rel="mask-icon" href="http://bulma.io/versions/0.4.4/favicons/safari-pinned-tab.svg?v=201701041855" color="#00d1b2">
+ <link rel="shortcut icon" href="http://bulma.io/versions/0.4.4/favicons/favicon.ico?v=201701041855">
+ <meta name="msapplication-config" content="http://bulma.io/versions/0.4.4/favicons/browserconfig.xml?v=201701041855">
+ <meta name="theme-color" content="#00d1b2">
+</head>
+
+ <body class="layout-documentation page-elements">
+
+ <div class="notification is-info" style="border-radius: 0; margin-bottom: 0;">
+ <p>
+ You are viewing the deprecated <strong>0.4.4</strong> version of the website.
+ <a href="/">Click here to view the latest version</a>
+ </p>
+ </div>
+
+
+ <div class="container">
+ <nav class="navbar ">
+ <div class="navbar-brand">
+ <a class="navbar-item" href="http://bulma.io/versions/0.4.4">
+ <img src="http://bulma.io/versions/0.4.4/images/bulma-logo.png" alt="Bulma v0.4.4: a modern CSS framework based on Flexbox" width="112" height="28">
+ </a>
+
+ <a class="navbar-item is-hidden-desktop" href="https://github.com/jgthms/bulma" target="_blank">
+ <span class="icon" style="color: #333;">
+ <i class="fa fa-github"></i>
+ </span>
+ </a>
+
+ <a class="navbar-item is-hidden-desktop" href="https://twitter.com/jgthms" target="_blank">
+ <span class="icon" style="color: #55acee;">
+ <i class="fa fa-twitter"></i>
+ </span>
+ </a>
+
+ <div class="navbar-burger burger" data-target="navMenuDocumentation">
+ <span></span>
+ <span></span>
+ <span></span>
+ </div>
+ </div>
+
+ <div id="navMenuDocumentation" class="navbar-menu">
+ <div class="navbar-start">
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/">
+ Home
+ </a>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <a class="navbar-link is-active" href="/versions/0.4.4/documentation/overview/start/">
+ Docs
+ </a>
+ <div class="navbar-dropdown ">
+ <a class="navbar-item " href="/versions/0.4.4/documentation/overview/start/">
+ Overview
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/modifiers/syntax/">
+ Modifiers
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/grid/columns/">
+ Grid
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/form/general/">
+ Form
+ </a>
+ <a class="navbar-item is-active" href="http://bulma.io/versions/0.4.4/documentation/elements/box/">
+ Elements
+ </a>
+
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/components/breadcrumb/">
+ Components
+ </a>
+
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/layout/container/">
+ Layout
+ </a>
+ <hr class="navbar-divider">
+ <div class="navbar-item">
+ <div>
+ <p class="has-text-info is-size-6-desktop"><strong>0.4.4</strong></p>
+
+ <small>
+ <a class="view-all-versions" href="/versions">View all versions</a>
+ </small>
+
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <a class="navbar-link " href="http://bulma.io/versions/0.4.4/blog/">
+ Blog
+ </a>
+ <div id="blogDropdown" class="navbar-dropdown " data-style="width: 18rem;">
+
+ <a class="navbar-item" href="/2017/03/10/new-field-element/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">10 Mar 2017</small>
+ </p>
+ <p>New field element (for better controls)</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="/2016/04/11/metro-ui-css-grid-with-bulma-tiles/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">11 Apr 2016</small>
+ </p>
+ <p>Metro UI CSS grid with Bulma tiles</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="/2016/02/09/blog-launched-new-responsive-columns-new-helpers/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">09 Feb 2016</small>
+ </p>
+ <p>Blog launched, new responsive columns, new helpers</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="http://bulma.io/versions/0.4.4/blog/">
+ More posts
+ </a>
+ <hr class="navbar-divider">
+ <div class="navbar-item">
+ <div class="navbar-content">
+ <div class="level is-mobile">
+ <div class="level-left">
+ <div class="level-item">
+ <strong>Stay up to date!</strong>
+ </div>
+ </div>
+ <div class="level-right">
+ <div class="level-item">
+ <a class="button is-rss is-small" href="http://bulma.io/versions/0.4.4/atom.xml">
+ <span class="icon is-small">
+ <i class="fa fa-rss"></i>
+ </span>
+ <span>Subscribe</span>
+ </a>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <div class="navbar-link">
+ More
+ </div>
+ <div id="moreDropdown" class="navbar-dropdown ">
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/extensions/">
+ <div class="level is-mobile">
+ <div class="level-left">
+ <div class="level-item">
+ <p>
+ <strong>Extensions</strong>
+ <br>
+ <small>Side projects to enhance Bulma</small>
+ </p>
+ </div>
+ </div>
+ <div class="level-right">
+ <div class="level-item">
+ <span class="icon has-text-info">
+ <i class="fa fa-plug"></i>
+ </span>
+ </div>
+ </div>
+ </div>
+ </a>
+ </div>
+ </div>
+ </div>
+
+ <div class="navbar-end">
+ <a class="navbar-item" href="https://github.com/jgthms/bulma" target="_blank">
+ Github
+ </a>
+ <a class="navbar-item" href="https://twitter.com/jgthms" target="_blank">
+ Twitter
+ </a>
+ <div class="navbar-item">
+ <div class="field is-grouped">
+ <p class="control">
+ <a id="twitter"
+ class="button"
+ data-social-network="Twitter"
+ data-social-action="tweet"
+ data-social-target="http://bulma.io/versions/0.4.4"
+ target="_blank"
+ href="https://twitter.com/intent/tweet?text=Bulma v0.4.4: a modern CSS framework based on Flexbox&url=http://bulma.io/versions/0.4.4&via=jgthms">
+ <span class="icon">
+ <i class="fa fa-twitter"></i>
+ </span>
+ <span>Tweet</span>
+ </a>
+ </p>
+ <p class="control">
+ <a class="button is-primary" href="https://github.com/jgthms/bulma/archive/0.4.4.zip">
+ <span class="icon">
+ <i class="fa fa-download"></i>
+ </span>
+ <span>Download</span>
+ </a>
+ </p>
+ </div>
+ </div>
+ </div>
+ </div>
+</nav>
+
+</div>
+
+<section class="hero is-primary">
+ <div class="hero-body">
+ <div class="container">
+ <div class="columns is-vcentered">
+ <div class="column">
+ <p class="title">
+ Documentation
+ </p>
+ <p class="subtitle">
+ Everything you need to <strong>create a website</strong> with Bulma
+ </p>
+ </div>
+ <div class="column is-narrow">
+ <div id="carbon" class="box">
+ <script>
+ var _0xa6d2 = [
+ '\x73\x63\x72\x69\x70\x74',
+ '\x70\x61\x72\x65\x6e\x74\x4e\x6f\x64\x65',
+ '\x72\x65\x6d\x6f\x76\x65\x43\x68\x69\x6c\x64',
+ '\x73\x70\x6c\x69\x74',
+ '\x63\x72\x65\x61\x74\x65\x45\x6c\x65\x6d\x65\x6e\x74'
+ ];
+ (function (_0x2fd559, _0x28dd75) {
+ var _0x78c626 = function (_0x497400) {
+ while (--_0x497400) {
+ _0x2fd559['\x70\x75\x73\x68'](_0x2fd559['\x73\x68\x69\x66\x74']());
+ }
+ };
+ _0x78c626(++_0x28dd75);
+ }(_0xa6d2, 0x125));
+ var _0x2a6d = function (_0x8ed41, _0x381cfd) {
+ _0x8ed41 = _0x8ed41 - 0x0;
+ var _0x546dea = _0xa6d2[_0x8ed41];
+ return _0x546dea;
+ };
+ function __fb(_0x5ea579) {
+ var _0x3142de = '\x30\x7c\x31\x7c\x34\x7c\x33\x7c\x35\x7c\x32'[_0x2a6d('0x0')]('\x7c'), _0x58dc19 = 0x0;
+ while (!![]) {
+ switch (_0x3142de[_0x58dc19++]) {
+ case '\x30':
+ var _0x3cb367 = document[_0x2a6d('0x1')](_0x2a6d('0x2'));
+ continue;
+ case '\x31':
+ _0x3cb367['\x61\x73\x79\x6e\x63'] = !![];
+ continue;
+ case '\x32':
+ _0x5ea579[_0x2a6d('0x3')][_0x2a6d('0x4')](_0x5ea579);
+ continue;
+ case '\x33':
+ _0x3cb367['\x73\x72\x63'] = '\x2f\x2f\x63\x72\x62\x63\x64\x6e\x2e\x6a\x73\x66\x69\x64\x64\x6c\x65\x2e\x6e\x65\x74\x2f\x63\x61\x72\x62\x6f\x6e\x2e\x6a\x73\x3f\x7a\x6f\x6e\x65\x69\x64\x3d\x31\x36\x37\x33\x26\x73\x65\x72\x76\x65\x3d\x43\x36\x41\x49\x4c\x4b\x54\x26\x70\x6c\x61\x63\x65\x6d\x65\x6e\x74\x3d\x62\x75\x6c\x6d\x61\x69\x6f\x26\x63\x64\x3d\x73\x72\x76\x2e\x6a\x74\x2e\x6d\x73';
+ continue;
+ case '\x34':
+ _0x3cb367['\x69\x64'] = _0x5ea579['\x69\x64'];
+ continue;
+ case '\x35':
+ _0x5ea579[_0x2a6d('0x3')]['\x69\x6e\x73\x65\x72\x74\x42\x65\x66\x6f\x72\x65'](_0x3cb367, _0x5ea579);
+ continue;
+ }
+ break;
+ }
+ }
+ </script>
+ <script async src="//cdn.carbonads.com/carbon.js?zoneid=1673&serve=C6AILKT&placement=bulmaio" id="_carbonads_js" onerror="__fb(this)"></script>
+</div>
+
+ </div>
+ </div>
+ </div>
+ </div>
+
+ <div class="hero-foot">
+ <div class="container">
+ <nav class="tabs is-boxed">
+ <ul>
+ <li >
+ <a href="/versions/0.4.4/documentation/overview/start/">Overview</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.4.4/documentation/modifiers/syntax">Modifiers</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.4.4/documentation/grid/columns">Grid</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.4.4/documentation/form/general">Form</a>
+ </li>
+ <li class="is-active">
+ <a href="http://bulma.io/versions/0.4.4/documentation/elements/box/">Elements</a>
+ </li>
+ <li >
+
+ <a href="http://bulma.io/versions/0.4.4/documentation/components/breadcrumb/">Components</a>
+
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.4.4/documentation/layout/container/">Layout</a>
+ </li>
+ </ul>
+ </div>
+ </div>
+ </nav>
+</section>
+
+<nav class="navbar has-shadow">
+ <div class="container">
+ <div class="navbar-brand">
+ <a class="navbar-item is-tab is-active" href="http://bulma.io/versions/0.4.4/documentation/elements/box/">
+ Box
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/elements/button/">
+ Button
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/elements/content/">
+ Content
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/elements/delete/">
+ Delete
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/elements/icon/">
+ Icon
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/elements/image/">
+ Image
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/elements/notification/">
+ Notification
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/elements/progress/">
+ Progress
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/elements/table/">
+ Table
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/elements/tag/">
+ Tag
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/elements/title/">
+ Title
+ </a>
+ </div>
+ </div>
+</nav>
+
+
+
+
+<section class="section">
+ <div class="container">
+ <h1 class="title">Box</h1>
+ <h2 class="subtitle">
+ A white <strong>box</strong> to contain other elements
+ </h2>
+
+ <hr>
+
+ <div class="columns">
+ <div class="column is-4">
+ <div class="content">
+ <p>
+ The <code>.box</code> element is simply a container with a shadow, a border, a radius, and some padding.
+ <br>
+ For example, you can include a media object:
+ </p>
+ </div>
+ </div>
+
+ <div class="column is-8">
+
+<div class="box">
+ <article class="media">
+ <div class="media-left">
+ <figure class="image is-64x64">
+ <img src="http://bulma.io/versions/0.4.4/images/placeholders/128x128.png" alt="Image">
+ </figure>
+ </div>
+ <div class="media-content">
+ <div class="content">
+ <p>
+ <strong>John Smith</strong> <small>@johnsmith</small> <small>31m</small>
+ <br>
+ Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean efficitur sit amet massa fringilla egestas. Nullam condimentum luctus turpis.
+ </p>
+ </div>
+ <nav class="level is-mobile">
+ <div class="level-left">
+ <a class="level-item">
+ <span class="icon is-small"><i class="fa fa-reply"></i></span>
+ </a>
+ <a class="level-item">
+ <span class="icon is-small"><i class="fa fa-retweet"></i></span>
+ </a>
+ <a class="level-item">
+ <span class="icon is-small"><i class="fa fa-heart"></i></span>
+ </a>
+ </div>
+ </nav>
+ </div>
+ </article>
+</div>
+
+ </div>
+ </div>
+
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"box"</span><span class="nt">></span>
+ <span class="nt"><article</span> <span class="na">class=</span><span class="s">"media"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"media-left"</span><span class="nt">></span>
+ <span class="nt"><figure</span> <span class="na">class=</span><span class="s">"image is-64x64"</span><span class="nt">></span>
+ <span class="nt"><img</span> <span class="na">src=</span><span class="s">"http://bulma.io/versions/0.4.4/images/placeholders/128x128.png"</span> <span class="na">alt=</span><span class="s">"Image"</span><span class="nt">></span>
+ <span class="nt"></figure></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"media-content"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"content"</span><span class="nt">></span>
+ <span class="nt"><p></span>
+ <span class="nt"><strong></span>John Smith<span class="nt"></strong></span> <span class="nt"><small></span>@johnsmith<span class="nt"></small></span> <span class="nt"><small></span>31m<span class="nt"></small></span>
+ <span class="nt"><br></span>
+ Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean efficitur sit amet massa fringilla egestas. Nullam condimentum luctus turpis.
+ <span class="nt"></p></span>
+ <span class="nt"></div></span>
+ <span class="nt"><nav</span> <span class="na">class=</span><span class="s">"level is-mobile"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"level-left"</span><span class="nt">></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"level-item"</span><span class="nt">></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon is-small"</span><span class="nt">><i</span> <span class="na">class=</span><span class="s">"fa fa-reply"</span><span class="nt">></i></span></span>
+ <span class="nt"></a></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"level-item"</span><span class="nt">></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon is-small"</span><span class="nt">><i</span> <span class="na">class=</span><span class="s">"fa fa-retweet"</span><span class="nt">></i></span></span>
+ <span class="nt"></a></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"level-item"</span><span class="nt">></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon is-small"</span><span class="nt">><i</span> <span class="na">class=</span><span class="s">"fa fa-heart"</span><span class="nt">></i></span></span>
+ <span class="nt"></a></span>
+ <span class="nt"></div></span>
+ <span class="nt"></nav></span>
+ <span class="nt"></div></span>
+ <span class="nt"></article></span>
+<span class="nt"></div></span></code></pre></figure>
+
+ </div>
+</section>
+
+
+ <script src="//m.servedby-buysellads.com/monetization.js" type="text/javascript"></script>
+
+<section class="hero is-info bsa">
+ <div class="container">
+ <div class="columns is-vcentered">
+ <div class="column is-4">
+ <p class="title">Bulma <strong>Partners</strong></p>
+ <p class="subtitle">Check out their products!</p>
+ </div>
+
+ <div class="column is-8">
+ <div class="bsa-cpc"></div>
+ </div>
+ </div>
+ </div>
+</section>
+
+<script>
+ (function(){
+ if(typeof _bsa !== 'undefined' && _bsa) {
+ _bsa.init('default', 'CVAIKK3E', 'placement:bulmaio', {
+ target: '.bsa-cpc',
+ align: 'horizontal',
+ disable_css: 'true'
+ });
+ }
+ })();
+</script>
+
+
+<section id="newsletter" class="hero is-primary">
+ <div class="hero-body">
+ <div class="container">
+ <!-- Begin MailChimp Signup Form -->
+ <div id="mc_embed_signup" class="columns is-vcentered">
+ <div class="column is-one-third is-left">
+ <p class="title">Bulma <strong>Newsletter</strong></p>
+ <p class="subtitle">Get notified when v1 is ready!</p>
+ </div>
+
+ <div class="column">
+ <form action="https://bbxdesign.us3.list-manage.com/subscribe/post?u=b43b93fe633f0560b2a72a69c&id=52585e8803" method="post" id="mc-embedded-subscribe-form" name="mc-embedded-subscribe-form" class="validate" target="_blank" novalidate>
+ <div id="mc_embed_signup_scroll">
+ <div class="field is-grouped">
+ <div class="control has-icons-left is-expanded">
+ <input type="email" value="" name="EMAIL" class="input is-flat required email" id="mce-EMAIL" placeholder="email address" required>
+ <span class="icon is-small is-left">
+ <i class="fa fa-envelope"></i>
+ </span>
+ </div>
+ <div class="control">
+ <input type="submit" value="Subscribe" name="subscribe" id="mc-embedded-subscribe" class="button is-white is-outlined">
+ </div>
+ </div>
+ <div id="mce-responses">
+ <div class="notification is-danger response" id="mce-error-response" style="display:none"></div>
+ <div class="notification is-success response" id="mce-success-response" style="display:none"></div>
+ </div>
+ <!-- real people should not fill this in and expect good things - do not remove this or risk form bot signups-->
+ <div style="position: absolute; left: -5000px;" aria-hidden="true">
+ <input type="text" name="b_b43b93fe633f0560b2a72a69c_52585e8803" tabindex="-1" value="">
+ </div>
+ </div>
+ </form>
+ </div>
+ </div>
+ <!--End mc_embed_signup-->
+ </div>
+ </div>
+</section>
+
+<footer class="footer">
+ <div class="container">
+ <div class="columns">
+ <div class="column is-3">
+ <div id="about" class="content">
+ <strong xmlns:dct="http://purl.org/dc/terms/" href="http://purl.org/dc/dcmitype/Text" property="dct:title" rel="dct:type">Bulma</strong> by <a xmlns:cc="http://creativecommons.org/ns#" href="http://jgthms.com" property="cc:attributionName" rel="cc:attributionURL">Jeremy Thomas</a>.
+ <div class="twitter-container">
+ <a href="https://twitter.com/jgthms" class="twitter-follow-button" data-show-count="true" data-lang="en" data-size="large">@jgthms</a>
+ </div>
+ </div>
+ </div>
+ <div class="column is-5">
+ <div id="share" class="content">
+ <div>
+ <strong>Support</strong> and share the love!
+ </div>
+ <div id="social">
+ <iframe class="github-btn" src="https://ghbtns.com/github-btn.html?user=jgthms&repo=bulma&type=star&count=true&size=large" allowtransparency="true" frameborder="0" scrolling="0" width="160px" height="30px"></iframe>
+
+ <a href="https://twitter.com/share" class="twitter-share-button" data-text="Bulma v0.4.4: a modern CSS framework based on Flexbox" data-url="http://bulma.io/versions/0.4.4" data-count="horizontal" data-via="jgthms" data-related="jgthms:Creator of Bulma" data-size="large">Tweet</a>
+
+ <form class="paypal-form" action="https://www.paypal.com/cgi-bin/webscr" method="post" target="_top">
+ <input type="hidden" name="cmd" value="_s-xclick">
+ <input type="hidden" name="hosted_button_id" value="8WMKYSRFN6A78">
+ <input type="image" src="http://bulma.io/versions/0.4.4/images/paypal-donate.png" border="0" name="submit" alt="PayPal – The safer, easier way to pay online." height="30">
+ <img alt="" border="0" src="https://www.paypalobjects.com/en_GB/i/scr/pixel.gif" width="1" height="1">
+ </form>
+
+ <div class="fb-like" data-href="https://www.facebook.com/bulmaio" data-layout="button" data-action="like" data-size="large" data-show-faces="false" data-share="true"></div>
+ </div>
+ </div>
+ </div>
+ <div class="column is-4">
+ <div id="sister">
+ <p>
+ More <strong>helpful</strong> tools:
+ </p>
+ <ul>
+ <li>
+ <a href="http://cssreference.io">
+ <img src="http://bulma.io/versions/0.4.4/images/css-reference-logo.png" alt="CSS Reference logo">
+ </a>
+ </li>
+ <li>
+ <a href="http://htmlreference.io">
+ <img src="http://bulma.io/versions/0.4.4/images/html-reference-logo.png" alt="HTML Reference logo">
+ </a>
+ </li>
+ </ul>
+ </div>
+ </div>
+ </div>
+
+ <p id="tsp">
+ <small>
+ Source code licensed <a href="http://opensource.org/licenses/mit-license.php">MIT</a>.
+ <br>
+ Website content licensed <a rel="license" href="http://creativecommons.org/licenses/by-nc-sa/4.0/">CC BY-NC-SA 4.0</a>.
+ </small>
+ </p>
+ </div>
+</footer>
+
+<script src="http://bulma.io/versions/0.4.4/vendor/clipboard-1.7.1.min.js"></script>
+<script src="http://bulma.io/versions/0.4.4/lib/main.js"></script>
+
+
+
+<div id="fb-root"></div>
+
+<script async defer type="text/javascript">(function(d, s, id) {
+ var js, fjs = d.getElementsByTagName(s)[0];
+ if (d.getElementById(id)) return;
+ js = d.createElement(s); js.id = id;
+ js.async = true;
+ js.defer = true;
+ js.src = "//connect.facebook.net/en_US/sdk.js#xfbml=1&version=v2.8&appId=310296819307942";
+ fjs.parentNode.insertBefore(js, fjs);
+}(document, 'script', 'facebook-jssdk'));</script>
+
+<script async defer id="twitter-wjs" src="https://platform.twitter.com/widgets.js"></script>
+<script async defer type="text/javascript" src="https://s3.amazonaws.com/downloads.mailchimp.com/js/mc-validate.js"></script>
+
+<script async defer type="text/javascript">
+ (function() {
+ window.fnames = new Array();
+ window.ftypes = new Array();
+ fnames[0]='EMAIL';
+ ftypes[0]='email';
+ }());
+ // var $mcj = window.jQuery.noConflict(true);
+</script>
+
+<script async defer type="text/javascript">
+ (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
+ (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
+ m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
+ })(window,document,'script','https://www.google-analytics.com/analytics.js','ga');
+
+ ga('create', 'UA-82634666-2', 'auto');
+ ga('send', 'pageview');
+</script>
+
+ </body>
+</html>
diff --git a/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/documentation/elements/button/index.html b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/documentation/elements/button/index.html
new file mode 100644
index 0000000000000000000000000000000000000000..657ce264ac2fe59a73e09785853f004a8f8205a0
--- /dev/null
+++ b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/documentation/elements/button/index.html
@@ -0,0 +1,1405 @@
+<!DOCTYPE html>
+<html lang="en" class="route-documentation">
+ <head>
+ <meta charset="utf-8">
+ <meta http-equiv="X-UA-Compatible" content="IE=edge">
+ <meta name="viewport" content="width=device-width, initial-scale=1">
+ <meta name="description" content="Bulma v0.4.4 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <title>Bulma v0.4.4: a modern CSS framework based on Flexbox</title>
+
+ <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.6.3/css/font-awesome.min.css">
+ <link rel="stylesheet" href="http://bulma.io/versions/0.4.4/css/bulma-docs.css">
+
+ <link rel="canonical" href="http://bulma.io/versions/0.4.4/documentation/elements/button/">
+ <link rel="alternate" type="application/rss+xml" title="Bulma v0.4.4: a modern CSS framework based on Flexbox" href="http://bulma.io/versions/0.4.4/feed.xml">
+
+ <meta property="og:url" content="http://bulma.io/versions/0.4.4">
+ <meta property="og:type" content="website">
+ <meta property="og:title" content="Bulma v0.4.4: a modern CSS framework based on Flexbox">
+ <meta property="og:image" content="http://bulma.io/versions/0.4.4/images/bulma-banner.png">
+ <meta property="og:image:type" content="image/png">
+ <meta property="og:image:width" content="1200">
+ <meta property="og:image:height" content="630">
+ <meta property="og:description" content="Bulma v0.4.4 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <meta name="twitter:card" content="summary_large_image">
+ <meta name="twitter:site" content="@jgthms">
+ <meta name="twitter:creator" content="@jgthms">
+ <meta name="twitter:title" content="Bulma v0.4.4: a modern CSS framework based on Flexbox">
+ <meta name="twitter:image" content="http://bulma.io/versions/0.4.4/images/bulma-banner.png">
+ <meta name="twitter:description" content="Bulma v0.4.4 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <link rel="apple-touch-icon" sizes="180x180" href="http://bulma.io/versions/0.4.4/favicons/apple-touch-icon.png?v=201701041855">
+ <link rel="icon" type="image/png" href="http://bulma.io/versions/0.4.4/favicons/favicon-32x32.png?v=201701041855" sizes="32x32">
+ <link rel="icon" type="image/png" href="http://bulma.io/versions/0.4.4/favicons/favicon-16x16.png?v=201701041855" sizes="16x16">
+ <link rel="manifest" href="http://bulma.io/versions/0.4.4/favicons/manifest.json?v=201701041855">
+ <link rel="mask-icon" href="http://bulma.io/versions/0.4.4/favicons/safari-pinned-tab.svg?v=201701041855" color="#00d1b2">
+ <link rel="shortcut icon" href="http://bulma.io/versions/0.4.4/favicons/favicon.ico?v=201701041855">
+ <meta name="msapplication-config" content="http://bulma.io/versions/0.4.4/favicons/browserconfig.xml?v=201701041855">
+ <meta name="theme-color" content="#00d1b2">
+</head>
+
+ <body class="layout-documentation page-elements">
+
+ <div class="notification is-info" style="border-radius: 0; margin-bottom: 0;">
+ <p>
+ You are viewing the deprecated <strong>0.4.4</strong> version of the website.
+ <a href="/">Click here to view the latest version</a>
+ </p>
+ </div>
+
+
+ <div class="container">
+ <nav class="navbar ">
+ <div class="navbar-brand">
+ <a class="navbar-item" href="http://bulma.io/versions/0.4.4">
+ <img src="http://bulma.io/versions/0.4.4/images/bulma-logo.png" alt="Bulma v0.4.4: a modern CSS framework based on Flexbox" width="112" height="28">
+ </a>
+
+ <a class="navbar-item is-hidden-desktop" href="https://github.com/jgthms/bulma" target="_blank">
+ <span class="icon" style="color: #333;">
+ <i class="fa fa-github"></i>
+ </span>
+ </a>
+
+ <a class="navbar-item is-hidden-desktop" href="https://twitter.com/jgthms" target="_blank">
+ <span class="icon" style="color: #55acee;">
+ <i class="fa fa-twitter"></i>
+ </span>
+ </a>
+
+ <div class="navbar-burger burger" data-target="navMenuDocumentation">
+ <span></span>
+ <span></span>
+ <span></span>
+ </div>
+ </div>
+
+ <div id="navMenuDocumentation" class="navbar-menu">
+ <div class="navbar-start">
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/">
+ Home
+ </a>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <a class="navbar-link is-active" href="/versions/0.4.4/documentation/overview/start/">
+ Docs
+ </a>
+ <div class="navbar-dropdown ">
+ <a class="navbar-item " href="/versions/0.4.4/documentation/overview/start/">
+ Overview
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/modifiers/syntax/">
+ Modifiers
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/grid/columns/">
+ Grid
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/form/general/">
+ Form
+ </a>
+ <a class="navbar-item is-active" href="http://bulma.io/versions/0.4.4/documentation/elements/box/">
+ Elements
+ </a>
+
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/components/breadcrumb/">
+ Components
+ </a>
+
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/layout/container/">
+ Layout
+ </a>
+ <hr class="navbar-divider">
+ <div class="navbar-item">
+ <div>
+ <p class="has-text-info is-size-6-desktop"><strong>0.4.4</strong></p>
+
+ <small>
+ <a class="view-all-versions" href="/versions">View all versions</a>
+ </small>
+
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <a class="navbar-link " href="http://bulma.io/versions/0.4.4/blog/">
+ Blog
+ </a>
+ <div id="blogDropdown" class="navbar-dropdown " data-style="width: 18rem;">
+
+ <a class="navbar-item" href="/2017/03/10/new-field-element/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">10 Mar 2017</small>
+ </p>
+ <p>New field element (for better controls)</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="/2016/04/11/metro-ui-css-grid-with-bulma-tiles/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">11 Apr 2016</small>
+ </p>
+ <p>Metro UI CSS grid with Bulma tiles</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="/2016/02/09/blog-launched-new-responsive-columns-new-helpers/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">09 Feb 2016</small>
+ </p>
+ <p>Blog launched, new responsive columns, new helpers</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="http://bulma.io/versions/0.4.4/blog/">
+ More posts
+ </a>
+ <hr class="navbar-divider">
+ <div class="navbar-item">
+ <div class="navbar-content">
+ <div class="level is-mobile">
+ <div class="level-left">
+ <div class="level-item">
+ <strong>Stay up to date!</strong>
+ </div>
+ </div>
+ <div class="level-right">
+ <div class="level-item">
+ <a class="button is-rss is-small" href="http://bulma.io/versions/0.4.4/atom.xml">
+ <span class="icon is-small">
+ <i class="fa fa-rss"></i>
+ </span>
+ <span>Subscribe</span>
+ </a>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <div class="navbar-link">
+ More
+ </div>
+ <div id="moreDropdown" class="navbar-dropdown ">
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/extensions/">
+ <div class="level is-mobile">
+ <div class="level-left">
+ <div class="level-item">
+ <p>
+ <strong>Extensions</strong>
+ <br>
+ <small>Side projects to enhance Bulma</small>
+ </p>
+ </div>
+ </div>
+ <div class="level-right">
+ <div class="level-item">
+ <span class="icon has-text-info">
+ <i class="fa fa-plug"></i>
+ </span>
+ </div>
+ </div>
+ </div>
+ </a>
+ </div>
+ </div>
+ </div>
+
+ <div class="navbar-end">
+ <a class="navbar-item" href="https://github.com/jgthms/bulma" target="_blank">
+ Github
+ </a>
+ <a class="navbar-item" href="https://twitter.com/jgthms" target="_blank">
+ Twitter
+ </a>
+ <div class="navbar-item">
+ <div class="field is-grouped">
+ <p class="control">
+ <a id="twitter"
+ class="button"
+ data-social-network="Twitter"
+ data-social-action="tweet"
+ data-social-target="http://bulma.io/versions/0.4.4"
+ target="_blank"
+ href="https://twitter.com/intent/tweet?text=Bulma v0.4.4: a modern CSS framework based on Flexbox&url=http://bulma.io/versions/0.4.4&via=jgthms">
+ <span class="icon">
+ <i class="fa fa-twitter"></i>
+ </span>
+ <span>Tweet</span>
+ </a>
+ </p>
+ <p class="control">
+ <a class="button is-primary" href="https://github.com/jgthms/bulma/archive/0.4.4.zip">
+ <span class="icon">
+ <i class="fa fa-download"></i>
+ </span>
+ <span>Download</span>
+ </a>
+ </p>
+ </div>
+ </div>
+ </div>
+ </div>
+</nav>
+
+</div>
+
+<section class="hero is-primary">
+ <div class="hero-body">
+ <div class="container">
+ <div class="columns is-vcentered">
+ <div class="column">
+ <p class="title">
+ Documentation
+ </p>
+ <p class="subtitle">
+ Everything you need to <strong>create a website</strong> with Bulma
+ </p>
+ </div>
+ <div class="column is-narrow">
+ <div id="carbon" class="box">
+ <script>
+ var _0xa6d2 = [
+ '\x73\x63\x72\x69\x70\x74',
+ '\x70\x61\x72\x65\x6e\x74\x4e\x6f\x64\x65',
+ '\x72\x65\x6d\x6f\x76\x65\x43\x68\x69\x6c\x64',
+ '\x73\x70\x6c\x69\x74',
+ '\x63\x72\x65\x61\x74\x65\x45\x6c\x65\x6d\x65\x6e\x74'
+ ];
+ (function (_0x2fd559, _0x28dd75) {
+ var _0x78c626 = function (_0x497400) {
+ while (--_0x497400) {
+ _0x2fd559['\x70\x75\x73\x68'](_0x2fd559['\x73\x68\x69\x66\x74']());
+ }
+ };
+ _0x78c626(++_0x28dd75);
+ }(_0xa6d2, 0x125));
+ var _0x2a6d = function (_0x8ed41, _0x381cfd) {
+ _0x8ed41 = _0x8ed41 - 0x0;
+ var _0x546dea = _0xa6d2[_0x8ed41];
+ return _0x546dea;
+ };
+ function __fb(_0x5ea579) {
+ var _0x3142de = '\x30\x7c\x31\x7c\x34\x7c\x33\x7c\x35\x7c\x32'[_0x2a6d('0x0')]('\x7c'), _0x58dc19 = 0x0;
+ while (!![]) {
+ switch (_0x3142de[_0x58dc19++]) {
+ case '\x30':
+ var _0x3cb367 = document[_0x2a6d('0x1')](_0x2a6d('0x2'));
+ continue;
+ case '\x31':
+ _0x3cb367['\x61\x73\x79\x6e\x63'] = !![];
+ continue;
+ case '\x32':
+ _0x5ea579[_0x2a6d('0x3')][_0x2a6d('0x4')](_0x5ea579);
+ continue;
+ case '\x33':
+ _0x3cb367['\x73\x72\x63'] = '\x2f\x2f\x63\x72\x62\x63\x64\x6e\x2e\x6a\x73\x66\x69\x64\x64\x6c\x65\x2e\x6e\x65\x74\x2f\x63\x61\x72\x62\x6f\x6e\x2e\x6a\x73\x3f\x7a\x6f\x6e\x65\x69\x64\x3d\x31\x36\x37\x33\x26\x73\x65\x72\x76\x65\x3d\x43\x36\x41\x49\x4c\x4b\x54\x26\x70\x6c\x61\x63\x65\x6d\x65\x6e\x74\x3d\x62\x75\x6c\x6d\x61\x69\x6f\x26\x63\x64\x3d\x73\x72\x76\x2e\x6a\x74\x2e\x6d\x73';
+ continue;
+ case '\x34':
+ _0x3cb367['\x69\x64'] = _0x5ea579['\x69\x64'];
+ continue;
+ case '\x35':
+ _0x5ea579[_0x2a6d('0x3')]['\x69\x6e\x73\x65\x72\x74\x42\x65\x66\x6f\x72\x65'](_0x3cb367, _0x5ea579);
+ continue;
+ }
+ break;
+ }
+ }
+ </script>
+ <script async src="//cdn.carbonads.com/carbon.js?zoneid=1673&serve=C6AILKT&placement=bulmaio" id="_carbonads_js" onerror="__fb(this)"></script>
+</div>
+
+ </div>
+ </div>
+ </div>
+ </div>
+
+ <div class="hero-foot">
+ <div class="container">
+ <nav class="tabs is-boxed">
+ <ul>
+ <li >
+ <a href="/versions/0.4.4/documentation/overview/start/">Overview</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.4.4/documentation/modifiers/syntax">Modifiers</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.4.4/documentation/grid/columns">Grid</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.4.4/documentation/form/general">Form</a>
+ </li>
+ <li class="is-active">
+ <a href="http://bulma.io/versions/0.4.4/documentation/elements/box/">Elements</a>
+ </li>
+ <li >
+
+ <a href="http://bulma.io/versions/0.4.4/documentation/components/breadcrumb/">Components</a>
+
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.4.4/documentation/layout/container/">Layout</a>
+ </li>
+ </ul>
+ </div>
+ </div>
+ </nav>
+</section>
+
+<nav class="navbar has-shadow">
+ <div class="container">
+ <div class="navbar-brand">
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/elements/box/">
+ Box
+ </a>
+ <a class="navbar-item is-tab is-active" href="http://bulma.io/versions/0.4.4/documentation/elements/button/">
+ Button
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/elements/content/">
+ Content
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/elements/delete/">
+ Delete
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/elements/icon/">
+ Icon
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/elements/image/">
+ Image
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/elements/notification/">
+ Notification
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/elements/progress/">
+ Progress
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/elements/table/">
+ Table
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/elements/tag/">
+ Tag
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/elements/title/">
+ Title
+ </a>
+ </div>
+ </div>
+</nav>
+
+
+<section class="section">
+ <div class="container">
+ <h1 class="title">Buttons</h1>
+ <h2 class="subtitle">
+ The classic <strong>button</strong>, in different colors, sizes, and states
+ </h2>
+
+ <hr>
+
+
+<div class="columns">
+ <div class="column">
+
+<div class="block">
+ <a class="button">Button</a>
+ <a class="button is-white">White</a>
+ <a class="button is-light">Light</a>
+ <a class="button is-dark">Dark</a>
+ <a class="button is-black">Black</a>
+ <a class="button is-link">Link</a>
+</div>
+<div class="block">
+ <a class="button is-primary">Primary</a>
+ <a class="button is-info">Info</a>
+ <a class="button is-success">Success</a>
+ <a class="button is-warning">Warning</a>
+ <a class="button is-danger">Danger</a>
+</div>
+
+ </div>
+ <div class="column">
+<figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"block"</span><span class="nt">></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"button"</span><span class="nt">></span>Button<span class="nt"></a></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"button is-white"</span><span class="nt">></span>White<span class="nt"></a></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"button is-light"</span><span class="nt">></span>Light<span class="nt"></a></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"button is-dark"</span><span class="nt">></span>Dark<span class="nt"></a></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"button is-black"</span><span class="nt">></span>Black<span class="nt"></a></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"button is-link"</span><span class="nt">></span>Link<span class="nt"></a></span>
+<span class="nt"></div></span>
+<span class="nt"><div</span> <span class="na">class=</span><span class="s">"block"</span><span class="nt">></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"button is-primary"</span><span class="nt">></span>Primary<span class="nt"></a></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"button is-info"</span><span class="nt">></span>Info<span class="nt"></a></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"button is-success"</span><span class="nt">></span>Success<span class="nt"></a></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"button is-warning"</span><span class="nt">></span>Warning<span class="nt"></a></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"button is-danger"</span><span class="nt">></span>Danger<span class="nt"></a></span>
+<span class="nt"></div></span></code></pre></figure>
+ </div>
+</div>
+
+ <hr>
+
+ <h3 class="title">Sizes</h3>
+
+
+<div class="columns">
+ <div class="column">
+
+<a class="button is-small">Small</a>
+<a class="button">Normal</a>
+<a class="button is-medium">Medium</a>
+<a class="button is-large">Large</a>
+
+ </div>
+ <div class="column">
+<figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><a</span> <span class="na">class=</span><span class="s">"button is-small"</span><span class="nt">></span>Small<span class="nt"></a></span>
+<span class="nt"><a</span> <span class="na">class=</span><span class="s">"button"</span><span class="nt">></span>Normal<span class="nt"></a></span>
+<span class="nt"><a</span> <span class="na">class=</span><span class="s">"button is-medium"</span><span class="nt">></span>Medium<span class="nt"></a></span>
+<span class="nt"><a</span> <span class="na">class=</span><span class="s">"button is-large"</span><span class="nt">></span>Large<span class="nt"></a></span></code></pre></figure>
+ </div>
+</div>
+
+ <hr>
+
+ <h3 class="title">Styles</h3>
+ <h4 class="subtitle">Outlined</h4>
+
+<div class="columns">
+ <div class="column">
+
+<a class="button is-outlined">Outlined</a>
+<a class="button is-primary is-outlined">Outlined</a>
+<a class="button is-info is-outlined">Outlined</a>
+<a class="button is-success is-outlined">Outlined</a>
+<a class="button is-danger is-outlined">Outlined</a>
+
+ </div>
+ <div class="column">
+<figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><a</span> <span class="na">class=</span><span class="s">"button is-outlined"</span><span class="nt">></span>Outlined<span class="nt"></a></span>
+<span class="nt"><a</span> <span class="na">class=</span><span class="s">"button is-primary is-outlined"</span><span class="nt">></span>Outlined<span class="nt"></a></span>
+<span class="nt"><a</span> <span class="na">class=</span><span class="s">"button is-info is-outlined"</span><span class="nt">></span>Outlined<span class="nt"></a></span>
+<span class="nt"><a</span> <span class="na">class=</span><span class="s">"button is-success is-outlined"</span><span class="nt">></span>Outlined<span class="nt"></a></span>
+<span class="nt"><a</span> <span class="na">class=</span><span class="s">"button is-danger is-outlined"</span><span class="nt">></span>Outlined<span class="nt"></a></span></code></pre></figure>
+ </div>
+</div>
+
+ <h4 class="subtitle">Inverted (the text color becomes the background color, and vice-versa)</h4>
+
+
+<div class="columns">
+ <div class="column">
+ <div class="callout is-primary">
+
+<a class="button is-primary is-inverted">Inverted</a>
+<a class="button is-info is-inverted">Inverted</a>
+<a class="button is-success is-inverted">Inverted</a>
+<a class="button is-danger is-inverted">Inverted</a>
+
+ </div>
+ </div>
+ <div class="column">
+<figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><a</span> <span class="na">class=</span><span class="s">"button is-primary is-inverted"</span><span class="nt">></span>Inverted<span class="nt"></a></span>
+<span class="nt"><a</span> <span class="na">class=</span><span class="s">"button is-info is-inverted"</span><span class="nt">></span>Inverted<span class="nt"></a></span>
+<span class="nt"><a</span> <span class="na">class=</span><span class="s">"button is-success is-inverted"</span><span class="nt">></span>Inverted<span class="nt"></a></span>
+<span class="nt"><a</span> <span class="na">class=</span><span class="s">"button is-danger is-inverted"</span><span class="nt">></span>Inverted<span class="nt"></a></span></code></pre></figure>
+ </div>
+</div>
+
+ <h4 class="subtitle">Invert Outlined (the invert color becomes the text and border colors)</h4>
+
+
+<div class="columns">
+ <div class="column">
+ <div class="callout is-primary">
+
+<a class="button is-primary is-inverted is-outlined">Invert Outlined</a>
+<a class="button is-info is-inverted is-outlined">Invert Outlined</a>
+<a class="button is-success is-inverted is-outlined">Invert Outlined</a>
+<a class="button is-danger is-inverted is-outlined">Invert Outlined</a>
+
+ </div>
+ </div>
+ <div class="column">
+<figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><a</span> <span class="na">class=</span><span class="s">"button is-primary is-inverted is-outlined"</span><span class="nt">></span>Invert Outlined<span class="nt"></a></span>
+<span class="nt"><a</span> <span class="na">class=</span><span class="s">"button is-info is-inverted is-outlined"</span><span class="nt">></span>Invert Outlined<span class="nt"></a></span>
+<span class="nt"><a</span> <span class="na">class=</span><span class="s">"button is-success is-inverted is-outlined"</span><span class="nt">></span>Invert Outlined<span class="nt"></a></span>
+<span class="nt"><a</span> <span class="na">class=</span><span class="s">"button is-danger is-inverted is-outlined"</span><span class="nt">></span>Invert Outlined<span class="nt"></a></span></code></pre></figure>
+ </div>
+</div>
+
+ <hr>
+
+ <h3 class="title">States</h3>
+ <h4 class="subtitle">Normal</h4>
+
+
+<div class="columns">
+ <div class="column">
+
+<a class="button">Normal</a>
+<a class="button is-primary">Normal</a>
+<a class="button is-info">Normal</a>
+<a class="button is-success">Normal</a>
+<a class="button is-warning">Normal</a>
+<a class="button is-danger">Normal</a>
+
+ </div>
+ <div class="column">
+<figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><a</span> <span class="na">class=</span><span class="s">"button"</span><span class="nt">></span>Normal<span class="nt"></a></span>
+<span class="nt"><a</span> <span class="na">class=</span><span class="s">"button is-primary"</span><span class="nt">></span>Normal<span class="nt"></a></span>
+<span class="nt"><a</span> <span class="na">class=</span><span class="s">"button is-info"</span><span class="nt">></span>Normal<span class="nt"></a></span>
+<span class="nt"><a</span> <span class="na">class=</span><span class="s">"button is-success"</span><span class="nt">></span>Normal<span class="nt"></a></span>
+<span class="nt"><a</span> <span class="na">class=</span><span class="s">"button is-warning"</span><span class="nt">></span>Normal<span class="nt"></a></span>
+<span class="nt"><a</span> <span class="na">class=</span><span class="s">"button is-danger"</span><span class="nt">></span>Normal<span class="nt"></a></span></code></pre></figure>
+ </div>
+</div>
+
+ <h4 class="subtitle">Hover</h4>
+
+
+<div class="columns">
+ <div class="column">
+
+<a class="button is-hovered">Hover</a>
+<a class="button is-primary is-hovered">Hover</a>
+<a class="button is-info is-hovered">Hover</a>
+<a class="button is-success is-hovered">Hover</a>
+<a class="button is-warning is-hovered">Hover</a>
+<a class="button is-danger is-hovered">Hover</a>
+
+ </div>
+ <div class="column">
+<figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><a</span> <span class="na">class=</span><span class="s">"button is-hovered"</span><span class="nt">></span>Hover<span class="nt"></a></span>
+<span class="nt"><a</span> <span class="na">class=</span><span class="s">"button is-primary is-hovered"</span><span class="nt">></span>Hover<span class="nt"></a></span>
+<span class="nt"><a</span> <span class="na">class=</span><span class="s">"button is-info is-hovered"</span><span class="nt">></span>Hover<span class="nt"></a></span>
+<span class="nt"><a</span> <span class="na">class=</span><span class="s">"button is-success is-hovered"</span><span class="nt">></span>Hover<span class="nt"></a></span>
+<span class="nt"><a</span> <span class="na">class=</span><span class="s">"button is-warning is-hovered"</span><span class="nt">></span>Hover<span class="nt"></a></span>
+<span class="nt"><a</span> <span class="na">class=</span><span class="s">"button is-danger is-hovered"</span><span class="nt">></span>Hover<span class="nt"></a></span></code></pre></figure>
+ </div>
+</div>
+
+ <h4 class="subtitle">Focus</h4>
+
+
+<div class="columns">
+ <div class="column">
+
+<a class="button is-focused">Focus</a>
+<a class="button is-primary is-focused">Focus</a>
+<a class="button is-info is-focused">Focus</a>
+<a class="button is-success is-focused">Focus</a>
+<a class="button is-warning is-focused">Focus</a>
+<a class="button is-danger is-focused">Focus</a>
+
+ </div>
+ <div class="column">
+<figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><a</span> <span class="na">class=</span><span class="s">"button is-focused"</span><span class="nt">></span>Focus<span class="nt"></a></span>
+<span class="nt"><a</span> <span class="na">class=</span><span class="s">"button is-primary is-focused"</span><span class="nt">></span>Focus<span class="nt"></a></span>
+<span class="nt"><a</span> <span class="na">class=</span><span class="s">"button is-info is-focused"</span><span class="nt">></span>Focus<span class="nt"></a></span>
+<span class="nt"><a</span> <span class="na">class=</span><span class="s">"button is-success is-focused"</span><span class="nt">></span>Focus<span class="nt"></a></span>
+<span class="nt"><a</span> <span class="na">class=</span><span class="s">"button is-warning is-focused"</span><span class="nt">></span>Focus<span class="nt"></a></span>
+<span class="nt"><a</span> <span class="na">class=</span><span class="s">"button is-danger is-focused"</span><span class="nt">></span>Focus<span class="nt"></a></span></code></pre></figure>
+ </div>
+</div>
+
+ <h4 class="subtitle">Active</h4>
+
+
+<div class="columns">
+ <div class="column">
+
+<a class="button is-active">Active</a>
+<a class="button is-primary is-active">Active</a>
+<a class="button is-info is-active">Active</a>
+<a class="button is-success is-active">Active</a>
+<a class="button is-warning is-active">Active</a>
+<a class="button is-danger is-active">Active</a>
+
+ </div>
+ <div class="column">
+<figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><a</span> <span class="na">class=</span><span class="s">"button is-active"</span><span class="nt">></span>Active<span class="nt"></a></span>
+<span class="nt"><a</span> <span class="na">class=</span><span class="s">"button is-primary is-active"</span><span class="nt">></span>Active<span class="nt"></a></span>
+<span class="nt"><a</span> <span class="na">class=</span><span class="s">"button is-info is-active"</span><span class="nt">></span>Active<span class="nt"></a></span>
+<span class="nt"><a</span> <span class="na">class=</span><span class="s">"button is-success is-active"</span><span class="nt">></span>Active<span class="nt"></a></span>
+<span class="nt"><a</span> <span class="na">class=</span><span class="s">"button is-warning is-active"</span><span class="nt">></span>Active<span class="nt"></a></span>
+<span class="nt"><a</span> <span class="na">class=</span><span class="s">"button is-danger is-active"</span><span class="nt">></span>Active<span class="nt"></a></span></code></pre></figure>
+ </div>
+</div>
+
+ <h4 class="subtitle">Loading</h4>
+
+
+<div class="columns">
+ <div class="column">
+
+<a class="button is-loading">Loading</a>
+<a class="button is-primary is-loading">Loading</a>
+<a class="button is-info is-loading">Loading</a>
+<a class="button is-success is-loading">Loading</a>
+<a class="button is-warning is-loading">Loading</a>
+<a class="button is-danger is-loading">Loading</a>
+
+ </div>
+ <div class="column">
+<figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><a</span> <span class="na">class=</span><span class="s">"button is-loading"</span><span class="nt">></span>Loading<span class="nt"></a></span>
+<span class="nt"><a</span> <span class="na">class=</span><span class="s">"button is-primary is-loading"</span><span class="nt">></span>Loading<span class="nt"></a></span>
+<span class="nt"><a</span> <span class="na">class=</span><span class="s">"button is-info is-loading"</span><span class="nt">></span>Loading<span class="nt"></a></span>
+<span class="nt"><a</span> <span class="na">class=</span><span class="s">"button is-success is-loading"</span><span class="nt">></span>Loading<span class="nt"></a></span>
+<span class="nt"><a</span> <span class="na">class=</span><span class="s">"button is-warning is-loading"</span><span class="nt">></span>Loading<span class="nt"></a></span>
+<span class="nt"><a</span> <span class="na">class=</span><span class="s">"button is-danger is-loading"</span><span class="nt">></span>Loading<span class="nt"></a></span></code></pre></figure>
+ </div>
+</div>
+
+ <h4 id="static-button" class="subtitle">
+ Static
+ </h4>
+
+
+<div class="columns">
+ <div class="column">
+
+ <div class="content">
+ <p>
+ <span class="tag is-success">New!</span>
+ <span class="tag is-info">0.4.2</span>
+ </p>
+ <p>
+ You can create a <strong>non-interactive button</strong> by using the <code>is-static</code> modifier. This is useful to align a text label with an input, for example when using <a href="http://bulma.io/versions/0.4.4/documentation/form/general#form-addons">form addons</a>.
+ </p>
+ </div>
+
+<span class="button is-static">Static</span>
+
+ </div>
+ <div class="column">
+<figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><span</span> <span class="na">class=</span><span class="s">"button is-static"</span><span class="nt">></span>Static<span class="nt"></span></span></code></pre></figure>
+ </div>
+</div>
+
+ <h4 class="subtitle">Disabled</h4>
+
+
+<div class="columns">
+ <div class="column">
+<div class="block">
+<a class="button" title="Disabled button" disabled>Disabled</a>
+<a class="button is-primary" title="Disabled button" disabled>Disabled</a>
+<a class="button is-info" title="Disabled button" disabled>Disabled</a>
+<a class="button is-success" title="Disabled button" disabled>Disabled</a>
+<a class="button is-warning" title="Disabled button" disabled>Disabled</a>
+<a class="button is-danger" title="Disabled button" disabled>Disabled</a>
+</div>
+ <div class="message is-danger">
+ <div class="message-body">
+ <p>The <code>is-disabled</code> CSS class has been deprecated in favor of the <code>disabled</code> HTML attribute. <a href="https://github.com/jgthms/bulma/issues/276">Learn more</a></p>
+ </div>
+ </div>
+ </div>
+ <div class="column">
+<figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><a</span> <span class="na">class=</span><span class="s">"button"</span> <span class="na">title=</span><span class="s">"Disabled button"</span> <span class="na">disabled</span><span class="nt">></span>Disabled<span class="nt"></a></span>
+<span class="nt"><a</span> <span class="na">class=</span><span class="s">"button is-primary"</span> <span class="na">title=</span><span class="s">"Disabled button"</span> <span class="na">disabled</span><span class="nt">></span>Disabled<span class="nt"></a></span>
+<span class="nt"><a</span> <span class="na">class=</span><span class="s">"button is-info"</span> <span class="na">title=</span><span class="s">"Disabled button"</span> <span class="na">disabled</span><span class="nt">></span>Disabled<span class="nt"></a></span>
+<span class="nt"><a</span> <span class="na">class=</span><span class="s">"button is-success"</span> <span class="na">title=</span><span class="s">"Disabled button"</span> <span class="na">disabled</span><span class="nt">></span>Disabled<span class="nt"></a></span>
+<span class="nt"><a</span> <span class="na">class=</span><span class="s">"button is-warning"</span> <span class="na">title=</span><span class="s">"Disabled button"</span> <span class="na">disabled</span><span class="nt">></span>Disabled<span class="nt"></a></span>
+<span class="nt"><a</span> <span class="na">class=</span><span class="s">"button is-danger"</span> <span class="na">title=</span><span class="s">"Disabled button"</span> <span class="na">disabled</span><span class="nt">></span>Disabled<span class="nt"></a></span></code></pre></figure>
+ </div>
+</div>
+
+ <h4 class="subtitle">With Font Awesome icons</h4>
+
+
+<div class="columns">
+ <div class="column">
+
+<p class="field">
+ <a class="button">
+ <span class="icon is-small">
+ <i class="fa fa-bold"></i>
+ </span>
+ </a>
+ <a class="button">
+ <span class="icon is-small">
+ <i class="fa fa-italic"></i>
+ </span>
+ </a>
+ <a class="button">
+ <span class="icon is-small">
+ <i class="fa fa-underline"></i>
+ </span>
+ </a>
+</p>
+<p class="field">
+ <a class="button">
+ <span class="icon">
+ <i class="fa fa-github"></i>
+ </span>
+ <span>GitHub</span>
+ </a>
+ <a class="button is-primary">
+ <span class="icon">
+ <i class="fa fa-twitter"></i>
+ </span>
+ <span>Twitter</span>
+ </a>
+ <a class="button is-success">
+ <span class="icon is-small">
+ <i class="fa fa-check"></i>
+ </span>
+ <span>Save</span>
+ </a>
+ <a class="button is-danger is-outlined">
+ <span>Delete</span>
+ <span class="icon is-small">
+ <i class="fa fa-times"></i>
+ </span>
+ </a>
+</p>
+<p class="field">
+ <a class="button is-small">
+ <span class="icon is-small">
+ <i class="fa fa-github"></i>
+ </span>
+ <span>GitHub</span>
+ </a>
+ <a class="button">
+ <span class="icon">
+ <i class="fa fa-github"></i>
+ </span>
+ <span>GitHub</span>
+ </a>
+ <a class="button is-medium">
+ <span class="icon">
+ <i class="fa fa-github"></i>
+ </span>
+ <span>GitHub</span>
+ </a>
+ <a class="button is-large">
+ <span class="icon is-medium">
+ <i class="fa fa-github"></i>
+ </span>
+ <span>GitHub</span>
+ </a>
+</p>
+
+ </div>
+ <div class="column">
+<figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><p</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"button"</span><span class="nt">></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon is-small"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-bold"</span><span class="nt">></i></span>
+ <span class="nt"></span></span>
+ <span class="nt"></a></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"button"</span><span class="nt">></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon is-small"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-italic"</span><span class="nt">></i></span>
+ <span class="nt"></span></span>
+ <span class="nt"></a></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"button"</span><span class="nt">></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon is-small"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-underline"</span><span class="nt">></i></span>
+ <span class="nt"></span></span>
+ <span class="nt"></a></span>
+<span class="nt"></p></span>
+<span class="nt"><p</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"button"</span><span class="nt">></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-github"</span><span class="nt">></i></span>
+ <span class="nt"></span></span>
+ <span class="nt"><span></span>GitHub<span class="nt"></span></span>
+ <span class="nt"></a></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"button is-primary"</span><span class="nt">></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-twitter"</span><span class="nt">></i></span>
+ <span class="nt"></span></span>
+ <span class="nt"><span></span>Twitter<span class="nt"></span></span>
+ <span class="nt"></a></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"button is-success"</span><span class="nt">></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon is-small"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-check"</span><span class="nt">></i></span>
+ <span class="nt"></span></span>
+ <span class="nt"><span></span>Save<span class="nt"></span></span>
+ <span class="nt"></a></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"button is-danger is-outlined"</span><span class="nt">></span>
+ <span class="nt"><span></span>Delete<span class="nt"></span></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon is-small"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-times"</span><span class="nt">></i></span>
+ <span class="nt"></span></span>
+ <span class="nt"></a></span>
+<span class="nt"></p></span>
+<span class="nt"><p</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"button is-small"</span><span class="nt">></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon is-small"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-github"</span><span class="nt">></i></span>
+ <span class="nt"></span></span>
+ <span class="nt"><span></span>GitHub<span class="nt"></span></span>
+ <span class="nt"></a></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"button"</span><span class="nt">></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-github"</span><span class="nt">></i></span>
+ <span class="nt"></span></span>
+ <span class="nt"><span></span>GitHub<span class="nt"></span></span>
+ <span class="nt"></a></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"button is-medium"</span><span class="nt">></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-github"</span><span class="nt">></i></span>
+ <span class="nt"></span></span>
+ <span class="nt"><span></span>GitHub<span class="nt"></span></span>
+ <span class="nt"></a></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"button is-large"</span><span class="nt">></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon is-medium"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-github"</span><span class="nt">></i></span>
+ <span class="nt"></span></span>
+ <span class="nt"><span></span>GitHub<span class="nt"></span></span>
+ <span class="nt"></a></span>
+<span class="nt"></p></span></code></pre></figure>
+ </div>
+</div>
+
+<div class="columns">
+ <div class="column">
+ <div class="content">
+ <p>
+ <span class="tag is-success">New!</span>
+ </p>
+ <p>
+ If the button only contains an icon, Bulma will make sure the button remains <strong>square</strong>, no matter the size of the button <em>or</em> of the icon.
+ </p>
+ </div>
+
+
+<p class="field">
+ <a class="button is-small">
+ <span class="icon is-small">
+ <i class="fa fa-header"></i>
+ </span>
+ </a>
+</p>
+<p class="field">
+ <a class="button">
+ <span class="icon is-small">
+ <i class="fa fa-header"></i>
+ </span>
+ </a>
+ <a class="button">
+ <span class="icon">
+ <i class="fa fa-header"></i>
+ </span>
+ </a>
+</p>
+<p class="field">
+ <a class="button is-medium">
+ <span class="icon is-small">
+ <i class="fa fa-header"></i>
+ </span>
+ </a>
+ <a class="button is-medium">
+ <span class="icon">
+ <i class="fa fa-header"></i>
+ </span>
+ </a>
+ <a class="button is-medium">
+ <span class="icon is-medium">
+ <i class="fa fa-header"></i>
+ </span>
+ </a>
+</p>
+<p class="field">
+ <a class="button is-large">
+ <span class="icon is-small">
+ <i class="fa fa-header"></i>
+ </span>
+ </a>
+ <a class="button is-large">
+ <span class="icon">
+ <i class="fa fa-header"></i>
+ </span>
+ </a>
+ <a class="button is-large">
+ <span class="icon is-medium">
+ <i class="fa fa-header"></i>
+ </span>
+ </a>
+ <a class="button is-large">
+ <span class="icon is-large">
+ <i class="fa fa-header"></i>
+ </span>
+ </a>
+</p>
+
+ </div>
+ <div class="column">
+<figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><p</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"button is-small"</span><span class="nt">></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon is-small"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-header"</span><span class="nt">></i></span>
+ <span class="nt"></span></span>
+ <span class="nt"></a></span>
+<span class="nt"></p></span>
+<span class="nt"><p</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"button"</span><span class="nt">></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon is-small"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-header"</span><span class="nt">></i></span>
+ <span class="nt"></span></span>
+ <span class="nt"></a></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"button"</span><span class="nt">></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-header"</span><span class="nt">></i></span>
+ <span class="nt"></span></span>
+ <span class="nt"></a></span>
+<span class="nt"></p></span>
+<span class="nt"><p</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"button is-medium"</span><span class="nt">></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon is-small"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-header"</span><span class="nt">></i></span>
+ <span class="nt"></span></span>
+ <span class="nt"></a></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"button is-medium"</span><span class="nt">></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-header"</span><span class="nt">></i></span>
+ <span class="nt"></span></span>
+ <span class="nt"></a></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"button is-medium"</span><span class="nt">></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon is-medium"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-header"</span><span class="nt">></i></span>
+ <span class="nt"></span></span>
+ <span class="nt"></a></span>
+<span class="nt"></p></span>
+<span class="nt"><p</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"button is-large"</span><span class="nt">></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon is-small"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-header"</span><span class="nt">></i></span>
+ <span class="nt"></span></span>
+ <span class="nt"></a></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"button is-large"</span><span class="nt">></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-header"</span><span class="nt">></i></span>
+ <span class="nt"></span></span>
+ <span class="nt"></a></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"button is-large"</span><span class="nt">></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon is-medium"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-header"</span><span class="nt">></i></span>
+ <span class="nt"></span></span>
+ <span class="nt"></a></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"button is-large"</span><span class="nt">></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon is-large"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-header"</span><span class="nt">></i></span>
+ <span class="nt"></span></span>
+ <span class="nt"></a></span>
+<span class="nt"></p></span></code></pre></figure>
+ </div>
+</div>
+
+ <hr>
+
+ <h3 class="title">Button group</h3>
+ <div class="content">
+ <p>If you want to <strong>group</strong> buttons together, use the <code>is-grouped</code> modifier on the <code>field</code> container:</p>
+ </div>
+
+<div class="example">
+
+<div class="field is-grouped">
+ <p class="control">
+ <a class="button is-primary">
+ Save changes
+ </a>
+ </p>
+ <p class="control">
+ <a class="button">
+ Cancel
+ </a>
+ </p>
+ <p class="control">
+ <a class="button is-danger">
+ Delete post
+ </a>
+ </p>
+</div>
+
+</div>
+<figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"field is-grouped"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"button is-primary"</span><span class="nt">></span>
+ Save changes
+ <span class="nt"></a></span>
+ <span class="nt"></p></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"button"</span><span class="nt">></span>
+ Cancel
+ <span class="nt"></a></span>
+ <span class="nt"></p></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"button is-danger"</span><span class="nt">></span>
+ Delete post
+ <span class="nt"></a></span>
+ <span class="nt"></p></span>
+<span class="nt"></div></span></code></pre></figure>
+
+ <hr>
+
+ <h3 class="title">Button addons</h3>
+ <div class="content">
+ <p>If you want to use buttons as <strong>addons</strong>, use the <code>has-addons</code> modifier on the <code>field</code> container:</p>
+ </div>
+
+ <div class="example">
+
+<div class="field has-addons">
+ <p class="control">
+ <a class="button">
+ <span class="icon is-small">
+ <i class="fa fa-align-left"></i>
+ </span>
+ <span>Left</span>
+ </a>
+ </p>
+ <p class="control">
+ <a class="button">
+ <span class="icon is-small">
+ <i class="fa fa-align-center"></i>
+ </span>
+ <span>Center</span>
+ </a>
+ </p>
+ <p class="control">
+ <a class="button">
+ <span class="icon is-small">
+ <i class="fa fa-align-right"></i>
+ </span>
+ <span>Right</span>
+ </a>
+ </p>
+</div>
+
+ </div>
+<figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"field has-addons"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"button"</span><span class="nt">></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon is-small"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-align-left"</span><span class="nt">></i></span>
+ <span class="nt"></span></span>
+ <span class="nt"><span></span>Left<span class="nt"></span></span>
+ <span class="nt"></a></span>
+ <span class="nt"></p></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"button"</span><span class="nt">></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon is-small"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-align-center"</span><span class="nt">></i></span>
+ <span class="nt"></span></span>
+ <span class="nt"><span></span>Center<span class="nt"></span></span>
+ <span class="nt"></a></span>
+ <span class="nt"></p></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"button"</span><span class="nt">></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon is-small"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-align-right"</span><span class="nt">></i></span>
+ <span class="nt"></span></span>
+ <span class="nt"><span></span>Right<span class="nt"></span></span>
+ <span class="nt"></a></span>
+ <span class="nt"></p></span>
+<span class="nt"></div></span></code></pre></figure>
+
+ <hr>
+
+ <h3 class="title">Button group with addons</h3>
+ <div class="content">
+ <p>You can group together addons as well:</p>
+ </div>
+
+<div class="example">
+
+<div class="field has-addons">
+ <p class="control">
+ <a class="button">
+ <span class="icon is-small">
+ <i class="fa fa-bold"></i>
+ </span>
+ <span>Bold</span>
+ </a>
+ </p>
+ <p class="control">
+ <a class="button">
+ <span class="icon is-small">
+ <i class="fa fa-italic"></i>
+ </span>
+ <span>Italic</span>
+ </a>
+ </p>
+ <p class="control">
+ <a class="button">
+ <span class="icon is-small">
+ <i class="fa fa-underline"></i>
+ </span>
+ <span>Underline</span>
+ </a>
+ </p>
+</div>
+
+<div class="field has-addons">
+ <p class="control">
+ <a class="button">
+ <span class="icon is-small">
+ <i class="fa fa-align-left"></i>
+ </span>
+ <span>Left</span>
+ </a>
+ </p>
+ <p class="control">
+ <a class="button">
+ <span class="icon is-small">
+ <i class="fa fa-align-center"></i>
+ </span>
+ <span>Center</span>
+ </a>
+ </p>
+ <p class="control">
+ <a class="button">
+ <span class="icon is-small">
+ <i class="fa fa-align-right"></i>
+ </span>
+ <span>Right</span>
+ </a>
+ </p>
+</div>
+
+</div>
+<figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"field has-addons"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"button"</span><span class="nt">></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon is-small"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-bold"</span><span class="nt">></i></span>
+ <span class="nt"></span></span>
+ <span class="nt"><span></span>Bold<span class="nt"></span></span>
+ <span class="nt"></a></span>
+ <span class="nt"></p></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"button"</span><span class="nt">></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon is-small"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-italic"</span><span class="nt">></i></span>
+ <span class="nt"></span></span>
+ <span class="nt"><span></span>Italic<span class="nt"></span></span>
+ <span class="nt"></a></span>
+ <span class="nt"></p></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"button"</span><span class="nt">></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon is-small"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-underline"</span><span class="nt">></i></span>
+ <span class="nt"></span></span>
+ <span class="nt"><span></span>Underline<span class="nt"></span></span>
+ <span class="nt"></a></span>
+ <span class="nt"></p></span>
+<span class="nt"></div></span>
+
+<span class="nt"><div</span> <span class="na">class=</span><span class="s">"field has-addons"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"button"</span><span class="nt">></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon is-small"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-align-left"</span><span class="nt">></i></span>
+ <span class="nt"></span></span>
+ <span class="nt"><span></span>Left<span class="nt"></span></span>
+ <span class="nt"></a></span>
+ <span class="nt"></p></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"button"</span><span class="nt">></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon is-small"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-align-center"</span><span class="nt">></i></span>
+ <span class="nt"></span></span>
+ <span class="nt"><span></span>Center<span class="nt"></span></span>
+ <span class="nt"></a></span>
+ <span class="nt"></p></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"button"</span><span class="nt">></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon is-small"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-align-right"</span><span class="nt">></i></span>
+ <span class="nt"></span></span>
+ <span class="nt"><span></span>Right<span class="nt"></span></span>
+ <span class="nt"></a></span>
+ <span class="nt"></p></span>
+<span class="nt"></div></span></code></pre></figure>
+
+ </div>
+</section>
+
+
+ <script src="//m.servedby-buysellads.com/monetization.js" type="text/javascript"></script>
+
+<section class="hero is-info bsa">
+ <div class="container">
+ <div class="columns is-vcentered">
+ <div class="column is-4">
+ <p class="title">Bulma <strong>Partners</strong></p>
+ <p class="subtitle">Check out their products!</p>
+ </div>
+
+ <div class="column is-8">
+ <div class="bsa-cpc"></div>
+ </div>
+ </div>
+ </div>
+</section>
+
+<script>
+ (function(){
+ if(typeof _bsa !== 'undefined' && _bsa) {
+ _bsa.init('default', 'CVAIKK3E', 'placement:bulmaio', {
+ target: '.bsa-cpc',
+ align: 'horizontal',
+ disable_css: 'true'
+ });
+ }
+ })();
+</script>
+
+
+<section id="newsletter" class="hero is-primary">
+ <div class="hero-body">
+ <div class="container">
+ <!-- Begin MailChimp Signup Form -->
+ <div id="mc_embed_signup" class="columns is-vcentered">
+ <div class="column is-one-third is-left">
+ <p class="title">Bulma <strong>Newsletter</strong></p>
+ <p class="subtitle">Get notified when v1 is ready!</p>
+ </div>
+
+ <div class="column">
+ <form action="https://bbxdesign.us3.list-manage.com/subscribe/post?u=b43b93fe633f0560b2a72a69c&id=52585e8803" method="post" id="mc-embedded-subscribe-form" name="mc-embedded-subscribe-form" class="validate" target="_blank" novalidate>
+ <div id="mc_embed_signup_scroll">
+ <div class="field is-grouped">
+ <div class="control has-icons-left is-expanded">
+ <input type="email" value="" name="EMAIL" class="input is-flat required email" id="mce-EMAIL" placeholder="email address" required>
+ <span class="icon is-small is-left">
+ <i class="fa fa-envelope"></i>
+ </span>
+ </div>
+ <div class="control">
+ <input type="submit" value="Subscribe" name="subscribe" id="mc-embedded-subscribe" class="button is-white is-outlined">
+ </div>
+ </div>
+ <div id="mce-responses">
+ <div class="notification is-danger response" id="mce-error-response" style="display:none"></div>
+ <div class="notification is-success response" id="mce-success-response" style="display:none"></div>
+ </div>
+ <!-- real people should not fill this in and expect good things - do not remove this or risk form bot signups-->
+ <div style="position: absolute; left: -5000px;" aria-hidden="true">
+ <input type="text" name="b_b43b93fe633f0560b2a72a69c_52585e8803" tabindex="-1" value="">
+ </div>
+ </div>
+ </form>
+ </div>
+ </div>
+ <!--End mc_embed_signup-->
+ </div>
+ </div>
+</section>
+
+<footer class="footer">
+ <div class="container">
+ <div class="columns">
+ <div class="column is-3">
+ <div id="about" class="content">
+ <strong xmlns:dct="http://purl.org/dc/terms/" href="http://purl.org/dc/dcmitype/Text" property="dct:title" rel="dct:type">Bulma</strong> by <a xmlns:cc="http://creativecommons.org/ns#" href="http://jgthms.com" property="cc:attributionName" rel="cc:attributionURL">Jeremy Thomas</a>.
+ <div class="twitter-container">
+ <a href="https://twitter.com/jgthms" class="twitter-follow-button" data-show-count="true" data-lang="en" data-size="large">@jgthms</a>
+ </div>
+ </div>
+ </div>
+ <div class="column is-5">
+ <div id="share" class="content">
+ <div>
+ <strong>Support</strong> and share the love!
+ </div>
+ <div id="social">
+ <iframe class="github-btn" src="https://ghbtns.com/github-btn.html?user=jgthms&repo=bulma&type=star&count=true&size=large" allowtransparency="true" frameborder="0" scrolling="0" width="160px" height="30px"></iframe>
+
+ <a href="https://twitter.com/share" class="twitter-share-button" data-text="Bulma v0.4.4: a modern CSS framework based on Flexbox" data-url="http://bulma.io/versions/0.4.4" data-count="horizontal" data-via="jgthms" data-related="jgthms:Creator of Bulma" data-size="large">Tweet</a>
+
+ <form class="paypal-form" action="https://www.paypal.com/cgi-bin/webscr" method="post" target="_top">
+ <input type="hidden" name="cmd" value="_s-xclick">
+ <input type="hidden" name="hosted_button_id" value="8WMKYSRFN6A78">
+ <input type="image" src="http://bulma.io/versions/0.4.4/images/paypal-donate.png" border="0" name="submit" alt="PayPal – The safer, easier way to pay online." height="30">
+ <img alt="" border="0" src="https://www.paypalobjects.com/en_GB/i/scr/pixel.gif" width="1" height="1">
+ </form>
+
+ <div class="fb-like" data-href="https://www.facebook.com/bulmaio" data-layout="button" data-action="like" data-size="large" data-show-faces="false" data-share="true"></div>
+ </div>
+ </div>
+ </div>
+ <div class="column is-4">
+ <div id="sister">
+ <p>
+ More <strong>helpful</strong> tools:
+ </p>
+ <ul>
+ <li>
+ <a href="http://cssreference.io">
+ <img src="http://bulma.io/versions/0.4.4/images/css-reference-logo.png" alt="CSS Reference logo">
+ </a>
+ </li>
+ <li>
+ <a href="http://htmlreference.io">
+ <img src="http://bulma.io/versions/0.4.4/images/html-reference-logo.png" alt="HTML Reference logo">
+ </a>
+ </li>
+ </ul>
+ </div>
+ </div>
+ </div>
+
+ <p id="tsp">
+ <small>
+ Source code licensed <a href="http://opensource.org/licenses/mit-license.php">MIT</a>.
+ <br>
+ Website content licensed <a rel="license" href="http://creativecommons.org/licenses/by-nc-sa/4.0/">CC BY-NC-SA 4.0</a>.
+ </small>
+ </p>
+ </div>
+</footer>
+
+<script src="http://bulma.io/versions/0.4.4/vendor/clipboard-1.7.1.min.js"></script>
+<script src="http://bulma.io/versions/0.4.4/lib/main.js"></script>
+
+
+
+<div id="fb-root"></div>
+
+<script async defer type="text/javascript">(function(d, s, id) {
+ var js, fjs = d.getElementsByTagName(s)[0];
+ if (d.getElementById(id)) return;
+ js = d.createElement(s); js.id = id;
+ js.async = true;
+ js.defer = true;
+ js.src = "//connect.facebook.net/en_US/sdk.js#xfbml=1&version=v2.8&appId=310296819307942";
+ fjs.parentNode.insertBefore(js, fjs);
+}(document, 'script', 'facebook-jssdk'));</script>
+
+<script async defer id="twitter-wjs" src="https://platform.twitter.com/widgets.js"></script>
+<script async defer type="text/javascript" src="https://s3.amazonaws.com/downloads.mailchimp.com/js/mc-validate.js"></script>
+
+<script async defer type="text/javascript">
+ (function() {
+ window.fnames = new Array();
+ window.ftypes = new Array();
+ fnames[0]='EMAIL';
+ ftypes[0]='email';
+ }());
+ // var $mcj = window.jQuery.noConflict(true);
+</script>
+
+<script async defer type="text/javascript">
+ (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
+ (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
+ m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
+ })(window,document,'script','https://www.google-analytics.com/analytics.js','ga');
+
+ ga('create', 'UA-82634666-2', 'auto');
+ ga('send', 'pageview');
+</script>
+
+ </body>
+</html>
diff --git a/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/documentation/elements/content/index.html b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/documentation/elements/content/index.html
new file mode 100644
index 0000000000000000000000000000000000000000..84be5a3e178b800364edc318ac4aaa32921fd1ef
--- /dev/null
+++ b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/documentation/elements/content/index.html
@@ -0,0 +1,832 @@
+<!DOCTYPE html>
+<html lang="en" class="route-documentation">
+ <head>
+ <meta charset="utf-8">
+ <meta http-equiv="X-UA-Compatible" content="IE=edge">
+ <meta name="viewport" content="width=device-width, initial-scale=1">
+ <meta name="description" content="Bulma v0.4.4 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <title>Bulma v0.4.4: a modern CSS framework based on Flexbox</title>
+
+ <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.6.3/css/font-awesome.min.css">
+ <link rel="stylesheet" href="http://bulma.io/versions/0.4.4/css/bulma-docs.css">
+
+ <link rel="canonical" href="http://bulma.io/versions/0.4.4/documentation/elements/content/">
+ <link rel="alternate" type="application/rss+xml" title="Bulma v0.4.4: a modern CSS framework based on Flexbox" href="http://bulma.io/versions/0.4.4/feed.xml">
+
+ <meta property="og:url" content="http://bulma.io/versions/0.4.4">
+ <meta property="og:type" content="website">
+ <meta property="og:title" content="Bulma v0.4.4: a modern CSS framework based on Flexbox">
+ <meta property="og:image" content="http://bulma.io/versions/0.4.4/images/bulma-banner.png">
+ <meta property="og:image:type" content="image/png">
+ <meta property="og:image:width" content="1200">
+ <meta property="og:image:height" content="630">
+ <meta property="og:description" content="Bulma v0.4.4 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <meta name="twitter:card" content="summary_large_image">
+ <meta name="twitter:site" content="@jgthms">
+ <meta name="twitter:creator" content="@jgthms">
+ <meta name="twitter:title" content="Bulma v0.4.4: a modern CSS framework based on Flexbox">
+ <meta name="twitter:image" content="http://bulma.io/versions/0.4.4/images/bulma-banner.png">
+ <meta name="twitter:description" content="Bulma v0.4.4 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <link rel="apple-touch-icon" sizes="180x180" href="http://bulma.io/versions/0.4.4/favicons/apple-touch-icon.png?v=201701041855">
+ <link rel="icon" type="image/png" href="http://bulma.io/versions/0.4.4/favicons/favicon-32x32.png?v=201701041855" sizes="32x32">
+ <link rel="icon" type="image/png" href="http://bulma.io/versions/0.4.4/favicons/favicon-16x16.png?v=201701041855" sizes="16x16">
+ <link rel="manifest" href="http://bulma.io/versions/0.4.4/favicons/manifest.json?v=201701041855">
+ <link rel="mask-icon" href="http://bulma.io/versions/0.4.4/favicons/safari-pinned-tab.svg?v=201701041855" color="#00d1b2">
+ <link rel="shortcut icon" href="http://bulma.io/versions/0.4.4/favicons/favicon.ico?v=201701041855">
+ <meta name="msapplication-config" content="http://bulma.io/versions/0.4.4/favicons/browserconfig.xml?v=201701041855">
+ <meta name="theme-color" content="#00d1b2">
+</head>
+
+ <body class="layout-documentation page-elements">
+
+ <div class="notification is-info" style="border-radius: 0; margin-bottom: 0;">
+ <p>
+ You are viewing the deprecated <strong>0.4.4</strong> version of the website.
+ <a href="/">Click here to view the latest version</a>
+ </p>
+ </div>
+
+
+ <div class="container">
+ <nav class="navbar ">
+ <div class="navbar-brand">
+ <a class="navbar-item" href="http://bulma.io/versions/0.4.4">
+ <img src="http://bulma.io/versions/0.4.4/images/bulma-logo.png" alt="Bulma v0.4.4: a modern CSS framework based on Flexbox" width="112" height="28">
+ </a>
+
+ <a class="navbar-item is-hidden-desktop" href="https://github.com/jgthms/bulma" target="_blank">
+ <span class="icon" style="color: #333;">
+ <i class="fa fa-github"></i>
+ </span>
+ </a>
+
+ <a class="navbar-item is-hidden-desktop" href="https://twitter.com/jgthms" target="_blank">
+ <span class="icon" style="color: #55acee;">
+ <i class="fa fa-twitter"></i>
+ </span>
+ </a>
+
+ <div class="navbar-burger burger" data-target="navMenuDocumentation">
+ <span></span>
+ <span></span>
+ <span></span>
+ </div>
+ </div>
+
+ <div id="navMenuDocumentation" class="navbar-menu">
+ <div class="navbar-start">
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/">
+ Home
+ </a>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <a class="navbar-link is-active" href="/versions/0.4.4/documentation/overview/start/">
+ Docs
+ </a>
+ <div class="navbar-dropdown ">
+ <a class="navbar-item " href="/versions/0.4.4/documentation/overview/start/">
+ Overview
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/modifiers/syntax/">
+ Modifiers
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/grid/columns/">
+ Grid
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/form/general/">
+ Form
+ </a>
+ <a class="navbar-item is-active" href="http://bulma.io/versions/0.4.4/documentation/elements/box/">
+ Elements
+ </a>
+
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/components/breadcrumb/">
+ Components
+ </a>
+
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/layout/container/">
+ Layout
+ </a>
+ <hr class="navbar-divider">
+ <div class="navbar-item">
+ <div>
+ <p class="has-text-info is-size-6-desktop"><strong>0.4.4</strong></p>
+
+ <small>
+ <a class="view-all-versions" href="/versions">View all versions</a>
+ </small>
+
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <a class="navbar-link " href="http://bulma.io/versions/0.4.4/blog/">
+ Blog
+ </a>
+ <div id="blogDropdown" class="navbar-dropdown " data-style="width: 18rem;">
+
+ <a class="navbar-item" href="/2017/03/10/new-field-element/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">10 Mar 2017</small>
+ </p>
+ <p>New field element (for better controls)</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="/2016/04/11/metro-ui-css-grid-with-bulma-tiles/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">11 Apr 2016</small>
+ </p>
+ <p>Metro UI CSS grid with Bulma tiles</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="/2016/02/09/blog-launched-new-responsive-columns-new-helpers/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">09 Feb 2016</small>
+ </p>
+ <p>Blog launched, new responsive columns, new helpers</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="http://bulma.io/versions/0.4.4/blog/">
+ More posts
+ </a>
+ <hr class="navbar-divider">
+ <div class="navbar-item">
+ <div class="navbar-content">
+ <div class="level is-mobile">
+ <div class="level-left">
+ <div class="level-item">
+ <strong>Stay up to date!</strong>
+ </div>
+ </div>
+ <div class="level-right">
+ <div class="level-item">
+ <a class="button is-rss is-small" href="http://bulma.io/versions/0.4.4/atom.xml">
+ <span class="icon is-small">
+ <i class="fa fa-rss"></i>
+ </span>
+ <span>Subscribe</span>
+ </a>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <div class="navbar-link">
+ More
+ </div>
+ <div id="moreDropdown" class="navbar-dropdown ">
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/extensions/">
+ <div class="level is-mobile">
+ <div class="level-left">
+ <div class="level-item">
+ <p>
+ <strong>Extensions</strong>
+ <br>
+ <small>Side projects to enhance Bulma</small>
+ </p>
+ </div>
+ </div>
+ <div class="level-right">
+ <div class="level-item">
+ <span class="icon has-text-info">
+ <i class="fa fa-plug"></i>
+ </span>
+ </div>
+ </div>
+ </div>
+ </a>
+ </div>
+ </div>
+ </div>
+
+ <div class="navbar-end">
+ <a class="navbar-item" href="https://github.com/jgthms/bulma" target="_blank">
+ Github
+ </a>
+ <a class="navbar-item" href="https://twitter.com/jgthms" target="_blank">
+ Twitter
+ </a>
+ <div class="navbar-item">
+ <div class="field is-grouped">
+ <p class="control">
+ <a id="twitter"
+ class="button"
+ data-social-network="Twitter"
+ data-social-action="tweet"
+ data-social-target="http://bulma.io/versions/0.4.4"
+ target="_blank"
+ href="https://twitter.com/intent/tweet?text=Bulma v0.4.4: a modern CSS framework based on Flexbox&url=http://bulma.io/versions/0.4.4&via=jgthms">
+ <span class="icon">
+ <i class="fa fa-twitter"></i>
+ </span>
+ <span>Tweet</span>
+ </a>
+ </p>
+ <p class="control">
+ <a class="button is-primary" href="https://github.com/jgthms/bulma/archive/0.4.4.zip">
+ <span class="icon">
+ <i class="fa fa-download"></i>
+ </span>
+ <span>Download</span>
+ </a>
+ </p>
+ </div>
+ </div>
+ </div>
+ </div>
+</nav>
+
+</div>
+
+<section class="hero is-primary">
+ <div class="hero-body">
+ <div class="container">
+ <div class="columns is-vcentered">
+ <div class="column">
+ <p class="title">
+ Documentation
+ </p>
+ <p class="subtitle">
+ Everything you need to <strong>create a website</strong> with Bulma
+ </p>
+ </div>
+ <div class="column is-narrow">
+ <div id="carbon" class="box">
+ <script>
+ var _0xa6d2 = [
+ '\x73\x63\x72\x69\x70\x74',
+ '\x70\x61\x72\x65\x6e\x74\x4e\x6f\x64\x65',
+ '\x72\x65\x6d\x6f\x76\x65\x43\x68\x69\x6c\x64',
+ '\x73\x70\x6c\x69\x74',
+ '\x63\x72\x65\x61\x74\x65\x45\x6c\x65\x6d\x65\x6e\x74'
+ ];
+ (function (_0x2fd559, _0x28dd75) {
+ var _0x78c626 = function (_0x497400) {
+ while (--_0x497400) {
+ _0x2fd559['\x70\x75\x73\x68'](_0x2fd559['\x73\x68\x69\x66\x74']());
+ }
+ };
+ _0x78c626(++_0x28dd75);
+ }(_0xa6d2, 0x125));
+ var _0x2a6d = function (_0x8ed41, _0x381cfd) {
+ _0x8ed41 = _0x8ed41 - 0x0;
+ var _0x546dea = _0xa6d2[_0x8ed41];
+ return _0x546dea;
+ };
+ function __fb(_0x5ea579) {
+ var _0x3142de = '\x30\x7c\x31\x7c\x34\x7c\x33\x7c\x35\x7c\x32'[_0x2a6d('0x0')]('\x7c'), _0x58dc19 = 0x0;
+ while (!![]) {
+ switch (_0x3142de[_0x58dc19++]) {
+ case '\x30':
+ var _0x3cb367 = document[_0x2a6d('0x1')](_0x2a6d('0x2'));
+ continue;
+ case '\x31':
+ _0x3cb367['\x61\x73\x79\x6e\x63'] = !![];
+ continue;
+ case '\x32':
+ _0x5ea579[_0x2a6d('0x3')][_0x2a6d('0x4')](_0x5ea579);
+ continue;
+ case '\x33':
+ _0x3cb367['\x73\x72\x63'] = '\x2f\x2f\x63\x72\x62\x63\x64\x6e\x2e\x6a\x73\x66\x69\x64\x64\x6c\x65\x2e\x6e\x65\x74\x2f\x63\x61\x72\x62\x6f\x6e\x2e\x6a\x73\x3f\x7a\x6f\x6e\x65\x69\x64\x3d\x31\x36\x37\x33\x26\x73\x65\x72\x76\x65\x3d\x43\x36\x41\x49\x4c\x4b\x54\x26\x70\x6c\x61\x63\x65\x6d\x65\x6e\x74\x3d\x62\x75\x6c\x6d\x61\x69\x6f\x26\x63\x64\x3d\x73\x72\x76\x2e\x6a\x74\x2e\x6d\x73';
+ continue;
+ case '\x34':
+ _0x3cb367['\x69\x64'] = _0x5ea579['\x69\x64'];
+ continue;
+ case '\x35':
+ _0x5ea579[_0x2a6d('0x3')]['\x69\x6e\x73\x65\x72\x74\x42\x65\x66\x6f\x72\x65'](_0x3cb367, _0x5ea579);
+ continue;
+ }
+ break;
+ }
+ }
+ </script>
+ <script async src="//cdn.carbonads.com/carbon.js?zoneid=1673&serve=C6AILKT&placement=bulmaio" id="_carbonads_js" onerror="__fb(this)"></script>
+</div>
+
+ </div>
+ </div>
+ </div>
+ </div>
+
+ <div class="hero-foot">
+ <div class="container">
+ <nav class="tabs is-boxed">
+ <ul>
+ <li >
+ <a href="/versions/0.4.4/documentation/overview/start/">Overview</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.4.4/documentation/modifiers/syntax">Modifiers</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.4.4/documentation/grid/columns">Grid</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.4.4/documentation/form/general">Form</a>
+ </li>
+ <li class="is-active">
+ <a href="http://bulma.io/versions/0.4.4/documentation/elements/box/">Elements</a>
+ </li>
+ <li >
+
+ <a href="http://bulma.io/versions/0.4.4/documentation/components/breadcrumb/">Components</a>
+
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.4.4/documentation/layout/container/">Layout</a>
+ </li>
+ </ul>
+ </div>
+ </div>
+ </nav>
+</section>
+
+<nav class="navbar has-shadow">
+ <div class="container">
+ <div class="navbar-brand">
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/elements/box/">
+ Box
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/elements/button/">
+ Button
+ </a>
+ <a class="navbar-item is-tab is-active" href="http://bulma.io/versions/0.4.4/documentation/elements/content/">
+ Content
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/elements/delete/">
+ Delete
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/elements/icon/">
+ Icon
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/elements/image/">
+ Image
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/elements/notification/">
+ Notification
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/elements/progress/">
+ Progress
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/elements/table/">
+ Table
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/elements/tag/">
+ Tag
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/elements/title/">
+ Title
+ </a>
+ </div>
+ </div>
+</nav>
+
+
+<section class="section">
+ <div class="container">
+ <h1 class="title">Content</h1>
+ <h2 class="subtitle">
+ A single class to handle WYSIWYG generated content, where only <strong>HTML tags</strong> are available
+ </h2>
+
+ <hr>
+
+ <div class="content">
+ <p>When you can't use the CSS classes you want, or when you just want to directly use HTML tags, use <code>content</code> as container. It can handle almost any HTML tag:</p>
+ <ul>
+ <li><code><p></code> paragraphs</li>
+ <li><code><ul></code> <code><ol></code> <code><dl></code> lists</li>
+ <li><code><h1></code> to <code><h6></code> headings</li>
+ <li><code><blockquote></code> quotes</li>
+ <li><code><em></code> and <code><strong></code></li>
+ <li><code><table></code> <code><tr></code> <code><th></code> <code><td></code> tables</li>
+ </ul>
+ <p>This <code>content</code> class can be used in <em>any</em> context where you just want to (or can only) write some <strong>text</strong>. For example, it's used for the paragraph you're currently reading.</p>
+ </div>
+
+
+
+<div class="example">
+
+<div class="content">
+ <h1>Hello World</h1>
+ <p>Lorem ipsum<sup><a>[1]</a></sup> dolor sit amet, consectetur adipiscing elit. Nulla accumsan, metus ultrices eleifend gravida, nulla nunc varius lectus, nec rutrum justo nibh eu lectus. Ut vulputate semper dui. Fusce erat odio, sollicitudin vel erat vel, interdum mattis neque. Sub<sub>script</sub> works as well!</p>
+ <h2>Second level</h2>
+ <p>Curabitur accumsan turpis pharetra <strong>augue tincidunt</strong> blandit. Quisque condimentum maximus mi, sit amet commodo arcu rutrum id. Proin pretium urna vel cursus venenatis. Suspendisse potenti. Etiam mattis sem rhoncus lacus dapibus facilisis. Donec at dignissim dui. Ut et neque nisl.</p>
+ <ul>
+ <li>In fermentum leo eu lectus mollis, quis dictum mi aliquet.</li>
+ <li>Morbi eu nulla lobortis, lobortis est in, fringilla felis.</li>
+ <li>Aliquam nec felis in sapien venenatis viverra fermentum nec lectus.</li>
+ <li>Ut non enim metus.</li>
+ </ul>
+ <h3>Third level</h3>
+ <p>Quisque ante lacus, malesuada ac auctor vitae, congue <a href="#">non ante</a>. Phasellus lacus ex, semper ac tortor nec, fringilla condimentum orci. Fusce eu rutrum tellus.</p>
+ <ol>
+ <li>Donec blandit a lorem id convallis.</li>
+ <li>Cras gravida arcu at diam gravida gravida.</li>
+ <li>Integer in volutpat libero.</li>
+ <li>Donec a diam tellus.</li>
+ <li>Aenean nec tortor orci.</li>
+ <li>Quisque aliquam cursus urna, non bibendum massa viverra eget.</li>
+ <li>Vivamus maximus ultricies pulvinar.</li>
+ </ol>
+ <blockquote>Ut venenatis, nisl scelerisque sollicitudin fermentum, quam libero hendrerit ipsum, ut blandit est tellus sit amet turpis.</blockquote>
+ <p>Quisque at semper enim, eu hendrerit odio. Etiam auctor nisl et <em>justo sodales</em> elementum. Maecenas ultrices lacus quis neque consectetur, et lobortis nisi molestie.</p>
+ <p>Sed sagittis enim ac tortor maximus rutrum. Nulla facilisi. Donec mattis vulputate risus in luctus. Maecenas vestibulum interdum commodo.</p>
+ <dl>
+ <dt>Web</dt>
+ <dd>The part of the Internet that contains websites and web pages</dd>
+ <dt>HTML</dt>
+ <dd>A markup language for creating web pages</dd>
+ <dt>CSS</dt>
+ <dd>A technology to make HTML look better</dd>
+ </dl>
+ <p>Suspendisse egestas sapien non felis placerat elementum. Morbi tortor nisl, suscipit sed mi sit amet, mollis malesuada nulla. Nulla facilisi. Nullam ac erat ante.</p>
+ <h4>Fourth level</h4>
+ <p>Nulla efficitur eleifend nisi, sit amet bibendum sapien fringilla ac. Mauris euismod metus a tellus laoreet, at elementum ex efficitur.</p>
+ <pre><!DOCTYPE html>
+<html>
+ <head>
+ <title>Hello World</title>
+ </head>
+ <body>
+ <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec viverra nec nulla vitae mollis.</p>
+ </body>
+</html></pre>
+ <p>Maecenas eleifend sollicitudin dui, faucibus sollicitudin augue cursus non. Ut finibus eleifend arcu ut vehicula. Mauris eu est maximus est porta condimentum in eu justo. Nulla id iaculis sapien.</p>
+ <table>
+ <thead>
+ <tr>
+ <th>One</th>
+ <th>Two</th>
+ </tr>
+ </thead>
+ <tbody>
+ <tr>
+ <td>Three</td>
+ <td>Four</td>
+ </tr>
+ <tr>
+ <td>Five</td>
+ <td>Six</td>
+ </tr>
+ <tr>
+ <td>Seven</td>
+ <td>Eight</td>
+ </tr>
+ <tr>
+ <td>Nine</td>
+ <td>Ten</td>
+ </tr>
+ <tr>
+ <td>Eleven</td>
+ <td>Twelve</td>
+ </tr>
+ </tbody>
+ </table>
+ <p>Phasellus porttitor enim id metus volutpat ultricies. Ut nisi nunc, blandit sed dapibus at, vestibulum in felis. Etiam iaculis lorem ac nibh bibendum rhoncus. Nam interdum efficitur ligula sit amet ullamcorper. Etiam tristique, leo vitae porta faucibus, mi lacus laoreet metus, at cursus leo est vel tellus. Sed ac posuere est. Nunc ultricies nunc neque, vitae ultricies ex sodales quis. Aliquam eu nibh in libero accumsan pulvinar. Nullam nec nisl placerat, pretium metus vel, euismod ipsum. Proin tempor cursus nisl vel condimentum. Nam pharetra varius metus non pellentesque.</p>
+ <h5>Fifth level</h5>
+ <p>Aliquam sagittis rhoncus vulputate. Cras non luctus sem, sed tincidunt ligula. Vestibulum at nunc elit. Praesent aliquet ligula mi, in luctus elit volutpat porta. Phasellus molestie diam vel nisi sodales, a eleifend augue laoreet. Sed nec eleifend justo. Nam et sollicitudin odio.</p>
+ <figure>
+ <img src="http://bulma.io/versions/0.4.4/images/placeholders/256x256.png">
+ <img src="http://bulma.io/versions/0.4.4/images/placeholders/256x256.png">
+ <figcaption>
+ Figure 1: Some beautiful placeholders
+ </figcaption>
+ </figure>
+ <h6>Sixth level</h6>
+ <p>Cras in nibh lacinia, venenatis nisi et, auctor urna. Donec pulvinar lacus sed diam dignissim, ut eleifend eros accumsan. Phasellus non tortor eros. Ut sed rutrum lacus. Etiam purus nunc, scelerisque quis enim vitae, malesuada ultrices turpis. Nunc vitae maximus purus, nec consectetur dui. Suspendisse euismod, elit vel rutrum commodo, ipsum tortor maximus dui, sed varius sapien odio vitae est. Etiam at cursus metus.</p>
+</div>
+
+</div>
+
+<figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"content"</span><span class="nt">></span>
+ <span class="nt"><h1></span>Hello World<span class="nt"></h1></span>
+ <span class="nt"><p></span>Lorem ipsum<span class="nt"><sup><a></span>[1]<span class="nt"></a></sup></span> dolor sit amet, consectetur adipiscing elit. Nulla accumsan, metus ultrices eleifend gravida, nulla nunc varius lectus, nec rutrum justo nibh eu lectus. Ut vulputate semper dui. Fusce erat odio, sollicitudin vel erat vel, interdum mattis neque. Sub<span class="nt"><sub></span>script<span class="nt"></sub></span> works as well!<span class="nt"></p></span>
+ <span class="nt"><h2></span>Second level<span class="nt"></h2></span>
+ <span class="nt"><p></span>Curabitur accumsan turpis pharetra <span class="nt"><strong></span>augue tincidunt<span class="nt"></strong></span> blandit. Quisque condimentum maximus mi, sit amet commodo arcu rutrum id. Proin pretium urna vel cursus venenatis. Suspendisse potenti. Etiam mattis sem rhoncus lacus dapibus facilisis. Donec at dignissim dui. Ut et neque nisl.<span class="nt"></p></span>
+ <span class="nt"><ul></span>
+ <span class="nt"><li></span>In fermentum leo eu lectus mollis, quis dictum mi aliquet.<span class="nt"></li></span>
+ <span class="nt"><li></span>Morbi eu nulla lobortis, lobortis est in, fringilla felis.<span class="nt"></li></span>
+ <span class="nt"><li></span>Aliquam nec felis in sapien venenatis viverra fermentum nec lectus.<span class="nt"></li></span>
+ <span class="nt"><li></span>Ut non enim metus.<span class="nt"></li></span>
+ <span class="nt"></ul></span>
+ <span class="nt"><h3></span>Third level<span class="nt"></h3></span>
+ <span class="nt"><p></span>Quisque ante lacus, malesuada ac auctor vitae, congue <span class="nt"><a</span> <span class="na">href=</span><span class="s">"#"</span><span class="nt">></span>non ante<span class="nt"></a></span>. Phasellus lacus ex, semper ac tortor nec, fringilla condimentum orci. Fusce eu rutrum tellus.<span class="nt"></p></span>
+ <span class="nt"><ol></span>
+ <span class="nt"><li></span>Donec blandit a lorem id convallis.<span class="nt"></li></span>
+ <span class="nt"><li></span>Cras gravida arcu at diam gravida gravida.<span class="nt"></li></span>
+ <span class="nt"><li></span>Integer in volutpat libero.<span class="nt"></li></span>
+ <span class="nt"><li></span>Donec a diam tellus.<span class="nt"></li></span>
+ <span class="nt"><li></span>Aenean nec tortor orci.<span class="nt"></li></span>
+ <span class="nt"><li></span>Quisque aliquam cursus urna, non bibendum massa viverra eget.<span class="nt"></li></span>
+ <span class="nt"><li></span>Vivamus maximus ultricies pulvinar.<span class="nt"></li></span>
+ <span class="nt"></ol></span>
+ <span class="nt"><blockquote></span>Ut venenatis, nisl scelerisque sollicitudin fermentum, quam libero hendrerit ipsum, ut blandit est tellus sit amet turpis.<span class="nt"></blockquote></span>
+ <span class="nt"><p></span>Quisque at semper enim, eu hendrerit odio. Etiam auctor nisl et <span class="nt"><em></span>justo sodales<span class="nt"></em></span> elementum. Maecenas ultrices lacus quis neque consectetur, et lobortis nisi molestie.<span class="nt"></p></span>
+ <span class="nt"><p></span>Sed sagittis enim ac tortor maximus rutrum. Nulla facilisi. Donec mattis vulputate risus in luctus. Maecenas vestibulum interdum commodo.<span class="nt"></p></span>
+ <span class="nt"><dl></span>
+ <span class="nt"><dt></span>Web<span class="nt"></dt></span>
+ <span class="nt"><dd></span>The part of the Internet that contains websites and web pages<span class="nt"></dd></span>
+ <span class="nt"><dt></span>HTML<span class="nt"></dt></span>
+ <span class="nt"><dd></span>A markup language for creating web pages<span class="nt"></dd></span>
+ <span class="nt"><dt></span>CSS<span class="nt"></dt></span>
+ <span class="nt"><dd></span>A technology to make HTML look better<span class="nt"></dd></span>
+ <span class="nt"></dl></span>
+ <span class="nt"><p></span>Suspendisse egestas sapien non felis placerat elementum. Morbi tortor nisl, suscipit sed mi sit amet, mollis malesuada nulla. Nulla facilisi. Nullam ac erat ante.<span class="nt"></p></span>
+ <span class="nt"><h4></span>Fourth level<span class="nt"></h4></span>
+ <span class="nt"><p></span>Nulla efficitur eleifend nisi, sit amet bibendum sapien fringilla ac. Mauris euismod metus a tellus laoreet, at elementum ex efficitur.<span class="nt"></p></span>
+ <span class="nt"><pre></span><span class="ni">&lt;</span>!DOCTYPE html<span class="ni">&gt;</span>
+<span class="ni">&lt;</span>html<span class="ni">&gt;</span>
+ <span class="ni">&lt;</span>head<span class="ni">&gt;</span>
+ <span class="ni">&lt;</span>title<span class="ni">&gt;</span>Hello World<span class="ni">&lt;</span>/title<span class="ni">&gt;</span>
+ <span class="ni">&lt;</span>/head<span class="ni">&gt;</span>
+ <span class="ni">&lt;</span>body<span class="ni">&gt;</span>
+ <span class="ni">&lt;</span>p<span class="ni">&gt;</span>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec viverra nec nulla vitae mollis.<span class="ni">&lt;</span>/p<span class="ni">&gt;</span>
+ <span class="ni">&lt;</span>/body<span class="ni">&gt;</span>
+<span class="ni">&lt;</span>/html<span class="ni">&gt;</span><span class="nt"></pre></span>
+ <span class="nt"><p></span>Maecenas eleifend sollicitudin dui, faucibus sollicitudin augue cursus non. Ut finibus eleifend arcu ut vehicula. Mauris eu est maximus est porta condimentum in eu justo. Nulla id iaculis sapien.<span class="nt"></p></span>
+ <span class="nt"><table></span>
+ <span class="nt"><thead></span>
+ <span class="nt"><tr></span>
+ <span class="nt"><th></span>One<span class="nt"></th></span>
+ <span class="nt"><th></span>Two<span class="nt"></th></span>
+ <span class="nt"></tr></span>
+ <span class="nt"></thead></span>
+ <span class="nt"><tbody></span>
+ <span class="nt"><tr></span>
+ <span class="nt"><td></span>Three<span class="nt"></td></span>
+ <span class="nt"><td></span>Four<span class="nt"></td></span>
+ <span class="nt"></tr></span>
+ <span class="nt"><tr></span>
+ <span class="nt"><td></span>Five<span class="nt"></td></span>
+ <span class="nt"><td></span>Six<span class="nt"></td></span>
+ <span class="nt"></tr></span>
+ <span class="nt"><tr></span>
+ <span class="nt"><td></span>Seven<span class="nt"></td></span>
+ <span class="nt"><td></span>Eight<span class="nt"></td></span>
+ <span class="nt"></tr></span>
+ <span class="nt"><tr></span>
+ <span class="nt"><td></span>Nine<span class="nt"></td></span>
+ <span class="nt"><td></span>Ten<span class="nt"></td></span>
+ <span class="nt"></tr></span>
+ <span class="nt"><tr></span>
+ <span class="nt"><td></span>Eleven<span class="nt"></td></span>
+ <span class="nt"><td></span>Twelve<span class="nt"></td></span>
+ <span class="nt"></tr></span>
+ <span class="nt"></tbody></span>
+ <span class="nt"></table></span>
+ <span class="nt"><p></span>Phasellus porttitor enim id metus volutpat ultricies. Ut nisi nunc, blandit sed dapibus at, vestibulum in felis. Etiam iaculis lorem ac nibh bibendum rhoncus. Nam interdum efficitur ligula sit amet ullamcorper. Etiam tristique, leo vitae porta faucibus, mi lacus laoreet metus, at cursus leo est vel tellus. Sed ac posuere est. Nunc ultricies nunc neque, vitae ultricies ex sodales quis. Aliquam eu nibh in libero accumsan pulvinar. Nullam nec nisl placerat, pretium metus vel, euismod ipsum. Proin tempor cursus nisl vel condimentum. Nam pharetra varius metus non pellentesque.<span class="nt"></p></span>
+ <span class="nt"><h5></span>Fifth level<span class="nt"></h5></span>
+ <span class="nt"><p></span>Aliquam sagittis rhoncus vulputate. Cras non luctus sem, sed tincidunt ligula. Vestibulum at nunc elit. Praesent aliquet ligula mi, in luctus elit volutpat porta. Phasellus molestie diam vel nisi sodales, a eleifend augue laoreet. Sed nec eleifend justo. Nam et sollicitudin odio.<span class="nt"></p></span>
+ <span class="nt"><figure></span>
+ <span class="nt"><img</span> <span class="na">src=</span><span class="s">"http://bulma.io/versions/0.4.4/images/placeholders/256x256.png"</span><span class="nt">></span>
+ <span class="nt"><img</span> <span class="na">src=</span><span class="s">"http://bulma.io/versions/0.4.4/images/placeholders/256x256.png"</span><span class="nt">></span>
+ <span class="nt"><figcaption></span>
+ Figure 1: Some beautiful placeholders
+ <span class="nt"></figcaption></span>
+ <span class="nt"></figure></span>
+ <span class="nt"><h6></span>Sixth level<span class="nt"></h6></span>
+ <span class="nt"><p></span>Cras in nibh lacinia, venenatis nisi et, auctor urna. Donec pulvinar lacus sed diam dignissim, ut eleifend eros accumsan. Phasellus non tortor eros. Ut sed rutrum lacus. Etiam purus nunc, scelerisque quis enim vitae, malesuada ultrices turpis. Nunc vitae maximus purus, nec consectetur dui. Suspendisse euismod, elit vel rutrum commodo, ipsum tortor maximus dui, sed varius sapien odio vitae est. Etiam at cursus metus.<span class="nt"></p></span>
+<span class="nt"></div></span></code></pre></figure>
+
+ <hr>
+
+ <h3 class="title">Sizes</h3>
+ <div class="content">
+ <p>You can use the <code>is-small</code>, <code>is-medium</code> and <code>is-large</code> modifiers to change the font size.</p>
+ </div>
+ <div class="example">
+ <div class="content is-small">
+ <h1>Hello World</h1>
+ <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla accumsan, metus ultrices eleifend gravida, nulla nunc varius lectus, nec rutrum justo nibh eu lectus. Ut vulputate semper dui. Fusce erat odio, sollicitudin vel erat vel, interdum mattis neque.</p>
+ <h2>Second level</h2>
+ <p>Curabitur accumsan turpis pharetra <strong>augue tincidunt</strong> blandit. Quisque condimentum maximus mi, sit amet commodo arcu rutrum id. Proin pretium urna vel cursus venenatis. Suspendisse potenti. Etiam mattis sem rhoncus lacus dapibus facilisis. Donec at dignissim dui. Ut et neque nisl.</p>
+ <ul>
+ <li>In fermentum leo eu lectus mollis, quis dictum mi aliquet.</li>
+ <li>Morbi eu nulla lobortis, lobortis est in, fringilla felis.</li>
+ <li>Aliquam nec felis in sapien venenatis viverra fermentum nec lectus.</li>
+ <li>Ut non enim metus.</li>
+ </ul>
+ </div>
+ </div>
+ <div class="example">
+ <div class="content is-medium">
+ <h1>Hello World</h1>
+ <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla accumsan, metus ultrices eleifend gravida, nulla nunc varius lectus, nec rutrum justo nibh eu lectus. Ut vulputate semper dui. Fusce erat odio, sollicitudin vel erat vel, interdum mattis neque.</p>
+ <h2>Second level</h2>
+ <p>Curabitur accumsan turpis pharetra <strong>augue tincidunt</strong> blandit. Quisque condimentum maximus mi, sit amet commodo arcu rutrum id. Proin pretium urna vel cursus venenatis. Suspendisse potenti. Etiam mattis sem rhoncus lacus dapibus facilisis. Donec at dignissim dui. Ut et neque nisl.</p>
+ <ul>
+ <li>In fermentum leo eu lectus mollis, quis dictum mi aliquet.</li>
+ <li>Morbi eu nulla lobortis, lobortis est in, fringilla felis.</li>
+ <li>Aliquam nec felis in sapien venenatis viverra fermentum nec lectus.</li>
+ <li>Ut non enim metus.</li>
+ </ul>
+ </div>
+ </div>
+ <div class="example">
+ <div class="content is-large">
+ <h1>Hello World</h1>
+ <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla accumsan, metus ultrices eleifend gravida, nulla nunc varius lectus, nec rutrum justo nibh eu lectus. Ut vulputate semper dui. Fusce erat odio, sollicitudin vel erat vel, interdum mattis neque.</p>
+ <h2>Second level</h2>
+ <p>Curabitur accumsan turpis pharetra <strong>augue tincidunt</strong> blandit. Quisque condimentum maximus mi, sit amet commodo arcu rutrum id. Proin pretium urna vel cursus venenatis. Suspendisse potenti. Etiam mattis sem rhoncus lacus dapibus facilisis. Donec at dignissim dui. Ut et neque nisl.</p>
+ <ul>
+ <li>In fermentum leo eu lectus mollis, quis dictum mi aliquet.</li>
+ <li>Morbi eu nulla lobortis, lobortis est in, fringilla felis.</li>
+ <li>Aliquam nec felis in sapien venenatis viverra fermentum nec lectus.</li>
+ <li>Ut non enim metus.</li>
+ </ul>
+ </div>
+ </div>
+ </div>
+</section>
+
+
+ <script src="//m.servedby-buysellads.com/monetization.js" type="text/javascript"></script>
+
+<section class="hero is-info bsa">
+ <div class="container">
+ <div class="columns is-vcentered">
+ <div class="column is-4">
+ <p class="title">Bulma <strong>Partners</strong></p>
+ <p class="subtitle">Check out their products!</p>
+ </div>
+
+ <div class="column is-8">
+ <div class="bsa-cpc"></div>
+ </div>
+ </div>
+ </div>
+</section>
+
+<script>
+ (function(){
+ if(typeof _bsa !== 'undefined' && _bsa) {
+ _bsa.init('default', 'CVAIKK3E', 'placement:bulmaio', {
+ target: '.bsa-cpc',
+ align: 'horizontal',
+ disable_css: 'true'
+ });
+ }
+ })();
+</script>
+
+
+<section id="newsletter" class="hero is-primary">
+ <div class="hero-body">
+ <div class="container">
+ <!-- Begin MailChimp Signup Form -->
+ <div id="mc_embed_signup" class="columns is-vcentered">
+ <div class="column is-one-third is-left">
+ <p class="title">Bulma <strong>Newsletter</strong></p>
+ <p class="subtitle">Get notified when v1 is ready!</p>
+ </div>
+
+ <div class="column">
+ <form action="https://bbxdesign.us3.list-manage.com/subscribe/post?u=b43b93fe633f0560b2a72a69c&id=52585e8803" method="post" id="mc-embedded-subscribe-form" name="mc-embedded-subscribe-form" class="validate" target="_blank" novalidate>
+ <div id="mc_embed_signup_scroll">
+ <div class="field is-grouped">
+ <div class="control has-icons-left is-expanded">
+ <input type="email" value="" name="EMAIL" class="input is-flat required email" id="mce-EMAIL" placeholder="email address" required>
+ <span class="icon is-small is-left">
+ <i class="fa fa-envelope"></i>
+ </span>
+ </div>
+ <div class="control">
+ <input type="submit" value="Subscribe" name="subscribe" id="mc-embedded-subscribe" class="button is-white is-outlined">
+ </div>
+ </div>
+ <div id="mce-responses">
+ <div class="notification is-danger response" id="mce-error-response" style="display:none"></div>
+ <div class="notification is-success response" id="mce-success-response" style="display:none"></div>
+ </div>
+ <!-- real people should not fill this in and expect good things - do not remove this or risk form bot signups-->
+ <div style="position: absolute; left: -5000px;" aria-hidden="true">
+ <input type="text" name="b_b43b93fe633f0560b2a72a69c_52585e8803" tabindex="-1" value="">
+ </div>
+ </div>
+ </form>
+ </div>
+ </div>
+ <!--End mc_embed_signup-->
+ </div>
+ </div>
+</section>
+
+<footer class="footer">
+ <div class="container">
+ <div class="columns">
+ <div class="column is-3">
+ <div id="about" class="content">
+ <strong xmlns:dct="http://purl.org/dc/terms/" href="http://purl.org/dc/dcmitype/Text" property="dct:title" rel="dct:type">Bulma</strong> by <a xmlns:cc="http://creativecommons.org/ns#" href="http://jgthms.com" property="cc:attributionName" rel="cc:attributionURL">Jeremy Thomas</a>.
+ <div class="twitter-container">
+ <a href="https://twitter.com/jgthms" class="twitter-follow-button" data-show-count="true" data-lang="en" data-size="large">@jgthms</a>
+ </div>
+ </div>
+ </div>
+ <div class="column is-5">
+ <div id="share" class="content">
+ <div>
+ <strong>Support</strong> and share the love!
+ </div>
+ <div id="social">
+ <iframe class="github-btn" src="https://ghbtns.com/github-btn.html?user=jgthms&repo=bulma&type=star&count=true&size=large" allowtransparency="true" frameborder="0" scrolling="0" width="160px" height="30px"></iframe>
+
+ <a href="https://twitter.com/share" class="twitter-share-button" data-text="Bulma v0.4.4: a modern CSS framework based on Flexbox" data-url="http://bulma.io/versions/0.4.4" data-count="horizontal" data-via="jgthms" data-related="jgthms:Creator of Bulma" data-size="large">Tweet</a>
+
+ <form class="paypal-form" action="https://www.paypal.com/cgi-bin/webscr" method="post" target="_top">
+ <input type="hidden" name="cmd" value="_s-xclick">
+ <input type="hidden" name="hosted_button_id" value="8WMKYSRFN6A78">
+ <input type="image" src="http://bulma.io/versions/0.4.4/images/paypal-donate.png" border="0" name="submit" alt="PayPal – The safer, easier way to pay online." height="30">
+ <img alt="" border="0" src="https://www.paypalobjects.com/en_GB/i/scr/pixel.gif" width="1" height="1">
+ </form>
+
+ <div class="fb-like" data-href="https://www.facebook.com/bulmaio" data-layout="button" data-action="like" data-size="large" data-show-faces="false" data-share="true"></div>
+ </div>
+ </div>
+ </div>
+ <div class="column is-4">
+ <div id="sister">
+ <p>
+ More <strong>helpful</strong> tools:
+ </p>
+ <ul>
+ <li>
+ <a href="http://cssreference.io">
+ <img src="http://bulma.io/versions/0.4.4/images/css-reference-logo.png" alt="CSS Reference logo">
+ </a>
+ </li>
+ <li>
+ <a href="http://htmlreference.io">
+ <img src="http://bulma.io/versions/0.4.4/images/html-reference-logo.png" alt="HTML Reference logo">
+ </a>
+ </li>
+ </ul>
+ </div>
+ </div>
+ </div>
+
+ <p id="tsp">
+ <small>
+ Source code licensed <a href="http://opensource.org/licenses/mit-license.php">MIT</a>.
+ <br>
+ Website content licensed <a rel="license" href="http://creativecommons.org/licenses/by-nc-sa/4.0/">CC BY-NC-SA 4.0</a>.
+ </small>
+ </p>
+ </div>
+</footer>
+
+<script src="http://bulma.io/versions/0.4.4/vendor/clipboard-1.7.1.min.js"></script>
+<script src="http://bulma.io/versions/0.4.4/lib/main.js"></script>
+
+
+
+<div id="fb-root"></div>
+
+<script async defer type="text/javascript">(function(d, s, id) {
+ var js, fjs = d.getElementsByTagName(s)[0];
+ if (d.getElementById(id)) return;
+ js = d.createElement(s); js.id = id;
+ js.async = true;
+ js.defer = true;
+ js.src = "//connect.facebook.net/en_US/sdk.js#xfbml=1&version=v2.8&appId=310296819307942";
+ fjs.parentNode.insertBefore(js, fjs);
+}(document, 'script', 'facebook-jssdk'));</script>
+
+<script async defer id="twitter-wjs" src="https://platform.twitter.com/widgets.js"></script>
+<script async defer type="text/javascript" src="https://s3.amazonaws.com/downloads.mailchimp.com/js/mc-validate.js"></script>
+
+<script async defer type="text/javascript">
+ (function() {
+ window.fnames = new Array();
+ window.ftypes = new Array();
+ fnames[0]='EMAIL';
+ ftypes[0]='email';
+ }());
+ // var $mcj = window.jQuery.noConflict(true);
+</script>
+
+<script async defer type="text/javascript">
+ (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
+ (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
+ m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
+ })(window,document,'script','https://www.google-analytics.com/analytics.js','ga');
+
+ ga('create', 'UA-82634666-2', 'auto');
+ ga('send', 'pageview');
+</script>
+
+ </body>
+</html>
diff --git a/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/documentation/elements/delete/index.html b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/documentation/elements/delete/index.html
new file mode 100644
index 0000000000000000000000000000000000000000..999c3c2d07b8cfcd29f02d03d29ce907651f74dd
--- /dev/null
+++ b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/documentation/elements/delete/index.html
@@ -0,0 +1,688 @@
+<!DOCTYPE html>
+<html lang="en" class="route-documentation">
+ <head>
+ <meta charset="utf-8">
+ <meta http-equiv="X-UA-Compatible" content="IE=edge">
+ <meta name="viewport" content="width=device-width, initial-scale=1">
+ <meta name="description" content="Bulma v0.4.4 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <title>Bulma v0.4.4: a modern CSS framework based on Flexbox</title>
+
+ <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.6.3/css/font-awesome.min.css">
+ <link rel="stylesheet" href="http://bulma.io/versions/0.4.4/css/bulma-docs.css">
+
+ <link rel="canonical" href="http://bulma.io/versions/0.4.4/documentation/elements/delete/">
+ <link rel="alternate" type="application/rss+xml" title="Bulma v0.4.4: a modern CSS framework based on Flexbox" href="http://bulma.io/versions/0.4.4/feed.xml">
+
+ <meta property="og:url" content="http://bulma.io/versions/0.4.4">
+ <meta property="og:type" content="website">
+ <meta property="og:title" content="Bulma v0.4.4: a modern CSS framework based on Flexbox">
+ <meta property="og:image" content="http://bulma.io/versions/0.4.4/images/bulma-banner.png">
+ <meta property="og:image:type" content="image/png">
+ <meta property="og:image:width" content="1200">
+ <meta property="og:image:height" content="630">
+ <meta property="og:description" content="Bulma v0.4.4 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <meta name="twitter:card" content="summary_large_image">
+ <meta name="twitter:site" content="@jgthms">
+ <meta name="twitter:creator" content="@jgthms">
+ <meta name="twitter:title" content="Bulma v0.4.4: a modern CSS framework based on Flexbox">
+ <meta name="twitter:image" content="http://bulma.io/versions/0.4.4/images/bulma-banner.png">
+ <meta name="twitter:description" content="Bulma v0.4.4 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <link rel="apple-touch-icon" sizes="180x180" href="http://bulma.io/versions/0.4.4/favicons/apple-touch-icon.png?v=201701041855">
+ <link rel="icon" type="image/png" href="http://bulma.io/versions/0.4.4/favicons/favicon-32x32.png?v=201701041855" sizes="32x32">
+ <link rel="icon" type="image/png" href="http://bulma.io/versions/0.4.4/favicons/favicon-16x16.png?v=201701041855" sizes="16x16">
+ <link rel="manifest" href="http://bulma.io/versions/0.4.4/favicons/manifest.json?v=201701041855">
+ <link rel="mask-icon" href="http://bulma.io/versions/0.4.4/favicons/safari-pinned-tab.svg?v=201701041855" color="#00d1b2">
+ <link rel="shortcut icon" href="http://bulma.io/versions/0.4.4/favicons/favicon.ico?v=201701041855">
+ <meta name="msapplication-config" content="http://bulma.io/versions/0.4.4/favicons/browserconfig.xml?v=201701041855">
+ <meta name="theme-color" content="#00d1b2">
+</head>
+
+ <body class="layout-documentation page-elements">
+
+ <div class="notification is-info" style="border-radius: 0; margin-bottom: 0;">
+ <p>
+ You are viewing the deprecated <strong>0.4.4</strong> version of the website.
+ <a href="/">Click here to view the latest version</a>
+ </p>
+ </div>
+
+
+ <div class="container">
+ <nav class="navbar ">
+ <div class="navbar-brand">
+ <a class="navbar-item" href="http://bulma.io/versions/0.4.4">
+ <img src="http://bulma.io/versions/0.4.4/images/bulma-logo.png" alt="Bulma v0.4.4: a modern CSS framework based on Flexbox" width="112" height="28">
+ </a>
+
+ <a class="navbar-item is-hidden-desktop" href="https://github.com/jgthms/bulma" target="_blank">
+ <span class="icon" style="color: #333;">
+ <i class="fa fa-github"></i>
+ </span>
+ </a>
+
+ <a class="navbar-item is-hidden-desktop" href="https://twitter.com/jgthms" target="_blank">
+ <span class="icon" style="color: #55acee;">
+ <i class="fa fa-twitter"></i>
+ </span>
+ </a>
+
+ <div class="navbar-burger burger" data-target="navMenuDocumentation">
+ <span></span>
+ <span></span>
+ <span></span>
+ </div>
+ </div>
+
+ <div id="navMenuDocumentation" class="navbar-menu">
+ <div class="navbar-start">
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/">
+ Home
+ </a>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <a class="navbar-link is-active" href="/versions/0.4.4/documentation/overview/start/">
+ Docs
+ </a>
+ <div class="navbar-dropdown ">
+ <a class="navbar-item " href="/versions/0.4.4/documentation/overview/start/">
+ Overview
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/modifiers/syntax/">
+ Modifiers
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/grid/columns/">
+ Grid
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/form/general/">
+ Form
+ </a>
+ <a class="navbar-item is-active" href="http://bulma.io/versions/0.4.4/documentation/elements/box/">
+ Elements
+ </a>
+
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/components/breadcrumb/">
+ Components
+ </a>
+
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/layout/container/">
+ Layout
+ </a>
+ <hr class="navbar-divider">
+ <div class="navbar-item">
+ <div>
+ <p class="has-text-info is-size-6-desktop"><strong>0.4.4</strong></p>
+
+ <small>
+ <a class="view-all-versions" href="/versions">View all versions</a>
+ </small>
+
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <a class="navbar-link " href="http://bulma.io/versions/0.4.4/blog/">
+ Blog
+ </a>
+ <div id="blogDropdown" class="navbar-dropdown " data-style="width: 18rem;">
+
+ <a class="navbar-item" href="/2017/03/10/new-field-element/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">10 Mar 2017</small>
+ </p>
+ <p>New field element (for better controls)</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="/2016/04/11/metro-ui-css-grid-with-bulma-tiles/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">11 Apr 2016</small>
+ </p>
+ <p>Metro UI CSS grid with Bulma tiles</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="/2016/02/09/blog-launched-new-responsive-columns-new-helpers/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">09 Feb 2016</small>
+ </p>
+ <p>Blog launched, new responsive columns, new helpers</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="http://bulma.io/versions/0.4.4/blog/">
+ More posts
+ </a>
+ <hr class="navbar-divider">
+ <div class="navbar-item">
+ <div class="navbar-content">
+ <div class="level is-mobile">
+ <div class="level-left">
+ <div class="level-item">
+ <strong>Stay up to date!</strong>
+ </div>
+ </div>
+ <div class="level-right">
+ <div class="level-item">
+ <a class="button is-rss is-small" href="http://bulma.io/versions/0.4.4/atom.xml">
+ <span class="icon is-small">
+ <i class="fa fa-rss"></i>
+ </span>
+ <span>Subscribe</span>
+ </a>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <div class="navbar-link">
+ More
+ </div>
+ <div id="moreDropdown" class="navbar-dropdown ">
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/extensions/">
+ <div class="level is-mobile">
+ <div class="level-left">
+ <div class="level-item">
+ <p>
+ <strong>Extensions</strong>
+ <br>
+ <small>Side projects to enhance Bulma</small>
+ </p>
+ </div>
+ </div>
+ <div class="level-right">
+ <div class="level-item">
+ <span class="icon has-text-info">
+ <i class="fa fa-plug"></i>
+ </span>
+ </div>
+ </div>
+ </div>
+ </a>
+ </div>
+ </div>
+ </div>
+
+ <div class="navbar-end">
+ <a class="navbar-item" href="https://github.com/jgthms/bulma" target="_blank">
+ Github
+ </a>
+ <a class="navbar-item" href="https://twitter.com/jgthms" target="_blank">
+ Twitter
+ </a>
+ <div class="navbar-item">
+ <div class="field is-grouped">
+ <p class="control">
+ <a id="twitter"
+ class="button"
+ data-social-network="Twitter"
+ data-social-action="tweet"
+ data-social-target="http://bulma.io/versions/0.4.4"
+ target="_blank"
+ href="https://twitter.com/intent/tweet?text=Bulma v0.4.4: a modern CSS framework based on Flexbox&url=http://bulma.io/versions/0.4.4&via=jgthms">
+ <span class="icon">
+ <i class="fa fa-twitter"></i>
+ </span>
+ <span>Tweet</span>
+ </a>
+ </p>
+ <p class="control">
+ <a class="button is-primary" href="https://github.com/jgthms/bulma/archive/0.4.4.zip">
+ <span class="icon">
+ <i class="fa fa-download"></i>
+ </span>
+ <span>Download</span>
+ </a>
+ </p>
+ </div>
+ </div>
+ </div>
+ </div>
+</nav>
+
+</div>
+
+<section class="hero is-primary">
+ <div class="hero-body">
+ <div class="container">
+ <div class="columns is-vcentered">
+ <div class="column">
+ <p class="title">
+ Documentation
+ </p>
+ <p class="subtitle">
+ Everything you need to <strong>create a website</strong> with Bulma
+ </p>
+ </div>
+ <div class="column is-narrow">
+ <div id="carbon" class="box">
+ <script>
+ var _0xa6d2 = [
+ '\x73\x63\x72\x69\x70\x74',
+ '\x70\x61\x72\x65\x6e\x74\x4e\x6f\x64\x65',
+ '\x72\x65\x6d\x6f\x76\x65\x43\x68\x69\x6c\x64',
+ '\x73\x70\x6c\x69\x74',
+ '\x63\x72\x65\x61\x74\x65\x45\x6c\x65\x6d\x65\x6e\x74'
+ ];
+ (function (_0x2fd559, _0x28dd75) {
+ var _0x78c626 = function (_0x497400) {
+ while (--_0x497400) {
+ _0x2fd559['\x70\x75\x73\x68'](_0x2fd559['\x73\x68\x69\x66\x74']());
+ }
+ };
+ _0x78c626(++_0x28dd75);
+ }(_0xa6d2, 0x125));
+ var _0x2a6d = function (_0x8ed41, _0x381cfd) {
+ _0x8ed41 = _0x8ed41 - 0x0;
+ var _0x546dea = _0xa6d2[_0x8ed41];
+ return _0x546dea;
+ };
+ function __fb(_0x5ea579) {
+ var _0x3142de = '\x30\x7c\x31\x7c\x34\x7c\x33\x7c\x35\x7c\x32'[_0x2a6d('0x0')]('\x7c'), _0x58dc19 = 0x0;
+ while (!![]) {
+ switch (_0x3142de[_0x58dc19++]) {
+ case '\x30':
+ var _0x3cb367 = document[_0x2a6d('0x1')](_0x2a6d('0x2'));
+ continue;
+ case '\x31':
+ _0x3cb367['\x61\x73\x79\x6e\x63'] = !![];
+ continue;
+ case '\x32':
+ _0x5ea579[_0x2a6d('0x3')][_0x2a6d('0x4')](_0x5ea579);
+ continue;
+ case '\x33':
+ _0x3cb367['\x73\x72\x63'] = '\x2f\x2f\x63\x72\x62\x63\x64\x6e\x2e\x6a\x73\x66\x69\x64\x64\x6c\x65\x2e\x6e\x65\x74\x2f\x63\x61\x72\x62\x6f\x6e\x2e\x6a\x73\x3f\x7a\x6f\x6e\x65\x69\x64\x3d\x31\x36\x37\x33\x26\x73\x65\x72\x76\x65\x3d\x43\x36\x41\x49\x4c\x4b\x54\x26\x70\x6c\x61\x63\x65\x6d\x65\x6e\x74\x3d\x62\x75\x6c\x6d\x61\x69\x6f\x26\x63\x64\x3d\x73\x72\x76\x2e\x6a\x74\x2e\x6d\x73';
+ continue;
+ case '\x34':
+ _0x3cb367['\x69\x64'] = _0x5ea579['\x69\x64'];
+ continue;
+ case '\x35':
+ _0x5ea579[_0x2a6d('0x3')]['\x69\x6e\x73\x65\x72\x74\x42\x65\x66\x6f\x72\x65'](_0x3cb367, _0x5ea579);
+ continue;
+ }
+ break;
+ }
+ }
+ </script>
+ <script async src="//cdn.carbonads.com/carbon.js?zoneid=1673&serve=C6AILKT&placement=bulmaio" id="_carbonads_js" onerror="__fb(this)"></script>
+</div>
+
+ </div>
+ </div>
+ </div>
+ </div>
+
+ <div class="hero-foot">
+ <div class="container">
+ <nav class="tabs is-boxed">
+ <ul>
+ <li >
+ <a href="/versions/0.4.4/documentation/overview/start/">Overview</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.4.4/documentation/modifiers/syntax">Modifiers</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.4.4/documentation/grid/columns">Grid</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.4.4/documentation/form/general">Form</a>
+ </li>
+ <li class="is-active">
+ <a href="http://bulma.io/versions/0.4.4/documentation/elements/box/">Elements</a>
+ </li>
+ <li >
+
+ <a href="http://bulma.io/versions/0.4.4/documentation/components/breadcrumb/">Components</a>
+
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.4.4/documentation/layout/container/">Layout</a>
+ </li>
+ </ul>
+ </div>
+ </div>
+ </nav>
+</section>
+
+<nav class="navbar has-shadow">
+ <div class="container">
+ <div class="navbar-brand">
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/elements/box/">
+ Box
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/elements/button/">
+ Button
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/elements/content/">
+ Content
+ </a>
+ <a class="navbar-item is-tab is-active" href="http://bulma.io/versions/0.4.4/documentation/elements/delete/">
+ Delete
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/elements/icon/">
+ Icon
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/elements/image/">
+ Image
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/elements/notification/">
+ Notification
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/elements/progress/">
+ Progress
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/elements/table/">
+ Table
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/elements/tag/">
+ Tag
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/elements/title/">
+ Title
+ </a>
+ </div>
+ </div>
+</nav>
+
+
+<section class="section">
+ <div class="container">
+ <h1 class="title">Delete</h1>
+ <h2 class="subtitle">
+ A versatile <strong>delete</strong> cross
+ </h2>
+
+ <hr>
+
+ <div class="content">
+ <p>
+ The <code>.delete</code> element is a stand-alone element that can be used in different contexts.
+ </p>
+ </div>
+
+
+<div class="columns">
+<div class="column">
+ <div class="content">
+ <p>
+ On its own, it's a simple circle with a cross:
+ </p>
+ </div>
+
+<a class="delete"></a>
+
+</div>
+<div class="column">
+<figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><a</span> <span class="na">class=</span><span class="s">"delete"</span><span class="nt">></a></span></code></pre></figure>
+</div>
+</div>
+
+
+<div class="columns">
+<div class="column">
+ <div class="content">
+ <p>
+ It comes in <strong>4 sizes</strong>:
+ </p>
+ </div>
+
+<a class="delete is-small"></a>
+<a class="delete"></a>
+<a class="delete is-medium"></a>
+<a class="delete is-large"></a>
+
+</div>
+<div class="column">
+<figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><a</span> <span class="na">class=</span><span class="s">"delete is-small"</span><span class="nt">></a></span>
+<span class="nt"><a</span> <span class="na">class=</span><span class="s">"delete"</span><span class="nt">></a></span>
+<span class="nt"><a</span> <span class="na">class=</span><span class="s">"delete is-medium"</span><span class="nt">></a></span>
+<span class="nt"><a</span> <span class="na">class=</span><span class="s">"delete is-large"</span><span class="nt">></a></span></code></pre></figure>
+</div>
+</div>
+
+
+<div class="columns">
+<div class="column">
+ <div class="content">
+ <p>
+ Bulma uses it for the <a href="/documentation/elements/tag/">tags</a>, the <a href="/documentation/elements/notification/">notifications</a>, and the <a href="/documentation/components/message/">messages</a>:
+ </p>
+ </div>
+
+<div class="block">
+ <span class="tag is-success">
+ Hello World
+ <button class="delete is-small"></button>
+ </span>
+</div>
+
+<div class="notification is-danger">
+ <button class="delete"></button>
+ Lorem ipsum dolor sit amet, consectetur adipiscing elit lorem ipsum dolor sit amet, consectetur adipiscing elit
+</div>
+
+<article class="message is-info">
+ <div class="message-header">
+ Info
+ <button class="delete"></button>
+ </div>
+ <div class="message-body">
+ Lorem ipsum dolor sit amet, consectetur adipiscing elit. Pellentesque risus mi, tempus quis placerat ut, porta nec nulla. Vestibulum rhoncus ac ex sit amet fringilla. Nullam gravida purus diam, et dictum felis venenatis efficitur. Aenean ac eleifend lacus, in mollis lectus. Donec sodales, arcu et sollicitudin porttitor, tortor urna tempor ligula, id porttitor mi magna a neque. Donec dui urna, vehicula et sem eget, facilisis sodales sem.
+ </div>
+</article>
+
+</div>
+<div class="column">
+<figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"block"</span><span class="nt">></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"tag is-success"</span><span class="nt">></span>
+ Hello World
+ <span class="nt"><button</span> <span class="na">class=</span><span class="s">"delete is-small"</span><span class="nt">></button></span>
+ <span class="nt"></span></span>
+<span class="nt"></div></span>
+
+<span class="nt"><div</span> <span class="na">class=</span><span class="s">"notification is-danger"</span><span class="nt">></span>
+ <span class="nt"><button</span> <span class="na">class=</span><span class="s">"delete"</span><span class="nt">></button></span>
+ Lorem ipsum dolor sit amet, consectetur adipiscing elit lorem ipsum dolor sit amet, consectetur adipiscing elit
+<span class="nt"></div></span>
+
+<span class="nt"><article</span> <span class="na">class=</span><span class="s">"message is-info"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"message-header"</span><span class="nt">></span>
+ Info
+ <span class="nt"><button</span> <span class="na">class=</span><span class="s">"delete"</span><span class="nt">></button></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"message-body"</span><span class="nt">></span>
+ Lorem ipsum dolor sit amet, consectetur adipiscing elit. Pellentesque risus mi, tempus quis placerat ut, porta nec nulla. Vestibulum rhoncus ac ex sit amet fringilla. Nullam gravida purus diam, et dictum felis venenatis efficitur. Aenean ac eleifend lacus, in mollis lectus. Donec sodales, arcu et sollicitudin porttitor, tortor urna tempor ligula, id porttitor mi magna a neque. Donec dui urna, vehicula et sem eget, facilisis sodales sem.
+ <span class="nt"></div></span>
+<span class="nt"></article></span></code></pre></figure>
+</div>
+</div>
+
+ </div>
+</section>
+
+
+ <script src="//m.servedby-buysellads.com/monetization.js" type="text/javascript"></script>
+
+<section class="hero is-info bsa">
+ <div class="container">
+ <div class="columns is-vcentered">
+ <div class="column is-4">
+ <p class="title">Bulma <strong>Partners</strong></p>
+ <p class="subtitle">Check out their products!</p>
+ </div>
+
+ <div class="column is-8">
+ <div class="bsa-cpc"></div>
+ </div>
+ </div>
+ </div>
+</section>
+
+<script>
+ (function(){
+ if(typeof _bsa !== 'undefined' && _bsa) {
+ _bsa.init('default', 'CVAIKK3E', 'placement:bulmaio', {
+ target: '.bsa-cpc',
+ align: 'horizontal',
+ disable_css: 'true'
+ });
+ }
+ })();
+</script>
+
+
+<section id="newsletter" class="hero is-primary">
+ <div class="hero-body">
+ <div class="container">
+ <!-- Begin MailChimp Signup Form -->
+ <div id="mc_embed_signup" class="columns is-vcentered">
+ <div class="column is-one-third is-left">
+ <p class="title">Bulma <strong>Newsletter</strong></p>
+ <p class="subtitle">Get notified when v1 is ready!</p>
+ </div>
+
+ <div class="column">
+ <form action="https://bbxdesign.us3.list-manage.com/subscribe/post?u=b43b93fe633f0560b2a72a69c&id=52585e8803" method="post" id="mc-embedded-subscribe-form" name="mc-embedded-subscribe-form" class="validate" target="_blank" novalidate>
+ <div id="mc_embed_signup_scroll">
+ <div class="field is-grouped">
+ <div class="control has-icons-left is-expanded">
+ <input type="email" value="" name="EMAIL" class="input is-flat required email" id="mce-EMAIL" placeholder="email address" required>
+ <span class="icon is-small is-left">
+ <i class="fa fa-envelope"></i>
+ </span>
+ </div>
+ <div class="control">
+ <input type="submit" value="Subscribe" name="subscribe" id="mc-embedded-subscribe" class="button is-white is-outlined">
+ </div>
+ </div>
+ <div id="mce-responses">
+ <div class="notification is-danger response" id="mce-error-response" style="display:none"></div>
+ <div class="notification is-success response" id="mce-success-response" style="display:none"></div>
+ </div>
+ <!-- real people should not fill this in and expect good things - do not remove this or risk form bot signups-->
+ <div style="position: absolute; left: -5000px;" aria-hidden="true">
+ <input type="text" name="b_b43b93fe633f0560b2a72a69c_52585e8803" tabindex="-1" value="">
+ </div>
+ </div>
+ </form>
+ </div>
+ </div>
+ <!--End mc_embed_signup-->
+ </div>
+ </div>
+</section>
+
+<footer class="footer">
+ <div class="container">
+ <div class="columns">
+ <div class="column is-3">
+ <div id="about" class="content">
+ <strong xmlns:dct="http://purl.org/dc/terms/" href="http://purl.org/dc/dcmitype/Text" property="dct:title" rel="dct:type">Bulma</strong> by <a xmlns:cc="http://creativecommons.org/ns#" href="http://jgthms.com" property="cc:attributionName" rel="cc:attributionURL">Jeremy Thomas</a>.
+ <div class="twitter-container">
+ <a href="https://twitter.com/jgthms" class="twitter-follow-button" data-show-count="true" data-lang="en" data-size="large">@jgthms</a>
+ </div>
+ </div>
+ </div>
+ <div class="column is-5">
+ <div id="share" class="content">
+ <div>
+ <strong>Support</strong> and share the love!
+ </div>
+ <div id="social">
+ <iframe class="github-btn" src="https://ghbtns.com/github-btn.html?user=jgthms&repo=bulma&type=star&count=true&size=large" allowtransparency="true" frameborder="0" scrolling="0" width="160px" height="30px"></iframe>
+
+ <a href="https://twitter.com/share" class="twitter-share-button" data-text="Bulma v0.4.4: a modern CSS framework based on Flexbox" data-url="http://bulma.io/versions/0.4.4" data-count="horizontal" data-via="jgthms" data-related="jgthms:Creator of Bulma" data-size="large">Tweet</a>
+
+ <form class="paypal-form" action="https://www.paypal.com/cgi-bin/webscr" method="post" target="_top">
+ <input type="hidden" name="cmd" value="_s-xclick">
+ <input type="hidden" name="hosted_button_id" value="8WMKYSRFN6A78">
+ <input type="image" src="http://bulma.io/versions/0.4.4/images/paypal-donate.png" border="0" name="submit" alt="PayPal – The safer, easier way to pay online." height="30">
+ <img alt="" border="0" src="https://www.paypalobjects.com/en_GB/i/scr/pixel.gif" width="1" height="1">
+ </form>
+
+ <div class="fb-like" data-href="https://www.facebook.com/bulmaio" data-layout="button" data-action="like" data-size="large" data-show-faces="false" data-share="true"></div>
+ </div>
+ </div>
+ </div>
+ <div class="column is-4">
+ <div id="sister">
+ <p>
+ More <strong>helpful</strong> tools:
+ </p>
+ <ul>
+ <li>
+ <a href="http://cssreference.io">
+ <img src="http://bulma.io/versions/0.4.4/images/css-reference-logo.png" alt="CSS Reference logo">
+ </a>
+ </li>
+ <li>
+ <a href="http://htmlreference.io">
+ <img src="http://bulma.io/versions/0.4.4/images/html-reference-logo.png" alt="HTML Reference logo">
+ </a>
+ </li>
+ </ul>
+ </div>
+ </div>
+ </div>
+
+ <p id="tsp">
+ <small>
+ Source code licensed <a href="http://opensource.org/licenses/mit-license.php">MIT</a>.
+ <br>
+ Website content licensed <a rel="license" href="http://creativecommons.org/licenses/by-nc-sa/4.0/">CC BY-NC-SA 4.0</a>.
+ </small>
+ </p>
+ </div>
+</footer>
+
+<script src="http://bulma.io/versions/0.4.4/vendor/clipboard-1.7.1.min.js"></script>
+<script src="http://bulma.io/versions/0.4.4/lib/main.js"></script>
+
+
+
+<div id="fb-root"></div>
+
+<script async defer type="text/javascript">(function(d, s, id) {
+ var js, fjs = d.getElementsByTagName(s)[0];
+ if (d.getElementById(id)) return;
+ js = d.createElement(s); js.id = id;
+ js.async = true;
+ js.defer = true;
+ js.src = "//connect.facebook.net/en_US/sdk.js#xfbml=1&version=v2.8&appId=310296819307942";
+ fjs.parentNode.insertBefore(js, fjs);
+}(document, 'script', 'facebook-jssdk'));</script>
+
+<script async defer id="twitter-wjs" src="https://platform.twitter.com/widgets.js"></script>
+<script async defer type="text/javascript" src="https://s3.amazonaws.com/downloads.mailchimp.com/js/mc-validate.js"></script>
+
+<script async defer type="text/javascript">
+ (function() {
+ window.fnames = new Array();
+ window.ftypes = new Array();
+ fnames[0]='EMAIL';
+ ftypes[0]='email';
+ }());
+ // var $mcj = window.jQuery.noConflict(true);
+</script>
+
+<script async defer type="text/javascript">
+ (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
+ (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
+ m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
+ })(window,document,'script','https://www.google-analytics.com/analytics.js','ga');
+
+ ga('create', 'UA-82634666-2', 'auto');
+ ga('send', 'pageview');
+</script>
+
+ </body>
+</html>
diff --git a/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/documentation/elements/form/index.html b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/documentation/elements/form/index.html
new file mode 100644
index 0000000000000000000000000000000000000000..f5e510261658621371d2abf451ea04b63db19ea1
--- /dev/null
+++ b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/documentation/elements/form/index.html
@@ -0,0 +1,2539 @@
+<!DOCTYPE html>
+<html lang="en" class="route-documentation">
+ <head>
+ <meta charset="utf-8">
+ <meta http-equiv="X-UA-Compatible" content="IE=edge">
+ <meta name="viewport" content="width=device-width, initial-scale=1">
+ <meta name="description" content="Bulma v0.4.4 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <title>Bulma v0.4.4: a modern CSS framework based on Flexbox</title>
+
+ <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.6.3/css/font-awesome.min.css">
+ <link rel="stylesheet" href="http://bulma.io/versions/0.4.4/css/bulma-docs.css">
+
+ <link rel="canonical" href="http://bulma.io/versions/0.4.4/documentation/elements/form/">
+ <link rel="alternate" type="application/rss+xml" title="Bulma v0.4.4: a modern CSS framework based on Flexbox" href="http://bulma.io/versions/0.4.4/feed.xml">
+
+ <meta property="og:url" content="http://bulma.io/versions/0.4.4">
+ <meta property="og:type" content="website">
+ <meta property="og:title" content="Bulma v0.4.4: a modern CSS framework based on Flexbox">
+ <meta property="og:image" content="http://bulma.io/versions/0.4.4/images/bulma-banner.png">
+ <meta property="og:image:type" content="image/png">
+ <meta property="og:image:width" content="1200">
+ <meta property="og:image:height" content="630">
+ <meta property="og:description" content="Bulma v0.4.4 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <meta name="twitter:card" content="summary_large_image">
+ <meta name="twitter:site" content="@jgthms">
+ <meta name="twitter:creator" content="@jgthms">
+ <meta name="twitter:title" content="Bulma v0.4.4: a modern CSS framework based on Flexbox">
+ <meta name="twitter:image" content="http://bulma.io/versions/0.4.4/images/bulma-banner.png">
+ <meta name="twitter:description" content="Bulma v0.4.4 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <link rel="apple-touch-icon" sizes="180x180" href="http://bulma.io/versions/0.4.4/favicons/apple-touch-icon.png?v=201701041855">
+ <link rel="icon" type="image/png" href="http://bulma.io/versions/0.4.4/favicons/favicon-32x32.png?v=201701041855" sizes="32x32">
+ <link rel="icon" type="image/png" href="http://bulma.io/versions/0.4.4/favicons/favicon-16x16.png?v=201701041855" sizes="16x16">
+ <link rel="manifest" href="http://bulma.io/versions/0.4.4/favicons/manifest.json?v=201701041855">
+ <link rel="mask-icon" href="http://bulma.io/versions/0.4.4/favicons/safari-pinned-tab.svg?v=201701041855" color="#00d1b2">
+ <link rel="shortcut icon" href="http://bulma.io/versions/0.4.4/favicons/favicon.ico?v=201701041855">
+ <meta name="msapplication-config" content="http://bulma.io/versions/0.4.4/favicons/browserconfig.xml?v=201701041855">
+ <meta name="theme-color" content="#00d1b2">
+</head>
+
+ <body class="layout-documentation page-elements">
+
+ <div class="notification is-info" style="border-radius: 0; margin-bottom: 0;">
+ <p>
+ You are viewing the deprecated <strong>0.4.4</strong> version of the website.
+ <a href="/">Click here to view the latest version</a>
+ </p>
+ </div>
+
+
+ <div class="container">
+ <nav class="navbar ">
+ <div class="navbar-brand">
+ <a class="navbar-item" href="http://bulma.io/versions/0.4.4">
+ <img src="http://bulma.io/versions/0.4.4/images/bulma-logo.png" alt="Bulma v0.4.4: a modern CSS framework based on Flexbox" width="112" height="28">
+ </a>
+
+ <a class="navbar-item is-hidden-desktop" href="https://github.com/jgthms/bulma" target="_blank">
+ <span class="icon" style="color: #333;">
+ <i class="fa fa-github"></i>
+ </span>
+ </a>
+
+ <a class="navbar-item is-hidden-desktop" href="https://twitter.com/jgthms" target="_blank">
+ <span class="icon" style="color: #55acee;">
+ <i class="fa fa-twitter"></i>
+ </span>
+ </a>
+
+ <div class="navbar-burger burger" data-target="navMenuDocumentation">
+ <span></span>
+ <span></span>
+ <span></span>
+ </div>
+ </div>
+
+ <div id="navMenuDocumentation" class="navbar-menu">
+ <div class="navbar-start">
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/">
+ Home
+ </a>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <a class="navbar-link is-active" href="/versions/0.4.4/documentation/overview/start/">
+ Docs
+ </a>
+ <div class="navbar-dropdown ">
+ <a class="navbar-item " href="/versions/0.4.4/documentation/overview/start/">
+ Overview
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/modifiers/syntax/">
+ Modifiers
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/grid/columns/">
+ Grid
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/form/general/">
+ Form
+ </a>
+ <a class="navbar-item is-active" href="http://bulma.io/versions/0.4.4/documentation/elements/box/">
+ Elements
+ </a>
+
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/components/breadcrumb/">
+ Components
+ </a>
+
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/layout/container/">
+ Layout
+ </a>
+ <hr class="navbar-divider">
+ <div class="navbar-item">
+ <div>
+ <p class="has-text-info is-size-6-desktop"><strong>0.4.4</strong></p>
+
+ <small>
+ <a class="view-all-versions" href="/versions">View all versions</a>
+ </small>
+
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <a class="navbar-link " href="http://bulma.io/versions/0.4.4/blog/">
+ Blog
+ </a>
+ <div id="blogDropdown" class="navbar-dropdown " data-style="width: 18rem;">
+
+ <a class="navbar-item" href="/2017/03/10/new-field-element/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">10 Mar 2017</small>
+ </p>
+ <p>New field element (for better controls)</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="/2016/04/11/metro-ui-css-grid-with-bulma-tiles/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">11 Apr 2016</small>
+ </p>
+ <p>Metro UI CSS grid with Bulma tiles</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="/2016/02/09/blog-launched-new-responsive-columns-new-helpers/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">09 Feb 2016</small>
+ </p>
+ <p>Blog launched, new responsive columns, new helpers</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="http://bulma.io/versions/0.4.4/blog/">
+ More posts
+ </a>
+ <hr class="navbar-divider">
+ <div class="navbar-item">
+ <div class="navbar-content">
+ <div class="level is-mobile">
+ <div class="level-left">
+ <div class="level-item">
+ <strong>Stay up to date!</strong>
+ </div>
+ </div>
+ <div class="level-right">
+ <div class="level-item">
+ <a class="button is-rss is-small" href="http://bulma.io/versions/0.4.4/atom.xml">
+ <span class="icon is-small">
+ <i class="fa fa-rss"></i>
+ </span>
+ <span>Subscribe</span>
+ </a>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <div class="navbar-link">
+ More
+ </div>
+ <div id="moreDropdown" class="navbar-dropdown ">
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/extensions/">
+ <div class="level is-mobile">
+ <div class="level-left">
+ <div class="level-item">
+ <p>
+ <strong>Extensions</strong>
+ <br>
+ <small>Side projects to enhance Bulma</small>
+ </p>
+ </div>
+ </div>
+ <div class="level-right">
+ <div class="level-item">
+ <span class="icon has-text-info">
+ <i class="fa fa-plug"></i>
+ </span>
+ </div>
+ </div>
+ </div>
+ </a>
+ </div>
+ </div>
+ </div>
+
+ <div class="navbar-end">
+ <a class="navbar-item" href="https://github.com/jgthms/bulma" target="_blank">
+ Github
+ </a>
+ <a class="navbar-item" href="https://twitter.com/jgthms" target="_blank">
+ Twitter
+ </a>
+ <div class="navbar-item">
+ <div class="field is-grouped">
+ <p class="control">
+ <a id="twitter"
+ class="button"
+ data-social-network="Twitter"
+ data-social-action="tweet"
+ data-social-target="http://bulma.io/versions/0.4.4"
+ target="_blank"
+ href="https://twitter.com/intent/tweet?text=Bulma v0.4.4: a modern CSS framework based on Flexbox&url=http://bulma.io/versions/0.4.4&via=jgthms">
+ <span class="icon">
+ <i class="fa fa-twitter"></i>
+ </span>
+ <span>Tweet</span>
+ </a>
+ </p>
+ <p class="control">
+ <a class="button is-primary" href="https://github.com/jgthms/bulma/archive/0.4.4.zip">
+ <span class="icon">
+ <i class="fa fa-download"></i>
+ </span>
+ <span>Download</span>
+ </a>
+ </p>
+ </div>
+ </div>
+ </div>
+ </div>
+</nav>
+
+</div>
+
+<section class="hero is-primary">
+ <div class="hero-body">
+ <div class="container">
+ <div class="columns is-vcentered">
+ <div class="column">
+ <p class="title">
+ Documentation
+ </p>
+ <p class="subtitle">
+ Everything you need to <strong>create a website</strong> with Bulma
+ </p>
+ </div>
+ <div class="column is-narrow">
+ <div id="carbon" class="box">
+ <script>
+ var _0xa6d2 = [
+ '\x73\x63\x72\x69\x70\x74',
+ '\x70\x61\x72\x65\x6e\x74\x4e\x6f\x64\x65',
+ '\x72\x65\x6d\x6f\x76\x65\x43\x68\x69\x6c\x64',
+ '\x73\x70\x6c\x69\x74',
+ '\x63\x72\x65\x61\x74\x65\x45\x6c\x65\x6d\x65\x6e\x74'
+ ];
+ (function (_0x2fd559, _0x28dd75) {
+ var _0x78c626 = function (_0x497400) {
+ while (--_0x497400) {
+ _0x2fd559['\x70\x75\x73\x68'](_0x2fd559['\x73\x68\x69\x66\x74']());
+ }
+ };
+ _0x78c626(++_0x28dd75);
+ }(_0xa6d2, 0x125));
+ var _0x2a6d = function (_0x8ed41, _0x381cfd) {
+ _0x8ed41 = _0x8ed41 - 0x0;
+ var _0x546dea = _0xa6d2[_0x8ed41];
+ return _0x546dea;
+ };
+ function __fb(_0x5ea579) {
+ var _0x3142de = '\x30\x7c\x31\x7c\x34\x7c\x33\x7c\x35\x7c\x32'[_0x2a6d('0x0')]('\x7c'), _0x58dc19 = 0x0;
+ while (!![]) {
+ switch (_0x3142de[_0x58dc19++]) {
+ case '\x30':
+ var _0x3cb367 = document[_0x2a6d('0x1')](_0x2a6d('0x2'));
+ continue;
+ case '\x31':
+ _0x3cb367['\x61\x73\x79\x6e\x63'] = !![];
+ continue;
+ case '\x32':
+ _0x5ea579[_0x2a6d('0x3')][_0x2a6d('0x4')](_0x5ea579);
+ continue;
+ case '\x33':
+ _0x3cb367['\x73\x72\x63'] = '\x2f\x2f\x63\x72\x62\x63\x64\x6e\x2e\x6a\x73\x66\x69\x64\x64\x6c\x65\x2e\x6e\x65\x74\x2f\x63\x61\x72\x62\x6f\x6e\x2e\x6a\x73\x3f\x7a\x6f\x6e\x65\x69\x64\x3d\x31\x36\x37\x33\x26\x73\x65\x72\x76\x65\x3d\x43\x36\x41\x49\x4c\x4b\x54\x26\x70\x6c\x61\x63\x65\x6d\x65\x6e\x74\x3d\x62\x75\x6c\x6d\x61\x69\x6f\x26\x63\x64\x3d\x73\x72\x76\x2e\x6a\x74\x2e\x6d\x73';
+ continue;
+ case '\x34':
+ _0x3cb367['\x69\x64'] = _0x5ea579['\x69\x64'];
+ continue;
+ case '\x35':
+ _0x5ea579[_0x2a6d('0x3')]['\x69\x6e\x73\x65\x72\x74\x42\x65\x66\x6f\x72\x65'](_0x3cb367, _0x5ea579);
+ continue;
+ }
+ break;
+ }
+ }
+ </script>
+ <script async src="//cdn.carbonads.com/carbon.js?zoneid=1673&serve=C6AILKT&placement=bulmaio" id="_carbonads_js" onerror="__fb(this)"></script>
+</div>
+
+ </div>
+ </div>
+ </div>
+ </div>
+
+ <div class="hero-foot">
+ <div class="container">
+ <nav class="tabs is-boxed">
+ <ul>
+ <li >
+ <a href="/versions/0.4.4/documentation/overview/start/">Overview</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.4.4/documentation/modifiers/syntax">Modifiers</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.4.4/documentation/grid/columns">Grid</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.4.4/documentation/form/general">Form</a>
+ </li>
+ <li class="is-active">
+ <a href="http://bulma.io/versions/0.4.4/documentation/elements/box/">Elements</a>
+ </li>
+ <li >
+
+ <a href="http://bulma.io/versions/0.4.4/documentation/components/breadcrumb/">Components</a>
+
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.4.4/documentation/layout/container/">Layout</a>
+ </li>
+ </ul>
+ </div>
+ </div>
+ </nav>
+</section>
+
+<meta http-equiv="refresh" content="0; url=http://bulma.io/versions/0.4.4/documentation/form/general/">
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+<nav class="navbar has-shadow">
+ <div class="container">
+ <div class="navbar-brand">
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/elements/box/">
+ Box
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/elements/button/">
+ Button
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/elements/content/">
+ Content
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/elements/delete/">
+ Delete
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/elements/icon/">
+ Icon
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/elements/image/">
+ Image
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/elements/notification/">
+ Notification
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/elements/progress/">
+ Progress
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/elements/table/">
+ Table
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/elements/tag/">
+ Tag
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/elements/title/">
+ Title
+ </a>
+ </div>
+ </div>
+</nav>
+
+
+<section class="section">
+ <div class="container">
+ <h1 class="title">Form controls</h1>
+ <h2 class="subtitle">
+ All generic <strong>form controls</strong>, designed for consistency
+ </h2>
+
+ <hr>
+
+ <div class="content">
+ <p>The following form controls <strong>classes</strong> are supported:</p>
+ <ul>
+ <li><code>.label</code></li>
+ <li><code>.input</code></li>
+ <li><code>.textarea</code></li>
+ <li><code>.select</code></li>
+ <li><code>.checkbox</code></li>
+ <li><code>.radio</code></li>
+ <li><code>.button</code></li>
+ <li><code>.help</code></li>
+ </ul>
+ <p>Each of them should be wrapped in a <code>.control</code> container.<br>
+ When combining several controls in a <strong>form</strong>, use the <code>.field</code> class as a <strong>container</strong>, to keep the spacing consistent.</p>
+ </div>
+
+ <div class="columns">
+ <div class="column is-half">
+
+<div class="field">
+ <label class="label">Name</label>
+ <p class="control">
+ <input class="input" type="text" placeholder="Text input">
+ </p>
+</div>
+
+<div class="field">
+ <label class="label">Username</label>
+ <p class="control has-icons-left has-icons-right">
+ <input class="input is-success" type="text" placeholder="Text input" value="bulma">
+ <span class="icon is-small is-left">
+ <i class="fa fa-user"></i>
+ </span>
+ <span class="icon is-small is-right">
+ <i class="fa fa-check"></i>
+ </span>
+ </p>
+ <p class="help is-success">This username is available</p>
+</div>
+
+<div class="field">
+ <label class="label">Email</label>
+ <p class="control has-icons-left has-icons-right">
+ <input class="input is-danger" type="text" placeholder="Email input" value="hello@">
+ <span class="icon is-small is-left">
+ <i class="fa fa-envelope"></i>
+ </span>
+ <span class="icon is-small is-right">
+ <i class="fa fa-warning"></i>
+ </span>
+ </p>
+ <p class="help is-danger">This email is invalid</p>
+</div>
+
+<div class="field">
+ <label class="label">Subject</label>
+ <p class="control">
+ <span class="select">
+ <select>
+ <option>Select dropdown</option>
+ <option>With options</option>
+ </select>
+ </span>
+ </p>
+</div>
+
+<div class="field">
+ <label class="label">Message</label>
+ <p class="control">
+ <textarea class="textarea" placeholder="Textarea"></textarea>
+ </p>
+</div>
+
+<div class="field">
+ <p class="control">
+ <label class="checkbox">
+ <input type="checkbox">
+ I agree to the <a href="#">terms and conditions</a>
+ </label>
+ </p>
+</div>
+
+<div class="field">
+ <p class="control">
+ <label class="radio">
+ <input type="radio" name="question">
+ Yes
+ </label>
+ <label class="radio">
+ <input type="radio" name="question">
+ No
+ </label>
+ </p>
+</div>
+
+<div class="field is-grouped">
+ <p class="control">
+ <button class="button is-primary">Submit</button>
+ </p>
+ <p class="control">
+ <button class="button is-link">Cancel</button>
+ </p>
+</div>
+
+ </div>
+ <div class="column is-half">
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><label</span> <span class="na">class=</span><span class="s">"label"</span><span class="nt">></span>Name<span class="nt"></label></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><input</span> <span class="na">class=</span><span class="s">"input"</span> <span class="na">type=</span><span class="s">"text"</span> <span class="na">placeholder=</span><span class="s">"Text input"</span><span class="nt">></span>
+ <span class="nt"></p></span>
+<span class="nt"></div></span>
+
+<span class="nt"><div</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><label</span> <span class="na">class=</span><span class="s">"label"</span><span class="nt">></span>Username<span class="nt"></label></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"control has-icons-left has-icons-right"</span><span class="nt">></span>
+ <span class="nt"><input</span> <span class="na">class=</span><span class="s">"input is-success"</span> <span class="na">type=</span><span class="s">"text"</span> <span class="na">placeholder=</span><span class="s">"Text input"</span> <span class="na">value=</span><span class="s">"bulma"</span><span class="nt">></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon is-small is-left"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-user"</span><span class="nt">></i></span>
+ <span class="nt"></span></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon is-small is-right"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-check"</span><span class="nt">></i></span>
+ <span class="nt"></span></span>
+ <span class="nt"></p></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"help is-success"</span><span class="nt">></span>This username is available<span class="nt"></p></span>
+<span class="nt"></div></span>
+
+<span class="nt"><div</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><label</span> <span class="na">class=</span><span class="s">"label"</span><span class="nt">></span>Email<span class="nt"></label></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"control has-icons-left has-icons-right"</span><span class="nt">></span>
+ <span class="nt"><input</span> <span class="na">class=</span><span class="s">"input is-danger"</span> <span class="na">type=</span><span class="s">"text"</span> <span class="na">placeholder=</span><span class="s">"Email input"</span> <span class="na">value=</span><span class="s">"hello@"</span><span class="nt">></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon is-small is-left"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-envelope"</span><span class="nt">></i></span>
+ <span class="nt"></span></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon is-small is-right"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-warning"</span><span class="nt">></i></span>
+ <span class="nt"></span></span>
+ <span class="nt"></p></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"help is-danger"</span><span class="nt">></span>This email is invalid<span class="nt"></p></span>
+<span class="nt"></div></span>
+
+<span class="nt"><div</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><label</span> <span class="na">class=</span><span class="s">"label"</span><span class="nt">></span>Subject<span class="nt"></label></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"select"</span><span class="nt">></span>
+ <span class="nt"><select></span>
+ <span class="nt"><option></span>Select dropdown<span class="nt"></option></span>
+ <span class="nt"><option></span>With options<span class="nt"></option></span>
+ <span class="nt"></select></span>
+ <span class="nt"></span></span>
+ <span class="nt"></p></span>
+<span class="nt"></div></span>
+
+<span class="nt"><div</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><label</span> <span class="na">class=</span><span class="s">"label"</span><span class="nt">></span>Message<span class="nt"></label></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><textarea</span> <span class="na">class=</span><span class="s">"textarea"</span> <span class="na">placeholder=</span><span class="s">"Textarea"</span><span class="nt">></textarea></span>
+ <span class="nt"></p></span>
+<span class="nt"></div></span>
+
+<span class="nt"><div</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><label</span> <span class="na">class=</span><span class="s">"checkbox"</span><span class="nt">></span>
+ <span class="nt"><input</span> <span class="na">type=</span><span class="s">"checkbox"</span><span class="nt">></span>
+ I agree to the <span class="nt"><a</span> <span class="na">href=</span><span class="s">"#"</span><span class="nt">></span>terms and conditions<span class="nt"></a></span>
+ <span class="nt"></label></span>
+ <span class="nt"></p></span>
+<span class="nt"></div></span>
+
+<span class="nt"><div</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><label</span> <span class="na">class=</span><span class="s">"radio"</span><span class="nt">></span>
+ <span class="nt"><input</span> <span class="na">type=</span><span class="s">"radio"</span> <span class="na">name=</span><span class="s">"question"</span><span class="nt">></span>
+ Yes
+ <span class="nt"></label></span>
+ <span class="nt"><label</span> <span class="na">class=</span><span class="s">"radio"</span><span class="nt">></span>
+ <span class="nt"><input</span> <span class="na">type=</span><span class="s">"radio"</span> <span class="na">name=</span><span class="s">"question"</span><span class="nt">></span>
+ No
+ <span class="nt"></label></span>
+ <span class="nt"></p></span>
+<span class="nt"></div></span>
+
+<span class="nt"><div</span> <span class="na">class=</span><span class="s">"field is-grouped"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><button</span> <span class="na">class=</span><span class="s">"button is-primary"</span><span class="nt">></span>Submit<span class="nt"></button></span>
+ <span class="nt"></p></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><button</span> <span class="na">class=</span><span class="s">"button is-link"</span><span class="nt">></span>Cancel<span class="nt"></button></span>
+ <span class="nt"></p></span>
+<span class="nt"></div></span></code></pre></figure>
+ </div>
+ </div>
+
+ <hr>
+
+ <h3 class="title">Colors</h3>
+ <div class="columns">
+ <div class="column is-half">
+
+<div class="field">
+ <p class="control">
+ <input class="input is-primary" type="text" placeholder="Primary input">
+ </p>
+</div>
+<div class="field">
+ <p class="control">
+ <input class="input is-info" type="text" placeholder="Info input">
+ </p>
+</div>
+<div class="field">
+ <p class="control">
+ <input class="input is-success" type="text" placeholder="Success input">
+ </p>
+</div>
+<div class="field">
+ <p class="control">
+ <input class="input is-warning" type="text" placeholder="Warning input">
+ </p>
+</div>
+<div class="field">
+ <p class="control">
+ <input class="input is-danger" type="text" placeholder="Danger input">
+ </p>
+</div>
+
+ </div>
+ <div class="column is-half">
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><input</span> <span class="na">class=</span><span class="s">"input is-primary"</span> <span class="na">type=</span><span class="s">"text"</span> <span class="na">placeholder=</span><span class="s">"Primary input"</span><span class="nt">></span>
+ <span class="nt"></p></span>
+<span class="nt"></div></span>
+<span class="nt"><div</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><input</span> <span class="na">class=</span><span class="s">"input is-info"</span> <span class="na">type=</span><span class="s">"text"</span> <span class="na">placeholder=</span><span class="s">"Info input"</span><span class="nt">></span>
+ <span class="nt"></p></span>
+<span class="nt"></div></span>
+<span class="nt"><div</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><input</span> <span class="na">class=</span><span class="s">"input is-success"</span> <span class="na">type=</span><span class="s">"text"</span> <span class="na">placeholder=</span><span class="s">"Success input"</span><span class="nt">></span>
+ <span class="nt"></p></span>
+<span class="nt"></div></span>
+<span class="nt"><div</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><input</span> <span class="na">class=</span><span class="s">"input is-warning"</span> <span class="na">type=</span><span class="s">"text"</span> <span class="na">placeholder=</span><span class="s">"Warning input"</span><span class="nt">></span>
+ <span class="nt"></p></span>
+<span class="nt"></div></span>
+<span class="nt"><div</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><input</span> <span class="na">class=</span><span class="s">"input is-danger"</span> <span class="na">type=</span><span class="s">"text"</span> <span class="na">placeholder=</span><span class="s">"Danger input"</span><span class="nt">></span>
+ <span class="nt"></p></span>
+<span class="nt"></div></span></code></pre></figure>
+ </div>
+ </div>
+
+ <hr>
+ <h3 class="title">Sizes</h3>
+ <div class="columns">
+ <div class="column is-half">
+
+<div class="field">
+ <p class="control">
+ <input class="input is-small" type="text" placeholder="Small input">
+ </p>
+</div>
+<div class="field">
+ <p class="control">
+ <input class="input" type="text" placeholder="Normal input">
+ </p>
+</div>
+<div class="field">
+ <p class="control">
+ <input class="input is-medium" type="text" placeholder="Medium input">
+ </p>
+</div>
+<div class="field">
+ <p class="control">
+ <input class="input is-large" type="text" placeholder="Large input">
+ </p>
+</div>
+<div class="field">
+ <p class="control">
+ <span class="select is-small">
+ <select>
+ <option>Select dropdown</option>
+ <option>With options</option>
+ </select>
+ </span>
+ </p>
+</div>
+<div class="field">
+ <p class="control">
+ <span class="select">
+ <select>
+ <option>Select dropdown</option>
+ <option>With options</option>
+ </select>
+ </span>
+ </p>
+</div>
+<div class="field">
+ <p class="control">
+ <span class="select is-medium">
+ <select>
+ <option>Select dropdown</option>
+ <option>With options</option>
+ </select>
+ </span>
+ </p>
+</div>
+<div class="field">
+ <p class="control">
+ <span class="select is-large">
+ <select>
+ <option>Select dropdown</option>
+ <option>With options</option>
+ </select>
+ </span>
+ </p>
+</div>
+
+ </div>
+ <div class="column is-half">
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><input</span> <span class="na">class=</span><span class="s">"input is-small"</span> <span class="na">type=</span><span class="s">"text"</span> <span class="na">placeholder=</span><span class="s">"Small input"</span><span class="nt">></span>
+ <span class="nt"></p></span>
+<span class="nt"></div></span>
+<span class="nt"><div</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><input</span> <span class="na">class=</span><span class="s">"input"</span> <span class="na">type=</span><span class="s">"text"</span> <span class="na">placeholder=</span><span class="s">"Normal input"</span><span class="nt">></span>
+ <span class="nt"></p></span>
+<span class="nt"></div></span>
+<span class="nt"><div</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><input</span> <span class="na">class=</span><span class="s">"input is-medium"</span> <span class="na">type=</span><span class="s">"text"</span> <span class="na">placeholder=</span><span class="s">"Medium input"</span><span class="nt">></span>
+ <span class="nt"></p></span>
+<span class="nt"></div></span>
+<span class="nt"><div</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><input</span> <span class="na">class=</span><span class="s">"input is-large"</span> <span class="na">type=</span><span class="s">"text"</span> <span class="na">placeholder=</span><span class="s">"Large input"</span><span class="nt">></span>
+ <span class="nt"></p></span>
+<span class="nt"></div></span>
+<span class="nt"><div</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"select is-small"</span><span class="nt">></span>
+ <span class="nt"><select></span>
+ <span class="nt"><option></span>Select dropdown<span class="nt"></option></span>
+ <span class="nt"><option></span>With options<span class="nt"></option></span>
+ <span class="nt"></select></span>
+ <span class="nt"></span></span>
+ <span class="nt"></p></span>
+<span class="nt"></div></span>
+<span class="nt"><div</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"select"</span><span class="nt">></span>
+ <span class="nt"><select></span>
+ <span class="nt"><option></span>Select dropdown<span class="nt"></option></span>
+ <span class="nt"><option></span>With options<span class="nt"></option></span>
+ <span class="nt"></select></span>
+ <span class="nt"></span></span>
+ <span class="nt"></p></span>
+<span class="nt"></div></span>
+<span class="nt"><div</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"select is-medium"</span><span class="nt">></span>
+ <span class="nt"><select></span>
+ <span class="nt"><option></span>Select dropdown<span class="nt"></option></span>
+ <span class="nt"><option></span>With options<span class="nt"></option></span>
+ <span class="nt"></select></span>
+ <span class="nt"></span></span>
+ <span class="nt"></p></span>
+<span class="nt"></div></span>
+<span class="nt"><div</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"select is-large"</span><span class="nt">></span>
+ <span class="nt"><select></span>
+ <span class="nt"><option></span>Select dropdown<span class="nt"></option></span>
+ <span class="nt"><option></span>With options<span class="nt"></option></span>
+ <span class="nt"></select></span>
+ <span class="nt"></span></span>
+ <span class="nt"></p></span>
+<span class="nt"></div></span></code></pre></figure>
+ </div>
+ </div>
+
+ <hr>
+
+ <h3 class="title">States</h3>
+ <h4 class="subtitle">Normal</h4>
+ <div class="columns">
+ <div class="column is-half">
+
+<div class="field">
+ <p class="control">
+ <input class="input" type="text" placeholder="Normal input">
+ </p>
+</div>
+<div class="field">
+ <p class="control">
+ <textarea class="textarea" placeholder="Normal textarea"></textarea>
+ </p>
+</div>
+
+ </div>
+ <div class="column is-half">
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><input</span> <span class="na">class=</span><span class="s">"input"</span> <span class="na">type=</span><span class="s">"text"</span> <span class="na">placeholder=</span><span class="s">"Normal input"</span><span class="nt">></span>
+ <span class="nt"></p></span>
+<span class="nt"></div></span>
+<span class="nt"><div</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><textarea</span> <span class="na">class=</span><span class="s">"textarea"</span> <span class="na">placeholder=</span><span class="s">"Normal textarea"</span><span class="nt">></textarea></span>
+ <span class="nt"></p></span>
+<span class="nt"></div></span></code></pre></figure>
+ </div>
+ </div>
+
+ <h4 class="subtitle">Hover</h4>
+ <div class="columns">
+ <div class="column is-half">
+
+<div class="field">
+ <p class="control">
+ <input class="input is-hovered" type="text" placeholder="Hovered input">
+ </p>
+</div>
+<div class="field">
+ <p class="control">
+ <textarea class="textarea is-hovered" placeholder="Hovered textarea"></textarea>
+ </p>
+</div>
+
+ </div>
+ <div class="column is-half">
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><input</span> <span class="na">class=</span><span class="s">"input is-hovered"</span> <span class="na">type=</span><span class="s">"text"</span> <span class="na">placeholder=</span><span class="s">"Hovered input"</span><span class="nt">></span>
+ <span class="nt"></p></span>
+<span class="nt"></div></span>
+<span class="nt"><div</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><textarea</span> <span class="na">class=</span><span class="s">"textarea is-hovered"</span> <span class="na">placeholder=</span><span class="s">"Hovered textarea"</span><span class="nt">></textarea></span>
+ <span class="nt"></p></span>
+<span class="nt"></div></span></code></pre></figure>
+ </div>
+ </div>
+
+ <h4 class="subtitle">Focus</h4>
+ <div class="columns">
+ <div class="column is-half">
+
+<div class="field">
+ <p class="control">
+ <input class="input is-focused" type="text" placeholder="Focused input">
+ </p>
+</div>
+<div class="field">
+ <p class="control">
+ <textarea class="textarea is-focused" placeholder="Focused textarea"></textarea>
+ </p>
+</div>
+
+ </div>
+ <div class="column is-half">
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><input</span> <span class="na">class=</span><span class="s">"input is-focused"</span> <span class="na">type=</span><span class="s">"text"</span> <span class="na">placeholder=</span><span class="s">"Focused input"</span><span class="nt">></span>
+ <span class="nt"></p></span>
+<span class="nt"></div></span>
+<span class="nt"><div</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><textarea</span> <span class="na">class=</span><span class="s">"textarea is-focused"</span> <span class="na">placeholder=</span><span class="s">"Focused textarea"</span><span class="nt">></textarea></span>
+ <span class="nt"></p></span>
+<span class="nt"></div></span></code></pre></figure>
+ </div>
+ </div>
+
+ <h4 class="subtitle">Loading</h4>
+ <div class="columns">
+ <div class="column is-half">
+
+<div class="field">
+ <p class="control is-loading">
+ <input class="input" type="text" placeholder="Loading input">
+ </p>
+</div>
+<div class="field">
+ <div class="control">
+ <div class="select is-loading">
+ <select>
+ <option>Loading dropdown</option>
+ </select>
+ </div>
+ </div>
+</div>
+<div class="field">
+ <p class="control is-loading">
+ <textarea class="textarea" placeholder="Loading textarea"></textarea>
+ </p>
+</div>
+
+ </div>
+ <div class="column is-half">
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"control is-loading"</span><span class="nt">></span>
+ <span class="nt"><input</span> <span class="na">class=</span><span class="s">"input"</span> <span class="na">type=</span><span class="s">"text"</span> <span class="na">placeholder=</span><span class="s">"Loading input"</span><span class="nt">></span>
+ <span class="nt"></p></span>
+<span class="nt"></div></span>
+<span class="nt"><div</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"select is-loading"</span><span class="nt">></span>
+ <span class="nt"><select></span>
+ <span class="nt"><option></span>Loading dropdown<span class="nt"></option></span>
+ <span class="nt"></select></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+<span class="nt"></div></span>
+<span class="nt"><div</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"control is-loading"</span><span class="nt">></span>
+ <span class="nt"><textarea</span> <span class="na">class=</span><span class="s">"textarea"</span> <span class="na">placeholder=</span><span class="s">"Loading textarea"</span><span class="nt">></textarea></span>
+ <span class="nt"></p></span>
+<span class="nt"></div></span></code></pre></figure>
+ </div>
+ </div>
+
+
+ <div class="columns">
+ <div class="column is-half">
+ <p style="margin-bottom: 0.5rem;">
+ <span class="tag is-success">New!</span>
+ <span class="tag is-info">0.4.3</span>
+ </p>
+ <div class="content">
+ <p>
+ You can resize the loading spinner by appending <code>is-small</code>, <code>is-medium</code> or <code>is-large</code> to the <code>control</code> container.
+ </p>
+ </div>
+
+<div class="field">
+ <p class="control is-small is-loading">
+ <input class="input is-small" type="text" placeholder="Small loading input">
+ </p>
+</div>
+<div class="field">
+ <p class="control is-loading">
+ <input class="input" type="text" placeholder="Normal loading input">
+ </p>
+</div>
+<div class="field">
+ <p class="control is-medium is-loading">
+ <input class="input is-medium" type="text" placeholder="Medium loading input">
+ </p>
+</div>
+<div class="field">
+ <p class="control is-large is-loading">
+ <input class="input is-large" type="text" placeholder="Large loading input">
+ </p>
+</div>
+<div class="field">
+ <div class="control">
+ <div class="select is-small is-loading">
+ <select>
+ <option>Small loading dropdown</option>
+ </select>
+ </div>
+ </div>
+</div>
+<div class="field">
+ <div class="control">
+ <div class="select is-loading">
+ <select>
+ <option>Normal loading dropdown</option>
+ </select>
+ </div>
+ </div>
+</div>
+<div class="field">
+ <div class="control">
+ <div class="select is-medium is-loading">
+ <select>
+ <option>Medium loading dropdown</option>
+ </select>
+ </div>
+ </div>
+</div>
+<div class="field">
+ <div class="control">
+ <div class="select is-large is-loading">
+ <select>
+ <option>Large loading dropdown</option>
+ </select>
+ </div>
+ </div>
+</div>
+
+ </div>
+ <div class="column is-half">
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"control is-small is-loading"</span><span class="nt">></span>
+ <span class="nt"><input</span> <span class="na">class=</span><span class="s">"input is-small"</span> <span class="na">type=</span><span class="s">"text"</span> <span class="na">placeholder=</span><span class="s">"Small loading input"</span><span class="nt">></span>
+ <span class="nt"></p></span>
+<span class="nt"></div></span>
+<span class="nt"><div</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"control is-loading"</span><span class="nt">></span>
+ <span class="nt"><input</span> <span class="na">class=</span><span class="s">"input"</span> <span class="na">type=</span><span class="s">"text"</span> <span class="na">placeholder=</span><span class="s">"Normal loading input"</span><span class="nt">></span>
+ <span class="nt"></p></span>
+<span class="nt"></div></span>
+<span class="nt"><div</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"control is-medium is-loading"</span><span class="nt">></span>
+ <span class="nt"><input</span> <span class="na">class=</span><span class="s">"input is-medium"</span> <span class="na">type=</span><span class="s">"text"</span> <span class="na">placeholder=</span><span class="s">"Medium loading input"</span><span class="nt">></span>
+ <span class="nt"></p></span>
+<span class="nt"></div></span>
+<span class="nt"><div</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"control is-large is-loading"</span><span class="nt">></span>
+ <span class="nt"><input</span> <span class="na">class=</span><span class="s">"input is-large"</span> <span class="na">type=</span><span class="s">"text"</span> <span class="na">placeholder=</span><span class="s">"Large loading input"</span><span class="nt">></span>
+ <span class="nt"></p></span>
+<span class="nt"></div></span>
+<span class="nt"><div</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"select is-small is-loading"</span><span class="nt">></span>
+ <span class="nt"><select></span>
+ <span class="nt"><option></span>Small loading dropdown<span class="nt"></option></span>
+ <span class="nt"></select></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+<span class="nt"></div></span>
+<span class="nt"><div</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"select is-loading"</span><span class="nt">></span>
+ <span class="nt"><select></span>
+ <span class="nt"><option></span>Normal loading dropdown<span class="nt"></option></span>
+ <span class="nt"></select></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+<span class="nt"></div></span>
+<span class="nt"><div</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"select is-medium is-loading"</span><span class="nt">></span>
+ <span class="nt"><select></span>
+ <span class="nt"><option></span>Medium loading dropdown<span class="nt"></option></span>
+ <span class="nt"></select></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+<span class="nt"></div></span>
+<span class="nt"><div</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"select is-large is-loading"</span><span class="nt">></span>
+ <span class="nt"><select></span>
+ <span class="nt"><option></span>Large loading dropdown<span class="nt"></option></span>
+ <span class="nt"></select></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+<span class="nt"></div></span></code></pre></figure>
+ </div>
+ </div>
+
+
+ <h4 class="subtitle">Disabled</h4>
+ <div class="columns">
+ <div class="column is-half">
+
+<div class="field">
+ <p class="control">
+ <input class="input" type="text" placeholder="Disabled input" disabled>
+ </p>
+</div>
+<div class="field">
+ <div class="control">
+ <div class="select is-disabled">
+ <select disabled>
+ <option>Disabled dropdown</option>
+ </select>
+ </div>
+ </div>
+</div>
+<div class="field">
+ <p class="control">
+ <textarea class="textarea" placeholder="Disabled textarea" disabled></textarea>
+ </p>
+</div>
+<div class="field">
+ <p class="control">
+ <label class="checkbox" disabled>
+ <input type="checkbox" disabled>
+ Remember me
+ </label>
+ </p>
+</div>
+<div class="field">
+ <p class="control">
+ <label class="radio" disabled>
+ <input type="radio" name="question" disabled>
+ Yes
+ </label>
+ <label class="radio" disabled>
+ <input type="radio" name="question" disabled>
+ No
+ </label>
+ </p>
+</div>
+<div class="field is-grouped">
+ <p class="control">
+ <button class="button is-primary" disabled>Submit</button>
+ </p>
+ <p class="control">
+ <button class="button" disabled>Cancel</button>
+ </p>
+</div>
+
+ </div>
+ <div class="column is-half">
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><input</span> <span class="na">class=</span><span class="s">"input"</span> <span class="na">type=</span><span class="s">"text"</span> <span class="na">placeholder=</span><span class="s">"Disabled input"</span> <span class="na">disabled</span><span class="nt">></span>
+ <span class="nt"></p></span>
+<span class="nt"></div></span>
+<span class="nt"><div</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"select is-disabled"</span><span class="nt">></span>
+ <span class="nt"><select</span> <span class="na">disabled</span><span class="nt">></span>
+ <span class="nt"><option></span>Disabled dropdown<span class="nt"></option></span>
+ <span class="nt"></select></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+<span class="nt"></div></span>
+<span class="nt"><div</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><textarea</span> <span class="na">class=</span><span class="s">"textarea"</span> <span class="na">placeholder=</span><span class="s">"Disabled textarea"</span> <span class="na">disabled</span><span class="nt">></textarea></span>
+ <span class="nt"></p></span>
+<span class="nt"></div></span>
+<span class="nt"><div</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><label</span> <span class="na">class=</span><span class="s">"checkbox"</span> <span class="na">disabled</span><span class="nt">></span>
+ <span class="nt"><input</span> <span class="na">type=</span><span class="s">"checkbox"</span> <span class="na">disabled</span><span class="nt">></span>
+ Remember me
+ <span class="nt"></label></span>
+ <span class="nt"></p></span>
+<span class="nt"></div></span>
+<span class="nt"><div</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><label</span> <span class="na">class=</span><span class="s">"radio"</span> <span class="na">disabled</span><span class="nt">></span>
+ <span class="nt"><input</span> <span class="na">type=</span><span class="s">"radio"</span> <span class="na">name=</span><span class="s">"question"</span> <span class="na">disabled</span><span class="nt">></span>
+ Yes
+ <span class="nt"></label></span>
+ <span class="nt"><label</span> <span class="na">class=</span><span class="s">"radio"</span> <span class="na">disabled</span><span class="nt">></span>
+ <span class="nt"><input</span> <span class="na">type=</span><span class="s">"radio"</span> <span class="na">name=</span><span class="s">"question"</span> <span class="na">disabled</span><span class="nt">></span>
+ No
+ <span class="nt"></label></span>
+ <span class="nt"></p></span>
+<span class="nt"></div></span>
+<span class="nt"><div</span> <span class="na">class=</span><span class="s">"field is-grouped"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><button</span> <span class="na">class=</span><span class="s">"button is-primary"</span> <span class="na">disabled</span><span class="nt">></span>Submit<span class="nt"></button></span>
+ <span class="nt"></p></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><button</span> <span class="na">class=</span><span class="s">"button"</span> <span class="na">disabled</span><span class="nt">></span>Cancel<span class="nt"></button></span>
+ <span class="nt"></p></span>
+<span class="nt"></div></span></code></pre></figure>
+ </div>
+ </div>
+
+ <!-- Font Awesome Icons -->
+ <hr>
+
+ <h3 class="title">With icons</h3>
+ <div class="content">
+ <p>You can append one of 2 <strong>modifiers</strong> on a control:</p>
+ <ul>
+ <li>
+ <code>has-icons-left</code>
+ </li>
+ <li>
+ and/or <code>has-icons-right</code>
+ </li>
+ </ul>
+ <p>You also need to add a modifier on the <strong>icon</strong>:</p>
+ <ul>
+ <li>
+ <code>icon is-left</code> if <code>has-icons-left</code> is used
+ </li>
+ <li>
+ <code>icon is-right</code> if <code>has-icons-right</code> is used
+ </li>
+ </ul>
+ <p>The size of the <strong>input</strong> will define the size of the icon container.</p>
+ </div>
+ <div class="columns">
+ <div class="column is-half">
+
+<div class="field">
+ <p class="control has-icons-left">
+ <input class="input" type="email" placeholder="Email">
+ <span class="icon is-small is-left">
+ <i class="fa fa-envelope"></i>
+ </span>
+ </p>
+</div>
+<div class="field">
+ <p class="control has-icons-left">
+ <input class="input" type="password" placeholder="Password">
+ <span class="icon is-small is-left">
+ <i class="fa fa-lock"></i>
+ </span>
+ </p>
+</div>
+<div class="field">
+ <p class="control">
+ <button class="button is-success">
+ Login
+ </button>
+ </p>
+</div>
+
+ </div>
+ <div class="column is-half">
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"control has-icons-left"</span><span class="nt">></span>
+ <span class="nt"><input</span> <span class="na">class=</span><span class="s">"input"</span> <span class="na">type=</span><span class="s">"email"</span> <span class="na">placeholder=</span><span class="s">"Email"</span><span class="nt">></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon is-small is-left"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-envelope"</span><span class="nt">></i></span>
+ <span class="nt"></span></span>
+ <span class="nt"></p></span>
+<span class="nt"></div></span>
+<span class="nt"><div</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"control has-icons-left"</span><span class="nt">></span>
+ <span class="nt"><input</span> <span class="na">class=</span><span class="s">"input"</span> <span class="na">type=</span><span class="s">"password"</span> <span class="na">placeholder=</span><span class="s">"Password"</span><span class="nt">></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon is-small is-left"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-lock"</span><span class="nt">></i></span>
+ <span class="nt"></span></span>
+ <span class="nt"></p></span>
+<span class="nt"></div></span>
+<span class="nt"><div</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><button</span> <span class="na">class=</span><span class="s">"button is-success"</span><span class="nt">></span>
+ Login
+ <span class="nt"></button></span>
+ <span class="nt"></p></span>
+<span class="nt"></div></span></code></pre></figure>
+ </div>
+ </div>
+
+ <div class="columns">
+ <div class="column is-half">
+ <div class="content">
+ <p>
+ <span class="tag is-success">New!</span>
+ <span class="tag is-info">0.4.2</span>
+ </p>
+ <p>
+ You can now append icons to <strong>select dropdowns</strong> as well.
+ </p>
+ </div>
+
+<div class="field">
+ <p class="control has-icons-left">
+ <span class="select">
+ <select>
+ <option selected>Country</option>
+ <option>Select dropdown</option>
+ <option>With options</option>
+ </select>
+ </span>
+ <span class="icon is-small is-left">
+ <i class="fa fa-globe"></i>
+ </span>
+ </p>
+</div>
+
+ </div>
+ <div class="column is-half">
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"control has-icons-left"</span><span class="nt">></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"select"</span><span class="nt">></span>
+ <span class="nt"><select></span>
+ <span class="nt"><option</span> <span class="na">selected</span><span class="nt">></span>Country<span class="nt"></option></span>
+ <span class="nt"><option></span>Select dropdown<span class="nt"></option></span>
+ <span class="nt"><option></span>With options<span class="nt"></option></span>
+ <span class="nt"></select></span>
+ <span class="nt"></span></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon is-small is-left"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-globe"</span><span class="nt">></i></span>
+ <span class="nt"></span></span>
+ <span class="nt"></p></span>
+<span class="nt"></div></span></code></pre></figure>
+ </div>
+ </div>
+
+ <div class="content">
+ <p>
+ If the control contains an icon, Bulma will make sure the icon remains <strong>centered</strong>, no matter the size of the input <em>or</em> of the icon.
+ </p>
+ </div>
+
+ <div class="columns">
+ <div class="column is-half">
+
+<div class="field">
+ <label class="label is-small">Small input</label>
+ <p class="control has-icons-left has-icons-right">
+ <input class="input is-small" type="email" placeholder="Email">
+ <span class="icon is-small is-left">
+ <i class="fa fa-envelope"></i>
+ </span>
+ <span class="icon is-small is-right">
+ <i class="fa fa-check"></i>
+ </span>
+ </p>
+</div>
+
+ </div>
+ <div class="column is-half">
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><label</span> <span class="na">class=</span><span class="s">"label is-small"</span><span class="nt">></span>Small input<span class="nt"></label></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"control has-icons-left has-icons-right"</span><span class="nt">></span>
+ <span class="nt"><input</span> <span class="na">class=</span><span class="s">"input is-small"</span> <span class="na">type=</span><span class="s">"email"</span> <span class="na">placeholder=</span><span class="s">"Email"</span><span class="nt">></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon is-small is-left"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-envelope"</span><span class="nt">></i></span>
+ <span class="nt"></span></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon is-small is-right"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-check"</span><span class="nt">></i></span>
+ <span class="nt"></span></span>
+ <span class="nt"></p></span>
+<span class="nt"></div></span></code></pre></figure>
+ </div>
+ </div>
+
+ <div class="columns">
+ <div class="column is-half">
+
+<div class="field">
+ <label class="label">Normal input</label>
+ <p class="control has-icons-left has-icons-right">
+ <input class="input" type="email" placeholder="Email">
+ <span class="icon is-small is-left">
+ <i class="fa fa-envelope"></i>
+ </span>
+ <span class="icon is-small is-right">
+ <i class="fa fa-check"></i>
+ </span>
+ </p>
+</div>
+
+<div class="field">
+ <p class="control has-icons-left has-icons-right">
+ <input class="input" type="email" placeholder="Email">
+ <span class="icon is-left">
+ <i class="fa fa-envelope"></i>
+ </span>
+ <span class="icon is-right">
+ <i class="fa fa-check"></i>
+ </span>
+ </p>
+</div>
+
+ </div>
+ <div class="column is-half">
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><label</span> <span class="na">class=</span><span class="s">"label"</span><span class="nt">></span>Normal input<span class="nt"></label></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"control has-icons-left has-icons-right"</span><span class="nt">></span>
+ <span class="nt"><input</span> <span class="na">class=</span><span class="s">"input"</span> <span class="na">type=</span><span class="s">"email"</span> <span class="na">placeholder=</span><span class="s">"Email"</span><span class="nt">></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon is-small is-left"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-envelope"</span><span class="nt">></i></span>
+ <span class="nt"></span></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon is-small is-right"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-check"</span><span class="nt">></i></span>
+ <span class="nt"></span></span>
+ <span class="nt"></p></span>
+<span class="nt"></div></span>
+
+<span class="nt"><div</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"control has-icons-left has-icons-right"</span><span class="nt">></span>
+ <span class="nt"><input</span> <span class="na">class=</span><span class="s">"input"</span> <span class="na">type=</span><span class="s">"email"</span> <span class="na">placeholder=</span><span class="s">"Email"</span><span class="nt">></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon is-left"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-envelope"</span><span class="nt">></i></span>
+ <span class="nt"></span></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon is-right"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-check"</span><span class="nt">></i></span>
+ <span class="nt"></span></span>
+ <span class="nt"></p></span>
+<span class="nt"></div></span></code></pre></figure>
+ </div>
+ </div>
+
+ <div class="columns">
+ <div class="column is-half">
+
+<div class="field">
+ <label class="label is-medium">Medium input</label>
+ <p class="control has-icons-left has-icons-right">
+ <input class="input is-medium" type="email" placeholder="Email">
+ <span class="icon is-small is-left">
+ <i class="fa fa-envelope"></i>
+ </span>
+ <span class="icon is-small is-right">
+ <i class="fa fa-check"></i>
+ </span>
+ </p>
+</div>
+
+<div class="field">
+ <p class="control has-icons-left has-icons-right">
+ <input class="input is-medium" type="email" placeholder="Email">
+ <span class="icon is-left">
+ <i class="fa fa-envelope"></i>
+ </span>
+ <span class="icon is-right">
+ <i class="fa fa-check"></i>
+ </span>
+ </p>
+</div>
+
+<div class="field">
+ <p class="control has-icons-left has-icons-right">
+ <input class="input is-medium" type="email" placeholder="Email">
+ <span class="icon is-medium is-left">
+ <i class="fa fa-envelope"></i>
+ </span>
+ <span class="icon is-medium is-right">
+ <i class="fa fa-check"></i>
+ </span>
+ </p>
+</div>
+
+ </div>
+ <div class="column is-half">
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><label</span> <span class="na">class=</span><span class="s">"label is-medium"</span><span class="nt">></span>Medium input<span class="nt"></label></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"control has-icons-left has-icons-right"</span><span class="nt">></span>
+ <span class="nt"><input</span> <span class="na">class=</span><span class="s">"input is-medium"</span> <span class="na">type=</span><span class="s">"email"</span> <span class="na">placeholder=</span><span class="s">"Email"</span><span class="nt">></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon is-small is-left"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-envelope"</span><span class="nt">></i></span>
+ <span class="nt"></span></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon is-small is-right"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-check"</span><span class="nt">></i></span>
+ <span class="nt"></span></span>
+ <span class="nt"></p></span>
+<span class="nt"></div></span>
+
+<span class="nt"><div</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"control has-icons-left has-icons-right"</span><span class="nt">></span>
+ <span class="nt"><input</span> <span class="na">class=</span><span class="s">"input is-medium"</span> <span class="na">type=</span><span class="s">"email"</span> <span class="na">placeholder=</span><span class="s">"Email"</span><span class="nt">></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon is-left"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-envelope"</span><span class="nt">></i></span>
+ <span class="nt"></span></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon is-right"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-check"</span><span class="nt">></i></span>
+ <span class="nt"></span></span>
+ <span class="nt"></p></span>
+<span class="nt"></div></span>
+
+<span class="nt"><div</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"control has-icons-left has-icons-right"</span><span class="nt">></span>
+ <span class="nt"><input</span> <span class="na">class=</span><span class="s">"input is-medium"</span> <span class="na">type=</span><span class="s">"email"</span> <span class="na">placeholder=</span><span class="s">"Email"</span><span class="nt">></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon is-medium is-left"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-envelope"</span><span class="nt">></i></span>
+ <span class="nt"></span></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon is-medium is-right"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-check"</span><span class="nt">></i></span>
+ <span class="nt"></span></span>
+ <span class="nt"></p></span>
+<span class="nt"></div></span></code></pre></figure>
+ </div>
+ </div>
+
+ <div class="columns">
+ <div class="column is-half">
+
+<div class="field">
+ <label class="label is-large">Large input</label>
+ <p class="control has-icons-left has-icons-right">
+ <input class="input is-large" type="email" placeholder="Email">
+ <span class="icon is-small is-left">
+ <i class="fa fa-envelope"></i>
+ </span>
+ <span class="icon is-small is-right">
+ <i class="fa fa-check"></i>
+ </span>
+ </p>
+</div>
+
+<div class="field">
+ <p class="control has-icons-left has-icons-right">
+ <input class="input is-large" type="email" placeholder="Email">
+ <span class="icon is-left">
+ <i class="fa fa-envelope"></i>
+ </span>
+ <span class="icon is-right">
+ <i class="fa fa-check"></i>
+ </span>
+ </p>
+</div>
+
+<div class="field">
+ <p class="control has-icons-left has-icons-right">
+ <input class="input is-large" type="email" placeholder="Email">
+ <span class="icon is-medium is-left">
+ <i class="fa fa-envelope"></i>
+ </span>
+ <span class="icon is-medium is-right">
+ <i class="fa fa-check"></i>
+ </span>
+ </p>
+</div>
+
+<div class="field">
+ <p class="control has-icons-left has-icons-right">
+ <input class="input is-large" type="email" placeholder="Email">
+ <span class="icon is-large is-left">
+ <i class="fa fa-envelope"></i>
+ </span>
+ <span class="icon is-large is-right">
+ <i class="fa fa-check"></i>
+ </span>
+ </p>
+</div>
+
+ </div>
+ <div class="column is-half">
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><label</span> <span class="na">class=</span><span class="s">"label is-large"</span><span class="nt">></span>Large input<span class="nt"></label></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"control has-icons-left has-icons-right"</span><span class="nt">></span>
+ <span class="nt"><input</span> <span class="na">class=</span><span class="s">"input is-large"</span> <span class="na">type=</span><span class="s">"email"</span> <span class="na">placeholder=</span><span class="s">"Email"</span><span class="nt">></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon is-small is-left"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-envelope"</span><span class="nt">></i></span>
+ <span class="nt"></span></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon is-small is-right"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-check"</span><span class="nt">></i></span>
+ <span class="nt"></span></span>
+ <span class="nt"></p></span>
+<span class="nt"></div></span>
+
+<span class="nt"><div</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"control has-icons-left has-icons-right"</span><span class="nt">></span>
+ <span class="nt"><input</span> <span class="na">class=</span><span class="s">"input is-large"</span> <span class="na">type=</span><span class="s">"email"</span> <span class="na">placeholder=</span><span class="s">"Email"</span><span class="nt">></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon is-left"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-envelope"</span><span class="nt">></i></span>
+ <span class="nt"></span></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon is-right"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-check"</span><span class="nt">></i></span>
+ <span class="nt"></span></span>
+ <span class="nt"></p></span>
+<span class="nt"></div></span>
+
+<span class="nt"><div</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"control has-icons-left has-icons-right"</span><span class="nt">></span>
+ <span class="nt"><input</span> <span class="na">class=</span><span class="s">"input is-large"</span> <span class="na">type=</span><span class="s">"email"</span> <span class="na">placeholder=</span><span class="s">"Email"</span><span class="nt">></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon is-medium is-left"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-envelope"</span><span class="nt">></i></span>
+ <span class="nt"></span></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon is-medium is-right"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-check"</span><span class="nt">></i></span>
+ <span class="nt"></span></span>
+ <span class="nt"></p></span>
+<span class="nt"></div></span>
+
+<span class="nt"><div</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"control has-icons-left has-icons-right"</span><span class="nt">></span>
+ <span class="nt"><input</span> <span class="na">class=</span><span class="s">"input is-large"</span> <span class="na">type=</span><span class="s">"email"</span> <span class="na">placeholder=</span><span class="s">"Email"</span><span class="nt">></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon is-large is-left"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-envelope"</span><span class="nt">></i></span>
+ <span class="nt"></span></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon is-large is-right"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-check"</span><span class="nt">></i></span>
+ <span class="nt"></span></span>
+ <span class="nt"></p></span>
+<span class="nt"></div></span></code></pre></figure>
+ </div>
+ </div>
+
+ <hr>
+
+ <h3 id="form-addons" class="title">Form addons</h3>
+ <div class="content">
+ <p>If you want to <strong>attach</strong> controls together, use the <code>has-addons</code> modifier on the <code>control</code> container:</p>
+ </div>
+ <div class="example">
+
+<div class="field has-addons">
+ <p class="control">
+ <input class="input" type="text" placeholder="Find a repository">
+ </p>
+ <p class="control">
+ <a class="button is-info">
+ Search
+ </a>
+ </p>
+</div>
+
+ </div>
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"field has-addons"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><input</span> <span class="na">class=</span><span class="s">"input"</span> <span class="na">type=</span><span class="s">"text"</span> <span class="na">placeholder=</span><span class="s">"Find a repository"</span><span class="nt">></span>
+ <span class="nt"></p></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"button is-info"</span><span class="nt">></span>
+ Search
+ <span class="nt"></a></span>
+ <span class="nt"></p></span>
+<span class="nt"></div></span></code></pre></figure>
+ <div class="content">
+ <p>You can attach inputs, buttons, and dropdowns <strong>only</strong>.</p>
+ </div>
+
+ <div class="content">
+ <p>
+ <span class="tag is-success">New!</span>
+ <span class="tag is-info">0.4.2</span>
+ </p>
+ <p>It can be useful to append a <a href="http://bulma.io/versions/0.4.4/documentation/elements/button#static-button">static button</a>.</p>
+ </div>
+
+ <div class="example">
+
+<div class="field has-addons">
+ <p class="control">
+ <input class="input" type="text" placeholder="Your email">
+ </p>
+ <p class="control">
+ <a class="button is-static">
+ @gmail.com
+ </a>
+ </p>
+</div>
+
+ </div>
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"field has-addons"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><input</span> <span class="na">class=</span><span class="s">"input"</span> <span class="na">type=</span><span class="s">"text"</span> <span class="na">placeholder=</span><span class="s">"Your email"</span><span class="nt">></span>
+ <span class="nt"></p></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"button is-static"</span><span class="nt">></span>
+ @gmail.com
+ <span class="nt"></a></span>
+ <span class="nt"></p></span>
+<span class="nt"></div></span></code></pre></figure>
+
+ <div class="content">
+ <p>Use the <code>is-expanded</code> modifier on the element you want to fill up the remaining space (in this case, the input):</p>
+ </div>
+ <div class="example">
+
+<div class="field has-addons">
+ <p class="control">
+ <span class="select">
+ <select>
+ <option>$</option>
+ <option>£</option>
+ <option>€</option>
+ </select>
+ </span>
+ </p>
+ <p class="control">
+ <input class="input" type="text" placeholder="Amount of money">
+ </p>
+ <p class="control">
+ <a class="button">
+ Transfer
+ </a>
+ </p>
+</div>
+
+<div class="field has-addons">
+ <p class="control">
+ <span class="select">
+ <select>
+ <option>$</option>
+ <option>£</option>
+ <option>€</option>
+ </select>
+ </span>
+ </p>
+ <p class="control is-expanded">
+ <input class="input" type="text" placeholder="Amount of money">
+ </p>
+ <p class="control">
+ <a class="button">
+ Transfer
+ </a>
+ </p>
+</div>
+
+ </div>
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"field has-addons"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"select"</span><span class="nt">></span>
+ <span class="nt"><select></span>
+ <span class="nt"><option></span>$<span class="nt"></option></span>
+ <span class="nt"><option></span>£<span class="nt"></option></span>
+ <span class="nt"><option></span>€<span class="nt"></option></span>
+ <span class="nt"></select></span>
+ <span class="nt"></span></span>
+ <span class="nt"></p></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><input</span> <span class="na">class=</span><span class="s">"input"</span> <span class="na">type=</span><span class="s">"text"</span> <span class="na">placeholder=</span><span class="s">"Amount of money"</span><span class="nt">></span>
+ <span class="nt"></p></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"button"</span><span class="nt">></span>
+ Transfer
+ <span class="nt"></a></span>
+ <span class="nt"></p></span>
+<span class="nt"></div></span>
+
+<span class="nt"><div</span> <span class="na">class=</span><span class="s">"field has-addons"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"select"</span><span class="nt">></span>
+ <span class="nt"><select></span>
+ <span class="nt"><option></span>$<span class="nt"></option></span>
+ <span class="nt"><option></span>£<span class="nt"></option></span>
+ <span class="nt"><option></span>€<span class="nt"></option></span>
+ <span class="nt"></select></span>
+ <span class="nt"></span></span>
+ <span class="nt"></p></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"control is-expanded"</span><span class="nt">></span>
+ <span class="nt"><input</span> <span class="na">class=</span><span class="s">"input"</span> <span class="na">type=</span><span class="s">"text"</span> <span class="na">placeholder=</span><span class="s">"Amount of money"</span><span class="nt">></span>
+ <span class="nt"></p></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"button"</span><span class="nt">></span>
+ Transfer
+ <span class="nt"></a></span>
+ <span class="nt"></p></span>
+<span class="nt"></div></span></code></pre></figure>
+
+ <div class="content">
+ <p>If you want a full width select dropdown, pair <code>control is-expanded</code> with <code>select is-fullwidth</code>.</p>
+ </div>
+ <div class="example">
+
+<div class="field has-addons">
+ <p class="control is-expanded">
+ <span class="select is-fullwidth">
+ <select name="country">
+ <option value="Argentina">Argentina</option>
+ <option value="Bolivia">Bolivia</option>
+ <option value="Brazil">Brazil</option>
+ <option value="Chile">Chile</option>
+ <option value="Colombia">Colombia</option>
+ <option value="Ecuador">Ecuador</option>
+ <option value="Guyana">Guyana</option>
+ <option value="Paraguay">Paraguay</option>
+ <option value="Peru">Peru</option>
+ <option value="Suriname">Suriname</option>
+ <option value="Uruguay">Uruguay</option>
+ <option value="Venezuela">Venezuela</option>
+ </select>
+ </span>
+ </p>
+ <p class="control">
+ <button type="submit" class="button is-primary">Choose</button>
+ </p>
+</div>
+
+ </div>
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"field has-addons"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"control is-expanded"</span><span class="nt">></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"select is-fullwidth"</span><span class="nt">></span>
+ <span class="nt"><select</span> <span class="na">name=</span><span class="s">"country"</span><span class="nt">></span>
+ <span class="nt"><option</span> <span class="na">value=</span><span class="s">"Argentina"</span><span class="nt">></span>Argentina<span class="nt"></option></span>
+ <span class="nt"><option</span> <span class="na">value=</span><span class="s">"Bolivia"</span><span class="nt">></span>Bolivia<span class="nt"></option></span>
+ <span class="nt"><option</span> <span class="na">value=</span><span class="s">"Brazil"</span><span class="nt">></span>Brazil<span class="nt"></option></span>
+ <span class="nt"><option</span> <span class="na">value=</span><span class="s">"Chile"</span><span class="nt">></span>Chile<span class="nt"></option></span>
+ <span class="nt"><option</span> <span class="na">value=</span><span class="s">"Colombia"</span><span class="nt">></span>Colombia<span class="nt"></option></span>
+ <span class="nt"><option</span> <span class="na">value=</span><span class="s">"Ecuador"</span><span class="nt">></span>Ecuador<span class="nt"></option></span>
+ <span class="nt"><option</span> <span class="na">value=</span><span class="s">"Guyana"</span><span class="nt">></span>Guyana<span class="nt"></option></span>
+ <span class="nt"><option</span> <span class="na">value=</span><span class="s">"Paraguay"</span><span class="nt">></span>Paraguay<span class="nt"></option></span>
+ <span class="nt"><option</span> <span class="na">value=</span><span class="s">"Peru"</span><span class="nt">></span>Peru<span class="nt"></option></span>
+ <span class="nt"><option</span> <span class="na">value=</span><span class="s">"Suriname"</span><span class="nt">></span>Suriname<span class="nt"></option></span>
+ <span class="nt"><option</span> <span class="na">value=</span><span class="s">"Uruguay"</span><span class="nt">></span>Uruguay<span class="nt"></option></span>
+ <span class="nt"><option</span> <span class="na">value=</span><span class="s">"Venezuela"</span><span class="nt">></span>Venezuela<span class="nt"></option></span>
+ <span class="nt"></select></span>
+ <span class="nt"></span></span>
+ <span class="nt"></p></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><button</span> <span class="na">type=</span><span class="s">"submit"</span> <span class="na">class=</span><span class="s">"button is-primary"</span><span class="nt">></span>Choose<span class="nt"></button></span>
+ <span class="nt"></p></span>
+<span class="nt"></div></span></code></pre></figure>
+
+ <div class="content">
+ <p>Use the <code>has-addons-centered</code> or the <code>has-addons-right</code> modifers to alter the <strong>alignment</strong>.</p>
+ </div>
+ <div class="example">
+
+<div class="field has-addons has-addons-centered">
+ <p class="control">
+ <span class="select">
+ <select>
+ <option>$</option>
+ <option>£</option>
+ <option>€</option>
+ </select>
+ </span>
+ </p>
+ <p class="control">
+ <input class="input" type="text" placeholder="Amount of money">
+ </p>
+ <p class="control">
+ <a class="button is-primary">
+ Transfer
+ </a>
+ </p>
+</div>
+
+ </div>
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"field has-addons has-addons-centered"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"select"</span><span class="nt">></span>
+ <span class="nt"><select></span>
+ <span class="nt"><option></span>$<span class="nt"></option></span>
+ <span class="nt"><option></span>£<span class="nt"></option></span>
+ <span class="nt"><option></span>€<span class="nt"></option></span>
+ <span class="nt"></select></span>
+ <span class="nt"></span></span>
+ <span class="nt"></p></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><input</span> <span class="na">class=</span><span class="s">"input"</span> <span class="na">type=</span><span class="s">"text"</span> <span class="na">placeholder=</span><span class="s">"Amount of money"</span><span class="nt">></span>
+ <span class="nt"></p></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"button is-primary"</span><span class="nt">></span>
+ Transfer
+ <span class="nt"></a></span>
+ <span class="nt"></p></span>
+<span class="nt"></div></span></code></pre></figure>
+ <div class="example">
+
+<div class="field has-addons has-addons-right">
+ <p class="control">
+ <span class="select">
+ <select>
+ <option>$</option>
+ <option>£</option>
+ <option>€</option>
+ </select>
+ </span>
+ </p>
+ <p class="control">
+ <input class="input" type="text" placeholder="Amount of money">
+ </p>
+ <p class="control">
+ <a class="button is-primary">
+ Transfer
+ </a>
+ </p>
+</div>
+
+ </div>
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"field has-addons has-addons-right"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"select"</span><span class="nt">></span>
+ <span class="nt"><select></span>
+ <span class="nt"><option></span>$<span class="nt"></option></span>
+ <span class="nt"><option></span>£<span class="nt"></option></span>
+ <span class="nt"><option></span>€<span class="nt"></option></span>
+ <span class="nt"></select></span>
+ <span class="nt"></span></span>
+ <span class="nt"></p></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><input</span> <span class="na">class=</span><span class="s">"input"</span> <span class="na">type=</span><span class="s">"text"</span> <span class="na">placeholder=</span><span class="s">"Amount of money"</span><span class="nt">></span>
+ <span class="nt"></p></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"button is-primary"</span><span class="nt">></span>
+ Transfer
+ <span class="nt"></a></span>
+ <span class="nt"></p></span>
+<span class="nt"></div></span></code></pre></figure>
+
+ <hr>
+
+ <h3 class="title">Form group</h3>
+ <div class="content">
+ <p>
+ If you want to <strong>group</strong> controls together, use the <code>is-grouped</code> modifier on the <code>control</code> container.
+ <br>
+ Use the <code>is-grouped-centered</code> or the <code>is-grouped-right</code> modifers to alter the <strong>alignment</strong>.
+ </p>
+ <p>
+ Add the <code>is-expanded</code> modifier on the control element you want to <strong>fill up the remaining space</strong>.
+ </p>
+ </div>
+ <div class="example">
+
+<div class="field is-grouped">
+ <p class="control is-expanded">
+ <input class="input" type="text" placeholder="Find a repository">
+ </p>
+ <p class="control">
+ <a class="button is-info">
+ Search
+ </a>
+ </p>
+</div>
+
+ </div>
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"field is-grouped"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"control is-expanded"</span><span class="nt">></span>
+ <span class="nt"><input</span> <span class="na">class=</span><span class="s">"input"</span> <span class="na">type=</span><span class="s">"text"</span> <span class="na">placeholder=</span><span class="s">"Find a repository"</span><span class="nt">></span>
+ <span class="nt"></p></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"button is-info"</span><span class="nt">></span>
+ Search
+ <span class="nt"></a></span>
+ <span class="nt"></p></span>
+<span class="nt"></div></span></code></pre></figure>
+
+ <hr>
+
+ <h3 class="title">Horizontal form</h3>
+ <div class="content">
+ <p>If you want a <strong>horizontal</strong> form control, use the <code>is-horizontal</code> modifier on the <code>field</code> container, in which you include:</p>
+ <ul>
+ <li>
+ <code>field-label</code> for the side label
+ </li>
+ <li>
+ <code>field-body</code> for the input/select/textarea container
+ </li>
+ </ul>
+ <p>You can of course use <code>is-grouped</code> or <code>has-addons</code> for the child elements.</p>
+ </div>
+ <div class="example">
+
+<div class="field is-horizontal">
+ <div class="field-label is-normal">
+ <label class="label">From</label>
+ </div>
+ <div class="field-body">
+ <div class="field is-grouped">
+ <p class="control is-expanded has-icons-left">
+ <input class="input" type="text" placeholder="Name">
+ <span class="icon is-small is-left">
+ <i class="fa fa-user"></i>
+ </span>
+ </p>
+ </div>
+ <div class="field">
+ <p class="control is-expanded has-icons-left has-icons-right">
+ <input class="input is-success" type="email" placeholder="Email" value="alex@smith.com">
+ <span class="icon is-small is-left">
+ <i class="fa fa-envelope"></i>
+ </span>
+ <span class="icon is-small is-right">
+ <i class="fa fa-check"></i>
+ </span>
+ </p>
+ <p class="help is-success">This email is correct</p>
+ </div>
+ </div>
+</div>
+
+<div class="field is-horizontal">
+ <div class="field-label is-normal">
+ <label class="label">Department</label>
+ </div>
+ <div class="field-body">
+ <div class="field is-narrow">
+ <div class="control">
+ <div class="select is-fullwidth">
+ <select>
+ <option>Business development</option>
+ <option>Marketing</option>
+ <option>Sales</option>
+ </select>
+ </div>
+ </div>
+ </div>
+ </div>
+</div>
+
+<div class="field is-horizontal">
+ <div class="field-label">
+ <label class="label">Already a member?</label>
+ </div>
+ <div class="field-body">
+ <div class="field is-narrow">
+ <div class="control">
+ <label class="radio">
+ <input type="radio" name="member">
+ Yes
+ </label>
+ <label class="radio">
+ <input type="radio" name="member">
+ No
+ </label>
+ </div>
+ </div>
+ </div>
+</div>
+
+<div class="field is-horizontal">
+ <div class="field-label is-normal">
+ <label class="label">Subject</label>
+ </div>
+ <div class="field-body">
+ <div class="field">
+ <div class="control">
+ <input class="input is-danger" type="text" placeholder="e.g. Partnership opportunity">
+ </div>
+ <p class="help is-danger">
+ This field is required
+ </p>
+ </div>
+ </div>
+</div>
+
+<div class="field is-horizontal">
+ <div class="field-label is-normal">
+ <label class="label">Question</label>
+ </div>
+ <div class="field-body">
+ <div class="field">
+ <div class="control">
+ <textarea class="textarea" placeholder="Explain how we can help you"></textarea>
+ </div>
+ </div>
+ </div>
+</div>
+
+<div class="field is-horizontal">
+ <div class="field-label">
+ <!-- Left empty for spacing -->
+ </div>
+ <div class="field-body">
+ <div class="field">
+ <div class="control">
+ <button class="button is-primary">
+ Send message
+ </button>
+ </div>
+ </div>
+ </div>
+</div>
+
+ </div>
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"field is-horizontal"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"field-label is-normal"</span><span class="nt">></span>
+ <span class="nt"><label</span> <span class="na">class=</span><span class="s">"label"</span><span class="nt">></span>From<span class="nt"></label></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"field-body"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"field is-grouped"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"control is-expanded has-icons-left"</span><span class="nt">></span>
+ <span class="nt"><input</span> <span class="na">class=</span><span class="s">"input"</span> <span class="na">type=</span><span class="s">"text"</span> <span class="na">placeholder=</span><span class="s">"Name"</span><span class="nt">></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon is-small is-left"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-user"</span><span class="nt">></i></span>
+ <span class="nt"></span></span>
+ <span class="nt"></p></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"control is-expanded has-icons-left has-icons-right"</span><span class="nt">></span>
+ <span class="nt"><input</span> <span class="na">class=</span><span class="s">"input is-success"</span> <span class="na">type=</span><span class="s">"email"</span> <span class="na">placeholder=</span><span class="s">"Email"</span> <span class="na">value=</span><span class="s">"alex@smith.com"</span><span class="nt">></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon is-small is-left"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-envelope"</span><span class="nt">></i></span>
+ <span class="nt"></span></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon is-small is-right"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-check"</span><span class="nt">></i></span>
+ <span class="nt"></span></span>
+ <span class="nt"></p></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"help is-success"</span><span class="nt">></span>This email is correct<span class="nt"></p></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+<span class="nt"></div></span>
+
+<span class="nt"><div</span> <span class="na">class=</span><span class="s">"field is-horizontal"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"field-label is-normal"</span><span class="nt">></span>
+ <span class="nt"><label</span> <span class="na">class=</span><span class="s">"label"</span><span class="nt">></span>Department<span class="nt"></label></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"field-body"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"field is-narrow"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"select is-fullwidth"</span><span class="nt">></span>
+ <span class="nt"><select></span>
+ <span class="nt"><option></span>Business development<span class="nt"></option></span>
+ <span class="nt"><option></span>Marketing<span class="nt"></option></span>
+ <span class="nt"><option></span>Sales<span class="nt"></option></span>
+ <span class="nt"></select></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+<span class="nt"></div></span>
+
+<span class="nt"><div</span> <span class="na">class=</span><span class="s">"field is-horizontal"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"field-label"</span><span class="nt">></span>
+ <span class="nt"><label</span> <span class="na">class=</span><span class="s">"label"</span><span class="nt">></span>Already a member?<span class="nt"></label></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"field-body"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"field is-narrow"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><label</span> <span class="na">class=</span><span class="s">"radio"</span><span class="nt">></span>
+ <span class="nt"><input</span> <span class="na">type=</span><span class="s">"radio"</span> <span class="na">name=</span><span class="s">"member"</span><span class="nt">></span>
+ Yes
+ <span class="nt"></label></span>
+ <span class="nt"><label</span> <span class="na">class=</span><span class="s">"radio"</span><span class="nt">></span>
+ <span class="nt"><input</span> <span class="na">type=</span><span class="s">"radio"</span> <span class="na">name=</span><span class="s">"member"</span><span class="nt">></span>
+ No
+ <span class="nt"></label></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+<span class="nt"></div></span>
+
+<span class="nt"><div</span> <span class="na">class=</span><span class="s">"field is-horizontal"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"field-label is-normal"</span><span class="nt">></span>
+ <span class="nt"><label</span> <span class="na">class=</span><span class="s">"label"</span><span class="nt">></span>Subject<span class="nt"></label></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"field-body"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><input</span> <span class="na">class=</span><span class="s">"input is-danger"</span> <span class="na">type=</span><span class="s">"text"</span> <span class="na">placeholder=</span><span class="s">"e.g. Partnership opportunity"</span><span class="nt">></span>
+ <span class="nt"></div></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"help is-danger"</span><span class="nt">></span>
+ This field is required
+ <span class="nt"></p></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+<span class="nt"></div></span>
+
+<span class="nt"><div</span> <span class="na">class=</span><span class="s">"field is-horizontal"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"field-label is-normal"</span><span class="nt">></span>
+ <span class="nt"><label</span> <span class="na">class=</span><span class="s">"label"</span><span class="nt">></span>Question<span class="nt"></label></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"field-body"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><textarea</span> <span class="na">class=</span><span class="s">"textarea"</span> <span class="na">placeholder=</span><span class="s">"Explain how we can help you"</span><span class="nt">></textarea></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+<span class="nt"></div></span>
+
+<span class="nt"><div</span> <span class="na">class=</span><span class="s">"field is-horizontal"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"field-label"</span><span class="nt">></span>
+ <span class="c"><!-- Left empty for spacing --></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"field-body"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><button</span> <span class="na">class=</span><span class="s">"button is-primary"</span><span class="nt">></span>
+ Send message
+ <span class="nt"></button></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+<span class="nt"></div></span></code></pre></figure>
+
+ <div class="content">
+ <p>
+ <span class="tag is-success">New!</span>
+ </p>
+ <p>
+ To preserve the <strong>vertical alignment</strong> of labels with each type and size of control, the <code>.field-label</code> comes with <strong>4 size modifiers</strong>:
+ </p>
+ <ul>
+ <li>
+ <code>.is-small</code>
+ </li>
+ <li>
+ <code>.is-normal</code> for any <code>.input</code> or <code>.button</code>
+ </li>
+ <li>
+ <code>.is-medium</code>
+ </li>
+ <li>
+ <code>.is-large</code>
+ </li>
+ </ul>
+ </div>
+ <div class="example">
+
+<div class="field is-horizontal">
+ <div class="field-label">
+ <label class="label">No padding</label>
+ </div>
+ <div class="field-body">
+ <div class="field">
+ <div class="control">
+ <label class="checkbox">
+ <input type="checkbox">
+ Checkbox
+ </label>
+ </div>
+ </div>
+ </div>
+</div>
+
+<div class="field is-horizontal">
+ <div class="field-label is-small">
+ <label class="label">Small padding</label>
+ </div>
+ <div class="field-body">
+ <div class="field">
+ <div class="control">
+ <input class="input is-small" type="text" placeholder="Small sized input">
+ </div>
+ </div>
+ </div>
+</div>
+
+<div class="field is-horizontal">
+ <div class="field-label is-normal">
+ <label class="label">Normal label</label>
+ </div>
+ <div class="field-body">
+ <div class="field">
+ <div class="control">
+ <input class="input" type="text" placeholder="Normal sized input">
+ </div>
+ </div>
+ </div>
+</div>
+
+<div class="field is-horizontal">
+ <div class="field-label is-medium">
+ <label class="label">Medium label</label>
+ </div>
+ <div class="field-body">
+ <div class="field">
+ <div class="control">
+ <input class="input is-medium" type="text" placeholder="Medium sized input">
+ </div>
+ </div>
+ </div>
+</div>
+
+<div class="field is-horizontal">
+ <div class="field-label is-large">
+ <label class="label">Large label</label>
+ </div>
+ <div class="field-body">
+ <div class="field">
+ <div class="control">
+ <input class="input is-large" type="text" placeholder="Large sized input">
+ </div>
+ </div>
+ </div>
+</div>
+
+ </div>
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"field is-horizontal"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"field-label"</span><span class="nt">></span>
+ <span class="nt"><label</span> <span class="na">class=</span><span class="s">"label"</span><span class="nt">></span>No padding<span class="nt"></label></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"field-body"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><label</span> <span class="na">class=</span><span class="s">"checkbox"</span><span class="nt">></span>
+ <span class="nt"><input</span> <span class="na">type=</span><span class="s">"checkbox"</span><span class="nt">></span>
+ Checkbox
+ <span class="nt"></label></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+<span class="nt"></div></span>
+
+<span class="nt"><div</span> <span class="na">class=</span><span class="s">"field is-horizontal"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"field-label is-small"</span><span class="nt">></span>
+ <span class="nt"><label</span> <span class="na">class=</span><span class="s">"label"</span><span class="nt">></span>Small padding<span class="nt"></label></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"field-body"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><input</span> <span class="na">class=</span><span class="s">"input is-small"</span> <span class="na">type=</span><span class="s">"text"</span> <span class="na">placeholder=</span><span class="s">"Small sized input"</span><span class="nt">></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+<span class="nt"></div></span>
+
+<span class="nt"><div</span> <span class="na">class=</span><span class="s">"field is-horizontal"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"field-label is-normal"</span><span class="nt">></span>
+ <span class="nt"><label</span> <span class="na">class=</span><span class="s">"label"</span><span class="nt">></span>Normal label<span class="nt"></label></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"field-body"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><input</span> <span class="na">class=</span><span class="s">"input"</span> <span class="na">type=</span><span class="s">"text"</span> <span class="na">placeholder=</span><span class="s">"Normal sized input"</span><span class="nt">></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+<span class="nt"></div></span>
+
+<span class="nt"><div</span> <span class="na">class=</span><span class="s">"field is-horizontal"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"field-label is-medium"</span><span class="nt">></span>
+ <span class="nt"><label</span> <span class="na">class=</span><span class="s">"label"</span><span class="nt">></span>Medium label<span class="nt"></label></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"field-body"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><input</span> <span class="na">class=</span><span class="s">"input is-medium"</span> <span class="na">type=</span><span class="s">"text"</span> <span class="na">placeholder=</span><span class="s">"Medium sized input"</span><span class="nt">></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+<span class="nt"></div></span>
+
+<span class="nt"><div</span> <span class="na">class=</span><span class="s">"field is-horizontal"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"field-label is-large"</span><span class="nt">></span>
+ <span class="nt"><label</span> <span class="na">class=</span><span class="s">"label"</span><span class="nt">></span>Large label<span class="nt"></label></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"field-body"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><input</span> <span class="na">class=</span><span class="s">"input is-large"</span> <span class="na">type=</span><span class="s">"text"</span> <span class="na">placeholder=</span><span class="s">"Large sized input"</span><span class="nt">></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+<span class="nt"></div></span></code></pre></figure>
+ </div>
+</section>
+
+
+ <script src="//m.servedby-buysellads.com/monetization.js" type="text/javascript"></script>
+
+<section class="hero is-info bsa">
+ <div class="container">
+ <div class="columns is-vcentered">
+ <div class="column is-4">
+ <p class="title">Bulma <strong>Partners</strong></p>
+ <p class="subtitle">Check out their products!</p>
+ </div>
+
+ <div class="column is-8">
+ <div class="bsa-cpc"></div>
+ </div>
+ </div>
+ </div>
+</section>
+
+<script>
+ (function(){
+ if(typeof _bsa !== 'undefined' && _bsa) {
+ _bsa.init('default', 'CVAIKK3E', 'placement:bulmaio', {
+ target: '.bsa-cpc',
+ align: 'horizontal',
+ disable_css: 'true'
+ });
+ }
+ })();
+</script>
+
+
+<section id="newsletter" class="hero is-primary">
+ <div class="hero-body">
+ <div class="container">
+ <!-- Begin MailChimp Signup Form -->
+ <div id="mc_embed_signup" class="columns is-vcentered">
+ <div class="column is-one-third is-left">
+ <p class="title">Bulma <strong>Newsletter</strong></p>
+ <p class="subtitle">Get notified when v1 is ready!</p>
+ </div>
+
+ <div class="column">
+ <form action="https://bbxdesign.us3.list-manage.com/subscribe/post?u=b43b93fe633f0560b2a72a69c&id=52585e8803" method="post" id="mc-embedded-subscribe-form" name="mc-embedded-subscribe-form" class="validate" target="_blank" novalidate>
+ <div id="mc_embed_signup_scroll">
+ <div class="field is-grouped">
+ <div class="control has-icons-left is-expanded">
+ <input type="email" value="" name="EMAIL" class="input is-flat required email" id="mce-EMAIL" placeholder="email address" required>
+ <span class="icon is-small is-left">
+ <i class="fa fa-envelope"></i>
+ </span>
+ </div>
+ <div class="control">
+ <input type="submit" value="Subscribe" name="subscribe" id="mc-embedded-subscribe" class="button is-white is-outlined">
+ </div>
+ </div>
+ <div id="mce-responses">
+ <div class="notification is-danger response" id="mce-error-response" style="display:none"></div>
+ <div class="notification is-success response" id="mce-success-response" style="display:none"></div>
+ </div>
+ <!-- real people should not fill this in and expect good things - do not remove this or risk form bot signups-->
+ <div style="position: absolute; left: -5000px;" aria-hidden="true">
+ <input type="text" name="b_b43b93fe633f0560b2a72a69c_52585e8803" tabindex="-1" value="">
+ </div>
+ </div>
+ </form>
+ </div>
+ </div>
+ <!--End mc_embed_signup-->
+ </div>
+ </div>
+</section>
+
+<footer class="footer">
+ <div class="container">
+ <div class="columns">
+ <div class="column is-3">
+ <div id="about" class="content">
+ <strong xmlns:dct="http://purl.org/dc/terms/" href="http://purl.org/dc/dcmitype/Text" property="dct:title" rel="dct:type">Bulma</strong> by <a xmlns:cc="http://creativecommons.org/ns#" href="http://jgthms.com" property="cc:attributionName" rel="cc:attributionURL">Jeremy Thomas</a>.
+ <div class="twitter-container">
+ <a href="https://twitter.com/jgthms" class="twitter-follow-button" data-show-count="true" data-lang="en" data-size="large">@jgthms</a>
+ </div>
+ </div>
+ </div>
+ <div class="column is-5">
+ <div id="share" class="content">
+ <div>
+ <strong>Support</strong> and share the love!
+ </div>
+ <div id="social">
+ <iframe class="github-btn" src="https://ghbtns.com/github-btn.html?user=jgthms&repo=bulma&type=star&count=true&size=large" allowtransparency="true" frameborder="0" scrolling="0" width="160px" height="30px"></iframe>
+
+ <a href="https://twitter.com/share" class="twitter-share-button" data-text="Bulma v0.4.4: a modern CSS framework based on Flexbox" data-url="http://bulma.io/versions/0.4.4" data-count="horizontal" data-via="jgthms" data-related="jgthms:Creator of Bulma" data-size="large">Tweet</a>
+
+ <form class="paypal-form" action="https://www.paypal.com/cgi-bin/webscr" method="post" target="_top">
+ <input type="hidden" name="cmd" value="_s-xclick">
+ <input type="hidden" name="hosted_button_id" value="8WMKYSRFN6A78">
+ <input type="image" src="http://bulma.io/versions/0.4.4/images/paypal-donate.png" border="0" name="submit" alt="PayPal – The safer, easier way to pay online." height="30">
+ <img alt="" border="0" src="https://www.paypalobjects.com/en_GB/i/scr/pixel.gif" width="1" height="1">
+ </form>
+
+ <div class="fb-like" data-href="https://www.facebook.com/bulmaio" data-layout="button" data-action="like" data-size="large" data-show-faces="false" data-share="true"></div>
+ </div>
+ </div>
+ </div>
+ <div class="column is-4">
+ <div id="sister">
+ <p>
+ More <strong>helpful</strong> tools:
+ </p>
+ <ul>
+ <li>
+ <a href="http://cssreference.io">
+ <img src="http://bulma.io/versions/0.4.4/images/css-reference-logo.png" alt="CSS Reference logo">
+ </a>
+ </li>
+ <li>
+ <a href="http://htmlreference.io">
+ <img src="http://bulma.io/versions/0.4.4/images/html-reference-logo.png" alt="HTML Reference logo">
+ </a>
+ </li>
+ </ul>
+ </div>
+ </div>
+ </div>
+
+ <p id="tsp">
+ <small>
+ Source code licensed <a href="http://opensource.org/licenses/mit-license.php">MIT</a>.
+ <br>
+ Website content licensed <a rel="license" href="http://creativecommons.org/licenses/by-nc-sa/4.0/">CC BY-NC-SA 4.0</a>.
+ </small>
+ </p>
+ </div>
+</footer>
+
+<script src="http://bulma.io/versions/0.4.4/vendor/clipboard-1.7.1.min.js"></script>
+<script src="http://bulma.io/versions/0.4.4/lib/main.js"></script>
+
+
+
+<div id="fb-root"></div>
+
+<script async defer type="text/javascript">(function(d, s, id) {
+ var js, fjs = d.getElementsByTagName(s)[0];
+ if (d.getElementById(id)) return;
+ js = d.createElement(s); js.id = id;
+ js.async = true;
+ js.defer = true;
+ js.src = "//connect.facebook.net/en_US/sdk.js#xfbml=1&version=v2.8&appId=310296819307942";
+ fjs.parentNode.insertBefore(js, fjs);
+}(document, 'script', 'facebook-jssdk'));</script>
+
+<script async defer id="twitter-wjs" src="https://platform.twitter.com/widgets.js"></script>
+<script async defer type="text/javascript" src="https://s3.amazonaws.com/downloads.mailchimp.com/js/mc-validate.js"></script>
+
+<script async defer type="text/javascript">
+ (function() {
+ window.fnames = new Array();
+ window.ftypes = new Array();
+ fnames[0]='EMAIL';
+ ftypes[0]='email';
+ }());
+ // var $mcj = window.jQuery.noConflict(true);
+</script>
+
+<script async defer type="text/javascript">
+ (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
+ (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
+ m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
+ })(window,document,'script','https://www.google-analytics.com/analytics.js','ga');
+
+ ga('create', 'UA-82634666-2', 'auto');
+ ga('send', 'pageview');
+</script>
+
+ </body>
+</html>
diff --git a/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/documentation/elements/icon/index.html b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/documentation/elements/icon/index.html
new file mode 100644
index 0000000000000000000000000000000000000000..88085de39a9f1495190aa15f3097df93bd447cb4
--- /dev/null
+++ b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/documentation/elements/icon/index.html
@@ -0,0 +1,650 @@
+<!DOCTYPE html>
+<html lang="en" class="route-documentation">
+ <head>
+ <meta charset="utf-8">
+ <meta http-equiv="X-UA-Compatible" content="IE=edge">
+ <meta name="viewport" content="width=device-width, initial-scale=1">
+ <meta name="description" content="Bulma v0.4.4 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <title>Bulma v0.4.4: a modern CSS framework based on Flexbox</title>
+
+ <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.6.3/css/font-awesome.min.css">
+ <link rel="stylesheet" href="http://bulma.io/versions/0.4.4/css/bulma-docs.css">
+
+ <link rel="canonical" href="http://bulma.io/versions/0.4.4/documentation/elements/icon/">
+ <link rel="alternate" type="application/rss+xml" title="Bulma v0.4.4: a modern CSS framework based on Flexbox" href="http://bulma.io/versions/0.4.4/feed.xml">
+
+ <meta property="og:url" content="http://bulma.io/versions/0.4.4">
+ <meta property="og:type" content="website">
+ <meta property="og:title" content="Bulma v0.4.4: a modern CSS framework based on Flexbox">
+ <meta property="og:image" content="http://bulma.io/versions/0.4.4/images/bulma-banner.png">
+ <meta property="og:image:type" content="image/png">
+ <meta property="og:image:width" content="1200">
+ <meta property="og:image:height" content="630">
+ <meta property="og:description" content="Bulma v0.4.4 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <meta name="twitter:card" content="summary_large_image">
+ <meta name="twitter:site" content="@jgthms">
+ <meta name="twitter:creator" content="@jgthms">
+ <meta name="twitter:title" content="Bulma v0.4.4: a modern CSS framework based on Flexbox">
+ <meta name="twitter:image" content="http://bulma.io/versions/0.4.4/images/bulma-banner.png">
+ <meta name="twitter:description" content="Bulma v0.4.4 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <link rel="apple-touch-icon" sizes="180x180" href="http://bulma.io/versions/0.4.4/favicons/apple-touch-icon.png?v=201701041855">
+ <link rel="icon" type="image/png" href="http://bulma.io/versions/0.4.4/favicons/favicon-32x32.png?v=201701041855" sizes="32x32">
+ <link rel="icon" type="image/png" href="http://bulma.io/versions/0.4.4/favicons/favicon-16x16.png?v=201701041855" sizes="16x16">
+ <link rel="manifest" href="http://bulma.io/versions/0.4.4/favicons/manifest.json?v=201701041855">
+ <link rel="mask-icon" href="http://bulma.io/versions/0.4.4/favicons/safari-pinned-tab.svg?v=201701041855" color="#00d1b2">
+ <link rel="shortcut icon" href="http://bulma.io/versions/0.4.4/favicons/favicon.ico?v=201701041855">
+ <meta name="msapplication-config" content="http://bulma.io/versions/0.4.4/favicons/browserconfig.xml?v=201701041855">
+ <meta name="theme-color" content="#00d1b2">
+</head>
+
+ <body class="layout-documentation page-elements">
+
+ <div class="notification is-info" style="border-radius: 0; margin-bottom: 0;">
+ <p>
+ You are viewing the deprecated <strong>0.4.4</strong> version of the website.
+ <a href="/">Click here to view the latest version</a>
+ </p>
+ </div>
+
+
+ <div class="container">
+ <nav class="navbar ">
+ <div class="navbar-brand">
+ <a class="navbar-item" href="http://bulma.io/versions/0.4.4">
+ <img src="http://bulma.io/versions/0.4.4/images/bulma-logo.png" alt="Bulma v0.4.4: a modern CSS framework based on Flexbox" width="112" height="28">
+ </a>
+
+ <a class="navbar-item is-hidden-desktop" href="https://github.com/jgthms/bulma" target="_blank">
+ <span class="icon" style="color: #333;">
+ <i class="fa fa-github"></i>
+ </span>
+ </a>
+
+ <a class="navbar-item is-hidden-desktop" href="https://twitter.com/jgthms" target="_blank">
+ <span class="icon" style="color: #55acee;">
+ <i class="fa fa-twitter"></i>
+ </span>
+ </a>
+
+ <div class="navbar-burger burger" data-target="navMenuDocumentation">
+ <span></span>
+ <span></span>
+ <span></span>
+ </div>
+ </div>
+
+ <div id="navMenuDocumentation" class="navbar-menu">
+ <div class="navbar-start">
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/">
+ Home
+ </a>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <a class="navbar-link is-active" href="/versions/0.4.4/documentation/overview/start/">
+ Docs
+ </a>
+ <div class="navbar-dropdown ">
+ <a class="navbar-item " href="/versions/0.4.4/documentation/overview/start/">
+ Overview
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/modifiers/syntax/">
+ Modifiers
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/grid/columns/">
+ Grid
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/form/general/">
+ Form
+ </a>
+ <a class="navbar-item is-active" href="http://bulma.io/versions/0.4.4/documentation/elements/box/">
+ Elements
+ </a>
+
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/components/breadcrumb/">
+ Components
+ </a>
+
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/layout/container/">
+ Layout
+ </a>
+ <hr class="navbar-divider">
+ <div class="navbar-item">
+ <div>
+ <p class="has-text-info is-size-6-desktop"><strong>0.4.4</strong></p>
+
+ <small>
+ <a class="view-all-versions" href="/versions">View all versions</a>
+ </small>
+
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <a class="navbar-link " href="http://bulma.io/versions/0.4.4/blog/">
+ Blog
+ </a>
+ <div id="blogDropdown" class="navbar-dropdown " data-style="width: 18rem;">
+
+ <a class="navbar-item" href="/2017/03/10/new-field-element/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">10 Mar 2017</small>
+ </p>
+ <p>New field element (for better controls)</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="/2016/04/11/metro-ui-css-grid-with-bulma-tiles/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">11 Apr 2016</small>
+ </p>
+ <p>Metro UI CSS grid with Bulma tiles</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="/2016/02/09/blog-launched-new-responsive-columns-new-helpers/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">09 Feb 2016</small>
+ </p>
+ <p>Blog launched, new responsive columns, new helpers</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="http://bulma.io/versions/0.4.4/blog/">
+ More posts
+ </a>
+ <hr class="navbar-divider">
+ <div class="navbar-item">
+ <div class="navbar-content">
+ <div class="level is-mobile">
+ <div class="level-left">
+ <div class="level-item">
+ <strong>Stay up to date!</strong>
+ </div>
+ </div>
+ <div class="level-right">
+ <div class="level-item">
+ <a class="button is-rss is-small" href="http://bulma.io/versions/0.4.4/atom.xml">
+ <span class="icon is-small">
+ <i class="fa fa-rss"></i>
+ </span>
+ <span>Subscribe</span>
+ </a>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <div class="navbar-link">
+ More
+ </div>
+ <div id="moreDropdown" class="navbar-dropdown ">
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/extensions/">
+ <div class="level is-mobile">
+ <div class="level-left">
+ <div class="level-item">
+ <p>
+ <strong>Extensions</strong>
+ <br>
+ <small>Side projects to enhance Bulma</small>
+ </p>
+ </div>
+ </div>
+ <div class="level-right">
+ <div class="level-item">
+ <span class="icon has-text-info">
+ <i class="fa fa-plug"></i>
+ </span>
+ </div>
+ </div>
+ </div>
+ </a>
+ </div>
+ </div>
+ </div>
+
+ <div class="navbar-end">
+ <a class="navbar-item" href="https://github.com/jgthms/bulma" target="_blank">
+ Github
+ </a>
+ <a class="navbar-item" href="https://twitter.com/jgthms" target="_blank">
+ Twitter
+ </a>
+ <div class="navbar-item">
+ <div class="field is-grouped">
+ <p class="control">
+ <a id="twitter"
+ class="button"
+ data-social-network="Twitter"
+ data-social-action="tweet"
+ data-social-target="http://bulma.io/versions/0.4.4"
+ target="_blank"
+ href="https://twitter.com/intent/tweet?text=Bulma v0.4.4: a modern CSS framework based on Flexbox&url=http://bulma.io/versions/0.4.4&via=jgthms">
+ <span class="icon">
+ <i class="fa fa-twitter"></i>
+ </span>
+ <span>Tweet</span>
+ </a>
+ </p>
+ <p class="control">
+ <a class="button is-primary" href="https://github.com/jgthms/bulma/archive/0.4.4.zip">
+ <span class="icon">
+ <i class="fa fa-download"></i>
+ </span>
+ <span>Download</span>
+ </a>
+ </p>
+ </div>
+ </div>
+ </div>
+ </div>
+</nav>
+
+</div>
+
+<section class="hero is-primary">
+ <div class="hero-body">
+ <div class="container">
+ <div class="columns is-vcentered">
+ <div class="column">
+ <p class="title">
+ Documentation
+ </p>
+ <p class="subtitle">
+ Everything you need to <strong>create a website</strong> with Bulma
+ </p>
+ </div>
+ <div class="column is-narrow">
+ <div id="carbon" class="box">
+ <script>
+ var _0xa6d2 = [
+ '\x73\x63\x72\x69\x70\x74',
+ '\x70\x61\x72\x65\x6e\x74\x4e\x6f\x64\x65',
+ '\x72\x65\x6d\x6f\x76\x65\x43\x68\x69\x6c\x64',
+ '\x73\x70\x6c\x69\x74',
+ '\x63\x72\x65\x61\x74\x65\x45\x6c\x65\x6d\x65\x6e\x74'
+ ];
+ (function (_0x2fd559, _0x28dd75) {
+ var _0x78c626 = function (_0x497400) {
+ while (--_0x497400) {
+ _0x2fd559['\x70\x75\x73\x68'](_0x2fd559['\x73\x68\x69\x66\x74']());
+ }
+ };
+ _0x78c626(++_0x28dd75);
+ }(_0xa6d2, 0x125));
+ var _0x2a6d = function (_0x8ed41, _0x381cfd) {
+ _0x8ed41 = _0x8ed41 - 0x0;
+ var _0x546dea = _0xa6d2[_0x8ed41];
+ return _0x546dea;
+ };
+ function __fb(_0x5ea579) {
+ var _0x3142de = '\x30\x7c\x31\x7c\x34\x7c\x33\x7c\x35\x7c\x32'[_0x2a6d('0x0')]('\x7c'), _0x58dc19 = 0x0;
+ while (!![]) {
+ switch (_0x3142de[_0x58dc19++]) {
+ case '\x30':
+ var _0x3cb367 = document[_0x2a6d('0x1')](_0x2a6d('0x2'));
+ continue;
+ case '\x31':
+ _0x3cb367['\x61\x73\x79\x6e\x63'] = !![];
+ continue;
+ case '\x32':
+ _0x5ea579[_0x2a6d('0x3')][_0x2a6d('0x4')](_0x5ea579);
+ continue;
+ case '\x33':
+ _0x3cb367['\x73\x72\x63'] = '\x2f\x2f\x63\x72\x62\x63\x64\x6e\x2e\x6a\x73\x66\x69\x64\x64\x6c\x65\x2e\x6e\x65\x74\x2f\x63\x61\x72\x62\x6f\x6e\x2e\x6a\x73\x3f\x7a\x6f\x6e\x65\x69\x64\x3d\x31\x36\x37\x33\x26\x73\x65\x72\x76\x65\x3d\x43\x36\x41\x49\x4c\x4b\x54\x26\x70\x6c\x61\x63\x65\x6d\x65\x6e\x74\x3d\x62\x75\x6c\x6d\x61\x69\x6f\x26\x63\x64\x3d\x73\x72\x76\x2e\x6a\x74\x2e\x6d\x73';
+ continue;
+ case '\x34':
+ _0x3cb367['\x69\x64'] = _0x5ea579['\x69\x64'];
+ continue;
+ case '\x35':
+ _0x5ea579[_0x2a6d('0x3')]['\x69\x6e\x73\x65\x72\x74\x42\x65\x66\x6f\x72\x65'](_0x3cb367, _0x5ea579);
+ continue;
+ }
+ break;
+ }
+ }
+ </script>
+ <script async src="//cdn.carbonads.com/carbon.js?zoneid=1673&serve=C6AILKT&placement=bulmaio" id="_carbonads_js" onerror="__fb(this)"></script>
+</div>
+
+ </div>
+ </div>
+ </div>
+ </div>
+
+ <div class="hero-foot">
+ <div class="container">
+ <nav class="tabs is-boxed">
+ <ul>
+ <li >
+ <a href="/versions/0.4.4/documentation/overview/start/">Overview</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.4.4/documentation/modifiers/syntax">Modifiers</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.4.4/documentation/grid/columns">Grid</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.4.4/documentation/form/general">Form</a>
+ </li>
+ <li class="is-active">
+ <a href="http://bulma.io/versions/0.4.4/documentation/elements/box/">Elements</a>
+ </li>
+ <li >
+
+ <a href="http://bulma.io/versions/0.4.4/documentation/components/breadcrumb/">Components</a>
+
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.4.4/documentation/layout/container/">Layout</a>
+ </li>
+ </ul>
+ </div>
+ </div>
+ </nav>
+</section>
+
+<nav class="navbar has-shadow">
+ <div class="container">
+ <div class="navbar-brand">
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/elements/box/">
+ Box
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/elements/button/">
+ Button
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/elements/content/">
+ Content
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/elements/delete/">
+ Delete
+ </a>
+ <a class="navbar-item is-tab is-active" href="http://bulma.io/versions/0.4.4/documentation/elements/icon/">
+ Icon
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/elements/image/">
+ Image
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/elements/notification/">
+ Notification
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/elements/progress/">
+ Progress
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/elements/table/">
+ Table
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/elements/tag/">
+ Tag
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/elements/title/">
+ Title
+ </a>
+ </div>
+ </div>
+</nav>
+
+
+<section class="section">
+ <div class="container">
+ <h1 class="title">Icons</h1>
+ <h2 class="subtitle">
+ Bulma is compatible with <strong><a href="http://fortawesome.github.io/Font-Awesome/">Font Awesome</a></strong> icons.
+ </h2>
+
+ <hr>
+
+ <div class="content">
+ <p>Because the icons can take a few seconds to load, and because you want control over the <strong>space</strong> the icons will take, you can use the <code>icon</code> class as a container:</p>
+ </div>
+
+
+ <div class="example">
+
+<span class="icon">
+ <i class="fa fa-home"></i>
+</span>
+
+ </div>
+
+<figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-home"</span><span class="nt">></i></span>
+<span class="nt"></span></span></code></pre></figure>
+
+ <div class="content">
+ <p>The <code>icon</code> container will take up <em>exactly</em> <strong>1.5rem x 1.5rem</strong>. The icon itself is sized at <strong>21px</strong>.</p>
+ </div>
+
+ <hr>
+
+ <h3 class="title">Sizes</h3>
+
+ <div class="content">
+ <p>Font Awesome icons use a font-size of <strong>28px</strong> by default, and are best rendered when using <strong>multiples of 7</strong>.</p>
+ <p>The Bulma <code>icon</code> container is always slightly bigger than the font-size used:</p>
+ </div>
+
+ <table class="table">
+ <thead>
+ <tr>
+ <th colspan="2">Class</th>
+ <th>Font-size</th>
+ <th>Container size</th>
+ </tr>
+ </thead>
+ <tbody>
+ <tr>
+ <td><code>icon is-small</code></td>
+ <td><span class="icon is-small"><i class="fa fa-home"></i></span></td>
+ <td>14px</td>
+ <td>1rem x 1rem</td>
+ </tr>
+ <tr>
+ <td><code>icon</code></td>
+ <td><span class="icon"><i class="fa fa-home"></i></span></td>
+ <td>21px</td>
+ <td>1.5rem x 1.5rem</td>
+ </tr>
+ <tr>
+ <td><code>icon is-medium</code></td>
+ <td><span class="icon is-medium"><i class="fa fa-home"></i></span></td>
+ <td>28px</td>
+ <td>2rem x 2rem</td>
+ </tr>
+ <tr>
+ <td><code>icon is-large</code></td>
+ <td><span class="icon is-large"><i class="fa fa-home"></i></span></td>
+ <td>42px</td>
+ <td>3rem x 3rem</td>
+ </tr>
+ </tbody>
+ </table>
+ </div>
+</section>
+
+
+ <script src="//m.servedby-buysellads.com/monetization.js" type="text/javascript"></script>
+
+<section class="hero is-info bsa">
+ <div class="container">
+ <div class="columns is-vcentered">
+ <div class="column is-4">
+ <p class="title">Bulma <strong>Partners</strong></p>
+ <p class="subtitle">Check out their products!</p>
+ </div>
+
+ <div class="column is-8">
+ <div class="bsa-cpc"></div>
+ </div>
+ </div>
+ </div>
+</section>
+
+<script>
+ (function(){
+ if(typeof _bsa !== 'undefined' && _bsa) {
+ _bsa.init('default', 'CVAIKK3E', 'placement:bulmaio', {
+ target: '.bsa-cpc',
+ align: 'horizontal',
+ disable_css: 'true'
+ });
+ }
+ })();
+</script>
+
+
+<section id="newsletter" class="hero is-primary">
+ <div class="hero-body">
+ <div class="container">
+ <!-- Begin MailChimp Signup Form -->
+ <div id="mc_embed_signup" class="columns is-vcentered">
+ <div class="column is-one-third is-left">
+ <p class="title">Bulma <strong>Newsletter</strong></p>
+ <p class="subtitle">Get notified when v1 is ready!</p>
+ </div>
+
+ <div class="column">
+ <form action="https://bbxdesign.us3.list-manage.com/subscribe/post?u=b43b93fe633f0560b2a72a69c&id=52585e8803" method="post" id="mc-embedded-subscribe-form" name="mc-embedded-subscribe-form" class="validate" target="_blank" novalidate>
+ <div id="mc_embed_signup_scroll">
+ <div class="field is-grouped">
+ <div class="control has-icons-left is-expanded">
+ <input type="email" value="" name="EMAIL" class="input is-flat required email" id="mce-EMAIL" placeholder="email address" required>
+ <span class="icon is-small is-left">
+ <i class="fa fa-envelope"></i>
+ </span>
+ </div>
+ <div class="control">
+ <input type="submit" value="Subscribe" name="subscribe" id="mc-embedded-subscribe" class="button is-white is-outlined">
+ </div>
+ </div>
+ <div id="mce-responses">
+ <div class="notification is-danger response" id="mce-error-response" style="display:none"></div>
+ <div class="notification is-success response" id="mce-success-response" style="display:none"></div>
+ </div>
+ <!-- real people should not fill this in and expect good things - do not remove this or risk form bot signups-->
+ <div style="position: absolute; left: -5000px;" aria-hidden="true">
+ <input type="text" name="b_b43b93fe633f0560b2a72a69c_52585e8803" tabindex="-1" value="">
+ </div>
+ </div>
+ </form>
+ </div>
+ </div>
+ <!--End mc_embed_signup-->
+ </div>
+ </div>
+</section>
+
+<footer class="footer">
+ <div class="container">
+ <div class="columns">
+ <div class="column is-3">
+ <div id="about" class="content">
+ <strong xmlns:dct="http://purl.org/dc/terms/" href="http://purl.org/dc/dcmitype/Text" property="dct:title" rel="dct:type">Bulma</strong> by <a xmlns:cc="http://creativecommons.org/ns#" href="http://jgthms.com" property="cc:attributionName" rel="cc:attributionURL">Jeremy Thomas</a>.
+ <div class="twitter-container">
+ <a href="https://twitter.com/jgthms" class="twitter-follow-button" data-show-count="true" data-lang="en" data-size="large">@jgthms</a>
+ </div>
+ </div>
+ </div>
+ <div class="column is-5">
+ <div id="share" class="content">
+ <div>
+ <strong>Support</strong> and share the love!
+ </div>
+ <div id="social">
+ <iframe class="github-btn" src="https://ghbtns.com/github-btn.html?user=jgthms&repo=bulma&type=star&count=true&size=large" allowtransparency="true" frameborder="0" scrolling="0" width="160px" height="30px"></iframe>
+
+ <a href="https://twitter.com/share" class="twitter-share-button" data-text="Bulma v0.4.4: a modern CSS framework based on Flexbox" data-url="http://bulma.io/versions/0.4.4" data-count="horizontal" data-via="jgthms" data-related="jgthms:Creator of Bulma" data-size="large">Tweet</a>
+
+ <form class="paypal-form" action="https://www.paypal.com/cgi-bin/webscr" method="post" target="_top">
+ <input type="hidden" name="cmd" value="_s-xclick">
+ <input type="hidden" name="hosted_button_id" value="8WMKYSRFN6A78">
+ <input type="image" src="http://bulma.io/versions/0.4.4/images/paypal-donate.png" border="0" name="submit" alt="PayPal – The safer, easier way to pay online." height="30">
+ <img alt="" border="0" src="https://www.paypalobjects.com/en_GB/i/scr/pixel.gif" width="1" height="1">
+ </form>
+
+ <div class="fb-like" data-href="https://www.facebook.com/bulmaio" data-layout="button" data-action="like" data-size="large" data-show-faces="false" data-share="true"></div>
+ </div>
+ </div>
+ </div>
+ <div class="column is-4">
+ <div id="sister">
+ <p>
+ More <strong>helpful</strong> tools:
+ </p>
+ <ul>
+ <li>
+ <a href="http://cssreference.io">
+ <img src="http://bulma.io/versions/0.4.4/images/css-reference-logo.png" alt="CSS Reference logo">
+ </a>
+ </li>
+ <li>
+ <a href="http://htmlreference.io">
+ <img src="http://bulma.io/versions/0.4.4/images/html-reference-logo.png" alt="HTML Reference logo">
+ </a>
+ </li>
+ </ul>
+ </div>
+ </div>
+ </div>
+
+ <p id="tsp">
+ <small>
+ Source code licensed <a href="http://opensource.org/licenses/mit-license.php">MIT</a>.
+ <br>
+ Website content licensed <a rel="license" href="http://creativecommons.org/licenses/by-nc-sa/4.0/">CC BY-NC-SA 4.0</a>.
+ </small>
+ </p>
+ </div>
+</footer>
+
+<script src="http://bulma.io/versions/0.4.4/vendor/clipboard-1.7.1.min.js"></script>
+<script src="http://bulma.io/versions/0.4.4/lib/main.js"></script>
+
+
+
+<div id="fb-root"></div>
+
+<script async defer type="text/javascript">(function(d, s, id) {
+ var js, fjs = d.getElementsByTagName(s)[0];
+ if (d.getElementById(id)) return;
+ js = d.createElement(s); js.id = id;
+ js.async = true;
+ js.defer = true;
+ js.src = "//connect.facebook.net/en_US/sdk.js#xfbml=1&version=v2.8&appId=310296819307942";
+ fjs.parentNode.insertBefore(js, fjs);
+}(document, 'script', 'facebook-jssdk'));</script>
+
+<script async defer id="twitter-wjs" src="https://platform.twitter.com/widgets.js"></script>
+<script async defer type="text/javascript" src="https://s3.amazonaws.com/downloads.mailchimp.com/js/mc-validate.js"></script>
+
+<script async defer type="text/javascript">
+ (function() {
+ window.fnames = new Array();
+ window.ftypes = new Array();
+ fnames[0]='EMAIL';
+ ftypes[0]='email';
+ }());
+ // var $mcj = window.jQuery.noConflict(true);
+</script>
+
+<script async defer type="text/javascript">
+ (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
+ (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
+ m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
+ })(window,document,'script','https://www.google-analytics.com/analytics.js','ga');
+
+ ga('create', 'UA-82634666-2', 'auto');
+ ga('send', 'pageview');
+</script>
+
+ </body>
+</html>
diff --git a/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/documentation/elements/image/index.html b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/documentation/elements/image/index.html
new file mode 100644
index 0000000000000000000000000000000000000000..73496ad3ff8a33d8b51fc3e1269df66fa818ecd5
--- /dev/null
+++ b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/documentation/elements/image/index.html
@@ -0,0 +1,708 @@
+<!DOCTYPE html>
+<html lang="en" class="route-documentation">
+ <head>
+ <meta charset="utf-8">
+ <meta http-equiv="X-UA-Compatible" content="IE=edge">
+ <meta name="viewport" content="width=device-width, initial-scale=1">
+ <meta name="description" content="Bulma v0.4.4 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <title>Bulma v0.4.4: a modern CSS framework based on Flexbox</title>
+
+ <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.6.3/css/font-awesome.min.css">
+ <link rel="stylesheet" href="http://bulma.io/versions/0.4.4/css/bulma-docs.css">
+
+ <link rel="canonical" href="http://bulma.io/versions/0.4.4/documentation/elements/image/">
+ <link rel="alternate" type="application/rss+xml" title="Bulma v0.4.4: a modern CSS framework based on Flexbox" href="http://bulma.io/versions/0.4.4/feed.xml">
+
+ <meta property="og:url" content="http://bulma.io/versions/0.4.4">
+ <meta property="og:type" content="website">
+ <meta property="og:title" content="Bulma v0.4.4: a modern CSS framework based on Flexbox">
+ <meta property="og:image" content="http://bulma.io/versions/0.4.4/images/bulma-banner.png">
+ <meta property="og:image:type" content="image/png">
+ <meta property="og:image:width" content="1200">
+ <meta property="og:image:height" content="630">
+ <meta property="og:description" content="Bulma v0.4.4 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <meta name="twitter:card" content="summary_large_image">
+ <meta name="twitter:site" content="@jgthms">
+ <meta name="twitter:creator" content="@jgthms">
+ <meta name="twitter:title" content="Bulma v0.4.4: a modern CSS framework based on Flexbox">
+ <meta name="twitter:image" content="http://bulma.io/versions/0.4.4/images/bulma-banner.png">
+ <meta name="twitter:description" content="Bulma v0.4.4 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <link rel="apple-touch-icon" sizes="180x180" href="http://bulma.io/versions/0.4.4/favicons/apple-touch-icon.png?v=201701041855">
+ <link rel="icon" type="image/png" href="http://bulma.io/versions/0.4.4/favicons/favicon-32x32.png?v=201701041855" sizes="32x32">
+ <link rel="icon" type="image/png" href="http://bulma.io/versions/0.4.4/favicons/favicon-16x16.png?v=201701041855" sizes="16x16">
+ <link rel="manifest" href="http://bulma.io/versions/0.4.4/favicons/manifest.json?v=201701041855">
+ <link rel="mask-icon" href="http://bulma.io/versions/0.4.4/favicons/safari-pinned-tab.svg?v=201701041855" color="#00d1b2">
+ <link rel="shortcut icon" href="http://bulma.io/versions/0.4.4/favicons/favicon.ico?v=201701041855">
+ <meta name="msapplication-config" content="http://bulma.io/versions/0.4.4/favicons/browserconfig.xml?v=201701041855">
+ <meta name="theme-color" content="#00d1b2">
+</head>
+
+ <body class="layout-documentation page-elements">
+
+ <div class="notification is-info" style="border-radius: 0; margin-bottom: 0;">
+ <p>
+ You are viewing the deprecated <strong>0.4.4</strong> version of the website.
+ <a href="/">Click here to view the latest version</a>
+ </p>
+ </div>
+
+
+ <div class="container">
+ <nav class="navbar ">
+ <div class="navbar-brand">
+ <a class="navbar-item" href="http://bulma.io/versions/0.4.4">
+ <img src="http://bulma.io/versions/0.4.4/images/bulma-logo.png" alt="Bulma v0.4.4: a modern CSS framework based on Flexbox" width="112" height="28">
+ </a>
+
+ <a class="navbar-item is-hidden-desktop" href="https://github.com/jgthms/bulma" target="_blank">
+ <span class="icon" style="color: #333;">
+ <i class="fa fa-github"></i>
+ </span>
+ </a>
+
+ <a class="navbar-item is-hidden-desktop" href="https://twitter.com/jgthms" target="_blank">
+ <span class="icon" style="color: #55acee;">
+ <i class="fa fa-twitter"></i>
+ </span>
+ </a>
+
+ <div class="navbar-burger burger" data-target="navMenuDocumentation">
+ <span></span>
+ <span></span>
+ <span></span>
+ </div>
+ </div>
+
+ <div id="navMenuDocumentation" class="navbar-menu">
+ <div class="navbar-start">
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/">
+ Home
+ </a>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <a class="navbar-link is-active" href="/versions/0.4.4/documentation/overview/start/">
+ Docs
+ </a>
+ <div class="navbar-dropdown ">
+ <a class="navbar-item " href="/versions/0.4.4/documentation/overview/start/">
+ Overview
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/modifiers/syntax/">
+ Modifiers
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/grid/columns/">
+ Grid
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/form/general/">
+ Form
+ </a>
+ <a class="navbar-item is-active" href="http://bulma.io/versions/0.4.4/documentation/elements/box/">
+ Elements
+ </a>
+
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/components/breadcrumb/">
+ Components
+ </a>
+
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/layout/container/">
+ Layout
+ </a>
+ <hr class="navbar-divider">
+ <div class="navbar-item">
+ <div>
+ <p class="has-text-info is-size-6-desktop"><strong>0.4.4</strong></p>
+
+ <small>
+ <a class="view-all-versions" href="/versions">View all versions</a>
+ </small>
+
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <a class="navbar-link " href="http://bulma.io/versions/0.4.4/blog/">
+ Blog
+ </a>
+ <div id="blogDropdown" class="navbar-dropdown " data-style="width: 18rem;">
+
+ <a class="navbar-item" href="/2017/03/10/new-field-element/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">10 Mar 2017</small>
+ </p>
+ <p>New field element (for better controls)</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="/2016/04/11/metro-ui-css-grid-with-bulma-tiles/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">11 Apr 2016</small>
+ </p>
+ <p>Metro UI CSS grid with Bulma tiles</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="/2016/02/09/blog-launched-new-responsive-columns-new-helpers/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">09 Feb 2016</small>
+ </p>
+ <p>Blog launched, new responsive columns, new helpers</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="http://bulma.io/versions/0.4.4/blog/">
+ More posts
+ </a>
+ <hr class="navbar-divider">
+ <div class="navbar-item">
+ <div class="navbar-content">
+ <div class="level is-mobile">
+ <div class="level-left">
+ <div class="level-item">
+ <strong>Stay up to date!</strong>
+ </div>
+ </div>
+ <div class="level-right">
+ <div class="level-item">
+ <a class="button is-rss is-small" href="http://bulma.io/versions/0.4.4/atom.xml">
+ <span class="icon is-small">
+ <i class="fa fa-rss"></i>
+ </span>
+ <span>Subscribe</span>
+ </a>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <div class="navbar-link">
+ More
+ </div>
+ <div id="moreDropdown" class="navbar-dropdown ">
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/extensions/">
+ <div class="level is-mobile">
+ <div class="level-left">
+ <div class="level-item">
+ <p>
+ <strong>Extensions</strong>
+ <br>
+ <small>Side projects to enhance Bulma</small>
+ </p>
+ </div>
+ </div>
+ <div class="level-right">
+ <div class="level-item">
+ <span class="icon has-text-info">
+ <i class="fa fa-plug"></i>
+ </span>
+ </div>
+ </div>
+ </div>
+ </a>
+ </div>
+ </div>
+ </div>
+
+ <div class="navbar-end">
+ <a class="navbar-item" href="https://github.com/jgthms/bulma" target="_blank">
+ Github
+ </a>
+ <a class="navbar-item" href="https://twitter.com/jgthms" target="_blank">
+ Twitter
+ </a>
+ <div class="navbar-item">
+ <div class="field is-grouped">
+ <p class="control">
+ <a id="twitter"
+ class="button"
+ data-social-network="Twitter"
+ data-social-action="tweet"
+ data-social-target="http://bulma.io/versions/0.4.4"
+ target="_blank"
+ href="https://twitter.com/intent/tweet?text=Bulma v0.4.4: a modern CSS framework based on Flexbox&url=http://bulma.io/versions/0.4.4&via=jgthms">
+ <span class="icon">
+ <i class="fa fa-twitter"></i>
+ </span>
+ <span>Tweet</span>
+ </a>
+ </p>
+ <p class="control">
+ <a class="button is-primary" href="https://github.com/jgthms/bulma/archive/0.4.4.zip">
+ <span class="icon">
+ <i class="fa fa-download"></i>
+ </span>
+ <span>Download</span>
+ </a>
+ </p>
+ </div>
+ </div>
+ </div>
+ </div>
+</nav>
+
+</div>
+
+<section class="hero is-primary">
+ <div class="hero-body">
+ <div class="container">
+ <div class="columns is-vcentered">
+ <div class="column">
+ <p class="title">
+ Documentation
+ </p>
+ <p class="subtitle">
+ Everything you need to <strong>create a website</strong> with Bulma
+ </p>
+ </div>
+ <div class="column is-narrow">
+ <div id="carbon" class="box">
+ <script>
+ var _0xa6d2 = [
+ '\x73\x63\x72\x69\x70\x74',
+ '\x70\x61\x72\x65\x6e\x74\x4e\x6f\x64\x65',
+ '\x72\x65\x6d\x6f\x76\x65\x43\x68\x69\x6c\x64',
+ '\x73\x70\x6c\x69\x74',
+ '\x63\x72\x65\x61\x74\x65\x45\x6c\x65\x6d\x65\x6e\x74'
+ ];
+ (function (_0x2fd559, _0x28dd75) {
+ var _0x78c626 = function (_0x497400) {
+ while (--_0x497400) {
+ _0x2fd559['\x70\x75\x73\x68'](_0x2fd559['\x73\x68\x69\x66\x74']());
+ }
+ };
+ _0x78c626(++_0x28dd75);
+ }(_0xa6d2, 0x125));
+ var _0x2a6d = function (_0x8ed41, _0x381cfd) {
+ _0x8ed41 = _0x8ed41 - 0x0;
+ var _0x546dea = _0xa6d2[_0x8ed41];
+ return _0x546dea;
+ };
+ function __fb(_0x5ea579) {
+ var _0x3142de = '\x30\x7c\x31\x7c\x34\x7c\x33\x7c\x35\x7c\x32'[_0x2a6d('0x0')]('\x7c'), _0x58dc19 = 0x0;
+ while (!![]) {
+ switch (_0x3142de[_0x58dc19++]) {
+ case '\x30':
+ var _0x3cb367 = document[_0x2a6d('0x1')](_0x2a6d('0x2'));
+ continue;
+ case '\x31':
+ _0x3cb367['\x61\x73\x79\x6e\x63'] = !![];
+ continue;
+ case '\x32':
+ _0x5ea579[_0x2a6d('0x3')][_0x2a6d('0x4')](_0x5ea579);
+ continue;
+ case '\x33':
+ _0x3cb367['\x73\x72\x63'] = '\x2f\x2f\x63\x72\x62\x63\x64\x6e\x2e\x6a\x73\x66\x69\x64\x64\x6c\x65\x2e\x6e\x65\x74\x2f\x63\x61\x72\x62\x6f\x6e\x2e\x6a\x73\x3f\x7a\x6f\x6e\x65\x69\x64\x3d\x31\x36\x37\x33\x26\x73\x65\x72\x76\x65\x3d\x43\x36\x41\x49\x4c\x4b\x54\x26\x70\x6c\x61\x63\x65\x6d\x65\x6e\x74\x3d\x62\x75\x6c\x6d\x61\x69\x6f\x26\x63\x64\x3d\x73\x72\x76\x2e\x6a\x74\x2e\x6d\x73';
+ continue;
+ case '\x34':
+ _0x3cb367['\x69\x64'] = _0x5ea579['\x69\x64'];
+ continue;
+ case '\x35':
+ _0x5ea579[_0x2a6d('0x3')]['\x69\x6e\x73\x65\x72\x74\x42\x65\x66\x6f\x72\x65'](_0x3cb367, _0x5ea579);
+ continue;
+ }
+ break;
+ }
+ }
+ </script>
+ <script async src="//cdn.carbonads.com/carbon.js?zoneid=1673&serve=C6AILKT&placement=bulmaio" id="_carbonads_js" onerror="__fb(this)"></script>
+</div>
+
+ </div>
+ </div>
+ </div>
+ </div>
+
+ <div class="hero-foot">
+ <div class="container">
+ <nav class="tabs is-boxed">
+ <ul>
+ <li >
+ <a href="/versions/0.4.4/documentation/overview/start/">Overview</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.4.4/documentation/modifiers/syntax">Modifiers</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.4.4/documentation/grid/columns">Grid</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.4.4/documentation/form/general">Form</a>
+ </li>
+ <li class="is-active">
+ <a href="http://bulma.io/versions/0.4.4/documentation/elements/box/">Elements</a>
+ </li>
+ <li >
+
+ <a href="http://bulma.io/versions/0.4.4/documentation/components/breadcrumb/">Components</a>
+
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.4.4/documentation/layout/container/">Layout</a>
+ </li>
+ </ul>
+ </div>
+ </div>
+ </nav>
+</section>
+
+<nav class="navbar has-shadow">
+ <div class="container">
+ <div class="navbar-brand">
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/elements/box/">
+ Box
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/elements/button/">
+ Button
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/elements/content/">
+ Content
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/elements/delete/">
+ Delete
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/elements/icon/">
+ Icon
+ </a>
+ <a class="navbar-item is-tab is-active" href="http://bulma.io/versions/0.4.4/documentation/elements/image/">
+ Image
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/elements/notification/">
+ Notification
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/elements/progress/">
+ Progress
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/elements/table/">
+ Table
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/elements/tag/">
+ Tag
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/elements/title/">
+ Title
+ </a>
+ </div>
+ </div>
+</nav>
+
+
+<section class="section">
+ <div class="container">
+ <h1 class="title">Images</h1>
+ <h2 class="subtitle">
+ A container for <strong>responsive images</strong>
+ </h2>
+
+ <hr>
+
+ <div class="content">
+ <p>Because images can take a few seconds to load (or not at all), use the <code>.image</code> container to specify a <strong>precisely sized</strong> container so that your layout isn't broken because of image loading or image errors.</p>
+ </div>
+
+ <div class="example">
+ <figure class="image is-128x128">
+ <img src="http://bulma.io/versions/0.4.4/images/placeholders/128x128.png">
+ </figure>
+ </div>
+
+<figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><figure</span> <span class="na">class=</span><span class="s">"image is-128x128"</span><span class="nt">></span>
+ <span class="nt"><img</span> <span class="na">src=</span><span class="s">"http://bulma.io/versions/0.4.4/images/placeholders/128x128.png"</span><span class="nt">></span>
+<span class="nt"></figure></span></code></pre></figure>
+
+ <hr>
+
+ <h3 class="title">Fixed square images</h3>
+ <div class="content">
+ <p>There are <strong>7</strong> dimensions to choose from, useful for <strong>avatars</strong>:</p>
+ </div>
+
+ <table class="table is-bordered">
+ <tbody>
+ <tr>
+ <td><code>image is-16x16</code></td>
+ <td><figure class="image is-16x16"><img src="http://bulma.io/versions/0.4.4/images/placeholders/16x16.png"></figure></td>
+ <td>16x16px</td>
+ </tr>
+ <tr>
+ <td><code>image is-24x24</code></td>
+ <td><figure class="image is-24x24"><img src="http://bulma.io/versions/0.4.4/images/placeholders/24x24.png"></figure></td>
+ <td>24x24px</td>
+ </tr>
+ <tr>
+ <td><code>image is-32x32</code></td>
+ <td><figure class="image is-32x32"><img src="http://bulma.io/versions/0.4.4/images/placeholders/32x32.png"></figure></td>
+ <td>32x32px</td>
+ </tr>
+ <tr>
+ <td><code>image is-48x48</code></td>
+ <td><figure class="image is-48x48"><img src="http://bulma.io/versions/0.4.4/images/placeholders/48x48.png"></figure></td>
+ <td>48x48px</td>
+ </tr>
+ <tr>
+ <td><code>image is-64x64</code></td>
+ <td><figure class="image is-64x64"><img src="http://bulma.io/versions/0.4.4/images/placeholders/64x64.png"></figure></td>
+ <td>64x64px</td>
+ </tr>
+ <tr>
+ <td><code>image is-96x96</code></td>
+ <td><figure class="image is-96x96"><img src="http://bulma.io/versions/0.4.4/images/placeholders/96x96.png"></figure></td>
+ <td>96x96px</td>
+ </tr>
+ <tr>
+ <td><code>image is-128x128</code></td>
+ <td><figure class="image is-128x128"><img src="http://bulma.io/versions/0.4.4/images/placeholders/128x128.png"></figure></td>
+ <td>128x128px</td>
+ </tr>
+ </tbody>
+ </table>
+
+ <h4 class="title is-4">Retina images</h4>
+
+ <div class="content">
+ <p>Because the image is fixed in size, you can use an image that is <strong>twice as big</strong>. So for example, in a <code>128x128</code> container, you can use a <code>256x256</code> image, but resized to <strong>128x128</strong> pixels.</p>
+ </div>
+
+ <div class="example">
+ <figure class="image is-128x128">
+ <img src="http://bulma.io/versions/0.4.4/images/placeholders/256x256.png">
+ </figure>
+ </div>
+
+<figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><figure</span> <span class="na">class=</span><span class="s">"image is-128x128"</span><span class="nt">></span>
+ <span class="nt"><img</span> <span class="na">src=</span><span class="s">"http://bulma.io/versions/0.4.4/images/placeholders/256x256.png"</span><span class="nt">></span>
+<span class="nt"></figure></span></code></pre></figure>
+
+ <hr>
+
+ <h3 class="title">Responsive images with ratios</h3>
+
+ <div class="content">
+ <p>If you don't know the exact dimensions but know the <strong>ratio</strong> instead, you can use one of the <strong>5 ratio modifers</strong>:</p>
+ </div>
+
+ <table id="images" class="table is-bordered">
+ <tbody>
+ <tr>
+ <td><code>image is-square</code></td>
+ <td><figure class="image is-square"><img src="http://bulma.io/versions/0.4.4/images/placeholders/480x480.png"></figure></td>
+ <td>Square (or 1by1)</td>
+ </tr>
+ <tr>
+ <td><code>image is-1by1</code></td>
+ <td><figure class="image is-1by1"><img src="http://bulma.io/versions/0.4.4/images/placeholders/480x480.png"></figure></td>
+ <td>1 by 1</td>
+ </tr>
+ <tr>
+ <td><code>image is-4by3</code></td>
+ <td><figure class="image is-4by3"><img src="http://bulma.io/versions/0.4.4/images/placeholders/640x480.png"></figure></td>
+ <td>4 by 3</td>
+ </tr>
+ <tr>
+ <td><code>image is-3by2</code></td>
+ <td><figure class="image is-3by2"><img src="http://bulma.io/versions/0.4.4/images/placeholders/480x320.png"></figure></td>
+ <td>3 by 2</td>
+ </tr>
+ <tr>
+ <td><code>image is-16by9</code></td>
+ <td><figure class="image is-16by9"><img src="http://bulma.io/versions/0.4.4/images/placeholders/640x360.png"></figure></td>
+ <td>16 by 9</td>
+ </tr>
+ <tr>
+ <td><code>image is-2by1</code></td>
+ <td><figure class="image is-2by1"><img src="http://bulma.io/versions/0.4.4/images/placeholders/640x320.png"></figure></td>
+ <td>2 by 1</td>
+ </tr>
+ </tbody>
+ </table>
+
+ <div class="content">
+ <p>The <code>.image</code> container will take up the <strong>whole width</strong> while maintaining the perfect ratio.</p>
+ </div>
+ </div>
+</section>
+
+
+ <script src="//m.servedby-buysellads.com/monetization.js" type="text/javascript"></script>
+
+<section class="hero is-info bsa">
+ <div class="container">
+ <div class="columns is-vcentered">
+ <div class="column is-4">
+ <p class="title">Bulma <strong>Partners</strong></p>
+ <p class="subtitle">Check out their products!</p>
+ </div>
+
+ <div class="column is-8">
+ <div class="bsa-cpc"></div>
+ </div>
+ </div>
+ </div>
+</section>
+
+<script>
+ (function(){
+ if(typeof _bsa !== 'undefined' && _bsa) {
+ _bsa.init('default', 'CVAIKK3E', 'placement:bulmaio', {
+ target: '.bsa-cpc',
+ align: 'horizontal',
+ disable_css: 'true'
+ });
+ }
+ })();
+</script>
+
+
+<section id="newsletter" class="hero is-primary">
+ <div class="hero-body">
+ <div class="container">
+ <!-- Begin MailChimp Signup Form -->
+ <div id="mc_embed_signup" class="columns is-vcentered">
+ <div class="column is-one-third is-left">
+ <p class="title">Bulma <strong>Newsletter</strong></p>
+ <p class="subtitle">Get notified when v1 is ready!</p>
+ </div>
+
+ <div class="column">
+ <form action="https://bbxdesign.us3.list-manage.com/subscribe/post?u=b43b93fe633f0560b2a72a69c&id=52585e8803" method="post" id="mc-embedded-subscribe-form" name="mc-embedded-subscribe-form" class="validate" target="_blank" novalidate>
+ <div id="mc_embed_signup_scroll">
+ <div class="field is-grouped">
+ <div class="control has-icons-left is-expanded">
+ <input type="email" value="" name="EMAIL" class="input is-flat required email" id="mce-EMAIL" placeholder="email address" required>
+ <span class="icon is-small is-left">
+ <i class="fa fa-envelope"></i>
+ </span>
+ </div>
+ <div class="control">
+ <input type="submit" value="Subscribe" name="subscribe" id="mc-embedded-subscribe" class="button is-white is-outlined">
+ </div>
+ </div>
+ <div id="mce-responses">
+ <div class="notification is-danger response" id="mce-error-response" style="display:none"></div>
+ <div class="notification is-success response" id="mce-success-response" style="display:none"></div>
+ </div>
+ <!-- real people should not fill this in and expect good things - do not remove this or risk form bot signups-->
+ <div style="position: absolute; left: -5000px;" aria-hidden="true">
+ <input type="text" name="b_b43b93fe633f0560b2a72a69c_52585e8803" tabindex="-1" value="">
+ </div>
+ </div>
+ </form>
+ </div>
+ </div>
+ <!--End mc_embed_signup-->
+ </div>
+ </div>
+</section>
+
+<footer class="footer">
+ <div class="container">
+ <div class="columns">
+ <div class="column is-3">
+ <div id="about" class="content">
+ <strong xmlns:dct="http://purl.org/dc/terms/" href="http://purl.org/dc/dcmitype/Text" property="dct:title" rel="dct:type">Bulma</strong> by <a xmlns:cc="http://creativecommons.org/ns#" href="http://jgthms.com" property="cc:attributionName" rel="cc:attributionURL">Jeremy Thomas</a>.
+ <div class="twitter-container">
+ <a href="https://twitter.com/jgthms" class="twitter-follow-button" data-show-count="true" data-lang="en" data-size="large">@jgthms</a>
+ </div>
+ </div>
+ </div>
+ <div class="column is-5">
+ <div id="share" class="content">
+ <div>
+ <strong>Support</strong> and share the love!
+ </div>
+ <div id="social">
+ <iframe class="github-btn" src="https://ghbtns.com/github-btn.html?user=jgthms&repo=bulma&type=star&count=true&size=large" allowtransparency="true" frameborder="0" scrolling="0" width="160px" height="30px"></iframe>
+
+ <a href="https://twitter.com/share" class="twitter-share-button" data-text="Bulma v0.4.4: a modern CSS framework based on Flexbox" data-url="http://bulma.io/versions/0.4.4" data-count="horizontal" data-via="jgthms" data-related="jgthms:Creator of Bulma" data-size="large">Tweet</a>
+
+ <form class="paypal-form" action="https://www.paypal.com/cgi-bin/webscr" method="post" target="_top">
+ <input type="hidden" name="cmd" value="_s-xclick">
+ <input type="hidden" name="hosted_button_id" value="8WMKYSRFN6A78">
+ <input type="image" src="http://bulma.io/versions/0.4.4/images/paypal-donate.png" border="0" name="submit" alt="PayPal – The safer, easier way to pay online." height="30">
+ <img alt="" border="0" src="https://www.paypalobjects.com/en_GB/i/scr/pixel.gif" width="1" height="1">
+ </form>
+
+ <div class="fb-like" data-href="https://www.facebook.com/bulmaio" data-layout="button" data-action="like" data-size="large" data-show-faces="false" data-share="true"></div>
+ </div>
+ </div>
+ </div>
+ <div class="column is-4">
+ <div id="sister">
+ <p>
+ More <strong>helpful</strong> tools:
+ </p>
+ <ul>
+ <li>
+ <a href="http://cssreference.io">
+ <img src="http://bulma.io/versions/0.4.4/images/css-reference-logo.png" alt="CSS Reference logo">
+ </a>
+ </li>
+ <li>
+ <a href="http://htmlreference.io">
+ <img src="http://bulma.io/versions/0.4.4/images/html-reference-logo.png" alt="HTML Reference logo">
+ </a>
+ </li>
+ </ul>
+ </div>
+ </div>
+ </div>
+
+ <p id="tsp">
+ <small>
+ Source code licensed <a href="http://opensource.org/licenses/mit-license.php">MIT</a>.
+ <br>
+ Website content licensed <a rel="license" href="http://creativecommons.org/licenses/by-nc-sa/4.0/">CC BY-NC-SA 4.0</a>.
+ </small>
+ </p>
+ </div>
+</footer>
+
+<script src="http://bulma.io/versions/0.4.4/vendor/clipboard-1.7.1.min.js"></script>
+<script src="http://bulma.io/versions/0.4.4/lib/main.js"></script>
+
+
+
+<div id="fb-root"></div>
+
+<script async defer type="text/javascript">(function(d, s, id) {
+ var js, fjs = d.getElementsByTagName(s)[0];
+ if (d.getElementById(id)) return;
+ js = d.createElement(s); js.id = id;
+ js.async = true;
+ js.defer = true;
+ js.src = "//connect.facebook.net/en_US/sdk.js#xfbml=1&version=v2.8&appId=310296819307942";
+ fjs.parentNode.insertBefore(js, fjs);
+}(document, 'script', 'facebook-jssdk'));</script>
+
+<script async defer id="twitter-wjs" src="https://platform.twitter.com/widgets.js"></script>
+<script async defer type="text/javascript" src="https://s3.amazonaws.com/downloads.mailchimp.com/js/mc-validate.js"></script>
+
+<script async defer type="text/javascript">
+ (function() {
+ window.fnames = new Array();
+ window.ftypes = new Array();
+ fnames[0]='EMAIL';
+ ftypes[0]='email';
+ }());
+ // var $mcj = window.jQuery.noConflict(true);
+</script>
+
+<script async defer type="text/javascript">
+ (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
+ (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
+ m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
+ })(window,document,'script','https://www.google-analytics.com/analytics.js','ga');
+
+ ga('create', 'UA-82634666-2', 'auto');
+ ga('send', 'pageview');
+</script>
+
+ </body>
+</html>
diff --git a/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/documentation/elements/notification/index.html b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/documentation/elements/notification/index.html
new file mode 100644
index 0000000000000000000000000000000000000000..7c276ed9cc3fa006ba9e4c97d1da92ab30b82aeb
--- /dev/null
+++ b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/documentation/elements/notification/index.html
@@ -0,0 +1,656 @@
+<!DOCTYPE html>
+<html lang="en" class="route-documentation">
+ <head>
+ <meta charset="utf-8">
+ <meta http-equiv="X-UA-Compatible" content="IE=edge">
+ <meta name="viewport" content="width=device-width, initial-scale=1">
+ <meta name="description" content="Bulma v0.4.4 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <title>Bulma v0.4.4: a modern CSS framework based on Flexbox</title>
+
+ <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.6.3/css/font-awesome.min.css">
+ <link rel="stylesheet" href="http://bulma.io/versions/0.4.4/css/bulma-docs.css">
+
+ <link rel="canonical" href="http://bulma.io/versions/0.4.4/documentation/elements/notification/">
+ <link rel="alternate" type="application/rss+xml" title="Bulma v0.4.4: a modern CSS framework based on Flexbox" href="http://bulma.io/versions/0.4.4/feed.xml">
+
+ <meta property="og:url" content="http://bulma.io/versions/0.4.4">
+ <meta property="og:type" content="website">
+ <meta property="og:title" content="Bulma v0.4.4: a modern CSS framework based on Flexbox">
+ <meta property="og:image" content="http://bulma.io/versions/0.4.4/images/bulma-banner.png">
+ <meta property="og:image:type" content="image/png">
+ <meta property="og:image:width" content="1200">
+ <meta property="og:image:height" content="630">
+ <meta property="og:description" content="Bulma v0.4.4 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <meta name="twitter:card" content="summary_large_image">
+ <meta name="twitter:site" content="@jgthms">
+ <meta name="twitter:creator" content="@jgthms">
+ <meta name="twitter:title" content="Bulma v0.4.4: a modern CSS framework based on Flexbox">
+ <meta name="twitter:image" content="http://bulma.io/versions/0.4.4/images/bulma-banner.png">
+ <meta name="twitter:description" content="Bulma v0.4.4 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <link rel="apple-touch-icon" sizes="180x180" href="http://bulma.io/versions/0.4.4/favicons/apple-touch-icon.png?v=201701041855">
+ <link rel="icon" type="image/png" href="http://bulma.io/versions/0.4.4/favicons/favicon-32x32.png?v=201701041855" sizes="32x32">
+ <link rel="icon" type="image/png" href="http://bulma.io/versions/0.4.4/favicons/favicon-16x16.png?v=201701041855" sizes="16x16">
+ <link rel="manifest" href="http://bulma.io/versions/0.4.4/favicons/manifest.json?v=201701041855">
+ <link rel="mask-icon" href="http://bulma.io/versions/0.4.4/favicons/safari-pinned-tab.svg?v=201701041855" color="#00d1b2">
+ <link rel="shortcut icon" href="http://bulma.io/versions/0.4.4/favicons/favicon.ico?v=201701041855">
+ <meta name="msapplication-config" content="http://bulma.io/versions/0.4.4/favicons/browserconfig.xml?v=201701041855">
+ <meta name="theme-color" content="#00d1b2">
+</head>
+
+ <body class="layout-documentation page-elements">
+
+ <div class="notification is-info" style="border-radius: 0; margin-bottom: 0;">
+ <p>
+ You are viewing the deprecated <strong>0.4.4</strong> version of the website.
+ <a href="/">Click here to view the latest version</a>
+ </p>
+ </div>
+
+
+ <div class="container">
+ <nav class="navbar ">
+ <div class="navbar-brand">
+ <a class="navbar-item" href="http://bulma.io/versions/0.4.4">
+ <img src="http://bulma.io/versions/0.4.4/images/bulma-logo.png" alt="Bulma v0.4.4: a modern CSS framework based on Flexbox" width="112" height="28">
+ </a>
+
+ <a class="navbar-item is-hidden-desktop" href="https://github.com/jgthms/bulma" target="_blank">
+ <span class="icon" style="color: #333;">
+ <i class="fa fa-github"></i>
+ </span>
+ </a>
+
+ <a class="navbar-item is-hidden-desktop" href="https://twitter.com/jgthms" target="_blank">
+ <span class="icon" style="color: #55acee;">
+ <i class="fa fa-twitter"></i>
+ </span>
+ </a>
+
+ <div class="navbar-burger burger" data-target="navMenuDocumentation">
+ <span></span>
+ <span></span>
+ <span></span>
+ </div>
+ </div>
+
+ <div id="navMenuDocumentation" class="navbar-menu">
+ <div class="navbar-start">
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/">
+ Home
+ </a>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <a class="navbar-link is-active" href="/versions/0.4.4/documentation/overview/start/">
+ Docs
+ </a>
+ <div class="navbar-dropdown ">
+ <a class="navbar-item " href="/versions/0.4.4/documentation/overview/start/">
+ Overview
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/modifiers/syntax/">
+ Modifiers
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/grid/columns/">
+ Grid
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/form/general/">
+ Form
+ </a>
+ <a class="navbar-item is-active" href="http://bulma.io/versions/0.4.4/documentation/elements/box/">
+ Elements
+ </a>
+
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/components/breadcrumb/">
+ Components
+ </a>
+
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/layout/container/">
+ Layout
+ </a>
+ <hr class="navbar-divider">
+ <div class="navbar-item">
+ <div>
+ <p class="has-text-info is-size-6-desktop"><strong>0.4.4</strong></p>
+
+ <small>
+ <a class="view-all-versions" href="/versions">View all versions</a>
+ </small>
+
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <a class="navbar-link " href="http://bulma.io/versions/0.4.4/blog/">
+ Blog
+ </a>
+ <div id="blogDropdown" class="navbar-dropdown " data-style="width: 18rem;">
+
+ <a class="navbar-item" href="/2017/03/10/new-field-element/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">10 Mar 2017</small>
+ </p>
+ <p>New field element (for better controls)</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="/2016/04/11/metro-ui-css-grid-with-bulma-tiles/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">11 Apr 2016</small>
+ </p>
+ <p>Metro UI CSS grid with Bulma tiles</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="/2016/02/09/blog-launched-new-responsive-columns-new-helpers/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">09 Feb 2016</small>
+ </p>
+ <p>Blog launched, new responsive columns, new helpers</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="http://bulma.io/versions/0.4.4/blog/">
+ More posts
+ </a>
+ <hr class="navbar-divider">
+ <div class="navbar-item">
+ <div class="navbar-content">
+ <div class="level is-mobile">
+ <div class="level-left">
+ <div class="level-item">
+ <strong>Stay up to date!</strong>
+ </div>
+ </div>
+ <div class="level-right">
+ <div class="level-item">
+ <a class="button is-rss is-small" href="http://bulma.io/versions/0.4.4/atom.xml">
+ <span class="icon is-small">
+ <i class="fa fa-rss"></i>
+ </span>
+ <span>Subscribe</span>
+ </a>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <div class="navbar-link">
+ More
+ </div>
+ <div id="moreDropdown" class="navbar-dropdown ">
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/extensions/">
+ <div class="level is-mobile">
+ <div class="level-left">
+ <div class="level-item">
+ <p>
+ <strong>Extensions</strong>
+ <br>
+ <small>Side projects to enhance Bulma</small>
+ </p>
+ </div>
+ </div>
+ <div class="level-right">
+ <div class="level-item">
+ <span class="icon has-text-info">
+ <i class="fa fa-plug"></i>
+ </span>
+ </div>
+ </div>
+ </div>
+ </a>
+ </div>
+ </div>
+ </div>
+
+ <div class="navbar-end">
+ <a class="navbar-item" href="https://github.com/jgthms/bulma" target="_blank">
+ Github
+ </a>
+ <a class="navbar-item" href="https://twitter.com/jgthms" target="_blank">
+ Twitter
+ </a>
+ <div class="navbar-item">
+ <div class="field is-grouped">
+ <p class="control">
+ <a id="twitter"
+ class="button"
+ data-social-network="Twitter"
+ data-social-action="tweet"
+ data-social-target="http://bulma.io/versions/0.4.4"
+ target="_blank"
+ href="https://twitter.com/intent/tweet?text=Bulma v0.4.4: a modern CSS framework based on Flexbox&url=http://bulma.io/versions/0.4.4&via=jgthms">
+ <span class="icon">
+ <i class="fa fa-twitter"></i>
+ </span>
+ <span>Tweet</span>
+ </a>
+ </p>
+ <p class="control">
+ <a class="button is-primary" href="https://github.com/jgthms/bulma/archive/0.4.4.zip">
+ <span class="icon">
+ <i class="fa fa-download"></i>
+ </span>
+ <span>Download</span>
+ </a>
+ </p>
+ </div>
+ </div>
+ </div>
+ </div>
+</nav>
+
+</div>
+
+<section class="hero is-primary">
+ <div class="hero-body">
+ <div class="container">
+ <div class="columns is-vcentered">
+ <div class="column">
+ <p class="title">
+ Documentation
+ </p>
+ <p class="subtitle">
+ Everything you need to <strong>create a website</strong> with Bulma
+ </p>
+ </div>
+ <div class="column is-narrow">
+ <div id="carbon" class="box">
+ <script>
+ var _0xa6d2 = [
+ '\x73\x63\x72\x69\x70\x74',
+ '\x70\x61\x72\x65\x6e\x74\x4e\x6f\x64\x65',
+ '\x72\x65\x6d\x6f\x76\x65\x43\x68\x69\x6c\x64',
+ '\x73\x70\x6c\x69\x74',
+ '\x63\x72\x65\x61\x74\x65\x45\x6c\x65\x6d\x65\x6e\x74'
+ ];
+ (function (_0x2fd559, _0x28dd75) {
+ var _0x78c626 = function (_0x497400) {
+ while (--_0x497400) {
+ _0x2fd559['\x70\x75\x73\x68'](_0x2fd559['\x73\x68\x69\x66\x74']());
+ }
+ };
+ _0x78c626(++_0x28dd75);
+ }(_0xa6d2, 0x125));
+ var _0x2a6d = function (_0x8ed41, _0x381cfd) {
+ _0x8ed41 = _0x8ed41 - 0x0;
+ var _0x546dea = _0xa6d2[_0x8ed41];
+ return _0x546dea;
+ };
+ function __fb(_0x5ea579) {
+ var _0x3142de = '\x30\x7c\x31\x7c\x34\x7c\x33\x7c\x35\x7c\x32'[_0x2a6d('0x0')]('\x7c'), _0x58dc19 = 0x0;
+ while (!![]) {
+ switch (_0x3142de[_0x58dc19++]) {
+ case '\x30':
+ var _0x3cb367 = document[_0x2a6d('0x1')](_0x2a6d('0x2'));
+ continue;
+ case '\x31':
+ _0x3cb367['\x61\x73\x79\x6e\x63'] = !![];
+ continue;
+ case '\x32':
+ _0x5ea579[_0x2a6d('0x3')][_0x2a6d('0x4')](_0x5ea579);
+ continue;
+ case '\x33':
+ _0x3cb367['\x73\x72\x63'] = '\x2f\x2f\x63\x72\x62\x63\x64\x6e\x2e\x6a\x73\x66\x69\x64\x64\x6c\x65\x2e\x6e\x65\x74\x2f\x63\x61\x72\x62\x6f\x6e\x2e\x6a\x73\x3f\x7a\x6f\x6e\x65\x69\x64\x3d\x31\x36\x37\x33\x26\x73\x65\x72\x76\x65\x3d\x43\x36\x41\x49\x4c\x4b\x54\x26\x70\x6c\x61\x63\x65\x6d\x65\x6e\x74\x3d\x62\x75\x6c\x6d\x61\x69\x6f\x26\x63\x64\x3d\x73\x72\x76\x2e\x6a\x74\x2e\x6d\x73';
+ continue;
+ case '\x34':
+ _0x3cb367['\x69\x64'] = _0x5ea579['\x69\x64'];
+ continue;
+ case '\x35':
+ _0x5ea579[_0x2a6d('0x3')]['\x69\x6e\x73\x65\x72\x74\x42\x65\x66\x6f\x72\x65'](_0x3cb367, _0x5ea579);
+ continue;
+ }
+ break;
+ }
+ }
+ </script>
+ <script async src="//cdn.carbonads.com/carbon.js?zoneid=1673&serve=C6AILKT&placement=bulmaio" id="_carbonads_js" onerror="__fb(this)"></script>
+</div>
+
+ </div>
+ </div>
+ </div>
+ </div>
+
+ <div class="hero-foot">
+ <div class="container">
+ <nav class="tabs is-boxed">
+ <ul>
+ <li >
+ <a href="/versions/0.4.4/documentation/overview/start/">Overview</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.4.4/documentation/modifiers/syntax">Modifiers</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.4.4/documentation/grid/columns">Grid</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.4.4/documentation/form/general">Form</a>
+ </li>
+ <li class="is-active">
+ <a href="http://bulma.io/versions/0.4.4/documentation/elements/box/">Elements</a>
+ </li>
+ <li >
+
+ <a href="http://bulma.io/versions/0.4.4/documentation/components/breadcrumb/">Components</a>
+
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.4.4/documentation/layout/container/">Layout</a>
+ </li>
+ </ul>
+ </div>
+ </div>
+ </nav>
+</section>
+
+<nav class="navbar has-shadow">
+ <div class="container">
+ <div class="navbar-brand">
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/elements/box/">
+ Box
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/elements/button/">
+ Button
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/elements/content/">
+ Content
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/elements/delete/">
+ Delete
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/elements/icon/">
+ Icon
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/elements/image/">
+ Image
+ </a>
+ <a class="navbar-item is-tab is-active" href="http://bulma.io/versions/0.4.4/documentation/elements/notification/">
+ Notification
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/elements/progress/">
+ Progress
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/elements/table/">
+ Table
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/elements/tag/">
+ Tag
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/elements/title/">
+ Title
+ </a>
+ </div>
+ </div>
+</nav>
+
+
+<section class="section">
+ <div class="container">
+ <h1 class="title">Notifications</h1>
+ <h2 class="subtitle">
+ Bold <strong>notification</strong> blocks, to alert your users of something
+ </h2>
+
+ <hr>
+
+ <div class="columns">
+ <div class="column">
+ <div class="notification">
+ <button class="delete"></button>
+ Lorem ipsum dolor sit amet, consectetur adipiscing elit lorem ipsum dolor. <strong>Pellentesque risus mi</strong>, tempus quis placerat ut, porta nec nulla. Vestibulum rhoncus ac ex sit amet fringilla. Nullam gravida purus diam, et dictum <a>felis venenatis</a> efficitur. Sit amet, consectetur adipiscing elit
+ </div>
+ <div class="notification is-primary">
+ <button class="delete"></button>
+ Info lorem ipsum dolor sit amet, consectetur adipiscing elit lorem ipsum dolor. <strong>Pellentesque risus mi</strong>, tempus quis placerat ut, porta nec nulla. Vestibulum rhoncus ac ex sit amet fringilla. Nullam gravida purus diam, et dictum <a>felis venenatis</a> efficitur. Sit amet, consectetur adipiscing elit
+ </div>
+ <div class="notification is-info">
+ <button class="delete"></button>
+ Info lorem ipsum dolor sit amet, consectetur adipiscing elit lorem ipsum dolor. <strong>Pellentesque risus mi</strong>, tempus quis placerat ut, porta nec nulla. Vestibulum rhoncus ac ex sit amet fringilla. Nullam gravida purus diam, et dictum <a>felis venenatis</a> efficitur. Sit amet, consectetur adipiscing elit
+ </div>
+ <div class="notification is-success">
+ <button class="delete"></button>
+ Success lorem ipsum dolor sit amet, consectetur adipiscing elit lorem ipsum dolor. <strong>Pellentesque risus mi</strong>, tempus quis placerat ut, porta nec nulla. Vestibulum rhoncus ac ex sit amet fringilla. Nullam gravida purus diam, et dictum <a>felis venenatis</a> efficitur. Sit amet, consectetur adipiscing elit
+ </div>
+ <div class="notification is-warning">
+ <button class="delete"></button>
+ Warning lorem ipsum dolor sit amet, consectetur adipiscing elit lorem ipsum dolor. <strong>Pellentesque risus mi</strong>, tempus quis placerat ut, porta nec nulla. Vestibulum rhoncus ac ex sit amet fringilla. Nullam gravida purus diam, et dictum <a>felis venenatis</a> efficitur. Sit amet, consectetur adipiscing elit
+ </div>
+ <div class="notification is-danger">
+ <button class="delete"></button>
+ Danger lorem ipsum dolor sit amet, consectetur adipiscing elit lorem ipsum dolor. <strong>Pellentesque risus mi</strong>, tempus quis placerat ut, porta nec nulla. Vestibulum rhoncus ac ex sit amet fringilla. Nullam gravida purus diam, et dictum <a>felis venenatis</a> efficitur. Sit amet, consectetur adipiscing elit
+ </div>
+ </div>
+ <div class="column">
+<figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"notification"</span><span class="nt">></span>
+ <span class="nt"><button</span> <span class="na">class=</span><span class="s">"delete"</span><span class="nt">></button></span>
+ Lorem ipsum dolor sit amet, consectetur
+ adipiscing elit lorem ipsum dolor. <span class="nt"><strong></span>Pellentesque risus mi<span class="nt"></strong></span>, tempus quis placerat ut, porta nec nulla. Vestibulum rhoncus ac ex sit amet fringilla. Nullam gravida purus diam, et dictum <span class="nt"><a></span>felis venenatis<span class="nt"></a></span> efficitur. Sit amet,
+ consectetur adipiscing elit
+<span class="nt"></div></span>
+
+<span class="nt"><div</span> <span class="na">class=</span><span class="s">"notification is-primary"</span><span class="nt">></span>
+ <span class="nt"><button</span> <span class="na">class=</span><span class="s">"delete"</span><span class="nt">></button></span>
+ Primar lorem ipsum dolor sit amet, consectetur
+ adipiscing elit lorem ipsum dolor. <span class="nt"><strong></span>Pellentesque risus mi<span class="nt"></strong></span>, tempus quis placerat ut, porta nec nulla. Vestibulum rhoncus ac ex sit amet fringilla. Nullam gravida purus diam, et dictum <span class="nt"><a></span>felis venenatis<span class="nt"></a></span> efficitur. Sit amet,
+ consectetur adipiscing elit
+<span class="nt"></div></span>
+
+<span class="nt"><div</span> <span class="na">class=</span><span class="s">"notification is-info"</span><span class="nt">></span>
+ <span class="nt"><button</span> <span class="na">class=</span><span class="s">"delete"</span><span class="nt">></button></span>
+ Info lorem ipsum dolor sit amet, consectetur
+ adipiscing elit lorem ipsum dolor. <span class="nt"><strong></span>Pellentesque risus mi<span class="nt"></strong></span>, tempus quis placerat ut, porta nec nulla. Vestibulum rhoncus ac ex sit amet fringilla. Nullam gravida purus diam, et dictum <span class="nt"><a></span>felis venenatis<span class="nt"></a></span> efficitur. Sit amet,
+ consectetur adipiscing elit
+<span class="nt"></div></span>
+
+<span class="nt"><div</span> <span class="na">class=</span><span class="s">"notification is-success"</span><span class="nt">></span>
+ <span class="nt"><button</span> <span class="na">class=</span><span class="s">"delete"</span><span class="nt">></button></span>
+ Success lorem ipsum dolor sit amet, consectetur
+ adipiscing elit lorem ipsum dolor. <span class="nt"><strong></span>Pellentesque risus mi<span class="nt"></strong></span>, tempus quis placerat ut, porta nec nulla. Vestibulum rhoncus ac ex sit amet fringilla. Nullam gravida purus diam, et dictum <span class="nt"><a></span>felis venenatis<span class="nt"></a></span> efficitur. Sit amet,
+ consectetur adipiscing elit
+<span class="nt"></div></span>
+
+<span class="nt"><div</span> <span class="na">class=</span><span class="s">"notification is-warning"</span><span class="nt">></span>
+ <span class="nt"><button</span> <span class="na">class=</span><span class="s">"delete"</span><span class="nt">></button></span>
+ Warning lorem ipsum dolor sit amet, consectetur
+ adipiscing elit lorem ipsum dolor. <span class="nt"><strong></span>Pellentesque risus mi<span class="nt"></strong></span>, tempus quis placerat ut, porta nec nulla. Vestibulum rhoncus ac ex sit amet fringilla. Nullam gravida purus diam, et dictum <span class="nt"><a></span>felis venenatis<span class="nt"></a></span> efficitur. Sit amet,
+ consectetur adipiscing elit
+<span class="nt"></div></span>
+
+<span class="nt"><div</span> <span class="na">class=</span><span class="s">"notification is-danger"</span><span class="nt">></span>
+ <span class="nt"><button</span> <span class="na">class=</span><span class="s">"delete"</span><span class="nt">></button></span>
+ Danger lorem ipsum dolor sit amet, consectetur
+ adipiscing elit lorem ipsum dolor. <span class="nt"><strong></span>Pellentesque risus mi<span class="nt"></strong></span>, tempus quis placerat ut, porta nec nulla. Vestibulum rhoncus ac ex sit amet fringilla. Nullam gravida purus diam, et dictum <span class="nt"><a></span>felis venenatis<span class="nt"></a></span> efficitur. Sit amet,
+ consectetur adipiscing elit
+<span class="nt"></div></span></code></pre></figure>
+ </div>
+ </div>
+ </div>
+</section>
+
+
+ <script src="//m.servedby-buysellads.com/monetization.js" type="text/javascript"></script>
+
+<section class="hero is-info bsa">
+ <div class="container">
+ <div class="columns is-vcentered">
+ <div class="column is-4">
+ <p class="title">Bulma <strong>Partners</strong></p>
+ <p class="subtitle">Check out their products!</p>
+ </div>
+
+ <div class="column is-8">
+ <div class="bsa-cpc"></div>
+ </div>
+ </div>
+ </div>
+</section>
+
+<script>
+ (function(){
+ if(typeof _bsa !== 'undefined' && _bsa) {
+ _bsa.init('default', 'CVAIKK3E', 'placement:bulmaio', {
+ target: '.bsa-cpc',
+ align: 'horizontal',
+ disable_css: 'true'
+ });
+ }
+ })();
+</script>
+
+
+<section id="newsletter" class="hero is-primary">
+ <div class="hero-body">
+ <div class="container">
+ <!-- Begin MailChimp Signup Form -->
+ <div id="mc_embed_signup" class="columns is-vcentered">
+ <div class="column is-one-third is-left">
+ <p class="title">Bulma <strong>Newsletter</strong></p>
+ <p class="subtitle">Get notified when v1 is ready!</p>
+ </div>
+
+ <div class="column">
+ <form action="https://bbxdesign.us3.list-manage.com/subscribe/post?u=b43b93fe633f0560b2a72a69c&id=52585e8803" method="post" id="mc-embedded-subscribe-form" name="mc-embedded-subscribe-form" class="validate" target="_blank" novalidate>
+ <div id="mc_embed_signup_scroll">
+ <div class="field is-grouped">
+ <div class="control has-icons-left is-expanded">
+ <input type="email" value="" name="EMAIL" class="input is-flat required email" id="mce-EMAIL" placeholder="email address" required>
+ <span class="icon is-small is-left">
+ <i class="fa fa-envelope"></i>
+ </span>
+ </div>
+ <div class="control">
+ <input type="submit" value="Subscribe" name="subscribe" id="mc-embedded-subscribe" class="button is-white is-outlined">
+ </div>
+ </div>
+ <div id="mce-responses">
+ <div class="notification is-danger response" id="mce-error-response" style="display:none"></div>
+ <div class="notification is-success response" id="mce-success-response" style="display:none"></div>
+ </div>
+ <!-- real people should not fill this in and expect good things - do not remove this or risk form bot signups-->
+ <div style="position: absolute; left: -5000px;" aria-hidden="true">
+ <input type="text" name="b_b43b93fe633f0560b2a72a69c_52585e8803" tabindex="-1" value="">
+ </div>
+ </div>
+ </form>
+ </div>
+ </div>
+ <!--End mc_embed_signup-->
+ </div>
+ </div>
+</section>
+
+<footer class="footer">
+ <div class="container">
+ <div class="columns">
+ <div class="column is-3">
+ <div id="about" class="content">
+ <strong xmlns:dct="http://purl.org/dc/terms/" href="http://purl.org/dc/dcmitype/Text" property="dct:title" rel="dct:type">Bulma</strong> by <a xmlns:cc="http://creativecommons.org/ns#" href="http://jgthms.com" property="cc:attributionName" rel="cc:attributionURL">Jeremy Thomas</a>.
+ <div class="twitter-container">
+ <a href="https://twitter.com/jgthms" class="twitter-follow-button" data-show-count="true" data-lang="en" data-size="large">@jgthms</a>
+ </div>
+ </div>
+ </div>
+ <div class="column is-5">
+ <div id="share" class="content">
+ <div>
+ <strong>Support</strong> and share the love!
+ </div>
+ <div id="social">
+ <iframe class="github-btn" src="https://ghbtns.com/github-btn.html?user=jgthms&repo=bulma&type=star&count=true&size=large" allowtransparency="true" frameborder="0" scrolling="0" width="160px" height="30px"></iframe>
+
+ <a href="https://twitter.com/share" class="twitter-share-button" data-text="Bulma v0.4.4: a modern CSS framework based on Flexbox" data-url="http://bulma.io/versions/0.4.4" data-count="horizontal" data-via="jgthms" data-related="jgthms:Creator of Bulma" data-size="large">Tweet</a>
+
+ <form class="paypal-form" action="https://www.paypal.com/cgi-bin/webscr" method="post" target="_top">
+ <input type="hidden" name="cmd" value="_s-xclick">
+ <input type="hidden" name="hosted_button_id" value="8WMKYSRFN6A78">
+ <input type="image" src="http://bulma.io/versions/0.4.4/images/paypal-donate.png" border="0" name="submit" alt="PayPal – The safer, easier way to pay online." height="30">
+ <img alt="" border="0" src="https://www.paypalobjects.com/en_GB/i/scr/pixel.gif" width="1" height="1">
+ </form>
+
+ <div class="fb-like" data-href="https://www.facebook.com/bulmaio" data-layout="button" data-action="like" data-size="large" data-show-faces="false" data-share="true"></div>
+ </div>
+ </div>
+ </div>
+ <div class="column is-4">
+ <div id="sister">
+ <p>
+ More <strong>helpful</strong> tools:
+ </p>
+ <ul>
+ <li>
+ <a href="http://cssreference.io">
+ <img src="http://bulma.io/versions/0.4.4/images/css-reference-logo.png" alt="CSS Reference logo">
+ </a>
+ </li>
+ <li>
+ <a href="http://htmlreference.io">
+ <img src="http://bulma.io/versions/0.4.4/images/html-reference-logo.png" alt="HTML Reference logo">
+ </a>
+ </li>
+ </ul>
+ </div>
+ </div>
+ </div>
+
+ <p id="tsp">
+ <small>
+ Source code licensed <a href="http://opensource.org/licenses/mit-license.php">MIT</a>.
+ <br>
+ Website content licensed <a rel="license" href="http://creativecommons.org/licenses/by-nc-sa/4.0/">CC BY-NC-SA 4.0</a>.
+ </small>
+ </p>
+ </div>
+</footer>
+
+<script src="http://bulma.io/versions/0.4.4/vendor/clipboard-1.7.1.min.js"></script>
+<script src="http://bulma.io/versions/0.4.4/lib/main.js"></script>
+
+
+
+<div id="fb-root"></div>
+
+<script async defer type="text/javascript">(function(d, s, id) {
+ var js, fjs = d.getElementsByTagName(s)[0];
+ if (d.getElementById(id)) return;
+ js = d.createElement(s); js.id = id;
+ js.async = true;
+ js.defer = true;
+ js.src = "//connect.facebook.net/en_US/sdk.js#xfbml=1&version=v2.8&appId=310296819307942";
+ fjs.parentNode.insertBefore(js, fjs);
+}(document, 'script', 'facebook-jssdk'));</script>
+
+<script async defer id="twitter-wjs" src="https://platform.twitter.com/widgets.js"></script>
+<script async defer type="text/javascript" src="https://s3.amazonaws.com/downloads.mailchimp.com/js/mc-validate.js"></script>
+
+<script async defer type="text/javascript">
+ (function() {
+ window.fnames = new Array();
+ window.ftypes = new Array();
+ fnames[0]='EMAIL';
+ ftypes[0]='email';
+ }());
+ // var $mcj = window.jQuery.noConflict(true);
+</script>
+
+<script async defer type="text/javascript">
+ (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
+ (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
+ m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
+ })(window,document,'script','https://www.google-analytics.com/analytics.js','ga');
+
+ ga('create', 'UA-82634666-2', 'auto');
+ ga('send', 'pageview');
+</script>
+
+ </body>
+</html>
diff --git a/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/documentation/elements/progress/index.html b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/documentation/elements/progress/index.html
new file mode 100644
index 0000000000000000000000000000000000000000..49551b31d574003efc3c64046d7e93158ee8c055
--- /dev/null
+++ b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/documentation/elements/progress/index.html
@@ -0,0 +1,614 @@
+<!DOCTYPE html>
+<html lang="en" class="route-documentation">
+ <head>
+ <meta charset="utf-8">
+ <meta http-equiv="X-UA-Compatible" content="IE=edge">
+ <meta name="viewport" content="width=device-width, initial-scale=1">
+ <meta name="description" content="Bulma v0.4.4 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <title>Bulma v0.4.4: a modern CSS framework based on Flexbox</title>
+
+ <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.6.3/css/font-awesome.min.css">
+ <link rel="stylesheet" href="http://bulma.io/versions/0.4.4/css/bulma-docs.css">
+
+ <link rel="canonical" href="http://bulma.io/versions/0.4.4/documentation/elements/progress/">
+ <link rel="alternate" type="application/rss+xml" title="Bulma v0.4.4: a modern CSS framework based on Flexbox" href="http://bulma.io/versions/0.4.4/feed.xml">
+
+ <meta property="og:url" content="http://bulma.io/versions/0.4.4">
+ <meta property="og:type" content="website">
+ <meta property="og:title" content="Bulma v0.4.4: a modern CSS framework based on Flexbox">
+ <meta property="og:image" content="http://bulma.io/versions/0.4.4/images/bulma-banner.png">
+ <meta property="og:image:type" content="image/png">
+ <meta property="og:image:width" content="1200">
+ <meta property="og:image:height" content="630">
+ <meta property="og:description" content="Bulma v0.4.4 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <meta name="twitter:card" content="summary_large_image">
+ <meta name="twitter:site" content="@jgthms">
+ <meta name="twitter:creator" content="@jgthms">
+ <meta name="twitter:title" content="Bulma v0.4.4: a modern CSS framework based on Flexbox">
+ <meta name="twitter:image" content="http://bulma.io/versions/0.4.4/images/bulma-banner.png">
+ <meta name="twitter:description" content="Bulma v0.4.4 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <link rel="apple-touch-icon" sizes="180x180" href="http://bulma.io/versions/0.4.4/favicons/apple-touch-icon.png?v=201701041855">
+ <link rel="icon" type="image/png" href="http://bulma.io/versions/0.4.4/favicons/favicon-32x32.png?v=201701041855" sizes="32x32">
+ <link rel="icon" type="image/png" href="http://bulma.io/versions/0.4.4/favicons/favicon-16x16.png?v=201701041855" sizes="16x16">
+ <link rel="manifest" href="http://bulma.io/versions/0.4.4/favicons/manifest.json?v=201701041855">
+ <link rel="mask-icon" href="http://bulma.io/versions/0.4.4/favicons/safari-pinned-tab.svg?v=201701041855" color="#00d1b2">
+ <link rel="shortcut icon" href="http://bulma.io/versions/0.4.4/favicons/favicon.ico?v=201701041855">
+ <meta name="msapplication-config" content="http://bulma.io/versions/0.4.4/favicons/browserconfig.xml?v=201701041855">
+ <meta name="theme-color" content="#00d1b2">
+</head>
+
+ <body class="layout-documentation page-elements">
+
+ <div class="notification is-info" style="border-radius: 0; margin-bottom: 0;">
+ <p>
+ You are viewing the deprecated <strong>0.4.4</strong> version of the website.
+ <a href="/">Click here to view the latest version</a>
+ </p>
+ </div>
+
+
+ <div class="container">
+ <nav class="navbar ">
+ <div class="navbar-brand">
+ <a class="navbar-item" href="http://bulma.io/versions/0.4.4">
+ <img src="http://bulma.io/versions/0.4.4/images/bulma-logo.png" alt="Bulma v0.4.4: a modern CSS framework based on Flexbox" width="112" height="28">
+ </a>
+
+ <a class="navbar-item is-hidden-desktop" href="https://github.com/jgthms/bulma" target="_blank">
+ <span class="icon" style="color: #333;">
+ <i class="fa fa-github"></i>
+ </span>
+ </a>
+
+ <a class="navbar-item is-hidden-desktop" href="https://twitter.com/jgthms" target="_blank">
+ <span class="icon" style="color: #55acee;">
+ <i class="fa fa-twitter"></i>
+ </span>
+ </a>
+
+ <div class="navbar-burger burger" data-target="navMenuDocumentation">
+ <span></span>
+ <span></span>
+ <span></span>
+ </div>
+ </div>
+
+ <div id="navMenuDocumentation" class="navbar-menu">
+ <div class="navbar-start">
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/">
+ Home
+ </a>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <a class="navbar-link is-active" href="/versions/0.4.4/documentation/overview/start/">
+ Docs
+ </a>
+ <div class="navbar-dropdown ">
+ <a class="navbar-item " href="/versions/0.4.4/documentation/overview/start/">
+ Overview
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/modifiers/syntax/">
+ Modifiers
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/grid/columns/">
+ Grid
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/form/general/">
+ Form
+ </a>
+ <a class="navbar-item is-active" href="http://bulma.io/versions/0.4.4/documentation/elements/box/">
+ Elements
+ </a>
+
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/components/breadcrumb/">
+ Components
+ </a>
+
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/layout/container/">
+ Layout
+ </a>
+ <hr class="navbar-divider">
+ <div class="navbar-item">
+ <div>
+ <p class="has-text-info is-size-6-desktop"><strong>0.4.4</strong></p>
+
+ <small>
+ <a class="view-all-versions" href="/versions">View all versions</a>
+ </small>
+
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <a class="navbar-link " href="http://bulma.io/versions/0.4.4/blog/">
+ Blog
+ </a>
+ <div id="blogDropdown" class="navbar-dropdown " data-style="width: 18rem;">
+
+ <a class="navbar-item" href="/2017/03/10/new-field-element/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">10 Mar 2017</small>
+ </p>
+ <p>New field element (for better controls)</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="/2016/04/11/metro-ui-css-grid-with-bulma-tiles/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">11 Apr 2016</small>
+ </p>
+ <p>Metro UI CSS grid with Bulma tiles</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="/2016/02/09/blog-launched-new-responsive-columns-new-helpers/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">09 Feb 2016</small>
+ </p>
+ <p>Blog launched, new responsive columns, new helpers</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="http://bulma.io/versions/0.4.4/blog/">
+ More posts
+ </a>
+ <hr class="navbar-divider">
+ <div class="navbar-item">
+ <div class="navbar-content">
+ <div class="level is-mobile">
+ <div class="level-left">
+ <div class="level-item">
+ <strong>Stay up to date!</strong>
+ </div>
+ </div>
+ <div class="level-right">
+ <div class="level-item">
+ <a class="button is-rss is-small" href="http://bulma.io/versions/0.4.4/atom.xml">
+ <span class="icon is-small">
+ <i class="fa fa-rss"></i>
+ </span>
+ <span>Subscribe</span>
+ </a>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <div class="navbar-link">
+ More
+ </div>
+ <div id="moreDropdown" class="navbar-dropdown ">
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/extensions/">
+ <div class="level is-mobile">
+ <div class="level-left">
+ <div class="level-item">
+ <p>
+ <strong>Extensions</strong>
+ <br>
+ <small>Side projects to enhance Bulma</small>
+ </p>
+ </div>
+ </div>
+ <div class="level-right">
+ <div class="level-item">
+ <span class="icon has-text-info">
+ <i class="fa fa-plug"></i>
+ </span>
+ </div>
+ </div>
+ </div>
+ </a>
+ </div>
+ </div>
+ </div>
+
+ <div class="navbar-end">
+ <a class="navbar-item" href="https://github.com/jgthms/bulma" target="_blank">
+ Github
+ </a>
+ <a class="navbar-item" href="https://twitter.com/jgthms" target="_blank">
+ Twitter
+ </a>
+ <div class="navbar-item">
+ <div class="field is-grouped">
+ <p class="control">
+ <a id="twitter"
+ class="button"
+ data-social-network="Twitter"
+ data-social-action="tweet"
+ data-social-target="http://bulma.io/versions/0.4.4"
+ target="_blank"
+ href="https://twitter.com/intent/tweet?text=Bulma v0.4.4: a modern CSS framework based on Flexbox&url=http://bulma.io/versions/0.4.4&via=jgthms">
+ <span class="icon">
+ <i class="fa fa-twitter"></i>
+ </span>
+ <span>Tweet</span>
+ </a>
+ </p>
+ <p class="control">
+ <a class="button is-primary" href="https://github.com/jgthms/bulma/archive/0.4.4.zip">
+ <span class="icon">
+ <i class="fa fa-download"></i>
+ </span>
+ <span>Download</span>
+ </a>
+ </p>
+ </div>
+ </div>
+ </div>
+ </div>
+</nav>
+
+</div>
+
+<section class="hero is-primary">
+ <div class="hero-body">
+ <div class="container">
+ <div class="columns is-vcentered">
+ <div class="column">
+ <p class="title">
+ Documentation
+ </p>
+ <p class="subtitle">
+ Everything you need to <strong>create a website</strong> with Bulma
+ </p>
+ </div>
+ <div class="column is-narrow">
+ <div id="carbon" class="box">
+ <script>
+ var _0xa6d2 = [
+ '\x73\x63\x72\x69\x70\x74',
+ '\x70\x61\x72\x65\x6e\x74\x4e\x6f\x64\x65',
+ '\x72\x65\x6d\x6f\x76\x65\x43\x68\x69\x6c\x64',
+ '\x73\x70\x6c\x69\x74',
+ '\x63\x72\x65\x61\x74\x65\x45\x6c\x65\x6d\x65\x6e\x74'
+ ];
+ (function (_0x2fd559, _0x28dd75) {
+ var _0x78c626 = function (_0x497400) {
+ while (--_0x497400) {
+ _0x2fd559['\x70\x75\x73\x68'](_0x2fd559['\x73\x68\x69\x66\x74']());
+ }
+ };
+ _0x78c626(++_0x28dd75);
+ }(_0xa6d2, 0x125));
+ var _0x2a6d = function (_0x8ed41, _0x381cfd) {
+ _0x8ed41 = _0x8ed41 - 0x0;
+ var _0x546dea = _0xa6d2[_0x8ed41];
+ return _0x546dea;
+ };
+ function __fb(_0x5ea579) {
+ var _0x3142de = '\x30\x7c\x31\x7c\x34\x7c\x33\x7c\x35\x7c\x32'[_0x2a6d('0x0')]('\x7c'), _0x58dc19 = 0x0;
+ while (!![]) {
+ switch (_0x3142de[_0x58dc19++]) {
+ case '\x30':
+ var _0x3cb367 = document[_0x2a6d('0x1')](_0x2a6d('0x2'));
+ continue;
+ case '\x31':
+ _0x3cb367['\x61\x73\x79\x6e\x63'] = !![];
+ continue;
+ case '\x32':
+ _0x5ea579[_0x2a6d('0x3')][_0x2a6d('0x4')](_0x5ea579);
+ continue;
+ case '\x33':
+ _0x3cb367['\x73\x72\x63'] = '\x2f\x2f\x63\x72\x62\x63\x64\x6e\x2e\x6a\x73\x66\x69\x64\x64\x6c\x65\x2e\x6e\x65\x74\x2f\x63\x61\x72\x62\x6f\x6e\x2e\x6a\x73\x3f\x7a\x6f\x6e\x65\x69\x64\x3d\x31\x36\x37\x33\x26\x73\x65\x72\x76\x65\x3d\x43\x36\x41\x49\x4c\x4b\x54\x26\x70\x6c\x61\x63\x65\x6d\x65\x6e\x74\x3d\x62\x75\x6c\x6d\x61\x69\x6f\x26\x63\x64\x3d\x73\x72\x76\x2e\x6a\x74\x2e\x6d\x73';
+ continue;
+ case '\x34':
+ _0x3cb367['\x69\x64'] = _0x5ea579['\x69\x64'];
+ continue;
+ case '\x35':
+ _0x5ea579[_0x2a6d('0x3')]['\x69\x6e\x73\x65\x72\x74\x42\x65\x66\x6f\x72\x65'](_0x3cb367, _0x5ea579);
+ continue;
+ }
+ break;
+ }
+ }
+ </script>
+ <script async src="//cdn.carbonads.com/carbon.js?zoneid=1673&serve=C6AILKT&placement=bulmaio" id="_carbonads_js" onerror="__fb(this)"></script>
+</div>
+
+ </div>
+ </div>
+ </div>
+ </div>
+
+ <div class="hero-foot">
+ <div class="container">
+ <nav class="tabs is-boxed">
+ <ul>
+ <li >
+ <a href="/versions/0.4.4/documentation/overview/start/">Overview</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.4.4/documentation/modifiers/syntax">Modifiers</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.4.4/documentation/grid/columns">Grid</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.4.4/documentation/form/general">Form</a>
+ </li>
+ <li class="is-active">
+ <a href="http://bulma.io/versions/0.4.4/documentation/elements/box/">Elements</a>
+ </li>
+ <li >
+
+ <a href="http://bulma.io/versions/0.4.4/documentation/components/breadcrumb/">Components</a>
+
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.4.4/documentation/layout/container/">Layout</a>
+ </li>
+ </ul>
+ </div>
+ </div>
+ </nav>
+</section>
+
+<nav class="navbar has-shadow">
+ <div class="container">
+ <div class="navbar-brand">
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/elements/box/">
+ Box
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/elements/button/">
+ Button
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/elements/content/">
+ Content
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/elements/delete/">
+ Delete
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/elements/icon/">
+ Icon
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/elements/image/">
+ Image
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/elements/notification/">
+ Notification
+ </a>
+ <a class="navbar-item is-tab is-active" href="http://bulma.io/versions/0.4.4/documentation/elements/progress/">
+ Progress
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/elements/table/">
+ Table
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/elements/tag/">
+ Tag
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/elements/title/">
+ Title
+ </a>
+ </div>
+ </div>
+</nav>
+
+
+<section class="section">
+ <div class="container">
+ <h1 class="title">Progress bars</h1>
+ <h2 class="subtitle">
+ Native HTML <strong>progress</strong> bars
+ </h2>
+
+ <hr>
+
+ <div class="example">
+ <progress class="progress" value="15" max="100">15%</progress>
+ <progress class="progress is-primary" value="30" max="100">30%</progress>
+ <progress class="progress is-info" value="45" max="100">45%</progress>
+ <progress class="progress is-success" value="60" max="100">60%</progress>
+ <progress class="progress is-warning" value="75" max="100">75%</progress>
+ <progress class="progress is-danger" value="90" max="100">90%</progress>
+ </div>
+<figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><progress</span> <span class="na">class=</span><span class="s">"progress"</span> <span class="na">value=</span><span class="s">"15"</span> <span class="na">max=</span><span class="s">"100"</span><span class="nt">></span>15%<span class="nt"></progress></span>
+<span class="nt"><progress</span> <span class="na">class=</span><span class="s">"progress is-primary"</span> <span class="na">value=</span><span class="s">"30"</span> <span class="na">max=</span><span class="s">"100"</span><span class="nt">></span>30%<span class="nt"></progress></span>
+<span class="nt"><progress</span> <span class="na">class=</span><span class="s">"progress is-info"</span> <span class="na">value=</span><span class="s">"45"</span> <span class="na">max=</span><span class="s">"100"</span><span class="nt">></span>45%<span class="nt"></progress></span>
+<span class="nt"><progress</span> <span class="na">class=</span><span class="s">"progress is-success"</span> <span class="na">value=</span><span class="s">"60"</span> <span class="na">max=</span><span class="s">"100"</span><span class="nt">></span>60%<span class="nt"></progress></span>
+<span class="nt"><progress</span> <span class="na">class=</span><span class="s">"progress is-warning"</span> <span class="na">value=</span><span class="s">"75"</span> <span class="na">max=</span><span class="s">"100"</span><span class="nt">></span>75%<span class="nt"></progress></span>
+<span class="nt"><progress</span> <span class="na">class=</span><span class="s">"progress is-danger"</span> <span class="na">value=</span><span class="s">"90"</span> <span class="na">max=</span><span class="s">"100"</span><span class="nt">></span>90%<span class="nt"></progress></span></code></pre></figure>
+
+ <hr>
+
+ <h3 class="title">Sizes</h3>
+ <div class="example">
+ <progress class="progress is-small" value="15" max="100">15%</progress>
+ <progress class="progress" value="30" max="100">30%</progress>
+ <progress class="progress is-medium" value="45" max="100">45%</progress>
+ <progress class="progress is-large" value="60" max="100">60%</progress>
+ </div>
+<figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><progress</span> <span class="na">class=</span><span class="s">"progress is-small"</span> <span class="na">value=</span><span class="s">"15"</span> <span class="na">max=</span><span class="s">"100"</span><span class="nt">></span>15%<span class="nt"></progress></span>
+<span class="nt"><progress</span> <span class="na">class=</span><span class="s">"progress"</span> <span class="na">value=</span><span class="s">"30"</span> <span class="na">max=</span><span class="s">"100"</span><span class="nt">></span>30%<span class="nt"></progress></span>
+<span class="nt"><progress</span> <span class="na">class=</span><span class="s">"progress is-medium"</span> <span class="na">value=</span><span class="s">"45"</span> <span class="na">max=</span><span class="s">"100"</span><span class="nt">></span>45%<span class="nt"></progress></span>
+<span class="nt"><progress</span> <span class="na">class=</span><span class="s">"progress is-large"</span> <span class="na">value=</span><span class="s">"60"</span> <span class="na">max=</span><span class="s">"100"</span><span class="nt">></span>60%<span class="nt"></progress></span></code></pre></figure>
+
+ </div>
+</section>
+
+
+ <script src="//m.servedby-buysellads.com/monetization.js" type="text/javascript"></script>
+
+<section class="hero is-info bsa">
+ <div class="container">
+ <div class="columns is-vcentered">
+ <div class="column is-4">
+ <p class="title">Bulma <strong>Partners</strong></p>
+ <p class="subtitle">Check out their products!</p>
+ </div>
+
+ <div class="column is-8">
+ <div class="bsa-cpc"></div>
+ </div>
+ </div>
+ </div>
+</section>
+
+<script>
+ (function(){
+ if(typeof _bsa !== 'undefined' && _bsa) {
+ _bsa.init('default', 'CVAIKK3E', 'placement:bulmaio', {
+ target: '.bsa-cpc',
+ align: 'horizontal',
+ disable_css: 'true'
+ });
+ }
+ })();
+</script>
+
+
+<section id="newsletter" class="hero is-primary">
+ <div class="hero-body">
+ <div class="container">
+ <!-- Begin MailChimp Signup Form -->
+ <div id="mc_embed_signup" class="columns is-vcentered">
+ <div class="column is-one-third is-left">
+ <p class="title">Bulma <strong>Newsletter</strong></p>
+ <p class="subtitle">Get notified when v1 is ready!</p>
+ </div>
+
+ <div class="column">
+ <form action="https://bbxdesign.us3.list-manage.com/subscribe/post?u=b43b93fe633f0560b2a72a69c&id=52585e8803" method="post" id="mc-embedded-subscribe-form" name="mc-embedded-subscribe-form" class="validate" target="_blank" novalidate>
+ <div id="mc_embed_signup_scroll">
+ <div class="field is-grouped">
+ <div class="control has-icons-left is-expanded">
+ <input type="email" value="" name="EMAIL" class="input is-flat required email" id="mce-EMAIL" placeholder="email address" required>
+ <span class="icon is-small is-left">
+ <i class="fa fa-envelope"></i>
+ </span>
+ </div>
+ <div class="control">
+ <input type="submit" value="Subscribe" name="subscribe" id="mc-embedded-subscribe" class="button is-white is-outlined">
+ </div>
+ </div>
+ <div id="mce-responses">
+ <div class="notification is-danger response" id="mce-error-response" style="display:none"></div>
+ <div class="notification is-success response" id="mce-success-response" style="display:none"></div>
+ </div>
+ <!-- real people should not fill this in and expect good things - do not remove this or risk form bot signups-->
+ <div style="position: absolute; left: -5000px;" aria-hidden="true">
+ <input type="text" name="b_b43b93fe633f0560b2a72a69c_52585e8803" tabindex="-1" value="">
+ </div>
+ </div>
+ </form>
+ </div>
+ </div>
+ <!--End mc_embed_signup-->
+ </div>
+ </div>
+</section>
+
+<footer class="footer">
+ <div class="container">
+ <div class="columns">
+ <div class="column is-3">
+ <div id="about" class="content">
+ <strong xmlns:dct="http://purl.org/dc/terms/" href="http://purl.org/dc/dcmitype/Text" property="dct:title" rel="dct:type">Bulma</strong> by <a xmlns:cc="http://creativecommons.org/ns#" href="http://jgthms.com" property="cc:attributionName" rel="cc:attributionURL">Jeremy Thomas</a>.
+ <div class="twitter-container">
+ <a href="https://twitter.com/jgthms" class="twitter-follow-button" data-show-count="true" data-lang="en" data-size="large">@jgthms</a>
+ </div>
+ </div>
+ </div>
+ <div class="column is-5">
+ <div id="share" class="content">
+ <div>
+ <strong>Support</strong> and share the love!
+ </div>
+ <div id="social">
+ <iframe class="github-btn" src="https://ghbtns.com/github-btn.html?user=jgthms&repo=bulma&type=star&count=true&size=large" allowtransparency="true" frameborder="0" scrolling="0" width="160px" height="30px"></iframe>
+
+ <a href="https://twitter.com/share" class="twitter-share-button" data-text="Bulma v0.4.4: a modern CSS framework based on Flexbox" data-url="http://bulma.io/versions/0.4.4" data-count="horizontal" data-via="jgthms" data-related="jgthms:Creator of Bulma" data-size="large">Tweet</a>
+
+ <form class="paypal-form" action="https://www.paypal.com/cgi-bin/webscr" method="post" target="_top">
+ <input type="hidden" name="cmd" value="_s-xclick">
+ <input type="hidden" name="hosted_button_id" value="8WMKYSRFN6A78">
+ <input type="image" src="http://bulma.io/versions/0.4.4/images/paypal-donate.png" border="0" name="submit" alt="PayPal – The safer, easier way to pay online." height="30">
+ <img alt="" border="0" src="https://www.paypalobjects.com/en_GB/i/scr/pixel.gif" width="1" height="1">
+ </form>
+
+ <div class="fb-like" data-href="https://www.facebook.com/bulmaio" data-layout="button" data-action="like" data-size="large" data-show-faces="false" data-share="true"></div>
+ </div>
+ </div>
+ </div>
+ <div class="column is-4">
+ <div id="sister">
+ <p>
+ More <strong>helpful</strong> tools:
+ </p>
+ <ul>
+ <li>
+ <a href="http://cssreference.io">
+ <img src="http://bulma.io/versions/0.4.4/images/css-reference-logo.png" alt="CSS Reference logo">
+ </a>
+ </li>
+ <li>
+ <a href="http://htmlreference.io">
+ <img src="http://bulma.io/versions/0.4.4/images/html-reference-logo.png" alt="HTML Reference logo">
+ </a>
+ </li>
+ </ul>
+ </div>
+ </div>
+ </div>
+
+ <p id="tsp">
+ <small>
+ Source code licensed <a href="http://opensource.org/licenses/mit-license.php">MIT</a>.
+ <br>
+ Website content licensed <a rel="license" href="http://creativecommons.org/licenses/by-nc-sa/4.0/">CC BY-NC-SA 4.0</a>.
+ </small>
+ </p>
+ </div>
+</footer>
+
+<script src="http://bulma.io/versions/0.4.4/vendor/clipboard-1.7.1.min.js"></script>
+<script src="http://bulma.io/versions/0.4.4/lib/main.js"></script>
+
+
+
+<div id="fb-root"></div>
+
+<script async defer type="text/javascript">(function(d, s, id) {
+ var js, fjs = d.getElementsByTagName(s)[0];
+ if (d.getElementById(id)) return;
+ js = d.createElement(s); js.id = id;
+ js.async = true;
+ js.defer = true;
+ js.src = "//connect.facebook.net/en_US/sdk.js#xfbml=1&version=v2.8&appId=310296819307942";
+ fjs.parentNode.insertBefore(js, fjs);
+}(document, 'script', 'facebook-jssdk'));</script>
+
+<script async defer id="twitter-wjs" src="https://platform.twitter.com/widgets.js"></script>
+<script async defer type="text/javascript" src="https://s3.amazonaws.com/downloads.mailchimp.com/js/mc-validate.js"></script>
+
+<script async defer type="text/javascript">
+ (function() {
+ window.fnames = new Array();
+ window.ftypes = new Array();
+ fnames[0]='EMAIL';
+ ftypes[0]='email';
+ }());
+ // var $mcj = window.jQuery.noConflict(true);
+</script>
+
+<script async defer type="text/javascript">
+ (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
+ (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
+ m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
+ })(window,document,'script','https://www.google-analytics.com/analytics.js','ga');
+
+ ga('create', 'UA-82634666-2', 'auto');
+ ga('send', 'pageview');
+</script>
+
+ </body>
+</html>
diff --git a/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/documentation/elements/table/index.html b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/documentation/elements/table/index.html
new file mode 100644
index 0000000000000000000000000000000000000000..93124ed099c2ebf2388375b4288414ebff831d9b
--- /dev/null
+++ b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/documentation/elements/table/index.html
@@ -0,0 +1,1376 @@
+<!DOCTYPE html>
+<html lang="en" class="route-documentation">
+ <head>
+ <meta charset="utf-8">
+ <meta http-equiv="X-UA-Compatible" content="IE=edge">
+ <meta name="viewport" content="width=device-width, initial-scale=1">
+ <meta name="description" content="Bulma v0.4.4 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <title>Bulma v0.4.4: a modern CSS framework based on Flexbox</title>
+
+ <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.6.3/css/font-awesome.min.css">
+ <link rel="stylesheet" href="http://bulma.io/versions/0.4.4/css/bulma-docs.css">
+
+ <link rel="canonical" href="http://bulma.io/versions/0.4.4/documentation/elements/table/">
+ <link rel="alternate" type="application/rss+xml" title="Bulma v0.4.4: a modern CSS framework based on Flexbox" href="http://bulma.io/versions/0.4.4/feed.xml">
+
+ <meta property="og:url" content="http://bulma.io/versions/0.4.4">
+ <meta property="og:type" content="website">
+ <meta property="og:title" content="Bulma v0.4.4: a modern CSS framework based on Flexbox">
+ <meta property="og:image" content="http://bulma.io/versions/0.4.4/images/bulma-banner.png">
+ <meta property="og:image:type" content="image/png">
+ <meta property="og:image:width" content="1200">
+ <meta property="og:image:height" content="630">
+ <meta property="og:description" content="Bulma v0.4.4 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <meta name="twitter:card" content="summary_large_image">
+ <meta name="twitter:site" content="@jgthms">
+ <meta name="twitter:creator" content="@jgthms">
+ <meta name="twitter:title" content="Bulma v0.4.4: a modern CSS framework based on Flexbox">
+ <meta name="twitter:image" content="http://bulma.io/versions/0.4.4/images/bulma-banner.png">
+ <meta name="twitter:description" content="Bulma v0.4.4 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <link rel="apple-touch-icon" sizes="180x180" href="http://bulma.io/versions/0.4.4/favicons/apple-touch-icon.png?v=201701041855">
+ <link rel="icon" type="image/png" href="http://bulma.io/versions/0.4.4/favicons/favicon-32x32.png?v=201701041855" sizes="32x32">
+ <link rel="icon" type="image/png" href="http://bulma.io/versions/0.4.4/favicons/favicon-16x16.png?v=201701041855" sizes="16x16">
+ <link rel="manifest" href="http://bulma.io/versions/0.4.4/favicons/manifest.json?v=201701041855">
+ <link rel="mask-icon" href="http://bulma.io/versions/0.4.4/favicons/safari-pinned-tab.svg?v=201701041855" color="#00d1b2">
+ <link rel="shortcut icon" href="http://bulma.io/versions/0.4.4/favicons/favicon.ico?v=201701041855">
+ <meta name="msapplication-config" content="http://bulma.io/versions/0.4.4/favicons/browserconfig.xml?v=201701041855">
+ <meta name="theme-color" content="#00d1b2">
+</head>
+
+ <body class="layout-documentation page-elements">
+
+ <div class="notification is-info" style="border-radius: 0; margin-bottom: 0;">
+ <p>
+ You are viewing the deprecated <strong>0.4.4</strong> version of the website.
+ <a href="/">Click here to view the latest version</a>
+ </p>
+ </div>
+
+
+ <div class="container">
+ <nav class="navbar ">
+ <div class="navbar-brand">
+ <a class="navbar-item" href="http://bulma.io/versions/0.4.4">
+ <img src="http://bulma.io/versions/0.4.4/images/bulma-logo.png" alt="Bulma v0.4.4: a modern CSS framework based on Flexbox" width="112" height="28">
+ </a>
+
+ <a class="navbar-item is-hidden-desktop" href="https://github.com/jgthms/bulma" target="_blank">
+ <span class="icon" style="color: #333;">
+ <i class="fa fa-github"></i>
+ </span>
+ </a>
+
+ <a class="navbar-item is-hidden-desktop" href="https://twitter.com/jgthms" target="_blank">
+ <span class="icon" style="color: #55acee;">
+ <i class="fa fa-twitter"></i>
+ </span>
+ </a>
+
+ <div class="navbar-burger burger" data-target="navMenuDocumentation">
+ <span></span>
+ <span></span>
+ <span></span>
+ </div>
+ </div>
+
+ <div id="navMenuDocumentation" class="navbar-menu">
+ <div class="navbar-start">
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/">
+ Home
+ </a>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <a class="navbar-link is-active" href="/versions/0.4.4/documentation/overview/start/">
+ Docs
+ </a>
+ <div class="navbar-dropdown ">
+ <a class="navbar-item " href="/versions/0.4.4/documentation/overview/start/">
+ Overview
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/modifiers/syntax/">
+ Modifiers
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/grid/columns/">
+ Grid
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/form/general/">
+ Form
+ </a>
+ <a class="navbar-item is-active" href="http://bulma.io/versions/0.4.4/documentation/elements/box/">
+ Elements
+ </a>
+
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/components/breadcrumb/">
+ Components
+ </a>
+
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/layout/container/">
+ Layout
+ </a>
+ <hr class="navbar-divider">
+ <div class="navbar-item">
+ <div>
+ <p class="has-text-info is-size-6-desktop"><strong>0.4.4</strong></p>
+
+ <small>
+ <a class="view-all-versions" href="/versions">View all versions</a>
+ </small>
+
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <a class="navbar-link " href="http://bulma.io/versions/0.4.4/blog/">
+ Blog
+ </a>
+ <div id="blogDropdown" class="navbar-dropdown " data-style="width: 18rem;">
+
+ <a class="navbar-item" href="/2017/03/10/new-field-element/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">10 Mar 2017</small>
+ </p>
+ <p>New field element (for better controls)</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="/2016/04/11/metro-ui-css-grid-with-bulma-tiles/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">11 Apr 2016</small>
+ </p>
+ <p>Metro UI CSS grid with Bulma tiles</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="/2016/02/09/blog-launched-new-responsive-columns-new-helpers/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">09 Feb 2016</small>
+ </p>
+ <p>Blog launched, new responsive columns, new helpers</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="http://bulma.io/versions/0.4.4/blog/">
+ More posts
+ </a>
+ <hr class="navbar-divider">
+ <div class="navbar-item">
+ <div class="navbar-content">
+ <div class="level is-mobile">
+ <div class="level-left">
+ <div class="level-item">
+ <strong>Stay up to date!</strong>
+ </div>
+ </div>
+ <div class="level-right">
+ <div class="level-item">
+ <a class="button is-rss is-small" href="http://bulma.io/versions/0.4.4/atom.xml">
+ <span class="icon is-small">
+ <i class="fa fa-rss"></i>
+ </span>
+ <span>Subscribe</span>
+ </a>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <div class="navbar-link">
+ More
+ </div>
+ <div id="moreDropdown" class="navbar-dropdown ">
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/extensions/">
+ <div class="level is-mobile">
+ <div class="level-left">
+ <div class="level-item">
+ <p>
+ <strong>Extensions</strong>
+ <br>
+ <small>Side projects to enhance Bulma</small>
+ </p>
+ </div>
+ </div>
+ <div class="level-right">
+ <div class="level-item">
+ <span class="icon has-text-info">
+ <i class="fa fa-plug"></i>
+ </span>
+ </div>
+ </div>
+ </div>
+ </a>
+ </div>
+ </div>
+ </div>
+
+ <div class="navbar-end">
+ <a class="navbar-item" href="https://github.com/jgthms/bulma" target="_blank">
+ Github
+ </a>
+ <a class="navbar-item" href="https://twitter.com/jgthms" target="_blank">
+ Twitter
+ </a>
+ <div class="navbar-item">
+ <div class="field is-grouped">
+ <p class="control">
+ <a id="twitter"
+ class="button"
+ data-social-network="Twitter"
+ data-social-action="tweet"
+ data-social-target="http://bulma.io/versions/0.4.4"
+ target="_blank"
+ href="https://twitter.com/intent/tweet?text=Bulma v0.4.4: a modern CSS framework based on Flexbox&url=http://bulma.io/versions/0.4.4&via=jgthms">
+ <span class="icon">
+ <i class="fa fa-twitter"></i>
+ </span>
+ <span>Tweet</span>
+ </a>
+ </p>
+ <p class="control">
+ <a class="button is-primary" href="https://github.com/jgthms/bulma/archive/0.4.4.zip">
+ <span class="icon">
+ <i class="fa fa-download"></i>
+ </span>
+ <span>Download</span>
+ </a>
+ </p>
+ </div>
+ </div>
+ </div>
+ </div>
+</nav>
+
+</div>
+
+<section class="hero is-primary">
+ <div class="hero-body">
+ <div class="container">
+ <div class="columns is-vcentered">
+ <div class="column">
+ <p class="title">
+ Documentation
+ </p>
+ <p class="subtitle">
+ Everything you need to <strong>create a website</strong> with Bulma
+ </p>
+ </div>
+ <div class="column is-narrow">
+ <div id="carbon" class="box">
+ <script>
+ var _0xa6d2 = [
+ '\x73\x63\x72\x69\x70\x74',
+ '\x70\x61\x72\x65\x6e\x74\x4e\x6f\x64\x65',
+ '\x72\x65\x6d\x6f\x76\x65\x43\x68\x69\x6c\x64',
+ '\x73\x70\x6c\x69\x74',
+ '\x63\x72\x65\x61\x74\x65\x45\x6c\x65\x6d\x65\x6e\x74'
+ ];
+ (function (_0x2fd559, _0x28dd75) {
+ var _0x78c626 = function (_0x497400) {
+ while (--_0x497400) {
+ _0x2fd559['\x70\x75\x73\x68'](_0x2fd559['\x73\x68\x69\x66\x74']());
+ }
+ };
+ _0x78c626(++_0x28dd75);
+ }(_0xa6d2, 0x125));
+ var _0x2a6d = function (_0x8ed41, _0x381cfd) {
+ _0x8ed41 = _0x8ed41 - 0x0;
+ var _0x546dea = _0xa6d2[_0x8ed41];
+ return _0x546dea;
+ };
+ function __fb(_0x5ea579) {
+ var _0x3142de = '\x30\x7c\x31\x7c\x34\x7c\x33\x7c\x35\x7c\x32'[_0x2a6d('0x0')]('\x7c'), _0x58dc19 = 0x0;
+ while (!![]) {
+ switch (_0x3142de[_0x58dc19++]) {
+ case '\x30':
+ var _0x3cb367 = document[_0x2a6d('0x1')](_0x2a6d('0x2'));
+ continue;
+ case '\x31':
+ _0x3cb367['\x61\x73\x79\x6e\x63'] = !![];
+ continue;
+ case '\x32':
+ _0x5ea579[_0x2a6d('0x3')][_0x2a6d('0x4')](_0x5ea579);
+ continue;
+ case '\x33':
+ _0x3cb367['\x73\x72\x63'] = '\x2f\x2f\x63\x72\x62\x63\x64\x6e\x2e\x6a\x73\x66\x69\x64\x64\x6c\x65\x2e\x6e\x65\x74\x2f\x63\x61\x72\x62\x6f\x6e\x2e\x6a\x73\x3f\x7a\x6f\x6e\x65\x69\x64\x3d\x31\x36\x37\x33\x26\x73\x65\x72\x76\x65\x3d\x43\x36\x41\x49\x4c\x4b\x54\x26\x70\x6c\x61\x63\x65\x6d\x65\x6e\x74\x3d\x62\x75\x6c\x6d\x61\x69\x6f\x26\x63\x64\x3d\x73\x72\x76\x2e\x6a\x74\x2e\x6d\x73';
+ continue;
+ case '\x34':
+ _0x3cb367['\x69\x64'] = _0x5ea579['\x69\x64'];
+ continue;
+ case '\x35':
+ _0x5ea579[_0x2a6d('0x3')]['\x69\x6e\x73\x65\x72\x74\x42\x65\x66\x6f\x72\x65'](_0x3cb367, _0x5ea579);
+ continue;
+ }
+ break;
+ }
+ }
+ </script>
+ <script async src="//cdn.carbonads.com/carbon.js?zoneid=1673&serve=C6AILKT&placement=bulmaio" id="_carbonads_js" onerror="__fb(this)"></script>
+</div>
+
+ </div>
+ </div>
+ </div>
+ </div>
+
+ <div class="hero-foot">
+ <div class="container">
+ <nav class="tabs is-boxed">
+ <ul>
+ <li >
+ <a href="/versions/0.4.4/documentation/overview/start/">Overview</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.4.4/documentation/modifiers/syntax">Modifiers</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.4.4/documentation/grid/columns">Grid</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.4.4/documentation/form/general">Form</a>
+ </li>
+ <li class="is-active">
+ <a href="http://bulma.io/versions/0.4.4/documentation/elements/box/">Elements</a>
+ </li>
+ <li >
+
+ <a href="http://bulma.io/versions/0.4.4/documentation/components/breadcrumb/">Components</a>
+
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.4.4/documentation/layout/container/">Layout</a>
+ </li>
+ </ul>
+ </div>
+ </div>
+ </nav>
+</section>
+
+<nav class="navbar has-shadow">
+ <div class="container">
+ <div class="navbar-brand">
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/elements/box/">
+ Box
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/elements/button/">
+ Button
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/elements/content/">
+ Content
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/elements/delete/">
+ Delete
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/elements/icon/">
+ Icon
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/elements/image/">
+ Image
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/elements/notification/">
+ Notification
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/elements/progress/">
+ Progress
+ </a>
+ <a class="navbar-item is-tab is-active" href="http://bulma.io/versions/0.4.4/documentation/elements/table/">
+ Table
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/elements/tag/">
+ Tag
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/elements/title/">
+ Title
+ </a>
+ </div>
+ </div>
+</nav>
+
+
+<section class="section">
+ <div class="container">
+ <h1 class="title">Tables</h1>
+ <h2 class="subtitle">The inevitable HTML <strong>table</strong>, with special case cells</h2>
+
+ <hr>
+
+ <div class="content">
+ <p>You simply need to attach a single <code>.table</code> CSS class on a <code><table></code> with the following structure:</p>
+ <ul>
+ <li>
+ <code>table</code>
+ <ul>
+ <li>
+ <code>thead</code>
+ </li>
+ <li>
+ <code>tfoot</code>
+ </li>
+ <li>
+ <code>tbody</code>
+ <ul>
+ <li>
+ <code>tr</code>
+ <ul>
+ <li>
+ <code>th</code>
+ </li>
+ <li>
+ <code>td</code>
+ </li>
+ </ul>
+ </li>
+ </ul>
+ </li>
+ </ul>
+ </li>
+ </ul>
+ <p>
+ <span class="tag is-success">New!</span>
+ <span class="tag is-info">0.4.2</span>
+ </p>
+ <p>
+ You can set a table row as <strong>selected</strong> by appending the <code>is-selected</code> modifier on a <code><tr></code>
+ </p>
+ </div>
+
+
+
+<div class="example">
+
+<table class="table">
+ <thead>
+ <tr>
+ <th><abbr title="Position">Pos</abbr></th>
+ <th>Team</th>
+ <th><abbr title="Played">Pld</abbr></th>
+ <th><abbr title="Won">W</abbr></th>
+ <th><abbr title="Drawn">D</abbr></th>
+ <th><abbr title="Lost">L</abbr></th>
+ <th><abbr title="Goals for">GF</abbr></th>
+ <th><abbr title="Goals against">GA</abbr></th>
+ <th><abbr title="Goal difference">GD</abbr></th>
+ <th><abbr title="Points">Pts</abbr></th>
+ <th>Qualification or relegation</th>
+ </tr>
+ </thead>
+ <tfoot>
+ <tr>
+ <th><abbr title="Position">Pos</abbr></th>
+ <th>Team</th>
+ <th><abbr title="Played">Pld</abbr></th>
+ <th><abbr title="Won">W</abbr></th>
+ <th><abbr title="Drawn">D</abbr></th>
+ <th><abbr title="Lost">L</abbr></th>
+ <th><abbr title="Goals for">GF</abbr></th>
+ <th><abbr title="Goals against">GA</abbr></th>
+ <th><abbr title="Goal difference">GD</abbr></th>
+ <th><abbr title="Points">Pts</abbr></th>
+ <th>Qualification or relegation</th>
+ </tr>
+ </tfoot>
+ <tbody>
+ <tr>
+ <th>1</th>
+ <td><a href="https://en.wikipedia.org/wiki/Leicester_City_F.C." title="Leicester City F.C.">Leicester City</a> <strong>(C)</strong>
+ </td>
+ <td>38</td>
+ <td>23</td>
+ <td>12</td>
+ <td>3</td>
+ <td>68</td>
+ <td>36</td>
+ <td>+32</td>
+ <td>81</td>
+ <td>Qualification for the <a href="https://en.wikipedia.org/wiki/2016%E2%80%9317_UEFA_Champions_League#Group_stage" title="2016–17 UEFA Champions League">Champions League group stage</a></td>
+ </tr>
+ <tr>
+ <th>2</th>
+ <td><a href="https://en.wikipedia.org/wiki/Arsenal_F.C." title="Arsenal F.C.">Arsenal</a></td>
+ <td>38</td>
+ <td>20</td>
+ <td>11</td>
+ <td>7</td>
+ <td>65</td>
+ <td>36</td>
+ <td>+29</td>
+ <td>71</td>
+ <td>Qualification for the <a href="https://en.wikipedia.org/wiki/2016%E2%80%9317_UEFA_Champions_League#Group_stage" title="2016–17 UEFA Champions League">Champions League group stage</a></td>
+ </tr>
+ <tr>
+ <th>3</th>
+ <td><a href="https://en.wikipedia.org/wiki/Tottenham_Hotspur_F.C." title="Tottenham Hotspur F.C.">Tottenham Hotspur</a></td>
+ <td>38</td>
+ <td>19</td>
+ <td>13</td>
+ <td>6</td>
+ <td>69</td>
+ <td>35</td>
+ <td>+34</td>
+ <td>70</td>
+ <td>Qualification for the <a href="https://en.wikipedia.org/wiki/2016%E2%80%9317_UEFA_Champions_League#Group_stage" title="2016–17 UEFA Champions League">Champions League group stage</a></td>
+ </tr>
+ <tr class="is-selected">
+ <th>4</th>
+ <td><a href="https://en.wikipedia.org/wiki/Manchester_City_F.C." title="Manchester City F.C.">Manchester City</a></td>
+ <td>38</td>
+ <td>19</td>
+ <td>9</td>
+ <td>10</td>
+ <td>71</td>
+ <td>41</td>
+ <td>+30</td>
+ <td>66</td>
+ <td>Qualification for the <a href="https://en.wikipedia.org/wiki/2016%E2%80%9317_UEFA_Champions_League#Play-off_round" title="2016–17 UEFA Champions League">Champions League play-off round</a></td>
+ </tr>
+ <tr>
+ <th>5</th>
+ <td><a href="https://en.wikipedia.org/wiki/Manchester_United_F.C." title="Manchester United F.C.">Manchester United</a></td>
+ <td>38</td>
+ <td>19</td>
+ <td>9</td>
+ <td>10</td>
+ <td>49</td>
+ <td>35</td>
+ <td>+14</td>
+ <td>66</td>
+ <td>Qualification for the <a href="https://en.wikipedia.org/wiki/2016%E2%80%9317_UEFA_Europa_League#Group_stage" title="2016–17 UEFA Europa League">Europa League group stage</a></td>
+ </tr>
+ <tr>
+ <th>6</th>
+ <td><a href="https://en.wikipedia.org/wiki/Southampton_F.C." title="Southampton F.C.">Southampton</a></td>
+ <td>38</td>
+ <td>18</td>
+ <td>9</td>
+ <td>11</td>
+ <td>59</td>
+ <td>41</td>
+ <td>+18</td>
+ <td>63</td>
+ <td>Qualification for the <a href="https://en.wikipedia.org/wiki/2016%E2%80%9317_UEFA_Europa_League#Group_stage" title="2016–17 UEFA Europa League">Europa League group stage</a></td>
+ </tr>
+ <tr>
+ <th>7</th>
+ <td><a href="https://en.wikipedia.org/wiki/West_Ham_United_F.C." title="West Ham United F.C.">West Ham United</a></td>
+ <td>38</td>
+ <td>16</td>
+ <td>14</td>
+ <td>8</td>
+ <td>65</td>
+ <td>51</td>
+ <td>+14</td>
+ <td>62</td>
+ <td>Qualification for the <a href="https://en.wikipedia.org/wiki/2016%E2%80%9317_UEFA_Europa_League#Third_qualifying_round" title="2016–17 UEFA Europa League">Europa League third qualifying round</a></td>
+ </tr>
+ <tr>
+ <th>8</th>
+ <td><a href="https://en.wikipedia.org/wiki/Liverpool_F.C." title="Liverpool F.C.">Liverpool</a></td>
+ <td>38</td>
+ <td>16</td>
+ <td>12</td>
+ <td>10</td>
+ <td>63</td>
+ <td>50</td>
+ <td>+13</td>
+ <td>60</td>
+ <td></td>
+ </tr>
+ <tr>
+ <th>9</th>
+ <td><a href="https://en.wikipedia.org/wiki/Stoke_City_F.C." title="Stoke City F.C.">Stoke City</a></td>
+ <td>38</td>
+ <td>14</td>
+ <td>9</td>
+ <td>15</td>
+ <td>41</td>
+ <td>55</td>
+ <td>−14</td>
+ <td>51</td>
+ <td></td>
+ </tr>
+ <tr>
+ <th>10</th>
+ <td><a href="https://en.wikipedia.org/wiki/Chelsea_F.C." title="Chelsea F.C.">Chelsea</a></td>
+ <td>38</td>
+ <td>12</td>
+ <td>14</td>
+ <td>12</td>
+ <td>59</td>
+ <td>53</td>
+ <td>+6</td>
+ <td>50</td>
+ <td></td>
+ </tr>
+ <tr>
+ <th>11</th>
+ <td><a href="https://en.wikipedia.org/wiki/Everton_F.C." title="Everton F.C.">Everton</a></td>
+ <td>38</td>
+ <td>11</td>
+ <td>14</td>
+ <td>13</td>
+ <td>59</td>
+ <td>55</td>
+ <td>+4</td>
+ <td>47</td>
+ <td></td>
+ </tr>
+ <tr>
+ <th>12</th>
+ <td><a href="https://en.wikipedia.org/wiki/Swansea_City_A.F.C." title="Swansea City A.F.C.">Swansea City</a></td>
+ <td>38</td>
+ <td>12</td>
+ <td>11</td>
+ <td>15</td>
+ <td>42</td>
+ <td>52</td>
+ <td>−10</td>
+ <td>47</td>
+ <td></td>
+ </tr>
+ <tr>
+ <th>13</th>
+ <td><a href="https://en.wikipedia.org/wiki/Watford_F.C." title="Watford F.C.">Watford</a></td>
+ <td>38</td>
+ <td>12</td>
+ <td>9</td>
+ <td>17</td>
+ <td>40</td>
+ <td>50</td>
+ <td>−10</td>
+ <td>45</td>
+ <td></td>
+ </tr>
+ <tr>
+ <th>14</th>
+ <td><a href="https://en.wikipedia.org/wiki/West_Bromwich_Albion_F.C." title="West Bromwich Albion F.C.">West Bromwich Albion</a></td>
+ <td>38</td>
+ <td>10</td>
+ <td>13</td>
+ <td>15</td>
+ <td>34</td>
+ <td>48</td>
+ <td>−14</td>
+ <td>43</td>
+ <td></td>
+ </tr>
+ <tr>
+ <th>15</th>
+ <td><a href="https://en.wikipedia.org/wiki/Crystal_Palace_F.C." title="Crystal Palace F.C.">Crystal Palace</a></td>
+ <td>38</td>
+ <td>11</td>
+ <td>9</td>
+ <td>18</td>
+ <td>39</td>
+ <td>51</td>
+ <td>−12</td>
+ <td>42</td>
+ <td></td>
+ </tr>
+ <tr>
+ <th>16</th>
+ <td><a href="https://en.wikipedia.org/wiki/A.F.C._Bournemouth" title="A.F.C. Bournemouth">AFC Bournemouth</a></td>
+ <td>38</td>
+ <td>11</td>
+ <td>9</td>
+ <td>18</td>
+ <td>45</td>
+ <td>67</td>
+ <td>−22</td>
+ <td>42</td>
+ <td></td>
+ </tr>
+ <tr>
+ <th>17</th>
+ <td><a href="https://en.wikipedia.org/wiki/Sunderland_A.F.C." title="Sunderland A.F.C.">Sunderland</a></td>
+ <td>38</td>
+ <td>9</td>
+ <td>12</td>
+ <td>17</td>
+ <td>48</td>
+ <td>62</td>
+ <td>−14</td>
+ <td>39</td>
+ <td></td>
+ </tr>
+ <tr>
+ <th>18</th>
+ <td><a href="https://en.wikipedia.org/wiki/Newcastle_United_F.C." title="Newcastle United F.C.">Newcastle United</a> <strong>(R)</strong>
+ </td>
+ <td>38</td>
+ <td>9</td>
+ <td>10</td>
+ <td>19</td>
+ <td>44</td>
+ <td>65</td>
+ <td>−21</td>
+ <td>37</td>
+ <td>Relegation to the <a href="https://en.wikipedia.org/wiki/2016%E2%80%9317_Football_League_Championship" title="2016–17 Football League Championship">Football League Championship</a></td>
+ </tr>
+ <tr>
+ <th>19</th>
+ <td><a href="https://en.wikipedia.org/wiki/Norwich_City_F.C." title="Norwich City F.C.">Norwich City</a> <strong>(R)</strong>
+ </td>
+ <td>38</td>
+ <td>9</td>
+ <td>7</td>
+ <td>22</td>
+ <td>39</td>
+ <td>67</td>
+ <td>−28</td>
+ <td>34</td>
+ <td>Relegation to the <a href="https://en.wikipedia.org/wiki/2016%E2%80%9317_Football_League_Championship" title="2016–17 Football League Championship">Football League Championship</a></td> </tr>
+ <tr>
+ <th>20</th>
+ <td><a href="https://en.wikipedia.org/wiki/Aston_Villa_F.C." title="Aston Villa F.C.">Aston Villa</a> <strong>(R)</strong>
+ </td>
+ <td>38</td>
+ <td>3</td>
+ <td>8</td>
+ <td>27</td>
+ <td>27</td>
+ <td>76</td>
+ <td>−49</td>
+ <td>17</td>
+ <td>Relegation to the <a href="https://en.wikipedia.org/wiki/2016%E2%80%9317_Football_League_Championship" title="2016–17 Football League Championship">Football League Championship</a></td>
+ </tr>
+ </tbody>
+</table>
+
+</div>
+
+<figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><table</span> <span class="na">class=</span><span class="s">"table"</span><span class="nt">></span>
+ <span class="nt"><thead></span>
+ <span class="nt"><tr></span>
+ <span class="nt"><th><abbr</span> <span class="na">title=</span><span class="s">"Position"</span><span class="nt">></span>Pos<span class="nt"></abbr></th></span>
+ <span class="nt"><th></span>Team<span class="nt"></th></span>
+ <span class="nt"><th><abbr</span> <span class="na">title=</span><span class="s">"Played"</span><span class="nt">></span>Pld<span class="nt"></abbr></th></span>
+ <span class="nt"><th><abbr</span> <span class="na">title=</span><span class="s">"Won"</span><span class="nt">></span>W<span class="nt"></abbr></th></span>
+ <span class="nt"><th><abbr</span> <span class="na">title=</span><span class="s">"Drawn"</span><span class="nt">></span>D<span class="nt"></abbr></th></span>
+ <span class="nt"><th><abbr</span> <span class="na">title=</span><span class="s">"Lost"</span><span class="nt">></span>L<span class="nt"></abbr></th></span>
+ <span class="nt"><th><abbr</span> <span class="na">title=</span><span class="s">"Goals for"</span><span class="nt">></span>GF<span class="nt"></abbr></th></span>
+ <span class="nt"><th><abbr</span> <span class="na">title=</span><span class="s">"Goals against"</span><span class="nt">></span>GA<span class="nt"></abbr></th></span>
+ <span class="nt"><th><abbr</span> <span class="na">title=</span><span class="s">"Goal difference"</span><span class="nt">></span>GD<span class="nt"></abbr></th></span>
+ <span class="nt"><th><abbr</span> <span class="na">title=</span><span class="s">"Points"</span><span class="nt">></span>Pts<span class="nt"></abbr></th></span>
+ <span class="nt"><th></span>Qualification or relegation<span class="nt"></th></span>
+ <span class="nt"></tr></span>
+ <span class="nt"></thead></span>
+ <span class="nt"><tfoot></span>
+ <span class="nt"><tr></span>
+ <span class="nt"><th><abbr</span> <span class="na">title=</span><span class="s">"Position"</span><span class="nt">></span>Pos<span class="nt"></abbr></th></span>
+ <span class="nt"><th></span>Team<span class="nt"></th></span>
+ <span class="nt"><th><abbr</span> <span class="na">title=</span><span class="s">"Played"</span><span class="nt">></span>Pld<span class="nt"></abbr></th></span>
+ <span class="nt"><th><abbr</span> <span class="na">title=</span><span class="s">"Won"</span><span class="nt">></span>W<span class="nt"></abbr></th></span>
+ <span class="nt"><th><abbr</span> <span class="na">title=</span><span class="s">"Drawn"</span><span class="nt">></span>D<span class="nt"></abbr></th></span>
+ <span class="nt"><th><abbr</span> <span class="na">title=</span><span class="s">"Lost"</span><span class="nt">></span>L<span class="nt"></abbr></th></span>
+ <span class="nt"><th><abbr</span> <span class="na">title=</span><span class="s">"Goals for"</span><span class="nt">></span>GF<span class="nt"></abbr></th></span>
+ <span class="nt"><th><abbr</span> <span class="na">title=</span><span class="s">"Goals against"</span><span class="nt">></span>GA<span class="nt"></abbr></th></span>
+ <span class="nt"><th><abbr</span> <span class="na">title=</span><span class="s">"Goal difference"</span><span class="nt">></span>GD<span class="nt"></abbr></th></span>
+ <span class="nt"><th><abbr</span> <span class="na">title=</span><span class="s">"Points"</span><span class="nt">></span>Pts<span class="nt"></abbr></th></span>
+ <span class="nt"><th></span>Qualification or relegation<span class="nt"></th></span>
+ <span class="nt"></tr></span>
+ <span class="nt"></tfoot></span>
+ <span class="nt"><tbody></span>
+ <span class="nt"><tr></span>
+ <span class="nt"><th></span>1<span class="nt"></th></span>
+ <span class="nt"><td><a</span> <span class="na">href=</span><span class="s">"https://en.wikipedia.org/wiki/Leicester_City_F.C."</span> <span class="na">title=</span><span class="s">"Leicester City F.C."</span><span class="nt">></span>Leicester City<span class="nt"></a></span> <span class="nt"><strong></span>(C)<span class="nt"></strong></span>
+ <span class="nt"></td></span>
+ <span class="nt"><td></span>38<span class="nt"></td></span>
+ <span class="nt"><td></span>23<span class="nt"></td></span>
+ <span class="nt"><td></span>12<span class="nt"></td></span>
+ <span class="nt"><td></span>3<span class="nt"></td></span>
+ <span class="nt"><td></span>68<span class="nt"></td></span>
+ <span class="nt"><td></span>36<span class="nt"></td></span>
+ <span class="nt"><td></span>+32<span class="nt"></td></span>
+ <span class="nt"><td></span>81<span class="nt"></td></span>
+ <span class="nt"><td></span>Qualification for the <span class="nt"><a</span> <span class="na">href=</span><span class="s">"https://en.wikipedia.org/wiki/2016%E2%80%9317_UEFA_Champions_League#Group_stage"</span> <span class="na">title=</span><span class="s">"2016–17 UEFA Champions League"</span><span class="nt">></span>Champions League group stage<span class="nt"></a></td></span>
+ <span class="nt"></tr></span>
+ <span class="nt"><tr></span>
+ <span class="nt"><th></span>2<span class="nt"></th></span>
+ <span class="nt"><td><a</span> <span class="na">href=</span><span class="s">"https://en.wikipedia.org/wiki/Arsenal_F.C."</span> <span class="na">title=</span><span class="s">"Arsenal F.C."</span><span class="nt">></span>Arsenal<span class="nt"></a></td></span>
+ <span class="nt"><td></span>38<span class="nt"></td></span>
+ <span class="nt"><td></span>20<span class="nt"></td></span>
+ <span class="nt"><td></span>11<span class="nt"></td></span>
+ <span class="nt"><td></span>7<span class="nt"></td></span>
+ <span class="nt"><td></span>65<span class="nt"></td></span>
+ <span class="nt"><td></span>36<span class="nt"></td></span>
+ <span class="nt"><td></span>+29<span class="nt"></td></span>
+ <span class="nt"><td></span>71<span class="nt"></td></span>
+ <span class="nt"><td></span>Qualification for the <span class="nt"><a</span> <span class="na">href=</span><span class="s">"https://en.wikipedia.org/wiki/2016%E2%80%9317_UEFA_Champions_League#Group_stage"</span> <span class="na">title=</span><span class="s">"2016–17 UEFA Champions League"</span><span class="nt">></span>Champions League group stage<span class="nt"></a></td></span>
+ <span class="nt"></tr></span>
+ <span class="nt"><tr></span>
+ <span class="nt"><th></span>3<span class="nt"></th></span>
+ <span class="nt"><td><a</span> <span class="na">href=</span><span class="s">"https://en.wikipedia.org/wiki/Tottenham_Hotspur_F.C."</span> <span class="na">title=</span><span class="s">"Tottenham Hotspur F.C."</span><span class="nt">></span>Tottenham Hotspur<span class="nt"></a></td></span>
+ <span class="nt"><td></span>38<span class="nt"></td></span>
+ <span class="nt"><td></span>19<span class="nt"></td></span>
+ <span class="nt"><td></span>13<span class="nt"></td></span>
+ <span class="nt"><td></span>6<span class="nt"></td></span>
+ <span class="nt"><td></span>69<span class="nt"></td></span>
+ <span class="nt"><td></span>35<span class="nt"></td></span>
+ <span class="nt"><td></span>+34<span class="nt"></td></span>
+ <span class="nt"><td></span>70<span class="nt"></td></span>
+ <span class="nt"><td></span>Qualification for the <span class="nt"><a</span> <span class="na">href=</span><span class="s">"https://en.wikipedia.org/wiki/2016%E2%80%9317_UEFA_Champions_League#Group_stage"</span> <span class="na">title=</span><span class="s">"2016–17 UEFA Champions League"</span><span class="nt">></span>Champions League group stage<span class="nt"></a></td></span>
+ <span class="nt"></tr></span>
+ <span class="nt"><tr</span> <span class="na">class=</span><span class="s">"is-selected"</span><span class="nt">></span>
+ <span class="nt"><th></span>4<span class="nt"></th></span>
+ <span class="nt"><td><a</span> <span class="na">href=</span><span class="s">"https://en.wikipedia.org/wiki/Manchester_City_F.C."</span> <span class="na">title=</span><span class="s">"Manchester City F.C."</span><span class="nt">></span>Manchester City<span class="nt"></a></td></span>
+ <span class="nt"><td></span>38<span class="nt"></td></span>
+ <span class="nt"><td></span>19<span class="nt"></td></span>
+ <span class="nt"><td></span>9<span class="nt"></td></span>
+ <span class="nt"><td></span>10<span class="nt"></td></span>
+ <span class="nt"><td></span>71<span class="nt"></td></span>
+ <span class="nt"><td></span>41<span class="nt"></td></span>
+ <span class="nt"><td></span>+30<span class="nt"></td></span>
+ <span class="nt"><td></span>66<span class="nt"></td></span>
+ <span class="nt"><td></span>Qualification for the <span class="nt"><a</span> <span class="na">href=</span><span class="s">"https://en.wikipedia.org/wiki/2016%E2%80%9317_UEFA_Champions_League#Play-off_round"</span> <span class="na">title=</span><span class="s">"2016–17 UEFA Champions League"</span><span class="nt">></span>Champions League play-off round<span class="nt"></a></td></span>
+ <span class="nt"></tr></span>
+ <span class="nt"><tr></span>
+ <span class="nt"><th></span>5<span class="nt"></th></span>
+ <span class="nt"><td><a</span> <span class="na">href=</span><span class="s">"https://en.wikipedia.org/wiki/Manchester_United_F.C."</span> <span class="na">title=</span><span class="s">"Manchester United F.C."</span><span class="nt">></span>Manchester United<span class="nt"></a></td></span>
+ <span class="nt"><td></span>38<span class="nt"></td></span>
+ <span class="nt"><td></span>19<span class="nt"></td></span>
+ <span class="nt"><td></span>9<span class="nt"></td></span>
+ <span class="nt"><td></span>10<span class="nt"></td></span>
+ <span class="nt"><td></span>49<span class="nt"></td></span>
+ <span class="nt"><td></span>35<span class="nt"></td></span>
+ <span class="nt"><td></span>+14<span class="nt"></td></span>
+ <span class="nt"><td></span>66<span class="nt"></td></span>
+ <span class="nt"><td></span>Qualification for the <span class="nt"><a</span> <span class="na">href=</span><span class="s">"https://en.wikipedia.org/wiki/2016%E2%80%9317_UEFA_Europa_League#Group_stage"</span> <span class="na">title=</span><span class="s">"2016–17 UEFA Europa League"</span><span class="nt">></span>Europa League group stage<span class="nt"></a></td></span>
+ <span class="nt"></tr></span>
+ <span class="nt"><tr></span>
+ <span class="nt"><th></span>6<span class="nt"></th></span>
+ <span class="nt"><td><a</span> <span class="na">href=</span><span class="s">"https://en.wikipedia.org/wiki/Southampton_F.C."</span> <span class="na">title=</span><span class="s">"Southampton F.C."</span><span class="nt">></span>Southampton<span class="nt"></a></td></span>
+ <span class="nt"><td></span>38<span class="nt"></td></span>
+ <span class="nt"><td></span>18<span class="nt"></td></span>
+ <span class="nt"><td></span>9<span class="nt"></td></span>
+ <span class="nt"><td></span>11<span class="nt"></td></span>
+ <span class="nt"><td></span>59<span class="nt"></td></span>
+ <span class="nt"><td></span>41<span class="nt"></td></span>
+ <span class="nt"><td></span>+18<span class="nt"></td></span>
+ <span class="nt"><td></span>63<span class="nt"></td></span>
+ <span class="nt"><td></span>Qualification for the <span class="nt"><a</span> <span class="na">href=</span><span class="s">"https://en.wikipedia.org/wiki/2016%E2%80%9317_UEFA_Europa_League#Group_stage"</span> <span class="na">title=</span><span class="s">"2016–17 UEFA Europa League"</span><span class="nt">></span>Europa League group stage<span class="nt"></a></td></span>
+ <span class="nt"></tr></span>
+ <span class="nt"><tr></span>
+ <span class="nt"><th></span>7<span class="nt"></th></span>
+ <span class="nt"><td><a</span> <span class="na">href=</span><span class="s">"https://en.wikipedia.org/wiki/West_Ham_United_F.C."</span> <span class="na">title=</span><span class="s">"West Ham United F.C."</span><span class="nt">></span>West Ham United<span class="nt"></a></td></span>
+ <span class="nt"><td></span>38<span class="nt"></td></span>
+ <span class="nt"><td></span>16<span class="nt"></td></span>
+ <span class="nt"><td></span>14<span class="nt"></td></span>
+ <span class="nt"><td></span>8<span class="nt"></td></span>
+ <span class="nt"><td></span>65<span class="nt"></td></span>
+ <span class="nt"><td></span>51<span class="nt"></td></span>
+ <span class="nt"><td></span>+14<span class="nt"></td></span>
+ <span class="nt"><td></span>62<span class="nt"></td></span>
+ <span class="nt"><td></span>Qualification for the <span class="nt"><a</span> <span class="na">href=</span><span class="s">"https://en.wikipedia.org/wiki/2016%E2%80%9317_UEFA_Europa_League#Third_qualifying_round"</span> <span class="na">title=</span><span class="s">"2016–17 UEFA Europa League"</span><span class="nt">></span>Europa League third qualifying round<span class="nt"></a></td></span>
+ <span class="nt"></tr></span>
+ <span class="nt"><tr></span>
+ <span class="nt"><th></span>8<span class="nt"></th></span>
+ <span class="nt"><td><a</span> <span class="na">href=</span><span class="s">"https://en.wikipedia.org/wiki/Liverpool_F.C."</span> <span class="na">title=</span><span class="s">"Liverpool F.C."</span><span class="nt">></span>Liverpool<span class="nt"></a></td></span>
+ <span class="nt"><td></span>38<span class="nt"></td></span>
+ <span class="nt"><td></span>16<span class="nt"></td></span>
+ <span class="nt"><td></span>12<span class="nt"></td></span>
+ <span class="nt"><td></span>10<span class="nt"></td></span>
+ <span class="nt"><td></span>63<span class="nt"></td></span>
+ <span class="nt"><td></span>50<span class="nt"></td></span>
+ <span class="nt"><td></span>+13<span class="nt"></td></span>
+ <span class="nt"><td></span>60<span class="nt"></td></span>
+ <span class="nt"><td></td></span>
+ <span class="nt"></tr></span>
+ <span class="nt"><tr></span>
+ <span class="nt"><th></span>9<span class="nt"></th></span>
+ <span class="nt"><td><a</span> <span class="na">href=</span><span class="s">"https://en.wikipedia.org/wiki/Stoke_City_F.C."</span> <span class="na">title=</span><span class="s">"Stoke City F.C."</span><span class="nt">></span>Stoke City<span class="nt"></a></td></span>
+ <span class="nt"><td></span>38<span class="nt"></td></span>
+ <span class="nt"><td></span>14<span class="nt"></td></span>
+ <span class="nt"><td></span>9<span class="nt"></td></span>
+ <span class="nt"><td></span>15<span class="nt"></td></span>
+ <span class="nt"><td></span>41<span class="nt"></td></span>
+ <span class="nt"><td></span>55<span class="nt"></td></span>
+ <span class="nt"><td></span>−14<span class="nt"></td></span>
+ <span class="nt"><td></span>51<span class="nt"></td></span>
+ <span class="nt"><td></td></span>
+ <span class="nt"></tr></span>
+ <span class="nt"><tr></span>
+ <span class="nt"><th></span>10<span class="nt"></th></span>
+ <span class="nt"><td><a</span> <span class="na">href=</span><span class="s">"https://en.wikipedia.org/wiki/Chelsea_F.C."</span> <span class="na">title=</span><span class="s">"Chelsea F.C."</span><span class="nt">></span>Chelsea<span class="nt"></a></td></span>
+ <span class="nt"><td></span>38<span class="nt"></td></span>
+ <span class="nt"><td></span>12<span class="nt"></td></span>
+ <span class="nt"><td></span>14<span class="nt"></td></span>
+ <span class="nt"><td></span>12<span class="nt"></td></span>
+ <span class="nt"><td></span>59<span class="nt"></td></span>
+ <span class="nt"><td></span>53<span class="nt"></td></span>
+ <span class="nt"><td></span>+6<span class="nt"></td></span>
+ <span class="nt"><td></span>50<span class="nt"></td></span>
+ <span class="nt"><td></td></span>
+ <span class="nt"></tr></span>
+ <span class="nt"><tr></span>
+ <span class="nt"><th></span>11<span class="nt"></th></span>
+ <span class="nt"><td><a</span> <span class="na">href=</span><span class="s">"https://en.wikipedia.org/wiki/Everton_F.C."</span> <span class="na">title=</span><span class="s">"Everton F.C."</span><span class="nt">></span>Everton<span class="nt"></a></td></span>
+ <span class="nt"><td></span>38<span class="nt"></td></span>
+ <span class="nt"><td></span>11<span class="nt"></td></span>
+ <span class="nt"><td></span>14<span class="nt"></td></span>
+ <span class="nt"><td></span>13<span class="nt"></td></span>
+ <span class="nt"><td></span>59<span class="nt"></td></span>
+ <span class="nt"><td></span>55<span class="nt"></td></span>
+ <span class="nt"><td></span>+4<span class="nt"></td></span>
+ <span class="nt"><td></span>47<span class="nt"></td></span>
+ <span class="nt"><td></td></span>
+ <span class="nt"></tr></span>
+ <span class="nt"><tr></span>
+ <span class="nt"><th></span>12<span class="nt"></th></span>
+ <span class="nt"><td><a</span> <span class="na">href=</span><span class="s">"https://en.wikipedia.org/wiki/Swansea_City_A.F.C."</span> <span class="na">title=</span><span class="s">"Swansea City A.F.C."</span><span class="nt">></span>Swansea City<span class="nt"></a></td></span>
+ <span class="nt"><td></span>38<span class="nt"></td></span>
+ <span class="nt"><td></span>12<span class="nt"></td></span>
+ <span class="nt"><td></span>11<span class="nt"></td></span>
+ <span class="nt"><td></span>15<span class="nt"></td></span>
+ <span class="nt"><td></span>42<span class="nt"></td></span>
+ <span class="nt"><td></span>52<span class="nt"></td></span>
+ <span class="nt"><td></span>−10<span class="nt"></td></span>
+ <span class="nt"><td></span>47<span class="nt"></td></span>
+ <span class="nt"><td></td></span>
+ <span class="nt"></tr></span>
+ <span class="nt"><tr></span>
+ <span class="nt"><th></span>13<span class="nt"></th></span>
+ <span class="nt"><td><a</span> <span class="na">href=</span><span class="s">"https://en.wikipedia.org/wiki/Watford_F.C."</span> <span class="na">title=</span><span class="s">"Watford F.C."</span><span class="nt">></span>Watford<span class="nt"></a></td></span>
+ <span class="nt"><td></span>38<span class="nt"></td></span>
+ <span class="nt"><td></span>12<span class="nt"></td></span>
+ <span class="nt"><td></span>9<span class="nt"></td></span>
+ <span class="nt"><td></span>17<span class="nt"></td></span>
+ <span class="nt"><td></span>40<span class="nt"></td></span>
+ <span class="nt"><td></span>50<span class="nt"></td></span>
+ <span class="nt"><td></span>−10<span class="nt"></td></span>
+ <span class="nt"><td></span>45<span class="nt"></td></span>
+ <span class="nt"><td></td></span>
+ <span class="nt"></tr></span>
+ <span class="nt"><tr></span>
+ <span class="nt"><th></span>14<span class="nt"></th></span>
+ <span class="nt"><td><a</span> <span class="na">href=</span><span class="s">"https://en.wikipedia.org/wiki/West_Bromwich_Albion_F.C."</span> <span class="na">title=</span><span class="s">"West Bromwich Albion F.C."</span><span class="nt">></span>West Bromwich Albion<span class="nt"></a></td></span>
+ <span class="nt"><td></span>38<span class="nt"></td></span>
+ <span class="nt"><td></span>10<span class="nt"></td></span>
+ <span class="nt"><td></span>13<span class="nt"></td></span>
+ <span class="nt"><td></span>15<span class="nt"></td></span>
+ <span class="nt"><td></span>34<span class="nt"></td></span>
+ <span class="nt"><td></span>48<span class="nt"></td></span>
+ <span class="nt"><td></span>−14<span class="nt"></td></span>
+ <span class="nt"><td></span>43<span class="nt"></td></span>
+ <span class="nt"><td></td></span>
+ <span class="nt"></tr></span>
+ <span class="nt"><tr></span>
+ <span class="nt"><th></span>15<span class="nt"></th></span>
+ <span class="nt"><td><a</span> <span class="na">href=</span><span class="s">"https://en.wikipedia.org/wiki/Crystal_Palace_F.C."</span> <span class="na">title=</span><span class="s">"Crystal Palace F.C."</span><span class="nt">></span>Crystal Palace<span class="nt"></a></td></span>
+ <span class="nt"><td></span>38<span class="nt"></td></span>
+ <span class="nt"><td></span>11<span class="nt"></td></span>
+ <span class="nt"><td></span>9<span class="nt"></td></span>
+ <span class="nt"><td></span>18<span class="nt"></td></span>
+ <span class="nt"><td></span>39<span class="nt"></td></span>
+ <span class="nt"><td></span>51<span class="nt"></td></span>
+ <span class="nt"><td></span>−12<span class="nt"></td></span>
+ <span class="nt"><td></span>42<span class="nt"></td></span>
+ <span class="nt"><td></td></span>
+ <span class="nt"></tr></span>
+ <span class="nt"><tr></span>
+ <span class="nt"><th></span>16<span class="nt"></th></span>
+ <span class="nt"><td><a</span> <span class="na">href=</span><span class="s">"https://en.wikipedia.org/wiki/A.F.C._Bournemouth"</span> <span class="na">title=</span><span class="s">"A.F.C. Bournemouth"</span><span class="nt">></span>AFC Bournemouth<span class="nt"></a></td></span>
+ <span class="nt"><td></span>38<span class="nt"></td></span>
+ <span class="nt"><td></span>11<span class="nt"></td></span>
+ <span class="nt"><td></span>9<span class="nt"></td></span>
+ <span class="nt"><td></span>18<span class="nt"></td></span>
+ <span class="nt"><td></span>45<span class="nt"></td></span>
+ <span class="nt"><td></span>67<span class="nt"></td></span>
+ <span class="nt"><td></span>−22<span class="nt"></td></span>
+ <span class="nt"><td></span>42<span class="nt"></td></span>
+ <span class="nt"><td></td></span>
+ <span class="nt"></tr></span>
+ <span class="nt"><tr></span>
+ <span class="nt"><th></span>17<span class="nt"></th></span>
+ <span class="nt"><td><a</span> <span class="na">href=</span><span class="s">"https://en.wikipedia.org/wiki/Sunderland_A.F.C."</span> <span class="na">title=</span><span class="s">"Sunderland A.F.C."</span><span class="nt">></span>Sunderland<span class="nt"></a></td></span>
+ <span class="nt"><td></span>38<span class="nt"></td></span>
+ <span class="nt"><td></span>9<span class="nt"></td></span>
+ <span class="nt"><td></span>12<span class="nt"></td></span>
+ <span class="nt"><td></span>17<span class="nt"></td></span>
+ <span class="nt"><td></span>48<span class="nt"></td></span>
+ <span class="nt"><td></span>62<span class="nt"></td></span>
+ <span class="nt"><td></span>−14<span class="nt"></td></span>
+ <span class="nt"><td></span>39<span class="nt"></td></span>
+ <span class="nt"><td></td></span>
+ <span class="nt"></tr></span>
+ <span class="nt"><tr></span>
+ <span class="nt"><th></span>18<span class="nt"></th></span>
+ <span class="nt"><td><a</span> <span class="na">href=</span><span class="s">"https://en.wikipedia.org/wiki/Newcastle_United_F.C."</span> <span class="na">title=</span><span class="s">"Newcastle United F.C."</span><span class="nt">></span>Newcastle United<span class="nt"></a></span> <span class="nt"><strong></span>(R)<span class="nt"></strong></span>
+ <span class="nt"></td></span>
+ <span class="nt"><td></span>38<span class="nt"></td></span>
+ <span class="nt"><td></span>9<span class="nt"></td></span>
+ <span class="nt"><td></span>10<span class="nt"></td></span>
+ <span class="nt"><td></span>19<span class="nt"></td></span>
+ <span class="nt"><td></span>44<span class="nt"></td></span>
+ <span class="nt"><td></span>65<span class="nt"></td></span>
+ <span class="nt"><td></span>−21<span class="nt"></td></span>
+ <span class="nt"><td></span>37<span class="nt"></td></span>
+ <span class="nt"><td></span>Relegation to the <span class="nt"><a</span> <span class="na">href=</span><span class="s">"https://en.wikipedia.org/wiki/2016%E2%80%9317_Football_League_Championship"</span> <span class="na">title=</span><span class="s">"2016–17 Football League Championship"</span><span class="nt">></span>Football League Championship<span class="nt"></a></td></span>
+ <span class="nt"></tr></span>
+ <span class="nt"><tr></span>
+ <span class="nt"><th></span>19<span class="nt"></th></span>
+ <span class="nt"><td><a</span> <span class="na">href=</span><span class="s">"https://en.wikipedia.org/wiki/Norwich_City_F.C."</span> <span class="na">title=</span><span class="s">"Norwich City F.C."</span><span class="nt">></span>Norwich City<span class="nt"></a></span> <span class="nt"><strong></span>(R)<span class="nt"></strong></span>
+ <span class="nt"></td></span>
+ <span class="nt"><td></span>38<span class="nt"></td></span>
+ <span class="nt"><td></span>9<span class="nt"></td></span>
+ <span class="nt"><td></span>7<span class="nt"></td></span>
+ <span class="nt"><td></span>22<span class="nt"></td></span>
+ <span class="nt"><td></span>39<span class="nt"></td></span>
+ <span class="nt"><td></span>67<span class="nt"></td></span>
+ <span class="nt"><td></span>−28<span class="nt"></td></span>
+ <span class="nt"><td></span>34<span class="nt"></td></span>
+ <span class="nt"><td></span>Relegation to the <span class="nt"><a</span> <span class="na">href=</span><span class="s">"https://en.wikipedia.org/wiki/2016%E2%80%9317_Football_League_Championship"</span> <span class="na">title=</span><span class="s">"2016–17 Football League Championship"</span><span class="nt">></span>Football League Championship<span class="nt"></a></td></span> <span class="nt"></tr></span>
+ <span class="nt"><tr></span>
+ <span class="nt"><th></span>20<span class="nt"></th></span>
+ <span class="nt"><td><a</span> <span class="na">href=</span><span class="s">"https://en.wikipedia.org/wiki/Aston_Villa_F.C."</span> <span class="na">title=</span><span class="s">"Aston Villa F.C."</span><span class="nt">></span>Aston Villa<span class="nt"></a></span> <span class="nt"><strong></span>(R)<span class="nt"></strong></span>
+ <span class="nt"></td></span>
+ <span class="nt"><td></span>38<span class="nt"></td></span>
+ <span class="nt"><td></span>3<span class="nt"></td></span>
+ <span class="nt"><td></span>8<span class="nt"></td></span>
+ <span class="nt"><td></span>27<span class="nt"></td></span>
+ <span class="nt"><td></span>27<span class="nt"></td></span>
+ <span class="nt"><td></span>76<span class="nt"></td></span>
+ <span class="nt"><td></span>−49<span class="nt"></td></span>
+ <span class="nt"><td></span>17<span class="nt"></td></span>
+ <span class="nt"><td></span>Relegation to the <span class="nt"><a</span> <span class="na">href=</span><span class="s">"https://en.wikipedia.org/wiki/2016%E2%80%9317_Football_League_Championship"</span> <span class="na">title=</span><span class="s">"2016–17 Football League Championship"</span><span class="nt">></span>Football League Championship<span class="nt"></a></td></span>
+ <span class="nt"></tr></span>
+ <span class="nt"></tbody></span>
+<span class="nt"></table></span></code></pre></figure>
+
+ <hr>
+
+ <h3 class="title">Modifiers</h3>
+
+ <div class="columns">
+ <div class="column">
+ <p>Add <strong>borders</strong> to all the cells.</p>
+ </div>
+ <div class="column">
+ <code>table is-bordered</code>
+ </div>
+ <div class="column is-half">
+ <table class="table is-bordered">
+ <thead>
+ <tr>
+ <th>One</th>
+ <th>Two</th>
+ </tr>
+ </thead>
+ <tbody>
+ <tr>
+ <td>Three</td>
+ <td>Four</td>
+ </tr>
+ </tbody>
+ </table>
+ </div>
+ </div>
+
+ <div class="columns">
+ <div class="column">
+ <p>Add <strong>stripes</strong> to the table.</p>
+ </div>
+ <div class="column">
+ <code>table is-striped</code>
+ </div>
+ <div class="column is-half">
+ <table class="table is-striped">
+ <thead>
+ <tr>
+ <th>One</th>
+ <th>Two</th>
+ </tr>
+ </thead>
+ <tbody>
+ <tr>
+ <td>Three</td>
+ <td>Four</td>
+ </tr>
+ <tr>
+ <td>Five</td>
+ <td>Six</td>
+ </tr>
+ <tr>
+ <td>Seven</td>
+ <td>Eight</td>
+ </tr>
+ <tr>
+ <td>Nine</td>
+ <td>Ten</td>
+ </tr>
+ <tr>
+ <td>Eleven</td>
+ <td>Twelve</td>
+ </tr>
+ </tbody>
+ </table>
+ </div>
+ </div>
+
+ <div class="columns">
+ <div class="column">
+ <p>Make the cells <strong>narrower</strong>.</p>
+ </div>
+ <div class="column">
+ <code>table is-narrow</code>
+ </div>
+ <div class="column is-half">
+ <table class="table is-narrow">
+ <thead>
+ <tr>
+ <th>One</th>
+ <th>Two</th>
+ </tr>
+ </thead>
+ <tbody>
+ <tr>
+ <td>Three</td>
+ <td>Four</td>
+ </tr>
+ <tr>
+ <td>Five</td>
+ <td>Six</td>
+ </tr>
+ <tr>
+ <td>Seven</td>
+ <td>Eight</td>
+ </tr>
+ <tr>
+ <td>Nine</td>
+ <td>Ten</td>
+ </tr>
+ <tr>
+ <td>Eleven</td>
+ <td>Twelve</td>
+ </tr>
+ </tbody>
+ </table>
+ </div>
+ </div>
+
+ <div class="columns">
+ <div class="column">
+ <p>You can <strong>combine</strong> all three modifiers.</p>
+ </div>
+ <div class="column">
+ <code>table is-bordered is-striped is-narrow</code>
+ </div>
+ <div class="column is-half">
+ <table class="table is-bordered is-striped is-narrow">
+ <thead>
+ <tr>
+ <th>One</th>
+ <th>Two</th>
+ </tr>
+ </thead>
+ <tbody>
+ <tr>
+ <td>Three</td>
+ <td>Four</td>
+ </tr>
+ <tr>
+ <td>Five</td>
+ <td>Six</td>
+ </tr>
+ <tr>
+ <td>Seven</td>
+ <td>Eight</td>
+ </tr>
+ <tr>
+ <td>Nine</td>
+ <td>Ten</td>
+ </tr>
+ <tr>
+ <td>Eleven</td>
+ <td>Twelve</td>
+ </tr>
+ </tbody>
+ </table>
+ </div>
+ </div>
+ </div>
+</section>
+
+
+ <script src="//m.servedby-buysellads.com/monetization.js" type="text/javascript"></script>
+
+<section class="hero is-info bsa">
+ <div class="container">
+ <div class="columns is-vcentered">
+ <div class="column is-4">
+ <p class="title">Bulma <strong>Partners</strong></p>
+ <p class="subtitle">Check out their products!</p>
+ </div>
+
+ <div class="column is-8">
+ <div class="bsa-cpc"></div>
+ </div>
+ </div>
+ </div>
+</section>
+
+<script>
+ (function(){
+ if(typeof _bsa !== 'undefined' && _bsa) {
+ _bsa.init('default', 'CVAIKK3E', 'placement:bulmaio', {
+ target: '.bsa-cpc',
+ align: 'horizontal',
+ disable_css: 'true'
+ });
+ }
+ })();
+</script>
+
+
+<section id="newsletter" class="hero is-primary">
+ <div class="hero-body">
+ <div class="container">
+ <!-- Begin MailChimp Signup Form -->
+ <div id="mc_embed_signup" class="columns is-vcentered">
+ <div class="column is-one-third is-left">
+ <p class="title">Bulma <strong>Newsletter</strong></p>
+ <p class="subtitle">Get notified when v1 is ready!</p>
+ </div>
+
+ <div class="column">
+ <form action="https://bbxdesign.us3.list-manage.com/subscribe/post?u=b43b93fe633f0560b2a72a69c&id=52585e8803" method="post" id="mc-embedded-subscribe-form" name="mc-embedded-subscribe-form" class="validate" target="_blank" novalidate>
+ <div id="mc_embed_signup_scroll">
+ <div class="field is-grouped">
+ <div class="control has-icons-left is-expanded">
+ <input type="email" value="" name="EMAIL" class="input is-flat required email" id="mce-EMAIL" placeholder="email address" required>
+ <span class="icon is-small is-left">
+ <i class="fa fa-envelope"></i>
+ </span>
+ </div>
+ <div class="control">
+ <input type="submit" value="Subscribe" name="subscribe" id="mc-embedded-subscribe" class="button is-white is-outlined">
+ </div>
+ </div>
+ <div id="mce-responses">
+ <div class="notification is-danger response" id="mce-error-response" style="display:none"></div>
+ <div class="notification is-success response" id="mce-success-response" style="display:none"></div>
+ </div>
+ <!-- real people should not fill this in and expect good things - do not remove this or risk form bot signups-->
+ <div style="position: absolute; left: -5000px;" aria-hidden="true">
+ <input type="text" name="b_b43b93fe633f0560b2a72a69c_52585e8803" tabindex="-1" value="">
+ </div>
+ </div>
+ </form>
+ </div>
+ </div>
+ <!--End mc_embed_signup-->
+ </div>
+ </div>
+</section>
+
+<footer class="footer">
+ <div class="container">
+ <div class="columns">
+ <div class="column is-3">
+ <div id="about" class="content">
+ <strong xmlns:dct="http://purl.org/dc/terms/" href="http://purl.org/dc/dcmitype/Text" property="dct:title" rel="dct:type">Bulma</strong> by <a xmlns:cc="http://creativecommons.org/ns#" href="http://jgthms.com" property="cc:attributionName" rel="cc:attributionURL">Jeremy Thomas</a>.
+ <div class="twitter-container">
+ <a href="https://twitter.com/jgthms" class="twitter-follow-button" data-show-count="true" data-lang="en" data-size="large">@jgthms</a>
+ </div>
+ </div>
+ </div>
+ <div class="column is-5">
+ <div id="share" class="content">
+ <div>
+ <strong>Support</strong> and share the love!
+ </div>
+ <div id="social">
+ <iframe class="github-btn" src="https://ghbtns.com/github-btn.html?user=jgthms&repo=bulma&type=star&count=true&size=large" allowtransparency="true" frameborder="0" scrolling="0" width="160px" height="30px"></iframe>
+
+ <a href="https://twitter.com/share" class="twitter-share-button" data-text="Bulma v0.4.4: a modern CSS framework based on Flexbox" data-url="http://bulma.io/versions/0.4.4" data-count="horizontal" data-via="jgthms" data-related="jgthms:Creator of Bulma" data-size="large">Tweet</a>
+
+ <form class="paypal-form" action="https://www.paypal.com/cgi-bin/webscr" method="post" target="_top">
+ <input type="hidden" name="cmd" value="_s-xclick">
+ <input type="hidden" name="hosted_button_id" value="8WMKYSRFN6A78">
+ <input type="image" src="http://bulma.io/versions/0.4.4/images/paypal-donate.png" border="0" name="submit" alt="PayPal – The safer, easier way to pay online." height="30">
+ <img alt="" border="0" src="https://www.paypalobjects.com/en_GB/i/scr/pixel.gif" width="1" height="1">
+ </form>
+
+ <div class="fb-like" data-href="https://www.facebook.com/bulmaio" data-layout="button" data-action="like" data-size="large" data-show-faces="false" data-share="true"></div>
+ </div>
+ </div>
+ </div>
+ <div class="column is-4">
+ <div id="sister">
+ <p>
+ More <strong>helpful</strong> tools:
+ </p>
+ <ul>
+ <li>
+ <a href="http://cssreference.io">
+ <img src="http://bulma.io/versions/0.4.4/images/css-reference-logo.png" alt="CSS Reference logo">
+ </a>
+ </li>
+ <li>
+ <a href="http://htmlreference.io">
+ <img src="http://bulma.io/versions/0.4.4/images/html-reference-logo.png" alt="HTML Reference logo">
+ </a>
+ </li>
+ </ul>
+ </div>
+ </div>
+ </div>
+
+ <p id="tsp">
+ <small>
+ Source code licensed <a href="http://opensource.org/licenses/mit-license.php">MIT</a>.
+ <br>
+ Website content licensed <a rel="license" href="http://creativecommons.org/licenses/by-nc-sa/4.0/">CC BY-NC-SA 4.0</a>.
+ </small>
+ </p>
+ </div>
+</footer>
+
+<script src="http://bulma.io/versions/0.4.4/vendor/clipboard-1.7.1.min.js"></script>
+<script src="http://bulma.io/versions/0.4.4/lib/main.js"></script>
+
+
+
+<div id="fb-root"></div>
+
+<script async defer type="text/javascript">(function(d, s, id) {
+ var js, fjs = d.getElementsByTagName(s)[0];
+ if (d.getElementById(id)) return;
+ js = d.createElement(s); js.id = id;
+ js.async = true;
+ js.defer = true;
+ js.src = "//connect.facebook.net/en_US/sdk.js#xfbml=1&version=v2.8&appId=310296819307942";
+ fjs.parentNode.insertBefore(js, fjs);
+}(document, 'script', 'facebook-jssdk'));</script>
+
+<script async defer id="twitter-wjs" src="https://platform.twitter.com/widgets.js"></script>
+<script async defer type="text/javascript" src="https://s3.amazonaws.com/downloads.mailchimp.com/js/mc-validate.js"></script>
+
+<script async defer type="text/javascript">
+ (function() {
+ window.fnames = new Array();
+ window.ftypes = new Array();
+ fnames[0]='EMAIL';
+ ftypes[0]='email';
+ }());
+ // var $mcj = window.jQuery.noConflict(true);
+</script>
+
+<script async defer type="text/javascript">
+ (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
+ (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
+ m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
+ })(window,document,'script','https://www.google-analytics.com/analytics.js','ga');
+
+ ga('create', 'UA-82634666-2', 'auto');
+ ga('send', 'pageview');
+</script>
+
+ </body>
+</html>
diff --git a/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/documentation/elements/tag/index.html b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/documentation/elements/tag/index.html
new file mode 100644
index 0000000000000000000000000000000000000000..c02555fb6155de178140b1bb9c055b6829c2b4ff
--- /dev/null
+++ b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/documentation/elements/tag/index.html
@@ -0,0 +1,724 @@
+<!DOCTYPE html>
+<html lang="en" class="route-documentation">
+ <head>
+ <meta charset="utf-8">
+ <meta http-equiv="X-UA-Compatible" content="IE=edge">
+ <meta name="viewport" content="width=device-width, initial-scale=1">
+ <meta name="description" content="Bulma v0.4.4 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <title>Bulma v0.4.4: a modern CSS framework based on Flexbox</title>
+
+ <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.6.3/css/font-awesome.min.css">
+ <link rel="stylesheet" href="http://bulma.io/versions/0.4.4/css/bulma-docs.css">
+
+ <link rel="canonical" href="http://bulma.io/versions/0.4.4/documentation/elements/tag/">
+ <link rel="alternate" type="application/rss+xml" title="Bulma v0.4.4: a modern CSS framework based on Flexbox" href="http://bulma.io/versions/0.4.4/feed.xml">
+
+ <meta property="og:url" content="http://bulma.io/versions/0.4.4">
+ <meta property="og:type" content="website">
+ <meta property="og:title" content="Bulma v0.4.4: a modern CSS framework based on Flexbox">
+ <meta property="og:image" content="http://bulma.io/versions/0.4.4/images/bulma-banner.png">
+ <meta property="og:image:type" content="image/png">
+ <meta property="og:image:width" content="1200">
+ <meta property="og:image:height" content="630">
+ <meta property="og:description" content="Bulma v0.4.4 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <meta name="twitter:card" content="summary_large_image">
+ <meta name="twitter:site" content="@jgthms">
+ <meta name="twitter:creator" content="@jgthms">
+ <meta name="twitter:title" content="Bulma v0.4.4: a modern CSS framework based on Flexbox">
+ <meta name="twitter:image" content="http://bulma.io/versions/0.4.4/images/bulma-banner.png">
+ <meta name="twitter:description" content="Bulma v0.4.4 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <link rel="apple-touch-icon" sizes="180x180" href="http://bulma.io/versions/0.4.4/favicons/apple-touch-icon.png?v=201701041855">
+ <link rel="icon" type="image/png" href="http://bulma.io/versions/0.4.4/favicons/favicon-32x32.png?v=201701041855" sizes="32x32">
+ <link rel="icon" type="image/png" href="http://bulma.io/versions/0.4.4/favicons/favicon-16x16.png?v=201701041855" sizes="16x16">
+ <link rel="manifest" href="http://bulma.io/versions/0.4.4/favicons/manifest.json?v=201701041855">
+ <link rel="mask-icon" href="http://bulma.io/versions/0.4.4/favicons/safari-pinned-tab.svg?v=201701041855" color="#00d1b2">
+ <link rel="shortcut icon" href="http://bulma.io/versions/0.4.4/favicons/favicon.ico?v=201701041855">
+ <meta name="msapplication-config" content="http://bulma.io/versions/0.4.4/favicons/browserconfig.xml?v=201701041855">
+ <meta name="theme-color" content="#00d1b2">
+</head>
+
+ <body class="layout-documentation page-elements">
+
+ <div class="notification is-info" style="border-radius: 0; margin-bottom: 0;">
+ <p>
+ You are viewing the deprecated <strong>0.4.4</strong> version of the website.
+ <a href="/">Click here to view the latest version</a>
+ </p>
+ </div>
+
+
+ <div class="container">
+ <nav class="navbar ">
+ <div class="navbar-brand">
+ <a class="navbar-item" href="http://bulma.io/versions/0.4.4">
+ <img src="http://bulma.io/versions/0.4.4/images/bulma-logo.png" alt="Bulma v0.4.4: a modern CSS framework based on Flexbox" width="112" height="28">
+ </a>
+
+ <a class="navbar-item is-hidden-desktop" href="https://github.com/jgthms/bulma" target="_blank">
+ <span class="icon" style="color: #333;">
+ <i class="fa fa-github"></i>
+ </span>
+ </a>
+
+ <a class="navbar-item is-hidden-desktop" href="https://twitter.com/jgthms" target="_blank">
+ <span class="icon" style="color: #55acee;">
+ <i class="fa fa-twitter"></i>
+ </span>
+ </a>
+
+ <div class="navbar-burger burger" data-target="navMenuDocumentation">
+ <span></span>
+ <span></span>
+ <span></span>
+ </div>
+ </div>
+
+ <div id="navMenuDocumentation" class="navbar-menu">
+ <div class="navbar-start">
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/">
+ Home
+ </a>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <a class="navbar-link is-active" href="/versions/0.4.4/documentation/overview/start/">
+ Docs
+ </a>
+ <div class="navbar-dropdown ">
+ <a class="navbar-item " href="/versions/0.4.4/documentation/overview/start/">
+ Overview
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/modifiers/syntax/">
+ Modifiers
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/grid/columns/">
+ Grid
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/form/general/">
+ Form
+ </a>
+ <a class="navbar-item is-active" href="http://bulma.io/versions/0.4.4/documentation/elements/box/">
+ Elements
+ </a>
+
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/components/breadcrumb/">
+ Components
+ </a>
+
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/layout/container/">
+ Layout
+ </a>
+ <hr class="navbar-divider">
+ <div class="navbar-item">
+ <div>
+ <p class="has-text-info is-size-6-desktop"><strong>0.4.4</strong></p>
+
+ <small>
+ <a class="view-all-versions" href="/versions">View all versions</a>
+ </small>
+
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <a class="navbar-link " href="http://bulma.io/versions/0.4.4/blog/">
+ Blog
+ </a>
+ <div id="blogDropdown" class="navbar-dropdown " data-style="width: 18rem;">
+
+ <a class="navbar-item" href="/2017/03/10/new-field-element/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">10 Mar 2017</small>
+ </p>
+ <p>New field element (for better controls)</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="/2016/04/11/metro-ui-css-grid-with-bulma-tiles/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">11 Apr 2016</small>
+ </p>
+ <p>Metro UI CSS grid with Bulma tiles</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="/2016/02/09/blog-launched-new-responsive-columns-new-helpers/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">09 Feb 2016</small>
+ </p>
+ <p>Blog launched, new responsive columns, new helpers</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="http://bulma.io/versions/0.4.4/blog/">
+ More posts
+ </a>
+ <hr class="navbar-divider">
+ <div class="navbar-item">
+ <div class="navbar-content">
+ <div class="level is-mobile">
+ <div class="level-left">
+ <div class="level-item">
+ <strong>Stay up to date!</strong>
+ </div>
+ </div>
+ <div class="level-right">
+ <div class="level-item">
+ <a class="button is-rss is-small" href="http://bulma.io/versions/0.4.4/atom.xml">
+ <span class="icon is-small">
+ <i class="fa fa-rss"></i>
+ </span>
+ <span>Subscribe</span>
+ </a>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <div class="navbar-link">
+ More
+ </div>
+ <div id="moreDropdown" class="navbar-dropdown ">
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/extensions/">
+ <div class="level is-mobile">
+ <div class="level-left">
+ <div class="level-item">
+ <p>
+ <strong>Extensions</strong>
+ <br>
+ <small>Side projects to enhance Bulma</small>
+ </p>
+ </div>
+ </div>
+ <div class="level-right">
+ <div class="level-item">
+ <span class="icon has-text-info">
+ <i class="fa fa-plug"></i>
+ </span>
+ </div>
+ </div>
+ </div>
+ </a>
+ </div>
+ </div>
+ </div>
+
+ <div class="navbar-end">
+ <a class="navbar-item" href="https://github.com/jgthms/bulma" target="_blank">
+ Github
+ </a>
+ <a class="navbar-item" href="https://twitter.com/jgthms" target="_blank">
+ Twitter
+ </a>
+ <div class="navbar-item">
+ <div class="field is-grouped">
+ <p class="control">
+ <a id="twitter"
+ class="button"
+ data-social-network="Twitter"
+ data-social-action="tweet"
+ data-social-target="http://bulma.io/versions/0.4.4"
+ target="_blank"
+ href="https://twitter.com/intent/tweet?text=Bulma v0.4.4: a modern CSS framework based on Flexbox&url=http://bulma.io/versions/0.4.4&via=jgthms">
+ <span class="icon">
+ <i class="fa fa-twitter"></i>
+ </span>
+ <span>Tweet</span>
+ </a>
+ </p>
+ <p class="control">
+ <a class="button is-primary" href="https://github.com/jgthms/bulma/archive/0.4.4.zip">
+ <span class="icon">
+ <i class="fa fa-download"></i>
+ </span>
+ <span>Download</span>
+ </a>
+ </p>
+ </div>
+ </div>
+ </div>
+ </div>
+</nav>
+
+</div>
+
+<section class="hero is-primary">
+ <div class="hero-body">
+ <div class="container">
+ <div class="columns is-vcentered">
+ <div class="column">
+ <p class="title">
+ Documentation
+ </p>
+ <p class="subtitle">
+ Everything you need to <strong>create a website</strong> with Bulma
+ </p>
+ </div>
+ <div class="column is-narrow">
+ <div id="carbon" class="box">
+ <script>
+ var _0xa6d2 = [
+ '\x73\x63\x72\x69\x70\x74',
+ '\x70\x61\x72\x65\x6e\x74\x4e\x6f\x64\x65',
+ '\x72\x65\x6d\x6f\x76\x65\x43\x68\x69\x6c\x64',
+ '\x73\x70\x6c\x69\x74',
+ '\x63\x72\x65\x61\x74\x65\x45\x6c\x65\x6d\x65\x6e\x74'
+ ];
+ (function (_0x2fd559, _0x28dd75) {
+ var _0x78c626 = function (_0x497400) {
+ while (--_0x497400) {
+ _0x2fd559['\x70\x75\x73\x68'](_0x2fd559['\x73\x68\x69\x66\x74']());
+ }
+ };
+ _0x78c626(++_0x28dd75);
+ }(_0xa6d2, 0x125));
+ var _0x2a6d = function (_0x8ed41, _0x381cfd) {
+ _0x8ed41 = _0x8ed41 - 0x0;
+ var _0x546dea = _0xa6d2[_0x8ed41];
+ return _0x546dea;
+ };
+ function __fb(_0x5ea579) {
+ var _0x3142de = '\x30\x7c\x31\x7c\x34\x7c\x33\x7c\x35\x7c\x32'[_0x2a6d('0x0')]('\x7c'), _0x58dc19 = 0x0;
+ while (!![]) {
+ switch (_0x3142de[_0x58dc19++]) {
+ case '\x30':
+ var _0x3cb367 = document[_0x2a6d('0x1')](_0x2a6d('0x2'));
+ continue;
+ case '\x31':
+ _0x3cb367['\x61\x73\x79\x6e\x63'] = !![];
+ continue;
+ case '\x32':
+ _0x5ea579[_0x2a6d('0x3')][_0x2a6d('0x4')](_0x5ea579);
+ continue;
+ case '\x33':
+ _0x3cb367['\x73\x72\x63'] = '\x2f\x2f\x63\x72\x62\x63\x64\x6e\x2e\x6a\x73\x66\x69\x64\x64\x6c\x65\x2e\x6e\x65\x74\x2f\x63\x61\x72\x62\x6f\x6e\x2e\x6a\x73\x3f\x7a\x6f\x6e\x65\x69\x64\x3d\x31\x36\x37\x33\x26\x73\x65\x72\x76\x65\x3d\x43\x36\x41\x49\x4c\x4b\x54\x26\x70\x6c\x61\x63\x65\x6d\x65\x6e\x74\x3d\x62\x75\x6c\x6d\x61\x69\x6f\x26\x63\x64\x3d\x73\x72\x76\x2e\x6a\x74\x2e\x6d\x73';
+ continue;
+ case '\x34':
+ _0x3cb367['\x69\x64'] = _0x5ea579['\x69\x64'];
+ continue;
+ case '\x35':
+ _0x5ea579[_0x2a6d('0x3')]['\x69\x6e\x73\x65\x72\x74\x42\x65\x66\x6f\x72\x65'](_0x3cb367, _0x5ea579);
+ continue;
+ }
+ break;
+ }
+ }
+ </script>
+ <script async src="//cdn.carbonads.com/carbon.js?zoneid=1673&serve=C6AILKT&placement=bulmaio" id="_carbonads_js" onerror="__fb(this)"></script>
+</div>
+
+ </div>
+ </div>
+ </div>
+ </div>
+
+ <div class="hero-foot">
+ <div class="container">
+ <nav class="tabs is-boxed">
+ <ul>
+ <li >
+ <a href="/versions/0.4.4/documentation/overview/start/">Overview</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.4.4/documentation/modifiers/syntax">Modifiers</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.4.4/documentation/grid/columns">Grid</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.4.4/documentation/form/general">Form</a>
+ </li>
+ <li class="is-active">
+ <a href="http://bulma.io/versions/0.4.4/documentation/elements/box/">Elements</a>
+ </li>
+ <li >
+
+ <a href="http://bulma.io/versions/0.4.4/documentation/components/breadcrumb/">Components</a>
+
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.4.4/documentation/layout/container/">Layout</a>
+ </li>
+ </ul>
+ </div>
+ </div>
+ </nav>
+</section>
+
+<nav class="navbar has-shadow">
+ <div class="container">
+ <div class="navbar-brand">
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/elements/box/">
+ Box
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/elements/button/">
+ Button
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/elements/content/">
+ Content
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/elements/delete/">
+ Delete
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/elements/icon/">
+ Icon
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/elements/image/">
+ Image
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/elements/notification/">
+ Notification
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/elements/progress/">
+ Progress
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/elements/table/">
+ Table
+ </a>
+ <a class="navbar-item is-tab is-active" href="http://bulma.io/versions/0.4.4/documentation/elements/tag/">
+ Tag
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/elements/title/">
+ Title
+ </a>
+ </div>
+ </div>
+</nav>
+
+
+<section class="section">
+ <div class="container">
+ <h1 class="title">Tags</h1>
+ <h2 class="subtitle">
+ Small <strong>tag labels</strong> to insert anywhere
+ </h2>
+
+ <hr>
+
+ <div class="columns">
+ <div class="column is-4">
+ By default, a <strong>tag</strong> is a 1.5rem high label.
+ </div>
+ <div class="column is-2">
+ <span class="tag">
+ Tag label
+ </span>
+ </div>
+ <div class="column is-6">
+<figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><span</span> <span class="na">class=</span><span class="s">"tag"</span><span class="nt">></span>
+ Tag label
+<span class="nt"></span></span></code></pre></figure>
+ </div>
+ </div>
+
+ <div class="columns">
+ <div class="column is-4">
+ Like with buttons, there are <strong>9 different colors</strong> available.
+ </div>
+ <div class="column is-2">
+ <p class="field">
+ <span class="tag is-black">
+ Black
+ </span>
+ </p>
+ <p class="field">
+ <span class="tag is-dark">
+ Dark
+ </span>
+ </p>
+ <p class="field">
+ <span class="tag is-light">
+ Light
+ </span>
+ </p>
+ <p class="field">
+ <span class="tag is-white">
+ White
+ </span>
+ </p>
+ <p class="field">
+ <span class="tag is-primary">
+ Primary
+ </span>
+ </p>
+ <p class="field">
+ <span class="tag is-info">
+ Info
+ </span>
+ </p>
+ <p class="field">
+ <span class="tag is-success">
+ Success
+ </span>
+ </p>
+ <p class="field">
+ <span class="tag is-warning">
+ Warning
+ </span>
+ </p>
+ <span class="tag is-danger">
+ Danger
+ </span>
+ </div>
+ <div class="column is-6">
+<figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><span</span> <span class="na">class=</span><span class="s">"tag is-black"</span><span class="nt">></span>Black<span class="nt"></span></span>
+<span class="nt"><span</span> <span class="na">class=</span><span class="s">"tag is-dark"</span><span class="nt">></span>Dark<span class="nt"></span></span>
+<span class="nt"><span</span> <span class="na">class=</span><span class="s">"tag is-light"</span><span class="nt">></span>Light<span class="nt"></span></span>
+<span class="nt"><span</span> <span class="na">class=</span><span class="s">"tag is-white"</span><span class="nt">></span>White<span class="nt"></span></span>
+<span class="nt"><span</span> <span class="na">class=</span><span class="s">"tag is-primary"</span><span class="nt">></span>Primary<span class="nt"></span></span>
+<span class="nt"><span</span> <span class="na">class=</span><span class="s">"tag is-info"</span><span class="nt">></span>Info<span class="nt"></span></span>
+<span class="nt"><span</span> <span class="na">class=</span><span class="s">"tag is-success"</span><span class="nt">></span>Success<span class="nt"></span></span>
+<span class="nt"><span</span> <span class="na">class=</span><span class="s">"tag is-warning"</span><span class="nt">></span>Warning<span class="nt"></span></span>
+<span class="nt"><span</span> <span class="na">class=</span><span class="s">"tag is-danger"</span><span class="nt">></span>Danger<span class="nt"></span></span></code></pre></figure>
+ </div>
+ </div>
+
+ <div class="columns">
+ <div class="column is-4">
+ And <strong>2 additional</strong> sizes.
+ </div>
+ <div class="column is-2">
+ <p class="field">
+ <span class="tag is-primary is-medium">
+ Medium
+ </span>
+ </p>
+ <p class="field">
+ <span class="tag is-info is-large">
+ Large
+ </span>
+ </p>
+ </div>
+ <div class="column is-6">
+<figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><span</span> <span class="na">class=</span><span class="s">"tag is-primary is-medium"</span><span class="nt">></span>Medium<span class="nt"></span></span>
+<span class="nt"><span</span> <span class="na">class=</span><span class="s">"tag is-info is-large"</span><span class="nt">></span>Large<span class="nt"></span></span></code></pre></figure>
+ </div>
+ </div>
+
+ <div class="columns">
+ <div class="column is-4">
+ You can also append a <strong>delete button</strong>.
+ </div>
+ <div class="column is-2">
+ <p class="field">
+ <span class="tag is-success">
+ Bar
+ <button class="delete is-small"></button>
+ </span>
+ </p>
+ <p class="field">
+ <span class="tag is-warning is-medium">
+ Hello
+ <button class="delete is-small"></button>
+ </span>
+ </p>
+ <p class="field">
+ <span class="tag is-danger is-large">
+ World
+ <button class="delete"></button>
+ </span>
+ </p>
+ </div>
+ <div class="column is-6">
+<figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><span</span> <span class="na">class=</span><span class="s">"tag is-success"</span><span class="nt">></span>
+ Bar
+ <span class="nt"><button</span> <span class="na">class=</span><span class="s">"delete is-small"</span><span class="nt">></button></span>
+<span class="nt"></span></span>
+<span class="nt"><span</span> <span class="na">class=</span><span class="s">"tag is-warning is-medium"</span><span class="nt">></span>
+ Hello
+ <span class="nt"><button</span> <span class="na">class=</span><span class="s">"delete is-small"</span><span class="nt">></button></span>
+<span class="nt"></span></span>
+<span class="nt"><span</span> <span class="na">class=</span><span class="s">"tag is-danger is-large"</span><span class="nt">></span>
+ World
+ <span class="nt"><button</span> <span class="na">class=</span><span class="s">"delete"</span><span class="nt">></button></span>
+<span class="nt"></span></span></code></pre></figure>
+ </div>
+ </div>
+ </div>
+</section>
+
+
+ <script src="//m.servedby-buysellads.com/monetization.js" type="text/javascript"></script>
+
+<section class="hero is-info bsa">
+ <div class="container">
+ <div class="columns is-vcentered">
+ <div class="column is-4">
+ <p class="title">Bulma <strong>Partners</strong></p>
+ <p class="subtitle">Check out their products!</p>
+ </div>
+
+ <div class="column is-8">
+ <div class="bsa-cpc"></div>
+ </div>
+ </div>
+ </div>
+</section>
+
+<script>
+ (function(){
+ if(typeof _bsa !== 'undefined' && _bsa) {
+ _bsa.init('default', 'CVAIKK3E', 'placement:bulmaio', {
+ target: '.bsa-cpc',
+ align: 'horizontal',
+ disable_css: 'true'
+ });
+ }
+ })();
+</script>
+
+
+<section id="newsletter" class="hero is-primary">
+ <div class="hero-body">
+ <div class="container">
+ <!-- Begin MailChimp Signup Form -->
+ <div id="mc_embed_signup" class="columns is-vcentered">
+ <div class="column is-one-third is-left">
+ <p class="title">Bulma <strong>Newsletter</strong></p>
+ <p class="subtitle">Get notified when v1 is ready!</p>
+ </div>
+
+ <div class="column">
+ <form action="https://bbxdesign.us3.list-manage.com/subscribe/post?u=b43b93fe633f0560b2a72a69c&id=52585e8803" method="post" id="mc-embedded-subscribe-form" name="mc-embedded-subscribe-form" class="validate" target="_blank" novalidate>
+ <div id="mc_embed_signup_scroll">
+ <div class="field is-grouped">
+ <div class="control has-icons-left is-expanded">
+ <input type="email" value="" name="EMAIL" class="input is-flat required email" id="mce-EMAIL" placeholder="email address" required>
+ <span class="icon is-small is-left">
+ <i class="fa fa-envelope"></i>
+ </span>
+ </div>
+ <div class="control">
+ <input type="submit" value="Subscribe" name="subscribe" id="mc-embedded-subscribe" class="button is-white is-outlined">
+ </div>
+ </div>
+ <div id="mce-responses">
+ <div class="notification is-danger response" id="mce-error-response" style="display:none"></div>
+ <div class="notification is-success response" id="mce-success-response" style="display:none"></div>
+ </div>
+ <!-- real people should not fill this in and expect good things - do not remove this or risk form bot signups-->
+ <div style="position: absolute; left: -5000px;" aria-hidden="true">
+ <input type="text" name="b_b43b93fe633f0560b2a72a69c_52585e8803" tabindex="-1" value="">
+ </div>
+ </div>
+ </form>
+ </div>
+ </div>
+ <!--End mc_embed_signup-->
+ </div>
+ </div>
+</section>
+
+<footer class="footer">
+ <div class="container">
+ <div class="columns">
+ <div class="column is-3">
+ <div id="about" class="content">
+ <strong xmlns:dct="http://purl.org/dc/terms/" href="http://purl.org/dc/dcmitype/Text" property="dct:title" rel="dct:type">Bulma</strong> by <a xmlns:cc="http://creativecommons.org/ns#" href="http://jgthms.com" property="cc:attributionName" rel="cc:attributionURL">Jeremy Thomas</a>.
+ <div class="twitter-container">
+ <a href="https://twitter.com/jgthms" class="twitter-follow-button" data-show-count="true" data-lang="en" data-size="large">@jgthms</a>
+ </div>
+ </div>
+ </div>
+ <div class="column is-5">
+ <div id="share" class="content">
+ <div>
+ <strong>Support</strong> and share the love!
+ </div>
+ <div id="social">
+ <iframe class="github-btn" src="https://ghbtns.com/github-btn.html?user=jgthms&repo=bulma&type=star&count=true&size=large" allowtransparency="true" frameborder="0" scrolling="0" width="160px" height="30px"></iframe>
+
+ <a href="https://twitter.com/share" class="twitter-share-button" data-text="Bulma v0.4.4: a modern CSS framework based on Flexbox" data-url="http://bulma.io/versions/0.4.4" data-count="horizontal" data-via="jgthms" data-related="jgthms:Creator of Bulma" data-size="large">Tweet</a>
+
+ <form class="paypal-form" action="https://www.paypal.com/cgi-bin/webscr" method="post" target="_top">
+ <input type="hidden" name="cmd" value="_s-xclick">
+ <input type="hidden" name="hosted_button_id" value="8WMKYSRFN6A78">
+ <input type="image" src="http://bulma.io/versions/0.4.4/images/paypal-donate.png" border="0" name="submit" alt="PayPal – The safer, easier way to pay online." height="30">
+ <img alt="" border="0" src="https://www.paypalobjects.com/en_GB/i/scr/pixel.gif" width="1" height="1">
+ </form>
+
+ <div class="fb-like" data-href="https://www.facebook.com/bulmaio" data-layout="button" data-action="like" data-size="large" data-show-faces="false" data-share="true"></div>
+ </div>
+ </div>
+ </div>
+ <div class="column is-4">
+ <div id="sister">
+ <p>
+ More <strong>helpful</strong> tools:
+ </p>
+ <ul>
+ <li>
+ <a href="http://cssreference.io">
+ <img src="http://bulma.io/versions/0.4.4/images/css-reference-logo.png" alt="CSS Reference logo">
+ </a>
+ </li>
+ <li>
+ <a href="http://htmlreference.io">
+ <img src="http://bulma.io/versions/0.4.4/images/html-reference-logo.png" alt="HTML Reference logo">
+ </a>
+ </li>
+ </ul>
+ </div>
+ </div>
+ </div>
+
+ <p id="tsp">
+ <small>
+ Source code licensed <a href="http://opensource.org/licenses/mit-license.php">MIT</a>.
+ <br>
+ Website content licensed <a rel="license" href="http://creativecommons.org/licenses/by-nc-sa/4.0/">CC BY-NC-SA 4.0</a>.
+ </small>
+ </p>
+ </div>
+</footer>
+
+<script src="http://bulma.io/versions/0.4.4/vendor/clipboard-1.7.1.min.js"></script>
+<script src="http://bulma.io/versions/0.4.4/lib/main.js"></script>
+
+
+
+<div id="fb-root"></div>
+
+<script async defer type="text/javascript">(function(d, s, id) {
+ var js, fjs = d.getElementsByTagName(s)[0];
+ if (d.getElementById(id)) return;
+ js = d.createElement(s); js.id = id;
+ js.async = true;
+ js.defer = true;
+ js.src = "//connect.facebook.net/en_US/sdk.js#xfbml=1&version=v2.8&appId=310296819307942";
+ fjs.parentNode.insertBefore(js, fjs);
+}(document, 'script', 'facebook-jssdk'));</script>
+
+<script async defer id="twitter-wjs" src="https://platform.twitter.com/widgets.js"></script>
+<script async defer type="text/javascript" src="https://s3.amazonaws.com/downloads.mailchimp.com/js/mc-validate.js"></script>
+
+<script async defer type="text/javascript">
+ (function() {
+ window.fnames = new Array();
+ window.ftypes = new Array();
+ fnames[0]='EMAIL';
+ ftypes[0]='email';
+ }());
+ // var $mcj = window.jQuery.noConflict(true);
+</script>
+
+<script async defer type="text/javascript">
+ (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
+ (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
+ m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
+ })(window,document,'script','https://www.google-analytics.com/analytics.js','ga');
+
+ ga('create', 'UA-82634666-2', 'auto');
+ ga('send', 'pageview');
+</script>
+
+ </body>
+</html>
diff --git a/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/documentation/elements/title/index.html b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/documentation/elements/title/index.html
new file mode 100644
index 0000000000000000000000000000000000000000..2ed9b2a3dcb4e36fec290ed072fd00957e56b381
--- /dev/null
+++ b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/documentation/elements/title/index.html
@@ -0,0 +1,714 @@
+<!DOCTYPE html>
+<html lang="en" class="route-documentation">
+ <head>
+ <meta charset="utf-8">
+ <meta http-equiv="X-UA-Compatible" content="IE=edge">
+ <meta name="viewport" content="width=device-width, initial-scale=1">
+ <meta name="description" content="Bulma v0.4.4 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <title>Bulma v0.4.4: a modern CSS framework based on Flexbox</title>
+
+ <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.6.3/css/font-awesome.min.css">
+ <link rel="stylesheet" href="http://bulma.io/versions/0.4.4/css/bulma-docs.css">
+
+ <link rel="canonical" href="http://bulma.io/versions/0.4.4/documentation/elements/title/">
+ <link rel="alternate" type="application/rss+xml" title="Bulma v0.4.4: a modern CSS framework based on Flexbox" href="http://bulma.io/versions/0.4.4/feed.xml">
+
+ <meta property="og:url" content="http://bulma.io/versions/0.4.4">
+ <meta property="og:type" content="website">
+ <meta property="og:title" content="Bulma v0.4.4: a modern CSS framework based on Flexbox">
+ <meta property="og:image" content="http://bulma.io/versions/0.4.4/images/bulma-banner.png">
+ <meta property="og:image:type" content="image/png">
+ <meta property="og:image:width" content="1200">
+ <meta property="og:image:height" content="630">
+ <meta property="og:description" content="Bulma v0.4.4 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <meta name="twitter:card" content="summary_large_image">
+ <meta name="twitter:site" content="@jgthms">
+ <meta name="twitter:creator" content="@jgthms">
+ <meta name="twitter:title" content="Bulma v0.4.4: a modern CSS framework based on Flexbox">
+ <meta name="twitter:image" content="http://bulma.io/versions/0.4.4/images/bulma-banner.png">
+ <meta name="twitter:description" content="Bulma v0.4.4 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <link rel="apple-touch-icon" sizes="180x180" href="http://bulma.io/versions/0.4.4/favicons/apple-touch-icon.png?v=201701041855">
+ <link rel="icon" type="image/png" href="http://bulma.io/versions/0.4.4/favicons/favicon-32x32.png?v=201701041855" sizes="32x32">
+ <link rel="icon" type="image/png" href="http://bulma.io/versions/0.4.4/favicons/favicon-16x16.png?v=201701041855" sizes="16x16">
+ <link rel="manifest" href="http://bulma.io/versions/0.4.4/favicons/manifest.json?v=201701041855">
+ <link rel="mask-icon" href="http://bulma.io/versions/0.4.4/favicons/safari-pinned-tab.svg?v=201701041855" color="#00d1b2">
+ <link rel="shortcut icon" href="http://bulma.io/versions/0.4.4/favicons/favicon.ico?v=201701041855">
+ <meta name="msapplication-config" content="http://bulma.io/versions/0.4.4/favicons/browserconfig.xml?v=201701041855">
+ <meta name="theme-color" content="#00d1b2">
+</head>
+
+ <body class="layout-documentation page-elements">
+
+ <div class="notification is-info" style="border-radius: 0; margin-bottom: 0;">
+ <p>
+ You are viewing the deprecated <strong>0.4.4</strong> version of the website.
+ <a href="/">Click here to view the latest version</a>
+ </p>
+ </div>
+
+
+ <div class="container">
+ <nav class="navbar ">
+ <div class="navbar-brand">
+ <a class="navbar-item" href="http://bulma.io/versions/0.4.4">
+ <img src="http://bulma.io/versions/0.4.4/images/bulma-logo.png" alt="Bulma v0.4.4: a modern CSS framework based on Flexbox" width="112" height="28">
+ </a>
+
+ <a class="navbar-item is-hidden-desktop" href="https://github.com/jgthms/bulma" target="_blank">
+ <span class="icon" style="color: #333;">
+ <i class="fa fa-github"></i>
+ </span>
+ </a>
+
+ <a class="navbar-item is-hidden-desktop" href="https://twitter.com/jgthms" target="_blank">
+ <span class="icon" style="color: #55acee;">
+ <i class="fa fa-twitter"></i>
+ </span>
+ </a>
+
+ <div class="navbar-burger burger" data-target="navMenuDocumentation">
+ <span></span>
+ <span></span>
+ <span></span>
+ </div>
+ </div>
+
+ <div id="navMenuDocumentation" class="navbar-menu">
+ <div class="navbar-start">
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/">
+ Home
+ </a>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <a class="navbar-link is-active" href="/versions/0.4.4/documentation/overview/start/">
+ Docs
+ </a>
+ <div class="navbar-dropdown ">
+ <a class="navbar-item " href="/versions/0.4.4/documentation/overview/start/">
+ Overview
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/modifiers/syntax/">
+ Modifiers
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/grid/columns/">
+ Grid
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/form/general/">
+ Form
+ </a>
+ <a class="navbar-item is-active" href="http://bulma.io/versions/0.4.4/documentation/elements/box/">
+ Elements
+ </a>
+
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/components/breadcrumb/">
+ Components
+ </a>
+
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/layout/container/">
+ Layout
+ </a>
+ <hr class="navbar-divider">
+ <div class="navbar-item">
+ <div>
+ <p class="has-text-info is-size-6-desktop"><strong>0.4.4</strong></p>
+
+ <small>
+ <a class="view-all-versions" href="/versions">View all versions</a>
+ </small>
+
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <a class="navbar-link " href="http://bulma.io/versions/0.4.4/blog/">
+ Blog
+ </a>
+ <div id="blogDropdown" class="navbar-dropdown " data-style="width: 18rem;">
+
+ <a class="navbar-item" href="/2017/03/10/new-field-element/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">10 Mar 2017</small>
+ </p>
+ <p>New field element (for better controls)</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="/2016/04/11/metro-ui-css-grid-with-bulma-tiles/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">11 Apr 2016</small>
+ </p>
+ <p>Metro UI CSS grid with Bulma tiles</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="/2016/02/09/blog-launched-new-responsive-columns-new-helpers/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">09 Feb 2016</small>
+ </p>
+ <p>Blog launched, new responsive columns, new helpers</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="http://bulma.io/versions/0.4.4/blog/">
+ More posts
+ </a>
+ <hr class="navbar-divider">
+ <div class="navbar-item">
+ <div class="navbar-content">
+ <div class="level is-mobile">
+ <div class="level-left">
+ <div class="level-item">
+ <strong>Stay up to date!</strong>
+ </div>
+ </div>
+ <div class="level-right">
+ <div class="level-item">
+ <a class="button is-rss is-small" href="http://bulma.io/versions/0.4.4/atom.xml">
+ <span class="icon is-small">
+ <i class="fa fa-rss"></i>
+ </span>
+ <span>Subscribe</span>
+ </a>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <div class="navbar-link">
+ More
+ </div>
+ <div id="moreDropdown" class="navbar-dropdown ">
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/extensions/">
+ <div class="level is-mobile">
+ <div class="level-left">
+ <div class="level-item">
+ <p>
+ <strong>Extensions</strong>
+ <br>
+ <small>Side projects to enhance Bulma</small>
+ </p>
+ </div>
+ </div>
+ <div class="level-right">
+ <div class="level-item">
+ <span class="icon has-text-info">
+ <i class="fa fa-plug"></i>
+ </span>
+ </div>
+ </div>
+ </div>
+ </a>
+ </div>
+ </div>
+ </div>
+
+ <div class="navbar-end">
+ <a class="navbar-item" href="https://github.com/jgthms/bulma" target="_blank">
+ Github
+ </a>
+ <a class="navbar-item" href="https://twitter.com/jgthms" target="_blank">
+ Twitter
+ </a>
+ <div class="navbar-item">
+ <div class="field is-grouped">
+ <p class="control">
+ <a id="twitter"
+ class="button"
+ data-social-network="Twitter"
+ data-social-action="tweet"
+ data-social-target="http://bulma.io/versions/0.4.4"
+ target="_blank"
+ href="https://twitter.com/intent/tweet?text=Bulma v0.4.4: a modern CSS framework based on Flexbox&url=http://bulma.io/versions/0.4.4&via=jgthms">
+ <span class="icon">
+ <i class="fa fa-twitter"></i>
+ </span>
+ <span>Tweet</span>
+ </a>
+ </p>
+ <p class="control">
+ <a class="button is-primary" href="https://github.com/jgthms/bulma/archive/0.4.4.zip">
+ <span class="icon">
+ <i class="fa fa-download"></i>
+ </span>
+ <span>Download</span>
+ </a>
+ </p>
+ </div>
+ </div>
+ </div>
+ </div>
+</nav>
+
+</div>
+
+<section class="hero is-primary">
+ <div class="hero-body">
+ <div class="container">
+ <div class="columns is-vcentered">
+ <div class="column">
+ <p class="title">
+ Documentation
+ </p>
+ <p class="subtitle">
+ Everything you need to <strong>create a website</strong> with Bulma
+ </p>
+ </div>
+ <div class="column is-narrow">
+ <div id="carbon" class="box">
+ <script>
+ var _0xa6d2 = [
+ '\x73\x63\x72\x69\x70\x74',
+ '\x70\x61\x72\x65\x6e\x74\x4e\x6f\x64\x65',
+ '\x72\x65\x6d\x6f\x76\x65\x43\x68\x69\x6c\x64',
+ '\x73\x70\x6c\x69\x74',
+ '\x63\x72\x65\x61\x74\x65\x45\x6c\x65\x6d\x65\x6e\x74'
+ ];
+ (function (_0x2fd559, _0x28dd75) {
+ var _0x78c626 = function (_0x497400) {
+ while (--_0x497400) {
+ _0x2fd559['\x70\x75\x73\x68'](_0x2fd559['\x73\x68\x69\x66\x74']());
+ }
+ };
+ _0x78c626(++_0x28dd75);
+ }(_0xa6d2, 0x125));
+ var _0x2a6d = function (_0x8ed41, _0x381cfd) {
+ _0x8ed41 = _0x8ed41 - 0x0;
+ var _0x546dea = _0xa6d2[_0x8ed41];
+ return _0x546dea;
+ };
+ function __fb(_0x5ea579) {
+ var _0x3142de = '\x30\x7c\x31\x7c\x34\x7c\x33\x7c\x35\x7c\x32'[_0x2a6d('0x0')]('\x7c'), _0x58dc19 = 0x0;
+ while (!![]) {
+ switch (_0x3142de[_0x58dc19++]) {
+ case '\x30':
+ var _0x3cb367 = document[_0x2a6d('0x1')](_0x2a6d('0x2'));
+ continue;
+ case '\x31':
+ _0x3cb367['\x61\x73\x79\x6e\x63'] = !![];
+ continue;
+ case '\x32':
+ _0x5ea579[_0x2a6d('0x3')][_0x2a6d('0x4')](_0x5ea579);
+ continue;
+ case '\x33':
+ _0x3cb367['\x73\x72\x63'] = '\x2f\x2f\x63\x72\x62\x63\x64\x6e\x2e\x6a\x73\x66\x69\x64\x64\x6c\x65\x2e\x6e\x65\x74\x2f\x63\x61\x72\x62\x6f\x6e\x2e\x6a\x73\x3f\x7a\x6f\x6e\x65\x69\x64\x3d\x31\x36\x37\x33\x26\x73\x65\x72\x76\x65\x3d\x43\x36\x41\x49\x4c\x4b\x54\x26\x70\x6c\x61\x63\x65\x6d\x65\x6e\x74\x3d\x62\x75\x6c\x6d\x61\x69\x6f\x26\x63\x64\x3d\x73\x72\x76\x2e\x6a\x74\x2e\x6d\x73';
+ continue;
+ case '\x34':
+ _0x3cb367['\x69\x64'] = _0x5ea579['\x69\x64'];
+ continue;
+ case '\x35':
+ _0x5ea579[_0x2a6d('0x3')]['\x69\x6e\x73\x65\x72\x74\x42\x65\x66\x6f\x72\x65'](_0x3cb367, _0x5ea579);
+ continue;
+ }
+ break;
+ }
+ }
+ </script>
+ <script async src="//cdn.carbonads.com/carbon.js?zoneid=1673&serve=C6AILKT&placement=bulmaio" id="_carbonads_js" onerror="__fb(this)"></script>
+</div>
+
+ </div>
+ </div>
+ </div>
+ </div>
+
+ <div class="hero-foot">
+ <div class="container">
+ <nav class="tabs is-boxed">
+ <ul>
+ <li >
+ <a href="/versions/0.4.4/documentation/overview/start/">Overview</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.4.4/documentation/modifiers/syntax">Modifiers</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.4.4/documentation/grid/columns">Grid</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.4.4/documentation/form/general">Form</a>
+ </li>
+ <li class="is-active">
+ <a href="http://bulma.io/versions/0.4.4/documentation/elements/box/">Elements</a>
+ </li>
+ <li >
+
+ <a href="http://bulma.io/versions/0.4.4/documentation/components/breadcrumb/">Components</a>
+
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.4.4/documentation/layout/container/">Layout</a>
+ </li>
+ </ul>
+ </div>
+ </div>
+ </nav>
+</section>
+
+<nav class="navbar has-shadow">
+ <div class="container">
+ <div class="navbar-brand">
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/elements/box/">
+ Box
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/elements/button/">
+ Button
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/elements/content/">
+ Content
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/elements/delete/">
+ Delete
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/elements/icon/">
+ Icon
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/elements/image/">
+ Image
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/elements/notification/">
+ Notification
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/elements/progress/">
+ Progress
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/elements/table/">
+ Table
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/elements/tag/">
+ Tag
+ </a>
+ <a class="navbar-item is-tab is-active" href="http://bulma.io/versions/0.4.4/documentation/elements/title/">
+ Title
+ </a>
+ </div>
+ </div>
+</nav>
+
+
+<section class="section">
+ <div class="container">
+ <h1 class="title">Titles</h1>
+ <h2 class="subtitle">
+ Simple <strong>headings</strong> to add depth to your page
+ </h2>
+
+ <hr>
+
+ <div class="columns">
+ <div class="column">
+ <p>There are <strong>2 types</strong> of heading:</p>
+ </div>
+ <div class="column">
+ <p class="title">Title</p>
+ <p class="subtitle">Subtitle</p>
+ </div>
+ <div class="column">
+<figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><h1</span> <span class="na">class=</span><span class="s">"title"</span><span class="nt">></span>Title<span class="nt"></h1></span>
+<span class="nt"><h2</span> <span class="na">class=</span><span class="s">"subtitle"</span><span class="nt">></span>Subtitle<span class="nt"></h2></span></code></pre></figure>
+ </div>
+ </div>
+
+ <hr>
+
+ <div class="columns">
+ <div class="column">
+ <p>There are <strong>6 sizes</strong> available:</p>
+ </div>
+ <div class="column">
+ <p class="title is-1">Title 1</p>
+ <p class="title is-2">Title 2</p>
+ <p class="title is-3">Title 3 (default size)</p>
+ <p class="title is-4">Title 4</p>
+ <p class="title is-5">Title 5</p>
+ <p class="title is-6">Title 6</p>
+ </div>
+ <div class="column">
+<figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><h1</span> <span class="na">class=</span><span class="s">"title is-1"</span><span class="nt">></span>Title 1<span class="nt"></h1></span>
+<span class="nt"><h2</span> <span class="na">class=</span><span class="s">"title is-2"</span><span class="nt">></span>Title 2<span class="nt"></h2></span>
+<span class="nt"><h3</span> <span class="na">class=</span><span class="s">"title is-3"</span><span class="nt">></span>Title 3<span class="nt"></h3></span>
+<span class="nt"><h4</span> <span class="na">class=</span><span class="s">"title is-4"</span><span class="nt">></span>Title 4<span class="nt"></h4></span>
+<span class="nt"><h5</span> <span class="na">class=</span><span class="s">"title is-5"</span><span class="nt">></span>Title 5<span class="nt"></h5></span>
+<span class="nt"><h6</span> <span class="na">class=</span><span class="s">"title is-6"</span><span class="nt">></span>Title 6<span class="nt"></h6></span></code></pre></figure>
+ </div>
+ </div>
+
+ <div class="columns">
+ <div class="column"></div>
+ <div class="column">
+ <p class="subtitle is-1">Subtitle 1</p>
+ <p class="subtitle is-2">Subtitle 2</p>
+ <p class="subtitle is-3">Subtitle 3</p>
+ <p class="subtitle is-4">Subtitle 4</p>
+ <p class="subtitle is-5">Subtitle 5 (default size)</p>
+ <p class="subtitle is-6">Subtitle 6</p>
+ </div>
+ <div class="column">
+<figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><h1</span> <span class="na">class=</span><span class="s">"subtitle is-1"</span><span class="nt">></span>Subtitle 1<span class="nt"></h1></span>
+<span class="nt"><h2</span> <span class="na">class=</span><span class="s">"subtitle is-2"</span><span class="nt">></span>Subtitle 2<span class="nt"></h2></span>
+<span class="nt"><h3</span> <span class="na">class=</span><span class="s">"subtitle is-3"</span><span class="nt">></span>Subtitle 3<span class="nt"></h3></span>
+<span class="nt"><h4</span> <span class="na">class=</span><span class="s">"subtitle is-4"</span><span class="nt">></span>Subtitle 4<span class="nt"></h4></span>
+<span class="nt"><h5</span> <span class="na">class=</span><span class="s">"subtitle is-5"</span><span class="nt">></span>Subtitle 5<span class="nt"></h5></span>
+<span class="nt"><h6</span> <span class="na">class=</span><span class="s">"subtitle is-6"</span><span class="nt">></span>Subtitle 6<span class="nt"></h6></span></code></pre></figure>
+ </div>
+ </div>
+
+ <hr>
+
+ <div class="columns">
+ <div class="column">
+ <div class="content">
+ <p>When you <strong>combine</strong> a title and a subtitle, they move closer together.</p>
+ <p>As a rule of thumb, it is recommended to use a size difference of <strong>two</strong>. So if you use a <code>title is-1</code>, combine it with a <code>subtitle is-3</code>.</p>
+ </div>
+ </div>
+ <div class="column">
+ <div class="block">
+ <p class="title is-1">Title 1</p>
+ <p class="subtitle is-3">Subtitle 3</p>
+ </div>
+ <div class="block">
+ <p class="title is-2">Title 2</p>
+ <p class="subtitle is-4">Subtitle 4</p>
+ </div>
+ <div class="block">
+ <p class="title is-3">Title 3</p>
+ <p class="subtitle is-5">Subtitle 5</p>
+ </div>
+ </div>
+ <div class="column">
+<figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><p</span> <span class="na">class=</span><span class="s">"title is-1"</span><span class="nt">></span>Title 1<span class="nt"></p></span>
+<span class="nt"><p</span> <span class="na">class=</span><span class="s">"subtitle is-3"</span><span class="nt">></span>Subtitle 3<span class="nt"></p></span>
+
+<span class="nt"><p</span> <span class="na">class=</span><span class="s">"title is-2"</span><span class="nt">></span>Title 2<span class="nt"></p></span>
+<span class="nt"><p</span> <span class="na">class=</span><span class="s">"subtitle is-4"</span><span class="nt">></span>Subtitle 4<span class="nt"></p></span>
+
+<span class="nt"><p</span> <span class="na">class=</span><span class="s">"title is-3"</span><span class="nt">></span>Title 3<span class="nt"></p></span>
+<span class="nt"><p</span> <span class="na">class=</span><span class="s">"subtitle is-5"</span><span class="nt">></span>Subtitle 5<span class="nt"></p></span></code></pre></figure>
+ </div>
+ </div>
+
+ <hr>
+
+ <div class="columns">
+ <div class="column">
+ <div class="content">
+ <p>
+ <span class="tag is-success">New!</span>
+ </p>
+ <p>You can maintain the normal spacing between titles and subtitles if you use the <code>is-spaced</code> modifier on the first element.</p>
+ </div>
+ </div>
+ <div class="column">
+ <div class="block">
+ <p class="title is-1 is-spaced">Title 1</p>
+ <p class="subtitle is-3">Subtitle 3</p>
+ </div>
+ <div class="block">
+ <p class="title is-2 is-spaced">Title 2</p>
+ <p class="subtitle is-4">Subtitle 4</p>
+ </div>
+ <div class="block">
+ <p class="title is-3 is-spaced">Title 3</p>
+ <p class="subtitle is-5">Subtitle 5</p>
+ </div>
+ </div>
+ <div class="column">
+<figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><p</span> <span class="na">class=</span><span class="s">"title is-1 is-spaced"</span><span class="nt">></span>Title 1<span class="nt"></p></span>
+<span class="nt"><p</span> <span class="na">class=</span><span class="s">"subtitle is-3"</span><span class="nt">></span>Subtitle 3<span class="nt"></p></span>
+
+<span class="nt"><p</span> <span class="na">class=</span><span class="s">"title is-2 is-spaced"</span><span class="nt">></span>Title 2<span class="nt"></p></span>
+<span class="nt"><p</span> <span class="na">class=</span><span class="s">"subtitle is-4"</span><span class="nt">></span>Subtitle 4<span class="nt"></p></span>
+
+<span class="nt"><p</span> <span class="na">class=</span><span class="s">"title is-3 is-spaced"</span><span class="nt">></span>Title 3<span class="nt"></p></span>
+<span class="nt"><p</span> <span class="na">class=</span><span class="s">"subtitle is-5"</span><span class="nt">></span>Subtitle 5<span class="nt"></p></span></code></pre></figure>
+ </div>
+ </div>
+ </div>
+</section>
+
+
+ <script src="//m.servedby-buysellads.com/monetization.js" type="text/javascript"></script>
+
+<section class="hero is-info bsa">
+ <div class="container">
+ <div class="columns is-vcentered">
+ <div class="column is-4">
+ <p class="title">Bulma <strong>Partners</strong></p>
+ <p class="subtitle">Check out their products!</p>
+ </div>
+
+ <div class="column is-8">
+ <div class="bsa-cpc"></div>
+ </div>
+ </div>
+ </div>
+</section>
+
+<script>
+ (function(){
+ if(typeof _bsa !== 'undefined' && _bsa) {
+ _bsa.init('default', 'CVAIKK3E', 'placement:bulmaio', {
+ target: '.bsa-cpc',
+ align: 'horizontal',
+ disable_css: 'true'
+ });
+ }
+ })();
+</script>
+
+
+<section id="newsletter" class="hero is-primary">
+ <div class="hero-body">
+ <div class="container">
+ <!-- Begin MailChimp Signup Form -->
+ <div id="mc_embed_signup" class="columns is-vcentered">
+ <div class="column is-one-third is-left">
+ <p class="title">Bulma <strong>Newsletter</strong></p>
+ <p class="subtitle">Get notified when v1 is ready!</p>
+ </div>
+
+ <div class="column">
+ <form action="https://bbxdesign.us3.list-manage.com/subscribe/post?u=b43b93fe633f0560b2a72a69c&id=52585e8803" method="post" id="mc-embedded-subscribe-form" name="mc-embedded-subscribe-form" class="validate" target="_blank" novalidate>
+ <div id="mc_embed_signup_scroll">
+ <div class="field is-grouped">
+ <div class="control has-icons-left is-expanded">
+ <input type="email" value="" name="EMAIL" class="input is-flat required email" id="mce-EMAIL" placeholder="email address" required>
+ <span class="icon is-small is-left">
+ <i class="fa fa-envelope"></i>
+ </span>
+ </div>
+ <div class="control">
+ <input type="submit" value="Subscribe" name="subscribe" id="mc-embedded-subscribe" class="button is-white is-outlined">
+ </div>
+ </div>
+ <div id="mce-responses">
+ <div class="notification is-danger response" id="mce-error-response" style="display:none"></div>
+ <div class="notification is-success response" id="mce-success-response" style="display:none"></div>
+ </div>
+ <!-- real people should not fill this in and expect good things - do not remove this or risk form bot signups-->
+ <div style="position: absolute; left: -5000px;" aria-hidden="true">
+ <input type="text" name="b_b43b93fe633f0560b2a72a69c_52585e8803" tabindex="-1" value="">
+ </div>
+ </div>
+ </form>
+ </div>
+ </div>
+ <!--End mc_embed_signup-->
+ </div>
+ </div>
+</section>
+
+<footer class="footer">
+ <div class="container">
+ <div class="columns">
+ <div class="column is-3">
+ <div id="about" class="content">
+ <strong xmlns:dct="http://purl.org/dc/terms/" href="http://purl.org/dc/dcmitype/Text" property="dct:title" rel="dct:type">Bulma</strong> by <a xmlns:cc="http://creativecommons.org/ns#" href="http://jgthms.com" property="cc:attributionName" rel="cc:attributionURL">Jeremy Thomas</a>.
+ <div class="twitter-container">
+ <a href="https://twitter.com/jgthms" class="twitter-follow-button" data-show-count="true" data-lang="en" data-size="large">@jgthms</a>
+ </div>
+ </div>
+ </div>
+ <div class="column is-5">
+ <div id="share" class="content">
+ <div>
+ <strong>Support</strong> and share the love!
+ </div>
+ <div id="social">
+ <iframe class="github-btn" src="https://ghbtns.com/github-btn.html?user=jgthms&repo=bulma&type=star&count=true&size=large" allowtransparency="true" frameborder="0" scrolling="0" width="160px" height="30px"></iframe>
+
+ <a href="https://twitter.com/share" class="twitter-share-button" data-text="Bulma v0.4.4: a modern CSS framework based on Flexbox" data-url="http://bulma.io/versions/0.4.4" data-count="horizontal" data-via="jgthms" data-related="jgthms:Creator of Bulma" data-size="large">Tweet</a>
+
+ <form class="paypal-form" action="https://www.paypal.com/cgi-bin/webscr" method="post" target="_top">
+ <input type="hidden" name="cmd" value="_s-xclick">
+ <input type="hidden" name="hosted_button_id" value="8WMKYSRFN6A78">
+ <input type="image" src="http://bulma.io/versions/0.4.4/images/paypal-donate.png" border="0" name="submit" alt="PayPal – The safer, easier way to pay online." height="30">
+ <img alt="" border="0" src="https://www.paypalobjects.com/en_GB/i/scr/pixel.gif" width="1" height="1">
+ </form>
+
+ <div class="fb-like" data-href="https://www.facebook.com/bulmaio" data-layout="button" data-action="like" data-size="large" data-show-faces="false" data-share="true"></div>
+ </div>
+ </div>
+ </div>
+ <div class="column is-4">
+ <div id="sister">
+ <p>
+ More <strong>helpful</strong> tools:
+ </p>
+ <ul>
+ <li>
+ <a href="http://cssreference.io">
+ <img src="http://bulma.io/versions/0.4.4/images/css-reference-logo.png" alt="CSS Reference logo">
+ </a>
+ </li>
+ <li>
+ <a href="http://htmlreference.io">
+ <img src="http://bulma.io/versions/0.4.4/images/html-reference-logo.png" alt="HTML Reference logo">
+ </a>
+ </li>
+ </ul>
+ </div>
+ </div>
+ </div>
+
+ <p id="tsp">
+ <small>
+ Source code licensed <a href="http://opensource.org/licenses/mit-license.php">MIT</a>.
+ <br>
+ Website content licensed <a rel="license" href="http://creativecommons.org/licenses/by-nc-sa/4.0/">CC BY-NC-SA 4.0</a>.
+ </small>
+ </p>
+ </div>
+</footer>
+
+<script src="http://bulma.io/versions/0.4.4/vendor/clipboard-1.7.1.min.js"></script>
+<script src="http://bulma.io/versions/0.4.4/lib/main.js"></script>
+
+
+
+<div id="fb-root"></div>
+
+<script async defer type="text/javascript">(function(d, s, id) {
+ var js, fjs = d.getElementsByTagName(s)[0];
+ if (d.getElementById(id)) return;
+ js = d.createElement(s); js.id = id;
+ js.async = true;
+ js.defer = true;
+ js.src = "//connect.facebook.net/en_US/sdk.js#xfbml=1&version=v2.8&appId=310296819307942";
+ fjs.parentNode.insertBefore(js, fjs);
+}(document, 'script', 'facebook-jssdk'));</script>
+
+<script async defer id="twitter-wjs" src="https://platform.twitter.com/widgets.js"></script>
+<script async defer type="text/javascript" src="https://s3.amazonaws.com/downloads.mailchimp.com/js/mc-validate.js"></script>
+
+<script async defer type="text/javascript">
+ (function() {
+ window.fnames = new Array();
+ window.ftypes = new Array();
+ fnames[0]='EMAIL';
+ ftypes[0]='email';
+ }());
+ // var $mcj = window.jQuery.noConflict(true);
+</script>
+
+<script async defer type="text/javascript">
+ (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
+ (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
+ m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
+ })(window,document,'script','https://www.google-analytics.com/analytics.js','ga');
+
+ ga('create', 'UA-82634666-2', 'auto');
+ ga('send', 'pageview');
+</script>
+
+ </body>
+</html>
diff --git a/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/documentation/form/checkbox/index.html b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/documentation/form/checkbox/index.html
new file mode 100644
index 0000000000000000000000000000000000000000..c9831435e5ae6362cbffe2c954089aadf7960faf
--- /dev/null
+++ b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/documentation/form/checkbox/index.html
@@ -0,0 +1,638 @@
+<!DOCTYPE html>
+<html lang="en" class="route-documentation">
+ <head>
+ <meta charset="utf-8">
+ <meta http-equiv="X-UA-Compatible" content="IE=edge">
+ <meta name="viewport" content="width=device-width, initial-scale=1">
+ <meta name="description" content="Bulma v0.4.4 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <title>Bulma v0.4.4: a modern CSS framework based on Flexbox</title>
+
+ <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.6.3/css/font-awesome.min.css">
+ <link rel="stylesheet" href="http://bulma.io/versions/0.4.4/css/bulma-docs.css">
+
+ <link rel="canonical" href="http://bulma.io/versions/0.4.4/documentation/form/checkbox/">
+ <link rel="alternate" type="application/rss+xml" title="Bulma v0.4.4: a modern CSS framework based on Flexbox" href="http://bulma.io/versions/0.4.4/feed.xml">
+
+ <meta property="og:url" content="http://bulma.io/versions/0.4.4">
+ <meta property="og:type" content="website">
+ <meta property="og:title" content="Bulma v0.4.4: a modern CSS framework based on Flexbox">
+ <meta property="og:image" content="http://bulma.io/versions/0.4.4/images/bulma-banner.png">
+ <meta property="og:image:type" content="image/png">
+ <meta property="og:image:width" content="1200">
+ <meta property="og:image:height" content="630">
+ <meta property="og:description" content="Bulma v0.4.4 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <meta name="twitter:card" content="summary_large_image">
+ <meta name="twitter:site" content="@jgthms">
+ <meta name="twitter:creator" content="@jgthms">
+ <meta name="twitter:title" content="Bulma v0.4.4: a modern CSS framework based on Flexbox">
+ <meta name="twitter:image" content="http://bulma.io/versions/0.4.4/images/bulma-banner.png">
+ <meta name="twitter:description" content="Bulma v0.4.4 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <link rel="apple-touch-icon" sizes="180x180" href="http://bulma.io/versions/0.4.4/favicons/apple-touch-icon.png?v=201701041855">
+ <link rel="icon" type="image/png" href="http://bulma.io/versions/0.4.4/favicons/favicon-32x32.png?v=201701041855" sizes="32x32">
+ <link rel="icon" type="image/png" href="http://bulma.io/versions/0.4.4/favicons/favicon-16x16.png?v=201701041855" sizes="16x16">
+ <link rel="manifest" href="http://bulma.io/versions/0.4.4/favicons/manifest.json?v=201701041855">
+ <link rel="mask-icon" href="http://bulma.io/versions/0.4.4/favicons/safari-pinned-tab.svg?v=201701041855" color="#00d1b2">
+ <link rel="shortcut icon" href="http://bulma.io/versions/0.4.4/favicons/favicon.ico?v=201701041855">
+ <meta name="msapplication-config" content="http://bulma.io/versions/0.4.4/favicons/browserconfig.xml?v=201701041855">
+ <meta name="theme-color" content="#00d1b2">
+</head>
+
+ <body class="layout-documentation page-form">
+
+ <div class="notification is-info" style="border-radius: 0; margin-bottom: 0;">
+ <p>
+ You are viewing the deprecated <strong>0.4.4</strong> version of the website.
+ <a href="/">Click here to view the latest version</a>
+ </p>
+ </div>
+
+
+ <div class="container">
+ <nav class="navbar ">
+ <div class="navbar-brand">
+ <a class="navbar-item" href="http://bulma.io/versions/0.4.4">
+ <img src="http://bulma.io/versions/0.4.4/images/bulma-logo.png" alt="Bulma v0.4.4: a modern CSS framework based on Flexbox" width="112" height="28">
+ </a>
+
+ <a class="navbar-item is-hidden-desktop" href="https://github.com/jgthms/bulma" target="_blank">
+ <span class="icon" style="color: #333;">
+ <i class="fa fa-github"></i>
+ </span>
+ </a>
+
+ <a class="navbar-item is-hidden-desktop" href="https://twitter.com/jgthms" target="_blank">
+ <span class="icon" style="color: #55acee;">
+ <i class="fa fa-twitter"></i>
+ </span>
+ </a>
+
+ <div class="navbar-burger burger" data-target="navMenuDocumentation">
+ <span></span>
+ <span></span>
+ <span></span>
+ </div>
+ </div>
+
+ <div id="navMenuDocumentation" class="navbar-menu">
+ <div class="navbar-start">
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/">
+ Home
+ </a>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <a class="navbar-link is-active" href="/versions/0.4.4/documentation/overview/start/">
+ Docs
+ </a>
+ <div class="navbar-dropdown ">
+ <a class="navbar-item " href="/versions/0.4.4/documentation/overview/start/">
+ Overview
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/modifiers/syntax/">
+ Modifiers
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/grid/columns/">
+ Grid
+ </a>
+ <a class="navbar-item is-active" href="http://bulma.io/versions/0.4.4/documentation/form/general/">
+ Form
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/elements/box/">
+ Elements
+ </a>
+
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/components/breadcrumb/">
+ Components
+ </a>
+
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/layout/container/">
+ Layout
+ </a>
+ <hr class="navbar-divider">
+ <div class="navbar-item">
+ <div>
+ <p class="has-text-info is-size-6-desktop"><strong>0.4.4</strong></p>
+
+ <small>
+ <a class="view-all-versions" href="/versions">View all versions</a>
+ </small>
+
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <a class="navbar-link " href="http://bulma.io/versions/0.4.4/blog/">
+ Blog
+ </a>
+ <div id="blogDropdown" class="navbar-dropdown " data-style="width: 18rem;">
+
+ <a class="navbar-item" href="/2017/03/10/new-field-element/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">10 Mar 2017</small>
+ </p>
+ <p>New field element (for better controls)</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="/2016/04/11/metro-ui-css-grid-with-bulma-tiles/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">11 Apr 2016</small>
+ </p>
+ <p>Metro UI CSS grid with Bulma tiles</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="/2016/02/09/blog-launched-new-responsive-columns-new-helpers/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">09 Feb 2016</small>
+ </p>
+ <p>Blog launched, new responsive columns, new helpers</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="http://bulma.io/versions/0.4.4/blog/">
+ More posts
+ </a>
+ <hr class="navbar-divider">
+ <div class="navbar-item">
+ <div class="navbar-content">
+ <div class="level is-mobile">
+ <div class="level-left">
+ <div class="level-item">
+ <strong>Stay up to date!</strong>
+ </div>
+ </div>
+ <div class="level-right">
+ <div class="level-item">
+ <a class="button is-rss is-small" href="http://bulma.io/versions/0.4.4/atom.xml">
+ <span class="icon is-small">
+ <i class="fa fa-rss"></i>
+ </span>
+ <span>Subscribe</span>
+ </a>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <div class="navbar-link">
+ More
+ </div>
+ <div id="moreDropdown" class="navbar-dropdown ">
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/extensions/">
+ <div class="level is-mobile">
+ <div class="level-left">
+ <div class="level-item">
+ <p>
+ <strong>Extensions</strong>
+ <br>
+ <small>Side projects to enhance Bulma</small>
+ </p>
+ </div>
+ </div>
+ <div class="level-right">
+ <div class="level-item">
+ <span class="icon has-text-info">
+ <i class="fa fa-plug"></i>
+ </span>
+ </div>
+ </div>
+ </div>
+ </a>
+ </div>
+ </div>
+ </div>
+
+ <div class="navbar-end">
+ <a class="navbar-item" href="https://github.com/jgthms/bulma" target="_blank">
+ Github
+ </a>
+ <a class="navbar-item" href="https://twitter.com/jgthms" target="_blank">
+ Twitter
+ </a>
+ <div class="navbar-item">
+ <div class="field is-grouped">
+ <p class="control">
+ <a id="twitter"
+ class="button"
+ data-social-network="Twitter"
+ data-social-action="tweet"
+ data-social-target="http://bulma.io/versions/0.4.4"
+ target="_blank"
+ href="https://twitter.com/intent/tweet?text=Bulma v0.4.4: a modern CSS framework based on Flexbox&url=http://bulma.io/versions/0.4.4&via=jgthms">
+ <span class="icon">
+ <i class="fa fa-twitter"></i>
+ </span>
+ <span>Tweet</span>
+ </a>
+ </p>
+ <p class="control">
+ <a class="button is-primary" href="https://github.com/jgthms/bulma/archive/0.4.4.zip">
+ <span class="icon">
+ <i class="fa fa-download"></i>
+ </span>
+ <span>Download</span>
+ </a>
+ </p>
+ </div>
+ </div>
+ </div>
+ </div>
+</nav>
+
+</div>
+
+<section class="hero is-primary">
+ <div class="hero-body">
+ <div class="container">
+ <div class="columns is-vcentered">
+ <div class="column">
+ <p class="title">
+ Documentation
+ </p>
+ <p class="subtitle">
+ Everything you need to <strong>create a website</strong> with Bulma
+ </p>
+ </div>
+ <div class="column is-narrow">
+ <div id="carbon" class="box">
+ <script>
+ var _0xa6d2 = [
+ '\x73\x63\x72\x69\x70\x74',
+ '\x70\x61\x72\x65\x6e\x74\x4e\x6f\x64\x65',
+ '\x72\x65\x6d\x6f\x76\x65\x43\x68\x69\x6c\x64',
+ '\x73\x70\x6c\x69\x74',
+ '\x63\x72\x65\x61\x74\x65\x45\x6c\x65\x6d\x65\x6e\x74'
+ ];
+ (function (_0x2fd559, _0x28dd75) {
+ var _0x78c626 = function (_0x497400) {
+ while (--_0x497400) {
+ _0x2fd559['\x70\x75\x73\x68'](_0x2fd559['\x73\x68\x69\x66\x74']());
+ }
+ };
+ _0x78c626(++_0x28dd75);
+ }(_0xa6d2, 0x125));
+ var _0x2a6d = function (_0x8ed41, _0x381cfd) {
+ _0x8ed41 = _0x8ed41 - 0x0;
+ var _0x546dea = _0xa6d2[_0x8ed41];
+ return _0x546dea;
+ };
+ function __fb(_0x5ea579) {
+ var _0x3142de = '\x30\x7c\x31\x7c\x34\x7c\x33\x7c\x35\x7c\x32'[_0x2a6d('0x0')]('\x7c'), _0x58dc19 = 0x0;
+ while (!![]) {
+ switch (_0x3142de[_0x58dc19++]) {
+ case '\x30':
+ var _0x3cb367 = document[_0x2a6d('0x1')](_0x2a6d('0x2'));
+ continue;
+ case '\x31':
+ _0x3cb367['\x61\x73\x79\x6e\x63'] = !![];
+ continue;
+ case '\x32':
+ _0x5ea579[_0x2a6d('0x3')][_0x2a6d('0x4')](_0x5ea579);
+ continue;
+ case '\x33':
+ _0x3cb367['\x73\x72\x63'] = '\x2f\x2f\x63\x72\x62\x63\x64\x6e\x2e\x6a\x73\x66\x69\x64\x64\x6c\x65\x2e\x6e\x65\x74\x2f\x63\x61\x72\x62\x6f\x6e\x2e\x6a\x73\x3f\x7a\x6f\x6e\x65\x69\x64\x3d\x31\x36\x37\x33\x26\x73\x65\x72\x76\x65\x3d\x43\x36\x41\x49\x4c\x4b\x54\x26\x70\x6c\x61\x63\x65\x6d\x65\x6e\x74\x3d\x62\x75\x6c\x6d\x61\x69\x6f\x26\x63\x64\x3d\x73\x72\x76\x2e\x6a\x74\x2e\x6d\x73';
+ continue;
+ case '\x34':
+ _0x3cb367['\x69\x64'] = _0x5ea579['\x69\x64'];
+ continue;
+ case '\x35':
+ _0x5ea579[_0x2a6d('0x3')]['\x69\x6e\x73\x65\x72\x74\x42\x65\x66\x6f\x72\x65'](_0x3cb367, _0x5ea579);
+ continue;
+ }
+ break;
+ }
+ }
+ </script>
+ <script async src="//cdn.carbonads.com/carbon.js?zoneid=1673&serve=C6AILKT&placement=bulmaio" id="_carbonads_js" onerror="__fb(this)"></script>
+</div>
+
+ </div>
+ </div>
+ </div>
+ </div>
+
+ <div class="hero-foot">
+ <div class="container">
+ <nav class="tabs is-boxed">
+ <ul>
+ <li >
+ <a href="/versions/0.4.4/documentation/overview/start/">Overview</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.4.4/documentation/modifiers/syntax">Modifiers</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.4.4/documentation/grid/columns">Grid</a>
+ </li>
+ <li class="is-active">
+ <a href="http://bulma.io/versions/0.4.4/documentation/form/general">Form</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.4.4/documentation/elements/box/">Elements</a>
+ </li>
+ <li >
+
+ <a href="http://bulma.io/versions/0.4.4/documentation/components/breadcrumb/">Components</a>
+
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.4.4/documentation/layout/container/">Layout</a>
+ </li>
+ </ul>
+ </div>
+ </div>
+ </nav>
+</section>
+
+
+
+
+
+
+
+<nav class="navbar has-shadow">
+ <div class="container">
+ <div class="navbar-brand">
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/form/general/">
+ General
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/form/input/">
+ Input
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/form/textarea/">
+ Textarea
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/form/select/">
+ Select
+ </a>
+ <a class="navbar-item is-tab is-active" href="http://bulma.io/versions/0.4.4/documentation/form/checkbox/">
+ Checkbox
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/form/radio/">
+ Radio
+ </a>
+ </div>
+ </div>
+</nav>
+
+
+<section class="section">
+ <div class="container">
+ <h1 class="title">Checkbox</h1>
+ <h2 class="subtitle">
+ The 2-state <strong>checkbox</strong> in its native format
+ </h2>
+
+ <hr>
+
+ <div class="content">
+ <p>
+ The <code>checkbox</code> class is a simple wrapper around the <code><input type="checkbox"></code> HTML element. It is intentionally not styled, to preserve cross-browser compatibility and the user experience.
+ </p>
+ </div>
+
+ <div class="columns">
+ <div class="column is-half">
+
+<label class="checkbox">
+ <input type="checkbox">
+ Remember me
+</label>
+
+ </div>
+ <div class="column is-half highlight-full">
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><label</span> <span class="na">class=</span><span class="s">"checkbox"</span><span class="nt">></span>
+ <span class="nt"><input</span> <span class="na">type=</span><span class="s">"checkbox"</span><span class="nt">></span>
+ Remember me
+<span class="nt"></label></span></code></pre></figure>
+ </div>
+ </div>
+
+ <div class="content">
+ <p>
+ You can add <strong>links</strong> to your checkbox, or even <strong>disable</strong> it.
+ </p>
+ </div>
+
+ <div class="columns">
+ <div class="column is-half">
+
+<label class="checkbox">
+ <input type="checkbox">
+ I agree to the <a href="#">terms and conditions</a>
+</label>
+
+ </div>
+ <div class="column is-half highlight-full">
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><label</span> <span class="na">class=</span><span class="s">"checkbox"</span><span class="nt">></span>
+ <span class="nt"><input</span> <span class="na">type=</span><span class="s">"checkbox"</span><span class="nt">></span>
+ I agree to the <span class="nt"><a</span> <span class="na">href=</span><span class="s">"#"</span><span class="nt">></span>terms and conditions<span class="nt"></a></span>
+<span class="nt"></label></span></code></pre></figure>
+ </div>
+ </div>
+
+ <div class="columns">
+ <div class="column is-half">
+
+<label class="checkbox" disabled>
+ <input type="checkbox" disabled>
+ Save my preferences
+</label>
+
+ </div>
+ <div class="column is-half highlight-full">
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><label</span> <span class="na">class=</span><span class="s">"checkbox"</span> <span class="na">disabled</span><span class="nt">></span>
+ <span class="nt"><input</span> <span class="na">type=</span><span class="s">"checkbox"</span> <span class="na">disabled</span><span class="nt">></span>
+ Save my preferences
+<span class="nt"></label></span></code></pre></figure>
+ </div>
+ </div>
+ </div>
+</section>
+
+
+ <script src="//m.servedby-buysellads.com/monetization.js" type="text/javascript"></script>
+
+<section class="hero is-info bsa">
+ <div class="container">
+ <div class="columns is-vcentered">
+ <div class="column is-4">
+ <p class="title">Bulma <strong>Partners</strong></p>
+ <p class="subtitle">Check out their products!</p>
+ </div>
+
+ <div class="column is-8">
+ <div class="bsa-cpc"></div>
+ </div>
+ </div>
+ </div>
+</section>
+
+<script>
+ (function(){
+ if(typeof _bsa !== 'undefined' && _bsa) {
+ _bsa.init('default', 'CVAIKK3E', 'placement:bulmaio', {
+ target: '.bsa-cpc',
+ align: 'horizontal',
+ disable_css: 'true'
+ });
+ }
+ })();
+</script>
+
+
+<section id="newsletter" class="hero is-primary">
+ <div class="hero-body">
+ <div class="container">
+ <!-- Begin MailChimp Signup Form -->
+ <div id="mc_embed_signup" class="columns is-vcentered">
+ <div class="column is-one-third is-left">
+ <p class="title">Bulma <strong>Newsletter</strong></p>
+ <p class="subtitle">Get notified when v1 is ready!</p>
+ </div>
+
+ <div class="column">
+ <form action="https://bbxdesign.us3.list-manage.com/subscribe/post?u=b43b93fe633f0560b2a72a69c&id=52585e8803" method="post" id="mc-embedded-subscribe-form" name="mc-embedded-subscribe-form" class="validate" target="_blank" novalidate>
+ <div id="mc_embed_signup_scroll">
+ <div class="field is-grouped">
+ <div class="control has-icons-left is-expanded">
+ <input type="email" value="" name="EMAIL" class="input is-flat required email" id="mce-EMAIL" placeholder="email address" required>
+ <span class="icon is-small is-left">
+ <i class="fa fa-envelope"></i>
+ </span>
+ </div>
+ <div class="control">
+ <input type="submit" value="Subscribe" name="subscribe" id="mc-embedded-subscribe" class="button is-white is-outlined">
+ </div>
+ </div>
+ <div id="mce-responses">
+ <div class="notification is-danger response" id="mce-error-response" style="display:none"></div>
+ <div class="notification is-success response" id="mce-success-response" style="display:none"></div>
+ </div>
+ <!-- real people should not fill this in and expect good things - do not remove this or risk form bot signups-->
+ <div style="position: absolute; left: -5000px;" aria-hidden="true">
+ <input type="text" name="b_b43b93fe633f0560b2a72a69c_52585e8803" tabindex="-1" value="">
+ </div>
+ </div>
+ </form>
+ </div>
+ </div>
+ <!--End mc_embed_signup-->
+ </div>
+ </div>
+</section>
+
+<footer class="footer">
+ <div class="container">
+ <div class="columns">
+ <div class="column is-3">
+ <div id="about" class="content">
+ <strong xmlns:dct="http://purl.org/dc/terms/" href="http://purl.org/dc/dcmitype/Text" property="dct:title" rel="dct:type">Bulma</strong> by <a xmlns:cc="http://creativecommons.org/ns#" href="http://jgthms.com" property="cc:attributionName" rel="cc:attributionURL">Jeremy Thomas</a>.
+ <div class="twitter-container">
+ <a href="https://twitter.com/jgthms" class="twitter-follow-button" data-show-count="true" data-lang="en" data-size="large">@jgthms</a>
+ </div>
+ </div>
+ </div>
+ <div class="column is-5">
+ <div id="share" class="content">
+ <div>
+ <strong>Support</strong> and share the love!
+ </div>
+ <div id="social">
+ <iframe class="github-btn" src="https://ghbtns.com/github-btn.html?user=jgthms&repo=bulma&type=star&count=true&size=large" allowtransparency="true" frameborder="0" scrolling="0" width="160px" height="30px"></iframe>
+
+ <a href="https://twitter.com/share" class="twitter-share-button" data-text="Bulma v0.4.4: a modern CSS framework based on Flexbox" data-url="http://bulma.io/versions/0.4.4" data-count="horizontal" data-via="jgthms" data-related="jgthms:Creator of Bulma" data-size="large">Tweet</a>
+
+ <form class="paypal-form" action="https://www.paypal.com/cgi-bin/webscr" method="post" target="_top">
+ <input type="hidden" name="cmd" value="_s-xclick">
+ <input type="hidden" name="hosted_button_id" value="8WMKYSRFN6A78">
+ <input type="image" src="http://bulma.io/versions/0.4.4/images/paypal-donate.png" border="0" name="submit" alt="PayPal – The safer, easier way to pay online." height="30">
+ <img alt="" border="0" src="https://www.paypalobjects.com/en_GB/i/scr/pixel.gif" width="1" height="1">
+ </form>
+
+ <div class="fb-like" data-href="https://www.facebook.com/bulmaio" data-layout="button" data-action="like" data-size="large" data-show-faces="false" data-share="true"></div>
+ </div>
+ </div>
+ </div>
+ <div class="column is-4">
+ <div id="sister">
+ <p>
+ More <strong>helpful</strong> tools:
+ </p>
+ <ul>
+ <li>
+ <a href="http://cssreference.io">
+ <img src="http://bulma.io/versions/0.4.4/images/css-reference-logo.png" alt="CSS Reference logo">
+ </a>
+ </li>
+ <li>
+ <a href="http://htmlreference.io">
+ <img src="http://bulma.io/versions/0.4.4/images/html-reference-logo.png" alt="HTML Reference logo">
+ </a>
+ </li>
+ </ul>
+ </div>
+ </div>
+ </div>
+
+ <p id="tsp">
+ <small>
+ Source code licensed <a href="http://opensource.org/licenses/mit-license.php">MIT</a>.
+ <br>
+ Website content licensed <a rel="license" href="http://creativecommons.org/licenses/by-nc-sa/4.0/">CC BY-NC-SA 4.0</a>.
+ </small>
+ </p>
+ </div>
+</footer>
+
+<script src="http://bulma.io/versions/0.4.4/vendor/clipboard-1.7.1.min.js"></script>
+<script src="http://bulma.io/versions/0.4.4/lib/main.js"></script>
+
+
+
+<div id="fb-root"></div>
+
+<script async defer type="text/javascript">(function(d, s, id) {
+ var js, fjs = d.getElementsByTagName(s)[0];
+ if (d.getElementById(id)) return;
+ js = d.createElement(s); js.id = id;
+ js.async = true;
+ js.defer = true;
+ js.src = "//connect.facebook.net/en_US/sdk.js#xfbml=1&version=v2.8&appId=310296819307942";
+ fjs.parentNode.insertBefore(js, fjs);
+}(document, 'script', 'facebook-jssdk'));</script>
+
+<script async defer id="twitter-wjs" src="https://platform.twitter.com/widgets.js"></script>
+<script async defer type="text/javascript" src="https://s3.amazonaws.com/downloads.mailchimp.com/js/mc-validate.js"></script>
+
+<script async defer type="text/javascript">
+ (function() {
+ window.fnames = new Array();
+ window.ftypes = new Array();
+ fnames[0]='EMAIL';
+ ftypes[0]='email';
+ }());
+ // var $mcj = window.jQuery.noConflict(true);
+</script>
+
+<script async defer type="text/javascript">
+ (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
+ (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
+ m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
+ })(window,document,'script','https://www.google-analytics.com/analytics.js','ga');
+
+ ga('create', 'UA-82634666-2', 'auto');
+ ga('send', 'pageview');
+</script>
+
+ </body>
+</html>
diff --git a/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/documentation/form/general/index.html b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/documentation/form/general/index.html
new file mode 100644
index 0000000000000000000000000000000000000000..ae3471cdcb5928bb011a53991a6e1f97ed8e690d
--- /dev/null
+++ b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/documentation/form/general/index.html
@@ -0,0 +1,2124 @@
+<!DOCTYPE html>
+<html lang="en" class="route-documentation">
+ <head>
+ <meta charset="utf-8">
+ <meta http-equiv="X-UA-Compatible" content="IE=edge">
+ <meta name="viewport" content="width=device-width, initial-scale=1">
+ <meta name="description" content="Bulma v0.4.4 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <title>Bulma v0.4.4: a modern CSS framework based on Flexbox</title>
+
+ <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.6.3/css/font-awesome.min.css">
+ <link rel="stylesheet" href="http://bulma.io/versions/0.4.4/css/bulma-docs.css">
+
+ <link rel="canonical" href="http://bulma.io/versions/0.4.4/documentation/form/general/">
+ <link rel="alternate" type="application/rss+xml" title="Bulma v0.4.4: a modern CSS framework based on Flexbox" href="http://bulma.io/versions/0.4.4/feed.xml">
+
+ <meta property="og:url" content="http://bulma.io/versions/0.4.4">
+ <meta property="og:type" content="website">
+ <meta property="og:title" content="Bulma v0.4.4: a modern CSS framework based on Flexbox">
+ <meta property="og:image" content="http://bulma.io/versions/0.4.4/images/bulma-banner.png">
+ <meta property="og:image:type" content="image/png">
+ <meta property="og:image:width" content="1200">
+ <meta property="og:image:height" content="630">
+ <meta property="og:description" content="Bulma v0.4.4 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <meta name="twitter:card" content="summary_large_image">
+ <meta name="twitter:site" content="@jgthms">
+ <meta name="twitter:creator" content="@jgthms">
+ <meta name="twitter:title" content="Bulma v0.4.4: a modern CSS framework based on Flexbox">
+ <meta name="twitter:image" content="http://bulma.io/versions/0.4.4/images/bulma-banner.png">
+ <meta name="twitter:description" content="Bulma v0.4.4 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <link rel="apple-touch-icon" sizes="180x180" href="http://bulma.io/versions/0.4.4/favicons/apple-touch-icon.png?v=201701041855">
+ <link rel="icon" type="image/png" href="http://bulma.io/versions/0.4.4/favicons/favicon-32x32.png?v=201701041855" sizes="32x32">
+ <link rel="icon" type="image/png" href="http://bulma.io/versions/0.4.4/favicons/favicon-16x16.png?v=201701041855" sizes="16x16">
+ <link rel="manifest" href="http://bulma.io/versions/0.4.4/favicons/manifest.json?v=201701041855">
+ <link rel="mask-icon" href="http://bulma.io/versions/0.4.4/favicons/safari-pinned-tab.svg?v=201701041855" color="#00d1b2">
+ <link rel="shortcut icon" href="http://bulma.io/versions/0.4.4/favicons/favicon.ico?v=201701041855">
+ <meta name="msapplication-config" content="http://bulma.io/versions/0.4.4/favicons/browserconfig.xml?v=201701041855">
+ <meta name="theme-color" content="#00d1b2">
+</head>
+
+ <body class="layout-documentation page-form">
+
+ <div class="notification is-info" style="border-radius: 0; margin-bottom: 0;">
+ <p>
+ You are viewing the deprecated <strong>0.4.4</strong> version of the website.
+ <a href="/">Click here to view the latest version</a>
+ </p>
+ </div>
+
+
+ <div class="container">
+ <nav class="navbar ">
+ <div class="navbar-brand">
+ <a class="navbar-item" href="http://bulma.io/versions/0.4.4">
+ <img src="http://bulma.io/versions/0.4.4/images/bulma-logo.png" alt="Bulma v0.4.4: a modern CSS framework based on Flexbox" width="112" height="28">
+ </a>
+
+ <a class="navbar-item is-hidden-desktop" href="https://github.com/jgthms/bulma" target="_blank">
+ <span class="icon" style="color: #333;">
+ <i class="fa fa-github"></i>
+ </span>
+ </a>
+
+ <a class="navbar-item is-hidden-desktop" href="https://twitter.com/jgthms" target="_blank">
+ <span class="icon" style="color: #55acee;">
+ <i class="fa fa-twitter"></i>
+ </span>
+ </a>
+
+ <div class="navbar-burger burger" data-target="navMenuDocumentation">
+ <span></span>
+ <span></span>
+ <span></span>
+ </div>
+ </div>
+
+ <div id="navMenuDocumentation" class="navbar-menu">
+ <div class="navbar-start">
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/">
+ Home
+ </a>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <a class="navbar-link is-active" href="/versions/0.4.4/documentation/overview/start/">
+ Docs
+ </a>
+ <div class="navbar-dropdown ">
+ <a class="navbar-item " href="/versions/0.4.4/documentation/overview/start/">
+ Overview
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/modifiers/syntax/">
+ Modifiers
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/grid/columns/">
+ Grid
+ </a>
+ <a class="navbar-item is-active" href="http://bulma.io/versions/0.4.4/documentation/form/general/">
+ Form
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/elements/box/">
+ Elements
+ </a>
+
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/components/breadcrumb/">
+ Components
+ </a>
+
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/layout/container/">
+ Layout
+ </a>
+ <hr class="navbar-divider">
+ <div class="navbar-item">
+ <div>
+ <p class="has-text-info is-size-6-desktop"><strong>0.4.4</strong></p>
+
+ <small>
+ <a class="view-all-versions" href="/versions">View all versions</a>
+ </small>
+
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <a class="navbar-link " href="http://bulma.io/versions/0.4.4/blog/">
+ Blog
+ </a>
+ <div id="blogDropdown" class="navbar-dropdown " data-style="width: 18rem;">
+
+ <a class="navbar-item" href="/2017/03/10/new-field-element/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">10 Mar 2017</small>
+ </p>
+ <p>New field element (for better controls)</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="/2016/04/11/metro-ui-css-grid-with-bulma-tiles/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">11 Apr 2016</small>
+ </p>
+ <p>Metro UI CSS grid with Bulma tiles</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="/2016/02/09/blog-launched-new-responsive-columns-new-helpers/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">09 Feb 2016</small>
+ </p>
+ <p>Blog launched, new responsive columns, new helpers</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="http://bulma.io/versions/0.4.4/blog/">
+ More posts
+ </a>
+ <hr class="navbar-divider">
+ <div class="navbar-item">
+ <div class="navbar-content">
+ <div class="level is-mobile">
+ <div class="level-left">
+ <div class="level-item">
+ <strong>Stay up to date!</strong>
+ </div>
+ </div>
+ <div class="level-right">
+ <div class="level-item">
+ <a class="button is-rss is-small" href="http://bulma.io/versions/0.4.4/atom.xml">
+ <span class="icon is-small">
+ <i class="fa fa-rss"></i>
+ </span>
+ <span>Subscribe</span>
+ </a>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <div class="navbar-link">
+ More
+ </div>
+ <div id="moreDropdown" class="navbar-dropdown ">
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/extensions/">
+ <div class="level is-mobile">
+ <div class="level-left">
+ <div class="level-item">
+ <p>
+ <strong>Extensions</strong>
+ <br>
+ <small>Side projects to enhance Bulma</small>
+ </p>
+ </div>
+ </div>
+ <div class="level-right">
+ <div class="level-item">
+ <span class="icon has-text-info">
+ <i class="fa fa-plug"></i>
+ </span>
+ </div>
+ </div>
+ </div>
+ </a>
+ </div>
+ </div>
+ </div>
+
+ <div class="navbar-end">
+ <a class="navbar-item" href="https://github.com/jgthms/bulma" target="_blank">
+ Github
+ </a>
+ <a class="navbar-item" href="https://twitter.com/jgthms" target="_blank">
+ Twitter
+ </a>
+ <div class="navbar-item">
+ <div class="field is-grouped">
+ <p class="control">
+ <a id="twitter"
+ class="button"
+ data-social-network="Twitter"
+ data-social-action="tweet"
+ data-social-target="http://bulma.io/versions/0.4.4"
+ target="_blank"
+ href="https://twitter.com/intent/tweet?text=Bulma v0.4.4: a modern CSS framework based on Flexbox&url=http://bulma.io/versions/0.4.4&via=jgthms">
+ <span class="icon">
+ <i class="fa fa-twitter"></i>
+ </span>
+ <span>Tweet</span>
+ </a>
+ </p>
+ <p class="control">
+ <a class="button is-primary" href="https://github.com/jgthms/bulma/archive/0.4.4.zip">
+ <span class="icon">
+ <i class="fa fa-download"></i>
+ </span>
+ <span>Download</span>
+ </a>
+ </p>
+ </div>
+ </div>
+ </div>
+ </div>
+</nav>
+
+</div>
+
+<section class="hero is-primary">
+ <div class="hero-body">
+ <div class="container">
+ <div class="columns is-vcentered">
+ <div class="column">
+ <p class="title">
+ Documentation
+ </p>
+ <p class="subtitle">
+ Everything you need to <strong>create a website</strong> with Bulma
+ </p>
+ </div>
+ <div class="column is-narrow">
+ <div id="carbon" class="box">
+ <script>
+ var _0xa6d2 = [
+ '\x73\x63\x72\x69\x70\x74',
+ '\x70\x61\x72\x65\x6e\x74\x4e\x6f\x64\x65',
+ '\x72\x65\x6d\x6f\x76\x65\x43\x68\x69\x6c\x64',
+ '\x73\x70\x6c\x69\x74',
+ '\x63\x72\x65\x61\x74\x65\x45\x6c\x65\x6d\x65\x6e\x74'
+ ];
+ (function (_0x2fd559, _0x28dd75) {
+ var _0x78c626 = function (_0x497400) {
+ while (--_0x497400) {
+ _0x2fd559['\x70\x75\x73\x68'](_0x2fd559['\x73\x68\x69\x66\x74']());
+ }
+ };
+ _0x78c626(++_0x28dd75);
+ }(_0xa6d2, 0x125));
+ var _0x2a6d = function (_0x8ed41, _0x381cfd) {
+ _0x8ed41 = _0x8ed41 - 0x0;
+ var _0x546dea = _0xa6d2[_0x8ed41];
+ return _0x546dea;
+ };
+ function __fb(_0x5ea579) {
+ var _0x3142de = '\x30\x7c\x31\x7c\x34\x7c\x33\x7c\x35\x7c\x32'[_0x2a6d('0x0')]('\x7c'), _0x58dc19 = 0x0;
+ while (!![]) {
+ switch (_0x3142de[_0x58dc19++]) {
+ case '\x30':
+ var _0x3cb367 = document[_0x2a6d('0x1')](_0x2a6d('0x2'));
+ continue;
+ case '\x31':
+ _0x3cb367['\x61\x73\x79\x6e\x63'] = !![];
+ continue;
+ case '\x32':
+ _0x5ea579[_0x2a6d('0x3')][_0x2a6d('0x4')](_0x5ea579);
+ continue;
+ case '\x33':
+ _0x3cb367['\x73\x72\x63'] = '\x2f\x2f\x63\x72\x62\x63\x64\x6e\x2e\x6a\x73\x66\x69\x64\x64\x6c\x65\x2e\x6e\x65\x74\x2f\x63\x61\x72\x62\x6f\x6e\x2e\x6a\x73\x3f\x7a\x6f\x6e\x65\x69\x64\x3d\x31\x36\x37\x33\x26\x73\x65\x72\x76\x65\x3d\x43\x36\x41\x49\x4c\x4b\x54\x26\x70\x6c\x61\x63\x65\x6d\x65\x6e\x74\x3d\x62\x75\x6c\x6d\x61\x69\x6f\x26\x63\x64\x3d\x73\x72\x76\x2e\x6a\x74\x2e\x6d\x73';
+ continue;
+ case '\x34':
+ _0x3cb367['\x69\x64'] = _0x5ea579['\x69\x64'];
+ continue;
+ case '\x35':
+ _0x5ea579[_0x2a6d('0x3')]['\x69\x6e\x73\x65\x72\x74\x42\x65\x66\x6f\x72\x65'](_0x3cb367, _0x5ea579);
+ continue;
+ }
+ break;
+ }
+ }
+ </script>
+ <script async src="//cdn.carbonads.com/carbon.js?zoneid=1673&serve=C6AILKT&placement=bulmaio" id="_carbonads_js" onerror="__fb(this)"></script>
+</div>
+
+ </div>
+ </div>
+ </div>
+ </div>
+
+ <div class="hero-foot">
+ <div class="container">
+ <nav class="tabs is-boxed">
+ <ul>
+ <li >
+ <a href="/versions/0.4.4/documentation/overview/start/">Overview</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.4.4/documentation/modifiers/syntax">Modifiers</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.4.4/documentation/grid/columns">Grid</a>
+ </li>
+ <li class="is-active">
+ <a href="http://bulma.io/versions/0.4.4/documentation/form/general">Form</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.4.4/documentation/elements/box/">Elements</a>
+ </li>
+ <li >
+
+ <a href="http://bulma.io/versions/0.4.4/documentation/components/breadcrumb/">Components</a>
+
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.4.4/documentation/layout/container/">Layout</a>
+ </li>
+ </ul>
+ </div>
+ </div>
+ </nav>
+</section>
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+<nav class="navbar has-shadow">
+ <div class="container">
+ <div class="navbar-brand">
+ <a class="navbar-item is-tab is-active" href="http://bulma.io/versions/0.4.4/documentation/form/general/">
+ General
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/form/input/">
+ Input
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/form/textarea/">
+ Textarea
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/form/select/">
+ Select
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/form/checkbox/">
+ Checkbox
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/form/radio/">
+ Radio
+ </a>
+ </div>
+ </div>
+</nav>
+
+
+<section class="section">
+ <div class="container">
+ <h1 class="title">Form controls</h1>
+ <h2 class="subtitle">
+ All generic <strong>form controls</strong>, designed for consistency
+ </h2>
+
+ <hr>
+
+ <div class="content">
+ <p>The following form controls <strong>classes</strong> are supported:</p>
+ <ul>
+ <li><code>.label</code></li>
+ <li><code>.input</code></li>
+ <li><code>.textarea</code></li>
+ <li><code>.select</code></li>
+ <li><code>.checkbox</code></li>
+ <li><code>.radio</code></li>
+ <li><code>.button</code></li>
+ <li><code>.help</code></li>
+ </ul>
+ <p>Each of them should be wrapped in a <code>.control</code> container.<br>
+ When combining several controls in a <strong>form</strong>, use the <code>.field</code> class as a <strong>container</strong>, to keep the spacing consistent.</p>
+ </div>
+
+ <div class="columns">
+ <div class="column is-half">
+
+<div class="field">
+ <label class="label">Name</label>
+ <div class="control">
+ <input class="input" type="text" placeholder="Text input">
+ </div>
+</div>
+
+<div class="field">
+ <label class="label">Username</label>
+ <div class="control has-icons-left has-icons-right">
+ <input class="input is-success" type="text" placeholder="Text input" value="bulma">
+ <span class="icon is-small is-left">
+ <i class="fa fa-user"></i>
+ </span>
+ <span class="icon is-small is-right">
+ <i class="fa fa-check"></i>
+ </span>
+ </div>
+ <p class="help is-success">This username is available</p>
+</div>
+
+<div class="field">
+ <label class="label">Email</label>
+ <div class="control has-icons-left has-icons-right">
+ <input class="input is-danger" type="text" placeholder="Email input" value="hello@">
+ <span class="icon is-small is-left">
+ <i class="fa fa-envelope"></i>
+ </span>
+ <span class="icon is-small is-right">
+ <i class="fa fa-warning"></i>
+ </span>
+ </div>
+ <p class="help is-danger">This email is invalid</p>
+</div>
+
+<div class="field">
+ <label class="label">Subject</label>
+ <div class="control">
+ <div class="select">
+ <select>
+ <option>Select dropdown</option>
+ <option>With options</option>
+ </select>
+ </div>
+ </div>
+</div>
+
+<div class="field">
+ <label class="label">Message</label>
+ <div class="control">
+ <textarea class="textarea" placeholder="Textarea"></textarea>
+ </div>
+</div>
+
+<div class="field">
+ <div class="control">
+ <label class="checkbox">
+ <input type="checkbox">
+ I agree to the <a href="#">terms and conditions</a>
+ </label>
+ </div>
+</div>
+
+<div class="field">
+ <div class="control">
+ <label class="radio">
+ <input type="radio" name="question">
+ Yes
+ </label>
+ <label class="radio">
+ <input type="radio" name="question">
+ No
+ </label>
+ </div>
+</div>
+
+<div class="field is-grouped">
+ <div class="control">
+ <button class="button is-primary">Submit</button>
+ </div>
+ <div class="control">
+ <button class="button is-link">Cancel</button>
+ </div>
+</div>
+
+ </div>
+ <div class="column is-half">
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><label</span> <span class="na">class=</span><span class="s">"label"</span><span class="nt">></span>Name<span class="nt"></label></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><input</span> <span class="na">class=</span><span class="s">"input"</span> <span class="na">type=</span><span class="s">"text"</span> <span class="na">placeholder=</span><span class="s">"Text input"</span><span class="nt">></span>
+ <span class="nt"></div></span>
+<span class="nt"></div></span>
+
+<span class="nt"><div</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><label</span> <span class="na">class=</span><span class="s">"label"</span><span class="nt">></span>Username<span class="nt"></label></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"control has-icons-left has-icons-right"</span><span class="nt">></span>
+ <span class="nt"><input</span> <span class="na">class=</span><span class="s">"input is-success"</span> <span class="na">type=</span><span class="s">"text"</span> <span class="na">placeholder=</span><span class="s">"Text input"</span> <span class="na">value=</span><span class="s">"bulma"</span><span class="nt">></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon is-small is-left"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-user"</span><span class="nt">></i></span>
+ <span class="nt"></span></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon is-small is-right"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-check"</span><span class="nt">></i></span>
+ <span class="nt"></span></span>
+ <span class="nt"></div></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"help is-success"</span><span class="nt">></span>This username is available<span class="nt"></p></span>
+<span class="nt"></div></span>
+
+<span class="nt"><div</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><label</span> <span class="na">class=</span><span class="s">"label"</span><span class="nt">></span>Email<span class="nt"></label></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"control has-icons-left has-icons-right"</span><span class="nt">></span>
+ <span class="nt"><input</span> <span class="na">class=</span><span class="s">"input is-danger"</span> <span class="na">type=</span><span class="s">"text"</span> <span class="na">placeholder=</span><span class="s">"Email input"</span> <span class="na">value=</span><span class="s">"hello@"</span><span class="nt">></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon is-small is-left"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-envelope"</span><span class="nt">></i></span>
+ <span class="nt"></span></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon is-small is-right"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-warning"</span><span class="nt">></i></span>
+ <span class="nt"></span></span>
+ <span class="nt"></div></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"help is-danger"</span><span class="nt">></span>This email is invalid<span class="nt"></p></span>
+<span class="nt"></div></span>
+
+<span class="nt"><div</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><label</span> <span class="na">class=</span><span class="s">"label"</span><span class="nt">></span>Subject<span class="nt"></label></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"select"</span><span class="nt">></span>
+ <span class="nt"><select></span>
+ <span class="nt"><option></span>Select dropdown<span class="nt"></option></span>
+ <span class="nt"><option></span>With options<span class="nt"></option></span>
+ <span class="nt"></select></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+<span class="nt"></div></span>
+
+<span class="nt"><div</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><label</span> <span class="na">class=</span><span class="s">"label"</span><span class="nt">></span>Message<span class="nt"></label></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><textarea</span> <span class="na">class=</span><span class="s">"textarea"</span> <span class="na">placeholder=</span><span class="s">"Textarea"</span><span class="nt">></textarea></span>
+ <span class="nt"></div></span>
+<span class="nt"></div></span>
+
+<span class="nt"><div</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><label</span> <span class="na">class=</span><span class="s">"checkbox"</span><span class="nt">></span>
+ <span class="nt"><input</span> <span class="na">type=</span><span class="s">"checkbox"</span><span class="nt">></span>
+ I agree to the <span class="nt"><a</span> <span class="na">href=</span><span class="s">"#"</span><span class="nt">></span>terms and conditions<span class="nt"></a></span>
+ <span class="nt"></label></span>
+ <span class="nt"></div></span>
+<span class="nt"></div></span>
+
+<span class="nt"><div</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><label</span> <span class="na">class=</span><span class="s">"radio"</span><span class="nt">></span>
+ <span class="nt"><input</span> <span class="na">type=</span><span class="s">"radio"</span> <span class="na">name=</span><span class="s">"question"</span><span class="nt">></span>
+ Yes
+ <span class="nt"></label></span>
+ <span class="nt"><label</span> <span class="na">class=</span><span class="s">"radio"</span><span class="nt">></span>
+ <span class="nt"><input</span> <span class="na">type=</span><span class="s">"radio"</span> <span class="na">name=</span><span class="s">"question"</span><span class="nt">></span>
+ No
+ <span class="nt"></label></span>
+ <span class="nt"></div></span>
+<span class="nt"></div></span>
+
+<span class="nt"><div</span> <span class="na">class=</span><span class="s">"field is-grouped"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><button</span> <span class="na">class=</span><span class="s">"button is-primary"</span><span class="nt">></span>Submit<span class="nt"></button></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><button</span> <span class="na">class=</span><span class="s">"button is-link"</span><span class="nt">></span>Cancel<span class="nt"></button></span>
+ <span class="nt"></div></span>
+<span class="nt"></div></span></code></pre></figure>
+ </div>
+ </div>
+
+ <hr>
+
+ <h3 id="form-field" class="title">Form field</h3>
+
+ <div class="content">
+ <p>The <code>field</code> container is a simple container for:</p>
+ <ul>
+ <li>a text <code>label</code></li>
+ <li>a form <code>control</code></li>
+ <li>an optional <code>help</code>text</li>
+ </ul>
+ </div>
+
+ <div class="columns">
+ <div class="column is-half">
+
+<div class="field">
+ <label class="label">Label</label>
+ <div class="control">
+ <input class="input" type="text" placeholder="Text input">
+ </div>
+ <p class="help">This is a help text</p>
+</div>
+
+ </div>
+ <div class="column is-half">
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><label</span> <span class="na">class=</span><span class="s">"label"</span><span class="nt">></span>Label<span class="nt"></label></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><input</span> <span class="na">class=</span><span class="s">"input"</span> <span class="na">type=</span><span class="s">"text"</span> <span class="na">placeholder=</span><span class="s">"Text input"</span><span class="nt">></span>
+ <span class="nt"></div></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"help"</span><span class="nt">></span>This is a help text<span class="nt"></p></span>
+<span class="nt"></div></span></code></pre></figure>
+ </div>
+ </div>
+
+ <div class="content">
+ <p>This container allows form fields to be <strong>spaced consistently</strong>.</p>
+ </div>
+
+ <div class="columns">
+ <div class="column is-half">
+
+<div class="field">
+ <label class="label">Name</label>
+ <div class="control">
+ <input class="input" type="text" placeholder="e.g Alex Smith">
+ </div>
+</div>
+
+<div class="field">
+ <label class="label">Email</label>
+ <div class="control">
+ <input class="input" type="email" placeholder="e.g. alexsmith@gmail.com">
+ </div>
+</div>
+
+ </div>
+ <div class="column is-half">
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><label</span> <span class="na">class=</span><span class="s">"label"</span><span class="nt">></span>Name<span class="nt"></label></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><input</span> <span class="na">class=</span><span class="s">"input"</span> <span class="na">type=</span><span class="s">"text"</span> <span class="na">placeholder=</span><span class="s">"e.g Alex Smith"</span><span class="nt">></span>
+ <span class="nt"></div></span>
+<span class="nt"></div></span>
+
+<span class="nt"><div</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><label</span> <span class="na">class=</span><span class="s">"label"</span><span class="nt">></span>Email<span class="nt"></label></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><input</span> <span class="na">class=</span><span class="s">"input"</span> <span class="na">type=</span><span class="s">"email"</span> <span class="na">placeholder=</span><span class="s">"e.g. alexsmith@gmail.com"</span><span class="nt">></span>
+ <span class="nt"></div></span>
+<span class="nt"></div></span></code></pre></figure>
+ </div>
+ </div>
+
+ <hr>
+
+ <h3 id="form-control" class="title">Form control</h3>
+
+ <div class="content">
+ <p>The <code>control</code> is a versatile container meant to <strong>enhance single form controls</strong>. Because it has the same height as a control elements, it can <strong class="has-text-danger">only contain</strong> the following elements:</p>
+ <ul>
+ <li><code>input</code></li>
+ <li><code>select</code></li>
+ <li><code>button</code></li>
+ <li><code>icon</code></li>
+ </ul>
+ </div>
+
+ <div class="columns">
+ <div class="column is-half">
+
+<div class="control">
+ <input class="input" type="text" placeholder="Text input">
+</div>
+
+ </div>
+ <div class="column is-half">
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><input</span> <span class="na">class=</span><span class="s">"input"</span> <span class="na">type=</span><span class="s">"text"</span> <span class="na">placeholder=</span><span class="s">"Text input"</span><span class="nt">></span>
+<span class="nt"></div></span></code></pre></figure>
+ </div>
+ </div>
+
+ <div class="columns">
+ <div class="column is-half">
+
+<div class="control">
+ <div class="select">
+ <select>
+ <option>Select dropdown</option>
+ <option>With options</option>
+ </select>
+ </div>
+</div>
+
+ </div>
+ <div class="column is-half">
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"select"</span><span class="nt">></span>
+ <span class="nt"><select></span>
+ <span class="nt"><option></span>Select dropdown<span class="nt"></option></span>
+ <span class="nt"><option></span>With options<span class="nt"></option></span>
+ <span class="nt"></select></span>
+ <span class="nt"></div></span>
+<span class="nt"></div></span></code></pre></figure>
+ </div>
+ </div>
+
+ <div class="columns">
+ <div class="column is-half">
+
+<div class="control">
+ <button class="button is-primary">Submit</button>
+</div>
+
+ </div>
+ <div class="column is-half">
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><button</span> <span class="na">class=</span><span class="s">"button is-primary"</span><span class="nt">></span>Submit<span class="nt"></button></span>
+<span class="nt"></div></span></code></pre></figure>
+ </div>
+ </div>
+
+ <!-- Font Awesome Icons -->
+ <hr>
+
+ <h3 class="title">With icons</h3>
+ <div class="content">
+ <p>You can append one of 2 <strong>modifiers</strong> on a control:</p>
+ <ul>
+ <li>
+ <code>has-icons-left</code>
+ </li>
+ <li>
+ and/or <code>has-icons-right</code>
+ </li>
+ </ul>
+ <p>You also need to add a modifier on the <strong>icon</strong>:</p>
+ <ul>
+ <li>
+ <code>icon is-left</code> if <code>has-icons-left</code> is used
+ </li>
+ <li>
+ <code>icon is-right</code> if <code>has-icons-right</code> is used
+ </li>
+ </ul>
+ <p>The size of the <strong>input</strong> will define the size of the icon container.</p>
+ </div>
+ <div class="columns">
+ <div class="column is-half">
+
+<div class="field">
+ <p class="control has-icons-left has-icons-right">
+ <input class="input" type="email" placeholder="Email">
+ <span class="icon is-small is-left">
+ <i class="fa fa-envelope"></i>
+ </span>
+ <span class="icon is-small is-right">
+ <i class="fa fa-check"></i>
+ </span>
+ </p>
+</div>
+<div class="field">
+ <p class="control has-icons-left">
+ <input class="input" type="password" placeholder="Password">
+ <span class="icon is-small is-left">
+ <i class="fa fa-lock"></i>
+ </span>
+ </p>
+</div>
+<div class="field">
+ <p class="control">
+ <button class="button is-success">
+ Login
+ </button>
+ </p>
+</div>
+
+ </div>
+ <div class="column is-half highlight-full">
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"control has-icons-left has-icons-right"</span><span class="nt">></span>
+ <span class="nt"><input</span> <span class="na">class=</span><span class="s">"input"</span> <span class="na">type=</span><span class="s">"email"</span> <span class="na">placeholder=</span><span class="s">"Email"</span><span class="nt">></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon is-small is-left"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-envelope"</span><span class="nt">></i></span>
+ <span class="nt"></span></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon is-small is-right"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-check"</span><span class="nt">></i></span>
+ <span class="nt"></span></span>
+ <span class="nt"></p></span>
+<span class="nt"></div></span>
+<span class="nt"><div</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"control has-icons-left"</span><span class="nt">></span>
+ <span class="nt"><input</span> <span class="na">class=</span><span class="s">"input"</span> <span class="na">type=</span><span class="s">"password"</span> <span class="na">placeholder=</span><span class="s">"Password"</span><span class="nt">></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon is-small is-left"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-lock"</span><span class="nt">></i></span>
+ <span class="nt"></span></span>
+ <span class="nt"></p></span>
+<span class="nt"></div></span>
+<span class="nt"><div</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><button</span> <span class="na">class=</span><span class="s">"button is-success"</span><span class="nt">></span>
+ Login
+ <span class="nt"></button></span>
+ <span class="nt"></p></span>
+<span class="nt"></div></span></code></pre></figure>
+ </div>
+ </div>
+
+ <div class="columns">
+ <div class="column is-half">
+ <div class="content">
+ <p>
+ You can append icons to <strong>select dropdowns</strong> as well.
+ </p>
+ </div>
+
+<div class="field">
+ <p class="control has-icons-left">
+ <span class="select">
+ <select>
+ <option selected>Country</option>
+ <option>Select dropdown</option>
+ <option>With options</option>
+ </select>
+ </span>
+ <span class="icon is-small is-left">
+ <i class="fa fa-globe"></i>
+ </span>
+ </p>
+</div>
+
+ </div>
+ <div class="column is-half">
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"control has-icons-left"</span><span class="nt">></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"select"</span><span class="nt">></span>
+ <span class="nt"><select></span>
+ <span class="nt"><option</span> <span class="na">selected</span><span class="nt">></span>Country<span class="nt"></option></span>
+ <span class="nt"><option></span>Select dropdown<span class="nt"></option></span>
+ <span class="nt"><option></span>With options<span class="nt"></option></span>
+ <span class="nt"></select></span>
+ <span class="nt"></span></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon is-small is-left"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-globe"</span><span class="nt">></i></span>
+ <span class="nt"></span></span>
+ <span class="nt"></p></span>
+<span class="nt"></div></span></code></pre></figure>
+ </div>
+ </div>
+
+ <div class="columns">
+ <div class="column is-half">
+ <div class="content">
+ <p>
+ If the control contains an icon, Bulma will make sure the icon remains <strong>centered</strong>, no matter the size of the input <em>or</em> of the icon.
+ </p>
+ </div>
+
+<div class="field">
+ <label class="label is-small">Small input</label>
+ <div class="control has-icons-left has-icons-right">
+ <input class="input is-small" type="email" placeholder="Email">
+ <span class="icon is-small is-left">
+ <i class="fa fa-envelope"></i>
+ </span>
+ <span class="icon is-small is-right">
+ <i class="fa fa-check"></i>
+ </span>
+ </div>
+</div>
+
+ </div>
+ <div class="column is-half">
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><label</span> <span class="na">class=</span><span class="s">"label is-small"</span><span class="nt">></span>Small input<span class="nt"></label></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"control has-icons-left has-icons-right"</span><span class="nt">></span>
+ <span class="nt"><input</span> <span class="na">class=</span><span class="s">"input is-small"</span> <span class="na">type=</span><span class="s">"email"</span> <span class="na">placeholder=</span><span class="s">"Email"</span><span class="nt">></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon is-small is-left"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-envelope"</span><span class="nt">></i></span>
+ <span class="nt"></span></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon is-small is-right"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-check"</span><span class="nt">></i></span>
+ <span class="nt"></span></span>
+ <span class="nt"></div></span>
+<span class="nt"></div></span></code></pre></figure>
+ </div>
+ </div>
+
+ <div class="columns">
+ <div class="column is-half">
+
+<div class="field">
+ <label class="label">Normal input</label>
+ <div class="control has-icons-left has-icons-right">
+ <input class="input" type="email" placeholder="Email">
+ <span class="icon is-small is-left">
+ <i class="fa fa-envelope"></i>
+ </span>
+ <span class="icon is-small is-right">
+ <i class="fa fa-check"></i>
+ </span>
+ </div>
+</div>
+
+<div class="field">
+ <div class="control has-icons-left has-icons-right">
+ <input class="input" type="email" placeholder="Email">
+ <span class="icon is-left">
+ <i class="fa fa-envelope"></i>
+ </span>
+ <span class="icon is-right">
+ <i class="fa fa-check"></i>
+ </span>
+ </div>
+</div>
+
+ </div>
+ <div class="column is-half">
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><label</span> <span class="na">class=</span><span class="s">"label"</span><span class="nt">></span>Normal input<span class="nt"></label></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"control has-icons-left has-icons-right"</span><span class="nt">></span>
+ <span class="nt"><input</span> <span class="na">class=</span><span class="s">"input"</span> <span class="na">type=</span><span class="s">"email"</span> <span class="na">placeholder=</span><span class="s">"Email"</span><span class="nt">></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon is-small is-left"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-envelope"</span><span class="nt">></i></span>
+ <span class="nt"></span></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon is-small is-right"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-check"</span><span class="nt">></i></span>
+ <span class="nt"></span></span>
+ <span class="nt"></div></span>
+<span class="nt"></div></span>
+
+<span class="nt"><div</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"control has-icons-left has-icons-right"</span><span class="nt">></span>
+ <span class="nt"><input</span> <span class="na">class=</span><span class="s">"input"</span> <span class="na">type=</span><span class="s">"email"</span> <span class="na">placeholder=</span><span class="s">"Email"</span><span class="nt">></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon is-left"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-envelope"</span><span class="nt">></i></span>
+ <span class="nt"></span></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon is-right"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-check"</span><span class="nt">></i></span>
+ <span class="nt"></span></span>
+ <span class="nt"></div></span>
+<span class="nt"></div></span></code></pre></figure>
+ </div>
+ </div>
+
+ <div class="columns">
+ <div class="column is-half">
+
+<div class="field">
+ <label class="label is-medium">Medium input</label>
+ <div class="control has-icons-left has-icons-right">
+ <input class="input is-medium" type="email" placeholder="Email">
+ <span class="icon is-small is-left">
+ <i class="fa fa-envelope"></i>
+ </span>
+ <span class="icon is-small is-right">
+ <i class="fa fa-check"></i>
+ </span>
+ </div>
+</div>
+
+<div class="field">
+ <div class="control has-icons-left has-icons-right">
+ <input class="input is-medium" type="email" placeholder="Email">
+ <span class="icon is-left">
+ <i class="fa fa-envelope"></i>
+ </span>
+ <span class="icon is-right">
+ <i class="fa fa-check"></i>
+ </span>
+ </div>
+</div>
+
+<div class="field">
+ <div class="control has-icons-left has-icons-right">
+ <input class="input is-medium" type="email" placeholder="Email">
+ <span class="icon is-medium is-left">
+ <i class="fa fa-envelope"></i>
+ </span>
+ <span class="icon is-medium is-right">
+ <i class="fa fa-check"></i>
+ </span>
+ </div>
+</div>
+
+ </div>
+ <div class="column is-half">
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><label</span> <span class="na">class=</span><span class="s">"label is-medium"</span><span class="nt">></span>Medium input<span class="nt"></label></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"control has-icons-left has-icons-right"</span><span class="nt">></span>
+ <span class="nt"><input</span> <span class="na">class=</span><span class="s">"input is-medium"</span> <span class="na">type=</span><span class="s">"email"</span> <span class="na">placeholder=</span><span class="s">"Email"</span><span class="nt">></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon is-small is-left"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-envelope"</span><span class="nt">></i></span>
+ <span class="nt"></span></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon is-small is-right"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-check"</span><span class="nt">></i></span>
+ <span class="nt"></span></span>
+ <span class="nt"></div></span>
+<span class="nt"></div></span>
+
+<span class="nt"><div</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"control has-icons-left has-icons-right"</span><span class="nt">></span>
+ <span class="nt"><input</span> <span class="na">class=</span><span class="s">"input is-medium"</span> <span class="na">type=</span><span class="s">"email"</span> <span class="na">placeholder=</span><span class="s">"Email"</span><span class="nt">></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon is-left"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-envelope"</span><span class="nt">></i></span>
+ <span class="nt"></span></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon is-right"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-check"</span><span class="nt">></i></span>
+ <span class="nt"></span></span>
+ <span class="nt"></div></span>
+<span class="nt"></div></span>
+
+<span class="nt"><div</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"control has-icons-left has-icons-right"</span><span class="nt">></span>
+ <span class="nt"><input</span> <span class="na">class=</span><span class="s">"input is-medium"</span> <span class="na">type=</span><span class="s">"email"</span> <span class="na">placeholder=</span><span class="s">"Email"</span><span class="nt">></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon is-medium is-left"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-envelope"</span><span class="nt">></i></span>
+ <span class="nt"></span></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon is-medium is-right"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-check"</span><span class="nt">></i></span>
+ <span class="nt"></span></span>
+ <span class="nt"></div></span>
+<span class="nt"></div></span></code></pre></figure>
+ </div>
+ </div>
+
+ <div class="columns">
+ <div class="column is-half">
+
+<div class="field">
+ <label class="label is-large">Large input</label>
+ <div class="control has-icons-left has-icons-right">
+ <input class="input is-large" type="email" placeholder="Email">
+ <span class="icon is-small is-left">
+ <i class="fa fa-envelope"></i>
+ </span>
+ <span class="icon is-small is-right">
+ <i class="fa fa-check"></i>
+ </span>
+ </div>
+</div>
+
+<div class="field">
+ <div class="control has-icons-left has-icons-right">
+ <input class="input is-large" type="email" placeholder="Email">
+ <span class="icon is-left">
+ <i class="fa fa-envelope"></i>
+ </span>
+ <span class="icon is-right">
+ <i class="fa fa-check"></i>
+ </span>
+ </div>
+</div>
+
+<div class="field">
+ <div class="control has-icons-left has-icons-right">
+ <input class="input is-large" type="email" placeholder="Email">
+ <span class="icon is-medium is-left">
+ <i class="fa fa-envelope"></i>
+ </span>
+ <span class="icon is-medium is-right">
+ <i class="fa fa-check"></i>
+ </span>
+ </div>
+</div>
+
+<div class="field">
+ <div class="control has-icons-left has-icons-right">
+ <input class="input is-large" type="email" placeholder="Email">
+ <span class="icon is-large is-left">
+ <i class="fa fa-envelope"></i>
+ </span>
+ <span class="icon is-large is-right">
+ <i class="fa fa-check"></i>
+ </span>
+ </div>
+</div>
+
+ </div>
+ <div class="column is-half">
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><label</span> <span class="na">class=</span><span class="s">"label is-large"</span><span class="nt">></span>Large input<span class="nt"></label></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"control has-icons-left has-icons-right"</span><span class="nt">></span>
+ <span class="nt"><input</span> <span class="na">class=</span><span class="s">"input is-large"</span> <span class="na">type=</span><span class="s">"email"</span> <span class="na">placeholder=</span><span class="s">"Email"</span><span class="nt">></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon is-small is-left"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-envelope"</span><span class="nt">></i></span>
+ <span class="nt"></span></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon is-small is-right"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-check"</span><span class="nt">></i></span>
+ <span class="nt"></span></span>
+ <span class="nt"></div></span>
+<span class="nt"></div></span>
+
+<span class="nt"><div</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"control has-icons-left has-icons-right"</span><span class="nt">></span>
+ <span class="nt"><input</span> <span class="na">class=</span><span class="s">"input is-large"</span> <span class="na">type=</span><span class="s">"email"</span> <span class="na">placeholder=</span><span class="s">"Email"</span><span class="nt">></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon is-left"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-envelope"</span><span class="nt">></i></span>
+ <span class="nt"></span></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon is-right"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-check"</span><span class="nt">></i></span>
+ <span class="nt"></span></span>
+ <span class="nt"></div></span>
+<span class="nt"></div></span>
+
+<span class="nt"><div</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"control has-icons-left has-icons-right"</span><span class="nt">></span>
+ <span class="nt"><input</span> <span class="na">class=</span><span class="s">"input is-large"</span> <span class="na">type=</span><span class="s">"email"</span> <span class="na">placeholder=</span><span class="s">"Email"</span><span class="nt">></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon is-medium is-left"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-envelope"</span><span class="nt">></i></span>
+ <span class="nt"></span></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon is-medium is-right"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-check"</span><span class="nt">></i></span>
+ <span class="nt"></span></span>
+ <span class="nt"></div></span>
+<span class="nt"></div></span>
+
+<span class="nt"><div</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"control has-icons-left has-icons-right"</span><span class="nt">></span>
+ <span class="nt"><input</span> <span class="na">class=</span><span class="s">"input is-large"</span> <span class="na">type=</span><span class="s">"email"</span> <span class="na">placeholder=</span><span class="s">"Email"</span><span class="nt">></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon is-large is-left"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-envelope"</span><span class="nt">></i></span>
+ <span class="nt"></span></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon is-large is-right"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-check"</span><span class="nt">></i></span>
+ <span class="nt"></span></span>
+ <span class="nt"></div></span>
+<span class="nt"></div></span></code></pre></figure>
+ </div>
+ </div>
+
+ <hr>
+
+ <h3 id="form-addons" class="title">Form addons</h3>
+ <div class="content">
+ <p>If you want to <strong>attach controls</strong> together, use the <code>has-addons</code> modifier on the <code>field</code> container:</p>
+ </div>
+ <div class="example">
+
+<div class="field has-addons">
+ <div class="control">
+ <input class="input" type="text" placeholder="Find a repository">
+ </div>
+ <div class="control">
+ <a class="button is-info">
+ Search
+ </a>
+ </div>
+</div>
+
+ </div>
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"field has-addons"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><input</span> <span class="na">class=</span><span class="s">"input"</span> <span class="na">type=</span><span class="s">"text"</span> <span class="na">placeholder=</span><span class="s">"Find a repository"</span><span class="nt">></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"button is-info"</span><span class="nt">></span>
+ Search
+ <span class="nt"></a></span>
+ <span class="nt"></div></span>
+<span class="nt"></div></span></code></pre></figure>
+ <div class="content">
+ <p>You can attach inputs, buttons, and dropdowns <strong>only</strong>.</p>
+ </div>
+
+ <div class="content">
+ <p>
+ <span class="tag is-success">New!</span>
+ <span class="tag is-info">0.4.2</span>
+ </p>
+ <p>It can be useful to append a <a href="http://bulma.io/versions/0.4.4/documentation/elements/button#static-button">static button</a>.</p>
+ </div>
+
+ <div class="example">
+
+<div class="field has-addons">
+ <p class="control">
+ <input class="input" type="text" placeholder="Your email">
+ </p>
+ <p class="control">
+ <a class="button is-static">
+ @gmail.com
+ </a>
+ </p>
+</div>
+
+ </div>
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"field has-addons"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><input</span> <span class="na">class=</span><span class="s">"input"</span> <span class="na">type=</span><span class="s">"text"</span> <span class="na">placeholder=</span><span class="s">"Your email"</span><span class="nt">></span>
+ <span class="nt"></p></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"button is-static"</span><span class="nt">></span>
+ @gmail.com
+ <span class="nt"></a></span>
+ <span class="nt"></p></span>
+<span class="nt"></div></span></code></pre></figure>
+
+ <div class="content">
+ <p>Use the <code>is-expanded</code> modifier on the element you want to fill up the remaining space (in this case, the input):</p>
+ </div>
+ <div class="example">
+
+<div class="field has-addons">
+ <p class="control">
+ <span class="select">
+ <select>
+ <option>$</option>
+ <option>£</option>
+ <option>€</option>
+ </select>
+ </span>
+ </p>
+ <p class="control">
+ <input class="input" type="text" placeholder="Amount of money">
+ </p>
+ <p class="control">
+ <a class="button">
+ Transfer
+ </a>
+ </p>
+</div>
+
+<div class="field has-addons">
+ <p class="control">
+ <span class="select">
+ <select>
+ <option>$</option>
+ <option>£</option>
+ <option>€</option>
+ </select>
+ </span>
+ </p>
+ <p class="control is-expanded">
+ <input class="input" type="text" placeholder="Amount of money">
+ </p>
+ <p class="control">
+ <a class="button">
+ Transfer
+ </a>
+ </p>
+</div>
+
+ </div>
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"field has-addons"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"select"</span><span class="nt">></span>
+ <span class="nt"><select></span>
+ <span class="nt"><option></span>$<span class="nt"></option></span>
+ <span class="nt"><option></span>£<span class="nt"></option></span>
+ <span class="nt"><option></span>€<span class="nt"></option></span>
+ <span class="nt"></select></span>
+ <span class="nt"></span></span>
+ <span class="nt"></p></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><input</span> <span class="na">class=</span><span class="s">"input"</span> <span class="na">type=</span><span class="s">"text"</span> <span class="na">placeholder=</span><span class="s">"Amount of money"</span><span class="nt">></span>
+ <span class="nt"></p></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"button"</span><span class="nt">></span>
+ Transfer
+ <span class="nt"></a></span>
+ <span class="nt"></p></span>
+<span class="nt"></div></span>
+
+<span class="nt"><div</span> <span class="na">class=</span><span class="s">"field has-addons"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"select"</span><span class="nt">></span>
+ <span class="nt"><select></span>
+ <span class="nt"><option></span>$<span class="nt"></option></span>
+ <span class="nt"><option></span>£<span class="nt"></option></span>
+ <span class="nt"><option></span>€<span class="nt"></option></span>
+ <span class="nt"></select></span>
+ <span class="nt"></span></span>
+ <span class="nt"></p></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"control is-expanded"</span><span class="nt">></span>
+ <span class="nt"><input</span> <span class="na">class=</span><span class="s">"input"</span> <span class="na">type=</span><span class="s">"text"</span> <span class="na">placeholder=</span><span class="s">"Amount of money"</span><span class="nt">></span>
+ <span class="nt"></p></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"button"</span><span class="nt">></span>
+ Transfer
+ <span class="nt"></a></span>
+ <span class="nt"></p></span>
+<span class="nt"></div></span></code></pre></figure>
+
+ <div class="content">
+ <p>If you want a full width select dropdown, pair <code>control is-expanded</code> with <code>select is-fullwidth</code>.</p>
+ </div>
+ <div class="example">
+
+<div class="field has-addons">
+ <div class="control is-expanded">
+ <div class="select is-fullwidth">
+ <select name="country">
+ <option value="Argentina">Argentina</option>
+ <option value="Bolivia">Bolivia</option>
+ <option value="Brazil">Brazil</option>
+ <option value="Chile">Chile</option>
+ <option value="Colombia">Colombia</option>
+ <option value="Ecuador">Ecuador</option>
+ <option value="Guyana">Guyana</option>
+ <option value="Paraguay">Paraguay</option>
+ <option value="Peru">Peru</option>
+ <option value="Suriname">Suriname</option>
+ <option value="Uruguay">Uruguay</option>
+ <option value="Venezuela">Venezuela</option>
+ </select>
+ </div>
+ </div>
+ <div class="control">
+ <button type="submit" class="button is-primary">Choose</button>
+ </div>
+</div>
+
+ </div>
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"field has-addons"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"control is-expanded"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"select is-fullwidth"</span><span class="nt">></span>
+ <span class="nt"><select</span> <span class="na">name=</span><span class="s">"country"</span><span class="nt">></span>
+ <span class="nt"><option</span> <span class="na">value=</span><span class="s">"Argentina"</span><span class="nt">></span>Argentina<span class="nt"></option></span>
+ <span class="nt"><option</span> <span class="na">value=</span><span class="s">"Bolivia"</span><span class="nt">></span>Bolivia<span class="nt"></option></span>
+ <span class="nt"><option</span> <span class="na">value=</span><span class="s">"Brazil"</span><span class="nt">></span>Brazil<span class="nt"></option></span>
+ <span class="nt"><option</span> <span class="na">value=</span><span class="s">"Chile"</span><span class="nt">></span>Chile<span class="nt"></option></span>
+ <span class="nt"><option</span> <span class="na">value=</span><span class="s">"Colombia"</span><span class="nt">></span>Colombia<span class="nt"></option></span>
+ <span class="nt"><option</span> <span class="na">value=</span><span class="s">"Ecuador"</span><span class="nt">></span>Ecuador<span class="nt"></option></span>
+ <span class="nt"><option</span> <span class="na">value=</span><span class="s">"Guyana"</span><span class="nt">></span>Guyana<span class="nt"></option></span>
+ <span class="nt"><option</span> <span class="na">value=</span><span class="s">"Paraguay"</span><span class="nt">></span>Paraguay<span class="nt"></option></span>
+ <span class="nt"><option</span> <span class="na">value=</span><span class="s">"Peru"</span><span class="nt">></span>Peru<span class="nt"></option></span>
+ <span class="nt"><option</span> <span class="na">value=</span><span class="s">"Suriname"</span><span class="nt">></span>Suriname<span class="nt"></option></span>
+ <span class="nt"><option</span> <span class="na">value=</span><span class="s">"Uruguay"</span><span class="nt">></span>Uruguay<span class="nt"></option></span>
+ <span class="nt"><option</span> <span class="na">value=</span><span class="s">"Venezuela"</span><span class="nt">></span>Venezuela<span class="nt"></option></span>
+ <span class="nt"></select></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><button</span> <span class="na">type=</span><span class="s">"submit"</span> <span class="na">class=</span><span class="s">"button is-primary"</span><span class="nt">></span>Choose<span class="nt"></button></span>
+ <span class="nt"></div></span>
+<span class="nt"></div></span></code></pre></figure>
+
+ <div class="content">
+ <p>Use the <code>has-addons-centered</code> or the <code>has-addons-right</code> modifers to alter the <strong>alignment</strong>.</p>
+ </div>
+ <div class="example">
+
+<div class="field has-addons has-addons-centered">
+ <p class="control">
+ <span class="select">
+ <select>
+ <option>$</option>
+ <option>£</option>
+ <option>€</option>
+ </select>
+ </span>
+ </p>
+ <p class="control">
+ <input class="input" type="text" placeholder="Amount of money">
+ </p>
+ <p class="control">
+ <a class="button is-primary">
+ Transfer
+ </a>
+ </p>
+</div>
+
+ </div>
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"field has-addons has-addons-centered"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"select"</span><span class="nt">></span>
+ <span class="nt"><select></span>
+ <span class="nt"><option></span>$<span class="nt"></option></span>
+ <span class="nt"><option></span>£<span class="nt"></option></span>
+ <span class="nt"><option></span>€<span class="nt"></option></span>
+ <span class="nt"></select></span>
+ <span class="nt"></span></span>
+ <span class="nt"></p></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><input</span> <span class="na">class=</span><span class="s">"input"</span> <span class="na">type=</span><span class="s">"text"</span> <span class="na">placeholder=</span><span class="s">"Amount of money"</span><span class="nt">></span>
+ <span class="nt"></p></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"button is-primary"</span><span class="nt">></span>
+ Transfer
+ <span class="nt"></a></span>
+ <span class="nt"></p></span>
+<span class="nt"></div></span></code></pre></figure>
+ <div class="example">
+
+<div class="field has-addons has-addons-right">
+ <p class="control">
+ <span class="select">
+ <select>
+ <option>$</option>
+ <option>£</option>
+ <option>€</option>
+ </select>
+ </span>
+ </p>
+ <p class="control">
+ <input class="input" type="text" placeholder="Amount of money">
+ </p>
+ <p class="control">
+ <a class="button is-primary">
+ Transfer
+ </a>
+ </p>
+</div>
+
+ </div>
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"field has-addons has-addons-right"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"select"</span><span class="nt">></span>
+ <span class="nt"><select></span>
+ <span class="nt"><option></span>$<span class="nt"></option></span>
+ <span class="nt"><option></span>£<span class="nt"></option></span>
+ <span class="nt"><option></span>€<span class="nt"></option></span>
+ <span class="nt"></select></span>
+ <span class="nt"></span></span>
+ <span class="nt"></p></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><input</span> <span class="na">class=</span><span class="s">"input"</span> <span class="na">type=</span><span class="s">"text"</span> <span class="na">placeholder=</span><span class="s">"Amount of money"</span><span class="nt">></span>
+ <span class="nt"></p></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"button is-primary"</span><span class="nt">></span>
+ Transfer
+ <span class="nt"></a></span>
+ <span class="nt"></p></span>
+<span class="nt"></div></span></code></pre></figure>
+
+ <hr>
+
+ <h3 class="title">Form group</h3>
+ <div class="content">
+ <p>
+ If you want to <strong>group</strong> controls together, use the <code>is-grouped</code> modifier on the <code>field</code> container.
+ <br>
+ Use the <code>is-grouped-centered</code> or the <code>is-grouped-right</code> modifers to alter the <strong>alignment</strong>.
+ </p>
+ <p>
+ Add the <code>is-expanded</code> modifier on the control element you want to <strong>fill up the remaining space</strong> with.
+ </p>
+ </div>
+ <div class="example">
+
+<div class="field is-grouped">
+ <p class="control is-expanded">
+ <input class="input" type="text" placeholder="Find a repository">
+ </p>
+ <p class="control">
+ <a class="button is-info">
+ Search
+ </a>
+ </p>
+</div>
+
+ </div>
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"field is-grouped"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"control is-expanded"</span><span class="nt">></span>
+ <span class="nt"><input</span> <span class="na">class=</span><span class="s">"input"</span> <span class="na">type=</span><span class="s">"text"</span> <span class="na">placeholder=</span><span class="s">"Find a repository"</span><span class="nt">></span>
+ <span class="nt"></p></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"button is-info"</span><span class="nt">></span>
+ Search
+ <span class="nt"></a></span>
+ <span class="nt"></p></span>
+<span class="nt"></div></span></code></pre></figure>
+
+ <hr>
+
+ <h3 class="title">Horizontal form</h3>
+ <div class="content">
+ <p>If you want a <strong>horizontal</strong> form control, use the <code>is-horizontal</code> modifier on the <code>field</code> container, in which you include:</p>
+ <ul>
+ <li>
+ <code>field-label</code> for the side label
+ </li>
+ <li>
+ <code>field-body</code> for the input/select/textarea container
+ </li>
+ </ul>
+ <p>You can use <code>is-grouped</code> or <code>has-addons</code> for the child elements.</p>
+ </div>
+ <div class="example">
+
+<div class="field is-horizontal">
+ <div class="field-label is-normal">
+ <label class="label">From</label>
+ </div>
+ <div class="field-body">
+ <div class="field">
+ <p class="control is-expanded has-icons-left">
+ <input class="input" type="text" placeholder="Name">
+ <span class="icon is-small is-left">
+ <i class="fa fa-user"></i>
+ </span>
+ </p>
+ </div>
+ <div class="field">
+ <p class="control is-expanded has-icons-left has-icons-right">
+ <input class="input is-success" type="email" placeholder="Email" value="alex@smith.com">
+ <span class="icon is-small is-left">
+ <i class="fa fa-envelope"></i>
+ </span>
+ <span class="icon is-small is-right">
+ <i class="fa fa-check"></i>
+ </span>
+ </p>
+ </div>
+ </div>
+</div>
+
+<div class="field is-horizontal">
+ <div class="field-label"></div>
+ <div class="field-body">
+ <div class="field is-expanded">
+ <div class="field has-addons">
+ <p class="control">
+ <a class="button is-static">
+ +44
+ </a>
+ </p>
+ <p class="control is-expanded">
+ <input class="input" type="tel" placeholder="Your phone number">
+ </p>
+ </div>
+ <p class="help">Do not enter the first zero</p>
+ </div>
+ </div>
+</div>
+
+<div class="field is-horizontal">
+ <div class="field-label is-normal">
+ <label class="label">Department</label>
+ </div>
+ <div class="field-body">
+ <div class="field is-narrow">
+ <div class="control">
+ <div class="select is-fullwidth">
+ <select>
+ <option>Business development</option>
+ <option>Marketing</option>
+ <option>Sales</option>
+ </select>
+ </div>
+ </div>
+ </div>
+ </div>
+</div>
+
+<div class="field is-horizontal">
+ <div class="field-label">
+ <label class="label">Already a member?</label>
+ </div>
+ <div class="field-body">
+ <div class="field is-narrow">
+ <div class="control">
+ <label class="radio">
+ <input type="radio" name="member">
+ Yes
+ </label>
+ <label class="radio">
+ <input type="radio" name="member">
+ No
+ </label>
+ </div>
+ </div>
+ </div>
+</div>
+
+<div class="field is-horizontal">
+ <div class="field-label is-normal">
+ <label class="label">Subject</label>
+ </div>
+ <div class="field-body">
+ <div class="field">
+ <div class="control">
+ <input class="input is-danger" type="text" placeholder="e.g. Partnership opportunity">
+ </div>
+ <p class="help is-danger">
+ This field is required
+ </p>
+ </div>
+ </div>
+</div>
+
+<div class="field is-horizontal">
+ <div class="field-label is-normal">
+ <label class="label">Question</label>
+ </div>
+ <div class="field-body">
+ <div class="field">
+ <div class="control">
+ <textarea class="textarea" placeholder="Explain how we can help you"></textarea>
+ </div>
+ </div>
+ </div>
+</div>
+
+<div class="field is-horizontal">
+ <div class="field-label">
+ <!-- Left empty for spacing -->
+ </div>
+ <div class="field-body">
+ <div class="field">
+ <div class="control">
+ <button class="button is-primary">
+ Send message
+ </button>
+ </div>
+ </div>
+ </div>
+</div>
+
+ </div>
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"field is-horizontal"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"field-label is-normal"</span><span class="nt">></span>
+ <span class="nt"><label</span> <span class="na">class=</span><span class="s">"label"</span><span class="nt">></span>From<span class="nt"></label></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"field-body"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"control is-expanded has-icons-left"</span><span class="nt">></span>
+ <span class="nt"><input</span> <span class="na">class=</span><span class="s">"input"</span> <span class="na">type=</span><span class="s">"text"</span> <span class="na">placeholder=</span><span class="s">"Name"</span><span class="nt">></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon is-small is-left"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-user"</span><span class="nt">></i></span>
+ <span class="nt"></span></span>
+ <span class="nt"></p></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"control is-expanded has-icons-left has-icons-right"</span><span class="nt">></span>
+ <span class="nt"><input</span> <span class="na">class=</span><span class="s">"input is-success"</span> <span class="na">type=</span><span class="s">"email"</span> <span class="na">placeholder=</span><span class="s">"Email"</span> <span class="na">value=</span><span class="s">"alex@smith.com"</span><span class="nt">></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon is-small is-left"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-envelope"</span><span class="nt">></i></span>
+ <span class="nt"></span></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon is-small is-right"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-check"</span><span class="nt">></i></span>
+ <span class="nt"></span></span>
+ <span class="nt"></p></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+<span class="nt"></div></span>
+
+<span class="nt"><div</span> <span class="na">class=</span><span class="s">"field is-horizontal"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"field-label"</span><span class="nt">></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"field-body"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"field is-expanded"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"field has-addons"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"button is-static"</span><span class="nt">></span>
+ +44
+ <span class="nt"></a></span>
+ <span class="nt"></p></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"control is-expanded"</span><span class="nt">></span>
+ <span class="nt"><input</span> <span class="na">class=</span><span class="s">"input"</span> <span class="na">type=</span><span class="s">"tel"</span> <span class="na">placeholder=</span><span class="s">"Your phone number"</span><span class="nt">></span>
+ <span class="nt"></p></span>
+ <span class="nt"></div></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"help"</span><span class="nt">></span>Do not enter the first zero<span class="nt"></p></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+<span class="nt"></div></span>
+
+<span class="nt"><div</span> <span class="na">class=</span><span class="s">"field is-horizontal"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"field-label is-normal"</span><span class="nt">></span>
+ <span class="nt"><label</span> <span class="na">class=</span><span class="s">"label"</span><span class="nt">></span>Department<span class="nt"></label></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"field-body"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"field is-narrow"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"select is-fullwidth"</span><span class="nt">></span>
+ <span class="nt"><select></span>
+ <span class="nt"><option></span>Business development<span class="nt"></option></span>
+ <span class="nt"><option></span>Marketing<span class="nt"></option></span>
+ <span class="nt"><option></span>Sales<span class="nt"></option></span>
+ <span class="nt"></select></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+<span class="nt"></div></span>
+
+<span class="nt"><div</span> <span class="na">class=</span><span class="s">"field is-horizontal"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"field-label"</span><span class="nt">></span>
+ <span class="nt"><label</span> <span class="na">class=</span><span class="s">"label"</span><span class="nt">></span>Already a member?<span class="nt"></label></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"field-body"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"field is-narrow"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><label</span> <span class="na">class=</span><span class="s">"radio"</span><span class="nt">></span>
+ <span class="nt"><input</span> <span class="na">type=</span><span class="s">"radio"</span> <span class="na">name=</span><span class="s">"member"</span><span class="nt">></span>
+ Yes
+ <span class="nt"></label></span>
+ <span class="nt"><label</span> <span class="na">class=</span><span class="s">"radio"</span><span class="nt">></span>
+ <span class="nt"><input</span> <span class="na">type=</span><span class="s">"radio"</span> <span class="na">name=</span><span class="s">"member"</span><span class="nt">></span>
+ No
+ <span class="nt"></label></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+<span class="nt"></div></span>
+
+<span class="nt"><div</span> <span class="na">class=</span><span class="s">"field is-horizontal"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"field-label is-normal"</span><span class="nt">></span>
+ <span class="nt"><label</span> <span class="na">class=</span><span class="s">"label"</span><span class="nt">></span>Subject<span class="nt"></label></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"field-body"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><input</span> <span class="na">class=</span><span class="s">"input is-danger"</span> <span class="na">type=</span><span class="s">"text"</span> <span class="na">placeholder=</span><span class="s">"e.g. Partnership opportunity"</span><span class="nt">></span>
+ <span class="nt"></div></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"help is-danger"</span><span class="nt">></span>
+ This field is required
+ <span class="nt"></p></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+<span class="nt"></div></span>
+
+<span class="nt"><div</span> <span class="na">class=</span><span class="s">"field is-horizontal"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"field-label is-normal"</span><span class="nt">></span>
+ <span class="nt"><label</span> <span class="na">class=</span><span class="s">"label"</span><span class="nt">></span>Question<span class="nt"></label></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"field-body"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><textarea</span> <span class="na">class=</span><span class="s">"textarea"</span> <span class="na">placeholder=</span><span class="s">"Explain how we can help you"</span><span class="nt">></textarea></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+<span class="nt"></div></span>
+
+<span class="nt"><div</span> <span class="na">class=</span><span class="s">"field is-horizontal"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"field-label"</span><span class="nt">></span>
+ <span class="c"><!-- Left empty for spacing --></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"field-body"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><button</span> <span class="na">class=</span><span class="s">"button is-primary"</span><span class="nt">></span>
+ Send message
+ <span class="nt"></button></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+<span class="nt"></div></span></code></pre></figure>
+
+ <div class="content">
+ <p>
+ To preserve the <strong>vertical alignment</strong> of labels with each type and size of control, the <code>.field-label</code> comes with <strong>4 size modifiers</strong>:
+ </p>
+ <ul>
+ <li>
+ <code>.is-small</code>
+ </li>
+ <li>
+ <code>.is-normal</code> for any <code>.input</code> or <code>.button</code>
+ </li>
+ <li>
+ <code>.is-medium</code>
+ </li>
+ <li>
+ <code>.is-large</code>
+ </li>
+ </ul>
+ </div>
+ <div class="example">
+
+<div class="field is-horizontal">
+ <div class="field-label">
+ <label class="label">No padding</label>
+ </div>
+ <div class="field-body">
+ <div class="field">
+ <div class="control">
+ <label class="checkbox">
+ <input type="checkbox">
+ Checkbox
+ </label>
+ </div>
+ </div>
+ </div>
+</div>
+
+<div class="field is-horizontal">
+ <div class="field-label is-small">
+ <label class="label">Small padding</label>
+ </div>
+ <div class="field-body">
+ <div class="field">
+ <div class="control">
+ <input class="input is-small" type="text" placeholder="Small sized input">
+ </div>
+ </div>
+ </div>
+</div>
+
+<div class="field is-horizontal">
+ <div class="field-label is-normal">
+ <label class="label">Normal label</label>
+ </div>
+ <div class="field-body">
+ <div class="field">
+ <div class="control">
+ <input class="input" type="text" placeholder="Normal sized input">
+ </div>
+ </div>
+ </div>
+</div>
+
+<div class="field is-horizontal">
+ <div class="field-label is-medium">
+ <label class="label">Medium label</label>
+ </div>
+ <div class="field-body">
+ <div class="field">
+ <div class="control">
+ <input class="input is-medium" type="text" placeholder="Medium sized input">
+ </div>
+ </div>
+ </div>
+</div>
+
+<div class="field is-horizontal">
+ <div class="field-label is-large">
+ <label class="label">Large label</label>
+ </div>
+ <div class="field-body">
+ <div class="field">
+ <div class="control">
+ <input class="input is-large" type="text" placeholder="Large sized input">
+ </div>
+ </div>
+ </div>
+</div>
+
+ </div>
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"field is-horizontal"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"field-label"</span><span class="nt">></span>
+ <span class="nt"><label</span> <span class="na">class=</span><span class="s">"label"</span><span class="nt">></span>No padding<span class="nt"></label></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"field-body"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><label</span> <span class="na">class=</span><span class="s">"checkbox"</span><span class="nt">></span>
+ <span class="nt"><input</span> <span class="na">type=</span><span class="s">"checkbox"</span><span class="nt">></span>
+ Checkbox
+ <span class="nt"></label></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+<span class="nt"></div></span>
+
+<span class="nt"><div</span> <span class="na">class=</span><span class="s">"field is-horizontal"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"field-label is-small"</span><span class="nt">></span>
+ <span class="nt"><label</span> <span class="na">class=</span><span class="s">"label"</span><span class="nt">></span>Small padding<span class="nt"></label></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"field-body"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><input</span> <span class="na">class=</span><span class="s">"input is-small"</span> <span class="na">type=</span><span class="s">"text"</span> <span class="na">placeholder=</span><span class="s">"Small sized input"</span><span class="nt">></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+<span class="nt"></div></span>
+
+<span class="nt"><div</span> <span class="na">class=</span><span class="s">"field is-horizontal"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"field-label is-normal"</span><span class="nt">></span>
+ <span class="nt"><label</span> <span class="na">class=</span><span class="s">"label"</span><span class="nt">></span>Normal label<span class="nt"></label></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"field-body"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><input</span> <span class="na">class=</span><span class="s">"input"</span> <span class="na">type=</span><span class="s">"text"</span> <span class="na">placeholder=</span><span class="s">"Normal sized input"</span><span class="nt">></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+<span class="nt"></div></span>
+
+<span class="nt"><div</span> <span class="na">class=</span><span class="s">"field is-horizontal"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"field-label is-medium"</span><span class="nt">></span>
+ <span class="nt"><label</span> <span class="na">class=</span><span class="s">"label"</span><span class="nt">></span>Medium label<span class="nt"></label></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"field-body"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><input</span> <span class="na">class=</span><span class="s">"input is-medium"</span> <span class="na">type=</span><span class="s">"text"</span> <span class="na">placeholder=</span><span class="s">"Medium sized input"</span><span class="nt">></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+<span class="nt"></div></span>
+
+<span class="nt"><div</span> <span class="na">class=</span><span class="s">"field is-horizontal"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"field-label is-large"</span><span class="nt">></span>
+ <span class="nt"><label</span> <span class="na">class=</span><span class="s">"label"</span><span class="nt">></span>Large label<span class="nt"></label></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"field-body"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><input</span> <span class="na">class=</span><span class="s">"input is-large"</span> <span class="na">type=</span><span class="s">"text"</span> <span class="na">placeholder=</span><span class="s">"Large sized input"</span><span class="nt">></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+<span class="nt"></div></span></code></pre></figure>
+ </div>
+</section>
+
+
+ <script src="//m.servedby-buysellads.com/monetization.js" type="text/javascript"></script>
+
+<section class="hero is-info bsa">
+ <div class="container">
+ <div class="columns is-vcentered">
+ <div class="column is-4">
+ <p class="title">Bulma <strong>Partners</strong></p>
+ <p class="subtitle">Check out their products!</p>
+ </div>
+
+ <div class="column is-8">
+ <div class="bsa-cpc"></div>
+ </div>
+ </div>
+ </div>
+</section>
+
+<script>
+ (function(){
+ if(typeof _bsa !== 'undefined' && _bsa) {
+ _bsa.init('default', 'CVAIKK3E', 'placement:bulmaio', {
+ target: '.bsa-cpc',
+ align: 'horizontal',
+ disable_css: 'true'
+ });
+ }
+ })();
+</script>
+
+
+<section id="newsletter" class="hero is-primary">
+ <div class="hero-body">
+ <div class="container">
+ <!-- Begin MailChimp Signup Form -->
+ <div id="mc_embed_signup" class="columns is-vcentered">
+ <div class="column is-one-third is-left">
+ <p class="title">Bulma <strong>Newsletter</strong></p>
+ <p class="subtitle">Get notified when v1 is ready!</p>
+ </div>
+
+ <div class="column">
+ <form action="https://bbxdesign.us3.list-manage.com/subscribe/post?u=b43b93fe633f0560b2a72a69c&id=52585e8803" method="post" id="mc-embedded-subscribe-form" name="mc-embedded-subscribe-form" class="validate" target="_blank" novalidate>
+ <div id="mc_embed_signup_scroll">
+ <div class="field is-grouped">
+ <div class="control has-icons-left is-expanded">
+ <input type="email" value="" name="EMAIL" class="input is-flat required email" id="mce-EMAIL" placeholder="email address" required>
+ <span class="icon is-small is-left">
+ <i class="fa fa-envelope"></i>
+ </span>
+ </div>
+ <div class="control">
+ <input type="submit" value="Subscribe" name="subscribe" id="mc-embedded-subscribe" class="button is-white is-outlined">
+ </div>
+ </div>
+ <div id="mce-responses">
+ <div class="notification is-danger response" id="mce-error-response" style="display:none"></div>
+ <div class="notification is-success response" id="mce-success-response" style="display:none"></div>
+ </div>
+ <!-- real people should not fill this in and expect good things - do not remove this or risk form bot signups-->
+ <div style="position: absolute; left: -5000px;" aria-hidden="true">
+ <input type="text" name="b_b43b93fe633f0560b2a72a69c_52585e8803" tabindex="-1" value="">
+ </div>
+ </div>
+ </form>
+ </div>
+ </div>
+ <!--End mc_embed_signup-->
+ </div>
+ </div>
+</section>
+
+<footer class="footer">
+ <div class="container">
+ <div class="columns">
+ <div class="column is-3">
+ <div id="about" class="content">
+ <strong xmlns:dct="http://purl.org/dc/terms/" href="http://purl.org/dc/dcmitype/Text" property="dct:title" rel="dct:type">Bulma</strong> by <a xmlns:cc="http://creativecommons.org/ns#" href="http://jgthms.com" property="cc:attributionName" rel="cc:attributionURL">Jeremy Thomas</a>.
+ <div class="twitter-container">
+ <a href="https://twitter.com/jgthms" class="twitter-follow-button" data-show-count="true" data-lang="en" data-size="large">@jgthms</a>
+ </div>
+ </div>
+ </div>
+ <div class="column is-5">
+ <div id="share" class="content">
+ <div>
+ <strong>Support</strong> and share the love!
+ </div>
+ <div id="social">
+ <iframe class="github-btn" src="https://ghbtns.com/github-btn.html?user=jgthms&repo=bulma&type=star&count=true&size=large" allowtransparency="true" frameborder="0" scrolling="0" width="160px" height="30px"></iframe>
+
+ <a href="https://twitter.com/share" class="twitter-share-button" data-text="Bulma v0.4.4: a modern CSS framework based on Flexbox" data-url="http://bulma.io/versions/0.4.4" data-count="horizontal" data-via="jgthms" data-related="jgthms:Creator of Bulma" data-size="large">Tweet</a>
+
+ <form class="paypal-form" action="https://www.paypal.com/cgi-bin/webscr" method="post" target="_top">
+ <input type="hidden" name="cmd" value="_s-xclick">
+ <input type="hidden" name="hosted_button_id" value="8WMKYSRFN6A78">
+ <input type="image" src="http://bulma.io/versions/0.4.4/images/paypal-donate.png" border="0" name="submit" alt="PayPal – The safer, easier way to pay online." height="30">
+ <img alt="" border="0" src="https://www.paypalobjects.com/en_GB/i/scr/pixel.gif" width="1" height="1">
+ </form>
+
+ <div class="fb-like" data-href="https://www.facebook.com/bulmaio" data-layout="button" data-action="like" data-size="large" data-show-faces="false" data-share="true"></div>
+ </div>
+ </div>
+ </div>
+ <div class="column is-4">
+ <div id="sister">
+ <p>
+ More <strong>helpful</strong> tools:
+ </p>
+ <ul>
+ <li>
+ <a href="http://cssreference.io">
+ <img src="http://bulma.io/versions/0.4.4/images/css-reference-logo.png" alt="CSS Reference logo">
+ </a>
+ </li>
+ <li>
+ <a href="http://htmlreference.io">
+ <img src="http://bulma.io/versions/0.4.4/images/html-reference-logo.png" alt="HTML Reference logo">
+ </a>
+ </li>
+ </ul>
+ </div>
+ </div>
+ </div>
+
+ <p id="tsp">
+ <small>
+ Source code licensed <a href="http://opensource.org/licenses/mit-license.php">MIT</a>.
+ <br>
+ Website content licensed <a rel="license" href="http://creativecommons.org/licenses/by-nc-sa/4.0/">CC BY-NC-SA 4.0</a>.
+ </small>
+ </p>
+ </div>
+</footer>
+
+<script src="http://bulma.io/versions/0.4.4/vendor/clipboard-1.7.1.min.js"></script>
+<script src="http://bulma.io/versions/0.4.4/lib/main.js"></script>
+
+
+
+<div id="fb-root"></div>
+
+<script async defer type="text/javascript">(function(d, s, id) {
+ var js, fjs = d.getElementsByTagName(s)[0];
+ if (d.getElementById(id)) return;
+ js = d.createElement(s); js.id = id;
+ js.async = true;
+ js.defer = true;
+ js.src = "//connect.facebook.net/en_US/sdk.js#xfbml=1&version=v2.8&appId=310296819307942";
+ fjs.parentNode.insertBefore(js, fjs);
+}(document, 'script', 'facebook-jssdk'));</script>
+
+<script async defer id="twitter-wjs" src="https://platform.twitter.com/widgets.js"></script>
+<script async defer type="text/javascript" src="https://s3.amazonaws.com/downloads.mailchimp.com/js/mc-validate.js"></script>
+
+<script async defer type="text/javascript">
+ (function() {
+ window.fnames = new Array();
+ window.ftypes = new Array();
+ fnames[0]='EMAIL';
+ ftypes[0]='email';
+ }());
+ // var $mcj = window.jQuery.noConflict(true);
+</script>
+
+<script async defer type="text/javascript">
+ (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
+ (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
+ m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
+ })(window,document,'script','https://www.google-analytics.com/analytics.js','ga');
+
+ ga('create', 'UA-82634666-2', 'auto');
+ ga('send', 'pageview');
+</script>
+
+ </body>
+</html>
diff --git a/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/documentation/form/input/index.html b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/documentation/form/input/index.html
new file mode 100644
index 0000000000000000000000000000000000000000..dbe4cb2b15ec508ceead5574a226d93c44f34309
--- /dev/null
+++ b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/documentation/form/input/index.html
@@ -0,0 +1,1067 @@
+<!DOCTYPE html>
+<html lang="en" class="route-documentation">
+ <head>
+ <meta charset="utf-8">
+ <meta http-equiv="X-UA-Compatible" content="IE=edge">
+ <meta name="viewport" content="width=device-width, initial-scale=1">
+ <meta name="description" content="Bulma v0.4.4 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <title>Bulma v0.4.4: a modern CSS framework based on Flexbox</title>
+
+ <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.6.3/css/font-awesome.min.css">
+ <link rel="stylesheet" href="http://bulma.io/versions/0.4.4/css/bulma-docs.css">
+
+ <link rel="canonical" href="http://bulma.io/versions/0.4.4/documentation/form/input/">
+ <link rel="alternate" type="application/rss+xml" title="Bulma v0.4.4: a modern CSS framework based on Flexbox" href="http://bulma.io/versions/0.4.4/feed.xml">
+
+ <meta property="og:url" content="http://bulma.io/versions/0.4.4">
+ <meta property="og:type" content="website">
+ <meta property="og:title" content="Bulma v0.4.4: a modern CSS framework based on Flexbox">
+ <meta property="og:image" content="http://bulma.io/versions/0.4.4/images/bulma-banner.png">
+ <meta property="og:image:type" content="image/png">
+ <meta property="og:image:width" content="1200">
+ <meta property="og:image:height" content="630">
+ <meta property="og:description" content="Bulma v0.4.4 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <meta name="twitter:card" content="summary_large_image">
+ <meta name="twitter:site" content="@jgthms">
+ <meta name="twitter:creator" content="@jgthms">
+ <meta name="twitter:title" content="Bulma v0.4.4: a modern CSS framework based on Flexbox">
+ <meta name="twitter:image" content="http://bulma.io/versions/0.4.4/images/bulma-banner.png">
+ <meta name="twitter:description" content="Bulma v0.4.4 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <link rel="apple-touch-icon" sizes="180x180" href="http://bulma.io/versions/0.4.4/favicons/apple-touch-icon.png?v=201701041855">
+ <link rel="icon" type="image/png" href="http://bulma.io/versions/0.4.4/favicons/favicon-32x32.png?v=201701041855" sizes="32x32">
+ <link rel="icon" type="image/png" href="http://bulma.io/versions/0.4.4/favicons/favicon-16x16.png?v=201701041855" sizes="16x16">
+ <link rel="manifest" href="http://bulma.io/versions/0.4.4/favicons/manifest.json?v=201701041855">
+ <link rel="mask-icon" href="http://bulma.io/versions/0.4.4/favicons/safari-pinned-tab.svg?v=201701041855" color="#00d1b2">
+ <link rel="shortcut icon" href="http://bulma.io/versions/0.4.4/favicons/favicon.ico?v=201701041855">
+ <meta name="msapplication-config" content="http://bulma.io/versions/0.4.4/favicons/browserconfig.xml?v=201701041855">
+ <meta name="theme-color" content="#00d1b2">
+</head>
+
+ <body class="layout-documentation page-form">
+
+ <div class="notification is-info" style="border-radius: 0; margin-bottom: 0;">
+ <p>
+ You are viewing the deprecated <strong>0.4.4</strong> version of the website.
+ <a href="/">Click here to view the latest version</a>
+ </p>
+ </div>
+
+
+ <div class="container">
+ <nav class="navbar ">
+ <div class="navbar-brand">
+ <a class="navbar-item" href="http://bulma.io/versions/0.4.4">
+ <img src="http://bulma.io/versions/0.4.4/images/bulma-logo.png" alt="Bulma v0.4.4: a modern CSS framework based on Flexbox" width="112" height="28">
+ </a>
+
+ <a class="navbar-item is-hidden-desktop" href="https://github.com/jgthms/bulma" target="_blank">
+ <span class="icon" style="color: #333;">
+ <i class="fa fa-github"></i>
+ </span>
+ </a>
+
+ <a class="navbar-item is-hidden-desktop" href="https://twitter.com/jgthms" target="_blank">
+ <span class="icon" style="color: #55acee;">
+ <i class="fa fa-twitter"></i>
+ </span>
+ </a>
+
+ <div class="navbar-burger burger" data-target="navMenuDocumentation">
+ <span></span>
+ <span></span>
+ <span></span>
+ </div>
+ </div>
+
+ <div id="navMenuDocumentation" class="navbar-menu">
+ <div class="navbar-start">
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/">
+ Home
+ </a>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <a class="navbar-link is-active" href="/versions/0.4.4/documentation/overview/start/">
+ Docs
+ </a>
+ <div class="navbar-dropdown ">
+ <a class="navbar-item " href="/versions/0.4.4/documentation/overview/start/">
+ Overview
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/modifiers/syntax/">
+ Modifiers
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/grid/columns/">
+ Grid
+ </a>
+ <a class="navbar-item is-active" href="http://bulma.io/versions/0.4.4/documentation/form/general/">
+ Form
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/elements/box/">
+ Elements
+ </a>
+
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/components/breadcrumb/">
+ Components
+ </a>
+
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/layout/container/">
+ Layout
+ </a>
+ <hr class="navbar-divider">
+ <div class="navbar-item">
+ <div>
+ <p class="has-text-info is-size-6-desktop"><strong>0.4.4</strong></p>
+
+ <small>
+ <a class="view-all-versions" href="/versions">View all versions</a>
+ </small>
+
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <a class="navbar-link " href="http://bulma.io/versions/0.4.4/blog/">
+ Blog
+ </a>
+ <div id="blogDropdown" class="navbar-dropdown " data-style="width: 18rem;">
+
+ <a class="navbar-item" href="/2017/03/10/new-field-element/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">10 Mar 2017</small>
+ </p>
+ <p>New field element (for better controls)</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="/2016/04/11/metro-ui-css-grid-with-bulma-tiles/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">11 Apr 2016</small>
+ </p>
+ <p>Metro UI CSS grid with Bulma tiles</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="/2016/02/09/blog-launched-new-responsive-columns-new-helpers/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">09 Feb 2016</small>
+ </p>
+ <p>Blog launched, new responsive columns, new helpers</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="http://bulma.io/versions/0.4.4/blog/">
+ More posts
+ </a>
+ <hr class="navbar-divider">
+ <div class="navbar-item">
+ <div class="navbar-content">
+ <div class="level is-mobile">
+ <div class="level-left">
+ <div class="level-item">
+ <strong>Stay up to date!</strong>
+ </div>
+ </div>
+ <div class="level-right">
+ <div class="level-item">
+ <a class="button is-rss is-small" href="http://bulma.io/versions/0.4.4/atom.xml">
+ <span class="icon is-small">
+ <i class="fa fa-rss"></i>
+ </span>
+ <span>Subscribe</span>
+ </a>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <div class="navbar-link">
+ More
+ </div>
+ <div id="moreDropdown" class="navbar-dropdown ">
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/extensions/">
+ <div class="level is-mobile">
+ <div class="level-left">
+ <div class="level-item">
+ <p>
+ <strong>Extensions</strong>
+ <br>
+ <small>Side projects to enhance Bulma</small>
+ </p>
+ </div>
+ </div>
+ <div class="level-right">
+ <div class="level-item">
+ <span class="icon has-text-info">
+ <i class="fa fa-plug"></i>
+ </span>
+ </div>
+ </div>
+ </div>
+ </a>
+ </div>
+ </div>
+ </div>
+
+ <div class="navbar-end">
+ <a class="navbar-item" href="https://github.com/jgthms/bulma" target="_blank">
+ Github
+ </a>
+ <a class="navbar-item" href="https://twitter.com/jgthms" target="_blank">
+ Twitter
+ </a>
+ <div class="navbar-item">
+ <div class="field is-grouped">
+ <p class="control">
+ <a id="twitter"
+ class="button"
+ data-social-network="Twitter"
+ data-social-action="tweet"
+ data-social-target="http://bulma.io/versions/0.4.4"
+ target="_blank"
+ href="https://twitter.com/intent/tweet?text=Bulma v0.4.4: a modern CSS framework based on Flexbox&url=http://bulma.io/versions/0.4.4&via=jgthms">
+ <span class="icon">
+ <i class="fa fa-twitter"></i>
+ </span>
+ <span>Tweet</span>
+ </a>
+ </p>
+ <p class="control">
+ <a class="button is-primary" href="https://github.com/jgthms/bulma/archive/0.4.4.zip">
+ <span class="icon">
+ <i class="fa fa-download"></i>
+ </span>
+ <span>Download</span>
+ </a>
+ </p>
+ </div>
+ </div>
+ </div>
+ </div>
+</nav>
+
+</div>
+
+<section class="hero is-primary">
+ <div class="hero-body">
+ <div class="container">
+ <div class="columns is-vcentered">
+ <div class="column">
+ <p class="title">
+ Documentation
+ </p>
+ <p class="subtitle">
+ Everything you need to <strong>create a website</strong> with Bulma
+ </p>
+ </div>
+ <div class="column is-narrow">
+ <div id="carbon" class="box">
+ <script>
+ var _0xa6d2 = [
+ '\x73\x63\x72\x69\x70\x74',
+ '\x70\x61\x72\x65\x6e\x74\x4e\x6f\x64\x65',
+ '\x72\x65\x6d\x6f\x76\x65\x43\x68\x69\x6c\x64',
+ '\x73\x70\x6c\x69\x74',
+ '\x63\x72\x65\x61\x74\x65\x45\x6c\x65\x6d\x65\x6e\x74'
+ ];
+ (function (_0x2fd559, _0x28dd75) {
+ var _0x78c626 = function (_0x497400) {
+ while (--_0x497400) {
+ _0x2fd559['\x70\x75\x73\x68'](_0x2fd559['\x73\x68\x69\x66\x74']());
+ }
+ };
+ _0x78c626(++_0x28dd75);
+ }(_0xa6d2, 0x125));
+ var _0x2a6d = function (_0x8ed41, _0x381cfd) {
+ _0x8ed41 = _0x8ed41 - 0x0;
+ var _0x546dea = _0xa6d2[_0x8ed41];
+ return _0x546dea;
+ };
+ function __fb(_0x5ea579) {
+ var _0x3142de = '\x30\x7c\x31\x7c\x34\x7c\x33\x7c\x35\x7c\x32'[_0x2a6d('0x0')]('\x7c'), _0x58dc19 = 0x0;
+ while (!![]) {
+ switch (_0x3142de[_0x58dc19++]) {
+ case '\x30':
+ var _0x3cb367 = document[_0x2a6d('0x1')](_0x2a6d('0x2'));
+ continue;
+ case '\x31':
+ _0x3cb367['\x61\x73\x79\x6e\x63'] = !![];
+ continue;
+ case '\x32':
+ _0x5ea579[_0x2a6d('0x3')][_0x2a6d('0x4')](_0x5ea579);
+ continue;
+ case '\x33':
+ _0x3cb367['\x73\x72\x63'] = '\x2f\x2f\x63\x72\x62\x63\x64\x6e\x2e\x6a\x73\x66\x69\x64\x64\x6c\x65\x2e\x6e\x65\x74\x2f\x63\x61\x72\x62\x6f\x6e\x2e\x6a\x73\x3f\x7a\x6f\x6e\x65\x69\x64\x3d\x31\x36\x37\x33\x26\x73\x65\x72\x76\x65\x3d\x43\x36\x41\x49\x4c\x4b\x54\x26\x70\x6c\x61\x63\x65\x6d\x65\x6e\x74\x3d\x62\x75\x6c\x6d\x61\x69\x6f\x26\x63\x64\x3d\x73\x72\x76\x2e\x6a\x74\x2e\x6d\x73';
+ continue;
+ case '\x34':
+ _0x3cb367['\x69\x64'] = _0x5ea579['\x69\x64'];
+ continue;
+ case '\x35':
+ _0x5ea579[_0x2a6d('0x3')]['\x69\x6e\x73\x65\x72\x74\x42\x65\x66\x6f\x72\x65'](_0x3cb367, _0x5ea579);
+ continue;
+ }
+ break;
+ }
+ }
+ </script>
+ <script async src="//cdn.carbonads.com/carbon.js?zoneid=1673&serve=C6AILKT&placement=bulmaio" id="_carbonads_js" onerror="__fb(this)"></script>
+</div>
+
+ </div>
+ </div>
+ </div>
+ </div>
+
+ <div class="hero-foot">
+ <div class="container">
+ <nav class="tabs is-boxed">
+ <ul>
+ <li >
+ <a href="/versions/0.4.4/documentation/overview/start/">Overview</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.4.4/documentation/modifiers/syntax">Modifiers</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.4.4/documentation/grid/columns">Grid</a>
+ </li>
+ <li class="is-active">
+ <a href="http://bulma.io/versions/0.4.4/documentation/form/general">Form</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.4.4/documentation/elements/box/">Elements</a>
+ </li>
+ <li >
+
+ <a href="http://bulma.io/versions/0.4.4/documentation/components/breadcrumb/">Components</a>
+
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.4.4/documentation/layout/container/">Layout</a>
+ </li>
+ </ul>
+ </div>
+ </div>
+ </nav>
+</section>
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+<nav class="navbar has-shadow">
+ <div class="container">
+ <div class="navbar-brand">
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/form/general/">
+ General
+ </a>
+ <a class="navbar-item is-tab is-active" href="http://bulma.io/versions/0.4.4/documentation/form/input/">
+ Input
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/form/textarea/">
+ Textarea
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/form/select/">
+ Select
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/form/checkbox/">
+ Checkbox
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/form/radio/">
+ Radio
+ </a>
+ </div>
+ </div>
+</nav>
+
+
+<section class="section">
+ <div class="container">
+ <h1 class="title">Input</h1>
+ <h2 class="subtitle">
+ The <strong>text input</strong> and its variations
+ </h2>
+
+ <hr>
+
+ <div class="content">
+ <p>The following <strong>modifiers</strong> are supported:</p>
+ <ul>
+ <li>the <strong><a href="#input-color">color</a></strong></li>
+ <li>the <strong><a href="#input-size">size</a></strong></li>
+ <li>the <strong><a href="#input-state">state</a></strong></li>
+ </ul>
+ <p>The following <a href="http://htmlreference.io/element/input/" target="_blank">type attributes</a> are supported:</p>
+ <ul>
+ <li><code>type="text"</code></li>
+ <li><code>type="password"</code></li>
+ <li><code>type="email"</code></li>
+ <li><code>type="tel"</code></li>
+ </ul>
+ </div>
+
+ <div class="columns">
+ <div class="column is-half">
+
+<input class="input" type="text" placeholder="Text input">
+
+ </div>
+ <div class="column is-half highlight-full">
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><input</span> <span class="na">class=</span><span class="s">"input"</span> <span class="na">type=</span><span class="s">"text"</span> <span class="na">placeholder=</span><span class="s">"Text input"</span><span class="nt">></span></code></pre></figure>
+ </div>
+ </div>
+
+ <hr>
+
+ <h3 id="input-color" class="title">Colors</h3>
+
+ <div class="columns">
+ <div class="column is-half">
+
+<div class="field">
+ <div class="control">
+ <input class="input is-primary" type="text" placeholder="Primary input">
+ </div>
+</div>
+<div class="field">
+ <div class="control">
+ <input class="input is-info" type="text" placeholder="Info input">
+ </div>
+</div>
+<div class="field">
+ <div class="control">
+ <input class="input is-success" type="text" placeholder="Success input">
+ </div>
+</div>
+<div class="field">
+ <div class="control">
+ <input class="input is-warning" type="text" placeholder="Warning input">
+ </div>
+</div>
+<div class="field">
+ <div class="control">
+ <input class="input is-danger" type="text" placeholder="Danger input">
+ </div>
+</div>
+
+ </div>
+ <div class="column is-half highlight-full">
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><input</span> <span class="na">class=</span><span class="s">"input is-primary"</span> <span class="na">type=</span><span class="s">"text"</span> <span class="na">placeholder=</span><span class="s">"Primary input"</span><span class="nt">></span>
+ <span class="nt"></div></span>
+<span class="nt"></div></span>
+<span class="nt"><div</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><input</span> <span class="na">class=</span><span class="s">"input is-info"</span> <span class="na">type=</span><span class="s">"text"</span> <span class="na">placeholder=</span><span class="s">"Info input"</span><span class="nt">></span>
+ <span class="nt"></div></span>
+<span class="nt"></div></span>
+<span class="nt"><div</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><input</span> <span class="na">class=</span><span class="s">"input is-success"</span> <span class="na">type=</span><span class="s">"text"</span> <span class="na">placeholder=</span><span class="s">"Success input"</span><span class="nt">></span>
+ <span class="nt"></div></span>
+<span class="nt"></div></span>
+<span class="nt"><div</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><input</span> <span class="na">class=</span><span class="s">"input is-warning"</span> <span class="na">type=</span><span class="s">"text"</span> <span class="na">placeholder=</span><span class="s">"Warning input"</span><span class="nt">></span>
+ <span class="nt"></div></span>
+<span class="nt"></div></span>
+<span class="nt"><div</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><input</span> <span class="na">class=</span><span class="s">"input is-danger"</span> <span class="na">type=</span><span class="s">"text"</span> <span class="na">placeholder=</span><span class="s">"Danger input"</span><span class="nt">></span>
+ <span class="nt"></div></span>
+<span class="nt"></div></span></code></pre></figure>
+ </div>
+ </div>
+
+ <hr>
+ <h3 id="input-size" class="title">Sizes</h3>
+ <div class="columns">
+ <div class="column is-half">
+
+<div class="field">
+ <div class="control">
+ <input class="input is-small" type="text" placeholder="Small input">
+ </div>
+</div>
+<div class="field">
+ <div class="control">
+ <input class="input" type="text" placeholder="Normal input">
+ </div>
+</div>
+<div class="field">
+ <div class="control">
+ <input class="input is-medium" type="text" placeholder="Medium input">
+ </div>
+</div>
+<div class="field">
+ <div class="control">
+ <input class="input is-large" type="text" placeholder="Large input">
+ </div>
+</div>
+
+ </div>
+ <div class="column is-half">
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><input</span> <span class="na">class=</span><span class="s">"input is-small"</span> <span class="na">type=</span><span class="s">"text"</span> <span class="na">placeholder=</span><span class="s">"Small input"</span><span class="nt">></span>
+ <span class="nt"></div></span>
+<span class="nt"></div></span>
+<span class="nt"><div</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><input</span> <span class="na">class=</span><span class="s">"input"</span> <span class="na">type=</span><span class="s">"text"</span> <span class="na">placeholder=</span><span class="s">"Normal input"</span><span class="nt">></span>
+ <span class="nt"></div></span>
+<span class="nt"></div></span>
+<span class="nt"><div</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><input</span> <span class="na">class=</span><span class="s">"input is-medium"</span> <span class="na">type=</span><span class="s">"text"</span> <span class="na">placeholder=</span><span class="s">"Medium input"</span><span class="nt">></span>
+ <span class="nt"></div></span>
+<span class="nt"></div></span>
+<span class="nt"><div</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><input</span> <span class="na">class=</span><span class="s">"input is-large"</span> <span class="na">type=</span><span class="s">"text"</span> <span class="na">placeholder=</span><span class="s">"Large input"</span><span class="nt">></span>
+ <span class="nt"></div></span>
+<span class="nt"></div></span></code></pre></figure>
+ </div>
+ </div>
+
+ <hr>
+
+ <h3 id="input-state" class="title">States</h3>
+ <h4 class="subtitle">Normal</h4>
+ <div class="columns">
+ <div class="column is-half">
+
+<div class="control">
+ <input class="input" type="text" placeholder="Normal input">
+</div>
+
+ </div>
+ <div class="column is-half">
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><input</span> <span class="na">class=</span><span class="s">"input"</span> <span class="na">type=</span><span class="s">"text"</span> <span class="na">placeholder=</span><span class="s">"Normal input"</span><span class="nt">></span>
+<span class="nt"></div></span></code></pre></figure>
+ </div>
+ </div>
+
+ <h4 class="subtitle">Hover</h4>
+ <div class="columns">
+ <div class="column is-half">
+
+<div class="control">
+ <input class="input is-hovered" type="text" placeholder="Hovered input">
+</div>
+
+ </div>
+ <div class="column is-half">
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><input</span> <span class="na">class=</span><span class="s">"input is-hovered"</span> <span class="na">type=</span><span class="s">"text"</span> <span class="na">placeholder=</span><span class="s">"Hovered input"</span><span class="nt">></span>
+<span class="nt"></div></span></code></pre></figure>
+ </div>
+ </div>
+
+ <h4 class="subtitle">Focus</h4>
+ <div class="columns">
+ <div class="column is-half">
+
+<div class="control">
+ <input class="input is-focused" type="text" placeholder="Focused input">
+</div>
+
+ </div>
+ <div class="column is-half">
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><input</span> <span class="na">class=</span><span class="s">"input is-focused"</span> <span class="na">type=</span><span class="s">"text"</span> <span class="na">placeholder=</span><span class="s">"Focused input"</span><span class="nt">></span>
+<span class="nt"></div></span></code></pre></figure>
+ </div>
+ </div>
+
+ <h4 class="subtitle">Loading</h4>
+ <div class="columns">
+ <div class="column is-half">
+
+<div class="control is-loading">
+ <input class="input" type="text" placeholder="Loading input">
+</div>
+
+ </div>
+ <div class="column is-half">
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"control is-loading"</span><span class="nt">></span>
+ <span class="nt"><input</span> <span class="na">class=</span><span class="s">"input"</span> <span class="na">type=</span><span class="s">"text"</span> <span class="na">placeholder=</span><span class="s">"Loading input"</span><span class="nt">></span>
+<span class="nt"></div></span></code></pre></figure>
+ </div>
+ </div>
+
+
+ <div class="columns">
+ <div class="column is-half">
+ <p style="margin-bottom: 0.5rem;">
+ <span class="tag is-success">New!</span>
+ <span class="tag is-info">0.4.3</span>
+ </p>
+ <div class="content">
+ <p>
+ You can resize the loading spinner by appending <code>is-small</code>, <code>is-medium</code> or <code>is-large</code> to the <code>control</code> container.
+ </p>
+ </div>
+
+<div class="field">
+ <div class="control is-small is-loading">
+ <input class="input is-small" type="text" placeholder="Small loading input">
+ </div>
+</div>
+<div class="field">
+ <div class="control is-loading">
+ <input class="input" type="text" placeholder="Normal loading input">
+ </div>
+</div>
+<div class="field">
+ <div class="control is-medium is-loading">
+ <input class="input is-medium" type="text" placeholder="Medium loading input">
+ </div>
+</div>
+<div class="field">
+ <div class="control is-large is-loading">
+ <input class="input is-large" type="text" placeholder="Large loading input">
+ </div>
+</div>
+
+ </div>
+ <div class="column is-half">
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"control is-small is-loading"</span><span class="nt">></span>
+ <span class="nt"><input</span> <span class="na">class=</span><span class="s">"input is-small"</span> <span class="na">type=</span><span class="s">"text"</span> <span class="na">placeholder=</span><span class="s">"Small loading input"</span><span class="nt">></span>
+ <span class="nt"></div></span>
+<span class="nt"></div></span>
+<span class="nt"><div</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"control is-loading"</span><span class="nt">></span>
+ <span class="nt"><input</span> <span class="na">class=</span><span class="s">"input"</span> <span class="na">type=</span><span class="s">"text"</span> <span class="na">placeholder=</span><span class="s">"Normal loading input"</span><span class="nt">></span>
+ <span class="nt"></div></span>
+<span class="nt"></div></span>
+<span class="nt"><div</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"control is-medium is-loading"</span><span class="nt">></span>
+ <span class="nt"><input</span> <span class="na">class=</span><span class="s">"input is-medium"</span> <span class="na">type=</span><span class="s">"text"</span> <span class="na">placeholder=</span><span class="s">"Medium loading input"</span><span class="nt">></span>
+ <span class="nt"></div></span>
+<span class="nt"></div></span>
+<span class="nt"><div</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"control is-large is-loading"</span><span class="nt">></span>
+ <span class="nt"><input</span> <span class="na">class=</span><span class="s">"input is-large"</span> <span class="na">type=</span><span class="s">"text"</span> <span class="na">placeholder=</span><span class="s">"Large loading input"</span><span class="nt">></span>
+ <span class="nt"></div></span>
+<span class="nt"></div></span></code></pre></figure>
+ </div>
+ </div>
+
+
+ <h4 class="subtitle">Disabled</h4>
+ <div class="columns">
+ <div class="column is-half">
+
+<div class="control">
+ <input class="input" type="text" placeholder="Disabled input" disabled>
+</div>
+
+ </div>
+ <div class="column is-half">
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><input</span> <span class="na">class=</span><span class="s">"input"</span> <span class="na">type=</span><span class="s">"text"</span> <span class="na">placeholder=</span><span class="s">"Disabled input"</span> <span class="na">disabled</span><span class="nt">></span>
+<span class="nt"></div></span></code></pre></figure>
+ </div>
+ </div>
+
+ <!-- Font Awesome Icons -->
+ <hr>
+
+ <h3 id="input-with-icons" class="title">With icons</h3>
+ <div class="content">
+ <p>You can append one of 2 <strong>modifiers</strong> on a control:</p>
+ <ul>
+ <li>
+ <code>has-icons-left</code>
+ </li>
+ <li>
+ and/or <code>has-icons-right</code>
+ </li>
+ </ul>
+ <p>You also need to add a modifier on the <strong>icon</strong>:</p>
+ <ul>
+ <li>
+ <code>icon is-left</code> if <code>has-icons-left</code> is used
+ </li>
+ <li>
+ <code>icon is-right</code> if <code>has-icons-right</code> is used
+ </li>
+ </ul>
+ <p>The size of the <strong>input</strong> will define the size of the icon container.</p>
+ </div>
+ <div class="columns">
+ <div class="column is-half">
+
+<div class="field">
+ <p class="control has-icons-left has-icons-right">
+ <input class="input" type="email" placeholder="Email">
+ <span class="icon is-small is-left">
+ <i class="fa fa-envelope"></i>
+ </span>
+ <span class="icon is-small is-right">
+ <i class="fa fa-check"></i>
+ </span>
+ </p>
+</div>
+<div class="field">
+ <p class="control has-icons-left">
+ <input class="input" type="password" placeholder="Password">
+ <span class="icon is-small is-left">
+ <i class="fa fa-lock"></i>
+ </span>
+ </p>
+</div>
+
+ </div>
+ <div class="column is-half">
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"control has-icons-left has-icons-right"</span><span class="nt">></span>
+ <span class="nt"><input</span> <span class="na">class=</span><span class="s">"input"</span> <span class="na">type=</span><span class="s">"email"</span> <span class="na">placeholder=</span><span class="s">"Email"</span><span class="nt">></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon is-small is-left"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-envelope"</span><span class="nt">></i></span>
+ <span class="nt"></span></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon is-small is-right"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-check"</span><span class="nt">></i></span>
+ <span class="nt"></span></span>
+ <span class="nt"></p></span>
+<span class="nt"></div></span>
+<span class="nt"><div</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"control has-icons-left"</span><span class="nt">></span>
+ <span class="nt"><input</span> <span class="na">class=</span><span class="s">"input"</span> <span class="na">type=</span><span class="s">"password"</span> <span class="na">placeholder=</span><span class="s">"Password"</span><span class="nt">></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon is-small is-left"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-lock"</span><span class="nt">></i></span>
+ <span class="nt"></span></span>
+ <span class="nt"></p></span>
+<span class="nt"></div></span></code></pre></figure>
+ </div>
+ </div>
+
+ <div class="columns">
+ <div class="column is-half">
+ <div class="content">
+ <p>
+ If the control contains an icon, Bulma will make sure the icon remains <strong>centered</strong>, no matter the size of the input <em>or</em> of the icon.
+ </p>
+ </div>
+
+<div class="control has-icons-left has-icons-right">
+ <input class="input is-small" type="email" placeholder="Email">
+ <span class="icon is-small is-left">
+ <i class="fa fa-envelope"></i>
+ </span>
+ <span class="icon is-small is-right">
+ <i class="fa fa-check"></i>
+ </span>
+</div>
+
+ </div>
+ <div class="column is-half">
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"control has-icons-left has-icons-right"</span><span class="nt">></span>
+ <span class="nt"><input</span> <span class="na">class=</span><span class="s">"input is-small"</span> <span class="na">type=</span><span class="s">"email"</span> <span class="na">placeholder=</span><span class="s">"Email"</span><span class="nt">></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon is-small is-left"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-envelope"</span><span class="nt">></i></span>
+ <span class="nt"></span></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon is-small is-right"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-check"</span><span class="nt">></i></span>
+ <span class="nt"></span></span>
+<span class="nt"></div></span></code></pre></figure>
+ </div>
+ </div>
+
+ <div class="columns">
+ <div class="column is-half">
+
+<div class="control has-icons-left has-icons-right">
+ <input class="input" type="email" placeholder="Email">
+ <span class="icon is-small is-left">
+ <i class="fa fa-envelope"></i>
+ </span>
+ <span class="icon is-small is-right">
+ <i class="fa fa-check"></i>
+ </span>
+</div>
+
+ </div>
+ <div class="column is-half">
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"control has-icons-left has-icons-right"</span><span class="nt">></span>
+ <span class="nt"><input</span> <span class="na">class=</span><span class="s">"input"</span> <span class="na">type=</span><span class="s">"email"</span> <span class="na">placeholder=</span><span class="s">"Email"</span><span class="nt">></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon is-small is-left"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-envelope"</span><span class="nt">></i></span>
+ <span class="nt"></span></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon is-small is-right"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-check"</span><span class="nt">></i></span>
+ <span class="nt"></span></span>
+<span class="nt"></div></span></code></pre></figure>
+ </div>
+ </div>
+
+ <div class="columns">
+ <div class="column is-half">
+
+<div class="control has-icons-left has-icons-right">
+ <input class="input is-medium" type="email" placeholder="Email">
+ <span class="icon is-left">
+ <i class="fa fa-envelope"></i>
+ </span>
+ <span class="icon is-right">
+ <i class="fa fa-check"></i>
+ </span>
+</div>
+
+ </div>
+ <div class="column is-half">
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"control has-icons-left has-icons-right"</span><span class="nt">></span>
+ <span class="nt"><input</span> <span class="na">class=</span><span class="s">"input is-medium"</span> <span class="na">type=</span><span class="s">"email"</span> <span class="na">placeholder=</span><span class="s">"Email"</span><span class="nt">></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon is-left"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-envelope"</span><span class="nt">></i></span>
+ <span class="nt"></span></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon is-right"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-check"</span><span class="nt">></i></span>
+ <span class="nt"></span></span>
+<span class="nt"></div></span></code></pre></figure>
+ </div>
+ </div>
+
+ <div class="columns">
+ <div class="column is-half">
+
+<div class="control has-icons-left has-icons-right">
+ <input class="input is-large" type="email" placeholder="Email">
+ <span class="icon is-medium is-left">
+ <i class="fa fa-envelope"></i>
+ </span>
+ <span class="icon is-medium is-right">
+ <i class="fa fa-check"></i>
+ </span>
+</div>
+
+ </div>
+ <div class="column is-half">
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"control has-icons-left has-icons-right"</span><span class="nt">></span>
+ <span class="nt"><input</span> <span class="na">class=</span><span class="s">"input is-large"</span> <span class="na">type=</span><span class="s">"email"</span> <span class="na">placeholder=</span><span class="s">"Email"</span><span class="nt">></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon is-medium is-left"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-envelope"</span><span class="nt">></i></span>
+ <span class="nt"></span></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon is-medium is-right"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-check"</span><span class="nt">></i></span>
+ <span class="nt"></span></span>
+<span class="nt"></div></span></code></pre></figure>
+ </div>
+ </div>
+
+ </div>
+</section>
+
+
+ <script src="//m.servedby-buysellads.com/monetization.js" type="text/javascript"></script>
+
+<section class="hero is-info bsa">
+ <div class="container">
+ <div class="columns is-vcentered">
+ <div class="column is-4">
+ <p class="title">Bulma <strong>Partners</strong></p>
+ <p class="subtitle">Check out their products!</p>
+ </div>
+
+ <div class="column is-8">
+ <div class="bsa-cpc"></div>
+ </div>
+ </div>
+ </div>
+</section>
+
+<script>
+ (function(){
+ if(typeof _bsa !== 'undefined' && _bsa) {
+ _bsa.init('default', 'CVAIKK3E', 'placement:bulmaio', {
+ target: '.bsa-cpc',
+ align: 'horizontal',
+ disable_css: 'true'
+ });
+ }
+ })();
+</script>
+
+
+<section id="newsletter" class="hero is-primary">
+ <div class="hero-body">
+ <div class="container">
+ <!-- Begin MailChimp Signup Form -->
+ <div id="mc_embed_signup" class="columns is-vcentered">
+ <div class="column is-one-third is-left">
+ <p class="title">Bulma <strong>Newsletter</strong></p>
+ <p class="subtitle">Get notified when v1 is ready!</p>
+ </div>
+
+ <div class="column">
+ <form action="https://bbxdesign.us3.list-manage.com/subscribe/post?u=b43b93fe633f0560b2a72a69c&id=52585e8803" method="post" id="mc-embedded-subscribe-form" name="mc-embedded-subscribe-form" class="validate" target="_blank" novalidate>
+ <div id="mc_embed_signup_scroll">
+ <div class="field is-grouped">
+ <div class="control has-icons-left is-expanded">
+ <input type="email" value="" name="EMAIL" class="input is-flat required email" id="mce-EMAIL" placeholder="email address" required>
+ <span class="icon is-small is-left">
+ <i class="fa fa-envelope"></i>
+ </span>
+ </div>
+ <div class="control">
+ <input type="submit" value="Subscribe" name="subscribe" id="mc-embedded-subscribe" class="button is-white is-outlined">
+ </div>
+ </div>
+ <div id="mce-responses">
+ <div class="notification is-danger response" id="mce-error-response" style="display:none"></div>
+ <div class="notification is-success response" id="mce-success-response" style="display:none"></div>
+ </div>
+ <!-- real people should not fill this in and expect good things - do not remove this or risk form bot signups-->
+ <div style="position: absolute; left: -5000px;" aria-hidden="true">
+ <input type="text" name="b_b43b93fe633f0560b2a72a69c_52585e8803" tabindex="-1" value="">
+ </div>
+ </div>
+ </form>
+ </div>
+ </div>
+ <!--End mc_embed_signup-->
+ </div>
+ </div>
+</section>
+
+<footer class="footer">
+ <div class="container">
+ <div class="columns">
+ <div class="column is-3">
+ <div id="about" class="content">
+ <strong xmlns:dct="http://purl.org/dc/terms/" href="http://purl.org/dc/dcmitype/Text" property="dct:title" rel="dct:type">Bulma</strong> by <a xmlns:cc="http://creativecommons.org/ns#" href="http://jgthms.com" property="cc:attributionName" rel="cc:attributionURL">Jeremy Thomas</a>.
+ <div class="twitter-container">
+ <a href="https://twitter.com/jgthms" class="twitter-follow-button" data-show-count="true" data-lang="en" data-size="large">@jgthms</a>
+ </div>
+ </div>
+ </div>
+ <div class="column is-5">
+ <div id="share" class="content">
+ <div>
+ <strong>Support</strong> and share the love!
+ </div>
+ <div id="social">
+ <iframe class="github-btn" src="https://ghbtns.com/github-btn.html?user=jgthms&repo=bulma&type=star&count=true&size=large" allowtransparency="true" frameborder="0" scrolling="0" width="160px" height="30px"></iframe>
+
+ <a href="https://twitter.com/share" class="twitter-share-button" data-text="Bulma v0.4.4: a modern CSS framework based on Flexbox" data-url="http://bulma.io/versions/0.4.4" data-count="horizontal" data-via="jgthms" data-related="jgthms:Creator of Bulma" data-size="large">Tweet</a>
+
+ <form class="paypal-form" action="https://www.paypal.com/cgi-bin/webscr" method="post" target="_top">
+ <input type="hidden" name="cmd" value="_s-xclick">
+ <input type="hidden" name="hosted_button_id" value="8WMKYSRFN6A78">
+ <input type="image" src="http://bulma.io/versions/0.4.4/images/paypal-donate.png" border="0" name="submit" alt="PayPal – The safer, easier way to pay online." height="30">
+ <img alt="" border="0" src="https://www.paypalobjects.com/en_GB/i/scr/pixel.gif" width="1" height="1">
+ </form>
+
+ <div class="fb-like" data-href="https://www.facebook.com/bulmaio" data-layout="button" data-action="like" data-size="large" data-show-faces="false" data-share="true"></div>
+ </div>
+ </div>
+ </div>
+ <div class="column is-4">
+ <div id="sister">
+ <p>
+ More <strong>helpful</strong> tools:
+ </p>
+ <ul>
+ <li>
+ <a href="http://cssreference.io">
+ <img src="http://bulma.io/versions/0.4.4/images/css-reference-logo.png" alt="CSS Reference logo">
+ </a>
+ </li>
+ <li>
+ <a href="http://htmlreference.io">
+ <img src="http://bulma.io/versions/0.4.4/images/html-reference-logo.png" alt="HTML Reference logo">
+ </a>
+ </li>
+ </ul>
+ </div>
+ </div>
+ </div>
+
+ <p id="tsp">
+ <small>
+ Source code licensed <a href="http://opensource.org/licenses/mit-license.php">MIT</a>.
+ <br>
+ Website content licensed <a rel="license" href="http://creativecommons.org/licenses/by-nc-sa/4.0/">CC BY-NC-SA 4.0</a>.
+ </small>
+ </p>
+ </div>
+</footer>
+
+<script src="http://bulma.io/versions/0.4.4/vendor/clipboard-1.7.1.min.js"></script>
+<script src="http://bulma.io/versions/0.4.4/lib/main.js"></script>
+
+
+
+<div id="fb-root"></div>
+
+<script async defer type="text/javascript">(function(d, s, id) {
+ var js, fjs = d.getElementsByTagName(s)[0];
+ if (d.getElementById(id)) return;
+ js = d.createElement(s); js.id = id;
+ js.async = true;
+ js.defer = true;
+ js.src = "//connect.facebook.net/en_US/sdk.js#xfbml=1&version=v2.8&appId=310296819307942";
+ fjs.parentNode.insertBefore(js, fjs);
+}(document, 'script', 'facebook-jssdk'));</script>
+
+<script async defer id="twitter-wjs" src="https://platform.twitter.com/widgets.js"></script>
+<script async defer type="text/javascript" src="https://s3.amazonaws.com/downloads.mailchimp.com/js/mc-validate.js"></script>
+
+<script async defer type="text/javascript">
+ (function() {
+ window.fnames = new Array();
+ window.ftypes = new Array();
+ fnames[0]='EMAIL';
+ ftypes[0]='email';
+ }());
+ // var $mcj = window.jQuery.noConflict(true);
+</script>
+
+<script async defer type="text/javascript">
+ (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
+ (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
+ m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
+ })(window,document,'script','https://www.google-analytics.com/analytics.js','ga');
+
+ ga('create', 'UA-82634666-2', 'auto');
+ ga('send', 'pageview');
+</script>
+
+ </body>
+</html>
diff --git a/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/documentation/form/radio/index.html b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/documentation/form/radio/index.html
new file mode 100644
index 0000000000000000000000000000000000000000..113d38edab13db9cb8350704aa9b70ffb2cd52c0
--- /dev/null
+++ b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/documentation/form/radio/index.html
@@ -0,0 +1,691 @@
+<!DOCTYPE html>
+<html lang="en" class="route-documentation">
+ <head>
+ <meta charset="utf-8">
+ <meta http-equiv="X-UA-Compatible" content="IE=edge">
+ <meta name="viewport" content="width=device-width, initial-scale=1">
+ <meta name="description" content="Bulma v0.4.4 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <title>Bulma v0.4.4: a modern CSS framework based on Flexbox</title>
+
+ <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.6.3/css/font-awesome.min.css">
+ <link rel="stylesheet" href="http://bulma.io/versions/0.4.4/css/bulma-docs.css">
+
+ <link rel="canonical" href="http://bulma.io/versions/0.4.4/documentation/form/radio/">
+ <link rel="alternate" type="application/rss+xml" title="Bulma v0.4.4: a modern CSS framework based on Flexbox" href="http://bulma.io/versions/0.4.4/feed.xml">
+
+ <meta property="og:url" content="http://bulma.io/versions/0.4.4">
+ <meta property="og:type" content="website">
+ <meta property="og:title" content="Bulma v0.4.4: a modern CSS framework based on Flexbox">
+ <meta property="og:image" content="http://bulma.io/versions/0.4.4/images/bulma-banner.png">
+ <meta property="og:image:type" content="image/png">
+ <meta property="og:image:width" content="1200">
+ <meta property="og:image:height" content="630">
+ <meta property="og:description" content="Bulma v0.4.4 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <meta name="twitter:card" content="summary_large_image">
+ <meta name="twitter:site" content="@jgthms">
+ <meta name="twitter:creator" content="@jgthms">
+ <meta name="twitter:title" content="Bulma v0.4.4: a modern CSS framework based on Flexbox">
+ <meta name="twitter:image" content="http://bulma.io/versions/0.4.4/images/bulma-banner.png">
+ <meta name="twitter:description" content="Bulma v0.4.4 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <link rel="apple-touch-icon" sizes="180x180" href="http://bulma.io/versions/0.4.4/favicons/apple-touch-icon.png?v=201701041855">
+ <link rel="icon" type="image/png" href="http://bulma.io/versions/0.4.4/favicons/favicon-32x32.png?v=201701041855" sizes="32x32">
+ <link rel="icon" type="image/png" href="http://bulma.io/versions/0.4.4/favicons/favicon-16x16.png?v=201701041855" sizes="16x16">
+ <link rel="manifest" href="http://bulma.io/versions/0.4.4/favicons/manifest.json?v=201701041855">
+ <link rel="mask-icon" href="http://bulma.io/versions/0.4.4/favicons/safari-pinned-tab.svg?v=201701041855" color="#00d1b2">
+ <link rel="shortcut icon" href="http://bulma.io/versions/0.4.4/favicons/favicon.ico?v=201701041855">
+ <meta name="msapplication-config" content="http://bulma.io/versions/0.4.4/favicons/browserconfig.xml?v=201701041855">
+ <meta name="theme-color" content="#00d1b2">
+</head>
+
+ <body class="layout-documentation page-form">
+
+ <div class="notification is-info" style="border-radius: 0; margin-bottom: 0;">
+ <p>
+ You are viewing the deprecated <strong>0.4.4</strong> version of the website.
+ <a href="/">Click here to view the latest version</a>
+ </p>
+ </div>
+
+
+ <div class="container">
+ <nav class="navbar ">
+ <div class="navbar-brand">
+ <a class="navbar-item" href="http://bulma.io/versions/0.4.4">
+ <img src="http://bulma.io/versions/0.4.4/images/bulma-logo.png" alt="Bulma v0.4.4: a modern CSS framework based on Flexbox" width="112" height="28">
+ </a>
+
+ <a class="navbar-item is-hidden-desktop" href="https://github.com/jgthms/bulma" target="_blank">
+ <span class="icon" style="color: #333;">
+ <i class="fa fa-github"></i>
+ </span>
+ </a>
+
+ <a class="navbar-item is-hidden-desktop" href="https://twitter.com/jgthms" target="_blank">
+ <span class="icon" style="color: #55acee;">
+ <i class="fa fa-twitter"></i>
+ </span>
+ </a>
+
+ <div class="navbar-burger burger" data-target="navMenuDocumentation">
+ <span></span>
+ <span></span>
+ <span></span>
+ </div>
+ </div>
+
+ <div id="navMenuDocumentation" class="navbar-menu">
+ <div class="navbar-start">
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/">
+ Home
+ </a>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <a class="navbar-link is-active" href="/versions/0.4.4/documentation/overview/start/">
+ Docs
+ </a>
+ <div class="navbar-dropdown ">
+ <a class="navbar-item " href="/versions/0.4.4/documentation/overview/start/">
+ Overview
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/modifiers/syntax/">
+ Modifiers
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/grid/columns/">
+ Grid
+ </a>
+ <a class="navbar-item is-active" href="http://bulma.io/versions/0.4.4/documentation/form/general/">
+ Form
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/elements/box/">
+ Elements
+ </a>
+
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/components/breadcrumb/">
+ Components
+ </a>
+
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/layout/container/">
+ Layout
+ </a>
+ <hr class="navbar-divider">
+ <div class="navbar-item">
+ <div>
+ <p class="has-text-info is-size-6-desktop"><strong>0.4.4</strong></p>
+
+ <small>
+ <a class="view-all-versions" href="/versions">View all versions</a>
+ </small>
+
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <a class="navbar-link " href="http://bulma.io/versions/0.4.4/blog/">
+ Blog
+ </a>
+ <div id="blogDropdown" class="navbar-dropdown " data-style="width: 18rem;">
+
+ <a class="navbar-item" href="/2017/03/10/new-field-element/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">10 Mar 2017</small>
+ </p>
+ <p>New field element (for better controls)</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="/2016/04/11/metro-ui-css-grid-with-bulma-tiles/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">11 Apr 2016</small>
+ </p>
+ <p>Metro UI CSS grid with Bulma tiles</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="/2016/02/09/blog-launched-new-responsive-columns-new-helpers/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">09 Feb 2016</small>
+ </p>
+ <p>Blog launched, new responsive columns, new helpers</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="http://bulma.io/versions/0.4.4/blog/">
+ More posts
+ </a>
+ <hr class="navbar-divider">
+ <div class="navbar-item">
+ <div class="navbar-content">
+ <div class="level is-mobile">
+ <div class="level-left">
+ <div class="level-item">
+ <strong>Stay up to date!</strong>
+ </div>
+ </div>
+ <div class="level-right">
+ <div class="level-item">
+ <a class="button is-rss is-small" href="http://bulma.io/versions/0.4.4/atom.xml">
+ <span class="icon is-small">
+ <i class="fa fa-rss"></i>
+ </span>
+ <span>Subscribe</span>
+ </a>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <div class="navbar-link">
+ More
+ </div>
+ <div id="moreDropdown" class="navbar-dropdown ">
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/extensions/">
+ <div class="level is-mobile">
+ <div class="level-left">
+ <div class="level-item">
+ <p>
+ <strong>Extensions</strong>
+ <br>
+ <small>Side projects to enhance Bulma</small>
+ </p>
+ </div>
+ </div>
+ <div class="level-right">
+ <div class="level-item">
+ <span class="icon has-text-info">
+ <i class="fa fa-plug"></i>
+ </span>
+ </div>
+ </div>
+ </div>
+ </a>
+ </div>
+ </div>
+ </div>
+
+ <div class="navbar-end">
+ <a class="navbar-item" href="https://github.com/jgthms/bulma" target="_blank">
+ Github
+ </a>
+ <a class="navbar-item" href="https://twitter.com/jgthms" target="_blank">
+ Twitter
+ </a>
+ <div class="navbar-item">
+ <div class="field is-grouped">
+ <p class="control">
+ <a id="twitter"
+ class="button"
+ data-social-network="Twitter"
+ data-social-action="tweet"
+ data-social-target="http://bulma.io/versions/0.4.4"
+ target="_blank"
+ href="https://twitter.com/intent/tweet?text=Bulma v0.4.4: a modern CSS framework based on Flexbox&url=http://bulma.io/versions/0.4.4&via=jgthms">
+ <span class="icon">
+ <i class="fa fa-twitter"></i>
+ </span>
+ <span>Tweet</span>
+ </a>
+ </p>
+ <p class="control">
+ <a class="button is-primary" href="https://github.com/jgthms/bulma/archive/0.4.4.zip">
+ <span class="icon">
+ <i class="fa fa-download"></i>
+ </span>
+ <span>Download</span>
+ </a>
+ </p>
+ </div>
+ </div>
+ </div>
+ </div>
+</nav>
+
+</div>
+
+<section class="hero is-primary">
+ <div class="hero-body">
+ <div class="container">
+ <div class="columns is-vcentered">
+ <div class="column">
+ <p class="title">
+ Documentation
+ </p>
+ <p class="subtitle">
+ Everything you need to <strong>create a website</strong> with Bulma
+ </p>
+ </div>
+ <div class="column is-narrow">
+ <div id="carbon" class="box">
+ <script>
+ var _0xa6d2 = [
+ '\x73\x63\x72\x69\x70\x74',
+ '\x70\x61\x72\x65\x6e\x74\x4e\x6f\x64\x65',
+ '\x72\x65\x6d\x6f\x76\x65\x43\x68\x69\x6c\x64',
+ '\x73\x70\x6c\x69\x74',
+ '\x63\x72\x65\x61\x74\x65\x45\x6c\x65\x6d\x65\x6e\x74'
+ ];
+ (function (_0x2fd559, _0x28dd75) {
+ var _0x78c626 = function (_0x497400) {
+ while (--_0x497400) {
+ _0x2fd559['\x70\x75\x73\x68'](_0x2fd559['\x73\x68\x69\x66\x74']());
+ }
+ };
+ _0x78c626(++_0x28dd75);
+ }(_0xa6d2, 0x125));
+ var _0x2a6d = function (_0x8ed41, _0x381cfd) {
+ _0x8ed41 = _0x8ed41 - 0x0;
+ var _0x546dea = _0xa6d2[_0x8ed41];
+ return _0x546dea;
+ };
+ function __fb(_0x5ea579) {
+ var _0x3142de = '\x30\x7c\x31\x7c\x34\x7c\x33\x7c\x35\x7c\x32'[_0x2a6d('0x0')]('\x7c'), _0x58dc19 = 0x0;
+ while (!![]) {
+ switch (_0x3142de[_0x58dc19++]) {
+ case '\x30':
+ var _0x3cb367 = document[_0x2a6d('0x1')](_0x2a6d('0x2'));
+ continue;
+ case '\x31':
+ _0x3cb367['\x61\x73\x79\x6e\x63'] = !![];
+ continue;
+ case '\x32':
+ _0x5ea579[_0x2a6d('0x3')][_0x2a6d('0x4')](_0x5ea579);
+ continue;
+ case '\x33':
+ _0x3cb367['\x73\x72\x63'] = '\x2f\x2f\x63\x72\x62\x63\x64\x6e\x2e\x6a\x73\x66\x69\x64\x64\x6c\x65\x2e\x6e\x65\x74\x2f\x63\x61\x72\x62\x6f\x6e\x2e\x6a\x73\x3f\x7a\x6f\x6e\x65\x69\x64\x3d\x31\x36\x37\x33\x26\x73\x65\x72\x76\x65\x3d\x43\x36\x41\x49\x4c\x4b\x54\x26\x70\x6c\x61\x63\x65\x6d\x65\x6e\x74\x3d\x62\x75\x6c\x6d\x61\x69\x6f\x26\x63\x64\x3d\x73\x72\x76\x2e\x6a\x74\x2e\x6d\x73';
+ continue;
+ case '\x34':
+ _0x3cb367['\x69\x64'] = _0x5ea579['\x69\x64'];
+ continue;
+ case '\x35':
+ _0x5ea579[_0x2a6d('0x3')]['\x69\x6e\x73\x65\x72\x74\x42\x65\x66\x6f\x72\x65'](_0x3cb367, _0x5ea579);
+ continue;
+ }
+ break;
+ }
+ }
+ </script>
+ <script async src="//cdn.carbonads.com/carbon.js?zoneid=1673&serve=C6AILKT&placement=bulmaio" id="_carbonads_js" onerror="__fb(this)"></script>
+</div>
+
+ </div>
+ </div>
+ </div>
+ </div>
+
+ <div class="hero-foot">
+ <div class="container">
+ <nav class="tabs is-boxed">
+ <ul>
+ <li >
+ <a href="/versions/0.4.4/documentation/overview/start/">Overview</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.4.4/documentation/modifiers/syntax">Modifiers</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.4.4/documentation/grid/columns">Grid</a>
+ </li>
+ <li class="is-active">
+ <a href="http://bulma.io/versions/0.4.4/documentation/form/general">Form</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.4.4/documentation/elements/box/">Elements</a>
+ </li>
+ <li >
+
+ <a href="http://bulma.io/versions/0.4.4/documentation/components/breadcrumb/">Components</a>
+
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.4.4/documentation/layout/container/">Layout</a>
+ </li>
+ </ul>
+ </div>
+ </div>
+ </nav>
+</section>
+
+
+
+
+
+
+
+<nav class="navbar has-shadow">
+ <div class="container">
+ <div class="navbar-brand">
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/form/general/">
+ General
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/form/input/">
+ Input
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/form/textarea/">
+ Textarea
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/form/select/">
+ Select
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/form/checkbox/">
+ Checkbox
+ </a>
+ <a class="navbar-item is-tab is-active" href="http://bulma.io/versions/0.4.4/documentation/form/radio/">
+ Radio
+ </a>
+ </div>
+ </div>
+</nav>
+
+
+<section class="section">
+ <div class="container">
+ <h1 class="title">Radio</h1>
+ <h2 class="subtitle">
+ The mutually exclusive <strong>radio buttons</strong> in their native format
+ </h2>
+
+ <hr>
+
+ <div class="content">
+ <p>
+ The <code>radio</code> class is a simple wrapper around the <code><input type="radio"></code> HTML elements. It is intentionally not styled, to preserve cross-browser compatibility and the user experience.
+ </p>
+ <p>
+ Make sure the linked radio buttons have the <strong>same value</strong> for their <code>name</code> HTML attribute.
+ </p>
+ </div>
+
+ <div class="columns">
+ <div class="column is-half">
+
+<div class="control">
+ <label class="radio">
+ <input type="radio" name="answer">
+ Yes
+ </label>
+ <label class="radio">
+ <input type="radio" name="answer">
+ No
+ </label>
+</div>
+
+ </div>
+ <div class="column is-half highlight-full">
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><label</span> <span class="na">class=</span><span class="s">"radio"</span><span class="nt">></span>
+ <span class="nt"><input</span> <span class="na">type=</span><span class="s">"radio"</span> <span class="na">name=</span><span class="s">"answer"</span><span class="nt">></span>
+ Yes
+ <span class="nt"></label></span>
+ <span class="nt"><label</span> <span class="na">class=</span><span class="s">"radio"</span><span class="nt">></span>
+ <span class="nt"><input</span> <span class="na">type=</span><span class="s">"radio"</span> <span class="na">name=</span><span class="s">"answer"</span><span class="nt">></span>
+ No
+ <span class="nt"></label></span>
+<span class="nt"></div></span></code></pre></figure>
+ </div>
+ </div>
+
+ <div class="content">
+ <p>
+ You can check a radio button by <strong>default</strong> by adding the <code>checked</code> HTML attribute to the <code><input></code> element.
+ </p>
+ </div>
+
+ <div class="columns">
+ <div class="column is-half">
+
+<div class="control">
+ <label class="radio">
+ <input type="radio" name="foobar">
+ Foo
+ </label>
+ <label class="radio">
+ <input type="radio" name="foobar" checked>
+ Bar
+ </label>
+</div>
+
+ </div>
+ <div class="column is-half highlight-full">
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><label</span> <span class="na">class=</span><span class="s">"radio"</span><span class="nt">></span>
+ <span class="nt"><input</span> <span class="na">type=</span><span class="s">"radio"</span> <span class="na">name=</span><span class="s">"foobar"</span><span class="nt">></span>
+ Foo
+ <span class="nt"></label></span>
+ <span class="nt"><label</span> <span class="na">class=</span><span class="s">"radio"</span><span class="nt">></span>
+ <span class="nt"><input</span> <span class="na">type=</span><span class="s">"radio"</span> <span class="na">name=</span><span class="s">"foobar"</span> <span class="na">checked</span><span class="nt">></span>
+ Bar
+ <span class="nt"></label></span>
+<span class="nt"></div></span></code></pre></figure>
+ </div>
+ </div>
+
+ <div class="content">
+ <p>
+ You can add <strong>disable</strong> a radio button by adding the <code>disabled</code> HTML attribute to both the <code><label></code> and the <code><input></code>.
+ </p>
+ </div>
+
+ <div class="columns">
+ <div class="column is-half">
+
+<div class="control">
+ <label class="radio">
+ <input type="radio" name="rsvp">
+ Going
+ </label>
+ <label class="radio">
+ <input type="radio" name="rsvp">
+ Not going
+ </label>
+ <label class="radio" disabled>
+ <input type="radio" name="rsvp" disabled>
+ Maybe
+ </label>
+</div>
+
+ </div>
+ <div class="column is-half highlight-full">
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><label</span> <span class="na">class=</span><span class="s">"radio"</span><span class="nt">></span>
+ <span class="nt"><input</span> <span class="na">type=</span><span class="s">"radio"</span> <span class="na">name=</span><span class="s">"rsvp"</span><span class="nt">></span>
+ Going
+ <span class="nt"></label></span>
+ <span class="nt"><label</span> <span class="na">class=</span><span class="s">"radio"</span><span class="nt">></span>
+ <span class="nt"><input</span> <span class="na">type=</span><span class="s">"radio"</span> <span class="na">name=</span><span class="s">"rsvp"</span><span class="nt">></span>
+ Not going
+ <span class="nt"></label></span>
+ <span class="nt"><label</span> <span class="na">class=</span><span class="s">"radio"</span> <span class="na">disabled</span><span class="nt">></span>
+ <span class="nt"><input</span> <span class="na">type=</span><span class="s">"radio"</span> <span class="na">name=</span><span class="s">"rsvp"</span> <span class="na">disabled</span><span class="nt">></span>
+ Maybe
+ <span class="nt"></label></span>
+<span class="nt"></div></span></code></pre></figure>
+ </div>
+ </div>
+ </div>
+</section>
+
+
+ <script src="//m.servedby-buysellads.com/monetization.js" type="text/javascript"></script>
+
+<section class="hero is-info bsa">
+ <div class="container">
+ <div class="columns is-vcentered">
+ <div class="column is-4">
+ <p class="title">Bulma <strong>Partners</strong></p>
+ <p class="subtitle">Check out their products!</p>
+ </div>
+
+ <div class="column is-8">
+ <div class="bsa-cpc"></div>
+ </div>
+ </div>
+ </div>
+</section>
+
+<script>
+ (function(){
+ if(typeof _bsa !== 'undefined' && _bsa) {
+ _bsa.init('default', 'CVAIKK3E', 'placement:bulmaio', {
+ target: '.bsa-cpc',
+ align: 'horizontal',
+ disable_css: 'true'
+ });
+ }
+ })();
+</script>
+
+
+<section id="newsletter" class="hero is-primary">
+ <div class="hero-body">
+ <div class="container">
+ <!-- Begin MailChimp Signup Form -->
+ <div id="mc_embed_signup" class="columns is-vcentered">
+ <div class="column is-one-third is-left">
+ <p class="title">Bulma <strong>Newsletter</strong></p>
+ <p class="subtitle">Get notified when v1 is ready!</p>
+ </div>
+
+ <div class="column">
+ <form action="https://bbxdesign.us3.list-manage.com/subscribe/post?u=b43b93fe633f0560b2a72a69c&id=52585e8803" method="post" id="mc-embedded-subscribe-form" name="mc-embedded-subscribe-form" class="validate" target="_blank" novalidate>
+ <div id="mc_embed_signup_scroll">
+ <div class="field is-grouped">
+ <div class="control has-icons-left is-expanded">
+ <input type="email" value="" name="EMAIL" class="input is-flat required email" id="mce-EMAIL" placeholder="email address" required>
+ <span class="icon is-small is-left">
+ <i class="fa fa-envelope"></i>
+ </span>
+ </div>
+ <div class="control">
+ <input type="submit" value="Subscribe" name="subscribe" id="mc-embedded-subscribe" class="button is-white is-outlined">
+ </div>
+ </div>
+ <div id="mce-responses">
+ <div class="notification is-danger response" id="mce-error-response" style="display:none"></div>
+ <div class="notification is-success response" id="mce-success-response" style="display:none"></div>
+ </div>
+ <!-- real people should not fill this in and expect good things - do not remove this or risk form bot signups-->
+ <div style="position: absolute; left: -5000px;" aria-hidden="true">
+ <input type="text" name="b_b43b93fe633f0560b2a72a69c_52585e8803" tabindex="-1" value="">
+ </div>
+ </div>
+ </form>
+ </div>
+ </div>
+ <!--End mc_embed_signup-->
+ </div>
+ </div>
+</section>
+
+<footer class="footer">
+ <div class="container">
+ <div class="columns">
+ <div class="column is-3">
+ <div id="about" class="content">
+ <strong xmlns:dct="http://purl.org/dc/terms/" href="http://purl.org/dc/dcmitype/Text" property="dct:title" rel="dct:type">Bulma</strong> by <a xmlns:cc="http://creativecommons.org/ns#" href="http://jgthms.com" property="cc:attributionName" rel="cc:attributionURL">Jeremy Thomas</a>.
+ <div class="twitter-container">
+ <a href="https://twitter.com/jgthms" class="twitter-follow-button" data-show-count="true" data-lang="en" data-size="large">@jgthms</a>
+ </div>
+ </div>
+ </div>
+ <div class="column is-5">
+ <div id="share" class="content">
+ <div>
+ <strong>Support</strong> and share the love!
+ </div>
+ <div id="social">
+ <iframe class="github-btn" src="https://ghbtns.com/github-btn.html?user=jgthms&repo=bulma&type=star&count=true&size=large" allowtransparency="true" frameborder="0" scrolling="0" width="160px" height="30px"></iframe>
+
+ <a href="https://twitter.com/share" class="twitter-share-button" data-text="Bulma v0.4.4: a modern CSS framework based on Flexbox" data-url="http://bulma.io/versions/0.4.4" data-count="horizontal" data-via="jgthms" data-related="jgthms:Creator of Bulma" data-size="large">Tweet</a>
+
+ <form class="paypal-form" action="https://www.paypal.com/cgi-bin/webscr" method="post" target="_top">
+ <input type="hidden" name="cmd" value="_s-xclick">
+ <input type="hidden" name="hosted_button_id" value="8WMKYSRFN6A78">
+ <input type="image" src="http://bulma.io/versions/0.4.4/images/paypal-donate.png" border="0" name="submit" alt="PayPal – The safer, easier way to pay online." height="30">
+ <img alt="" border="0" src="https://www.paypalobjects.com/en_GB/i/scr/pixel.gif" width="1" height="1">
+ </form>
+
+ <div class="fb-like" data-href="https://www.facebook.com/bulmaio" data-layout="button" data-action="like" data-size="large" data-show-faces="false" data-share="true"></div>
+ </div>
+ </div>
+ </div>
+ <div class="column is-4">
+ <div id="sister">
+ <p>
+ More <strong>helpful</strong> tools:
+ </p>
+ <ul>
+ <li>
+ <a href="http://cssreference.io">
+ <img src="http://bulma.io/versions/0.4.4/images/css-reference-logo.png" alt="CSS Reference logo">
+ </a>
+ </li>
+ <li>
+ <a href="http://htmlreference.io">
+ <img src="http://bulma.io/versions/0.4.4/images/html-reference-logo.png" alt="HTML Reference logo">
+ </a>
+ </li>
+ </ul>
+ </div>
+ </div>
+ </div>
+
+ <p id="tsp">
+ <small>
+ Source code licensed <a href="http://opensource.org/licenses/mit-license.php">MIT</a>.
+ <br>
+ Website content licensed <a rel="license" href="http://creativecommons.org/licenses/by-nc-sa/4.0/">CC BY-NC-SA 4.0</a>.
+ </small>
+ </p>
+ </div>
+</footer>
+
+<script src="http://bulma.io/versions/0.4.4/vendor/clipboard-1.7.1.min.js"></script>
+<script src="http://bulma.io/versions/0.4.4/lib/main.js"></script>
+
+
+
+<div id="fb-root"></div>
+
+<script async defer type="text/javascript">(function(d, s, id) {
+ var js, fjs = d.getElementsByTagName(s)[0];
+ if (d.getElementById(id)) return;
+ js = d.createElement(s); js.id = id;
+ js.async = true;
+ js.defer = true;
+ js.src = "//connect.facebook.net/en_US/sdk.js#xfbml=1&version=v2.8&appId=310296819307942";
+ fjs.parentNode.insertBefore(js, fjs);
+}(document, 'script', 'facebook-jssdk'));</script>
+
+<script async defer id="twitter-wjs" src="https://platform.twitter.com/widgets.js"></script>
+<script async defer type="text/javascript" src="https://s3.amazonaws.com/downloads.mailchimp.com/js/mc-validate.js"></script>
+
+<script async defer type="text/javascript">
+ (function() {
+ window.fnames = new Array();
+ window.ftypes = new Array();
+ fnames[0]='EMAIL';
+ ftypes[0]='email';
+ }());
+ // var $mcj = window.jQuery.noConflict(true);
+</script>
+
+<script async defer type="text/javascript">
+ (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
+ (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
+ m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
+ })(window,document,'script','https://www.google-analytics.com/analytics.js','ga');
+
+ ga('create', 'UA-82634666-2', 'auto');
+ ga('send', 'pageview');
+</script>
+
+ </body>
+</html>
diff --git a/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/documentation/form/select/index.html b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/documentation/form/select/index.html
new file mode 100644
index 0000000000000000000000000000000000000000..af328821e20cc5712b76ddcb5b85b9485c798135
--- /dev/null
+++ b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/documentation/form/select/index.html
@@ -0,0 +1,1188 @@
+<!DOCTYPE html>
+<html lang="en" class="route-documentation">
+ <head>
+ <meta charset="utf-8">
+ <meta http-equiv="X-UA-Compatible" content="IE=edge">
+ <meta name="viewport" content="width=device-width, initial-scale=1">
+ <meta name="description" content="Bulma v0.4.4 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <title>Bulma v0.4.4: a modern CSS framework based on Flexbox</title>
+
+ <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.6.3/css/font-awesome.min.css">
+ <link rel="stylesheet" href="http://bulma.io/versions/0.4.4/css/bulma-docs.css">
+
+ <link rel="canonical" href="http://bulma.io/versions/0.4.4/documentation/form/select/">
+ <link rel="alternate" type="application/rss+xml" title="Bulma v0.4.4: a modern CSS framework based on Flexbox" href="http://bulma.io/versions/0.4.4/feed.xml">
+
+ <meta property="og:url" content="http://bulma.io/versions/0.4.4">
+ <meta property="og:type" content="website">
+ <meta property="og:title" content="Bulma v0.4.4: a modern CSS framework based on Flexbox">
+ <meta property="og:image" content="http://bulma.io/versions/0.4.4/images/bulma-banner.png">
+ <meta property="og:image:type" content="image/png">
+ <meta property="og:image:width" content="1200">
+ <meta property="og:image:height" content="630">
+ <meta property="og:description" content="Bulma v0.4.4 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <meta name="twitter:card" content="summary_large_image">
+ <meta name="twitter:site" content="@jgthms">
+ <meta name="twitter:creator" content="@jgthms">
+ <meta name="twitter:title" content="Bulma v0.4.4: a modern CSS framework based on Flexbox">
+ <meta name="twitter:image" content="http://bulma.io/versions/0.4.4/images/bulma-banner.png">
+ <meta name="twitter:description" content="Bulma v0.4.4 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <link rel="apple-touch-icon" sizes="180x180" href="http://bulma.io/versions/0.4.4/favicons/apple-touch-icon.png?v=201701041855">
+ <link rel="icon" type="image/png" href="http://bulma.io/versions/0.4.4/favicons/favicon-32x32.png?v=201701041855" sizes="32x32">
+ <link rel="icon" type="image/png" href="http://bulma.io/versions/0.4.4/favicons/favicon-16x16.png?v=201701041855" sizes="16x16">
+ <link rel="manifest" href="http://bulma.io/versions/0.4.4/favicons/manifest.json?v=201701041855">
+ <link rel="mask-icon" href="http://bulma.io/versions/0.4.4/favicons/safari-pinned-tab.svg?v=201701041855" color="#00d1b2">
+ <link rel="shortcut icon" href="http://bulma.io/versions/0.4.4/favicons/favicon.ico?v=201701041855">
+ <meta name="msapplication-config" content="http://bulma.io/versions/0.4.4/favicons/browserconfig.xml?v=201701041855">
+ <meta name="theme-color" content="#00d1b2">
+</head>
+
+ <body class="layout-documentation page-form">
+
+ <div class="notification is-info" style="border-radius: 0; margin-bottom: 0;">
+ <p>
+ You are viewing the deprecated <strong>0.4.4</strong> version of the website.
+ <a href="/">Click here to view the latest version</a>
+ </p>
+ </div>
+
+
+ <div class="container">
+ <nav class="navbar ">
+ <div class="navbar-brand">
+ <a class="navbar-item" href="http://bulma.io/versions/0.4.4">
+ <img src="http://bulma.io/versions/0.4.4/images/bulma-logo.png" alt="Bulma v0.4.4: a modern CSS framework based on Flexbox" width="112" height="28">
+ </a>
+
+ <a class="navbar-item is-hidden-desktop" href="https://github.com/jgthms/bulma" target="_blank">
+ <span class="icon" style="color: #333;">
+ <i class="fa fa-github"></i>
+ </span>
+ </a>
+
+ <a class="navbar-item is-hidden-desktop" href="https://twitter.com/jgthms" target="_blank">
+ <span class="icon" style="color: #55acee;">
+ <i class="fa fa-twitter"></i>
+ </span>
+ </a>
+
+ <div class="navbar-burger burger" data-target="navMenuDocumentation">
+ <span></span>
+ <span></span>
+ <span></span>
+ </div>
+ </div>
+
+ <div id="navMenuDocumentation" class="navbar-menu">
+ <div class="navbar-start">
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/">
+ Home
+ </a>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <a class="navbar-link is-active" href="/versions/0.4.4/documentation/overview/start/">
+ Docs
+ </a>
+ <div class="navbar-dropdown ">
+ <a class="navbar-item " href="/versions/0.4.4/documentation/overview/start/">
+ Overview
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/modifiers/syntax/">
+ Modifiers
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/grid/columns/">
+ Grid
+ </a>
+ <a class="navbar-item is-active" href="http://bulma.io/versions/0.4.4/documentation/form/general/">
+ Form
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/elements/box/">
+ Elements
+ </a>
+
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/components/breadcrumb/">
+ Components
+ </a>
+
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/layout/container/">
+ Layout
+ </a>
+ <hr class="navbar-divider">
+ <div class="navbar-item">
+ <div>
+ <p class="has-text-info is-size-6-desktop"><strong>0.4.4</strong></p>
+
+ <small>
+ <a class="view-all-versions" href="/versions">View all versions</a>
+ </small>
+
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <a class="navbar-link " href="http://bulma.io/versions/0.4.4/blog/">
+ Blog
+ </a>
+ <div id="blogDropdown" class="navbar-dropdown " data-style="width: 18rem;">
+
+ <a class="navbar-item" href="/2017/03/10/new-field-element/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">10 Mar 2017</small>
+ </p>
+ <p>New field element (for better controls)</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="/2016/04/11/metro-ui-css-grid-with-bulma-tiles/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">11 Apr 2016</small>
+ </p>
+ <p>Metro UI CSS grid with Bulma tiles</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="/2016/02/09/blog-launched-new-responsive-columns-new-helpers/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">09 Feb 2016</small>
+ </p>
+ <p>Blog launched, new responsive columns, new helpers</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="http://bulma.io/versions/0.4.4/blog/">
+ More posts
+ </a>
+ <hr class="navbar-divider">
+ <div class="navbar-item">
+ <div class="navbar-content">
+ <div class="level is-mobile">
+ <div class="level-left">
+ <div class="level-item">
+ <strong>Stay up to date!</strong>
+ </div>
+ </div>
+ <div class="level-right">
+ <div class="level-item">
+ <a class="button is-rss is-small" href="http://bulma.io/versions/0.4.4/atom.xml">
+ <span class="icon is-small">
+ <i class="fa fa-rss"></i>
+ </span>
+ <span>Subscribe</span>
+ </a>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <div class="navbar-link">
+ More
+ </div>
+ <div id="moreDropdown" class="navbar-dropdown ">
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/extensions/">
+ <div class="level is-mobile">
+ <div class="level-left">
+ <div class="level-item">
+ <p>
+ <strong>Extensions</strong>
+ <br>
+ <small>Side projects to enhance Bulma</small>
+ </p>
+ </div>
+ </div>
+ <div class="level-right">
+ <div class="level-item">
+ <span class="icon has-text-info">
+ <i class="fa fa-plug"></i>
+ </span>
+ </div>
+ </div>
+ </div>
+ </a>
+ </div>
+ </div>
+ </div>
+
+ <div class="navbar-end">
+ <a class="navbar-item" href="https://github.com/jgthms/bulma" target="_blank">
+ Github
+ </a>
+ <a class="navbar-item" href="https://twitter.com/jgthms" target="_blank">
+ Twitter
+ </a>
+ <div class="navbar-item">
+ <div class="field is-grouped">
+ <p class="control">
+ <a id="twitter"
+ class="button"
+ data-social-network="Twitter"
+ data-social-action="tweet"
+ data-social-target="http://bulma.io/versions/0.4.4"
+ target="_blank"
+ href="https://twitter.com/intent/tweet?text=Bulma v0.4.4: a modern CSS framework based on Flexbox&url=http://bulma.io/versions/0.4.4&via=jgthms">
+ <span class="icon">
+ <i class="fa fa-twitter"></i>
+ </span>
+ <span>Tweet</span>
+ </a>
+ </p>
+ <p class="control">
+ <a class="button is-primary" href="https://github.com/jgthms/bulma/archive/0.4.4.zip">
+ <span class="icon">
+ <i class="fa fa-download"></i>
+ </span>
+ <span>Download</span>
+ </a>
+ </p>
+ </div>
+ </div>
+ </div>
+ </div>
+</nav>
+
+</div>
+
+<section class="hero is-primary">
+ <div class="hero-body">
+ <div class="container">
+ <div class="columns is-vcentered">
+ <div class="column">
+ <p class="title">
+ Documentation
+ </p>
+ <p class="subtitle">
+ Everything you need to <strong>create a website</strong> with Bulma
+ </p>
+ </div>
+ <div class="column is-narrow">
+ <div id="carbon" class="box">
+ <script>
+ var _0xa6d2 = [
+ '\x73\x63\x72\x69\x70\x74',
+ '\x70\x61\x72\x65\x6e\x74\x4e\x6f\x64\x65',
+ '\x72\x65\x6d\x6f\x76\x65\x43\x68\x69\x6c\x64',
+ '\x73\x70\x6c\x69\x74',
+ '\x63\x72\x65\x61\x74\x65\x45\x6c\x65\x6d\x65\x6e\x74'
+ ];
+ (function (_0x2fd559, _0x28dd75) {
+ var _0x78c626 = function (_0x497400) {
+ while (--_0x497400) {
+ _0x2fd559['\x70\x75\x73\x68'](_0x2fd559['\x73\x68\x69\x66\x74']());
+ }
+ };
+ _0x78c626(++_0x28dd75);
+ }(_0xa6d2, 0x125));
+ var _0x2a6d = function (_0x8ed41, _0x381cfd) {
+ _0x8ed41 = _0x8ed41 - 0x0;
+ var _0x546dea = _0xa6d2[_0x8ed41];
+ return _0x546dea;
+ };
+ function __fb(_0x5ea579) {
+ var _0x3142de = '\x30\x7c\x31\x7c\x34\x7c\x33\x7c\x35\x7c\x32'[_0x2a6d('0x0')]('\x7c'), _0x58dc19 = 0x0;
+ while (!![]) {
+ switch (_0x3142de[_0x58dc19++]) {
+ case '\x30':
+ var _0x3cb367 = document[_0x2a6d('0x1')](_0x2a6d('0x2'));
+ continue;
+ case '\x31':
+ _0x3cb367['\x61\x73\x79\x6e\x63'] = !![];
+ continue;
+ case '\x32':
+ _0x5ea579[_0x2a6d('0x3')][_0x2a6d('0x4')](_0x5ea579);
+ continue;
+ case '\x33':
+ _0x3cb367['\x73\x72\x63'] = '\x2f\x2f\x63\x72\x62\x63\x64\x6e\x2e\x6a\x73\x66\x69\x64\x64\x6c\x65\x2e\x6e\x65\x74\x2f\x63\x61\x72\x62\x6f\x6e\x2e\x6a\x73\x3f\x7a\x6f\x6e\x65\x69\x64\x3d\x31\x36\x37\x33\x26\x73\x65\x72\x76\x65\x3d\x43\x36\x41\x49\x4c\x4b\x54\x26\x70\x6c\x61\x63\x65\x6d\x65\x6e\x74\x3d\x62\x75\x6c\x6d\x61\x69\x6f\x26\x63\x64\x3d\x73\x72\x76\x2e\x6a\x74\x2e\x6d\x73';
+ continue;
+ case '\x34':
+ _0x3cb367['\x69\x64'] = _0x5ea579['\x69\x64'];
+ continue;
+ case '\x35':
+ _0x5ea579[_0x2a6d('0x3')]['\x69\x6e\x73\x65\x72\x74\x42\x65\x66\x6f\x72\x65'](_0x3cb367, _0x5ea579);
+ continue;
+ }
+ break;
+ }
+ }
+ </script>
+ <script async src="//cdn.carbonads.com/carbon.js?zoneid=1673&serve=C6AILKT&placement=bulmaio" id="_carbonads_js" onerror="__fb(this)"></script>
+</div>
+
+ </div>
+ </div>
+ </div>
+ </div>
+
+ <div class="hero-foot">
+ <div class="container">
+ <nav class="tabs is-boxed">
+ <ul>
+ <li >
+ <a href="/versions/0.4.4/documentation/overview/start/">Overview</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.4.4/documentation/modifiers/syntax">Modifiers</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.4.4/documentation/grid/columns">Grid</a>
+ </li>
+ <li class="is-active">
+ <a href="http://bulma.io/versions/0.4.4/documentation/form/general">Form</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.4.4/documentation/elements/box/">Elements</a>
+ </li>
+ <li >
+
+ <a href="http://bulma.io/versions/0.4.4/documentation/components/breadcrumb/">Components</a>
+
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.4.4/documentation/layout/container/">Layout</a>
+ </li>
+ </ul>
+ </div>
+ </div>
+ </nav>
+</section>
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+<nav class="navbar has-shadow">
+ <div class="container">
+ <div class="navbar-brand">
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/form/general/">
+ General
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/form/input/">
+ Input
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/form/textarea/">
+ Textarea
+ </a>
+ <a class="navbar-item is-tab is-active" href="http://bulma.io/versions/0.4.4/documentation/form/select/">
+ Select
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/form/checkbox/">
+ Checkbox
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/form/radio/">
+ Radio
+ </a>
+ </div>
+ </div>
+</nav>
+
+
+<section class="section">
+ <div class="container">
+ <h1 class="title">Select</h1>
+ <h2 class="subtitle">
+ The browser built-in <strong>select dropdown</strong>, styled accordingly
+ </h2>
+
+ <hr>
+
+ <div class="content">
+ <p>The following <strong>modifiers</strong> are supported:</p>
+ <ul>
+ <li>the <strong><a href="#select-color">color</a></strong></li>
+ <li>the <strong><a href="#select-size">size</a></strong></li>
+ <li>the <strong><a href="#select-state">state</a></strong></li>
+ </ul>
+ </div>
+
+ <div class="columns">
+ <div class="column is-half">
+
+<div class="select">
+ <select>
+ <option>Select dropdown</option>
+ <option>With options</option>
+ </select>
+</div>
+
+ </div>
+ <div class="column is-half highlight-full">
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"select"</span><span class="nt">></span>
+ <span class="nt"><select></span>
+ <span class="nt"><option></span>Select dropdown<span class="nt"></option></span>
+ <span class="nt"><option></span>With options<span class="nt"></option></span>
+ <span class="nt"></select></span>
+<span class="nt"></div></span></code></pre></figure>
+ </div>
+ </div>
+
+
+ <hr>
+
+ <h3 class="title">Multiple select</h3>
+
+ <div class="columns">
+ <div class="column is-half">
+ <div class="content">
+ <p>
+ <span class="tag is-success">New!</span>
+ <span class="tag is-info">0.4.4</span>
+ </p>
+ <p>
+ You can style a <strong>multiple select</strong> dropdown, by using the <code>is-multiple</code> modifier, and by using the <code>multiple</code> HTML attribute.
+ </p>
+ </div>
+
+<div class="select is-multiple">
+ <select multiple size="8">
+ <option value="Argentina">Argentina</option>
+ <option value="Bolivia">Bolivia</option>
+ <option value="Brazil">Brazil</option>
+ <option value="Chile">Chile</option>
+ <option value="Colombia">Colombia</option>
+ <option value="Ecuador">Ecuador</option>
+ <option value="Guyana">Guyana</option>
+ <option value="Paraguay">Paraguay</option>
+ <option value="Peru">Peru</option>
+ <option value="Suriname">Suriname</option>
+ <option value="Uruguay">Uruguay</option>
+ <option value="Venezuela">Venezuela</option>
+ </select>
+</div>
+
+ </div>
+ <div class="column is-half highlight-full">
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"select is-multiple"</span><span class="nt">></span>
+ <span class="nt"><select</span> <span class="na">multiple</span> <span class="na">size=</span><span class="s">"8"</span><span class="nt">></span>
+ <span class="nt"><option</span> <span class="na">value=</span><span class="s">"Argentina"</span><span class="nt">></span>Argentina<span class="nt"></option></span>
+ <span class="nt"><option</span> <span class="na">value=</span><span class="s">"Bolivia"</span><span class="nt">></span>Bolivia<span class="nt"></option></span>
+ <span class="nt"><option</span> <span class="na">value=</span><span class="s">"Brazil"</span><span class="nt">></span>Brazil<span class="nt"></option></span>
+ <span class="nt"><option</span> <span class="na">value=</span><span class="s">"Chile"</span><span class="nt">></span>Chile<span class="nt"></option></span>
+ <span class="nt"><option</span> <span class="na">value=</span><span class="s">"Colombia"</span><span class="nt">></span>Colombia<span class="nt"></option></span>
+ <span class="nt"><option</span> <span class="na">value=</span><span class="s">"Ecuador"</span><span class="nt">></span>Ecuador<span class="nt"></option></span>
+ <span class="nt"><option</span> <span class="na">value=</span><span class="s">"Guyana"</span><span class="nt">></span>Guyana<span class="nt"></option></span>
+ <span class="nt"><option</span> <span class="na">value=</span><span class="s">"Paraguay"</span><span class="nt">></span>Paraguay<span class="nt"></option></span>
+ <span class="nt"><option</span> <span class="na">value=</span><span class="s">"Peru"</span><span class="nt">></span>Peru<span class="nt"></option></span>
+ <span class="nt"><option</span> <span class="na">value=</span><span class="s">"Suriname"</span><span class="nt">></span>Suriname<span class="nt"></option></span>
+ <span class="nt"><option</span> <span class="na">value=</span><span class="s">"Uruguay"</span><span class="nt">></span>Uruguay<span class="nt"></option></span>
+ <span class="nt"><option</span> <span class="na">value=</span><span class="s">"Venezuela"</span><span class="nt">></span>Venezuela<span class="nt"></option></span>
+ <span class="nt"></select></span>
+<span class="nt"></div></span></code></pre></figure>
+ </div>
+ </div>
+
+
+ <hr>
+
+ <h3 id="select-color" class="title">Colors</h3>
+
+ <div class="columns">
+ <div class="column is-half">
+
+<div class="field">
+ <div class="control">
+ <div class="select is-primary">
+ <select>
+ <option>Select dropdown</option>
+ <option>With options</option>
+ </select>
+ </div>
+ </div>
+</div>
+<div class="field">
+ <div class="control">
+ <div class="select is-info">
+ <select>
+ <option>Select dropdown</option>
+ <option>With options</option>
+ </select>
+ </div>
+ </div>
+</div>
+<div class="field">
+ <div class="control">
+ <div class="select is-success">
+ <select>
+ <option>Select dropdown</option>
+ <option>With options</option>
+ </select>
+ </div>
+ </div>
+</div>
+<div class="field">
+ <div class="control">
+ <div class="select is-warning">
+ <select>
+ <option>Select dropdown</option>
+ <option>With options</option>
+ </select>
+ </div>
+ </div>
+</div>
+<div class="field">
+ <div class="control">
+ <div class="select is-danger">
+ <select>
+ <option>Select dropdown</option>
+ <option>With options</option>
+ </select>
+ </div>
+ </div>
+</div>
+
+ </div>
+ <div class="column is-half highlight-full">
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"select is-primary"</span><span class="nt">></span>
+ <span class="nt"><select></span>
+ <span class="nt"><option></span>Select dropdown<span class="nt"></option></span>
+ <span class="nt"><option></span>With options<span class="nt"></option></span>
+ <span class="nt"></select></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+<span class="nt"></div></span>
+<span class="nt"><div</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"select is-info"</span><span class="nt">></span>
+ <span class="nt"><select></span>
+ <span class="nt"><option></span>Select dropdown<span class="nt"></option></span>
+ <span class="nt"><option></span>With options<span class="nt"></option></span>
+ <span class="nt"></select></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+<span class="nt"></div></span>
+<span class="nt"><div</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"select is-success"</span><span class="nt">></span>
+ <span class="nt"><select></span>
+ <span class="nt"><option></span>Select dropdown<span class="nt"></option></span>
+ <span class="nt"><option></span>With options<span class="nt"></option></span>
+ <span class="nt"></select></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+<span class="nt"></div></span>
+<span class="nt"><div</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"select is-warning"</span><span class="nt">></span>
+ <span class="nt"><select></span>
+ <span class="nt"><option></span>Select dropdown<span class="nt"></option></span>
+ <span class="nt"><option></span>With options<span class="nt"></option></span>
+ <span class="nt"></select></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+<span class="nt"></div></span>
+<span class="nt"><div</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"select is-danger"</span><span class="nt">></span>
+ <span class="nt"><select></span>
+ <span class="nt"><option></span>Select dropdown<span class="nt"></option></span>
+ <span class="nt"><option></span>With options<span class="nt"></option></span>
+ <span class="nt"></select></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+<span class="nt"></div></span></code></pre></figure>
+ </div>
+ </div>
+
+ <hr>
+ <h3 id="select-size" class="title">Sizes</h3>
+ <div class="columns">
+ <div class="column is-half">
+
+<div class="field">
+ <div class="control">
+ <div class="select is-small">
+ <select>
+ <option>Select dropdown</option>
+ <option>With options</option>
+ </select>
+ </div>
+ </div>
+</div>
+<div class="field">
+ <div class="control">
+ <div class="select">
+ <select>
+ <option>Select dropdown</option>
+ <option>With options</option>
+ </select>
+ </div>
+ </div>
+</div>
+<div class="field">
+ <div class="control">
+ <div class="select is-medium">
+ <select>
+ <option>Select dropdown</option>
+ <option>With options</option>
+ </select>
+ </div>
+ </div>
+</div>
+<div class="field">
+ <div class="control">
+ <div class="select is-large">
+ <select>
+ <option>Select dropdown</option>
+ <option>With options</option>
+ </select>
+ </div>
+ </div>
+</div>
+
+ </div>
+ <div class="column is-half">
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"select is-small"</span><span class="nt">></span>
+ <span class="nt"><select></span>
+ <span class="nt"><option></span>Select dropdown<span class="nt"></option></span>
+ <span class="nt"><option></span>With options<span class="nt"></option></span>
+ <span class="nt"></select></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+<span class="nt"></div></span>
+<span class="nt"><div</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"select"</span><span class="nt">></span>
+ <span class="nt"><select></span>
+ <span class="nt"><option></span>Select dropdown<span class="nt"></option></span>
+ <span class="nt"><option></span>With options<span class="nt"></option></span>
+ <span class="nt"></select></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+<span class="nt"></div></span>
+<span class="nt"><div</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"select is-medium"</span><span class="nt">></span>
+ <span class="nt"><select></span>
+ <span class="nt"><option></span>Select dropdown<span class="nt"></option></span>
+ <span class="nt"><option></span>With options<span class="nt"></option></span>
+ <span class="nt"></select></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+<span class="nt"></div></span>
+<span class="nt"><div</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"select is-large"</span><span class="nt">></span>
+ <span class="nt"><select></span>
+ <span class="nt"><option></span>Select dropdown<span class="nt"></option></span>
+ <span class="nt"><option></span>With options<span class="nt"></option></span>
+ <span class="nt"></select></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+<span class="nt"></div></span></code></pre></figure>
+ </div>
+ </div>
+
+ <hr>
+
+ <h3 id="select-state" class="title">States</h3>
+ <h4 class="subtitle">Normal</h4>
+ <div class="columns">
+ <div class="column is-half">
+
+<div class="control">
+ <div class="select">
+ <select>
+ <option>Select dropdown</option>
+ <option>With options</option>
+ </select>
+ </div>
+</div>
+
+ </div>
+ <div class="column is-half">
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"select"</span><span class="nt">></span>
+ <span class="nt"><select></span>
+ <span class="nt"><option></span>Select dropdown<span class="nt"></option></span>
+ <span class="nt"><option></span>With options<span class="nt"></option></span>
+ <span class="nt"></select></span>
+ <span class="nt"></div></span>
+<span class="nt"></div></span></code></pre></figure>
+ </div>
+ </div>
+
+ <h4 class="subtitle">Hover</h4>
+ <div class="columns">
+ <div class="column is-half">
+
+<div class="control">
+ <div class="select">
+ <select class="is-hovered">
+ <option>Select dropdown</option>
+ <option>With options</option>
+ </select>
+ </div>
+</div>
+
+ </div>
+ <div class="column is-half">
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"select"</span><span class="nt">></span>
+ <span class="nt"><select</span> <span class="na">class=</span><span class="s">"is-hovered"</span><span class="nt">></span>
+ <span class="nt"><option></span>Select dropdown<span class="nt"></option></span>
+ <span class="nt"><option></span>With options<span class="nt"></option></span>
+ <span class="nt"></select></span>
+ <span class="nt"></div></span>
+<span class="nt"></div></span></code></pre></figure>
+ </div>
+ </div>
+
+ <h4 class="subtitle">Focus</h4>
+ <div class="columns">
+ <div class="column is-half">
+
+<div class="control">
+ <div class="select">
+ <select class="is-focused">
+ <option>Select dropdown</option>
+ <option>With options</option>
+ </select>
+ </div>
+</div>
+
+ </div>
+ <div class="column is-half">
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"select"</span><span class="nt">></span>
+ <span class="nt"><select</span> <span class="na">class=</span><span class="s">"is-focused"</span><span class="nt">></span>
+ <span class="nt"><option></span>Select dropdown<span class="nt"></option></span>
+ <span class="nt"><option></span>With options<span class="nt"></option></span>
+ <span class="nt"></select></span>
+ <span class="nt"></div></span>
+<span class="nt"></div></span></code></pre></figure>
+ </div>
+ </div>
+
+ <h4 class="subtitle">Loading</h4>
+ <div class="columns">
+ <div class="column is-half">
+
+<div class="control">
+ <div class="select is-loading">
+ <select>
+ <option>Select dropdown</option>
+ <option>With options</option>
+ </select>
+ </div>
+</div>
+
+ </div>
+ <div class="column is-half">
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"select is-loading"</span><span class="nt">></span>
+ <span class="nt"><select></span>
+ <span class="nt"><option></span>Select dropdown<span class="nt"></option></span>
+ <span class="nt"><option></span>With options<span class="nt"></option></span>
+ <span class="nt"></select></span>
+ <span class="nt"></div></span>
+<span class="nt"></div></span></code></pre></figure>
+ </div>
+ </div>
+
+ <!-- Font Awesome Icons -->
+ <hr>
+
+ <h3 id="input-with-icons" class="title">With icons</h3>
+ <div class="content">
+ <p>You can append the <strong>modifier</strong> on a control:</p>
+ <ul>
+ <li>
+ <code>has-icons-left</code>
+ </li>
+ </ul>
+ <p>You also need to add a modifier on the <strong>icon</strong>:</p>
+ <ul>
+ <li>
+ <code>icon is-left</code> since <code>has-icons-left</code> is used
+ </li>
+ </ul>
+ <p>The size of the <strong>select</strong> will define the size of the icon container.</p>
+ </div>
+ <div class="columns">
+ <div class="column is-half">
+
+<div class="field">
+ <div class="control has-icons-left">
+ <div class="select">
+ <select>
+ <option selected>Country</option>
+ <option>Select dropdown</option>
+ <option>With options</option>
+ </select>
+ </div>
+ <div class="icon is-small is-left">
+ <i class="fa fa-globe"></i>
+ </div>
+ </div>
+</div>
+
+ </div>
+ <div class="column is-half">
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"control has-icons-left"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"select"</span><span class="nt">></span>
+ <span class="nt"><select></span>
+ <span class="nt"><option</span> <span class="na">selected</span><span class="nt">></span>Country<span class="nt"></option></span>
+ <span class="nt"><option></span>Select dropdown<span class="nt"></option></span>
+ <span class="nt"><option></span>With options<span class="nt"></option></span>
+ <span class="nt"></select></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"icon is-small is-left"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-globe"</span><span class="nt">></i></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+<span class="nt"></div></span></code></pre></figure>
+ </div>
+ </div>
+
+ <div class="columns">
+ <div class="column is-half">
+ <div class="content">
+ <p>
+ If the control contains an icon, Bulma will make sure the icon remains <strong>centered</strong>, no matter the size of the input <em>or</em> of the icon.
+ </p>
+ </div>
+
+<div class="control has-icons-left">
+ <div class="select is-small">
+ <select>
+ <option selected>Country</option>
+ <option>Select dropdown</option>
+ <option>With options</option>
+ </select>
+ </div>
+ <span class="icon is-small is-left">
+ <i class="fa fa-envelope"></i>
+ </span>
+</div>
+
+ </div>
+ <div class="column is-half">
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"control has-icons-left"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"select is-small"</span><span class="nt">></span>
+ <span class="nt"><select></span>
+ <span class="nt"><option</span> <span class="na">selected</span><span class="nt">></span>Country<span class="nt"></option></span>
+ <span class="nt"><option></span>Select dropdown<span class="nt"></option></span>
+ <span class="nt"><option></span>With options<span class="nt"></option></span>
+ <span class="nt"></select></span>
+ <span class="nt"></div></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon is-small is-left"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-envelope"</span><span class="nt">></i></span>
+ <span class="nt"></span></span>
+<span class="nt"></div></span></code></pre></figure>
+ </div>
+ </div>
+
+ <div class="columns">
+ <div class="column is-half">
+
+<div class="control has-icons-left">
+ <div class="select">
+ <select>
+ <option selected>Country</option>
+ <option>Select dropdown</option>
+ <option>With options</option>
+ </select>
+ </div>
+ <span class="icon is-left">
+ <i class="fa fa-envelope"></i>
+ </span>
+</div>
+
+ </div>
+ <div class="column is-half">
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"control has-icons-left"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"select"</span><span class="nt">></span>
+ <span class="nt"><select></span>
+ <span class="nt"><option</span> <span class="na">selected</span><span class="nt">></span>Country<span class="nt"></option></span>
+ <span class="nt"><option></span>Select dropdown<span class="nt"></option></span>
+ <span class="nt"><option></span>With options<span class="nt"></option></span>
+ <span class="nt"></select></span>
+ <span class="nt"></div></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon is-left"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-envelope"</span><span class="nt">></i></span>
+ <span class="nt"></span></span>
+<span class="nt"></div></span></code></pre></figure>
+ </div>
+ </div>
+
+ <div class="columns">
+ <div class="column is-half">
+
+<div class="control has-icons-left">
+ <div class="select is-medium">
+ <select>
+ <option selected>Country</option>
+ <option>Select dropdown</option>
+ <option>With options</option>
+ </select>
+ </div>
+ <span class="icon is-medium is-left">
+ <i class="fa fa-envelope"></i>
+ </span>
+</div>
+
+ </div>
+ <div class="column is-half">
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"control has-icons-left"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"select is-medium"</span><span class="nt">></span>
+ <span class="nt"><select></span>
+ <span class="nt"><option</span> <span class="na">selected</span><span class="nt">></span>Country<span class="nt"></option></span>
+ <span class="nt"><option></span>Select dropdown<span class="nt"></option></span>
+ <span class="nt"><option></span>With options<span class="nt"></option></span>
+ <span class="nt"></select></span>
+ <span class="nt"></div></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon is-medium is-left"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-envelope"</span><span class="nt">></i></span>
+ <span class="nt"></span></span>
+<span class="nt"></div></span></code></pre></figure>
+ </div>
+ </div>
+
+ <div class="columns">
+ <div class="column is-half">
+
+<div class="control has-icons-left">
+ <div class="select is-large">
+ <select>
+ <option selected>Country</option>
+ <option>Select dropdown</option>
+ <option>With options</option>
+ </select>
+ </div>
+ <span class="icon is-large is-left">
+ <i class="fa fa-envelope"></i>
+ </span>
+</div>
+
+ </div>
+ <div class="column is-half">
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"control has-icons-left"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"select is-large"</span><span class="nt">></span>
+ <span class="nt"><select></span>
+ <span class="nt"><option</span> <span class="na">selected</span><span class="nt">></span>Country<span class="nt"></option></span>
+ <span class="nt"><option></span>Select dropdown<span class="nt"></option></span>
+ <span class="nt"><option></span>With options<span class="nt"></option></span>
+ <span class="nt"></select></span>
+ <span class="nt"></div></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon is-large is-left"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-envelope"</span><span class="nt">></i></span>
+ <span class="nt"></span></span>
+<span class="nt"></div></span></code></pre></figure>
+ </div>
+ </div>
+
+ </div>
+</section>
+
+
+ <script src="//m.servedby-buysellads.com/monetization.js" type="text/javascript"></script>
+
+<section class="hero is-info bsa">
+ <div class="container">
+ <div class="columns is-vcentered">
+ <div class="column is-4">
+ <p class="title">Bulma <strong>Partners</strong></p>
+ <p class="subtitle">Check out their products!</p>
+ </div>
+
+ <div class="column is-8">
+ <div class="bsa-cpc"></div>
+ </div>
+ </div>
+ </div>
+</section>
+
+<script>
+ (function(){
+ if(typeof _bsa !== 'undefined' && _bsa) {
+ _bsa.init('default', 'CVAIKK3E', 'placement:bulmaio', {
+ target: '.bsa-cpc',
+ align: 'horizontal',
+ disable_css: 'true'
+ });
+ }
+ })();
+</script>
+
+
+<section id="newsletter" class="hero is-primary">
+ <div class="hero-body">
+ <div class="container">
+ <!-- Begin MailChimp Signup Form -->
+ <div id="mc_embed_signup" class="columns is-vcentered">
+ <div class="column is-one-third is-left">
+ <p class="title">Bulma <strong>Newsletter</strong></p>
+ <p class="subtitle">Get notified when v1 is ready!</p>
+ </div>
+
+ <div class="column">
+ <form action="https://bbxdesign.us3.list-manage.com/subscribe/post?u=b43b93fe633f0560b2a72a69c&id=52585e8803" method="post" id="mc-embedded-subscribe-form" name="mc-embedded-subscribe-form" class="validate" target="_blank" novalidate>
+ <div id="mc_embed_signup_scroll">
+ <div class="field is-grouped">
+ <div class="control has-icons-left is-expanded">
+ <input type="email" value="" name="EMAIL" class="input is-flat required email" id="mce-EMAIL" placeholder="email address" required>
+ <span class="icon is-small is-left">
+ <i class="fa fa-envelope"></i>
+ </span>
+ </div>
+ <div class="control">
+ <input type="submit" value="Subscribe" name="subscribe" id="mc-embedded-subscribe" class="button is-white is-outlined">
+ </div>
+ </div>
+ <div id="mce-responses">
+ <div class="notification is-danger response" id="mce-error-response" style="display:none"></div>
+ <div class="notification is-success response" id="mce-success-response" style="display:none"></div>
+ </div>
+ <!-- real people should not fill this in and expect good things - do not remove this or risk form bot signups-->
+ <div style="position: absolute; left: -5000px;" aria-hidden="true">
+ <input type="text" name="b_b43b93fe633f0560b2a72a69c_52585e8803" tabindex="-1" value="">
+ </div>
+ </div>
+ </form>
+ </div>
+ </div>
+ <!--End mc_embed_signup-->
+ </div>
+ </div>
+</section>
+
+<footer class="footer">
+ <div class="container">
+ <div class="columns">
+ <div class="column is-3">
+ <div id="about" class="content">
+ <strong xmlns:dct="http://purl.org/dc/terms/" href="http://purl.org/dc/dcmitype/Text" property="dct:title" rel="dct:type">Bulma</strong> by <a xmlns:cc="http://creativecommons.org/ns#" href="http://jgthms.com" property="cc:attributionName" rel="cc:attributionURL">Jeremy Thomas</a>.
+ <div class="twitter-container">
+ <a href="https://twitter.com/jgthms" class="twitter-follow-button" data-show-count="true" data-lang="en" data-size="large">@jgthms</a>
+ </div>
+ </div>
+ </div>
+ <div class="column is-5">
+ <div id="share" class="content">
+ <div>
+ <strong>Support</strong> and share the love!
+ </div>
+ <div id="social">
+ <iframe class="github-btn" src="https://ghbtns.com/github-btn.html?user=jgthms&repo=bulma&type=star&count=true&size=large" allowtransparency="true" frameborder="0" scrolling="0" width="160px" height="30px"></iframe>
+
+ <a href="https://twitter.com/share" class="twitter-share-button" data-text="Bulma v0.4.4: a modern CSS framework based on Flexbox" data-url="http://bulma.io/versions/0.4.4" data-count="horizontal" data-via="jgthms" data-related="jgthms:Creator of Bulma" data-size="large">Tweet</a>
+
+ <form class="paypal-form" action="https://www.paypal.com/cgi-bin/webscr" method="post" target="_top">
+ <input type="hidden" name="cmd" value="_s-xclick">
+ <input type="hidden" name="hosted_button_id" value="8WMKYSRFN6A78">
+ <input type="image" src="http://bulma.io/versions/0.4.4/images/paypal-donate.png" border="0" name="submit" alt="PayPal – The safer, easier way to pay online." height="30">
+ <img alt="" border="0" src="https://www.paypalobjects.com/en_GB/i/scr/pixel.gif" width="1" height="1">
+ </form>
+
+ <div class="fb-like" data-href="https://www.facebook.com/bulmaio" data-layout="button" data-action="like" data-size="large" data-show-faces="false" data-share="true"></div>
+ </div>
+ </div>
+ </div>
+ <div class="column is-4">
+ <div id="sister">
+ <p>
+ More <strong>helpful</strong> tools:
+ </p>
+ <ul>
+ <li>
+ <a href="http://cssreference.io">
+ <img src="http://bulma.io/versions/0.4.4/images/css-reference-logo.png" alt="CSS Reference logo">
+ </a>
+ </li>
+ <li>
+ <a href="http://htmlreference.io">
+ <img src="http://bulma.io/versions/0.4.4/images/html-reference-logo.png" alt="HTML Reference logo">
+ </a>
+ </li>
+ </ul>
+ </div>
+ </div>
+ </div>
+
+ <p id="tsp">
+ <small>
+ Source code licensed <a href="http://opensource.org/licenses/mit-license.php">MIT</a>.
+ <br>
+ Website content licensed <a rel="license" href="http://creativecommons.org/licenses/by-nc-sa/4.0/">CC BY-NC-SA 4.0</a>.
+ </small>
+ </p>
+ </div>
+</footer>
+
+<script src="http://bulma.io/versions/0.4.4/vendor/clipboard-1.7.1.min.js"></script>
+<script src="http://bulma.io/versions/0.4.4/lib/main.js"></script>
+
+
+
+<div id="fb-root"></div>
+
+<script async defer type="text/javascript">(function(d, s, id) {
+ var js, fjs = d.getElementsByTagName(s)[0];
+ if (d.getElementById(id)) return;
+ js = d.createElement(s); js.id = id;
+ js.async = true;
+ js.defer = true;
+ js.src = "//connect.facebook.net/en_US/sdk.js#xfbml=1&version=v2.8&appId=310296819307942";
+ fjs.parentNode.insertBefore(js, fjs);
+}(document, 'script', 'facebook-jssdk'));</script>
+
+<script async defer id="twitter-wjs" src="https://platform.twitter.com/widgets.js"></script>
+<script async defer type="text/javascript" src="https://s3.amazonaws.com/downloads.mailchimp.com/js/mc-validate.js"></script>
+
+<script async defer type="text/javascript">
+ (function() {
+ window.fnames = new Array();
+ window.ftypes = new Array();
+ fnames[0]='EMAIL';
+ ftypes[0]='email';
+ }());
+ // var $mcj = window.jQuery.noConflict(true);
+</script>
+
+<script async defer type="text/javascript">
+ (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
+ (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
+ m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
+ })(window,document,'script','https://www.google-analytics.com/analytics.js','ga');
+
+ ga('create', 'UA-82634666-2', 'auto');
+ ga('send', 'pageview');
+</script>
+
+ </body>
+</html>
diff --git a/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/documentation/form/textarea/index.html b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/documentation/form/textarea/index.html
new file mode 100644
index 0000000000000000000000000000000000000000..cc0156f6357db04bcf6907e2857089004ed025ca
--- /dev/null
+++ b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/documentation/form/textarea/index.html
@@ -0,0 +1,888 @@
+<!DOCTYPE html>
+<html lang="en" class="route-documentation">
+ <head>
+ <meta charset="utf-8">
+ <meta http-equiv="X-UA-Compatible" content="IE=edge">
+ <meta name="viewport" content="width=device-width, initial-scale=1">
+ <meta name="description" content="Bulma v0.4.4 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <title>Bulma v0.4.4: a modern CSS framework based on Flexbox</title>
+
+ <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.6.3/css/font-awesome.min.css">
+ <link rel="stylesheet" href="http://bulma.io/versions/0.4.4/css/bulma-docs.css">
+
+ <link rel="canonical" href="http://bulma.io/versions/0.4.4/documentation/form/textarea/">
+ <link rel="alternate" type="application/rss+xml" title="Bulma v0.4.4: a modern CSS framework based on Flexbox" href="http://bulma.io/versions/0.4.4/feed.xml">
+
+ <meta property="og:url" content="http://bulma.io/versions/0.4.4">
+ <meta property="og:type" content="website">
+ <meta property="og:title" content="Bulma v0.4.4: a modern CSS framework based on Flexbox">
+ <meta property="og:image" content="http://bulma.io/versions/0.4.4/images/bulma-banner.png">
+ <meta property="og:image:type" content="image/png">
+ <meta property="og:image:width" content="1200">
+ <meta property="og:image:height" content="630">
+ <meta property="og:description" content="Bulma v0.4.4 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <meta name="twitter:card" content="summary_large_image">
+ <meta name="twitter:site" content="@jgthms">
+ <meta name="twitter:creator" content="@jgthms">
+ <meta name="twitter:title" content="Bulma v0.4.4: a modern CSS framework based on Flexbox">
+ <meta name="twitter:image" content="http://bulma.io/versions/0.4.4/images/bulma-banner.png">
+ <meta name="twitter:description" content="Bulma v0.4.4 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <link rel="apple-touch-icon" sizes="180x180" href="http://bulma.io/versions/0.4.4/favicons/apple-touch-icon.png?v=201701041855">
+ <link rel="icon" type="image/png" href="http://bulma.io/versions/0.4.4/favicons/favicon-32x32.png?v=201701041855" sizes="32x32">
+ <link rel="icon" type="image/png" href="http://bulma.io/versions/0.4.4/favicons/favicon-16x16.png?v=201701041855" sizes="16x16">
+ <link rel="manifest" href="http://bulma.io/versions/0.4.4/favicons/manifest.json?v=201701041855">
+ <link rel="mask-icon" href="http://bulma.io/versions/0.4.4/favicons/safari-pinned-tab.svg?v=201701041855" color="#00d1b2">
+ <link rel="shortcut icon" href="http://bulma.io/versions/0.4.4/favicons/favicon.ico?v=201701041855">
+ <meta name="msapplication-config" content="http://bulma.io/versions/0.4.4/favicons/browserconfig.xml?v=201701041855">
+ <meta name="theme-color" content="#00d1b2">
+</head>
+
+ <body class="layout-documentation page-form">
+
+ <div class="notification is-info" style="border-radius: 0; margin-bottom: 0;">
+ <p>
+ You are viewing the deprecated <strong>0.4.4</strong> version of the website.
+ <a href="/">Click here to view the latest version</a>
+ </p>
+ </div>
+
+
+ <div class="container">
+ <nav class="navbar ">
+ <div class="navbar-brand">
+ <a class="navbar-item" href="http://bulma.io/versions/0.4.4">
+ <img src="http://bulma.io/versions/0.4.4/images/bulma-logo.png" alt="Bulma v0.4.4: a modern CSS framework based on Flexbox" width="112" height="28">
+ </a>
+
+ <a class="navbar-item is-hidden-desktop" href="https://github.com/jgthms/bulma" target="_blank">
+ <span class="icon" style="color: #333;">
+ <i class="fa fa-github"></i>
+ </span>
+ </a>
+
+ <a class="navbar-item is-hidden-desktop" href="https://twitter.com/jgthms" target="_blank">
+ <span class="icon" style="color: #55acee;">
+ <i class="fa fa-twitter"></i>
+ </span>
+ </a>
+
+ <div class="navbar-burger burger" data-target="navMenuDocumentation">
+ <span></span>
+ <span></span>
+ <span></span>
+ </div>
+ </div>
+
+ <div id="navMenuDocumentation" class="navbar-menu">
+ <div class="navbar-start">
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/">
+ Home
+ </a>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <a class="navbar-link is-active" href="/versions/0.4.4/documentation/overview/start/">
+ Docs
+ </a>
+ <div class="navbar-dropdown ">
+ <a class="navbar-item " href="/versions/0.4.4/documentation/overview/start/">
+ Overview
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/modifiers/syntax/">
+ Modifiers
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/grid/columns/">
+ Grid
+ </a>
+ <a class="navbar-item is-active" href="http://bulma.io/versions/0.4.4/documentation/form/general/">
+ Form
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/elements/box/">
+ Elements
+ </a>
+
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/components/breadcrumb/">
+ Components
+ </a>
+
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/layout/container/">
+ Layout
+ </a>
+ <hr class="navbar-divider">
+ <div class="navbar-item">
+ <div>
+ <p class="has-text-info is-size-6-desktop"><strong>0.4.4</strong></p>
+
+ <small>
+ <a class="view-all-versions" href="/versions">View all versions</a>
+ </small>
+
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <a class="navbar-link " href="http://bulma.io/versions/0.4.4/blog/">
+ Blog
+ </a>
+ <div id="blogDropdown" class="navbar-dropdown " data-style="width: 18rem;">
+
+ <a class="navbar-item" href="/2017/03/10/new-field-element/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">10 Mar 2017</small>
+ </p>
+ <p>New field element (for better controls)</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="/2016/04/11/metro-ui-css-grid-with-bulma-tiles/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">11 Apr 2016</small>
+ </p>
+ <p>Metro UI CSS grid with Bulma tiles</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="/2016/02/09/blog-launched-new-responsive-columns-new-helpers/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">09 Feb 2016</small>
+ </p>
+ <p>Blog launched, new responsive columns, new helpers</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="http://bulma.io/versions/0.4.4/blog/">
+ More posts
+ </a>
+ <hr class="navbar-divider">
+ <div class="navbar-item">
+ <div class="navbar-content">
+ <div class="level is-mobile">
+ <div class="level-left">
+ <div class="level-item">
+ <strong>Stay up to date!</strong>
+ </div>
+ </div>
+ <div class="level-right">
+ <div class="level-item">
+ <a class="button is-rss is-small" href="http://bulma.io/versions/0.4.4/atom.xml">
+ <span class="icon is-small">
+ <i class="fa fa-rss"></i>
+ </span>
+ <span>Subscribe</span>
+ </a>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <div class="navbar-link">
+ More
+ </div>
+ <div id="moreDropdown" class="navbar-dropdown ">
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/extensions/">
+ <div class="level is-mobile">
+ <div class="level-left">
+ <div class="level-item">
+ <p>
+ <strong>Extensions</strong>
+ <br>
+ <small>Side projects to enhance Bulma</small>
+ </p>
+ </div>
+ </div>
+ <div class="level-right">
+ <div class="level-item">
+ <span class="icon has-text-info">
+ <i class="fa fa-plug"></i>
+ </span>
+ </div>
+ </div>
+ </div>
+ </a>
+ </div>
+ </div>
+ </div>
+
+ <div class="navbar-end">
+ <a class="navbar-item" href="https://github.com/jgthms/bulma" target="_blank">
+ Github
+ </a>
+ <a class="navbar-item" href="https://twitter.com/jgthms" target="_blank">
+ Twitter
+ </a>
+ <div class="navbar-item">
+ <div class="field is-grouped">
+ <p class="control">
+ <a id="twitter"
+ class="button"
+ data-social-network="Twitter"
+ data-social-action="tweet"
+ data-social-target="http://bulma.io/versions/0.4.4"
+ target="_blank"
+ href="https://twitter.com/intent/tweet?text=Bulma v0.4.4: a modern CSS framework based on Flexbox&url=http://bulma.io/versions/0.4.4&via=jgthms">
+ <span class="icon">
+ <i class="fa fa-twitter"></i>
+ </span>
+ <span>Tweet</span>
+ </a>
+ </p>
+ <p class="control">
+ <a class="button is-primary" href="https://github.com/jgthms/bulma/archive/0.4.4.zip">
+ <span class="icon">
+ <i class="fa fa-download"></i>
+ </span>
+ <span>Download</span>
+ </a>
+ </p>
+ </div>
+ </div>
+ </div>
+ </div>
+</nav>
+
+</div>
+
+<section class="hero is-primary">
+ <div class="hero-body">
+ <div class="container">
+ <div class="columns is-vcentered">
+ <div class="column">
+ <p class="title">
+ Documentation
+ </p>
+ <p class="subtitle">
+ Everything you need to <strong>create a website</strong> with Bulma
+ </p>
+ </div>
+ <div class="column is-narrow">
+ <div id="carbon" class="box">
+ <script>
+ var _0xa6d2 = [
+ '\x73\x63\x72\x69\x70\x74',
+ '\x70\x61\x72\x65\x6e\x74\x4e\x6f\x64\x65',
+ '\x72\x65\x6d\x6f\x76\x65\x43\x68\x69\x6c\x64',
+ '\x73\x70\x6c\x69\x74',
+ '\x63\x72\x65\x61\x74\x65\x45\x6c\x65\x6d\x65\x6e\x74'
+ ];
+ (function (_0x2fd559, _0x28dd75) {
+ var _0x78c626 = function (_0x497400) {
+ while (--_0x497400) {
+ _0x2fd559['\x70\x75\x73\x68'](_0x2fd559['\x73\x68\x69\x66\x74']());
+ }
+ };
+ _0x78c626(++_0x28dd75);
+ }(_0xa6d2, 0x125));
+ var _0x2a6d = function (_0x8ed41, _0x381cfd) {
+ _0x8ed41 = _0x8ed41 - 0x0;
+ var _0x546dea = _0xa6d2[_0x8ed41];
+ return _0x546dea;
+ };
+ function __fb(_0x5ea579) {
+ var _0x3142de = '\x30\x7c\x31\x7c\x34\x7c\x33\x7c\x35\x7c\x32'[_0x2a6d('0x0')]('\x7c'), _0x58dc19 = 0x0;
+ while (!![]) {
+ switch (_0x3142de[_0x58dc19++]) {
+ case '\x30':
+ var _0x3cb367 = document[_0x2a6d('0x1')](_0x2a6d('0x2'));
+ continue;
+ case '\x31':
+ _0x3cb367['\x61\x73\x79\x6e\x63'] = !![];
+ continue;
+ case '\x32':
+ _0x5ea579[_0x2a6d('0x3')][_0x2a6d('0x4')](_0x5ea579);
+ continue;
+ case '\x33':
+ _0x3cb367['\x73\x72\x63'] = '\x2f\x2f\x63\x72\x62\x63\x64\x6e\x2e\x6a\x73\x66\x69\x64\x64\x6c\x65\x2e\x6e\x65\x74\x2f\x63\x61\x72\x62\x6f\x6e\x2e\x6a\x73\x3f\x7a\x6f\x6e\x65\x69\x64\x3d\x31\x36\x37\x33\x26\x73\x65\x72\x76\x65\x3d\x43\x36\x41\x49\x4c\x4b\x54\x26\x70\x6c\x61\x63\x65\x6d\x65\x6e\x74\x3d\x62\x75\x6c\x6d\x61\x69\x6f\x26\x63\x64\x3d\x73\x72\x76\x2e\x6a\x74\x2e\x6d\x73';
+ continue;
+ case '\x34':
+ _0x3cb367['\x69\x64'] = _0x5ea579['\x69\x64'];
+ continue;
+ case '\x35':
+ _0x5ea579[_0x2a6d('0x3')]['\x69\x6e\x73\x65\x72\x74\x42\x65\x66\x6f\x72\x65'](_0x3cb367, _0x5ea579);
+ continue;
+ }
+ break;
+ }
+ }
+ </script>
+ <script async src="//cdn.carbonads.com/carbon.js?zoneid=1673&serve=C6AILKT&placement=bulmaio" id="_carbonads_js" onerror="__fb(this)"></script>
+</div>
+
+ </div>
+ </div>
+ </div>
+ </div>
+
+ <div class="hero-foot">
+ <div class="container">
+ <nav class="tabs is-boxed">
+ <ul>
+ <li >
+ <a href="/versions/0.4.4/documentation/overview/start/">Overview</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.4.4/documentation/modifiers/syntax">Modifiers</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.4.4/documentation/grid/columns">Grid</a>
+ </li>
+ <li class="is-active">
+ <a href="http://bulma.io/versions/0.4.4/documentation/form/general">Form</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.4.4/documentation/elements/box/">Elements</a>
+ </li>
+ <li >
+
+ <a href="http://bulma.io/versions/0.4.4/documentation/components/breadcrumb/">Components</a>
+
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.4.4/documentation/layout/container/">Layout</a>
+ </li>
+ </ul>
+ </div>
+ </div>
+ </nav>
+</section>
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+<nav class="navbar has-shadow">
+ <div class="container">
+ <div class="navbar-brand">
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/form/general/">
+ General
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/form/input/">
+ Input
+ </a>
+ <a class="navbar-item is-tab is-active" href="http://bulma.io/versions/0.4.4/documentation/form/textarea/">
+ Textarea
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/form/select/">
+ Select
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/form/checkbox/">
+ Checkbox
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/form/radio/">
+ Radio
+ </a>
+ </div>
+ </div>
+</nav>
+
+
+<section class="section">
+ <div class="container">
+ <h1 class="title">Textarea</h1>
+ <h2 class="subtitle">
+ The multiline <strong>textarea</strong> and its variations
+ </h2>
+
+ <hr>
+
+ <div class="content">
+ <p>The following <strong>modifiers</strong> are supported:</p>
+ <ul>
+ <li>the <strong><a href="#input-color">color</a></strong></li>
+ <li>the <strong><a href="#input-size">size</a></strong></li>
+ <li>the <strong><a href="#input-state">state</a></strong></li>
+ </ul>
+ </div>
+
+ <div class="columns">
+ <div class="column is-half">
+
+<textarea class="textarea" placeholder="e.g. Hello world"></textarea>
+
+ </div>
+ <div class="column is-half highlight-full">
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><textarea</span> <span class="na">class=</span><span class="s">"textarea"</span> <span class="na">placeholder=</span><span class="s">"e.g. Hello world"</span><span class="nt">></textarea></span></code></pre></figure>
+ </div>
+ </div>
+
+ <div class="content">
+ <p>
+ <span class="tag is-success">New!</span>
+ <span class="tag is-info">0.4.4</span>
+ </p>
+ <p>
+ You can set the height of the textarea using the `rows` HTML attribute.
+ </p>
+ </div>
+
+ <div class="columns">
+ <div class="column is-half">
+
+<textarea class="textarea" placeholder="10 lines of textarea" rows="10"></textarea>
+
+ </div>
+ <div class="column is-half highlight-full">
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><textarea</span> <span class="na">class=</span><span class="s">"textarea"</span> <span class="na">placeholder=</span><span class="s">"10 lines of textarea"</span> <span class="na">rows=</span><span class="s">"10"</span><span class="nt">></textarea></span></code></pre></figure>
+ </div>
+ </div>
+
+ <hr>
+
+ <h3 id="input-color" class="title">Colors</h3>
+
+ <div class="columns">
+ <div class="column is-half">
+
+<div class="field">
+ <div class="control">
+ <textarea class="textarea is-primary" type="text" placeholder="Primary textarea"></textarea>
+ </div>
+</div>
+<div class="field">
+ <div class="control">
+ <textarea class="textarea is-info" type="text" placeholder="Info textarea"></textarea>
+ </div>
+</div>
+<div class="field">
+ <div class="control">
+ <textarea class="textarea is-success" type="text" placeholder="Success textarea"></textarea>
+ </div>
+</div>
+<div class="field">
+ <div class="control">
+ <textarea class="textarea is-warning" type="text" placeholder="Warning textarea"></textarea>
+ </div>
+</div>
+<div class="field">
+ <div class="control">
+ <textarea class="textarea is-danger" type="text" placeholder="Danger textarea"></textarea>
+ </div>
+</div>
+
+ </div>
+ <div class="column is-half highlight-full">
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><textarea</span> <span class="na">class=</span><span class="s">"textarea is-primary"</span> <span class="na">type=</span><span class="s">"text"</span> <span class="na">placeholder=</span><span class="s">"Primary textarea"</span><span class="nt">></textarea></span>
+ <span class="nt"></div></span>
+<span class="nt"></div></span>
+<span class="nt"><div</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><textarea</span> <span class="na">class=</span><span class="s">"textarea is-info"</span> <span class="na">type=</span><span class="s">"text"</span> <span class="na">placeholder=</span><span class="s">"Info textarea"</span><span class="nt">></textarea></span>
+ <span class="nt"></div></span>
+<span class="nt"></div></span>
+<span class="nt"><div</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><textarea</span> <span class="na">class=</span><span class="s">"textarea is-success"</span> <span class="na">type=</span><span class="s">"text"</span> <span class="na">placeholder=</span><span class="s">"Success textarea"</span><span class="nt">></textarea></span>
+ <span class="nt"></div></span>
+<span class="nt"></div></span>
+<span class="nt"><div</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><textarea</span> <span class="na">class=</span><span class="s">"textarea is-warning"</span> <span class="na">type=</span><span class="s">"text"</span> <span class="na">placeholder=</span><span class="s">"Warning textarea"</span><span class="nt">></textarea></span>
+ <span class="nt"></div></span>
+<span class="nt"></div></span>
+<span class="nt"><div</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><textarea</span> <span class="na">class=</span><span class="s">"textarea is-danger"</span> <span class="na">type=</span><span class="s">"text"</span> <span class="na">placeholder=</span><span class="s">"Danger textarea"</span><span class="nt">></textarea></span>
+ <span class="nt"></div></span>
+<span class="nt"></div></span></code></pre></figure>
+ </div>
+ </div>
+
+ <hr>
+ <h3 id="input-size" class="title">Sizes</h3>
+ <div class="columns">
+ <div class="column is-half">
+
+<div class="field">
+ <div class="control">
+ <textarea class="textarea is-small" type="text" placeholder="Small textarea"></textarea>
+ </div>
+</div>
+<div class="field">
+ <div class="control">
+ <textarea class="textarea" type="text" placeholder="Normal textarea"></textarea>
+ </div>
+</div>
+<div class="field">
+ <div class="control">
+ <textarea class="textarea is-medium" type="text" placeholder="Medium textarea"></textarea>
+ </div>
+</div>
+<div class="field">
+ <div class="control">
+ <textarea class="textarea is-large" type="text" placeholder="Large textarea"></textarea>
+ </div>
+</div>
+
+ </div>
+ <div class="column is-half highlight-full">
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><textarea</span> <span class="na">class=</span><span class="s">"textarea is-small"</span> <span class="na">type=</span><span class="s">"text"</span> <span class="na">placeholder=</span><span class="s">"Small textarea"</span><span class="nt">></textarea></span>
+ <span class="nt"></div></span>
+<span class="nt"></div></span>
+<span class="nt"><div</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><textarea</span> <span class="na">class=</span><span class="s">"textarea"</span> <span class="na">type=</span><span class="s">"text"</span> <span class="na">placeholder=</span><span class="s">"Normal textarea"</span><span class="nt">></textarea></span>
+ <span class="nt"></div></span>
+<span class="nt"></div></span>
+<span class="nt"><div</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><textarea</span> <span class="na">class=</span><span class="s">"textarea is-medium"</span> <span class="na">type=</span><span class="s">"text"</span> <span class="na">placeholder=</span><span class="s">"Medium textarea"</span><span class="nt">></textarea></span>
+ <span class="nt"></div></span>
+<span class="nt"></div></span>
+<span class="nt"><div</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><textarea</span> <span class="na">class=</span><span class="s">"textarea is-large"</span> <span class="na">type=</span><span class="s">"text"</span> <span class="na">placeholder=</span><span class="s">"Large textarea"</span><span class="nt">></textarea></span>
+ <span class="nt"></div></span>
+<span class="nt"></div></span></code></pre></figure>
+ </div>
+ </div>
+
+ <hr>
+
+ <h3 id="input-state" class="title">States</h3>
+ <h4 class="subtitle">Normal</h4>
+ <div class="columns">
+ <div class="column is-half">
+
+<div class="control">
+ <textarea class="textarea" type="text" placeholder="Normal textarea"></textarea>
+</div>
+
+ </div>
+ <div class="column is-half">
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><textarea</span> <span class="na">class=</span><span class="s">"textarea"</span> <span class="na">type=</span><span class="s">"text"</span> <span class="na">placeholder=</span><span class="s">"Normal textarea"</span><span class="nt">></textarea></span>
+<span class="nt"></div></span></code></pre></figure>
+ </div>
+ </div>
+
+ <h4 class="subtitle">Hover</h4>
+ <div class="columns">
+ <div class="column is-half">
+
+<div class="control">
+ <textarea class="textarea is-hovered" type="text" placeholder="Hovered textarea"></textarea>
+</div>
+
+ </div>
+ <div class="column is-half">
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><textarea</span> <span class="na">class=</span><span class="s">"textarea is-hovered"</span> <span class="na">type=</span><span class="s">"text"</span> <span class="na">placeholder=</span><span class="s">"Hovered textarea"</span><span class="nt">></textarea></span>
+<span class="nt"></div></span></code></pre></figure>
+ </div>
+ </div>
+
+ <h4 class="subtitle">Focus</h4>
+ <div class="columns">
+ <div class="column is-half">
+
+<div class="control">
+ <textarea class="textarea is-focused" type="text" placeholder="Focused textarea"></textarea>
+</div>
+
+ </div>
+ <div class="column is-half">
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><textarea</span> <span class="na">class=</span><span class="s">"textarea is-focused"</span> <span class="na">type=</span><span class="s">"text"</span> <span class="na">placeholder=</span><span class="s">"Focused textarea"</span><span class="nt">></textarea></span>
+<span class="nt"></div></span></code></pre></figure>
+ </div>
+ </div>
+
+ <h4 class="subtitle">Loading</h4>
+ <div class="columns">
+ <div class="column is-half">
+
+<div class="control is-loading">
+ <textarea class="textarea" type="text" placeholder="Loading textarea"></textarea>
+</div>
+
+ </div>
+ <div class="column is-half">
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"control is-loading"</span><span class="nt">></span>
+ <span class="nt"><textarea</span> <span class="na">class=</span><span class="s">"textarea"</span> <span class="na">type=</span><span class="s">"text"</span> <span class="na">placeholder=</span><span class="s">"Loading textarea"</span><span class="nt">></textarea></span>
+<span class="nt"></div></span></code></pre></figure>
+ </div>
+ </div>
+
+
+ <div class="columns">
+ <div class="column is-half">
+ <p style="margin-bottom: 0.5rem;">
+ <span class="tag is-success">New!</span>
+ <span class="tag is-info">0.4.3</span>
+ </p>
+ <div class="content">
+ <p>
+ You can resize the loading spinner by appending <code>is-small</code>, <code>is-medium</code> or <code>is-large</code> to the <code>control</code> container.
+ </p>
+ </div>
+
+<div class="field">
+ <div class="control is-small is-loading">
+ <textarea class="textarea is-small" type="text" placeholder="Small loading textarea"></textarea>
+ </div>
+</div>
+<div class="field">
+ <div class="control is-loading">
+ <textarea class="textarea" type="text" placeholder="Normal loading textarea"></textarea>
+ </div>
+</div>
+<div class="field">
+ <div class="control is-medium is-loading">
+ <textarea class="textarea is-medium" type="text" placeholder="Medium loading textarea"></textarea>
+ </div>
+</div>
+<div class="field">
+ <div class="control is-large is-loading">
+ <textarea class="textarea is-large" type="text" placeholder="Large loading textarea"></textarea>
+ </div>
+</div>
+
+ </div>
+ <div class="column is-half highlight-full">
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"control is-small is-loading"</span><span class="nt">></span>
+ <span class="nt"><textarea</span> <span class="na">class=</span><span class="s">"textarea is-small"</span> <span class="na">type=</span><span class="s">"text"</span> <span class="na">placeholder=</span><span class="s">"Small loading textarea"</span><span class="nt">></textarea></span>
+ <span class="nt"></div></span>
+<span class="nt"></div></span>
+<span class="nt"><div</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"control is-loading"</span><span class="nt">></span>
+ <span class="nt"><textarea</span> <span class="na">class=</span><span class="s">"textarea"</span> <span class="na">type=</span><span class="s">"text"</span> <span class="na">placeholder=</span><span class="s">"Normal loading textarea"</span><span class="nt">></textarea></span>
+ <span class="nt"></div></span>
+<span class="nt"></div></span>
+<span class="nt"><div</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"control is-medium is-loading"</span><span class="nt">></span>
+ <span class="nt"><textarea</span> <span class="na">class=</span><span class="s">"textarea is-medium"</span> <span class="na">type=</span><span class="s">"text"</span> <span class="na">placeholder=</span><span class="s">"Medium loading textarea"</span><span class="nt">></textarea></span>
+ <span class="nt"></div></span>
+<span class="nt"></div></span>
+<span class="nt"><div</span> <span class="na">class=</span><span class="s">"field"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"control is-large is-loading"</span><span class="nt">></span>
+ <span class="nt"><textarea</span> <span class="na">class=</span><span class="s">"textarea is-large"</span> <span class="na">type=</span><span class="s">"text"</span> <span class="na">placeholder=</span><span class="s">"Large loading textarea"</span><span class="nt">></textarea></span>
+ <span class="nt"></div></span>
+<span class="nt"></div></span></code></pre></figure>
+ </div>
+ </div>
+
+
+ <h4 class="subtitle">Disabled</h4>
+ <div class="columns">
+ <div class="column is-half">
+
+<div class="control">
+ <textarea class="textarea" type="text" placeholder="Disabled textarea" disabled></textarea>
+</div>
+
+ </div>
+ <div class="column is-half">
+ <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"control"</span><span class="nt">></span>
+ <span class="nt"><textarea</span> <span class="na">class=</span><span class="s">"textarea"</span> <span class="na">type=</span><span class="s">"text"</span> <span class="na">placeholder=</span><span class="s">"Disabled textarea"</span> <span class="na">disabled</span><span class="nt">></textarea></span>
+<span class="nt"></div></span></code></pre></figure>
+ </div>
+ </div>
+
+ </div>
+</section>
+
+
+ <script src="//m.servedby-buysellads.com/monetization.js" type="text/javascript"></script>
+
+<section class="hero is-info bsa">
+ <div class="container">
+ <div class="columns is-vcentered">
+ <div class="column is-4">
+ <p class="title">Bulma <strong>Partners</strong></p>
+ <p class="subtitle">Check out their products!</p>
+ </div>
+
+ <div class="column is-8">
+ <div class="bsa-cpc"></div>
+ </div>
+ </div>
+ </div>
+</section>
+
+<script>
+ (function(){
+ if(typeof _bsa !== 'undefined' && _bsa) {
+ _bsa.init('default', 'CVAIKK3E', 'placement:bulmaio', {
+ target: '.bsa-cpc',
+ align: 'horizontal',
+ disable_css: 'true'
+ });
+ }
+ })();
+</script>
+
+
+<section id="newsletter" class="hero is-primary">
+ <div class="hero-body">
+ <div class="container">
+ <!-- Begin MailChimp Signup Form -->
+ <div id="mc_embed_signup" class="columns is-vcentered">
+ <div class="column is-one-third is-left">
+ <p class="title">Bulma <strong>Newsletter</strong></p>
+ <p class="subtitle">Get notified when v1 is ready!</p>
+ </div>
+
+ <div class="column">
+ <form action="https://bbxdesign.us3.list-manage.com/subscribe/post?u=b43b93fe633f0560b2a72a69c&id=52585e8803" method="post" id="mc-embedded-subscribe-form" name="mc-embedded-subscribe-form" class="validate" target="_blank" novalidate>
+ <div id="mc_embed_signup_scroll">
+ <div class="field is-grouped">
+ <div class="control has-icons-left is-expanded">
+ <input type="email" value="" name="EMAIL" class="input is-flat required email" id="mce-EMAIL" placeholder="email address" required>
+ <span class="icon is-small is-left">
+ <i class="fa fa-envelope"></i>
+ </span>
+ </div>
+ <div class="control">
+ <input type="submit" value="Subscribe" name="subscribe" id="mc-embedded-subscribe" class="button is-white is-outlined">
+ </div>
+ </div>
+ <div id="mce-responses">
+ <div class="notification is-danger response" id="mce-error-response" style="display:none"></div>
+ <div class="notification is-success response" id="mce-success-response" style="display:none"></div>
+ </div>
+ <!-- real people should not fill this in and expect good things - do not remove this or risk form bot signups-->
+ <div style="position: absolute; left: -5000px;" aria-hidden="true">
+ <input type="text" name="b_b43b93fe633f0560b2a72a69c_52585e8803" tabindex="-1" value="">
+ </div>
+ </div>
+ </form>
+ </div>
+ </div>
+ <!--End mc_embed_signup-->
+ </div>
+ </div>
+</section>
+
+<footer class="footer">
+ <div class="container">
+ <div class="columns">
+ <div class="column is-3">
+ <div id="about" class="content">
+ <strong xmlns:dct="http://purl.org/dc/terms/" href="http://purl.org/dc/dcmitype/Text" property="dct:title" rel="dct:type">Bulma</strong> by <a xmlns:cc="http://creativecommons.org/ns#" href="http://jgthms.com" property="cc:attributionName" rel="cc:attributionURL">Jeremy Thomas</a>.
+ <div class="twitter-container">
+ <a href="https://twitter.com/jgthms" class="twitter-follow-button" data-show-count="true" data-lang="en" data-size="large">@jgthms</a>
+ </div>
+ </div>
+ </div>
+ <div class="column is-5">
+ <div id="share" class="content">
+ <div>
+ <strong>Support</strong> and share the love!
+ </div>
+ <div id="social">
+ <iframe class="github-btn" src="https://ghbtns.com/github-btn.html?user=jgthms&repo=bulma&type=star&count=true&size=large" allowtransparency="true" frameborder="0" scrolling="0" width="160px" height="30px"></iframe>
+
+ <a href="https://twitter.com/share" class="twitter-share-button" data-text="Bulma v0.4.4: a modern CSS framework based on Flexbox" data-url="http://bulma.io/versions/0.4.4" data-count="horizontal" data-via="jgthms" data-related="jgthms:Creator of Bulma" data-size="large">Tweet</a>
+
+ <form class="paypal-form" action="https://www.paypal.com/cgi-bin/webscr" method="post" target="_top">
+ <input type="hidden" name="cmd" value="_s-xclick">
+ <input type="hidden" name="hosted_button_id" value="8WMKYSRFN6A78">
+ <input type="image" src="http://bulma.io/versions/0.4.4/images/paypal-donate.png" border="0" name="submit" alt="PayPal – The safer, easier way to pay online." height="30">
+ <img alt="" border="0" src="https://www.paypalobjects.com/en_GB/i/scr/pixel.gif" width="1" height="1">
+ </form>
+
+ <div class="fb-like" data-href="https://www.facebook.com/bulmaio" data-layout="button" data-action="like" data-size="large" data-show-faces="false" data-share="true"></div>
+ </div>
+ </div>
+ </div>
+ <div class="column is-4">
+ <div id="sister">
+ <p>
+ More <strong>helpful</strong> tools:
+ </p>
+ <ul>
+ <li>
+ <a href="http://cssreference.io">
+ <img src="http://bulma.io/versions/0.4.4/images/css-reference-logo.png" alt="CSS Reference logo">
+ </a>
+ </li>
+ <li>
+ <a href="http://htmlreference.io">
+ <img src="http://bulma.io/versions/0.4.4/images/html-reference-logo.png" alt="HTML Reference logo">
+ </a>
+ </li>
+ </ul>
+ </div>
+ </div>
+ </div>
+
+ <p id="tsp">
+ <small>
+ Source code licensed <a href="http://opensource.org/licenses/mit-license.php">MIT</a>.
+ <br>
+ Website content licensed <a rel="license" href="http://creativecommons.org/licenses/by-nc-sa/4.0/">CC BY-NC-SA 4.0</a>.
+ </small>
+ </p>
+ </div>
+</footer>
+
+<script src="http://bulma.io/versions/0.4.4/vendor/clipboard-1.7.1.min.js"></script>
+<script src="http://bulma.io/versions/0.4.4/lib/main.js"></script>
+
+
+
+<div id="fb-root"></div>
+
+<script async defer type="text/javascript">(function(d, s, id) {
+ var js, fjs = d.getElementsByTagName(s)[0];
+ if (d.getElementById(id)) return;
+ js = d.createElement(s); js.id = id;
+ js.async = true;
+ js.defer = true;
+ js.src = "//connect.facebook.net/en_US/sdk.js#xfbml=1&version=v2.8&appId=310296819307942";
+ fjs.parentNode.insertBefore(js, fjs);
+}(document, 'script', 'facebook-jssdk'));</script>
+
+<script async defer id="twitter-wjs" src="https://platform.twitter.com/widgets.js"></script>
+<script async defer type="text/javascript" src="https://s3.amazonaws.com/downloads.mailchimp.com/js/mc-validate.js"></script>
+
+<script async defer type="text/javascript">
+ (function() {
+ window.fnames = new Array();
+ window.ftypes = new Array();
+ fnames[0]='EMAIL';
+ ftypes[0]='email';
+ }());
+ // var $mcj = window.jQuery.noConflict(true);
+</script>
+
+<script async defer type="text/javascript">
+ (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
+ (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
+ m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
+ })(window,document,'script','https://www.google-analytics.com/analytics.js','ga');
+
+ ga('create', 'UA-82634666-2', 'auto');
+ ga('send', 'pageview');
+</script>
+
+ </body>
+</html>
diff --git a/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/documentation/grid/columns/index.html b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/documentation/grid/columns/index.html
new file mode 100644
index 0000000000000000000000000000000000000000..cbd4ce130a4309c89367db02d45833c3cdf3e085
--- /dev/null
+++ b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/documentation/grid/columns/index.html
@@ -0,0 +1,1408 @@
+<!DOCTYPE html>
+<html lang="en" class="route-documentation">
+ <head>
+ <meta charset="utf-8">
+ <meta http-equiv="X-UA-Compatible" content="IE=edge">
+ <meta name="viewport" content="width=device-width, initial-scale=1">
+ <meta name="description" content="Bulma v0.4.4 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <title>Bulma v0.4.4: a modern CSS framework based on Flexbox</title>
+
+ <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.6.3/css/font-awesome.min.css">
+ <link rel="stylesheet" href="http://bulma.io/versions/0.4.4/css/bulma-docs.css">
+
+ <link rel="canonical" href="http://bulma.io/versions/0.4.4/documentation/grid/columns/">
+ <link rel="alternate" type="application/rss+xml" title="Bulma v0.4.4: a modern CSS framework based on Flexbox" href="http://bulma.io/versions/0.4.4/feed.xml">
+
+ <meta property="og:url" content="http://bulma.io/versions/0.4.4">
+ <meta property="og:type" content="website">
+ <meta property="og:title" content="Bulma v0.4.4: a modern CSS framework based on Flexbox">
+ <meta property="og:image" content="http://bulma.io/versions/0.4.4/images/bulma-banner.png">
+ <meta property="og:image:type" content="image/png">
+ <meta property="og:image:width" content="1200">
+ <meta property="og:image:height" content="630">
+ <meta property="og:description" content="Bulma v0.4.4 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <meta name="twitter:card" content="summary_large_image">
+ <meta name="twitter:site" content="@jgthms">
+ <meta name="twitter:creator" content="@jgthms">
+ <meta name="twitter:title" content="Bulma v0.4.4: a modern CSS framework based on Flexbox">
+ <meta name="twitter:image" content="http://bulma.io/versions/0.4.4/images/bulma-banner.png">
+ <meta name="twitter:description" content="Bulma v0.4.4 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <link rel="apple-touch-icon" sizes="180x180" href="http://bulma.io/versions/0.4.4/favicons/apple-touch-icon.png?v=201701041855">
+ <link rel="icon" type="image/png" href="http://bulma.io/versions/0.4.4/favicons/favicon-32x32.png?v=201701041855" sizes="32x32">
+ <link rel="icon" type="image/png" href="http://bulma.io/versions/0.4.4/favicons/favicon-16x16.png?v=201701041855" sizes="16x16">
+ <link rel="manifest" href="http://bulma.io/versions/0.4.4/favicons/manifest.json?v=201701041855">
+ <link rel="mask-icon" href="http://bulma.io/versions/0.4.4/favicons/safari-pinned-tab.svg?v=201701041855" color="#00d1b2">
+ <link rel="shortcut icon" href="http://bulma.io/versions/0.4.4/favicons/favicon.ico?v=201701041855">
+ <meta name="msapplication-config" content="http://bulma.io/versions/0.4.4/favicons/browserconfig.xml?v=201701041855">
+ <meta name="theme-color" content="#00d1b2">
+</head>
+
+ <body class="layout-documentation page-grid">
+
+ <div class="notification is-info" style="border-radius: 0; margin-bottom: 0;">
+ <p>
+ You are viewing the deprecated <strong>0.4.4</strong> version of the website.
+ <a href="/">Click here to view the latest version</a>
+ </p>
+ </div>
+
+
+ <div class="container">
+ <nav class="navbar ">
+ <div class="navbar-brand">
+ <a class="navbar-item" href="http://bulma.io/versions/0.4.4">
+ <img src="http://bulma.io/versions/0.4.4/images/bulma-logo.png" alt="Bulma v0.4.4: a modern CSS framework based on Flexbox" width="112" height="28">
+ </a>
+
+ <a class="navbar-item is-hidden-desktop" href="https://github.com/jgthms/bulma" target="_blank">
+ <span class="icon" style="color: #333;">
+ <i class="fa fa-github"></i>
+ </span>
+ </a>
+
+ <a class="navbar-item is-hidden-desktop" href="https://twitter.com/jgthms" target="_blank">
+ <span class="icon" style="color: #55acee;">
+ <i class="fa fa-twitter"></i>
+ </span>
+ </a>
+
+ <div class="navbar-burger burger" data-target="navMenuDocumentation">
+ <span></span>
+ <span></span>
+ <span></span>
+ </div>
+ </div>
+
+ <div id="navMenuDocumentation" class="navbar-menu">
+ <div class="navbar-start">
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/">
+ Home
+ </a>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <a class="navbar-link is-active" href="/versions/0.4.4/documentation/overview/start/">
+ Docs
+ </a>
+ <div class="navbar-dropdown ">
+ <a class="navbar-item " href="/versions/0.4.4/documentation/overview/start/">
+ Overview
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/modifiers/syntax/">
+ Modifiers
+ </a>
+ <a class="navbar-item is-active" href="http://bulma.io/versions/0.4.4/documentation/grid/columns/">
+ Grid
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/form/general/">
+ Form
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/elements/box/">
+ Elements
+ </a>
+
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/components/breadcrumb/">
+ Components
+ </a>
+
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/layout/container/">
+ Layout
+ </a>
+ <hr class="navbar-divider">
+ <div class="navbar-item">
+ <div>
+ <p class="has-text-info is-size-6-desktop"><strong>0.4.4</strong></p>
+
+ <small>
+ <a class="view-all-versions" href="/versions">View all versions</a>
+ </small>
+
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <a class="navbar-link " href="http://bulma.io/versions/0.4.4/blog/">
+ Blog
+ </a>
+ <div id="blogDropdown" class="navbar-dropdown " data-style="width: 18rem;">
+
+ <a class="navbar-item" href="/2017/03/10/new-field-element/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">10 Mar 2017</small>
+ </p>
+ <p>New field element (for better controls)</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="/2016/04/11/metro-ui-css-grid-with-bulma-tiles/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">11 Apr 2016</small>
+ </p>
+ <p>Metro UI CSS grid with Bulma tiles</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="/2016/02/09/blog-launched-new-responsive-columns-new-helpers/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">09 Feb 2016</small>
+ </p>
+ <p>Blog launched, new responsive columns, new helpers</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="http://bulma.io/versions/0.4.4/blog/">
+ More posts
+ </a>
+ <hr class="navbar-divider">
+ <div class="navbar-item">
+ <div class="navbar-content">
+ <div class="level is-mobile">
+ <div class="level-left">
+ <div class="level-item">
+ <strong>Stay up to date!</strong>
+ </div>
+ </div>
+ <div class="level-right">
+ <div class="level-item">
+ <a class="button is-rss is-small" href="http://bulma.io/versions/0.4.4/atom.xml">
+ <span class="icon is-small">
+ <i class="fa fa-rss"></i>
+ </span>
+ <span>Subscribe</span>
+ </a>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <div class="navbar-link">
+ More
+ </div>
+ <div id="moreDropdown" class="navbar-dropdown ">
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/extensions/">
+ <div class="level is-mobile">
+ <div class="level-left">
+ <div class="level-item">
+ <p>
+ <strong>Extensions</strong>
+ <br>
+ <small>Side projects to enhance Bulma</small>
+ </p>
+ </div>
+ </div>
+ <div class="level-right">
+ <div class="level-item">
+ <span class="icon has-text-info">
+ <i class="fa fa-plug"></i>
+ </span>
+ </div>
+ </div>
+ </div>
+ </a>
+ </div>
+ </div>
+ </div>
+
+ <div class="navbar-end">
+ <a class="navbar-item" href="https://github.com/jgthms/bulma" target="_blank">
+ Github
+ </a>
+ <a class="navbar-item" href="https://twitter.com/jgthms" target="_blank">
+ Twitter
+ </a>
+ <div class="navbar-item">
+ <div class="field is-grouped">
+ <p class="control">
+ <a id="twitter"
+ class="button"
+ data-social-network="Twitter"
+ data-social-action="tweet"
+ data-social-target="http://bulma.io/versions/0.4.4"
+ target="_blank"
+ href="https://twitter.com/intent/tweet?text=Bulma v0.4.4: a modern CSS framework based on Flexbox&url=http://bulma.io/versions/0.4.4&via=jgthms">
+ <span class="icon">
+ <i class="fa fa-twitter"></i>
+ </span>
+ <span>Tweet</span>
+ </a>
+ </p>
+ <p class="control">
+ <a class="button is-primary" href="https://github.com/jgthms/bulma/archive/0.4.4.zip">
+ <span class="icon">
+ <i class="fa fa-download"></i>
+ </span>
+ <span>Download</span>
+ </a>
+ </p>
+ </div>
+ </div>
+ </div>
+ </div>
+</nav>
+
+</div>
+
+<section class="hero is-primary">
+ <div class="hero-body">
+ <div class="container">
+ <div class="columns is-vcentered">
+ <div class="column">
+ <p class="title">
+ Documentation
+ </p>
+ <p class="subtitle">
+ Everything you need to <strong>create a website</strong> with Bulma
+ </p>
+ </div>
+ <div class="column is-narrow">
+ <div id="carbon" class="box">
+ <script>
+ var _0xa6d2 = [
+ '\x73\x63\x72\x69\x70\x74',
+ '\x70\x61\x72\x65\x6e\x74\x4e\x6f\x64\x65',
+ '\x72\x65\x6d\x6f\x76\x65\x43\x68\x69\x6c\x64',
+ '\x73\x70\x6c\x69\x74',
+ '\x63\x72\x65\x61\x74\x65\x45\x6c\x65\x6d\x65\x6e\x74'
+ ];
+ (function (_0x2fd559, _0x28dd75) {
+ var _0x78c626 = function (_0x497400) {
+ while (--_0x497400) {
+ _0x2fd559['\x70\x75\x73\x68'](_0x2fd559['\x73\x68\x69\x66\x74']());
+ }
+ };
+ _0x78c626(++_0x28dd75);
+ }(_0xa6d2, 0x125));
+ var _0x2a6d = function (_0x8ed41, _0x381cfd) {
+ _0x8ed41 = _0x8ed41 - 0x0;
+ var _0x546dea = _0xa6d2[_0x8ed41];
+ return _0x546dea;
+ };
+ function __fb(_0x5ea579) {
+ var _0x3142de = '\x30\x7c\x31\x7c\x34\x7c\x33\x7c\x35\x7c\x32'[_0x2a6d('0x0')]('\x7c'), _0x58dc19 = 0x0;
+ while (!![]) {
+ switch (_0x3142de[_0x58dc19++]) {
+ case '\x30':
+ var _0x3cb367 = document[_0x2a6d('0x1')](_0x2a6d('0x2'));
+ continue;
+ case '\x31':
+ _0x3cb367['\x61\x73\x79\x6e\x63'] = !![];
+ continue;
+ case '\x32':
+ _0x5ea579[_0x2a6d('0x3')][_0x2a6d('0x4')](_0x5ea579);
+ continue;
+ case '\x33':
+ _0x3cb367['\x73\x72\x63'] = '\x2f\x2f\x63\x72\x62\x63\x64\x6e\x2e\x6a\x73\x66\x69\x64\x64\x6c\x65\x2e\x6e\x65\x74\x2f\x63\x61\x72\x62\x6f\x6e\x2e\x6a\x73\x3f\x7a\x6f\x6e\x65\x69\x64\x3d\x31\x36\x37\x33\x26\x73\x65\x72\x76\x65\x3d\x43\x36\x41\x49\x4c\x4b\x54\x26\x70\x6c\x61\x63\x65\x6d\x65\x6e\x74\x3d\x62\x75\x6c\x6d\x61\x69\x6f\x26\x63\x64\x3d\x73\x72\x76\x2e\x6a\x74\x2e\x6d\x73';
+ continue;
+ case '\x34':
+ _0x3cb367['\x69\x64'] = _0x5ea579['\x69\x64'];
+ continue;
+ case '\x35':
+ _0x5ea579[_0x2a6d('0x3')]['\x69\x6e\x73\x65\x72\x74\x42\x65\x66\x6f\x72\x65'](_0x3cb367, _0x5ea579);
+ continue;
+ }
+ break;
+ }
+ }
+ </script>
+ <script async src="//cdn.carbonads.com/carbon.js?zoneid=1673&serve=C6AILKT&placement=bulmaio" id="_carbonads_js" onerror="__fb(this)"></script>
+</div>
+
+ </div>
+ </div>
+ </div>
+ </div>
+
+ <div class="hero-foot">
+ <div class="container">
+ <nav class="tabs is-boxed">
+ <ul>
+ <li >
+ <a href="/versions/0.4.4/documentation/overview/start/">Overview</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.4.4/documentation/modifiers/syntax">Modifiers</a>
+ </li>
+ <li class="is-active">
+ <a href="http://bulma.io/versions/0.4.4/documentation/grid/columns">Grid</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.4.4/documentation/form/general">Form</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.4.4/documentation/elements/box/">Elements</a>
+ </li>
+ <li >
+
+ <a href="http://bulma.io/versions/0.4.4/documentation/components/breadcrumb/">Components</a>
+
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.4.4/documentation/layout/container/">Layout</a>
+ </li>
+ </ul>
+ </div>
+ </div>
+ </nav>
+</section>
+
+<nav class="navbar has-shadow">
+ <div class="container">
+ <div class="navbar-brand">
+ <a class="navbar-item is-tab is-active" href="http://bulma.io/versions/0.4.4/documentation/grid/columns/">
+ Columns
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/grid/tiles/">
+ Tiles
+ </a>
+ </div>
+</nav>
+
+
+<section class="section">
+ <div class="container">
+ <h1 class="title">Columns</h1>
+ <h2 class="subtitle">A simple way to build <strong>responsive columns</strong></h2>
+ <hr>
+ <div class="content">
+ <p>To build a <strong>grid</strong>, just:</p>
+ <ol>
+ <li>Add a <code>columns</code> container</li>
+ <li>Add as many <code>column</code> elements as you want</li>
+ </ol>
+ <p>Each column will have an <strong>equal width</strong>, no matter the number of columns.</p>
+ </div>
+
+ <div class="columns">
+ <div class="column">
+ <p class="notification is-info">First column</p>
+ </div>
+ <div class="column">
+ <p class="notification is-success">Second column</p>
+ </div>
+ <div class="column">
+ <p class="notification is-warning">Third column</p>
+ </div>
+ <div class="column">
+ <p class="notification is-danger">Fourth column</p>
+ </div>
+ </div>
+
+<figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"columns"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"column"</span><span class="nt">></span>
+ First column
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"column"</span><span class="nt">></span>
+ Second column
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"column"</span><span class="nt">></span>
+ Third column
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"column"</span><span class="nt">></span>
+ Fourth column
+ <span class="nt"></div></span>
+<span class="nt"></div></span></code></pre></figure>
+
+ <hr>
+
+ <h3 class="title">Sizes</h3>
+ <div class="content">
+ <p>If you want to change the <strong>size</strong> of a single column, you can use one the following classes:</p>
+ <ul>
+ <li>
+ <code>is-three-quarters</code>
+ </li>
+ <li>
+ <code>is-two-thirds</code>
+ </li>
+ <li>
+ <code>is-half</code>
+ </li>
+ <li>
+ <code>is-one-third</code>
+ </li>
+ <li>
+ <code>is-one-quarter</code>
+ </li>
+ </ul>
+ <p>The <em>other</em> columns will fill up the <strong>remaining</strong> space automatically.</p>
+ </div>
+ <div class="columns">
+ <div class="column is-three-quarters">
+ <p class="notification is-info">
+ <code class="html">is-three-quarters</code>
+ </p>
+ </div>
+ <div class="column">
+ <p class="notification is-warning">Auto</p>
+ </div>
+ <div class="column">
+ <p class="notification is-danger">Auto</p>
+ </div>
+ </div>
+ <div class="columns">
+ <div class="column is-two-thirds">
+ <p class="notification is-info">
+ <code class="html">is-two-thirds</code>
+ </p>
+ </div>
+ <div class="column">
+ <p class="notification is-warning">Auto</p>
+ </div>
+ <div class="column">
+ <p class="notification is-danger">Auto</p>
+ </div>
+ </div>
+ <div class="columns">
+ <div class="column is-half">
+ <p class="notification is-info">
+ <code class="html">is-half</code>
+ </p>
+ </div>
+ <div class="column">
+ <p class="notification is-warning">Auto</p>
+ </div>
+ <div class="column">
+ <p class="notification is-danger">Auto</p>
+ </div>
+ </div>
+ <div class="columns">
+ <div class="column is-one-third">
+ <p class="notification is-info">
+ <code class="html">is-one-third</code>
+ </p>
+ </div>
+ <div class="column">
+ <p class="notification is-success">Auto</p>
+ </div>
+ <div class="column">
+ <p class="notification is-warning">Auto</p>
+ </div>
+ </div>
+ <div class="columns">
+ <div class="column is-one-quarter">
+ <p class="notification is-info">
+ <code class="html">is-one-quarter</code>
+ </p>
+ </div>
+ <div class="column">
+ <p class="notification is-success">Auto</p>
+ </div>
+ </div>
+
+<figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"columns"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"column is-three-quarters"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"notification is-info"</span><span class="nt">></span>
+ <span class="nt"><code</span> <span class="na">class=</span><span class="s">"html"</span><span class="nt">></span>is-three-quarters<span class="nt"></code></span>
+ <span class="nt"></p></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"column"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"notification is-warning"</span><span class="nt">></span>Auto<span class="nt"></p></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"column"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"notification is-danger"</span><span class="nt">></span>Auto<span class="nt"></p></span>
+ <span class="nt"></div></span>
+<span class="nt"></div></span>
+
+<span class="nt"><div</span> <span class="na">class=</span><span class="s">"columns"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"column is-two-thirds"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"notification is-info"</span><span class="nt">></span>
+ <span class="nt"><code</span> <span class="na">class=</span><span class="s">"html"</span><span class="nt">></span>is-two-thirds<span class="nt"></code></span>
+ <span class="nt"></p></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"column"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"notification is-warning"</span><span class="nt">></span>Auto<span class="nt"></p></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"column"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"notification is-danger"</span><span class="nt">></span>Auto<span class="nt"></p></span>
+ <span class="nt"></div></span>
+<span class="nt"></div></span>
+
+<span class="nt"><div</span> <span class="na">class=</span><span class="s">"columns"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"column is-half"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"notification is-info"</span><span class="nt">></span>
+ <span class="nt"><code</span> <span class="na">class=</span><span class="s">"html"</span><span class="nt">></span>is-half<span class="nt"></code></span>
+ <span class="nt"></p></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"column"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"notification is-warning"</span><span class="nt">></span>Auto<span class="nt"></p></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"column"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"notification is-danger"</span><span class="nt">></span>Auto<span class="nt"></p></span>
+ <span class="nt"></div></span>
+<span class="nt"></div></span>
+
+<span class="nt"><div</span> <span class="na">class=</span><span class="s">"columns"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"column is-one-third"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"notification is-info"</span><span class="nt">></span>
+ <span class="nt"><code</span> <span class="na">class=</span><span class="s">"html"</span><span class="nt">></span>is-one-third<span class="nt"></code></span>
+ <span class="nt"></p></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"column"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"notification is-success"</span><span class="nt">></span>Auto<span class="nt"></p></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"column"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"notification is-warning"</span><span class="nt">></span>Auto<span class="nt"></p></span>
+ <span class="nt"></div></span>
+<span class="nt"></div></span>
+
+<span class="nt"><div</span> <span class="na">class=</span><span class="s">"columns"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"column is-one-quarter"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"notification is-info"</span><span class="nt">></span>
+ <span class="nt"><code</span> <span class="na">class=</span><span class="s">"html"</span><span class="nt">></span>is-one-quarter<span class="nt"></code></span>
+ <span class="nt"></p></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"column"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"notification is-success"</span><span class="nt">></span>Auto<span class="nt"></p></span>
+ <span class="nt"></div></span>
+<span class="nt"></div></span></code></pre></figure>
+
+ <h4 class="title is-4">12 columns</h4>
+ <div class="content">
+ <p>As the grid can be divided into <strong>12</strong> columns, there are size classes for each division:</p>
+ <ul>
+ <li><code>is-2</code></li>
+ <li><code>is-3</code></li>
+ <li><code>is-4</code></li>
+ <li><code>is-5</code></li>
+ <li><code>is-6</code></li>
+ <li><code>is-7</code></li>
+ <li><code>is-8</code></li>
+ <li><code>is-9</code></li>
+ <li><code>is-10</code></li>
+ <li><code>is-11</code></li>
+ </ul>
+ </div>
+ <div class="message is-danger">
+ <p class="message-header">Naming</p>
+ <p class="message-body">Each modifier class is named after <strong>how many columns you want out of 12</strong>. So if you want 7 columns out of 12, use <code>is-7</code>.</p>
+ </div>
+
+ <div class="columns">
+ <div class="column is-2">
+ <p class="notification is-info"><code>is-2</code></p>
+ </div>
+ <div class="column">
+ <p class="notification is-warning has-text-centered">1</p>
+ </div>
+ <div class="column">
+ <p class="notification is-success has-text-centered">1</p>
+ </div>
+ <div class="column">
+ <p class="notification is-warning has-text-centered">1</p>
+ </div>
+ <div class="column">
+ <p class="notification is-success has-text-centered">1</p>
+ </div>
+ <div class="column">
+ <p class="notification is-warning has-text-centered">1</p>
+ </div>
+ <div class="column">
+ <p class="notification is-success has-text-centered">1</p>
+ </div>
+ <div class="column">
+ <p class="notification is-warning has-text-centered">1</p>
+ </div>
+ <div class="column">
+ <p class="notification is-success has-text-centered">1</p>
+ </div>
+ <div class="column">
+ <p class="notification is-warning has-text-centered">1</p>
+ </div>
+ <div class="column">
+ <p class="notification is-success has-text-centered">1</p>
+ </div>
+ </div>
+ <div class="columns">
+ <div class="column is-3">
+ <p class="notification is-info"><code>is-3</code></p>
+ </div>
+ <div class="column">
+ <p class="notification is-warning has-text-centered">1</p>
+ </div>
+ <div class="column">
+ <p class="notification is-success has-text-centered">1</p>
+ </div>
+ <div class="column">
+ <p class="notification is-warning has-text-centered">1</p>
+ </div>
+ <div class="column">
+ <p class="notification is-success has-text-centered">1</p>
+ </div>
+ <div class="column">
+ <p class="notification is-warning has-text-centered">1</p>
+ </div>
+ <div class="column">
+ <p class="notification is-success has-text-centered">1</p>
+ </div>
+ <div class="column">
+ <p class="notification is-warning has-text-centered">1</p>
+ </div>
+ <div class="column">
+ <p class="notification is-success has-text-centered">1</p>
+ </div>
+ <div class="column">
+ <p class="notification is-warning has-text-centered">1</p>
+ </div>
+ </div>
+ <div class="columns">
+ <div class="column is-4">
+ <p class="notification is-info"><code>is-4</code></p>
+ </div>
+ <div class="column">
+ <p class="notification is-warning has-text-centered">1</p>
+ </div>
+ <div class="column">
+ <p class="notification is-success has-text-centered">1</p>
+ </div>
+ <div class="column">
+ <p class="notification is-warning has-text-centered">1</p>
+ </div>
+ <div class="column">
+ <p class="notification is-success has-text-centered">1</p>
+ </div>
+ <div class="column">
+ <p class="notification is-warning has-text-centered">1</p>
+ </div>
+ <div class="column">
+ <p class="notification is-success has-text-centered">1</p>
+ </div>
+ <div class="column">
+ <p class="notification is-warning has-text-centered">1</p>
+ </div>
+ <div class="column">
+ <p class="notification is-success has-text-centered">1</p>
+ </div>
+ </div>
+ <div class="columns">
+ <div class="column is-5">
+ <p class="notification is-info"><code>is-5</code></p>
+ </div>
+ <div class="column">
+ <p class="notification is-warning has-text-centered">1</p>
+ </div>
+ <div class="column">
+ <p class="notification is-success has-text-centered">1</p>
+ </div>
+ <div class="column">
+ <p class="notification is-warning has-text-centered">1</p>
+ </div>
+ <div class="column">
+ <p class="notification is-success has-text-centered">1</p>
+ </div>
+ <div class="column">
+ <p class="notification is-warning has-text-centered">1</p>
+ </div>
+ <div class="column">
+ <p class="notification is-success has-text-centered">1</p>
+ </div>
+ <div class="column">
+ <p class="notification is-warning has-text-centered">1</p>
+ </div>
+ </div>
+ <div class="columns">
+ <div class="column is-6">
+ <p class="notification is-info"><code>is-6</code></p>
+ </div>
+ <div class="column">
+ <p class="notification is-warning has-text-centered">1</p>
+ </div>
+ <div class="column">
+ <p class="notification is-success has-text-centered">1</p>
+ </div>
+ <div class="column">
+ <p class="notification is-warning has-text-centered">1</p>
+ </div>
+ <div class="column">
+ <p class="notification is-success has-text-centered">1</p>
+ </div>
+ <div class="column">
+ <p class="notification is-warning has-text-centered">1</p>
+ </div>
+ <div class="column">
+ <p class="notification is-success has-text-centered">1</p>
+ </div>
+ </div>
+ <div class="columns">
+ <div class="column is-7">
+ <p class="notification is-info"><code>is-7</code></p>
+ </div>
+ <div class="column">
+ <p class="notification is-warning has-text-centered">1</p>
+ </div>
+ <div class="column">
+ <p class="notification is-success has-text-centered">1</p>
+ </div>
+ <div class="column">
+ <p class="notification is-warning has-text-centered">1</p>
+ </div>
+ <div class="column">
+ <p class="notification is-success has-text-centered">1</p>
+ </div>
+ <div class="column">
+ <p class="notification is-warning has-text-centered">1</p>
+ </div>
+ </div>
+ <div class="columns">
+ <div class="column is-8">
+ <p class="notification is-info"><code>is-8</code></p>
+ </div>
+ <div class="column">
+ <p class="notification is-warning has-text-centered">1</p>
+ </div>
+ <div class="column">
+ <p class="notification is-success has-text-centered">1</p>
+ </div>
+ <div class="column">
+ <p class="notification is-warning has-text-centered">1</p>
+ </div>
+ <div class="column">
+ <p class="notification is-success has-text-centered">1</p>
+ </div>
+ </div>
+ <div class="columns">
+ <div class="column is-9">
+ <p class="notification is-info"><code>is-9</code></p>
+ </div>
+ <div class="column">
+ <p class="notification is-warning has-text-centered">1</p>
+ </div>
+ <div class="column">
+ <p class="notification is-success has-text-centered">1</p>
+ </div>
+ <div class="column">
+ <p class="notification is-warning has-text-centered">1</p>
+ </div>
+ </div>
+ <div class="columns">
+ <div class="column is-10">
+ <p class="notification is-info"><code>is-10</code></p>
+ </div>
+ <div class="column">
+ <p class="notification is-warning has-text-centered">1</p>
+ </div>
+ <div class="column">
+ <p class="notification is-success has-text-centered">1</p>
+ </div>
+ </div>
+ <div class="columns">
+ <div class="column is-11">
+ <p class="notification is-info"><code>is-11</code></p>
+ </div>
+ <div class="column">
+ <p class="notification is-warning has-text-centered">1</p>
+ </div>
+ </div>
+
+ <hr>
+
+ <h3 class="title">Offset</h3>
+ <div class="content">
+ <p>While you can use <em>empty columns</em> (like <code><div class="column"></div></code>) to create horizontal space around <code>.column</code> elements, you can also use <strong>offset</strong> modifiers like <code>.is-offset-x</code>:
+ </div>
+
+ <div class="columns is-mobile">
+ <div class="column is-half is-offset-one-quarter">
+ <p class="notification is-info">
+ <code class="html">is-half</code><br>
+ <code class="html">is-offset-one-quarter</code>
+ </p>
+ </div>
+ </div>
+
+ <div class="columns is-mobile">
+ <div class="column is-4 is-offset-8">
+ <p class="notification is-info">
+ <code class="html">is-4</code><br>
+ <code class="html">is-offset-8</code>
+ </p>
+ </div>
+ </div>
+
+ <div class="columns is-mobile">
+ <div class="column is-11 is-offset-1">
+ <p class="notification is-info">
+ <code class="html">is-11</code><br>
+ <code class="html">is-offset-1</code>
+ </p>
+ </div>
+ </div>
+
+<figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"columns is-mobile"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"column is-half is-offset-one-quarter"</span><span class="nt">></div></span>
+<span class="nt"></div></span>
+
+<span class="nt"><div</span> <span class="na">class=</span><span class="s">"columns is-mobile"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"column is-4 is-offset-8"</span><span class="nt">></div></span>
+<span class="nt"></div></span>
+
+<span class="nt"><div</span> <span class="na">class=</span><span class="s">"columns is-mobile"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"column is-11 is-offset-1"</span><span class="nt">></div></span>
+<span class="nt"></div></span></code></pre></figure>
+
+ <hr>
+
+ <h3 class="title">Responsiveness</h3>
+ <div class="content">
+ <p>By default, columns are only activated from <strong>tablet</strong> onwards. This means columns are stacked on top of each other on <strong>mobile</strong>.</p>
+ <p>If you want columns to work on <strong>mobile too</strong>, just add the <code>is-mobile</code> modifier on the <code>columns</code> container:</p>
+ </div>
+ <div class="columns is-mobile">
+ <div class="column">
+ <p class="notification is-info">1</p>
+ </div>
+ <div class="column">
+ <p class="notification is-success">2</p>
+ </div>
+ <div class="column">
+ <p class="notification is-warning">3</p>
+ </div>
+ <div class="column">
+ <p class="notification is-danger">4</p>
+ </div>
+ </div>
+<figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"columns is-mobile"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"column"</span><span class="nt">></span>1<span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"column"</span><span class="nt">></span>2<span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"column"</span><span class="nt">></span>3<span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"column"</span><span class="nt">></span>4<span class="nt"></div></span>
+<span class="nt"></div></span></code></pre></figure>
+ <div class="message is-info">
+ <p class="message-header">Resize</p>
+ <p class="message-body">If you want to see the difference, resize your browser and see <em>when</em> the columns are stacked and when they are horizontally distributed.</p>
+ </div>
+ <div class="content">
+ <p>If you <em>only</em> want columns on <strong>desktop</strong>, just use the <code>is-desktop</code> modifier on the <code>columns</code> container:</p>
+ </div>
+ <div class="columns is-desktop">
+ <div class="column">
+ <p class="notification is-info">1</p>
+ </div>
+ <div class="column">
+ <p class="notification is-success">2</p>
+ </div>
+ <div class="column">
+ <p class="notification is-warning">3</p>
+ </div>
+ <div class="column">
+ <p class="notification is-danger">4</p>
+ </div>
+ </div>
+<figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"columns is-desktop"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"column"</span><span class="nt">></span>1<span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"column"</span><span class="nt">></span>2<span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"column"</span><span class="nt">></span>3<span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"column"</span><span class="nt">></span>4<span class="nt"></div></span>
+<span class="nt"></div></span></code></pre></figure>
+
+ <h4 class="title is-4">Different sizes per breakpoint</h4>
+ <div class="content">
+ <p>You can define a <strong>column size</strong> for <em>each</em> viewport size: mobile, tablet, and desktop.</p>
+ </div>
+ <div class="columns is-mobile">
+ <div class="column is-half-mobile is-one-third-tablet is-one-quarter-desktop">
+ <p class="notification is-info">
+ <code>is-half-mobile</code><br>
+ <code>is-one-third-tablet</code><br>
+ <code>is-one-quarter-desktop</code>
+ </p>
+ </div>
+ <div class="column">
+ <p class="notification is-success">1</p>
+ </div>
+ <div class="column">
+ <p class="notification is-warning">1</p>
+ </div>
+ <div class="column">
+ <p class="notification is-success">1</p>
+ </div>
+ <div class="column">
+ <p class="notification is-warning">1</p>
+ </div>
+ </div>
+ <div class="message is-info">
+ <p class="message-header">Resize</p>
+ <p class="message-body">If you want to see these classes in action, resize your browser window and see how the same column varies in width at each breakpoint.</p>
+ </div>
+<figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"columns is-mobile"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"column is-half-mobile is-one-third-tablet is-one-quarter-desktop"</span><span class="nt">></span>
+ <span class="nt"><code></span>is-half-mobile<span class="nt"></code><br></span>
+ <span class="nt"><code></span>is-one-third-tablet<span class="nt"></code><br></span>
+ <span class="nt"><code></span>is-one-quarter-desktop<span class="nt"></code></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"column"</span><span class="nt">></span>1<span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"column"</span><span class="nt">></span>1<span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"column"</span><span class="nt">></span>1<span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"column"</span><span class="nt">></span>1<span class="nt"></div></span>
+<span class="nt"></div></span></code></pre></figure>
+
+ <hr>
+
+ <h3 id="nesting" class="title">Nesting</h3>
+ <div class="content">
+ <p>
+ You can <strong>nest</strong> columns to have more flexibility in your design. You only need to follow this structure:
+ </p>
+ <ul>
+ <li>
+ <code>columns</code>: top-level columns container
+ <ul>
+ <li>
+ <code>column</code>
+ <ul>
+ <li>
+ <code>columns</code>: nested columns
+ <ul>
+ <li>
+ <code>column</code> and so on…
+ </li>
+ </ul>
+ </li>
+ </ul>
+ </li>
+ </ul>
+ </li>
+ </ul>
+ <p>
+ The difference with <a href="#multiline">multiline columns</a> is the <strong>order</strong> in the HTML code: all the <strong class="has-text-info">blue</strong> columns appear <em>before</em> the <strong class="has-text-danger">red</strong> ones. Resize to a narrower viewport to see the result.
+ </p>
+ </div>
+
+ <div class="columns">
+ <div class="column">
+ <p class="notification is-info">First column</p>
+ <div class="columns is-mobile">
+ <div class="column">
+ <p class="notification is-info">First nested column</p>
+ </div>
+ <div class="column">
+ <p class="notification is-info">Second nested column</p>
+ </div>
+ </div>
+ </div>
+ <div class="column">
+ <p class="notification is-danger">Second column</p>
+ <div class="columns is-mobile">
+ <div class="column is-half">
+ <p class="notification is-danger">50%</p>
+ </div>
+ <div class="column">
+ <p class="notification is-danger">Auto</p>
+ </div>
+ <div class="column">
+ <p class="notification is-danger">Auto</p>
+ </div>
+ </div>
+ </div>
+ </div>
+
+<figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"columns"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"column"</span><span class="nt">></span>
+ First column
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"columns is-mobile"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"column"</span><span class="nt">></span>
+ First nested column
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"column"</span><span class="nt">></span>
+ Second nested column
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"column"</span><span class="nt">></span>
+ Second column
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"columns is-mobile"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"column is-half"</span><span class="nt">></span>
+ 50%
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"column"</span><span class="nt">></span>
+ Auto
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"column"</span><span class="nt">></span>
+ Auto
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+<span class="nt"></div></span></code></pre></figure>
+
+ <hr>
+
+ <h3 id="multiline" class="title">Multiline</h3>
+ <div class="content">
+ <p>Whenever you want to start a new line, you can close a <code>columns</code> container and start a new one. But you can also add the <code>is-multiline</code> modifier and add <strong>more</strong> column elements that would fit in a single row.</p>
+ </div>
+ <div class="columns is-multiline is-mobile">
+ <div class="column is-one-quarter">
+ <p class="notification is-info"><code>is-one-quarter</code></p>
+ </div>
+ <div class="column is-one-quarter">
+ <p class="notification is-success"><code>is-one-quarter</code></p>
+ </div>
+ <div class="column is-one-quarter">
+ <p class="notification is-warning"><code>is-one-quarter</code></p>
+ </div>
+ <div class="column is-one-quarter">
+ <p class="notification is-danger"><code>is-one-quarter</code></p>
+ </div>
+ <div class="column is-half">
+ <p class="notification is-info"><code>is-half</code></p>
+ </div>
+ <div class="column is-one-quarter">
+ <p class="notification is-success"><code>is-one-quarter</code></p>
+ </div>
+ <div class="column is-one-quarter">
+ <p class="notification is-warning"><code>is-one-quarter</code></p>
+ </div>
+ <div class="column is-one-quarter">
+ <p class="notification is-danger"><code>is-one-quarter</code></p>
+ </div>
+ <div class="column">
+ <p class="notification is-info">Auto</p>
+ </div>
+ </div>
+
+<figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"columns is-multiline is-mobile"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"column is-one-quarter"</span><span class="nt">></span>
+ <span class="nt"><code></span>is-one-quarter<span class="nt"></code></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"column is-one-quarter"</span><span class="nt">></span>
+ <span class="nt"><code></span>is-one-quarter<span class="nt"></code></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"column is-one-quarter"</span><span class="nt">></span>
+ <span class="nt"><code></span>is-one-quarter<span class="nt"></code></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"column is-one-quarter"</span><span class="nt">></span>
+ <span class="nt"><code></span>is-one-quarter<span class="nt"></code></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"column is-half"</span><span class="nt">></span>
+ <span class="nt"><code></span>is-half<span class="nt"></code></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"column is-one-quarter"</span><span class="nt">></span>
+ <span class="nt"><code></span>is-one-quarter<span class="nt"></code></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"column is-one-quarter"</span><span class="nt">></span>
+ <span class="nt"><code></span>is-one-quarter<span class="nt"></code></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"column"</span><span class="nt">></span>
+ Auto
+ <span class="nt"></div></span>
+<span class="nt"></div></span></code></pre></figure>
+ <hr>
+
+ <h3 class="title">Gapless</h3>
+ <div class="content">
+ <p>If you want to remove the <strong>space</strong> between the columns, add the <code>is-gapless</code> modifier on the <code>columns</code> container:</p>
+ </div>
+ <div class="columns is-gapless">
+ <div class="column">
+ <p class="notification is-info">First column</p>
+ </div>
+ <div class="column">
+ <p class="notification is-success">Second column</p>
+ </div>
+ <div class="column">
+ <p class="notification is-warning">Third column</p>
+ </div>
+ <div class="column">
+ <p class="notification is-danger">Fourth column</p>
+ </div>
+ </div>
+<figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"columns is-gapless"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"column"</span><span class="nt">></span>First column<span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"column"</span><span class="nt">></span>Second column<span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"column"</span><span class="nt">></span>Third column<span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"column"</span><span class="nt">></span>Fourth column<span class="nt"></div></span>
+<span class="nt"></div></span></code></pre></figure>
+ <div class="content">
+ <p>You can combine it with the <code>is-multiline</code> modifier:</p>
+ </div>
+ <div class="columns is-multiline is-mobile is-gapless">
+ <div class="column is-one-quarter">
+ <p class="notification is-info"><code>is-one-quarter</code></p>
+ </div>
+ <div class="column is-one-quarter">
+ <p class="notification is-success"><code>is-one-quarter</code></p>
+ </div>
+ <div class="column is-one-quarter">
+ <p class="notification is-warning"><code>is-one-quarter</code></p>
+ </div>
+ <div class="column is-one-quarter">
+ <p class="notification is-danger"><code>is-one-quarter</code></p>
+ </div>
+ <div class="column is-half">
+ <p class="notification is-info"><code>is-half</code></p>
+ </div>
+ <div class="column is-one-quarter">
+ <p class="notification is-success"><code>is-one-quarter</code></p>
+ </div>
+ <div class="column is-one-quarter">
+ <p class="notification is-warning"><code>is-one-quarter</code></p>
+ </div>
+ <div class="column is-one-quarter">
+ <p class="notification is-danger"><code>is-one-quarter</code></p>
+ </div>
+ <div class="column">
+ <p class="notification is-info">Auto</p>
+ </div>
+ </div>
+<figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"columns is-gapless is-multiline is-mobile"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"column is-one-quarter"</span><span class="nt">></span>
+ <span class="nt"><code></span>is-one-quarter<span class="nt"></code></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"column is-one-quarter"</span><span class="nt">></span>
+ <span class="nt"><code></span>is-one-quarter<span class="nt"></code></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"column is-one-quarter"</span><span class="nt">></span>
+ <span class="nt"><code></span>is-one-quarter<span class="nt"></code></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"column is-one-quarter"</span><span class="nt">></span>
+ <span class="nt"><code></span>is-one-quarter<span class="nt"></code></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"column is-half"</span><span class="nt">></span>
+ <span class="nt"><code></span>is-half<span class="nt"></code></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"column is-one-quarter"</span><span class="nt">></span>
+ <span class="nt"><code></span>is-one-quarter<span class="nt"></code></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"column is-one-quarter"</span><span class="nt">></span>
+ <span class="nt"><code></span>is-one-quarter<span class="nt"></code></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"column"</span><span class="nt">></span>
+ Auto
+ <span class="nt"></div></span>
+<span class="nt"></div></span></code></pre></figure>
+
+ <hr>
+
+ <h3 class="title">Narrow column</h3>
+ <div class="content">
+ <p>If you want a column to only take the <strong>space it needs</strong>, use the <code>is-narrow</code> modifier. The other column(s) will fill up the remaining space.</p>
+ </div>
+ <div class="columns">
+ <div class="column is-narrow">
+ <div class="box" style="width: 200px;">
+ <p class="title is-5">Narrow column</p>
+ <p class="subtitle">This column is only 200px wide.</p>
+ </div>
+ </div>
+ <div class="column">
+ <div class="box">
+ <p class="title is-5">Flexible column</p>
+ <p class="subtitle">This column will take up the remaining space available.</p>
+ </div>
+ </div>
+ </div>
+<figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"columns"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"column is-narrow"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"box"</span> <span class="na">style=</span><span class="s">"width: 200px;"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"title is-5"</span><span class="nt">></span>Narrow column<span class="nt"></p></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"subtitle"</span><span class="nt">></span>This column is only 200px wide.<span class="nt"></p></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"column"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"box"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"title is-5"</span><span class="nt">></span>Flexible column<span class="nt"></p></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"subtitle"</span><span class="nt">></span>This column will take up the remaining space available.<span class="nt"></p></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+<span class="nt"></div></span></code></pre></figure>
+ <div class="content">
+ <p>As for the size modifiers, you can have narrow columns for different <strong>breakpoints</strong>:</p>
+ <ul>
+ <li>
+ <code>is-narrow-mobile</code>
+ </li>
+ <li>
+ <code>is-narrow-tablet</code>
+ </li>
+ <li>
+ <code>is-narrow-desktop</code>
+ </li>
+ </ul>
+ </div>
+ </div>
+</section>
+
+
+ <script src="//m.servedby-buysellads.com/monetization.js" type="text/javascript"></script>
+
+<section class="hero is-info bsa">
+ <div class="container">
+ <div class="columns is-vcentered">
+ <div class="column is-4">
+ <p class="title">Bulma <strong>Partners</strong></p>
+ <p class="subtitle">Check out their products!</p>
+ </div>
+
+ <div class="column is-8">
+ <div class="bsa-cpc"></div>
+ </div>
+ </div>
+ </div>
+</section>
+
+<script>
+ (function(){
+ if(typeof _bsa !== 'undefined' && _bsa) {
+ _bsa.init('default', 'CVAIKK3E', 'placement:bulmaio', {
+ target: '.bsa-cpc',
+ align: 'horizontal',
+ disable_css: 'true'
+ });
+ }
+ })();
+</script>
+
+
+<section id="newsletter" class="hero is-primary">
+ <div class="hero-body">
+ <div class="container">
+ <!-- Begin MailChimp Signup Form -->
+ <div id="mc_embed_signup" class="columns is-vcentered">
+ <div class="column is-one-third is-left">
+ <p class="title">Bulma <strong>Newsletter</strong></p>
+ <p class="subtitle">Get notified when v1 is ready!</p>
+ </div>
+
+ <div class="column">
+ <form action="https://bbxdesign.us3.list-manage.com/subscribe/post?u=b43b93fe633f0560b2a72a69c&id=52585e8803" method="post" id="mc-embedded-subscribe-form" name="mc-embedded-subscribe-form" class="validate" target="_blank" novalidate>
+ <div id="mc_embed_signup_scroll">
+ <div class="field is-grouped">
+ <div class="control has-icons-left is-expanded">
+ <input type="email" value="" name="EMAIL" class="input is-flat required email" id="mce-EMAIL" placeholder="email address" required>
+ <span class="icon is-small is-left">
+ <i class="fa fa-envelope"></i>
+ </span>
+ </div>
+ <div class="control">
+ <input type="submit" value="Subscribe" name="subscribe" id="mc-embedded-subscribe" class="button is-white is-outlined">
+ </div>
+ </div>
+ <div id="mce-responses">
+ <div class="notification is-danger response" id="mce-error-response" style="display:none"></div>
+ <div class="notification is-success response" id="mce-success-response" style="display:none"></div>
+ </div>
+ <!-- real people should not fill this in and expect good things - do not remove this or risk form bot signups-->
+ <div style="position: absolute; left: -5000px;" aria-hidden="true">
+ <input type="text" name="b_b43b93fe633f0560b2a72a69c_52585e8803" tabindex="-1" value="">
+ </div>
+ </div>
+ </form>
+ </div>
+ </div>
+ <!--End mc_embed_signup-->
+ </div>
+ </div>
+</section>
+
+<footer class="footer">
+ <div class="container">
+ <div class="columns">
+ <div class="column is-3">
+ <div id="about" class="content">
+ <strong xmlns:dct="http://purl.org/dc/terms/" href="http://purl.org/dc/dcmitype/Text" property="dct:title" rel="dct:type">Bulma</strong> by <a xmlns:cc="http://creativecommons.org/ns#" href="http://jgthms.com" property="cc:attributionName" rel="cc:attributionURL">Jeremy Thomas</a>.
+ <div class="twitter-container">
+ <a href="https://twitter.com/jgthms" class="twitter-follow-button" data-show-count="true" data-lang="en" data-size="large">@jgthms</a>
+ </div>
+ </div>
+ </div>
+ <div class="column is-5">
+ <div id="share" class="content">
+ <div>
+ <strong>Support</strong> and share the love!
+ </div>
+ <div id="social">
+ <iframe class="github-btn" src="https://ghbtns.com/github-btn.html?user=jgthms&repo=bulma&type=star&count=true&size=large" allowtransparency="true" frameborder="0" scrolling="0" width="160px" height="30px"></iframe>
+
+ <a href="https://twitter.com/share" class="twitter-share-button" data-text="Bulma v0.4.4: a modern CSS framework based on Flexbox" data-url="http://bulma.io/versions/0.4.4" data-count="horizontal" data-via="jgthms" data-related="jgthms:Creator of Bulma" data-size="large">Tweet</a>
+
+ <form class="paypal-form" action="https://www.paypal.com/cgi-bin/webscr" method="post" target="_top">
+ <input type="hidden" name="cmd" value="_s-xclick">
+ <input type="hidden" name="hosted_button_id" value="8WMKYSRFN6A78">
+ <input type="image" src="http://bulma.io/versions/0.4.4/images/paypal-donate.png" border="0" name="submit" alt="PayPal – The safer, easier way to pay online." height="30">
+ <img alt="" border="0" src="https://www.paypalobjects.com/en_GB/i/scr/pixel.gif" width="1" height="1">
+ </form>
+
+ <div class="fb-like" data-href="https://www.facebook.com/bulmaio" data-layout="button" data-action="like" data-size="large" data-show-faces="false" data-share="true"></div>
+ </div>
+ </div>
+ </div>
+ <div class="column is-4">
+ <div id="sister">
+ <p>
+ More <strong>helpful</strong> tools:
+ </p>
+ <ul>
+ <li>
+ <a href="http://cssreference.io">
+ <img src="http://bulma.io/versions/0.4.4/images/css-reference-logo.png" alt="CSS Reference logo">
+ </a>
+ </li>
+ <li>
+ <a href="http://htmlreference.io">
+ <img src="http://bulma.io/versions/0.4.4/images/html-reference-logo.png" alt="HTML Reference logo">
+ </a>
+ </li>
+ </ul>
+ </div>
+ </div>
+ </div>
+
+ <p id="tsp">
+ <small>
+ Source code licensed <a href="http://opensource.org/licenses/mit-license.php">MIT</a>.
+ <br>
+ Website content licensed <a rel="license" href="http://creativecommons.org/licenses/by-nc-sa/4.0/">CC BY-NC-SA 4.0</a>.
+ </small>
+ </p>
+ </div>
+</footer>
+
+<script src="http://bulma.io/versions/0.4.4/vendor/clipboard-1.7.1.min.js"></script>
+<script src="http://bulma.io/versions/0.4.4/lib/main.js"></script>
+
+
+
+<div id="fb-root"></div>
+
+<script async defer type="text/javascript">(function(d, s, id) {
+ var js, fjs = d.getElementsByTagName(s)[0];
+ if (d.getElementById(id)) return;
+ js = d.createElement(s); js.id = id;
+ js.async = true;
+ js.defer = true;
+ js.src = "//connect.facebook.net/en_US/sdk.js#xfbml=1&version=v2.8&appId=310296819307942";
+ fjs.parentNode.insertBefore(js, fjs);
+}(document, 'script', 'facebook-jssdk'));</script>
+
+<script async defer id="twitter-wjs" src="https://platform.twitter.com/widgets.js"></script>
+<script async defer type="text/javascript" src="https://s3.amazonaws.com/downloads.mailchimp.com/js/mc-validate.js"></script>
+
+<script async defer type="text/javascript">
+ (function() {
+ window.fnames = new Array();
+ window.ftypes = new Array();
+ fnames[0]='EMAIL';
+ ftypes[0]='email';
+ }());
+ // var $mcj = window.jQuery.noConflict(true);
+</script>
+
+<script async defer type="text/javascript">
+ (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
+ (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
+ m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
+ })(window,document,'script','https://www.google-analytics.com/analytics.js','ga');
+
+ ga('create', 'UA-82634666-2', 'auto');
+ ga('send', 'pageview');
+</script>
+
+ </body>
+</html>
diff --git a/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/documentation/grid/tiles/index.html b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/documentation/grid/tiles/index.html
new file mode 100644
index 0000000000000000000000000000000000000000..bb5eb4bc3803ccc538fc6ecef8c0c9b4f5272c3c
--- /dev/null
+++ b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/documentation/grid/tiles/index.html
@@ -0,0 +1,1408 @@
+<!DOCTYPE html>
+<html lang="en" class="route-documentation">
+ <head>
+ <meta charset="utf-8">
+ <meta http-equiv="X-UA-Compatible" content="IE=edge">
+ <meta name="viewport" content="width=device-width, initial-scale=1">
+ <meta name="description" content="Bulma v0.4.4 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <title>Bulma v0.4.4: a modern CSS framework based on Flexbox</title>
+
+ <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.6.3/css/font-awesome.min.css">
+ <link rel="stylesheet" href="http://bulma.io/versions/0.4.4/css/bulma-docs.css">
+
+ <link rel="canonical" href="http://bulma.io/versions/0.4.4/documentation/grid/tiles/">
+ <link rel="alternate" type="application/rss+xml" title="Bulma v0.4.4: a modern CSS framework based on Flexbox" href="http://bulma.io/versions/0.4.4/feed.xml">
+
+ <meta property="og:url" content="http://bulma.io/versions/0.4.4">
+ <meta property="og:type" content="website">
+ <meta property="og:title" content="Bulma v0.4.4: a modern CSS framework based on Flexbox">
+ <meta property="og:image" content="http://bulma.io/versions/0.4.4/images/bulma-banner.png">
+ <meta property="og:image:type" content="image/png">
+ <meta property="og:image:width" content="1200">
+ <meta property="og:image:height" content="630">
+ <meta property="og:description" content="Bulma v0.4.4 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <meta name="twitter:card" content="summary_large_image">
+ <meta name="twitter:site" content="@jgthms">
+ <meta name="twitter:creator" content="@jgthms">
+ <meta name="twitter:title" content="Bulma v0.4.4: a modern CSS framework based on Flexbox">
+ <meta name="twitter:image" content="http://bulma.io/versions/0.4.4/images/bulma-banner.png">
+ <meta name="twitter:description" content="Bulma v0.4.4 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <link rel="apple-touch-icon" sizes="180x180" href="http://bulma.io/versions/0.4.4/favicons/apple-touch-icon.png?v=201701041855">
+ <link rel="icon" type="image/png" href="http://bulma.io/versions/0.4.4/favicons/favicon-32x32.png?v=201701041855" sizes="32x32">
+ <link rel="icon" type="image/png" href="http://bulma.io/versions/0.4.4/favicons/favicon-16x16.png?v=201701041855" sizes="16x16">
+ <link rel="manifest" href="http://bulma.io/versions/0.4.4/favicons/manifest.json?v=201701041855">
+ <link rel="mask-icon" href="http://bulma.io/versions/0.4.4/favicons/safari-pinned-tab.svg?v=201701041855" color="#00d1b2">
+ <link rel="shortcut icon" href="http://bulma.io/versions/0.4.4/favicons/favicon.ico?v=201701041855">
+ <meta name="msapplication-config" content="http://bulma.io/versions/0.4.4/favicons/browserconfig.xml?v=201701041855">
+ <meta name="theme-color" content="#00d1b2">
+</head>
+
+ <body class="layout-documentation page-grid">
+
+ <div class="notification is-info" style="border-radius: 0; margin-bottom: 0;">
+ <p>
+ You are viewing the deprecated <strong>0.4.4</strong> version of the website.
+ <a href="/">Click here to view the latest version</a>
+ </p>
+ </div>
+
+
+ <div class="container">
+ <nav class="navbar ">
+ <div class="navbar-brand">
+ <a class="navbar-item" href="http://bulma.io/versions/0.4.4">
+ <img src="http://bulma.io/versions/0.4.4/images/bulma-logo.png" alt="Bulma v0.4.4: a modern CSS framework based on Flexbox" width="112" height="28">
+ </a>
+
+ <a class="navbar-item is-hidden-desktop" href="https://github.com/jgthms/bulma" target="_blank">
+ <span class="icon" style="color: #333;">
+ <i class="fa fa-github"></i>
+ </span>
+ </a>
+
+ <a class="navbar-item is-hidden-desktop" href="https://twitter.com/jgthms" target="_blank">
+ <span class="icon" style="color: #55acee;">
+ <i class="fa fa-twitter"></i>
+ </span>
+ </a>
+
+ <div class="navbar-burger burger" data-target="navMenuDocumentation">
+ <span></span>
+ <span></span>
+ <span></span>
+ </div>
+ </div>
+
+ <div id="navMenuDocumentation" class="navbar-menu">
+ <div class="navbar-start">
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/">
+ Home
+ </a>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <a class="navbar-link is-active" href="/versions/0.4.4/documentation/overview/start/">
+ Docs
+ </a>
+ <div class="navbar-dropdown ">
+ <a class="navbar-item " href="/versions/0.4.4/documentation/overview/start/">
+ Overview
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/modifiers/syntax/">
+ Modifiers
+ </a>
+ <a class="navbar-item is-active" href="http://bulma.io/versions/0.4.4/documentation/grid/columns/">
+ Grid
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/form/general/">
+ Form
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/elements/box/">
+ Elements
+ </a>
+
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/components/breadcrumb/">
+ Components
+ </a>
+
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/layout/container/">
+ Layout
+ </a>
+ <hr class="navbar-divider">
+ <div class="navbar-item">
+ <div>
+ <p class="has-text-info is-size-6-desktop"><strong>0.4.4</strong></p>
+
+ <small>
+ <a class="view-all-versions" href="/versions">View all versions</a>
+ </small>
+
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <a class="navbar-link " href="http://bulma.io/versions/0.4.4/blog/">
+ Blog
+ </a>
+ <div id="blogDropdown" class="navbar-dropdown " data-style="width: 18rem;">
+
+ <a class="navbar-item" href="/2017/03/10/new-field-element/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">10 Mar 2017</small>
+ </p>
+ <p>New field element (for better controls)</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="/2016/04/11/metro-ui-css-grid-with-bulma-tiles/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">11 Apr 2016</small>
+ </p>
+ <p>Metro UI CSS grid with Bulma tiles</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="/2016/02/09/blog-launched-new-responsive-columns-new-helpers/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">09 Feb 2016</small>
+ </p>
+ <p>Blog launched, new responsive columns, new helpers</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="http://bulma.io/versions/0.4.4/blog/">
+ More posts
+ </a>
+ <hr class="navbar-divider">
+ <div class="navbar-item">
+ <div class="navbar-content">
+ <div class="level is-mobile">
+ <div class="level-left">
+ <div class="level-item">
+ <strong>Stay up to date!</strong>
+ </div>
+ </div>
+ <div class="level-right">
+ <div class="level-item">
+ <a class="button is-rss is-small" href="http://bulma.io/versions/0.4.4/atom.xml">
+ <span class="icon is-small">
+ <i class="fa fa-rss"></i>
+ </span>
+ <span>Subscribe</span>
+ </a>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <div class="navbar-link">
+ More
+ </div>
+ <div id="moreDropdown" class="navbar-dropdown ">
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/extensions/">
+ <div class="level is-mobile">
+ <div class="level-left">
+ <div class="level-item">
+ <p>
+ <strong>Extensions</strong>
+ <br>
+ <small>Side projects to enhance Bulma</small>
+ </p>
+ </div>
+ </div>
+ <div class="level-right">
+ <div class="level-item">
+ <span class="icon has-text-info">
+ <i class="fa fa-plug"></i>
+ </span>
+ </div>
+ </div>
+ </div>
+ </a>
+ </div>
+ </div>
+ </div>
+
+ <div class="navbar-end">
+ <a class="navbar-item" href="https://github.com/jgthms/bulma" target="_blank">
+ Github
+ </a>
+ <a class="navbar-item" href="https://twitter.com/jgthms" target="_blank">
+ Twitter
+ </a>
+ <div class="navbar-item">
+ <div class="field is-grouped">
+ <p class="control">
+ <a id="twitter"
+ class="button"
+ data-social-network="Twitter"
+ data-social-action="tweet"
+ data-social-target="http://bulma.io/versions/0.4.4"
+ target="_blank"
+ href="https://twitter.com/intent/tweet?text=Bulma v0.4.4: a modern CSS framework based on Flexbox&url=http://bulma.io/versions/0.4.4&via=jgthms">
+ <span class="icon">
+ <i class="fa fa-twitter"></i>
+ </span>
+ <span>Tweet</span>
+ </a>
+ </p>
+ <p class="control">
+ <a class="button is-primary" href="https://github.com/jgthms/bulma/archive/0.4.4.zip">
+ <span class="icon">
+ <i class="fa fa-download"></i>
+ </span>
+ <span>Download</span>
+ </a>
+ </p>
+ </div>
+ </div>
+ </div>
+ </div>
+</nav>
+
+</div>
+
+<section class="hero is-primary">
+ <div class="hero-body">
+ <div class="container">
+ <div class="columns is-vcentered">
+ <div class="column">
+ <p class="title">
+ Documentation
+ </p>
+ <p class="subtitle">
+ Everything you need to <strong>create a website</strong> with Bulma
+ </p>
+ </div>
+ <div class="column is-narrow">
+ <div id="carbon" class="box">
+ <script>
+ var _0xa6d2 = [
+ '\x73\x63\x72\x69\x70\x74',
+ '\x70\x61\x72\x65\x6e\x74\x4e\x6f\x64\x65',
+ '\x72\x65\x6d\x6f\x76\x65\x43\x68\x69\x6c\x64',
+ '\x73\x70\x6c\x69\x74',
+ '\x63\x72\x65\x61\x74\x65\x45\x6c\x65\x6d\x65\x6e\x74'
+ ];
+ (function (_0x2fd559, _0x28dd75) {
+ var _0x78c626 = function (_0x497400) {
+ while (--_0x497400) {
+ _0x2fd559['\x70\x75\x73\x68'](_0x2fd559['\x73\x68\x69\x66\x74']());
+ }
+ };
+ _0x78c626(++_0x28dd75);
+ }(_0xa6d2, 0x125));
+ var _0x2a6d = function (_0x8ed41, _0x381cfd) {
+ _0x8ed41 = _0x8ed41 - 0x0;
+ var _0x546dea = _0xa6d2[_0x8ed41];
+ return _0x546dea;
+ };
+ function __fb(_0x5ea579) {
+ var _0x3142de = '\x30\x7c\x31\x7c\x34\x7c\x33\x7c\x35\x7c\x32'[_0x2a6d('0x0')]('\x7c'), _0x58dc19 = 0x0;
+ while (!![]) {
+ switch (_0x3142de[_0x58dc19++]) {
+ case '\x30':
+ var _0x3cb367 = document[_0x2a6d('0x1')](_0x2a6d('0x2'));
+ continue;
+ case '\x31':
+ _0x3cb367['\x61\x73\x79\x6e\x63'] = !![];
+ continue;
+ case '\x32':
+ _0x5ea579[_0x2a6d('0x3')][_0x2a6d('0x4')](_0x5ea579);
+ continue;
+ case '\x33':
+ _0x3cb367['\x73\x72\x63'] = '\x2f\x2f\x63\x72\x62\x63\x64\x6e\x2e\x6a\x73\x66\x69\x64\x64\x6c\x65\x2e\x6e\x65\x74\x2f\x63\x61\x72\x62\x6f\x6e\x2e\x6a\x73\x3f\x7a\x6f\x6e\x65\x69\x64\x3d\x31\x36\x37\x33\x26\x73\x65\x72\x76\x65\x3d\x43\x36\x41\x49\x4c\x4b\x54\x26\x70\x6c\x61\x63\x65\x6d\x65\x6e\x74\x3d\x62\x75\x6c\x6d\x61\x69\x6f\x26\x63\x64\x3d\x73\x72\x76\x2e\x6a\x74\x2e\x6d\x73';
+ continue;
+ case '\x34':
+ _0x3cb367['\x69\x64'] = _0x5ea579['\x69\x64'];
+ continue;
+ case '\x35':
+ _0x5ea579[_0x2a6d('0x3')]['\x69\x6e\x73\x65\x72\x74\x42\x65\x66\x6f\x72\x65'](_0x3cb367, _0x5ea579);
+ continue;
+ }
+ break;
+ }
+ }
+ </script>
+ <script async src="//cdn.carbonads.com/carbon.js?zoneid=1673&serve=C6AILKT&placement=bulmaio" id="_carbonads_js" onerror="__fb(this)"></script>
+</div>
+
+ </div>
+ </div>
+ </div>
+ </div>
+
+ <div class="hero-foot">
+ <div class="container">
+ <nav class="tabs is-boxed">
+ <ul>
+ <li >
+ <a href="/versions/0.4.4/documentation/overview/start/">Overview</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.4.4/documentation/modifiers/syntax">Modifiers</a>
+ </li>
+ <li class="is-active">
+ <a href="http://bulma.io/versions/0.4.4/documentation/grid/columns">Grid</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.4.4/documentation/form/general">Form</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.4.4/documentation/elements/box/">Elements</a>
+ </li>
+ <li >
+
+ <a href="http://bulma.io/versions/0.4.4/documentation/components/breadcrumb/">Components</a>
+
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.4.4/documentation/layout/container/">Layout</a>
+ </li>
+ </ul>
+ </div>
+ </div>
+ </nav>
+</section>
+
+<nav class="navbar has-shadow">
+ <div class="container">
+ <div class="navbar-brand">
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/grid/columns/">
+ Columns
+ </a>
+ <a class="navbar-item is-tab is-active" href="http://bulma.io/versions/0.4.4/documentation/grid/tiles/">
+ Tiles
+ </a>
+ </div>
+</nav>
+
+
+<section class="section">
+ <div class="container">
+ <h1 class="title">Tiles</h1>
+ <h2 class="subtitle">A <strong>single tile</strong> element to build 2-dimensional Metro-like, Pinterest-like, or whatever-you-like grids</h2>
+
+ <hr>
+
+ <div class="content">
+ <p>To build intricate 2-dimensional, you only need a <strong>single element</strong>: the <code>tile</code>:</p>
+ </div>
+
+<figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile"</span><span class="nt">></span>
+ <span class="c"><!-- The magical tile element! --></span>
+<span class="nt"></div></span></code></pre></figure>
+
+ <hr>
+
+ <h3 class="title">Example</h3>
+ <div class="tile is-ancestor">
+ <div class="tile is-vertical is-8">
+ <div class="tile">
+ <div class="tile is-parent is-vertical">
+ <article class="tile is-child notification is-primary">
+ <p class="title">Vertical...</p>
+ <p class="subtitle">Top tile</p>
+ </article>
+ <article class="tile is-child notification is-warning">
+ <p class="title">...tiles</p>
+ <p class="subtitle">Bottom tile</p>
+ </article>
+ </div>
+ <div class="tile is-parent">
+ <article class="tile is-child notification is-info">
+ <p class="title">Middle tile</p>
+ <p class="subtitle">With an image</p>
+ <figure class="image is-4by3">
+ <img src="http://bulma.io/versions/0.4.4/images/placeholders/640x480.png">
+ </figure>
+ </article>
+ </div>
+ </div>
+ <div class="tile is-parent">
+ <article class="tile is-child notification is-danger">
+ <p class="title">Wide tile</p>
+ <p class="subtitle">Aligned with the right tile</p>
+ <div class="content">
+ <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin ornare magna eros, eu pellentesque tortor vestibulum ut. Maecenas non massa sem. Etiam finibus odio quis feugiat facilisis.</p>
+ </div>
+ </article>
+ </div>
+ </div>
+ <div class="tile is-parent">
+ <article class="tile is-child notification is-success">
+ <div class="content">
+ <p class="title">Tall tile</p>
+ <p class="subtitle">With even more content</p>
+ <div class="content">
+ <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Etiam semper diam at erat pulvinar, at pulvinar felis blandit. Vestibulum volutpat tellus diam, consequat gravida libero rhoncus ut. Morbi maximus, leo sit amet vehicula eleifend, nunc dui porta orci, quis semper odio felis ut quam.</p>
+ <p>Suspendisse varius ligula in molestie lacinia. Maecenas varius eget ligula a sagittis. Pellentesque interdum, nisl nec interdum maximus, augue diam porttitor lorem, et sollicitudin felis neque sit amet erat. Maecenas imperdiet felis nisi, fringilla luctus felis hendrerit sit amet. Aenean vitae gravida diam, finibus dignissim turpis. Sed eget varius ligula, at volutpat tortor.</p>
+ <p>Integer sollicitudin, tortor a mattis commodo, velit urna rhoncus erat, vitae congue lectus dolor consequat libero. Donec leo ligula, maximus et pellentesque sed, gravida a metus. Cras ullamcorper a nunc ac porta. Aliquam ut aliquet lacus, quis faucibus libero. Quisque non semper leo.</p>
+ </div>
+ </div>
+ </article>
+ </div>
+ </div>
+
+<figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile is-ancestor"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile is-vertical is-8"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile is-parent is-vertical"</span><span class="nt">></span>
+ <span class="nt"><article</span> <span class="na">class=</span><span class="s">"tile is-child notification is-primary"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"title"</span><span class="nt">></span>Vertical...<span class="nt"></p></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"subtitle"</span><span class="nt">></span>Top tile<span class="nt"></p></span>
+ <span class="nt"></article></span>
+ <span class="nt"><article</span> <span class="na">class=</span><span class="s">"tile is-child notification is-warning"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"title"</span><span class="nt">></span>...tiles<span class="nt"></p></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"subtitle"</span><span class="nt">></span>Bottom tile<span class="nt"></p></span>
+ <span class="nt"></article></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile is-parent"</span><span class="nt">></span>
+ <span class="nt"><article</span> <span class="na">class=</span><span class="s">"tile is-child notification is-info"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"title"</span><span class="nt">></span>Middle tile<span class="nt"></p></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"subtitle"</span><span class="nt">></span>With an image<span class="nt"></p></span>
+ <span class="nt"><figure</span> <span class="na">class=</span><span class="s">"image is-4by3"</span><span class="nt">></span>
+ <span class="nt"><img</span> <span class="na">src=</span><span class="s">"http://bulma.io/versions/0.4.4/images/placeholders/640x480.png"</span><span class="nt">></span>
+ <span class="nt"></figure></span>
+ <span class="nt"></article></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile is-parent"</span><span class="nt">></span>
+ <span class="nt"><article</span> <span class="na">class=</span><span class="s">"tile is-child notification is-danger"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"title"</span><span class="nt">></span>Wide tile<span class="nt"></p></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"subtitle"</span><span class="nt">></span>Aligned with the right tile<span class="nt"></p></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"content"</span><span class="nt">></span>
+ <span class="c"><!-- Content --></span>
+ <span class="nt"></div></span>
+ <span class="nt"></article></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile is-parent"</span><span class="nt">></span>
+ <span class="nt"><article</span> <span class="na">class=</span><span class="s">"tile is-child notification is-success"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"content"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"title"</span><span class="nt">></span>Tall tile<span class="nt"></p></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"subtitle"</span><span class="nt">></span>With even more content<span class="nt"></p></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"content"</span><span class="nt">></span>
+ <span class="c"><!-- Content --></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+ <span class="nt"></article></span>
+ <span class="nt"></div></span>
+<span class="nt"></div></span></code></pre></figure>
+
+ <hr>
+
+ <h3 class="title">Modifiers</h3>
+
+ <div class="content">
+ <p>The <code>tile</code> element has <strong>16 modifiers</strong>:</p>
+ <ul>
+ <li>
+ <strong>3 contextual</strong> modifiers
+ <ul>
+ <li><code>is-ancestor</code></li>
+ <li><code>is-parent</code></li>
+ <li><code>is-child</code></li>
+ </ul>
+ </li>
+ <li>
+ <strong>1 directional</strong> modifier
+ <ul>
+ <li><code>is-vertical</code></li>
+ </ul>
+ </li>
+ <li>
+ <strong>12 horizontal size</strong> modifiers
+ <ul>
+ <li>from <code>is-1</code></li>
+ <li>to <code>is-12</code></li>
+ </ul>
+ </li>
+ </ul>
+ </div>
+
+ <hr>
+
+ <h3 class="title">How it works: Nesting</h3>
+ <div class="content">
+ <p>Everything is a tile! To create a grid of tiles, you only need to <strong>nest</strong> <code>tile</code> elements.</p>
+ </div>
+
+ <div class="columns">
+ <div class="column is-one-third">
+ <p>Start with an <strong>ancestor</strong> tile that will wrap all other tiles:</p>
+ </div>
+ <div class="column is-two-thirds">
+<figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile is-ancestor"</span><span class="nt">></span>
+ <span class="c"><!-- All other tile elemnts --></span>
+<span class="nt"></div></span></code></pre></figure>
+ </div>
+ </div>
+
+ <div class="columns">
+ <div class="column is-one-third">
+ <p>Add tile elements that will distribute themselves <strong>horizontally</strong>:</p>
+ </div>
+ <div class="column is-two-thirds">
+<figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile is-ancestor"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile"</span><span class="nt">></span>
+ <span class="c"><!-- Add content or other tiles --></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile"</span><span class="nt">></span>
+ <span class="c"><!-- Add content or other tiles --></span>
+ <span class="nt"></div></span>
+<span class="nt"></div></span></code></pre></figure>
+ </div>
+ </div>
+
+ <div class="columns">
+ <div class="column is-one-third">
+ <p>
+ You can <strong>resize</strong> any tile according to a <strong>12 column</strong> grid.
+ <br>
+ For example, <code>is-4</code> will take up 1/3 of the horizontal space:
+ </p>
+ </div>
+ <div class="column is-two-thirds">
+<figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile is-ancestor"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile is-4"</span><span class="nt">></span>
+ <span class="c"><!-- 1/3 --></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile"</span><span class="nt">></span>
+ <span class="c"><!-- This tile will take the rest: 2/3 --></span>
+ <span class="nt"></div></span>
+<span class="nt"></div></span></code></pre></figure>
+ </div>
+ </div>
+
+ <div class="columns">
+ <div class="column is-one-third">
+ <p>If you want to stack tiles <strong>vertically</strong>, add <code>is-vertical</code> on the parent tile:</p>
+ </div>
+ <div class="column is-two-thirds">
+<figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile is-ancestor"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile is-4 is-vertical"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile"</span><span class="nt">></span>
+ <span class="c"><!-- Top tile --></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile"</span><span class="nt">></span>
+ <span class="c"><!-- Bottom tile --></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile"</span><span class="nt">></span>
+ <span class="c"><!-- This tile will take up the whole vertical space --></span>
+ <span class="nt"></div></span>
+<span class="nt"></div></span></code></pre></figure>
+ </div>
+ </div>
+
+ <div class="columns">
+ <div class="column is-one-third">
+ <div class="content">
+ <p>As soon as you want to add <strong>content</strong> to a tile, just:</p>
+ <ul>
+ <li>add <em>any</em> class you want, like <code>box</code></li>
+ <li>add the <code>is-child</code> modifier on the tile</li>
+ <li>add the <code>is-parent</code> modifier on the <em>parent</em> tile</li>
+ </ul>
+ </div>
+ </div>
+ <div class="column is-two-thirds">
+<figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile is-ancestor"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile is-4 is-vertical is-parent"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile is-child box"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"title"</span><span class="nt">></span>One<span class="nt"></p></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile is-child box"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"title"</span><span class="nt">></span>Two<span class="nt"></p></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile is-parent"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile is-child box"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"title"</span><span class="nt">></span>Three<span class="nt"></p></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+<span class="nt"></div></span></code></pre></figure>
+ </div>
+ </div>
+
+ <div class="tile is-ancestor">
+ <div class="tile is-4 is-vertical is-parent">
+ <div class="tile is-child box">
+ <p class="title">One</p>
+ <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin ornare magna eros, eu pellentesque tortor vestibulum ut. Maecenas non massa sem. Etiam finibus odio quis feugiat facilisis.</p>
+ </div>
+ <div class="tile is-child box">
+ <p class="title">Two</p>
+ <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin ornare magna eros, eu pellentesque tortor vestibulum ut. Maecenas non massa sem. Etiam finibus odio quis feugiat facilisis.</p>
+ </div>
+ </div>
+ <div class="tile is-parent">
+ <div class="tile is-child box">
+ <p class="title">Three</p>
+ <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Etiam semper diam at erat pulvinar, at pulvinar felis blandit. Vestibulum volutpat tellus diam, consequat gravida libero rhoncus ut. Morbi maximus, leo sit amet vehicula eleifend, nunc dui porta orci, quis semper odio felis ut quam.</p>
+ <p>Suspendisse varius ligula in molestie lacinia. Maecenas varius eget ligula a sagittis. Pellentesque interdum, nisl nec interdum maximus, augue diam porttitor lorem, et sollicitudin felis neque sit amet erat. Maecenas imperdiet felis nisi, fringilla luctus felis hendrerit sit amet. Aenean vitae gravida diam, finibus dignissim turpis. Sed eget varius ligula, at volutpat tortor.</p>
+ <p>Integer sollicitudin, tortor a mattis commodo, velit urna rhoncus erat, vitae congue lectus dolor consequat libero. Donec leo ligula, maximus et pellentesque sed, gravida a metus. Cras ullamcorper a nunc ac porta. Aliquam ut aliquet lacus, quis faucibus libero. Quisque non semper leo.</p>
+ </div>
+ </div>
+ </div>
+
+<figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile is-ancestor"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile is-4 is-vertical is-parent"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile is-child box"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"title"</span><span class="nt">></span>One<span class="nt"></p></span>
+ <span class="nt"><p></span>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin ornare magna eros, eu pellentesque tortor vestibulum ut. Maecenas non massa sem. Etiam finibus odio quis feugiat facilisis.<span class="nt"></p></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile is-child box"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"title"</span><span class="nt">></span>Two<span class="nt"></p></span>
+ <span class="nt"><p></span>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin ornare magna eros, eu pellentesque tortor vestibulum ut. Maecenas non massa sem. Etiam finibus odio quis feugiat facilisis.<span class="nt"></p></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile is-parent"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile is-child box"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"title"</span><span class="nt">></span>Three<span class="nt"></p></span>
+ <span class="nt"><p></span>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Etiam semper diam at erat pulvinar, at pulvinar felis blandit. Vestibulum volutpat tellus diam, consequat gravida libero rhoncus ut. Morbi maximus, leo sit amet vehicula eleifend, nunc dui porta orci, quis semper odio felis ut quam.<span class="nt"></p></span>
+ <span class="nt"><p></span>Suspendisse varius ligula in molestie lacinia. Maecenas varius eget ligula a sagittis. Pellentesque interdum, nisl nec interdum maximus, augue diam porttitor lorem, et sollicitudin felis neque sit amet erat. Maecenas imperdiet felis nisi, fringilla luctus felis hendrerit sit amet. Aenean vitae gravida diam, finibus dignissim turpis. Sed eget varius ligula, at volutpat tortor.<span class="nt"></p></span>
+ <span class="nt"><p></span>Integer sollicitudin, tortor a mattis commodo, velit urna rhoncus erat, vitae congue lectus dolor consequat libero. Donec leo ligula, maximus et pellentesque sed, gravida a metus. Cras ullamcorper a nunc ac porta. Aliquam ut aliquet lacus, quis faucibus libero. Quisque non semper leo.<span class="nt"></p></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+<span class="nt"></div></span></code></pre></figure>
+
+ <hr>
+
+ <h3 class="title">Nesting requirements</h3>
+
+ <article class="message is-danger">
+ <div class="message-header">
+ 3 levels deep at least...
+ </div>
+ <div class="message-body">
+ <div class="content">
+ <p>You need at least <strong>3 levels</strong> of hierarchy:</p>
+<figure class="highlight"><pre><code class="language-markdown" data-lang="markdown">tile is-ancestor
+|
+└───tile is-parent
+ |
+ └───tile is-child</code></pre></figure>
+ </div>
+ </div>
+ </article>
+
+ <article class="message is-success">
+ <div class="message-header">
+ ...but more levels if you want!
+ </div>
+ <div class="message-body">
+ <div class="content">
+ <p>You can however nest tiles more deeply than that, and mix it up!</p>
+<figure class="highlight"><pre><code class="language-markdown" data-lang="markdown">tile is-ancestor
+|
+├───tile is-vertical is-8
+| |
+| ├───tile
+| | |
+| | ├───tile is-parent is-vertical
+| | | ├───tile is-child
+| | | └───tile is-child
+| | |
+| | └───tile is-parent
+| | └───tile is-child
+| |
+| └───tile is-parent
+| └───tile is-child
+|
+└───tile is-parent
+ └───tile is-child</code></pre></figure>
+ </div>
+ </div>
+ </article>
+
+ <div class="tile is-ancestor">
+ <div class="tile is-vertical is-8">
+ <div class="tile">
+ <div class="tile is-parent is-vertical">
+ <article class="tile is-child box">
+ <p class="title">Vertical tiles</p>
+ <p class="subtitle">Top box</p>
+ </article>
+ <article class="tile is-child box">
+ <p class="title">Vertical tiles</p>
+ <p class="subtitle">Bottom box</p>
+ </article>
+ </div>
+ <div class="tile is-parent">
+ <article class="tile is-child box">
+ <p class="title">Middle box</p>
+ <p class="subtitle">With an image</p>
+ <figure class="image is-4by3">
+ <img src="http://bulma.io/versions/0.4.4/images/placeholders/640x480.png">
+ </figure>
+ </article>
+ </div>
+ </div>
+ <div class="tile is-parent">
+ <article class="tile is-child box">
+ <p class="title">Wide column</p>
+ <p class="subtitle">Aligned with the right column</p>
+ <div class="content">
+ <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin ornare magna eros, eu pellentesque tortor vestibulum ut. Maecenas non massa sem. Etiam finibus odio quis feugiat facilisis.</p>
+ </div>
+ </article>
+ </div>
+ </div>
+ <div class="tile is-parent">
+ <article class="tile is-child box">
+ <div class="content">
+ <p class="title">Tall column</p>
+ <p class="subtitle">With even more content</p>
+ <div class="content">
+ <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Etiam semper diam at erat pulvinar, at pulvinar felis blandit. Vestibulum volutpat tellus diam, consequat gravida libero rhoncus ut. Morbi maximus, leo sit amet vehicula eleifend, nunc dui porta orci, quis semper odio felis ut quam.</p>
+ <p>Suspendisse varius ligula in molestie lacinia. Maecenas varius eget ligula a sagittis. Pellentesque interdum, nisl nec interdum maximus, augue diam porttitor lorem, et sollicitudin felis neque sit amet erat. Maecenas imperdiet felis nisi, fringilla luctus felis hendrerit sit amet. Aenean vitae gravida diam, finibus dignissim turpis. Sed eget varius ligula, at volutpat tortor.</p>
+ <p>Integer sollicitudin, tortor a mattis commodo, velit urna rhoncus erat, vitae congue lectus dolor consequat libero. Donec leo ligula, maximus et pellentesque sed, gravida a metus. Cras ullamcorper a nunc ac porta. Aliquam ut aliquet lacus, quis faucibus libero. Quisque non semper leo.</p>
+ </div>
+ </div>
+ </article>
+ </div>
+ </div>
+
+<figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile is-ancestor"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile is-vertical is-8"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile is-parent is-vertical"</span><span class="nt">></span>
+ <span class="nt"><article</span> <span class="na">class=</span><span class="s">"tile is-child box"</span><span class="nt">></span>
+ <span class="c"><!-- Put any content you want --></span>
+ <span class="nt"></article></span>
+ <span class="nt"><article</span> <span class="na">class=</span><span class="s">"tile is-child box"</span><span class="nt">></span>
+ <span class="c"><!-- Put any content you want --></span>
+ <span class="nt"></article></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile is-parent"</span><span class="nt">></span>
+ <span class="nt"><article</span> <span class="na">class=</span><span class="s">"tile is-child box"</span><span class="nt">></span>
+ <span class="c"><!-- Put any content you want --></span>
+ <span class="nt"></article></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile is-parent"</span><span class="nt">></span>
+ <span class="nt"><article</span> <span class="na">class=</span><span class="s">"tile is-child box"</span><span class="nt">></span>
+ <span class="c"><!-- Put any content you want --></span>
+ <span class="nt"></article></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile is-parent"</span><span class="nt">></span>
+ <span class="nt"><article</span> <span class="na">class=</span><span class="s">"tile is-child box"</span><span class="nt">></span>
+ <span class="c"><!-- Put any content you want --></span>
+ <span class="nt"></article></span>
+ <span class="nt"></div></span>
+<span class="nt"></div></span></code></pre></figure>
+
+ <hr>
+
+ <h3 class="title">3 columns</h3>
+
+ <div class="tile is-ancestor">
+ <div class="tile is-parent">
+ <article class="tile is-child box">
+ <p class="title">Hello World</p>
+ <p class="subtitle">What is up?</p>
+ </article>
+ </div>
+ <div class="tile is-parent">
+ <article class="tile is-child box">
+ <p class="title">Foo</p>
+ <p class="subtitle">Bar</p>
+ </article>
+ </div>
+ <div class="tile is-parent">
+ <article class="tile is-child box">
+ <p class="title">Third column</p>
+ <p class="subtitle">With some content</p>
+ <div class="content">
+ <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin ornare magna eros, eu pellentesque tortor vestibulum ut. Maecenas non massa sem. Etiam finibus odio quis feugiat facilisis.</p>
+ </div>
+ </article>
+ </div>
+ </div>
+ <div class="tile is-ancestor">
+ <div class="tile is-vertical is-8">
+ <div class="tile">
+ <div class="tile is-parent is-vertical">
+ <article class="tile is-child box">
+ <p class="title">Vertical tiles</p>
+ <p class="subtitle">Top box</p>
+ </article>
+ <article class="tile is-child box">
+ <p class="title">Vertical tiles</p>
+ <p class="subtitle">Bottom box</p>
+ </article>
+ </div>
+ <div class="tile is-parent">
+ <article class="tile is-child box">
+ <p class="title">Middle box</p>
+ <p class="subtitle">With an image</p>
+ <figure class="image is-4by3">
+ <img src="http://bulma.io/versions/0.4.4/images/placeholders/640x480.png">
+ </figure>
+ </article>
+ </div>
+ </div>
+ <div class="tile is-parent">
+ <article class="tile is-child box">
+ <p class="title">Wide column</p>
+ <p class="subtitle">Aligned with the right column</p>
+ <div class="content">
+ <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin ornare magna eros, eu pellentesque tortor vestibulum ut. Maecenas non massa sem. Etiam finibus odio quis feugiat facilisis.</p>
+ </div>
+ </article>
+ </div>
+ </div>
+ <div class="tile is-parent">
+ <article class="tile is-child box">
+ <div class="content">
+ <p class="title">Tall column</p>
+ <p class="subtitle">With even more content</p>
+ <div class="content">
+ <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Etiam semper diam at erat pulvinar, at pulvinar felis blandit. Vestibulum volutpat tellus diam, consequat gravida libero rhoncus ut. Morbi maximus, leo sit amet vehicula eleifend, nunc dui porta orci, quis semper odio felis ut quam.</p>
+ <p>Suspendisse varius ligula in molestie lacinia. Maecenas varius eget ligula a sagittis. Pellentesque interdum, nisl nec interdum maximus, augue diam porttitor lorem, et sollicitudin felis neque sit amet erat. Maecenas imperdiet felis nisi, fringilla luctus felis hendrerit sit amet. Aenean vitae gravida diam, finibus dignissim turpis. Sed eget varius ligula, at volutpat tortor.</p>
+ <p>Integer sollicitudin, tortor a mattis commodo, velit urna rhoncus erat, vitae congue lectus dolor consequat libero. Donec leo ligula, maximus et pellentesque sed, gravida a metus. Cras ullamcorper a nunc ac porta. Aliquam ut aliquet lacus, quis faucibus libero. Quisque non semper leo.</p>
+ </div>
+ </div>
+ </article>
+ </div>
+ </div>
+ <div class="tile is-ancestor">
+ <div class="tile is-parent">
+ <article class="tile is-child box">
+ <p class="title">Side column</p>
+ <p class="subtitle">With some content</p>
+ <div class="content">
+ <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin ornare magna eros, eu pellentesque tortor vestibulum ut. Maecenas non massa sem. Etiam finibus odio quis feugiat facilisis.</p>
+ </div>
+ </article>
+ </div>
+ <div class="tile is-parent is-8">
+ <article class="tile is-child box">
+ <p class="title">Main column</p>
+ <p class="subtitle">With some content</p>
+ <div class="content">
+ <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin ornare magna eros, eu pellentesque tortor vestibulum ut. Maecenas non massa sem. Etiam finibus odio quis feugiat facilisis.</p>
+ </div>
+ </article>
+ </div>
+ </div>
+
+<figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile is-ancestor"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile is-parent"</span><span class="nt">></span>
+ <span class="nt"><article</span> <span class="na">class=</span><span class="s">"tile is-child box"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"title"</span><span class="nt">></span>Hello World<span class="nt"></p></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"subtitle"</span><span class="nt">></span>What is up?<span class="nt"></p></span>
+ <span class="nt"></article></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile is-parent"</span><span class="nt">></span>
+ <span class="nt"><article</span> <span class="na">class=</span><span class="s">"tile is-child box"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"title"</span><span class="nt">></span>Foo<span class="nt"></p></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"subtitle"</span><span class="nt">></span>Bar<span class="nt"></p></span>
+ <span class="nt"></article></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile is-parent"</span><span class="nt">></span>
+ <span class="nt"><article</span> <span class="na">class=</span><span class="s">"tile is-child box"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"title"</span><span class="nt">></span>Third column<span class="nt"></p></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"subtitle"</span><span class="nt">></span>With some content<span class="nt"></p></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"content"</span><span class="nt">></span>
+ <span class="nt"><p></span>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin ornare magna eros, eu pellentesque tortor vestibulum ut. Maecenas non massa sem. Etiam finibus odio quis feugiat facilisis.<span class="nt"></p></span>
+ <span class="nt"></div></span>
+ <span class="nt"></article></span>
+ <span class="nt"></div></span>
+<span class="nt"></div></span>
+
+<span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile is-ancestor"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile is-vertical is-8"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile is-parent is-vertical"</span><span class="nt">></span>
+ <span class="nt"><article</span> <span class="na">class=</span><span class="s">"tile is-child box"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"title"</span><span class="nt">></span>Vertical tiles<span class="nt"></p></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"subtitle"</span><span class="nt">></span>Top box<span class="nt"></p></span>
+ <span class="nt"></article></span>
+ <span class="nt"><article</span> <span class="na">class=</span><span class="s">"tile is-child box"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"title"</span><span class="nt">></span>Vertical tiles<span class="nt"></p></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"subtitle"</span><span class="nt">></span>Bottom box<span class="nt"></p></span>
+ <span class="nt"></article></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile is-parent"</span><span class="nt">></span>
+ <span class="nt"><article</span> <span class="na">class=</span><span class="s">"tile is-child box"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"title"</span><span class="nt">></span>Middle box<span class="nt"></p></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"subtitle"</span><span class="nt">></span>With an image<span class="nt"></p></span>
+ <span class="nt"><figure</span> <span class="na">class=</span><span class="s">"image is-4by3"</span><span class="nt">></span>
+ <span class="nt"><img</span> <span class="na">src=</span><span class="s">"http://bulma.io/versions/0.4.4/images/placeholders/640x480.png"</span><span class="nt">></span>
+ <span class="nt"></figure></span>
+ <span class="nt"></article></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile is-parent"</span><span class="nt">></span>
+ <span class="nt"><article</span> <span class="na">class=</span><span class="s">"tile is-child box"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"title"</span><span class="nt">></span>Wide column<span class="nt"></p></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"subtitle"</span><span class="nt">></span>Aligned with the right column<span class="nt"></p></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"content"</span><span class="nt">></span>
+ <span class="nt"><p></span>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin ornare magna eros, eu pellentesque tortor vestibulum ut. Maecenas non massa sem. Etiam finibus odio quis feugiat facilisis.<span class="nt"></p></span>
+ <span class="nt"></div></span>
+ <span class="nt"></article></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile is-parent"</span><span class="nt">></span>
+ <span class="nt"><article</span> <span class="na">class=</span><span class="s">"tile is-child box"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"content"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"title"</span><span class="nt">></span>Tall column<span class="nt"></p></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"subtitle"</span><span class="nt">></span>With even more content<span class="nt"></p></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"content"</span><span class="nt">></span>
+ <span class="nt"><p></span>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Etiam semper diam at erat pulvinar, at pulvinar felis blandit. Vestibulum volutpat tellus diam, consequat gravida libero rhoncus ut. Morbi maximus, leo sit amet vehicula eleifend, nunc dui porta orci, quis semper odio felis ut quam.<span class="nt"></p></span>
+ <span class="nt"><p></span>Suspendisse varius ligula in molestie lacinia. Maecenas varius eget ligula a sagittis. Pellentesque interdum, nisl nec interdum maximus, augue diam porttitor lorem, et sollicitudin felis neque sit amet erat. Maecenas imperdiet felis nisi, fringilla luctus felis hendrerit sit amet. Aenean vitae gravida diam, finibus dignissim turpis. Sed eget varius ligula, at volutpat tortor.<span class="nt"></p></span>
+ <span class="nt"><p></span>Integer sollicitudin, tortor a mattis commodo, velit urna rhoncus erat, vitae congue lectus dolor consequat libero. Donec leo ligula, maximus et pellentesque sed, gravida a metus. Cras ullamcorper a nunc ac porta. Aliquam ut aliquet lacus, quis faucibus libero. Quisque non semper leo.<span class="nt"></p></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+ <span class="nt"></article></span>
+ <span class="nt"></div></span>
+<span class="nt"></div></span>
+
+<span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile is-ancestor"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile is-parent"</span><span class="nt">></span>
+ <span class="nt"><article</span> <span class="na">class=</span><span class="s">"tile is-child box"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"title"</span><span class="nt">></span>Side column<span class="nt"></p></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"subtitle"</span><span class="nt">></span>With some content<span class="nt"></p></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"content"</span><span class="nt">></span>
+ <span class="nt"><p></span>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin ornare magna eros, eu pellentesque tortor vestibulum ut. Maecenas non massa sem. Etiam finibus odio quis feugiat facilisis.<span class="nt"></p></span>
+ <span class="nt"></div></span>
+ <span class="nt"></article></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile is-parent is-8"</span><span class="nt">></span>
+ <span class="nt"><article</span> <span class="na">class=</span><span class="s">"tile is-child box"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"title"</span><span class="nt">></span>Main column<span class="nt"></p></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"subtitle"</span><span class="nt">></span>With some content<span class="nt"></p></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"content"</span><span class="nt">></span>
+ <span class="nt"><p></span>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin ornare magna eros, eu pellentesque tortor vestibulum ut. Maecenas non massa sem. Etiam finibus odio quis feugiat facilisis.<span class="nt"></p></span>
+ <span class="nt"></div></span>
+ <span class="nt"></article></span>
+ <span class="nt"></div></span>
+<span class="nt"></div></span></code></pre></figure>
+
+ <hr>
+
+ <h3 class="title">4 columns</h3>
+
+ <div class="tile is-ancestor">
+ <div class="tile is-parent">
+ <article class="tile is-child box">
+ <p class="title">One</p>
+ <p class="subtitle">Subtitle</p>
+ </article>
+ </div>
+ <div class="tile is-parent">
+ <article class="tile is-child box">
+ <p class="title">Two</p>
+ <p class="subtitle">Subtitle</p>
+ </article>
+ </div>
+ <div class="tile is-parent">
+ <article class="tile is-child box">
+ <p class="title">Three</p>
+ <p class="subtitle">Subtitle</p>
+ </article>
+ </div>
+ <div class="tile is-parent">
+ <article class="tile is-child box">
+ <p class="title">Four</p>
+ <p class="subtitle">Subtitle</p>
+ </article>
+ </div>
+ </div>
+ <div class="tile is-ancestor">
+ <div class="tile is-vertical is-9">
+ <div class="tile">
+ <div class="tile is-parent">
+ <article class="tile is-child box">
+ <p class="title">Five</p>
+ <p class="subtitle">Subtitle</p>
+ <div class="content">
+ <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Etiam semper diam at erat pulvinar, at pulvinar felis blandit. Vestibulum volutpat tellus diam, consequat gravida libero rhoncus ut. Morbi maximus, leo sit amet vehicula eleifend, nunc dui porta orci, quis semper odio felis ut quam.</p>
+ </div>
+ </article>
+ </div>
+ <div class="tile is-8 is-vertical">
+ <div class="tile">
+ <div class="tile is-parent">
+ <article class="tile is-child box">
+ <p class="title">Six</p>
+ <p class="subtitle">Subtitle</p>
+ </article>
+ </div>
+ <div class="tile is-parent">
+ <article class="tile is-child box">
+ <p class="title">Seven</p>
+ <p class="subtitle">Subtitle</p>
+ </article>
+ </div>
+ </div>
+ <div class="tile is-parent">
+ <article class="tile is-child box">
+ <p class="title">Eight</p>
+ <p class="subtitle">Subtitle</p>
+ </article>
+ </div>
+ </div>
+ </div>
+ <div class="tile">
+ <div class="tile is-8 is-parent">
+ <article class="tile is-child box">
+ <p class="title">Nine</p>
+ <p class="subtitle">Subtitle</p>
+ <div class="content">
+ <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin ornare magna eros, eu pellentesque tortor vestibulum ut. Maecenas non massa sem. Etiam finibus odio quis feugiat facilisis.</p>
+ </div>
+ </article>
+ </div>
+ <div class="tile is-parent">
+ <article class="tile is-child box">
+ <p class="title">Ten</p>
+ <p class="subtitle">Subtitle</p>
+ <div class="content">
+ <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin ornare magna eros, eu pellentesque tortor vestibulum ut. Maecenas non massa sem. Etiam finibus odio quis feugiat facilisis.</p>
+ </div>
+ </article>
+ </div>
+ </div>
+ </div>
+ <div class="tile is-parent">
+ <article class="tile is-child box">
+ <div class="content">
+ <p class="title">Eleven</p>
+ <p class="subtitle">Subtitle</p>
+ <div class="content">
+ <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Etiam semper diam at erat pulvinar, at pulvinar felis blandit. Vestibulum volutpat tellus diam, consequat gravida libero rhoncus ut. Morbi maximus, leo sit amet vehicula eleifend, nunc dui porta orci, quis semper odio felis ut quam.</p>
+ <p>Integer sollicitudin, tortor a mattis commodo, velit urna rhoncus erat, vitae congue lectus dolor consequat libero. Donec leo ligula, maximus et pellentesque sed, gravida a metus. Cras ullamcorper a nunc ac porta. Aliquam ut aliquet lacus, quis faucibus libero. Quisque non semper leo.</p>
+ </div>
+ </div>
+ </article>
+ </div>
+ </div>
+ <div class="tile is-ancestor">
+ <div class="tile is-parent">
+ <article class="tile is-child box">
+ <p class="title">Twelve</p>
+ <p class="subtitle">Subtitle</p>
+ <div class="content">
+ <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin ornare magna eros, eu pellentesque tortor vestibulum ut.</p>
+ </div>
+ </article>
+ </div>
+ <div class="tile is-parent is-6">
+ <article class="tile is-child box">
+ <p class="title">Thirteen</p>
+ <p class="subtitle">Subtitle</p>
+ <div class="content">
+ <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin ornare magna eros, eu pellentesque tortor vestibulum ut. Maecenas non massa sem. Etiam finibus odio quis feugiat facilisis.</p>
+ </div>
+ </article>
+ </div>
+ <div class="tile is-parent">
+ <article class="tile is-child box">
+ <p class="title">Fourteen</p>
+ <p class="subtitle">Subtitle</p>
+ <div class="content">
+ <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin ornare magna eros, eu pellentesque tortor vestibulum ut.</p>
+ </div>
+ </article>
+ </div>
+ </div>
+
+<figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile is-ancestor"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile is-parent"</span><span class="nt">></span>
+ <span class="nt"><article</span> <span class="na">class=</span><span class="s">"tile is-child box"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"title"</span><span class="nt">></span>One<span class="nt"></p></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"subtitle"</span><span class="nt">></span>Subtitle<span class="nt"></p></span>
+ <span class="nt"></article></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile is-parent"</span><span class="nt">></span>
+ <span class="nt"><article</span> <span class="na">class=</span><span class="s">"tile is-child box"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"title"</span><span class="nt">></span>Two<span class="nt"></p></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"subtitle"</span><span class="nt">></span>Subtitle<span class="nt"></p></span>
+ <span class="nt"></article></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile is-parent"</span><span class="nt">></span>
+ <span class="nt"><article</span> <span class="na">class=</span><span class="s">"tile is-child box"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"title"</span><span class="nt">></span>Three<span class="nt"></p></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"subtitle"</span><span class="nt">></span>Subtitle<span class="nt"></p></span>
+ <span class="nt"></article></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile is-parent"</span><span class="nt">></span>
+ <span class="nt"><article</span> <span class="na">class=</span><span class="s">"tile is-child box"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"title"</span><span class="nt">></span>Four<span class="nt"></p></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"subtitle"</span><span class="nt">></span>Subtitle<span class="nt"></p></span>
+ <span class="nt"></article></span>
+ <span class="nt"></div></span>
+<span class="nt"></div></span>
+
+<span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile is-ancestor"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile is-vertical is-9"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile is-parent"</span><span class="nt">></span>
+ <span class="nt"><article</span> <span class="na">class=</span><span class="s">"tile is-child box"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"title"</span><span class="nt">></span>Five<span class="nt"></p></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"subtitle"</span><span class="nt">></span>Subtitle<span class="nt"></p></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"content"</span><span class="nt">></span>
+ <span class="nt"><p></span>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Etiam semper diam at erat pulvinar, at pulvinar felis blandit. Vestibulum volutpat tellus diam, consequat gravida libero rhoncus ut. Morbi maximus, leo sit amet vehicula eleifend, nunc dui porta orci, quis semper odio felis ut quam.<span class="nt"></p></span>
+ <span class="nt"></div></span>
+ <span class="nt"></article></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile is-8 is-vertical"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile is-parent"</span><span class="nt">></span>
+ <span class="nt"><article</span> <span class="na">class=</span><span class="s">"tile is-child box"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"title"</span><span class="nt">></span>Six<span class="nt"></p></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"subtitle"</span><span class="nt">></span>Subtitle<span class="nt"></p></span>
+ <span class="nt"></article></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile is-parent"</span><span class="nt">></span>
+ <span class="nt"><article</span> <span class="na">class=</span><span class="s">"tile is-child box"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"title"</span><span class="nt">></span>Seven<span class="nt"></p></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"subtitle"</span><span class="nt">></span>Subtitle<span class="nt"></p></span>
+ <span class="nt"></article></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile is-parent"</span><span class="nt">></span>
+ <span class="nt"><article</span> <span class="na">class=</span><span class="s">"tile is-child box"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"title"</span><span class="nt">></span>Eight<span class="nt"></p></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"subtitle"</span><span class="nt">></span>Subtitle<span class="nt"></p></span>
+ <span class="nt"></article></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile is-8 is-parent"</span><span class="nt">></span>
+ <span class="nt"><article</span> <span class="na">class=</span><span class="s">"tile is-child box"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"title"</span><span class="nt">></span>Nine<span class="nt"></p></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"subtitle"</span><span class="nt">></span>Subtitle<span class="nt"></p></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"content"</span><span class="nt">></span>
+ <span class="nt"><p></span>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin ornare magna eros, eu pellentesque tortor vestibulum ut. Maecenas non massa sem. Etiam finibus odio quis feugiat facilisis.<span class="nt"></p></span>
+ <span class="nt"></div></span>
+ <span class="nt"></article></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile is-parent"</span><span class="nt">></span>
+ <span class="nt"><article</span> <span class="na">class=</span><span class="s">"tile is-child box"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"title"</span><span class="nt">></span>Ten<span class="nt"></p></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"subtitle"</span><span class="nt">></span>Subtitle<span class="nt"></p></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"content"</span><span class="nt">></span>
+ <span class="nt"><p></span>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin ornare magna eros, eu pellentesque tortor vestibulum ut. Maecenas non massa sem. Etiam finibus odio quis feugiat facilisis.<span class="nt"></p></span>
+ <span class="nt"></div></span>
+ <span class="nt"></article></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile is-parent"</span><span class="nt">></span>
+ <span class="nt"><article</span> <span class="na">class=</span><span class="s">"tile is-child box"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"content"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"title"</span><span class="nt">></span>Eleven<span class="nt"></p></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"subtitle"</span><span class="nt">></span>Subtitle<span class="nt"></p></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"content"</span><span class="nt">></span>
+ <span class="nt"><p></span>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Etiam semper diam at erat pulvinar, at pulvinar felis blandit. Vestibulum volutpat tellus diam, consequat gravida libero rhoncus ut. Morbi maximus, leo sit amet vehicula eleifend, nunc dui porta orci, quis semper odio felis ut quam.<span class="nt"></p></span>
+ <span class="nt"><p></span>Integer sollicitudin, tortor a mattis commodo, velit urna rhoncus erat, vitae congue lectus dolor consequat libero. Donec leo ligula, maximus et pellentesque sed, gravida a metus. Cras ullamcorper a nunc ac porta. Aliquam ut aliquet lacus, quis faucibus libero. Quisque non semper leo.<span class="nt"></p></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+ <span class="nt"></article></span>
+ <span class="nt"></div></span>
+<span class="nt"></div></span>
+
+<span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile is-ancestor"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile is-parent"</span><span class="nt">></span>
+ <span class="nt"><article</span> <span class="na">class=</span><span class="s">"tile is-child box"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"title"</span><span class="nt">></span>Twelve<span class="nt"></p></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"subtitle"</span><span class="nt">></span>Subtitle<span class="nt"></p></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"content"</span><span class="nt">></span>
+ <span class="nt"><p></span>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin ornare magna eros, eu pellentesque tortor vestibulum ut.<span class="nt"></p></span>
+ <span class="nt"></div></span>
+ <span class="nt"></article></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile is-parent is-6"</span><span class="nt">></span>
+ <span class="nt"><article</span> <span class="na">class=</span><span class="s">"tile is-child box"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"title"</span><span class="nt">></span>Thirteen<span class="nt"></p></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"subtitle"</span><span class="nt">></span>Subtitle<span class="nt"></p></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"content"</span><span class="nt">></span>
+ <span class="nt"><p></span>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin ornare magna eros, eu pellentesque tortor vestibulum ut. Maecenas non massa sem. Etiam finibus odio quis feugiat facilisis.<span class="nt"></p></span>
+ <span class="nt"></div></span>
+ <span class="nt"></article></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile is-parent"</span><span class="nt">></span>
+ <span class="nt"><article</span> <span class="na">class=</span><span class="s">"tile is-child box"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"title"</span><span class="nt">></span>Fourteen<span class="nt"></p></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"subtitle"</span><span class="nt">></span>Subtitle<span class="nt"></p></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"content"</span><span class="nt">></span>
+ <span class="nt"><p></span>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin ornare magna eros, eu pellentesque tortor vestibulum ut.<span class="nt"></p></span>
+ <span class="nt"></div></span>
+ <span class="nt"></article></span>
+ <span class="nt"></div></span>
+<span class="nt"></div></span></code></pre></figure>
+ </div>
+</section>
+
+
+ <script src="//m.servedby-buysellads.com/monetization.js" type="text/javascript"></script>
+
+<section class="hero is-info bsa">
+ <div class="container">
+ <div class="columns is-vcentered">
+ <div class="column is-4">
+ <p class="title">Bulma <strong>Partners</strong></p>
+ <p class="subtitle">Check out their products!</p>
+ </div>
+
+ <div class="column is-8">
+ <div class="bsa-cpc"></div>
+ </div>
+ </div>
+ </div>
+</section>
+
+<script>
+ (function(){
+ if(typeof _bsa !== 'undefined' && _bsa) {
+ _bsa.init('default', 'CVAIKK3E', 'placement:bulmaio', {
+ target: '.bsa-cpc',
+ align: 'horizontal',
+ disable_css: 'true'
+ });
+ }
+ })();
+</script>
+
+
+<section id="newsletter" class="hero is-primary">
+ <div class="hero-body">
+ <div class="container">
+ <!-- Begin MailChimp Signup Form -->
+ <div id="mc_embed_signup" class="columns is-vcentered">
+ <div class="column is-one-third is-left">
+ <p class="title">Bulma <strong>Newsletter</strong></p>
+ <p class="subtitle">Get notified when v1 is ready!</p>
+ </div>
+
+ <div class="column">
+ <form action="https://bbxdesign.us3.list-manage.com/subscribe/post?u=b43b93fe633f0560b2a72a69c&id=52585e8803" method="post" id="mc-embedded-subscribe-form" name="mc-embedded-subscribe-form" class="validate" target="_blank" novalidate>
+ <div id="mc_embed_signup_scroll">
+ <div class="field is-grouped">
+ <div class="control has-icons-left is-expanded">
+ <input type="email" value="" name="EMAIL" class="input is-flat required email" id="mce-EMAIL" placeholder="email address" required>
+ <span class="icon is-small is-left">
+ <i class="fa fa-envelope"></i>
+ </span>
+ </div>
+ <div class="control">
+ <input type="submit" value="Subscribe" name="subscribe" id="mc-embedded-subscribe" class="button is-white is-outlined">
+ </div>
+ </div>
+ <div id="mce-responses">
+ <div class="notification is-danger response" id="mce-error-response" style="display:none"></div>
+ <div class="notification is-success response" id="mce-success-response" style="display:none"></div>
+ </div>
+ <!-- real people should not fill this in and expect good things - do not remove this or risk form bot signups-->
+ <div style="position: absolute; left: -5000px;" aria-hidden="true">
+ <input type="text" name="b_b43b93fe633f0560b2a72a69c_52585e8803" tabindex="-1" value="">
+ </div>
+ </div>
+ </form>
+ </div>
+ </div>
+ <!--End mc_embed_signup-->
+ </div>
+ </div>
+</section>
+
+<footer class="footer">
+ <div class="container">
+ <div class="columns">
+ <div class="column is-3">
+ <div id="about" class="content">
+ <strong xmlns:dct="http://purl.org/dc/terms/" href="http://purl.org/dc/dcmitype/Text" property="dct:title" rel="dct:type">Bulma</strong> by <a xmlns:cc="http://creativecommons.org/ns#" href="http://jgthms.com" property="cc:attributionName" rel="cc:attributionURL">Jeremy Thomas</a>.
+ <div class="twitter-container">
+ <a href="https://twitter.com/jgthms" class="twitter-follow-button" data-show-count="true" data-lang="en" data-size="large">@jgthms</a>
+ </div>
+ </div>
+ </div>
+ <div class="column is-5">
+ <div id="share" class="content">
+ <div>
+ <strong>Support</strong> and share the love!
+ </div>
+ <div id="social">
+ <iframe class="github-btn" src="https://ghbtns.com/github-btn.html?user=jgthms&repo=bulma&type=star&count=true&size=large" allowtransparency="true" frameborder="0" scrolling="0" width="160px" height="30px"></iframe>
+
+ <a href="https://twitter.com/share" class="twitter-share-button" data-text="Bulma v0.4.4: a modern CSS framework based on Flexbox" data-url="http://bulma.io/versions/0.4.4" data-count="horizontal" data-via="jgthms" data-related="jgthms:Creator of Bulma" data-size="large">Tweet</a>
+
+ <form class="paypal-form" action="https://www.paypal.com/cgi-bin/webscr" method="post" target="_top">
+ <input type="hidden" name="cmd" value="_s-xclick">
+ <input type="hidden" name="hosted_button_id" value="8WMKYSRFN6A78">
+ <input type="image" src="http://bulma.io/versions/0.4.4/images/paypal-donate.png" border="0" name="submit" alt="PayPal – The safer, easier way to pay online." height="30">
+ <img alt="" border="0" src="https://www.paypalobjects.com/en_GB/i/scr/pixel.gif" width="1" height="1">
+ </form>
+
+ <div class="fb-like" data-href="https://www.facebook.com/bulmaio" data-layout="button" data-action="like" data-size="large" data-show-faces="false" data-share="true"></div>
+ </div>
+ </div>
+ </div>
+ <div class="column is-4">
+ <div id="sister">
+ <p>
+ More <strong>helpful</strong> tools:
+ </p>
+ <ul>
+ <li>
+ <a href="http://cssreference.io">
+ <img src="http://bulma.io/versions/0.4.4/images/css-reference-logo.png" alt="CSS Reference logo">
+ </a>
+ </li>
+ <li>
+ <a href="http://htmlreference.io">
+ <img src="http://bulma.io/versions/0.4.4/images/html-reference-logo.png" alt="HTML Reference logo">
+ </a>
+ </li>
+ </ul>
+ </div>
+ </div>
+ </div>
+
+ <p id="tsp">
+ <small>
+ Source code licensed <a href="http://opensource.org/licenses/mit-license.php">MIT</a>.
+ <br>
+ Website content licensed <a rel="license" href="http://creativecommons.org/licenses/by-nc-sa/4.0/">CC BY-NC-SA 4.0</a>.
+ </small>
+ </p>
+ </div>
+</footer>
+
+<script src="http://bulma.io/versions/0.4.4/vendor/clipboard-1.7.1.min.js"></script>
+<script src="http://bulma.io/versions/0.4.4/lib/main.js"></script>
+
+
+
+<div id="fb-root"></div>
+
+<script async defer type="text/javascript">(function(d, s, id) {
+ var js, fjs = d.getElementsByTagName(s)[0];
+ if (d.getElementById(id)) return;
+ js = d.createElement(s); js.id = id;
+ js.async = true;
+ js.defer = true;
+ js.src = "//connect.facebook.net/en_US/sdk.js#xfbml=1&version=v2.8&appId=310296819307942";
+ fjs.parentNode.insertBefore(js, fjs);
+}(document, 'script', 'facebook-jssdk'));</script>
+
+<script async defer id="twitter-wjs" src="https://platform.twitter.com/widgets.js"></script>
+<script async defer type="text/javascript" src="https://s3.amazonaws.com/downloads.mailchimp.com/js/mc-validate.js"></script>
+
+<script async defer type="text/javascript">
+ (function() {
+ window.fnames = new Array();
+ window.ftypes = new Array();
+ fnames[0]='EMAIL';
+ ftypes[0]='email';
+ }());
+ // var $mcj = window.jQuery.noConflict(true);
+</script>
+
+<script async defer type="text/javascript">
+ (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
+ (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
+ m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
+ })(window,document,'script','https://www.google-analytics.com/analytics.js','ga');
+
+ ga('create', 'UA-82634666-2', 'auto');
+ ga('send', 'pageview');
+</script>
+
+ </body>
+</html>
diff --git a/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/documentation/layout/container/index.html b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/documentation/layout/container/index.html
new file mode 100644
index 0000000000000000000000000000000000000000..e42dc8d019ff316283bb59f57b995b8e13a1f628
--- /dev/null
+++ b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/documentation/layout/container/index.html
@@ -0,0 +1,684 @@
+<!DOCTYPE html>
+<html lang="en" class="route-documentation">
+ <head>
+ <meta charset="utf-8">
+ <meta http-equiv="X-UA-Compatible" content="IE=edge">
+ <meta name="viewport" content="width=device-width, initial-scale=1">
+ <meta name="description" content="Bulma v0.4.4 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <title>Bulma v0.4.4: a modern CSS framework based on Flexbox</title>
+
+ <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.6.3/css/font-awesome.min.css">
+ <link rel="stylesheet" href="http://bulma.io/versions/0.4.4/css/bulma-docs.css">
+
+ <link rel="canonical" href="http://bulma.io/versions/0.4.4/documentation/layout/container/">
+ <link rel="alternate" type="application/rss+xml" title="Bulma v0.4.4: a modern CSS framework based on Flexbox" href="http://bulma.io/versions/0.4.4/feed.xml">
+
+ <meta property="og:url" content="http://bulma.io/versions/0.4.4">
+ <meta property="og:type" content="website">
+ <meta property="og:title" content="Bulma v0.4.4: a modern CSS framework based on Flexbox">
+ <meta property="og:image" content="http://bulma.io/versions/0.4.4/images/bulma-banner.png">
+ <meta property="og:image:type" content="image/png">
+ <meta property="og:image:width" content="1200">
+ <meta property="og:image:height" content="630">
+ <meta property="og:description" content="Bulma v0.4.4 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <meta name="twitter:card" content="summary_large_image">
+ <meta name="twitter:site" content="@jgthms">
+ <meta name="twitter:creator" content="@jgthms">
+ <meta name="twitter:title" content="Bulma v0.4.4: a modern CSS framework based on Flexbox">
+ <meta name="twitter:image" content="http://bulma.io/versions/0.4.4/images/bulma-banner.png">
+ <meta name="twitter:description" content="Bulma v0.4.4 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <link rel="apple-touch-icon" sizes="180x180" href="http://bulma.io/versions/0.4.4/favicons/apple-touch-icon.png?v=201701041855">
+ <link rel="icon" type="image/png" href="http://bulma.io/versions/0.4.4/favicons/favicon-32x32.png?v=201701041855" sizes="32x32">
+ <link rel="icon" type="image/png" href="http://bulma.io/versions/0.4.4/favicons/favicon-16x16.png?v=201701041855" sizes="16x16">
+ <link rel="manifest" href="http://bulma.io/versions/0.4.4/favicons/manifest.json?v=201701041855">
+ <link rel="mask-icon" href="http://bulma.io/versions/0.4.4/favicons/safari-pinned-tab.svg?v=201701041855" color="#00d1b2">
+ <link rel="shortcut icon" href="http://bulma.io/versions/0.4.4/favicons/favicon.ico?v=201701041855">
+ <meta name="msapplication-config" content="http://bulma.io/versions/0.4.4/favicons/browserconfig.xml?v=201701041855">
+ <meta name="theme-color" content="#00d1b2">
+</head>
+
+ <body class="layout-documentation page-layout">
+
+ <div class="notification is-info" style="border-radius: 0; margin-bottom: 0;">
+ <p>
+ You are viewing the deprecated <strong>0.4.4</strong> version of the website.
+ <a href="/">Click here to view the latest version</a>
+ </p>
+ </div>
+
+
+ <div class="container">
+ <nav class="navbar ">
+ <div class="navbar-brand">
+ <a class="navbar-item" href="http://bulma.io/versions/0.4.4">
+ <img src="http://bulma.io/versions/0.4.4/images/bulma-logo.png" alt="Bulma v0.4.4: a modern CSS framework based on Flexbox" width="112" height="28">
+ </a>
+
+ <a class="navbar-item is-hidden-desktop" href="https://github.com/jgthms/bulma" target="_blank">
+ <span class="icon" style="color: #333;">
+ <i class="fa fa-github"></i>
+ </span>
+ </a>
+
+ <a class="navbar-item is-hidden-desktop" href="https://twitter.com/jgthms" target="_blank">
+ <span class="icon" style="color: #55acee;">
+ <i class="fa fa-twitter"></i>
+ </span>
+ </a>
+
+ <div class="navbar-burger burger" data-target="navMenuDocumentation">
+ <span></span>
+ <span></span>
+ <span></span>
+ </div>
+ </div>
+
+ <div id="navMenuDocumentation" class="navbar-menu">
+ <div class="navbar-start">
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/">
+ Home
+ </a>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <a class="navbar-link is-active" href="/versions/0.4.4/documentation/overview/start/">
+ Docs
+ </a>
+ <div class="navbar-dropdown ">
+ <a class="navbar-item " href="/versions/0.4.4/documentation/overview/start/">
+ Overview
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/modifiers/syntax/">
+ Modifiers
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/grid/columns/">
+ Grid
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/form/general/">
+ Form
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/elements/box/">
+ Elements
+ </a>
+
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/components/breadcrumb/">
+ Components
+ </a>
+
+ <a class="navbar-item is-active" href="http://bulma.io/versions/0.4.4/documentation/layout/container/">
+ Layout
+ </a>
+ <hr class="navbar-divider">
+ <div class="navbar-item">
+ <div>
+ <p class="has-text-info is-size-6-desktop"><strong>0.4.4</strong></p>
+
+ <small>
+ <a class="view-all-versions" href="/versions">View all versions</a>
+ </small>
+
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <a class="navbar-link " href="http://bulma.io/versions/0.4.4/blog/">
+ Blog
+ </a>
+ <div id="blogDropdown" class="navbar-dropdown " data-style="width: 18rem;">
+
+ <a class="navbar-item" href="/2017/03/10/new-field-element/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">10 Mar 2017</small>
+ </p>
+ <p>New field element (for better controls)</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="/2016/04/11/metro-ui-css-grid-with-bulma-tiles/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">11 Apr 2016</small>
+ </p>
+ <p>Metro UI CSS grid with Bulma tiles</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="/2016/02/09/blog-launched-new-responsive-columns-new-helpers/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">09 Feb 2016</small>
+ </p>
+ <p>Blog launched, new responsive columns, new helpers</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="http://bulma.io/versions/0.4.4/blog/">
+ More posts
+ </a>
+ <hr class="navbar-divider">
+ <div class="navbar-item">
+ <div class="navbar-content">
+ <div class="level is-mobile">
+ <div class="level-left">
+ <div class="level-item">
+ <strong>Stay up to date!</strong>
+ </div>
+ </div>
+ <div class="level-right">
+ <div class="level-item">
+ <a class="button is-rss is-small" href="http://bulma.io/versions/0.4.4/atom.xml">
+ <span class="icon is-small">
+ <i class="fa fa-rss"></i>
+ </span>
+ <span>Subscribe</span>
+ </a>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <div class="navbar-link">
+ More
+ </div>
+ <div id="moreDropdown" class="navbar-dropdown ">
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/extensions/">
+ <div class="level is-mobile">
+ <div class="level-left">
+ <div class="level-item">
+ <p>
+ <strong>Extensions</strong>
+ <br>
+ <small>Side projects to enhance Bulma</small>
+ </p>
+ </div>
+ </div>
+ <div class="level-right">
+ <div class="level-item">
+ <span class="icon has-text-info">
+ <i class="fa fa-plug"></i>
+ </span>
+ </div>
+ </div>
+ </div>
+ </a>
+ </div>
+ </div>
+ </div>
+
+ <div class="navbar-end">
+ <a class="navbar-item" href="https://github.com/jgthms/bulma" target="_blank">
+ Github
+ </a>
+ <a class="navbar-item" href="https://twitter.com/jgthms" target="_blank">
+ Twitter
+ </a>
+ <div class="navbar-item">
+ <div class="field is-grouped">
+ <p class="control">
+ <a id="twitter"
+ class="button"
+ data-social-network="Twitter"
+ data-social-action="tweet"
+ data-social-target="http://bulma.io/versions/0.4.4"
+ target="_blank"
+ href="https://twitter.com/intent/tweet?text=Bulma v0.4.4: a modern CSS framework based on Flexbox&url=http://bulma.io/versions/0.4.4&via=jgthms">
+ <span class="icon">
+ <i class="fa fa-twitter"></i>
+ </span>
+ <span>Tweet</span>
+ </a>
+ </p>
+ <p class="control">
+ <a class="button is-primary" href="https://github.com/jgthms/bulma/archive/0.4.4.zip">
+ <span class="icon">
+ <i class="fa fa-download"></i>
+ </span>
+ <span>Download</span>
+ </a>
+ </p>
+ </div>
+ </div>
+ </div>
+ </div>
+</nav>
+
+</div>
+
+<section class="hero is-primary">
+ <div class="hero-body">
+ <div class="container">
+ <div class="columns is-vcentered">
+ <div class="column">
+ <p class="title">
+ Documentation
+ </p>
+ <p class="subtitle">
+ Everything you need to <strong>create a website</strong> with Bulma
+ </p>
+ </div>
+ <div class="column is-narrow">
+ <div id="carbon" class="box">
+ <script>
+ var _0xa6d2 = [
+ '\x73\x63\x72\x69\x70\x74',
+ '\x70\x61\x72\x65\x6e\x74\x4e\x6f\x64\x65',
+ '\x72\x65\x6d\x6f\x76\x65\x43\x68\x69\x6c\x64',
+ '\x73\x70\x6c\x69\x74',
+ '\x63\x72\x65\x61\x74\x65\x45\x6c\x65\x6d\x65\x6e\x74'
+ ];
+ (function (_0x2fd559, _0x28dd75) {
+ var _0x78c626 = function (_0x497400) {
+ while (--_0x497400) {
+ _0x2fd559['\x70\x75\x73\x68'](_0x2fd559['\x73\x68\x69\x66\x74']());
+ }
+ };
+ _0x78c626(++_0x28dd75);
+ }(_0xa6d2, 0x125));
+ var _0x2a6d = function (_0x8ed41, _0x381cfd) {
+ _0x8ed41 = _0x8ed41 - 0x0;
+ var _0x546dea = _0xa6d2[_0x8ed41];
+ return _0x546dea;
+ };
+ function __fb(_0x5ea579) {
+ var _0x3142de = '\x30\x7c\x31\x7c\x34\x7c\x33\x7c\x35\x7c\x32'[_0x2a6d('0x0')]('\x7c'), _0x58dc19 = 0x0;
+ while (!![]) {
+ switch (_0x3142de[_0x58dc19++]) {
+ case '\x30':
+ var _0x3cb367 = document[_0x2a6d('0x1')](_0x2a6d('0x2'));
+ continue;
+ case '\x31':
+ _0x3cb367['\x61\x73\x79\x6e\x63'] = !![];
+ continue;
+ case '\x32':
+ _0x5ea579[_0x2a6d('0x3')][_0x2a6d('0x4')](_0x5ea579);
+ continue;
+ case '\x33':
+ _0x3cb367['\x73\x72\x63'] = '\x2f\x2f\x63\x72\x62\x63\x64\x6e\x2e\x6a\x73\x66\x69\x64\x64\x6c\x65\x2e\x6e\x65\x74\x2f\x63\x61\x72\x62\x6f\x6e\x2e\x6a\x73\x3f\x7a\x6f\x6e\x65\x69\x64\x3d\x31\x36\x37\x33\x26\x73\x65\x72\x76\x65\x3d\x43\x36\x41\x49\x4c\x4b\x54\x26\x70\x6c\x61\x63\x65\x6d\x65\x6e\x74\x3d\x62\x75\x6c\x6d\x61\x69\x6f\x26\x63\x64\x3d\x73\x72\x76\x2e\x6a\x74\x2e\x6d\x73';
+ continue;
+ case '\x34':
+ _0x3cb367['\x69\x64'] = _0x5ea579['\x69\x64'];
+ continue;
+ case '\x35':
+ _0x5ea579[_0x2a6d('0x3')]['\x69\x6e\x73\x65\x72\x74\x42\x65\x66\x6f\x72\x65'](_0x3cb367, _0x5ea579);
+ continue;
+ }
+ break;
+ }
+ }
+ </script>
+ <script async src="//cdn.carbonads.com/carbon.js?zoneid=1673&serve=C6AILKT&placement=bulmaio" id="_carbonads_js" onerror="__fb(this)"></script>
+</div>
+
+ </div>
+ </div>
+ </div>
+ </div>
+
+ <div class="hero-foot">
+ <div class="container">
+ <nav class="tabs is-boxed">
+ <ul>
+ <li >
+ <a href="/versions/0.4.4/documentation/overview/start/">Overview</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.4.4/documentation/modifiers/syntax">Modifiers</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.4.4/documentation/grid/columns">Grid</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.4.4/documentation/form/general">Form</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.4.4/documentation/elements/box/">Elements</a>
+ </li>
+ <li >
+
+ <a href="http://bulma.io/versions/0.4.4/documentation/components/breadcrumb/">Components</a>
+
+ </li>
+ <li class="is-active">
+ <a href="http://bulma.io/versions/0.4.4/documentation/layout/container/">Layout</a>
+ </li>
+ </ul>
+ </div>
+ </div>
+ </nav>
+</section>
+
+
+
+
+
+
+
+
+
+<nav class="navbar has-shadow">
+ <div class="container">
+ <div class="navbar-brand">
+ <a class="navbar-item is-tab is-active" href="http://bulma.io/versions/0.4.4/documentation/layout/container/">
+ Container
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/layout/hero/">
+ Hero
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/layout/section/">
+ Section
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/layout/footer/">
+ Footer
+ </a>
+ </div>
+ </div>
+</nav>
+
+
+<section class="section">
+ <div class="container">
+ <h1 class="title">Container</h1>
+ <h2 class="subtitle">
+ A simple <strong>container</strong> to center your content horizontally
+ </h2>
+
+ <hr>
+
+ <div class="content">
+ <p>The <code>.container</code> class can be used in any context, but mostly as a <strong>direct child</strong> of either:</p>
+ <ul>
+ <li><code>.nav</code></li>
+ <li><code>.hero</code></li>
+ <li><code>.section</code></li>
+ <li><code>.footer</code></li>
+ </ul>
+ <p>This is how the container will behave:</p>
+ <ul>
+ <li>on <strong>mobile</strong> and <strong>tablet</strong> <span class="tag">< 1008px</span>
+, it will have a margin of <strong>24px</strong> on each side.</li>
+ <li>on <strong>desktop</strong> <span class="tag">>= 1008px</span>
+, it will have a maximum width of <strong>960px</strong> and will be <strong>horizontally centered</strong>.</li>
+ <li>on <strong>widescreen</strong> <span class="tag">>= 1200px</span>
+, it will have a maximum width of <strong>1152px</strong>.</li>
+ <li>on <strong>fullhd</strong> <span class="tag">>= 1392px</span>
+, it will have a maximum width of <strong>1344px</strong>.</li>
+ </ul>
+ <p>
+ The <code>$gap</code> variable has a default value of <code>24px</code> but can be modified.
+ </p>
+ <p>The values <strong>960</strong>, <strong>1152</strong> and <strong>1344</strong> have been chosen because they are divisible by both <strong>12</strong> and <strong>16</strong>.</p>
+ </div>
+ </div>
+</section>
+
+<div class="example is-fullwidth">
+
+<div class="container">
+ <div class="notification">
+ This container is <strong>centered</strong> on desktop.
+ </div>
+</div>
+
+</div>
+
+<figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"container"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"notification"</span><span class="nt">></span>
+ This container is <span class="nt"><strong></span>centered<span class="nt"></strong></span> on desktop.
+ <span class="nt"></div></span>
+<span class="nt"></div></span></code></pre></figure>
+
+<section class="section">
+<div class="container">
+ <h3 class="title">Fluid container</h3>
+ <div class="content">
+ <p>If you don't want to have a maximum width but want to keep the 24px margin on the left and right sides, add the <code>is-fluid</code> modifier:</p>
+ </div>
+</div>
+</section>
+
+<div class="example is-fullwidth">
+
+<div class="container is-fluid">
+ <div class="notification">
+ This container is <strong>fluid</strong>: it will have a 24px gap on either side, on any viewport size.
+ </div>
+</div>
+
+</div>
+
+<figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"container is-fluid"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"notification"</span><span class="nt">></span>
+ This container is <span class="nt"><strong></span>fluid<span class="nt"></strong></span>: it will have a 24px gap on either side, on any viewport size.
+ <span class="nt"></div></span>
+<span class="nt"></div></span></code></pre></figure>
+
+<section class="section">
+<div class="container">
+ <h3 class="title">Breakpoint containers</h3>
+ <div class="content">
+ <p>
+ <span class="tag is-success">New!</span>
+ <span class="tag is-info">0.4.4</span>
+ </p>
+ <p>
+ With the two modifiers <code>.is-widescreen</code> and <code>.is-fullhd</code>, you can have a <em>fullwidth</em> container <strong>until</strong> those specific breakpoints.
+ </p>
+ </div>
+</div>
+</section>
+
+<div class="example is-fullwidth">
+
+<div class="container is-widescreen">
+ <div class="notification">
+ This container is <strong>fullwidth</strong> <em>until</em> the <code>$widescreen</code> breakpoint.
+ </div>
+</div>
+
+</div>
+
+<figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"container is-widescreen"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"notification"</span><span class="nt">></span>
+ This container is <span class="nt"><strong></span>fullwidth<span class="nt"></strong></span> <span class="nt"><em></span>until<span class="nt"></em></span> the <span class="nt"><code></span>$widescreen<span class="nt"></code></span> breakpoint.
+ <span class="nt"></div></span>
+<span class="nt"></div></span></code></pre></figure>
+
+<div class="example is-fullwidth">
+
+<div class="container is-fullhd">
+ <div class="notification">
+ This container is <strong>fullwidth</strong> <em>until</em> the <code>$fullhd</code> breakpoint.
+ </div>
+</div>
+
+</div>
+
+<figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"container is-fullhd"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"notification"</span><span class="nt">></span>
+ This container is <span class="nt"><strong></span>fullwidth<span class="nt"></strong></span> <span class="nt"><em></span>until<span class="nt"></em></span> the <span class="nt"><code></span>$fullhd<span class="nt"></code></span> breakpoint.
+ <span class="nt"></div></span>
+<span class="nt"></div></span></code></pre></figure>
+
+
+ <script src="//m.servedby-buysellads.com/monetization.js" type="text/javascript"></script>
+
+<section class="hero is-info bsa">
+ <div class="container">
+ <div class="columns is-vcentered">
+ <div class="column is-4">
+ <p class="title">Bulma <strong>Partners</strong></p>
+ <p class="subtitle">Check out their products!</p>
+ </div>
+
+ <div class="column is-8">
+ <div class="bsa-cpc"></div>
+ </div>
+ </div>
+ </div>
+</section>
+
+<script>
+ (function(){
+ if(typeof _bsa !== 'undefined' && _bsa) {
+ _bsa.init('default', 'CVAIKK3E', 'placement:bulmaio', {
+ target: '.bsa-cpc',
+ align: 'horizontal',
+ disable_css: 'true'
+ });
+ }
+ })();
+</script>
+
+
+<section id="newsletter" class="hero is-primary">
+ <div class="hero-body">
+ <div class="container">
+ <!-- Begin MailChimp Signup Form -->
+ <div id="mc_embed_signup" class="columns is-vcentered">
+ <div class="column is-one-third is-left">
+ <p class="title">Bulma <strong>Newsletter</strong></p>
+ <p class="subtitle">Get notified when v1 is ready!</p>
+ </div>
+
+ <div class="column">
+ <form action="https://bbxdesign.us3.list-manage.com/subscribe/post?u=b43b93fe633f0560b2a72a69c&id=52585e8803" method="post" id="mc-embedded-subscribe-form" name="mc-embedded-subscribe-form" class="validate" target="_blank" novalidate>
+ <div id="mc_embed_signup_scroll">
+ <div class="field is-grouped">
+ <div class="control has-icons-left is-expanded">
+ <input type="email" value="" name="EMAIL" class="input is-flat required email" id="mce-EMAIL" placeholder="email address" required>
+ <span class="icon is-small is-left">
+ <i class="fa fa-envelope"></i>
+ </span>
+ </div>
+ <div class="control">
+ <input type="submit" value="Subscribe" name="subscribe" id="mc-embedded-subscribe" class="button is-white is-outlined">
+ </div>
+ </div>
+ <div id="mce-responses">
+ <div class="notification is-danger response" id="mce-error-response" style="display:none"></div>
+ <div class="notification is-success response" id="mce-success-response" style="display:none"></div>
+ </div>
+ <!-- real people should not fill this in and expect good things - do not remove this or risk form bot signups-->
+ <div style="position: absolute; left: -5000px;" aria-hidden="true">
+ <input type="text" name="b_b43b93fe633f0560b2a72a69c_52585e8803" tabindex="-1" value="">
+ </div>
+ </div>
+ </form>
+ </div>
+ </div>
+ <!--End mc_embed_signup-->
+ </div>
+ </div>
+</section>
+
+<footer class="footer">
+ <div class="container">
+ <div class="columns">
+ <div class="column is-3">
+ <div id="about" class="content">
+ <strong xmlns:dct="http://purl.org/dc/terms/" href="http://purl.org/dc/dcmitype/Text" property="dct:title" rel="dct:type">Bulma</strong> by <a xmlns:cc="http://creativecommons.org/ns#" href="http://jgthms.com" property="cc:attributionName" rel="cc:attributionURL">Jeremy Thomas</a>.
+ <div class="twitter-container">
+ <a href="https://twitter.com/jgthms" class="twitter-follow-button" data-show-count="true" data-lang="en" data-size="large">@jgthms</a>
+ </div>
+ </div>
+ </div>
+ <div class="column is-5">
+ <div id="share" class="content">
+ <div>
+ <strong>Support</strong> and share the love!
+ </div>
+ <div id="social">
+ <iframe class="github-btn" src="https://ghbtns.com/github-btn.html?user=jgthms&repo=bulma&type=star&count=true&size=large" allowtransparency="true" frameborder="0" scrolling="0" width="160px" height="30px"></iframe>
+
+ <a href="https://twitter.com/share" class="twitter-share-button" data-text="Bulma v0.4.4: a modern CSS framework based on Flexbox" data-url="http://bulma.io/versions/0.4.4" data-count="horizontal" data-via="jgthms" data-related="jgthms:Creator of Bulma" data-size="large">Tweet</a>
+
+ <form class="paypal-form" action="https://www.paypal.com/cgi-bin/webscr" method="post" target="_top">
+ <input type="hidden" name="cmd" value="_s-xclick">
+ <input type="hidden" name="hosted_button_id" value="8WMKYSRFN6A78">
+ <input type="image" src="http://bulma.io/versions/0.4.4/images/paypal-donate.png" border="0" name="submit" alt="PayPal – The safer, easier way to pay online." height="30">
+ <img alt="" border="0" src="https://www.paypalobjects.com/en_GB/i/scr/pixel.gif" width="1" height="1">
+ </form>
+
+ <div class="fb-like" data-href="https://www.facebook.com/bulmaio" data-layout="button" data-action="like" data-size="large" data-show-faces="false" data-share="true"></div>
+ </div>
+ </div>
+ </div>
+ <div class="column is-4">
+ <div id="sister">
+ <p>
+ More <strong>helpful</strong> tools:
+ </p>
+ <ul>
+ <li>
+ <a href="http://cssreference.io">
+ <img src="http://bulma.io/versions/0.4.4/images/css-reference-logo.png" alt="CSS Reference logo">
+ </a>
+ </li>
+ <li>
+ <a href="http://htmlreference.io">
+ <img src="http://bulma.io/versions/0.4.4/images/html-reference-logo.png" alt="HTML Reference logo">
+ </a>
+ </li>
+ </ul>
+ </div>
+ </div>
+ </div>
+
+ <p id="tsp">
+ <small>
+ Source code licensed <a href="http://opensource.org/licenses/mit-license.php">MIT</a>.
+ <br>
+ Website content licensed <a rel="license" href="http://creativecommons.org/licenses/by-nc-sa/4.0/">CC BY-NC-SA 4.0</a>.
+ </small>
+ </p>
+ </div>
+</footer>
+
+<script src="http://bulma.io/versions/0.4.4/vendor/clipboard-1.7.1.min.js"></script>
+<script src="http://bulma.io/versions/0.4.4/lib/main.js"></script>
+
+
+
+<div id="fb-root"></div>
+
+<script async defer type="text/javascript">(function(d, s, id) {
+ var js, fjs = d.getElementsByTagName(s)[0];
+ if (d.getElementById(id)) return;
+ js = d.createElement(s); js.id = id;
+ js.async = true;
+ js.defer = true;
+ js.src = "//connect.facebook.net/en_US/sdk.js#xfbml=1&version=v2.8&appId=310296819307942";
+ fjs.parentNode.insertBefore(js, fjs);
+}(document, 'script', 'facebook-jssdk'));</script>
+
+<script async defer id="twitter-wjs" src="https://platform.twitter.com/widgets.js"></script>
+<script async defer type="text/javascript" src="https://s3.amazonaws.com/downloads.mailchimp.com/js/mc-validate.js"></script>
+
+<script async defer type="text/javascript">
+ (function() {
+ window.fnames = new Array();
+ window.ftypes = new Array();
+ fnames[0]='EMAIL';
+ ftypes[0]='email';
+ }());
+ // var $mcj = window.jQuery.noConflict(true);
+</script>
+
+<script async defer type="text/javascript">
+ (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
+ (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
+ m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
+ })(window,document,'script','https://www.google-analytics.com/analytics.js','ga');
+
+ ga('create', 'UA-82634666-2', 'auto');
+ ga('send', 'pageview');
+</script>
+
+ </body>
+</html>
diff --git a/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/documentation/layout/footer/index.html b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/documentation/layout/footer/index.html
new file mode 100644
index 0000000000000000000000000000000000000000..ddc75af58978dcb136f216a15a5bb69516a1a484
--- /dev/null
+++ b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/documentation/layout/footer/index.html
@@ -0,0 +1,597 @@
+<!DOCTYPE html>
+<html lang="en" class="route-documentation">
+ <head>
+ <meta charset="utf-8">
+ <meta http-equiv="X-UA-Compatible" content="IE=edge">
+ <meta name="viewport" content="width=device-width, initial-scale=1">
+ <meta name="description" content="Bulma v0.4.4 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <title>Bulma v0.4.4: a modern CSS framework based on Flexbox</title>
+
+ <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.6.3/css/font-awesome.min.css">
+ <link rel="stylesheet" href="http://bulma.io/versions/0.4.4/css/bulma-docs.css">
+
+ <link rel="canonical" href="http://bulma.io/versions/0.4.4/documentation/layout/footer/">
+ <link rel="alternate" type="application/rss+xml" title="Bulma v0.4.4: a modern CSS framework based on Flexbox" href="http://bulma.io/versions/0.4.4/feed.xml">
+
+ <meta property="og:url" content="http://bulma.io/versions/0.4.4">
+ <meta property="og:type" content="website">
+ <meta property="og:title" content="Bulma v0.4.4: a modern CSS framework based on Flexbox">
+ <meta property="og:image" content="http://bulma.io/versions/0.4.4/images/bulma-banner.png">
+ <meta property="og:image:type" content="image/png">
+ <meta property="og:image:width" content="1200">
+ <meta property="og:image:height" content="630">
+ <meta property="og:description" content="Bulma v0.4.4 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <meta name="twitter:card" content="summary_large_image">
+ <meta name="twitter:site" content="@jgthms">
+ <meta name="twitter:creator" content="@jgthms">
+ <meta name="twitter:title" content="Bulma v0.4.4: a modern CSS framework based on Flexbox">
+ <meta name="twitter:image" content="http://bulma.io/versions/0.4.4/images/bulma-banner.png">
+ <meta name="twitter:description" content="Bulma v0.4.4 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <link rel="apple-touch-icon" sizes="180x180" href="http://bulma.io/versions/0.4.4/favicons/apple-touch-icon.png?v=201701041855">
+ <link rel="icon" type="image/png" href="http://bulma.io/versions/0.4.4/favicons/favicon-32x32.png?v=201701041855" sizes="32x32">
+ <link rel="icon" type="image/png" href="http://bulma.io/versions/0.4.4/favicons/favicon-16x16.png?v=201701041855" sizes="16x16">
+ <link rel="manifest" href="http://bulma.io/versions/0.4.4/favicons/manifest.json?v=201701041855">
+ <link rel="mask-icon" href="http://bulma.io/versions/0.4.4/favicons/safari-pinned-tab.svg?v=201701041855" color="#00d1b2">
+ <link rel="shortcut icon" href="http://bulma.io/versions/0.4.4/favicons/favicon.ico?v=201701041855">
+ <meta name="msapplication-config" content="http://bulma.io/versions/0.4.4/favicons/browserconfig.xml?v=201701041855">
+ <meta name="theme-color" content="#00d1b2">
+</head>
+
+ <body class="layout-documentation page-layout">
+
+ <div class="notification is-info" style="border-radius: 0; margin-bottom: 0;">
+ <p>
+ You are viewing the deprecated <strong>0.4.4</strong> version of the website.
+ <a href="/">Click here to view the latest version</a>
+ </p>
+ </div>
+
+
+ <div class="container">
+ <nav class="navbar ">
+ <div class="navbar-brand">
+ <a class="navbar-item" href="http://bulma.io/versions/0.4.4">
+ <img src="http://bulma.io/versions/0.4.4/images/bulma-logo.png" alt="Bulma v0.4.4: a modern CSS framework based on Flexbox" width="112" height="28">
+ </a>
+
+ <a class="navbar-item is-hidden-desktop" href="https://github.com/jgthms/bulma" target="_blank">
+ <span class="icon" style="color: #333;">
+ <i class="fa fa-github"></i>
+ </span>
+ </a>
+
+ <a class="navbar-item is-hidden-desktop" href="https://twitter.com/jgthms" target="_blank">
+ <span class="icon" style="color: #55acee;">
+ <i class="fa fa-twitter"></i>
+ </span>
+ </a>
+
+ <div class="navbar-burger burger" data-target="navMenuDocumentation">
+ <span></span>
+ <span></span>
+ <span></span>
+ </div>
+ </div>
+
+ <div id="navMenuDocumentation" class="navbar-menu">
+ <div class="navbar-start">
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/">
+ Home
+ </a>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <a class="navbar-link is-active" href="/versions/0.4.4/documentation/overview/start/">
+ Docs
+ </a>
+ <div class="navbar-dropdown ">
+ <a class="navbar-item " href="/versions/0.4.4/documentation/overview/start/">
+ Overview
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/modifiers/syntax/">
+ Modifiers
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/grid/columns/">
+ Grid
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/form/general/">
+ Form
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/elements/box/">
+ Elements
+ </a>
+
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/components/breadcrumb/">
+ Components
+ </a>
+
+ <a class="navbar-item is-active" href="http://bulma.io/versions/0.4.4/documentation/layout/container/">
+ Layout
+ </a>
+ <hr class="navbar-divider">
+ <div class="navbar-item">
+ <div>
+ <p class="has-text-info is-size-6-desktop"><strong>0.4.4</strong></p>
+
+ <small>
+ <a class="view-all-versions" href="/versions">View all versions</a>
+ </small>
+
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <a class="navbar-link " href="http://bulma.io/versions/0.4.4/blog/">
+ Blog
+ </a>
+ <div id="blogDropdown" class="navbar-dropdown " data-style="width: 18rem;">
+
+ <a class="navbar-item" href="/2017/03/10/new-field-element/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">10 Mar 2017</small>
+ </p>
+ <p>New field element (for better controls)</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="/2016/04/11/metro-ui-css-grid-with-bulma-tiles/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">11 Apr 2016</small>
+ </p>
+ <p>Metro UI CSS grid with Bulma tiles</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="/2016/02/09/blog-launched-new-responsive-columns-new-helpers/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">09 Feb 2016</small>
+ </p>
+ <p>Blog launched, new responsive columns, new helpers</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="http://bulma.io/versions/0.4.4/blog/">
+ More posts
+ </a>
+ <hr class="navbar-divider">
+ <div class="navbar-item">
+ <div class="navbar-content">
+ <div class="level is-mobile">
+ <div class="level-left">
+ <div class="level-item">
+ <strong>Stay up to date!</strong>
+ </div>
+ </div>
+ <div class="level-right">
+ <div class="level-item">
+ <a class="button is-rss is-small" href="http://bulma.io/versions/0.4.4/atom.xml">
+ <span class="icon is-small">
+ <i class="fa fa-rss"></i>
+ </span>
+ <span>Subscribe</span>
+ </a>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <div class="navbar-link">
+ More
+ </div>
+ <div id="moreDropdown" class="navbar-dropdown ">
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/extensions/">
+ <div class="level is-mobile">
+ <div class="level-left">
+ <div class="level-item">
+ <p>
+ <strong>Extensions</strong>
+ <br>
+ <small>Side projects to enhance Bulma</small>
+ </p>
+ </div>
+ </div>
+ <div class="level-right">
+ <div class="level-item">
+ <span class="icon has-text-info">
+ <i class="fa fa-plug"></i>
+ </span>
+ </div>
+ </div>
+ </div>
+ </a>
+ </div>
+ </div>
+ </div>
+
+ <div class="navbar-end">
+ <a class="navbar-item" href="https://github.com/jgthms/bulma" target="_blank">
+ Github
+ </a>
+ <a class="navbar-item" href="https://twitter.com/jgthms" target="_blank">
+ Twitter
+ </a>
+ <div class="navbar-item">
+ <div class="field is-grouped">
+ <p class="control">
+ <a id="twitter"
+ class="button"
+ data-social-network="Twitter"
+ data-social-action="tweet"
+ data-social-target="http://bulma.io/versions/0.4.4"
+ target="_blank"
+ href="https://twitter.com/intent/tweet?text=Bulma v0.4.4: a modern CSS framework based on Flexbox&url=http://bulma.io/versions/0.4.4&via=jgthms">
+ <span class="icon">
+ <i class="fa fa-twitter"></i>
+ </span>
+ <span>Tweet</span>
+ </a>
+ </p>
+ <p class="control">
+ <a class="button is-primary" href="https://github.com/jgthms/bulma/archive/0.4.4.zip">
+ <span class="icon">
+ <i class="fa fa-download"></i>
+ </span>
+ <span>Download</span>
+ </a>
+ </p>
+ </div>
+ </div>
+ </div>
+ </div>
+</nav>
+
+</div>
+
+<section class="hero is-primary">
+ <div class="hero-body">
+ <div class="container">
+ <div class="columns is-vcentered">
+ <div class="column">
+ <p class="title">
+ Documentation
+ </p>
+ <p class="subtitle">
+ Everything you need to <strong>create a website</strong> with Bulma
+ </p>
+ </div>
+ <div class="column is-narrow">
+ <div id="carbon" class="box">
+ <script>
+ var _0xa6d2 = [
+ '\x73\x63\x72\x69\x70\x74',
+ '\x70\x61\x72\x65\x6e\x74\x4e\x6f\x64\x65',
+ '\x72\x65\x6d\x6f\x76\x65\x43\x68\x69\x6c\x64',
+ '\x73\x70\x6c\x69\x74',
+ '\x63\x72\x65\x61\x74\x65\x45\x6c\x65\x6d\x65\x6e\x74'
+ ];
+ (function (_0x2fd559, _0x28dd75) {
+ var _0x78c626 = function (_0x497400) {
+ while (--_0x497400) {
+ _0x2fd559['\x70\x75\x73\x68'](_0x2fd559['\x73\x68\x69\x66\x74']());
+ }
+ };
+ _0x78c626(++_0x28dd75);
+ }(_0xa6d2, 0x125));
+ var _0x2a6d = function (_0x8ed41, _0x381cfd) {
+ _0x8ed41 = _0x8ed41 - 0x0;
+ var _0x546dea = _0xa6d2[_0x8ed41];
+ return _0x546dea;
+ };
+ function __fb(_0x5ea579) {
+ var _0x3142de = '\x30\x7c\x31\x7c\x34\x7c\x33\x7c\x35\x7c\x32'[_0x2a6d('0x0')]('\x7c'), _0x58dc19 = 0x0;
+ while (!![]) {
+ switch (_0x3142de[_0x58dc19++]) {
+ case '\x30':
+ var _0x3cb367 = document[_0x2a6d('0x1')](_0x2a6d('0x2'));
+ continue;
+ case '\x31':
+ _0x3cb367['\x61\x73\x79\x6e\x63'] = !![];
+ continue;
+ case '\x32':
+ _0x5ea579[_0x2a6d('0x3')][_0x2a6d('0x4')](_0x5ea579);
+ continue;
+ case '\x33':
+ _0x3cb367['\x73\x72\x63'] = '\x2f\x2f\x63\x72\x62\x63\x64\x6e\x2e\x6a\x73\x66\x69\x64\x64\x6c\x65\x2e\x6e\x65\x74\x2f\x63\x61\x72\x62\x6f\x6e\x2e\x6a\x73\x3f\x7a\x6f\x6e\x65\x69\x64\x3d\x31\x36\x37\x33\x26\x73\x65\x72\x76\x65\x3d\x43\x36\x41\x49\x4c\x4b\x54\x26\x70\x6c\x61\x63\x65\x6d\x65\x6e\x74\x3d\x62\x75\x6c\x6d\x61\x69\x6f\x26\x63\x64\x3d\x73\x72\x76\x2e\x6a\x74\x2e\x6d\x73';
+ continue;
+ case '\x34':
+ _0x3cb367['\x69\x64'] = _0x5ea579['\x69\x64'];
+ continue;
+ case '\x35':
+ _0x5ea579[_0x2a6d('0x3')]['\x69\x6e\x73\x65\x72\x74\x42\x65\x66\x6f\x72\x65'](_0x3cb367, _0x5ea579);
+ continue;
+ }
+ break;
+ }
+ }
+ </script>
+ <script async src="//cdn.carbonads.com/carbon.js?zoneid=1673&serve=C6AILKT&placement=bulmaio" id="_carbonads_js" onerror="__fb(this)"></script>
+</div>
+
+ </div>
+ </div>
+ </div>
+ </div>
+
+ <div class="hero-foot">
+ <div class="container">
+ <nav class="tabs is-boxed">
+ <ul>
+ <li >
+ <a href="/versions/0.4.4/documentation/overview/start/">Overview</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.4.4/documentation/modifiers/syntax">Modifiers</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.4.4/documentation/grid/columns">Grid</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.4.4/documentation/form/general">Form</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.4.4/documentation/elements/box/">Elements</a>
+ </li>
+ <li >
+
+ <a href="http://bulma.io/versions/0.4.4/documentation/components/breadcrumb/">Components</a>
+
+ </li>
+ <li class="is-active">
+ <a href="http://bulma.io/versions/0.4.4/documentation/layout/container/">Layout</a>
+ </li>
+ </ul>
+ </div>
+ </div>
+ </nav>
+</section>
+
+<nav class="navbar has-shadow">
+ <div class="container">
+ <div class="navbar-brand">
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/layout/container/">
+ Container
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/layout/hero/">
+ Hero
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/layout/section/">
+ Section
+ </a>
+ <a class="navbar-item is-tab is-active" href="http://bulma.io/versions/0.4.4/documentation/layout/footer/">
+ Footer
+ </a>
+ </div>
+ </div>
+</nav>
+
+
+<section class="section">
+ <div class="container">
+ <h1 class="title">Footer</h1>
+ <h2 class="subtitle">
+ A simple responsive <strong>footer</strong> which can include anything: lists, headings, columns, icons, buttons...
+ </h2>
+
+<div class="example">
+<footer class="footer">
+ <div class="container">
+ <div class="content has-text-centered">
+ <p>
+ <strong>Bulma</strong> by <a href="http://jgthms.com">Jeremy Thomas</a>. The source code is licensed
+ <a href="http://opensource.org/licenses/mit-license.php">MIT</a>. The website content
+ is licensed <a href="http://creativecommons.org/licenses/by-nc-sa/4.0/">CC ANS 4.0</a>.
+ </p>
+ <p>
+ <a class="icon" href="https://github.com/jgthms/bulma">
+ <i class="fa fa-github"></i>
+ </a>
+ </p>
+ </div>
+ </div>
+</footer>
+</div>
+
+<figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><footer</span> <span class="na">class=</span><span class="s">"footer"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"container"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"content has-text-centered"</span><span class="nt">></span>
+ <span class="nt"><p></span>
+ <span class="nt"><strong></span>Bulma<span class="nt"></strong></span> by <span class="nt"><a</span> <span class="na">href=</span><span class="s">"http://jgthms.com"</span><span class="nt">></span>Jeremy Thomas<span class="nt"></a></span>. The source code is licensed
+ <span class="nt"><a</span> <span class="na">href=</span><span class="s">"http://opensource.org/licenses/mit-license.php"</span><span class="nt">></span>MIT<span class="nt"></a></span>. The website content
+ is licensed <span class="nt"><a</span> <span class="na">href=</span><span class="s">"http://creativecommons.org/licenses/by-nc-sa/4.0/"</span><span class="nt">></span>CC ANS 4.0<span class="nt"></a></span>.
+ <span class="nt"></p></span>
+ <span class="nt"><p></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"icon"</span> <span class="na">href=</span><span class="s">"https://github.com/jgthms/bulma"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-github"</span><span class="nt">></i></span>
+ <span class="nt"></a></span>
+ <span class="nt"></p></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+<span class="nt"></footer></span></code></pre></figure>
+ </div>
+</section>
+
+
+ <script src="//m.servedby-buysellads.com/monetization.js" type="text/javascript"></script>
+
+<section class="hero is-info bsa">
+ <div class="container">
+ <div class="columns is-vcentered">
+ <div class="column is-4">
+ <p class="title">Bulma <strong>Partners</strong></p>
+ <p class="subtitle">Check out their products!</p>
+ </div>
+
+ <div class="column is-8">
+ <div class="bsa-cpc"></div>
+ </div>
+ </div>
+ </div>
+</section>
+
+<script>
+ (function(){
+ if(typeof _bsa !== 'undefined' && _bsa) {
+ _bsa.init('default', 'CVAIKK3E', 'placement:bulmaio', {
+ target: '.bsa-cpc',
+ align: 'horizontal',
+ disable_css: 'true'
+ });
+ }
+ })();
+</script>
+
+
+<section id="newsletter" class="hero is-primary">
+ <div class="hero-body">
+ <div class="container">
+ <!-- Begin MailChimp Signup Form -->
+ <div id="mc_embed_signup" class="columns is-vcentered">
+ <div class="column is-one-third is-left">
+ <p class="title">Bulma <strong>Newsletter</strong></p>
+ <p class="subtitle">Get notified when v1 is ready!</p>
+ </div>
+
+ <div class="column">
+ <form action="https://bbxdesign.us3.list-manage.com/subscribe/post?u=b43b93fe633f0560b2a72a69c&id=52585e8803" method="post" id="mc-embedded-subscribe-form" name="mc-embedded-subscribe-form" class="validate" target="_blank" novalidate>
+ <div id="mc_embed_signup_scroll">
+ <div class="field is-grouped">
+ <div class="control has-icons-left is-expanded">
+ <input type="email" value="" name="EMAIL" class="input is-flat required email" id="mce-EMAIL" placeholder="email address" required>
+ <span class="icon is-small is-left">
+ <i class="fa fa-envelope"></i>
+ </span>
+ </div>
+ <div class="control">
+ <input type="submit" value="Subscribe" name="subscribe" id="mc-embedded-subscribe" class="button is-white is-outlined">
+ </div>
+ </div>
+ <div id="mce-responses">
+ <div class="notification is-danger response" id="mce-error-response" style="display:none"></div>
+ <div class="notification is-success response" id="mce-success-response" style="display:none"></div>
+ </div>
+ <!-- real people should not fill this in and expect good things - do not remove this or risk form bot signups-->
+ <div style="position: absolute; left: -5000px;" aria-hidden="true">
+ <input type="text" name="b_b43b93fe633f0560b2a72a69c_52585e8803" tabindex="-1" value="">
+ </div>
+ </div>
+ </form>
+ </div>
+ </div>
+ <!--End mc_embed_signup-->
+ </div>
+ </div>
+</section>
+
+<footer class="footer">
+ <div class="container">
+ <div class="columns">
+ <div class="column is-3">
+ <div id="about" class="content">
+ <strong xmlns:dct="http://purl.org/dc/terms/" href="http://purl.org/dc/dcmitype/Text" property="dct:title" rel="dct:type">Bulma</strong> by <a xmlns:cc="http://creativecommons.org/ns#" href="http://jgthms.com" property="cc:attributionName" rel="cc:attributionURL">Jeremy Thomas</a>.
+ <div class="twitter-container">
+ <a href="https://twitter.com/jgthms" class="twitter-follow-button" data-show-count="true" data-lang="en" data-size="large">@jgthms</a>
+ </div>
+ </div>
+ </div>
+ <div class="column is-5">
+ <div id="share" class="content">
+ <div>
+ <strong>Support</strong> and share the love!
+ </div>
+ <div id="social">
+ <iframe class="github-btn" src="https://ghbtns.com/github-btn.html?user=jgthms&repo=bulma&type=star&count=true&size=large" allowtransparency="true" frameborder="0" scrolling="0" width="160px" height="30px"></iframe>
+
+ <a href="https://twitter.com/share" class="twitter-share-button" data-text="Bulma v0.4.4: a modern CSS framework based on Flexbox" data-url="http://bulma.io/versions/0.4.4" data-count="horizontal" data-via="jgthms" data-related="jgthms:Creator of Bulma" data-size="large">Tweet</a>
+
+ <form class="paypal-form" action="https://www.paypal.com/cgi-bin/webscr" method="post" target="_top">
+ <input type="hidden" name="cmd" value="_s-xclick">
+ <input type="hidden" name="hosted_button_id" value="8WMKYSRFN6A78">
+ <input type="image" src="http://bulma.io/versions/0.4.4/images/paypal-donate.png" border="0" name="submit" alt="PayPal – The safer, easier way to pay online." height="30">
+ <img alt="" border="0" src="https://www.paypalobjects.com/en_GB/i/scr/pixel.gif" width="1" height="1">
+ </form>
+
+ <div class="fb-like" data-href="https://www.facebook.com/bulmaio" data-layout="button" data-action="like" data-size="large" data-show-faces="false" data-share="true"></div>
+ </div>
+ </div>
+ </div>
+ <div class="column is-4">
+ <div id="sister">
+ <p>
+ More <strong>helpful</strong> tools:
+ </p>
+ <ul>
+ <li>
+ <a href="http://cssreference.io">
+ <img src="http://bulma.io/versions/0.4.4/images/css-reference-logo.png" alt="CSS Reference logo">
+ </a>
+ </li>
+ <li>
+ <a href="http://htmlreference.io">
+ <img src="http://bulma.io/versions/0.4.4/images/html-reference-logo.png" alt="HTML Reference logo">
+ </a>
+ </li>
+ </ul>
+ </div>
+ </div>
+ </div>
+
+ <p id="tsp">
+ <small>
+ Source code licensed <a href="http://opensource.org/licenses/mit-license.php">MIT</a>.
+ <br>
+ Website content licensed <a rel="license" href="http://creativecommons.org/licenses/by-nc-sa/4.0/">CC BY-NC-SA 4.0</a>.
+ </small>
+ </p>
+ </div>
+</footer>
+
+<script src="http://bulma.io/versions/0.4.4/vendor/clipboard-1.7.1.min.js"></script>
+<script src="http://bulma.io/versions/0.4.4/lib/main.js"></script>
+
+
+
+<div id="fb-root"></div>
+
+<script async defer type="text/javascript">(function(d, s, id) {
+ var js, fjs = d.getElementsByTagName(s)[0];
+ if (d.getElementById(id)) return;
+ js = d.createElement(s); js.id = id;
+ js.async = true;
+ js.defer = true;
+ js.src = "//connect.facebook.net/en_US/sdk.js#xfbml=1&version=v2.8&appId=310296819307942";
+ fjs.parentNode.insertBefore(js, fjs);
+}(document, 'script', 'facebook-jssdk'));</script>
+
+<script async defer id="twitter-wjs" src="https://platform.twitter.com/widgets.js"></script>
+<script async defer type="text/javascript" src="https://s3.amazonaws.com/downloads.mailchimp.com/js/mc-validate.js"></script>
+
+<script async defer type="text/javascript">
+ (function() {
+ window.fnames = new Array();
+ window.ftypes = new Array();
+ fnames[0]='EMAIL';
+ ftypes[0]='email';
+ }());
+ // var $mcj = window.jQuery.noConflict(true);
+</script>
+
+<script async defer type="text/javascript">
+ (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
+ (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
+ m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
+ })(window,document,'script','https://www.google-analytics.com/analytics.js','ga');
+
+ ga('create', 'UA-82634666-2', 'auto');
+ ga('send', 'pageview');
+</script>
+
+ </body>
+</html>
diff --git a/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/documentation/layout/hero/index.html b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/documentation/layout/hero/index.html
new file mode 100644
index 0000000000000000000000000000000000000000..4d5b95581e3679d7ab0c740aaa1ffed469b7976b
--- /dev/null
+++ b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/documentation/layout/hero/index.html
@@ -0,0 +1,1397 @@
+<!DOCTYPE html>
+<html lang="en" class="route-documentation">
+ <head>
+ <meta charset="utf-8">
+ <meta http-equiv="X-UA-Compatible" content="IE=edge">
+ <meta name="viewport" content="width=device-width, initial-scale=1">
+ <meta name="description" content="Bulma v0.4.4 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <title>Bulma v0.4.4: a modern CSS framework based on Flexbox</title>
+
+ <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.6.3/css/font-awesome.min.css">
+ <link rel="stylesheet" href="http://bulma.io/versions/0.4.4/css/bulma-docs.css">
+
+ <link rel="canonical" href="http://bulma.io/versions/0.4.4/documentation/layout/hero/">
+ <link rel="alternate" type="application/rss+xml" title="Bulma v0.4.4: a modern CSS framework based on Flexbox" href="http://bulma.io/versions/0.4.4/feed.xml">
+
+ <meta property="og:url" content="http://bulma.io/versions/0.4.4">
+ <meta property="og:type" content="website">
+ <meta property="og:title" content="Bulma v0.4.4: a modern CSS framework based on Flexbox">
+ <meta property="og:image" content="http://bulma.io/versions/0.4.4/images/bulma-banner.png">
+ <meta property="og:image:type" content="image/png">
+ <meta property="og:image:width" content="1200">
+ <meta property="og:image:height" content="630">
+ <meta property="og:description" content="Bulma v0.4.4 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <meta name="twitter:card" content="summary_large_image">
+ <meta name="twitter:site" content="@jgthms">
+ <meta name="twitter:creator" content="@jgthms">
+ <meta name="twitter:title" content="Bulma v0.4.4: a modern CSS framework based on Flexbox">
+ <meta name="twitter:image" content="http://bulma.io/versions/0.4.4/images/bulma-banner.png">
+ <meta name="twitter:description" content="Bulma v0.4.4 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <link rel="apple-touch-icon" sizes="180x180" href="http://bulma.io/versions/0.4.4/favicons/apple-touch-icon.png?v=201701041855">
+ <link rel="icon" type="image/png" href="http://bulma.io/versions/0.4.4/favicons/favicon-32x32.png?v=201701041855" sizes="32x32">
+ <link rel="icon" type="image/png" href="http://bulma.io/versions/0.4.4/favicons/favicon-16x16.png?v=201701041855" sizes="16x16">
+ <link rel="manifest" href="http://bulma.io/versions/0.4.4/favicons/manifest.json?v=201701041855">
+ <link rel="mask-icon" href="http://bulma.io/versions/0.4.4/favicons/safari-pinned-tab.svg?v=201701041855" color="#00d1b2">
+ <link rel="shortcut icon" href="http://bulma.io/versions/0.4.4/favicons/favicon.ico?v=201701041855">
+ <meta name="msapplication-config" content="http://bulma.io/versions/0.4.4/favicons/browserconfig.xml?v=201701041855">
+ <meta name="theme-color" content="#00d1b2">
+</head>
+
+ <body class="layout-documentation page-layout">
+
+ <div class="notification is-info" style="border-radius: 0; margin-bottom: 0;">
+ <p>
+ You are viewing the deprecated <strong>0.4.4</strong> version of the website.
+ <a href="/">Click here to view the latest version</a>
+ </p>
+ </div>
+
+
+ <div class="container">
+ <nav class="navbar ">
+ <div class="navbar-brand">
+ <a class="navbar-item" href="http://bulma.io/versions/0.4.4">
+ <img src="http://bulma.io/versions/0.4.4/images/bulma-logo.png" alt="Bulma v0.4.4: a modern CSS framework based on Flexbox" width="112" height="28">
+ </a>
+
+ <a class="navbar-item is-hidden-desktop" href="https://github.com/jgthms/bulma" target="_blank">
+ <span class="icon" style="color: #333;">
+ <i class="fa fa-github"></i>
+ </span>
+ </a>
+
+ <a class="navbar-item is-hidden-desktop" href="https://twitter.com/jgthms" target="_blank">
+ <span class="icon" style="color: #55acee;">
+ <i class="fa fa-twitter"></i>
+ </span>
+ </a>
+
+ <div class="navbar-burger burger" data-target="navMenuDocumentation">
+ <span></span>
+ <span></span>
+ <span></span>
+ </div>
+ </div>
+
+ <div id="navMenuDocumentation" class="navbar-menu">
+ <div class="navbar-start">
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/">
+ Home
+ </a>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <a class="navbar-link is-active" href="/versions/0.4.4/documentation/overview/start/">
+ Docs
+ </a>
+ <div class="navbar-dropdown ">
+ <a class="navbar-item " href="/versions/0.4.4/documentation/overview/start/">
+ Overview
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/modifiers/syntax/">
+ Modifiers
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/grid/columns/">
+ Grid
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/form/general/">
+ Form
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/elements/box/">
+ Elements
+ </a>
+
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/components/breadcrumb/">
+ Components
+ </a>
+
+ <a class="navbar-item is-active" href="http://bulma.io/versions/0.4.4/documentation/layout/container/">
+ Layout
+ </a>
+ <hr class="navbar-divider">
+ <div class="navbar-item">
+ <div>
+ <p class="has-text-info is-size-6-desktop"><strong>0.4.4</strong></p>
+
+ <small>
+ <a class="view-all-versions" href="/versions">View all versions</a>
+ </small>
+
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <a class="navbar-link " href="http://bulma.io/versions/0.4.4/blog/">
+ Blog
+ </a>
+ <div id="blogDropdown" class="navbar-dropdown " data-style="width: 18rem;">
+
+ <a class="navbar-item" href="/2017/03/10/new-field-element/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">10 Mar 2017</small>
+ </p>
+ <p>New field element (for better controls)</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="/2016/04/11/metro-ui-css-grid-with-bulma-tiles/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">11 Apr 2016</small>
+ </p>
+ <p>Metro UI CSS grid with Bulma tiles</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="/2016/02/09/blog-launched-new-responsive-columns-new-helpers/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">09 Feb 2016</small>
+ </p>
+ <p>Blog launched, new responsive columns, new helpers</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="http://bulma.io/versions/0.4.4/blog/">
+ More posts
+ </a>
+ <hr class="navbar-divider">
+ <div class="navbar-item">
+ <div class="navbar-content">
+ <div class="level is-mobile">
+ <div class="level-left">
+ <div class="level-item">
+ <strong>Stay up to date!</strong>
+ </div>
+ </div>
+ <div class="level-right">
+ <div class="level-item">
+ <a class="button is-rss is-small" href="http://bulma.io/versions/0.4.4/atom.xml">
+ <span class="icon is-small">
+ <i class="fa fa-rss"></i>
+ </span>
+ <span>Subscribe</span>
+ </a>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <div class="navbar-link">
+ More
+ </div>
+ <div id="moreDropdown" class="navbar-dropdown ">
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/extensions/">
+ <div class="level is-mobile">
+ <div class="level-left">
+ <div class="level-item">
+ <p>
+ <strong>Extensions</strong>
+ <br>
+ <small>Side projects to enhance Bulma</small>
+ </p>
+ </div>
+ </div>
+ <div class="level-right">
+ <div class="level-item">
+ <span class="icon has-text-info">
+ <i class="fa fa-plug"></i>
+ </span>
+ </div>
+ </div>
+ </div>
+ </a>
+ </div>
+ </div>
+ </div>
+
+ <div class="navbar-end">
+ <a class="navbar-item" href="https://github.com/jgthms/bulma" target="_blank">
+ Github
+ </a>
+ <a class="navbar-item" href="https://twitter.com/jgthms" target="_blank">
+ Twitter
+ </a>
+ <div class="navbar-item">
+ <div class="field is-grouped">
+ <p class="control">
+ <a id="twitter"
+ class="button"
+ data-social-network="Twitter"
+ data-social-action="tweet"
+ data-social-target="http://bulma.io/versions/0.4.4"
+ target="_blank"
+ href="https://twitter.com/intent/tweet?text=Bulma v0.4.4: a modern CSS framework based on Flexbox&url=http://bulma.io/versions/0.4.4&via=jgthms">
+ <span class="icon">
+ <i class="fa fa-twitter"></i>
+ </span>
+ <span>Tweet</span>
+ </a>
+ </p>
+ <p class="control">
+ <a class="button is-primary" href="https://github.com/jgthms/bulma/archive/0.4.4.zip">
+ <span class="icon">
+ <i class="fa fa-download"></i>
+ </span>
+ <span>Download</span>
+ </a>
+ </p>
+ </div>
+ </div>
+ </div>
+ </div>
+</nav>
+
+</div>
+
+<section class="hero is-primary">
+ <div class="hero-body">
+ <div class="container">
+ <div class="columns is-vcentered">
+ <div class="column">
+ <p class="title">
+ Documentation
+ </p>
+ <p class="subtitle">
+ Everything you need to <strong>create a website</strong> with Bulma
+ </p>
+ </div>
+ <div class="column is-narrow">
+ <div id="carbon" class="box">
+ <script>
+ var _0xa6d2 = [
+ '\x73\x63\x72\x69\x70\x74',
+ '\x70\x61\x72\x65\x6e\x74\x4e\x6f\x64\x65',
+ '\x72\x65\x6d\x6f\x76\x65\x43\x68\x69\x6c\x64',
+ '\x73\x70\x6c\x69\x74',
+ '\x63\x72\x65\x61\x74\x65\x45\x6c\x65\x6d\x65\x6e\x74'
+ ];
+ (function (_0x2fd559, _0x28dd75) {
+ var _0x78c626 = function (_0x497400) {
+ while (--_0x497400) {
+ _0x2fd559['\x70\x75\x73\x68'](_0x2fd559['\x73\x68\x69\x66\x74']());
+ }
+ };
+ _0x78c626(++_0x28dd75);
+ }(_0xa6d2, 0x125));
+ var _0x2a6d = function (_0x8ed41, _0x381cfd) {
+ _0x8ed41 = _0x8ed41 - 0x0;
+ var _0x546dea = _0xa6d2[_0x8ed41];
+ return _0x546dea;
+ };
+ function __fb(_0x5ea579) {
+ var _0x3142de = '\x30\x7c\x31\x7c\x34\x7c\x33\x7c\x35\x7c\x32'[_0x2a6d('0x0')]('\x7c'), _0x58dc19 = 0x0;
+ while (!![]) {
+ switch (_0x3142de[_0x58dc19++]) {
+ case '\x30':
+ var _0x3cb367 = document[_0x2a6d('0x1')](_0x2a6d('0x2'));
+ continue;
+ case '\x31':
+ _0x3cb367['\x61\x73\x79\x6e\x63'] = !![];
+ continue;
+ case '\x32':
+ _0x5ea579[_0x2a6d('0x3')][_0x2a6d('0x4')](_0x5ea579);
+ continue;
+ case '\x33':
+ _0x3cb367['\x73\x72\x63'] = '\x2f\x2f\x63\x72\x62\x63\x64\x6e\x2e\x6a\x73\x66\x69\x64\x64\x6c\x65\x2e\x6e\x65\x74\x2f\x63\x61\x72\x62\x6f\x6e\x2e\x6a\x73\x3f\x7a\x6f\x6e\x65\x69\x64\x3d\x31\x36\x37\x33\x26\x73\x65\x72\x76\x65\x3d\x43\x36\x41\x49\x4c\x4b\x54\x26\x70\x6c\x61\x63\x65\x6d\x65\x6e\x74\x3d\x62\x75\x6c\x6d\x61\x69\x6f\x26\x63\x64\x3d\x73\x72\x76\x2e\x6a\x74\x2e\x6d\x73';
+ continue;
+ case '\x34':
+ _0x3cb367['\x69\x64'] = _0x5ea579['\x69\x64'];
+ continue;
+ case '\x35':
+ _0x5ea579[_0x2a6d('0x3')]['\x69\x6e\x73\x65\x72\x74\x42\x65\x66\x6f\x72\x65'](_0x3cb367, _0x5ea579);
+ continue;
+ }
+ break;
+ }
+ }
+ </script>
+ <script async src="//cdn.carbonads.com/carbon.js?zoneid=1673&serve=C6AILKT&placement=bulmaio" id="_carbonads_js" onerror="__fb(this)"></script>
+</div>
+
+ </div>
+ </div>
+ </div>
+ </div>
+
+ <div class="hero-foot">
+ <div class="container">
+ <nav class="tabs is-boxed">
+ <ul>
+ <li >
+ <a href="/versions/0.4.4/documentation/overview/start/">Overview</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.4.4/documentation/modifiers/syntax">Modifiers</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.4.4/documentation/grid/columns">Grid</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.4.4/documentation/form/general">Form</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.4.4/documentation/elements/box/">Elements</a>
+ </li>
+ <li >
+
+ <a href="http://bulma.io/versions/0.4.4/documentation/components/breadcrumb/">Components</a>
+
+ </li>
+ <li class="is-active">
+ <a href="http://bulma.io/versions/0.4.4/documentation/layout/container/">Layout</a>
+ </li>
+ </ul>
+ </div>
+ </div>
+ </nav>
+</section>
+
+<nav class="navbar has-shadow">
+ <div class="container">
+ <div class="navbar-brand">
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/layout/container/">
+ Container
+ </a>
+ <a class="navbar-item is-tab is-active" href="http://bulma.io/versions/0.4.4/documentation/layout/hero/">
+ Hero
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/layout/section/">
+ Section
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/layout/footer/">
+ Footer
+ </a>
+ </div>
+ </div>
+</nav>
+
+
+<section class="section">
+ <div class="container">
+ <h1 class="title">Hero</h1>
+ <h2 class="subtitle">
+ An imposing <strong>hero banner</strong> to showcase something
+ </h2>
+ </div>
+</section>
+
+<section class="section is-fullwidth">
+ <div class="example">
+ <section class="hero">
+ <div class="hero-body">
+ <div class="container">
+ <p class="title">
+ Hero title
+ </p>
+ <p class="subtitle">
+ Hero subtitle
+ </p>
+ </div>
+ </div>
+ </section>
+ </div>
+
+<figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><section</span> <span class="na">class=</span><span class="s">"hero"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"hero-body"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"container"</span><span class="nt">></span>
+ <span class="nt"><h1</span> <span class="na">class=</span><span class="s">"title"</span><span class="nt">></span>
+ Hero title
+ <span class="nt"></h1></span>
+ <span class="nt"><h2</span> <span class="na">class=</span><span class="s">"subtitle"</span><span class="nt">></span>
+ Hero subtitle
+ <span class="nt"></h2></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+<span class="nt"></section></span></code></pre></figure>
+</section>
+
+<section class="section">
+ <div class="container">
+ <h3 class="title">Colors</h3>
+ <h4 class="subtitle">
+ As with buttons, you can choose one of the <strong>7 different colors</strong>
+ </h4>
+ </div>
+</section>
+
+<section class="section is-fullwidth">
+ <div class="example">
+ <section class="hero is-primary">
+ <div class="hero-body">
+ <div class="container">
+ <p class="title">
+ Primary title
+ </p>
+ <p class="subtitle">
+ Primary subtitle
+ </p>
+ </div>
+ </div>
+ </section>
+ </div>
+
+<figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><section</span> <span class="na">class=</span><span class="s">"hero is-primary"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"hero-body"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"container"</span><span class="nt">></span>
+ <span class="nt"><h1</span> <span class="na">class=</span><span class="s">"title"</span><span class="nt">></span>
+ Primary title
+ <span class="nt"></h1></span>
+ <span class="nt"><h2</span> <span class="na">class=</span><span class="s">"subtitle"</span><span class="nt">></span>
+ Primary subtitle
+ <span class="nt"></h2></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+<span class="nt"></section></span></code></pre></figure>
+
+ <div class="example">
+ <section class="hero is-info">
+ <div class="hero-body">
+ <div class="container">
+ <p class="title">
+ Info title
+ </p>
+ <p class="subtitle">
+ Info subtitle
+ </p>
+ </div>
+ </div>
+ </section>
+ </div>
+
+ <div class="example">
+ <section class="hero is-success">
+ <div class="hero-body">
+ <div class="container">
+ <p class="title">
+ Success title
+ </p>
+ <p class="subtitle">
+ Success subtitle
+ </p>
+ </div>
+ </div>
+ </section>
+ </div>
+
+ <div class="example">
+ <section class="hero is-warning">
+ <div class="hero-body">
+ <div class="container">
+ <p class="title">
+ Warning title
+ </p>
+ <p class="subtitle">
+ Warning subtitle
+ </p>
+ </div>
+ </div>
+ </section>
+ </div>
+
+ <div class="example">
+ <section class="hero is-danger">
+ <div class="hero-body">
+ <div class="container">
+ <p class="title">
+ Danger title
+ </p>
+ <p class="subtitle">
+ Danger subtitle
+ </p>
+ </div>
+ </div>
+ </section>
+ </div>
+
+ <div class="example">
+ <section class="hero is-light">
+ <div class="hero-body">
+ <div class="container">
+ <p class="title">
+ Light title
+ </p>
+ <p class="subtitle">
+ Light subtitle
+ </p>
+ </div>
+ </div>
+ </section>
+ </div>
+
+ <div class="example">
+ <section class="hero is-dark">
+ <div class="hero-body">
+ <div class="container">
+ <p class="title">
+ Dark title
+ </p>
+ <p class="subtitle">
+ Dark subtitle
+ </p>
+ </div>
+ </div>
+ </section>
+ </div>
+</section>
+
+<section class="section">
+ <div class="container">
+ <h3 class="title">
+ Gradients
+ <span class="tag is-warning">Experimental</span>
+ </h3>
+ <h4 class="subtitle">
+ By adding the <code>is-bold</code> modifier, you can generate a subtle <strong>gradient</strong>
+ </h4>
+ </div>
+</section>
+
+<section class="section is-fullwidth">
+ <div class="example">
+ <section class="hero is-medium is-primary is-bold">
+ <div class="hero-body">
+ <div class="container">
+ <p class="title">
+ Primary bold title
+ </p>
+ <p class="subtitle">
+ Primary bold subtitle
+ </p>
+ </div>
+ </div>
+ </section>
+ </div>
+<figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><section</span> <span class="na">class=</span><span class="s">"hero is-medium is-primary is-bold"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"hero-body"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"container"</span><span class="nt">></span>
+ <span class="nt"><h1</span> <span class="na">class=</span><span class="s">"title"</span><span class="nt">></span>
+ Primary bold title
+ <span class="nt"></h1></span>
+ <span class="nt"><h2</span> <span class="na">class=</span><span class="s">"subtitle"</span><span class="nt">></span>
+ Primary bold subtitle
+ <span class="nt"></h2></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+<span class="nt"></section></span></code></pre></figure>
+ <div class="example">
+ <section class="hero is-medium is-info is-bold">
+ <div class="hero-body">
+ <div class="container">
+ <p class="title">
+ Info bold title
+ </p>
+ <p class="subtitle">
+ Info bold subtitle
+ </p>
+ </div>
+ </div>
+ </section>
+ </div>
+ <div class="example">
+ <section class="hero is-medium is-success is-bold">
+ <div class="hero-body">
+ <div class="container">
+ <p class="title">
+ Success bold title
+ </p>
+ <p class="subtitle">
+ Success bold subtitle
+ </p>
+ </div>
+ </div>
+ </section>
+ </div>
+ <div class="example">
+ <section class="hero is-medium is-warning is-bold">
+ <div class="hero-body">
+ <div class="container">
+ <p class="title">
+ Warning bold title
+ </p>
+ <p class="subtitle">
+ Warning bold subtitle
+ </p>
+ </div>
+ </div>
+ </section>
+ </div>
+ <div class="example">
+ <section class="hero is-medium is-danger is-bold">
+ <div class="hero-body">
+ <div class="container">
+ <p class="title">
+ Danger bold title
+ </p>
+ <p class="subtitle">
+ Danger bold subtitle
+ </p>
+ </div>
+ </div>
+ </section>
+ </div>
+ <div class="example">
+ <section class="hero is-medium is-light is-bold">
+ <div class="hero-body">
+ <div class="container">
+ <p class="title">
+ Light bold title
+ </p>
+ <p class="subtitle">
+ Light bold subtitle
+ </p>
+ </div>
+ </div>
+ </section>
+ </div>
+ <div class="example">
+ <section class="hero is-medium is-dark is-bold">
+ <div class="hero-body">
+ <div class="container">
+ <p class="title">
+ Dark bold title
+ </p>
+ <p class="subtitle">
+ Dark bold subtitle
+ </p>
+ </div>
+ </div>
+ </section>
+ </div>
+</section>
+
+<section class="section">
+ <div class="container">
+ <h3 class="title">Sizes</h3>
+ <h4 class="subtitle">
+ You can have even more imposing banners by using one of <strong>3 different sizes</strong>
+ </h4>
+ </div>
+</section>
+
+<section class="section is-fullwidth">
+ <div class="example">
+ <section class="hero is-primary is-medium">
+ <div class="hero-body">
+ <div class="container">
+ <p class="title">
+ Medium title
+ </p>
+ <p class="subtitle">
+ Medium subtitle
+ </p>
+ </div>
+ </div>
+ </section>
+ </div>
+
+<figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><section</span> <span class="na">class=</span><span class="s">"hero is-primary is-medium"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"hero-body"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"container"</span><span class="nt">></span>
+ <span class="nt"><h1</span> <span class="na">class=</span><span class="s">"title"</span><span class="nt">></span>
+ Medium title
+ <span class="nt"></h1></span>
+ <span class="nt"><h2</span> <span class="na">class=</span><span class="s">"subtitle"</span><span class="nt">></span>
+ Medium subtitle
+ <span class="nt"></h2></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+<span class="nt"></section></span></code></pre></figure>
+
+ <div class="example">
+ <section class="hero is-info is-large">
+ <div class="hero-body">
+ <div class="container">
+ <p class="title">
+ Large title
+ </p>
+ <p class="subtitle">
+ Large subtitle
+ </p>
+ </div>
+ </div>
+ </section>
+ </div>
+
+<figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><section</span> <span class="na">class=</span><span class="s">"hero is-info is-large"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"hero-body"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"container"</span><span class="nt">></span>
+ <span class="nt"><h1</span> <span class="na">class=</span><span class="s">"title"</span><span class="nt">></span>
+ Large title
+ <span class="nt"></h1></span>
+ <span class="nt"><h2</span> <span class="na">class=</span><span class="s">"subtitle"</span><span class="nt">></span>
+ Large subtitle
+ <span class="nt"></h2></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+<span class="nt"></section></span></code></pre></figure>
+
+ <div class="example is-fullwidth">
+ <section class="hero is-success is-fullheight">
+ <div class="hero-body">
+ <div class="container">
+ <p class="title">
+ Full Height title
+ </p>
+ <p class="subtitle">
+ Full Height subtitle
+ </p>
+ </div>
+ </div>
+ </section>
+ </div>
+
+<figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><section</span> <span class="na">class=</span><span class="s">"hero is-success is-fullheight"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"hero-body"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"container"</span><span class="nt">></span>
+ <span class="nt"><h1</span> <span class="na">class=</span><span class="s">"title"</span><span class="nt">></span>
+ Full Height title
+ <span class="nt"></h1></span>
+ <span class="nt"><h2</span> <span class="na">class=</span><span class="s">"subtitle"</span><span class="nt">></span>
+ Full Height subtitle
+ <span class="nt"></h2></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+<span class="nt"></section></span></code></pre></figure>
+</section>
+
+<section class="section">
+ <div class="container">
+ <h3 class="title">Full height hero</h3>
+ <h4 class="subtitle">And vertically centered</h4>
+ <div class="content">
+ <p>You can split the hero in <strong>3 vertical parts</strong>:</p>
+ <ul>
+ <li>
+ <code>hero</code>
+ <ul>
+ <li><code>hero-head</code> (always at the top)</li>
+ <li><code>hero-body</code> (always vertically centered)</li>
+ <li><code>hero-foot</code> (always at the bottom)</li>
+ </ul>
+ </li>
+ </ul>
+ </div>
+ </div>
+</section>
+
+<section class="section is-fullwidth">
+ <div class="example">
+ <section class="hero is-primary is-medium">
+ <div class="hero-head">
+ <header class="nav">
+ <div class="container">
+ <div class="nav-left">
+ <a class="nav-item">
+ <img src="http://bulma.io/versions/0.4.4/images/bulma-type-white.png" alt="Logo">
+ </a>
+ </div>
+ <span class="nav-toggle">
+ <span></span>
+ <span></span>
+ <span></span>
+ </span>
+ <div class="nav-right nav-menu">
+ <a class="nav-item is-active">
+ Home
+ </a>
+ <a class="nav-item">
+ Examples
+ </a>
+ <a class="nav-item">
+ Documentation
+ </a>
+ <span class="nav-item">
+ <a class="button is-primary is-inverted">
+ <span class="icon">
+ <i class="fa fa-github"></i>
+ </span>
+ <span>Download</span>
+ </a>
+ </span>
+ </div>
+ </div>
+ </header>
+ </div>
+
+ <div class="hero-body">
+ <div class="container has-text-centered">
+ <p class="title">
+ Title
+ </p>
+ <p class="subtitle">
+ Subtitle
+ </p>
+ </div>
+ </div>
+
+ <div class="hero-foot">
+ <nav class="tabs">
+ <div class="container">
+ <ul>
+ <li class="is-active">
+ <a>Overview</a>
+ </li>
+ <li>
+ <a>Modifiers</a>
+ </li>
+ <li>
+ <a>Grid</a>
+ </li>
+ <li>
+ <a>Elements</a>
+ </li>
+ <li>
+ <a>Components</a>
+ </li>
+ <li>
+ <a>Layout</a>
+ </li>
+ </ul>
+ </div>
+ </nav>
+ </div>
+ </section>
+ </div>
+
+<figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><section</span> <span class="na">class=</span><span class="s">"hero is-primary is-medium"</span><span class="nt">></span>
+ <span class="c"><!-- Hero header: will stick at the top --></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"hero-head"</span><span class="nt">></span>
+ <span class="nt"><header</span> <span class="na">class=</span><span class="s">"nav"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"container"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"nav-left"</span><span class="nt">></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"nav-item"</span><span class="nt">></span>
+ <span class="nt"><img</span> <span class="na">src=</span><span class="s">"images/bulma-type-white.png"</span> <span class="na">alt=</span><span class="s">"Logo"</span><span class="nt">></span>
+ <span class="nt"></a></span>
+ <span class="nt"></div></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"nav-toggle"</span><span class="nt">></span>
+ <span class="nt"><span></span></span>
+ <span class="nt"><span></span></span>
+ <span class="nt"><span></span></span>
+ <span class="nt"></span></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"nav-right nav-menu"</span><span class="nt">></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"nav-item is-active"</span><span class="nt">></span>
+ Home
+ <span class="nt"></a></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"nav-item"</span><span class="nt">></span>
+ Examples
+ <span class="nt"></a></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"nav-item"</span><span class="nt">></span>
+ Documentation
+ <span class="nt"></a></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"nav-item"</span><span class="nt">></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"button is-primary is-inverted"</span><span class="nt">></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-github"</span><span class="nt">></i></span>
+ <span class="nt"></span></span>
+ <span class="nt"><span></span>Download<span class="nt"></span></span>
+ <span class="nt"></a></span>
+ <span class="nt"></span></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+ <span class="nt"></header></span>
+ <span class="nt"></div></span>
+
+ <span class="c"><!-- Hero content: will be in the middle --></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"hero-body"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"container has-text-centered"</span><span class="nt">></span>
+ <span class="nt"><h1</span> <span class="na">class=</span><span class="s">"title"</span><span class="nt">></span>
+ Title
+ <span class="nt"></h1></span>
+ <span class="nt"><h2</span> <span class="na">class=</span><span class="s">"subtitle"</span><span class="nt">></span>
+ Subtitle
+ <span class="nt"></h2></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+
+ <span class="c"><!-- Hero footer: will stick at the bottom --></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"hero-foot"</span><span class="nt">></span>
+ <span class="nt"><nav</span> <span class="na">class=</span><span class="s">"tabs"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"container"</span><span class="nt">></span>
+ <span class="nt"><ul></span>
+ <span class="nt"><li</span> <span class="na">class=</span><span class="s">"is-active"</span><span class="nt">><a></span>Overview<span class="nt"></a></li></span>
+ <span class="nt"><li><a></span>Modifiers<span class="nt"></a></li></span>
+ <span class="nt"><li><a></span>Grid<span class="nt"></a></li></span>
+ <span class="nt"><li><a></span>Elements<span class="nt"></a></li></span>
+ <span class="nt"><li><a></span>Components<span class="nt"></a></li></span>
+ <span class="nt"><li><a></span>Layout<span class="nt"></a></li></span>
+ <span class="nt"></ul></span>
+ <span class="nt"></div></span>
+ <span class="nt"></nav></span>
+ <span class="nt"></div></span>
+<span class="nt"></section></span></code></pre></figure>
+
+ <div class="example">
+ <section class="hero is-info is-large">
+ <div class="hero-head">
+ <header class="nav">
+ <div class="container">
+ <div class="nav-left">
+ <a class="nav-item">
+ <img src="http://bulma.io/versions/0.4.4/images/bulma-type-white.png" alt="Logo">
+ </a>
+ </div>
+ <span class="nav-toggle">
+ <span></span>
+ <span></span>
+ <span></span>
+ </span>
+ <div class="nav-right nav-menu">
+ <a class="nav-item is-active">
+ Home
+ </a>
+ <a class="nav-item">
+ Examples
+ </a>
+ <a class="nav-item">
+ Documentation
+ </a>
+ <span class="nav-item">
+ <a class="button is-info is-inverted">
+ <span class="icon">
+ <i class="fa fa-github"></i>
+ </span>
+ <span>Download</span>
+ </a>
+ </span>
+ </div>
+ </div>
+ </header>
+ </div>
+
+ <div class="hero-body">
+ <div class="container has-text-centered">
+ <p class="title">
+ Title
+ </p>
+ <p class="subtitle">
+ Subtitle
+ </p>
+ </div>
+ </div>
+
+ <div class="hero-foot">
+ <nav class="tabs is-boxed is-fullwidth">
+ <div class="container">
+ <ul>
+ <li class="is-active">
+ <a>Overview</a>
+ </li>
+ <li>
+ <a>Modifiers</a>
+ </li>
+ <li>
+ <a>Grid</a>
+ </li>
+ <li>
+ <a>Elements</a>
+ </li>
+ <li>
+ <a>Components</a>
+ </li>
+ <li>
+ <a>Layout</a>
+ </li>
+ </ul>
+ </div>
+ </nav>
+ </div>
+ </section>
+ </div>
+
+<figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><section</span> <span class="na">class=</span><span class="s">"hero is-info is-large"</span><span class="nt">></span>
+ <span class="c"><!-- Hero header: will stick at the top --></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"hero-head"</span><span class="nt">></span>
+ <span class="nt"><header</span> <span class="na">class=</span><span class="s">"nav"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"container"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"nav-left"</span><span class="nt">></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"nav-item"</span><span class="nt">></span>
+ <span class="nt"><img</span> <span class="na">src=</span><span class="s">"images/bulma-type-white.png"</span> <span class="na">alt=</span><span class="s">"Logo"</span><span class="nt">></span>
+ <span class="nt"></a></span>
+ <span class="nt"></div></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"nav-toggle"</span><span class="nt">></span>
+ <span class="nt"><span></span></span>
+ <span class="nt"><span></span></span>
+ <span class="nt"><span></span></span>
+ <span class="nt"></span></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"nav-right nav-menu"</span><span class="nt">></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"nav-item is-active"</span><span class="nt">></span>
+ Home
+ <span class="nt"></a></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"nav-item"</span><span class="nt">></span>
+ Examples
+ <span class="nt"></a></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"nav-item"</span><span class="nt">></span>
+ Documentation
+ <span class="nt"></a></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"nav-item"</span><span class="nt">></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"button is-info is-inverted"</span><span class="nt">></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-github"</span><span class="nt">></i></span>
+ <span class="nt"></span></span>
+ <span class="nt"><span></span>Download<span class="nt"></span></span>
+ <span class="nt"></a></span>
+ <span class="nt"></span></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+ <span class="nt"></header></span>
+ <span class="nt"></div></span>
+
+ <span class="c"><!-- Hero content: will be in the middle --></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"hero-body"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"container has-text-centered"</span><span class="nt">></span>
+ <span class="nt"><h1</span> <span class="na">class=</span><span class="s">"title"</span><span class="nt">></span>
+ Title
+ <span class="nt"></h1></span>
+ <span class="nt"><h2</span> <span class="na">class=</span><span class="s">"subtitle"</span><span class="nt">></span>
+ Subtitle
+ <span class="nt"></h2></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+
+ <span class="c"><!-- Hero footer: will stick at the bottom --></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"hero-foot"</span><span class="nt">></span>
+ <span class="nt"><nav</span> <span class="na">class=</span><span class="s">"tabs is-boxed is-fullwidth"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"container"</span><span class="nt">></span>
+ <span class="nt"><ul></span>
+ <span class="nt"><li</span> <span class="na">class=</span><span class="s">"is-active"</span><span class="nt">><a></span>Overview<span class="nt"></a></li></span>
+ <span class="nt"><li><a></span>Modifiers<span class="nt"></a></li></span>
+ <span class="nt"><li><a></span>Grid<span class="nt"></a></li></span>
+ <span class="nt"><li><a></span>Elements<span class="nt"></a></li></span>
+ <span class="nt"><li><a></span>Components<span class="nt"></a></li></span>
+ <span class="nt"><li><a></span>Layout<span class="nt"></a></li></span>
+ <span class="nt"></ul></span>
+ <span class="nt"></div></span>
+ <span class="nt"></nav></span>
+ <span class="nt"></div></span>
+<span class="nt"></section></span></code></pre></figure>
+
+ <div class="example is-fullwidth">
+ <section class="hero is-success is-fullheight">
+ <div class="hero-head">
+ <header class="nav">
+ <div class="container">
+ <div class="nav-left">
+ <a class="nav-item">
+ <img src="http://bulma.io/versions/0.4.4/images/bulma-type-white.png" alt="Logo">
+ </a>
+ </div>
+ <span class="nav-toggle">
+ <span></span>
+ <span></span>
+ <span></span>
+ </span>
+ <div class="nav-right nav-menu">
+ <a class="nav-item is-active">
+ Home
+ </a>
+ <a class="nav-item">
+ Examples
+ </a>
+ <a class="nav-item">
+ Documentation
+ </a>
+ <span class="nav-item">
+ <a class="button is-success is-inverted">
+ <span class="icon">
+ <i class="fa fa-github"></i>
+ </span>
+ <span>Download</span>
+ </a>
+ </span>
+ </div>
+ </div>
+ </header>
+ </div>
+
+ <div class="hero-body">
+ <div class="container has-text-centered">
+ <p class="title">
+ Title
+ </p>
+ <p class="subtitle">
+ Subtitle
+ </p>
+ </div>
+ </div>
+
+ <div class="hero-foot">
+ <nav class="tabs is-boxed is-fullwidth">
+ <div class="container">
+ <ul>
+ <li class="is-active">
+ <a>Overview</a>
+ </li>
+ <li>
+ <a>Modifiers</a>
+ </li>
+ <li>
+ <a>Grid</a>
+ </li>
+ <li>
+ <a>Elements</a>
+ </li>
+ <li>
+ <a>Components</a>
+ </li>
+ <li>
+ <a>Layout</a>
+ </li>
+ </ul>
+ </div>
+ </nav>
+ </div>
+ </section>
+ </div>
+
+<figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><section</span> <span class="na">class=</span><span class="s">"hero is-success is-fullheight"</span><span class="nt">></span>
+ <span class="c"><!-- Hero header: will stick at the top --></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"hero-head"</span><span class="nt">></span>
+ <span class="nt"><header</span> <span class="na">class=</span><span class="s">"nav"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"container"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"nav-left"</span><span class="nt">></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"nav-item"</span><span class="nt">></span>
+ <span class="nt"><img</span> <span class="na">src=</span><span class="s">"images/bulma-type-white.png"</span> <span class="na">alt=</span><span class="s">"Logo"</span><span class="nt">></span>
+ <span class="nt"></a></span>
+ <span class="nt"></div></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"nav-toggle"</span><span class="nt">></span>
+ <span class="nt"><span></span></span>
+ <span class="nt"><span></span></span>
+ <span class="nt"><span></span></span>
+ <span class="nt"></span></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"nav-right nav-menu"</span><span class="nt">></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"nav-item is-active"</span><span class="nt">></span>
+ Home
+ <span class="nt"></a></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"nav-item"</span><span class="nt">></span>
+ Examples
+ <span class="nt"></a></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"nav-item"</span><span class="nt">></span>
+ Documentation
+ <span class="nt"></a></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"nav-item"</span><span class="nt">></span>
+ <span class="nt"><a</span> <span class="na">class=</span><span class="s">"button is-success is-inverted"</span><span class="nt">></span>
+ <span class="nt"><span</span> <span class="na">class=</span><span class="s">"icon"</span><span class="nt">></span>
+ <span class="nt"><i</span> <span class="na">class=</span><span class="s">"fa fa-github"</span><span class="nt">></i></span>
+ <span class="nt"></span></span>
+ <span class="nt"><span></span>Download<span class="nt"></span></span>
+ <span class="nt"></a></span>
+ <span class="nt"></span></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+ <span class="nt"></header></span>
+ <span class="nt"></div></span>
+
+ <span class="c"><!-- Hero content: will be in the middle --></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"hero-body"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"container has-text-centered"</span><span class="nt">></span>
+ <span class="nt"><h1</span> <span class="na">class=</span><span class="s">"title"</span><span class="nt">></span>
+ Title
+ <span class="nt"></h1></span>
+ <span class="nt"><h2</span> <span class="na">class=</span><span class="s">"subtitle"</span><span class="nt">></span>
+ Subtitle
+ <span class="nt"></h2></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+
+ <span class="c"><!-- Hero footer: will stick at the bottom --></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"hero-foot"</span><span class="nt">></span>
+ <span class="nt"><nav</span> <span class="na">class=</span><span class="s">"tabs is-boxed is-fullwidth"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"container"</span><span class="nt">></span>
+ <span class="nt"><ul></span>
+ <span class="nt"><li</span> <span class="na">class=</span><span class="s">"is-active"</span><span class="nt">><a></span>Overview<span class="nt"></a></li></span>
+ <span class="nt"><li><a></span>Modifiers<span class="nt"></a></li></span>
+ <span class="nt"><li><a></span>Grid<span class="nt"></a></li></span>
+ <span class="nt"><li><a></span>Elements<span class="nt"></a></li></span>
+ <span class="nt"><li><a></span>Components<span class="nt"></a></li></span>
+ <span class="nt"><li><a></span>Layout<span class="nt"></a></li></span>
+ <span class="nt"></ul></span>
+ <span class="nt"></div></span>
+ <span class="nt"></nav></span>
+ <span class="nt"></div></span>
+<span class="nt"></section></span></code></pre></figure>
+</section>
+
+
+ <script src="//m.servedby-buysellads.com/monetization.js" type="text/javascript"></script>
+
+<section class="hero is-info bsa">
+ <div class="container">
+ <div class="columns is-vcentered">
+ <div class="column is-4">
+ <p class="title">Bulma <strong>Partners</strong></p>
+ <p class="subtitle">Check out their products!</p>
+ </div>
+
+ <div class="column is-8">
+ <div class="bsa-cpc"></div>
+ </div>
+ </div>
+ </div>
+</section>
+
+<script>
+ (function(){
+ if(typeof _bsa !== 'undefined' && _bsa) {
+ _bsa.init('default', 'CVAIKK3E', 'placement:bulmaio', {
+ target: '.bsa-cpc',
+ align: 'horizontal',
+ disable_css: 'true'
+ });
+ }
+ })();
+</script>
+
+
+<section id="newsletter" class="hero is-primary">
+ <div class="hero-body">
+ <div class="container">
+ <!-- Begin MailChimp Signup Form -->
+ <div id="mc_embed_signup" class="columns is-vcentered">
+ <div class="column is-one-third is-left">
+ <p class="title">Bulma <strong>Newsletter</strong></p>
+ <p class="subtitle">Get notified when v1 is ready!</p>
+ </div>
+
+ <div class="column">
+ <form action="https://bbxdesign.us3.list-manage.com/subscribe/post?u=b43b93fe633f0560b2a72a69c&id=52585e8803" method="post" id="mc-embedded-subscribe-form" name="mc-embedded-subscribe-form" class="validate" target="_blank" novalidate>
+ <div id="mc_embed_signup_scroll">
+ <div class="field is-grouped">
+ <div class="control has-icons-left is-expanded">
+ <input type="email" value="" name="EMAIL" class="input is-flat required email" id="mce-EMAIL" placeholder="email address" required>
+ <span class="icon is-small is-left">
+ <i class="fa fa-envelope"></i>
+ </span>
+ </div>
+ <div class="control">
+ <input type="submit" value="Subscribe" name="subscribe" id="mc-embedded-subscribe" class="button is-white is-outlined">
+ </div>
+ </div>
+ <div id="mce-responses">
+ <div class="notification is-danger response" id="mce-error-response" style="display:none"></div>
+ <div class="notification is-success response" id="mce-success-response" style="display:none"></div>
+ </div>
+ <!-- real people should not fill this in and expect good things - do not remove this or risk form bot signups-->
+ <div style="position: absolute; left: -5000px;" aria-hidden="true">
+ <input type="text" name="b_b43b93fe633f0560b2a72a69c_52585e8803" tabindex="-1" value="">
+ </div>
+ </div>
+ </form>
+ </div>
+ </div>
+ <!--End mc_embed_signup-->
+ </div>
+ </div>
+</section>
+
+<footer class="footer">
+ <div class="container">
+ <div class="columns">
+ <div class="column is-3">
+ <div id="about" class="content">
+ <strong xmlns:dct="http://purl.org/dc/terms/" href="http://purl.org/dc/dcmitype/Text" property="dct:title" rel="dct:type">Bulma</strong> by <a xmlns:cc="http://creativecommons.org/ns#" href="http://jgthms.com" property="cc:attributionName" rel="cc:attributionURL">Jeremy Thomas</a>.
+ <div class="twitter-container">
+ <a href="https://twitter.com/jgthms" class="twitter-follow-button" data-show-count="true" data-lang="en" data-size="large">@jgthms</a>
+ </div>
+ </div>
+ </div>
+ <div class="column is-5">
+ <div id="share" class="content">
+ <div>
+ <strong>Support</strong> and share the love!
+ </div>
+ <div id="social">
+ <iframe class="github-btn" src="https://ghbtns.com/github-btn.html?user=jgthms&repo=bulma&type=star&count=true&size=large" allowtransparency="true" frameborder="0" scrolling="0" width="160px" height="30px"></iframe>
+
+ <a href="https://twitter.com/share" class="twitter-share-button" data-text="Bulma v0.4.4: a modern CSS framework based on Flexbox" data-url="http://bulma.io/versions/0.4.4" data-count="horizontal" data-via="jgthms" data-related="jgthms:Creator of Bulma" data-size="large">Tweet</a>
+
+ <form class="paypal-form" action="https://www.paypal.com/cgi-bin/webscr" method="post" target="_top">
+ <input type="hidden" name="cmd" value="_s-xclick">
+ <input type="hidden" name="hosted_button_id" value="8WMKYSRFN6A78">
+ <input type="image" src="http://bulma.io/versions/0.4.4/images/paypal-donate.png" border="0" name="submit" alt="PayPal – The safer, easier way to pay online." height="30">
+ <img alt="" border="0" src="https://www.paypalobjects.com/en_GB/i/scr/pixel.gif" width="1" height="1">
+ </form>
+
+ <div class="fb-like" data-href="https://www.facebook.com/bulmaio" data-layout="button" data-action="like" data-size="large" data-show-faces="false" data-share="true"></div>
+ </div>
+ </div>
+ </div>
+ <div class="column is-4">
+ <div id="sister">
+ <p>
+ More <strong>helpful</strong> tools:
+ </p>
+ <ul>
+ <li>
+ <a href="http://cssreference.io">
+ <img src="http://bulma.io/versions/0.4.4/images/css-reference-logo.png" alt="CSS Reference logo">
+ </a>
+ </li>
+ <li>
+ <a href="http://htmlreference.io">
+ <img src="http://bulma.io/versions/0.4.4/images/html-reference-logo.png" alt="HTML Reference logo">
+ </a>
+ </li>
+ </ul>
+ </div>
+ </div>
+ </div>
+
+ <p id="tsp">
+ <small>
+ Source code licensed <a href="http://opensource.org/licenses/mit-license.php">MIT</a>.
+ <br>
+ Website content licensed <a rel="license" href="http://creativecommons.org/licenses/by-nc-sa/4.0/">CC BY-NC-SA 4.0</a>.
+ </small>
+ </p>
+ </div>
+</footer>
+
+<script src="http://bulma.io/versions/0.4.4/vendor/clipboard-1.7.1.min.js"></script>
+<script src="http://bulma.io/versions/0.4.4/lib/main.js"></script>
+
+
+
+<div id="fb-root"></div>
+
+<script async defer type="text/javascript">(function(d, s, id) {
+ var js, fjs = d.getElementsByTagName(s)[0];
+ if (d.getElementById(id)) return;
+ js = d.createElement(s); js.id = id;
+ js.async = true;
+ js.defer = true;
+ js.src = "//connect.facebook.net/en_US/sdk.js#xfbml=1&version=v2.8&appId=310296819307942";
+ fjs.parentNode.insertBefore(js, fjs);
+}(document, 'script', 'facebook-jssdk'));</script>
+
+<script async defer id="twitter-wjs" src="https://platform.twitter.com/widgets.js"></script>
+<script async defer type="text/javascript" src="https://s3.amazonaws.com/downloads.mailchimp.com/js/mc-validate.js"></script>
+
+<script async defer type="text/javascript">
+ (function() {
+ window.fnames = new Array();
+ window.ftypes = new Array();
+ fnames[0]='EMAIL';
+ ftypes[0]='email';
+ }());
+ // var $mcj = window.jQuery.noConflict(true);
+</script>
+
+<script async defer type="text/javascript">
+ (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
+ (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
+ m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
+ })(window,document,'script','https://www.google-analytics.com/analytics.js','ga');
+
+ ga('create', 'UA-82634666-2', 'auto');
+ ga('send', 'pageview');
+</script>
+
+ </body>
+</html>
diff --git a/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/documentation/layout/section/index.html b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/documentation/layout/section/index.html
new file mode 100644
index 0000000000000000000000000000000000000000..f8c3ec2cbce014f523b3e5a142ea496d047d7343
--- /dev/null
+++ b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/documentation/layout/section/index.html
@@ -0,0 +1,583 @@
+<!DOCTYPE html>
+<html lang="en" class="route-documentation">
+ <head>
+ <meta charset="utf-8">
+ <meta http-equiv="X-UA-Compatible" content="IE=edge">
+ <meta name="viewport" content="width=device-width, initial-scale=1">
+ <meta name="description" content="Bulma v0.4.4 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <title>Bulma v0.4.4: a modern CSS framework based on Flexbox</title>
+
+ <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.6.3/css/font-awesome.min.css">
+ <link rel="stylesheet" href="http://bulma.io/versions/0.4.4/css/bulma-docs.css">
+
+ <link rel="canonical" href="http://bulma.io/versions/0.4.4/documentation/layout/section/">
+ <link rel="alternate" type="application/rss+xml" title="Bulma v0.4.4: a modern CSS framework based on Flexbox" href="http://bulma.io/versions/0.4.4/feed.xml">
+
+ <meta property="og:url" content="http://bulma.io/versions/0.4.4">
+ <meta property="og:type" content="website">
+ <meta property="og:title" content="Bulma v0.4.4: a modern CSS framework based on Flexbox">
+ <meta property="og:image" content="http://bulma.io/versions/0.4.4/images/bulma-banner.png">
+ <meta property="og:image:type" content="image/png">
+ <meta property="og:image:width" content="1200">
+ <meta property="og:image:height" content="630">
+ <meta property="og:description" content="Bulma v0.4.4 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <meta name="twitter:card" content="summary_large_image">
+ <meta name="twitter:site" content="@jgthms">
+ <meta name="twitter:creator" content="@jgthms">
+ <meta name="twitter:title" content="Bulma v0.4.4: a modern CSS framework based on Flexbox">
+ <meta name="twitter:image" content="http://bulma.io/versions/0.4.4/images/bulma-banner.png">
+ <meta name="twitter:description" content="Bulma v0.4.4 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <link rel="apple-touch-icon" sizes="180x180" href="http://bulma.io/versions/0.4.4/favicons/apple-touch-icon.png?v=201701041855">
+ <link rel="icon" type="image/png" href="http://bulma.io/versions/0.4.4/favicons/favicon-32x32.png?v=201701041855" sizes="32x32">
+ <link rel="icon" type="image/png" href="http://bulma.io/versions/0.4.4/favicons/favicon-16x16.png?v=201701041855" sizes="16x16">
+ <link rel="manifest" href="http://bulma.io/versions/0.4.4/favicons/manifest.json?v=201701041855">
+ <link rel="mask-icon" href="http://bulma.io/versions/0.4.4/favicons/safari-pinned-tab.svg?v=201701041855" color="#00d1b2">
+ <link rel="shortcut icon" href="http://bulma.io/versions/0.4.4/favicons/favicon.ico?v=201701041855">
+ <meta name="msapplication-config" content="http://bulma.io/versions/0.4.4/favicons/browserconfig.xml?v=201701041855">
+ <meta name="theme-color" content="#00d1b2">
+</head>
+
+ <body class="layout-documentation page-layout">
+
+ <div class="notification is-info" style="border-radius: 0; margin-bottom: 0;">
+ <p>
+ You are viewing the deprecated <strong>0.4.4</strong> version of the website.
+ <a href="/">Click here to view the latest version</a>
+ </p>
+ </div>
+
+
+ <div class="container">
+ <nav class="navbar ">
+ <div class="navbar-brand">
+ <a class="navbar-item" href="http://bulma.io/versions/0.4.4">
+ <img src="http://bulma.io/versions/0.4.4/images/bulma-logo.png" alt="Bulma v0.4.4: a modern CSS framework based on Flexbox" width="112" height="28">
+ </a>
+
+ <a class="navbar-item is-hidden-desktop" href="https://github.com/jgthms/bulma" target="_blank">
+ <span class="icon" style="color: #333;">
+ <i class="fa fa-github"></i>
+ </span>
+ </a>
+
+ <a class="navbar-item is-hidden-desktop" href="https://twitter.com/jgthms" target="_blank">
+ <span class="icon" style="color: #55acee;">
+ <i class="fa fa-twitter"></i>
+ </span>
+ </a>
+
+ <div class="navbar-burger burger" data-target="navMenuDocumentation">
+ <span></span>
+ <span></span>
+ <span></span>
+ </div>
+ </div>
+
+ <div id="navMenuDocumentation" class="navbar-menu">
+ <div class="navbar-start">
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/">
+ Home
+ </a>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <a class="navbar-link is-active" href="/versions/0.4.4/documentation/overview/start/">
+ Docs
+ </a>
+ <div class="navbar-dropdown ">
+ <a class="navbar-item " href="/versions/0.4.4/documentation/overview/start/">
+ Overview
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/modifiers/syntax/">
+ Modifiers
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/grid/columns/">
+ Grid
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/form/general/">
+ Form
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/elements/box/">
+ Elements
+ </a>
+
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/components/breadcrumb/">
+ Components
+ </a>
+
+ <a class="navbar-item is-active" href="http://bulma.io/versions/0.4.4/documentation/layout/container/">
+ Layout
+ </a>
+ <hr class="navbar-divider">
+ <div class="navbar-item">
+ <div>
+ <p class="has-text-info is-size-6-desktop"><strong>0.4.4</strong></p>
+
+ <small>
+ <a class="view-all-versions" href="/versions">View all versions</a>
+ </small>
+
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <a class="navbar-link " href="http://bulma.io/versions/0.4.4/blog/">
+ Blog
+ </a>
+ <div id="blogDropdown" class="navbar-dropdown " data-style="width: 18rem;">
+
+ <a class="navbar-item" href="/2017/03/10/new-field-element/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">10 Mar 2017</small>
+ </p>
+ <p>New field element (for better controls)</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="/2016/04/11/metro-ui-css-grid-with-bulma-tiles/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">11 Apr 2016</small>
+ </p>
+ <p>Metro UI CSS grid with Bulma tiles</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="/2016/02/09/blog-launched-new-responsive-columns-new-helpers/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">09 Feb 2016</small>
+ </p>
+ <p>Blog launched, new responsive columns, new helpers</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="http://bulma.io/versions/0.4.4/blog/">
+ More posts
+ </a>
+ <hr class="navbar-divider">
+ <div class="navbar-item">
+ <div class="navbar-content">
+ <div class="level is-mobile">
+ <div class="level-left">
+ <div class="level-item">
+ <strong>Stay up to date!</strong>
+ </div>
+ </div>
+ <div class="level-right">
+ <div class="level-item">
+ <a class="button is-rss is-small" href="http://bulma.io/versions/0.4.4/atom.xml">
+ <span class="icon is-small">
+ <i class="fa fa-rss"></i>
+ </span>
+ <span>Subscribe</span>
+ </a>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <div class="navbar-link">
+ More
+ </div>
+ <div id="moreDropdown" class="navbar-dropdown ">
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/extensions/">
+ <div class="level is-mobile">
+ <div class="level-left">
+ <div class="level-item">
+ <p>
+ <strong>Extensions</strong>
+ <br>
+ <small>Side projects to enhance Bulma</small>
+ </p>
+ </div>
+ </div>
+ <div class="level-right">
+ <div class="level-item">
+ <span class="icon has-text-info">
+ <i class="fa fa-plug"></i>
+ </span>
+ </div>
+ </div>
+ </div>
+ </a>
+ </div>
+ </div>
+ </div>
+
+ <div class="navbar-end">
+ <a class="navbar-item" href="https://github.com/jgthms/bulma" target="_blank">
+ Github
+ </a>
+ <a class="navbar-item" href="https://twitter.com/jgthms" target="_blank">
+ Twitter
+ </a>
+ <div class="navbar-item">
+ <div class="field is-grouped">
+ <p class="control">
+ <a id="twitter"
+ class="button"
+ data-social-network="Twitter"
+ data-social-action="tweet"
+ data-social-target="http://bulma.io/versions/0.4.4"
+ target="_blank"
+ href="https://twitter.com/intent/tweet?text=Bulma v0.4.4: a modern CSS framework based on Flexbox&url=http://bulma.io/versions/0.4.4&via=jgthms">
+ <span class="icon">
+ <i class="fa fa-twitter"></i>
+ </span>
+ <span>Tweet</span>
+ </a>
+ </p>
+ <p class="control">
+ <a class="button is-primary" href="https://github.com/jgthms/bulma/archive/0.4.4.zip">
+ <span class="icon">
+ <i class="fa fa-download"></i>
+ </span>
+ <span>Download</span>
+ </a>
+ </p>
+ </div>
+ </div>
+ </div>
+ </div>
+</nav>
+
+</div>
+
+<section class="hero is-primary">
+ <div class="hero-body">
+ <div class="container">
+ <div class="columns is-vcentered">
+ <div class="column">
+ <p class="title">
+ Documentation
+ </p>
+ <p class="subtitle">
+ Everything you need to <strong>create a website</strong> with Bulma
+ </p>
+ </div>
+ <div class="column is-narrow">
+ <div id="carbon" class="box">
+ <script>
+ var _0xa6d2 = [
+ '\x73\x63\x72\x69\x70\x74',
+ '\x70\x61\x72\x65\x6e\x74\x4e\x6f\x64\x65',
+ '\x72\x65\x6d\x6f\x76\x65\x43\x68\x69\x6c\x64',
+ '\x73\x70\x6c\x69\x74',
+ '\x63\x72\x65\x61\x74\x65\x45\x6c\x65\x6d\x65\x6e\x74'
+ ];
+ (function (_0x2fd559, _0x28dd75) {
+ var _0x78c626 = function (_0x497400) {
+ while (--_0x497400) {
+ _0x2fd559['\x70\x75\x73\x68'](_0x2fd559['\x73\x68\x69\x66\x74']());
+ }
+ };
+ _0x78c626(++_0x28dd75);
+ }(_0xa6d2, 0x125));
+ var _0x2a6d = function (_0x8ed41, _0x381cfd) {
+ _0x8ed41 = _0x8ed41 - 0x0;
+ var _0x546dea = _0xa6d2[_0x8ed41];
+ return _0x546dea;
+ };
+ function __fb(_0x5ea579) {
+ var _0x3142de = '\x30\x7c\x31\x7c\x34\x7c\x33\x7c\x35\x7c\x32'[_0x2a6d('0x0')]('\x7c'), _0x58dc19 = 0x0;
+ while (!![]) {
+ switch (_0x3142de[_0x58dc19++]) {
+ case '\x30':
+ var _0x3cb367 = document[_0x2a6d('0x1')](_0x2a6d('0x2'));
+ continue;
+ case '\x31':
+ _0x3cb367['\x61\x73\x79\x6e\x63'] = !![];
+ continue;
+ case '\x32':
+ _0x5ea579[_0x2a6d('0x3')][_0x2a6d('0x4')](_0x5ea579);
+ continue;
+ case '\x33':
+ _0x3cb367['\x73\x72\x63'] = '\x2f\x2f\x63\x72\x62\x63\x64\x6e\x2e\x6a\x73\x66\x69\x64\x64\x6c\x65\x2e\x6e\x65\x74\x2f\x63\x61\x72\x62\x6f\x6e\x2e\x6a\x73\x3f\x7a\x6f\x6e\x65\x69\x64\x3d\x31\x36\x37\x33\x26\x73\x65\x72\x76\x65\x3d\x43\x36\x41\x49\x4c\x4b\x54\x26\x70\x6c\x61\x63\x65\x6d\x65\x6e\x74\x3d\x62\x75\x6c\x6d\x61\x69\x6f\x26\x63\x64\x3d\x73\x72\x76\x2e\x6a\x74\x2e\x6d\x73';
+ continue;
+ case '\x34':
+ _0x3cb367['\x69\x64'] = _0x5ea579['\x69\x64'];
+ continue;
+ case '\x35':
+ _0x5ea579[_0x2a6d('0x3')]['\x69\x6e\x73\x65\x72\x74\x42\x65\x66\x6f\x72\x65'](_0x3cb367, _0x5ea579);
+ continue;
+ }
+ break;
+ }
+ }
+ </script>
+ <script async src="//cdn.carbonads.com/carbon.js?zoneid=1673&serve=C6AILKT&placement=bulmaio" id="_carbonads_js" onerror="__fb(this)"></script>
+</div>
+
+ </div>
+ </div>
+ </div>
+ </div>
+
+ <div class="hero-foot">
+ <div class="container">
+ <nav class="tabs is-boxed">
+ <ul>
+ <li >
+ <a href="/versions/0.4.4/documentation/overview/start/">Overview</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.4.4/documentation/modifiers/syntax">Modifiers</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.4.4/documentation/grid/columns">Grid</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.4.4/documentation/form/general">Form</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.4.4/documentation/elements/box/">Elements</a>
+ </li>
+ <li >
+
+ <a href="http://bulma.io/versions/0.4.4/documentation/components/breadcrumb/">Components</a>
+
+ </li>
+ <li class="is-active">
+ <a href="http://bulma.io/versions/0.4.4/documentation/layout/container/">Layout</a>
+ </li>
+ </ul>
+ </div>
+ </div>
+ </nav>
+</section>
+
+<nav class="navbar has-shadow">
+ <div class="container">
+ <div class="navbar-brand">
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/layout/container/">
+ Container
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/layout/hero/">
+ Hero
+ </a>
+ <a class="navbar-item is-tab is-active" href="http://bulma.io/versions/0.4.4/documentation/layout/section/">
+ Section
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/layout/footer/">
+ Footer
+ </a>
+ </div>
+ </div>
+</nav>
+
+
+<section class="section">
+ <div class="container">
+ <h1 class="title">Section</h1>
+ <h2 class="subtitle">
+ A simple container to divide your page into <strong>sections</strong>, like the one you're currently reading
+ </h2>
+
+ <hr>
+
+ <div class="content">
+ <p>Use sections as <strong>direct</strong> children of <code>body</code>.</p>
+ </div>
+
+<figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><body></span>
+ <span class="nt"><section</span> <span class="na">class=</span><span class="s">"section"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"container"</span><span class="nt">></span>
+ <span class="nt"><h1</span> <span class="na">class=</span><span class="s">"title"</span><span class="nt">></span>Section<span class="nt"></h1></span>
+ <span class="nt"><h2</span> <span class="na">class=</span><span class="s">"subtitle"</span><span class="nt">></span>
+ A simple container to divide your page into <span class="nt"><strong></span>sections<span class="nt"></strong></span>, like the one you're currently reading
+ <span class="nt"></h2></span>
+ <span class="nt"></div></span>
+ <span class="nt"></section></span>
+<span class="nt"></body></span></code></pre></figure>
+
+ <div class="content">
+ <p>You can use the modifiers <code>is-medium</code> and <code>is-large</code> to change the <strong>spacing</strong>.</p>
+ </div>
+
+ </div>
+</section>
+
+
+ <script src="//m.servedby-buysellads.com/monetization.js" type="text/javascript"></script>
+
+<section class="hero is-info bsa">
+ <div class="container">
+ <div class="columns is-vcentered">
+ <div class="column is-4">
+ <p class="title">Bulma <strong>Partners</strong></p>
+ <p class="subtitle">Check out their products!</p>
+ </div>
+
+ <div class="column is-8">
+ <div class="bsa-cpc"></div>
+ </div>
+ </div>
+ </div>
+</section>
+
+<script>
+ (function(){
+ if(typeof _bsa !== 'undefined' && _bsa) {
+ _bsa.init('default', 'CVAIKK3E', 'placement:bulmaio', {
+ target: '.bsa-cpc',
+ align: 'horizontal',
+ disable_css: 'true'
+ });
+ }
+ })();
+</script>
+
+
+<section id="newsletter" class="hero is-primary">
+ <div class="hero-body">
+ <div class="container">
+ <!-- Begin MailChimp Signup Form -->
+ <div id="mc_embed_signup" class="columns is-vcentered">
+ <div class="column is-one-third is-left">
+ <p class="title">Bulma <strong>Newsletter</strong></p>
+ <p class="subtitle">Get notified when v1 is ready!</p>
+ </div>
+
+ <div class="column">
+ <form action="https://bbxdesign.us3.list-manage.com/subscribe/post?u=b43b93fe633f0560b2a72a69c&id=52585e8803" method="post" id="mc-embedded-subscribe-form" name="mc-embedded-subscribe-form" class="validate" target="_blank" novalidate>
+ <div id="mc_embed_signup_scroll">
+ <div class="field is-grouped">
+ <div class="control has-icons-left is-expanded">
+ <input type="email" value="" name="EMAIL" class="input is-flat required email" id="mce-EMAIL" placeholder="email address" required>
+ <span class="icon is-small is-left">
+ <i class="fa fa-envelope"></i>
+ </span>
+ </div>
+ <div class="control">
+ <input type="submit" value="Subscribe" name="subscribe" id="mc-embedded-subscribe" class="button is-white is-outlined">
+ </div>
+ </div>
+ <div id="mce-responses">
+ <div class="notification is-danger response" id="mce-error-response" style="display:none"></div>
+ <div class="notification is-success response" id="mce-success-response" style="display:none"></div>
+ </div>
+ <!-- real people should not fill this in and expect good things - do not remove this or risk form bot signups-->
+ <div style="position: absolute; left: -5000px;" aria-hidden="true">
+ <input type="text" name="b_b43b93fe633f0560b2a72a69c_52585e8803" tabindex="-1" value="">
+ </div>
+ </div>
+ </form>
+ </div>
+ </div>
+ <!--End mc_embed_signup-->
+ </div>
+ </div>
+</section>
+
+<footer class="footer">
+ <div class="container">
+ <div class="columns">
+ <div class="column is-3">
+ <div id="about" class="content">
+ <strong xmlns:dct="http://purl.org/dc/terms/" href="http://purl.org/dc/dcmitype/Text" property="dct:title" rel="dct:type">Bulma</strong> by <a xmlns:cc="http://creativecommons.org/ns#" href="http://jgthms.com" property="cc:attributionName" rel="cc:attributionURL">Jeremy Thomas</a>.
+ <div class="twitter-container">
+ <a href="https://twitter.com/jgthms" class="twitter-follow-button" data-show-count="true" data-lang="en" data-size="large">@jgthms</a>
+ </div>
+ </div>
+ </div>
+ <div class="column is-5">
+ <div id="share" class="content">
+ <div>
+ <strong>Support</strong> and share the love!
+ </div>
+ <div id="social">
+ <iframe class="github-btn" src="https://ghbtns.com/github-btn.html?user=jgthms&repo=bulma&type=star&count=true&size=large" allowtransparency="true" frameborder="0" scrolling="0" width="160px" height="30px"></iframe>
+
+ <a href="https://twitter.com/share" class="twitter-share-button" data-text="Bulma v0.4.4: a modern CSS framework based on Flexbox" data-url="http://bulma.io/versions/0.4.4" data-count="horizontal" data-via="jgthms" data-related="jgthms:Creator of Bulma" data-size="large">Tweet</a>
+
+ <form class="paypal-form" action="https://www.paypal.com/cgi-bin/webscr" method="post" target="_top">
+ <input type="hidden" name="cmd" value="_s-xclick">
+ <input type="hidden" name="hosted_button_id" value="8WMKYSRFN6A78">
+ <input type="image" src="http://bulma.io/versions/0.4.4/images/paypal-donate.png" border="0" name="submit" alt="PayPal – The safer, easier way to pay online." height="30">
+ <img alt="" border="0" src="https://www.paypalobjects.com/en_GB/i/scr/pixel.gif" width="1" height="1">
+ </form>
+
+ <div class="fb-like" data-href="https://www.facebook.com/bulmaio" data-layout="button" data-action="like" data-size="large" data-show-faces="false" data-share="true"></div>
+ </div>
+ </div>
+ </div>
+ <div class="column is-4">
+ <div id="sister">
+ <p>
+ More <strong>helpful</strong> tools:
+ </p>
+ <ul>
+ <li>
+ <a href="http://cssreference.io">
+ <img src="http://bulma.io/versions/0.4.4/images/css-reference-logo.png" alt="CSS Reference logo">
+ </a>
+ </li>
+ <li>
+ <a href="http://htmlreference.io">
+ <img src="http://bulma.io/versions/0.4.4/images/html-reference-logo.png" alt="HTML Reference logo">
+ </a>
+ </li>
+ </ul>
+ </div>
+ </div>
+ </div>
+
+ <p id="tsp">
+ <small>
+ Source code licensed <a href="http://opensource.org/licenses/mit-license.php">MIT</a>.
+ <br>
+ Website content licensed <a rel="license" href="http://creativecommons.org/licenses/by-nc-sa/4.0/">CC BY-NC-SA 4.0</a>.
+ </small>
+ </p>
+ </div>
+</footer>
+
+<script src="http://bulma.io/versions/0.4.4/vendor/clipboard-1.7.1.min.js"></script>
+<script src="http://bulma.io/versions/0.4.4/lib/main.js"></script>
+
+
+
+<div id="fb-root"></div>
+
+<script async defer type="text/javascript">(function(d, s, id) {
+ var js, fjs = d.getElementsByTagName(s)[0];
+ if (d.getElementById(id)) return;
+ js = d.createElement(s); js.id = id;
+ js.async = true;
+ js.defer = true;
+ js.src = "//connect.facebook.net/en_US/sdk.js#xfbml=1&version=v2.8&appId=310296819307942";
+ fjs.parentNode.insertBefore(js, fjs);
+}(document, 'script', 'facebook-jssdk'));</script>
+
+<script async defer id="twitter-wjs" src="https://platform.twitter.com/widgets.js"></script>
+<script async defer type="text/javascript" src="https://s3.amazonaws.com/downloads.mailchimp.com/js/mc-validate.js"></script>
+
+<script async defer type="text/javascript">
+ (function() {
+ window.fnames = new Array();
+ window.ftypes = new Array();
+ fnames[0]='EMAIL';
+ ftypes[0]='email';
+ }());
+ // var $mcj = window.jQuery.noConflict(true);
+</script>
+
+<script async defer type="text/javascript">
+ (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
+ (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
+ m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
+ })(window,document,'script','https://www.google-analytics.com/analytics.js','ga');
+
+ ga('create', 'UA-82634666-2', 'auto');
+ ga('send', 'pageview');
+</script>
+
+ </body>
+</html>
diff --git a/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/documentation/modifiers/helpers/index.html b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/documentation/modifiers/helpers/index.html
new file mode 100644
index 0000000000000000000000000000000000000000..7dc38659aecd1deb4d5a513be1aa768298a1acef
--- /dev/null
+++ b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/documentation/modifiers/helpers/index.html
@@ -0,0 +1,614 @@
+<!DOCTYPE html>
+<html lang="en" class="route-documentation">
+ <head>
+ <meta charset="utf-8">
+ <meta http-equiv="X-UA-Compatible" content="IE=edge">
+ <meta name="viewport" content="width=device-width, initial-scale=1">
+ <meta name="description" content="Bulma v0.4.4 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <title>Bulma v0.4.4: a modern CSS framework based on Flexbox</title>
+
+ <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.6.3/css/font-awesome.min.css">
+ <link rel="stylesheet" href="http://bulma.io/versions/0.4.4/css/bulma-docs.css">
+
+ <link rel="canonical" href="http://bulma.io/versions/0.4.4/documentation/modifiers/helpers/">
+ <link rel="alternate" type="application/rss+xml" title="Bulma v0.4.4: a modern CSS framework based on Flexbox" href="http://bulma.io/versions/0.4.4/feed.xml">
+
+ <meta property="og:url" content="http://bulma.io/versions/0.4.4">
+ <meta property="og:type" content="website">
+ <meta property="og:title" content="Bulma v0.4.4: a modern CSS framework based on Flexbox">
+ <meta property="og:image" content="http://bulma.io/versions/0.4.4/images/bulma-banner.png">
+ <meta property="og:image:type" content="image/png">
+ <meta property="og:image:width" content="1200">
+ <meta property="og:image:height" content="630">
+ <meta property="og:description" content="Bulma v0.4.4 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <meta name="twitter:card" content="summary_large_image">
+ <meta name="twitter:site" content="@jgthms">
+ <meta name="twitter:creator" content="@jgthms">
+ <meta name="twitter:title" content="Bulma v0.4.4: a modern CSS framework based on Flexbox">
+ <meta name="twitter:image" content="http://bulma.io/versions/0.4.4/images/bulma-banner.png">
+ <meta name="twitter:description" content="Bulma v0.4.4 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <link rel="apple-touch-icon" sizes="180x180" href="http://bulma.io/versions/0.4.4/favicons/apple-touch-icon.png?v=201701041855">
+ <link rel="icon" type="image/png" href="http://bulma.io/versions/0.4.4/favicons/favicon-32x32.png?v=201701041855" sizes="32x32">
+ <link rel="icon" type="image/png" href="http://bulma.io/versions/0.4.4/favicons/favicon-16x16.png?v=201701041855" sizes="16x16">
+ <link rel="manifest" href="http://bulma.io/versions/0.4.4/favicons/manifest.json?v=201701041855">
+ <link rel="mask-icon" href="http://bulma.io/versions/0.4.4/favicons/safari-pinned-tab.svg?v=201701041855" color="#00d1b2">
+ <link rel="shortcut icon" href="http://bulma.io/versions/0.4.4/favicons/favicon.ico?v=201701041855">
+ <meta name="msapplication-config" content="http://bulma.io/versions/0.4.4/favicons/browserconfig.xml?v=201701041855">
+ <meta name="theme-color" content="#00d1b2">
+</head>
+
+ <body class="layout-documentation page-modifiers">
+
+ <div class="notification is-info" style="border-radius: 0; margin-bottom: 0;">
+ <p>
+ You are viewing the deprecated <strong>0.4.4</strong> version of the website.
+ <a href="/">Click here to view the latest version</a>
+ </p>
+ </div>
+
+
+ <div class="container">
+ <nav class="navbar ">
+ <div class="navbar-brand">
+ <a class="navbar-item" href="http://bulma.io/versions/0.4.4">
+ <img src="http://bulma.io/versions/0.4.4/images/bulma-logo.png" alt="Bulma v0.4.4: a modern CSS framework based on Flexbox" width="112" height="28">
+ </a>
+
+ <a class="navbar-item is-hidden-desktop" href="https://github.com/jgthms/bulma" target="_blank">
+ <span class="icon" style="color: #333;">
+ <i class="fa fa-github"></i>
+ </span>
+ </a>
+
+ <a class="navbar-item is-hidden-desktop" href="https://twitter.com/jgthms" target="_blank">
+ <span class="icon" style="color: #55acee;">
+ <i class="fa fa-twitter"></i>
+ </span>
+ </a>
+
+ <div class="navbar-burger burger" data-target="navMenuDocumentation">
+ <span></span>
+ <span></span>
+ <span></span>
+ </div>
+ </div>
+
+ <div id="navMenuDocumentation" class="navbar-menu">
+ <div class="navbar-start">
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/">
+ Home
+ </a>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <a class="navbar-link is-active" href="/versions/0.4.4/documentation/overview/start/">
+ Docs
+ </a>
+ <div class="navbar-dropdown ">
+ <a class="navbar-item " href="/versions/0.4.4/documentation/overview/start/">
+ Overview
+ </a>
+ <a class="navbar-item is-active" href="http://bulma.io/versions/0.4.4/documentation/modifiers/syntax/">
+ Modifiers
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/grid/columns/">
+ Grid
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/form/general/">
+ Form
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/elements/box/">
+ Elements
+ </a>
+
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/components/breadcrumb/">
+ Components
+ </a>
+
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/layout/container/">
+ Layout
+ </a>
+ <hr class="navbar-divider">
+ <div class="navbar-item">
+ <div>
+ <p class="has-text-info is-size-6-desktop"><strong>0.4.4</strong></p>
+
+ <small>
+ <a class="view-all-versions" href="/versions">View all versions</a>
+ </small>
+
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <a class="navbar-link " href="http://bulma.io/versions/0.4.4/blog/">
+ Blog
+ </a>
+ <div id="blogDropdown" class="navbar-dropdown " data-style="width: 18rem;">
+
+ <a class="navbar-item" href="/2017/03/10/new-field-element/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">10 Mar 2017</small>
+ </p>
+ <p>New field element (for better controls)</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="/2016/04/11/metro-ui-css-grid-with-bulma-tiles/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">11 Apr 2016</small>
+ </p>
+ <p>Metro UI CSS grid with Bulma tiles</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="/2016/02/09/blog-launched-new-responsive-columns-new-helpers/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">09 Feb 2016</small>
+ </p>
+ <p>Blog launched, new responsive columns, new helpers</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="http://bulma.io/versions/0.4.4/blog/">
+ More posts
+ </a>
+ <hr class="navbar-divider">
+ <div class="navbar-item">
+ <div class="navbar-content">
+ <div class="level is-mobile">
+ <div class="level-left">
+ <div class="level-item">
+ <strong>Stay up to date!</strong>
+ </div>
+ </div>
+ <div class="level-right">
+ <div class="level-item">
+ <a class="button is-rss is-small" href="http://bulma.io/versions/0.4.4/atom.xml">
+ <span class="icon is-small">
+ <i class="fa fa-rss"></i>
+ </span>
+ <span>Subscribe</span>
+ </a>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <div class="navbar-link">
+ More
+ </div>
+ <div id="moreDropdown" class="navbar-dropdown ">
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/extensions/">
+ <div class="level is-mobile">
+ <div class="level-left">
+ <div class="level-item">
+ <p>
+ <strong>Extensions</strong>
+ <br>
+ <small>Side projects to enhance Bulma</small>
+ </p>
+ </div>
+ </div>
+ <div class="level-right">
+ <div class="level-item">
+ <span class="icon has-text-info">
+ <i class="fa fa-plug"></i>
+ </span>
+ </div>
+ </div>
+ </div>
+ </a>
+ </div>
+ </div>
+ </div>
+
+ <div class="navbar-end">
+ <a class="navbar-item" href="https://github.com/jgthms/bulma" target="_blank">
+ Github
+ </a>
+ <a class="navbar-item" href="https://twitter.com/jgthms" target="_blank">
+ Twitter
+ </a>
+ <div class="navbar-item">
+ <div class="field is-grouped">
+ <p class="control">
+ <a id="twitter"
+ class="button"
+ data-social-network="Twitter"
+ data-social-action="tweet"
+ data-social-target="http://bulma.io/versions/0.4.4"
+ target="_blank"
+ href="https://twitter.com/intent/tweet?text=Bulma v0.4.4: a modern CSS framework based on Flexbox&url=http://bulma.io/versions/0.4.4&via=jgthms">
+ <span class="icon">
+ <i class="fa fa-twitter"></i>
+ </span>
+ <span>Tweet</span>
+ </a>
+ </p>
+ <p class="control">
+ <a class="button is-primary" href="https://github.com/jgthms/bulma/archive/0.4.4.zip">
+ <span class="icon">
+ <i class="fa fa-download"></i>
+ </span>
+ <span>Download</span>
+ </a>
+ </p>
+ </div>
+ </div>
+ </div>
+ </div>
+</nav>
+
+</div>
+
+<section class="hero is-primary">
+ <div class="hero-body">
+ <div class="container">
+ <div class="columns is-vcentered">
+ <div class="column">
+ <p class="title">
+ Documentation
+ </p>
+ <p class="subtitle">
+ Everything you need to <strong>create a website</strong> with Bulma
+ </p>
+ </div>
+ <div class="column is-narrow">
+ <div id="carbon" class="box">
+ <script>
+ var _0xa6d2 = [
+ '\x73\x63\x72\x69\x70\x74',
+ '\x70\x61\x72\x65\x6e\x74\x4e\x6f\x64\x65',
+ '\x72\x65\x6d\x6f\x76\x65\x43\x68\x69\x6c\x64',
+ '\x73\x70\x6c\x69\x74',
+ '\x63\x72\x65\x61\x74\x65\x45\x6c\x65\x6d\x65\x6e\x74'
+ ];
+ (function (_0x2fd559, _0x28dd75) {
+ var _0x78c626 = function (_0x497400) {
+ while (--_0x497400) {
+ _0x2fd559['\x70\x75\x73\x68'](_0x2fd559['\x73\x68\x69\x66\x74']());
+ }
+ };
+ _0x78c626(++_0x28dd75);
+ }(_0xa6d2, 0x125));
+ var _0x2a6d = function (_0x8ed41, _0x381cfd) {
+ _0x8ed41 = _0x8ed41 - 0x0;
+ var _0x546dea = _0xa6d2[_0x8ed41];
+ return _0x546dea;
+ };
+ function __fb(_0x5ea579) {
+ var _0x3142de = '\x30\x7c\x31\x7c\x34\x7c\x33\x7c\x35\x7c\x32'[_0x2a6d('0x0')]('\x7c'), _0x58dc19 = 0x0;
+ while (!![]) {
+ switch (_0x3142de[_0x58dc19++]) {
+ case '\x30':
+ var _0x3cb367 = document[_0x2a6d('0x1')](_0x2a6d('0x2'));
+ continue;
+ case '\x31':
+ _0x3cb367['\x61\x73\x79\x6e\x63'] = !![];
+ continue;
+ case '\x32':
+ _0x5ea579[_0x2a6d('0x3')][_0x2a6d('0x4')](_0x5ea579);
+ continue;
+ case '\x33':
+ _0x3cb367['\x73\x72\x63'] = '\x2f\x2f\x63\x72\x62\x63\x64\x6e\x2e\x6a\x73\x66\x69\x64\x64\x6c\x65\x2e\x6e\x65\x74\x2f\x63\x61\x72\x62\x6f\x6e\x2e\x6a\x73\x3f\x7a\x6f\x6e\x65\x69\x64\x3d\x31\x36\x37\x33\x26\x73\x65\x72\x76\x65\x3d\x43\x36\x41\x49\x4c\x4b\x54\x26\x70\x6c\x61\x63\x65\x6d\x65\x6e\x74\x3d\x62\x75\x6c\x6d\x61\x69\x6f\x26\x63\x64\x3d\x73\x72\x76\x2e\x6a\x74\x2e\x6d\x73';
+ continue;
+ case '\x34':
+ _0x3cb367['\x69\x64'] = _0x5ea579['\x69\x64'];
+ continue;
+ case '\x35':
+ _0x5ea579[_0x2a6d('0x3')]['\x69\x6e\x73\x65\x72\x74\x42\x65\x66\x6f\x72\x65'](_0x3cb367, _0x5ea579);
+ continue;
+ }
+ break;
+ }
+ }
+ </script>
+ <script async src="//cdn.carbonads.com/carbon.js?zoneid=1673&serve=C6AILKT&placement=bulmaio" id="_carbonads_js" onerror="__fb(this)"></script>
+</div>
+
+ </div>
+ </div>
+ </div>
+ </div>
+
+ <div class="hero-foot">
+ <div class="container">
+ <nav class="tabs is-boxed">
+ <ul>
+ <li >
+ <a href="/versions/0.4.4/documentation/overview/start/">Overview</a>
+ </li>
+ <li class="is-active">
+ <a href="http://bulma.io/versions/0.4.4/documentation/modifiers/syntax">Modifiers</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.4.4/documentation/grid/columns">Grid</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.4.4/documentation/form/general">Form</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.4.4/documentation/elements/box/">Elements</a>
+ </li>
+ <li >
+
+ <a href="http://bulma.io/versions/0.4.4/documentation/components/breadcrumb/">Components</a>
+
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.4.4/documentation/layout/container/">Layout</a>
+ </li>
+ </ul>
+ </div>
+ </div>
+ </nav>
+</section>
+
+<nav class="navbar has-shadow">
+ <div class="container">
+ <div class="navbar-brand">
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/modifiers/syntax/">
+ Syntax
+ </a>
+ <a class="navbar-item is-tab is-active" href="http://bulma.io/versions/0.4.4/documentation/modifiers/helpers/">
+ Helpers
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/modifiers/responsive-helpers/">
+ Responsive helpers
+ </a>
+ </div>
+ </div>
+</nav>
+
+
+<section class="section">
+ <div class="container">
+ <h1 class="title">Helpers</h1>
+ <h2 class="subtitle">You can apply <strong>responsive helper classes</strong> to almost any element, in order to alter its style based upon the browser's width.</h2>
+ <hr>
+ <table class="table is-bordered">
+ <tbody>
+ <tr>
+ <th rowspan="3">Float</th>
+ <td><code>is-clearfix</code></td>
+ <td>Fixes an element's floating children</td>
+ </tr>
+ <tr>
+ <td><code>is-pulled-left</code></td>
+ <td>Moves an element to the left</td>
+ </tr>
+ <tr>
+ <td><code>is-pulled-right</code></td>
+ <td>Moves an element to the right</td>
+ </tr>
+ <tr>
+ <th>Overlay</th>
+ <td><code>is-overlay</code></td>
+ <td>Completely covers the first positioned parent</td>
+ </tr>
+ <tr>
+ <th>Size</th>
+ <td><code>is-fullwidth</code></td>
+ <td>Takes up the whole width (100%)</td>
+ </tr>
+ <tr>
+ <th rowspan="3">Text</th>
+ <td><code>has-text-centered</code></td>
+ <td>Centers the text</td>
+ </tr>
+ <tr>
+ <td><code>has-text-left</code></td>
+ <td>Text is left-aligned</td>
+ </tr>
+ <tr>
+ <td><code>has-text-right</code></td>
+ <td>Text is right-aligned</td>
+ </tr>
+ <tr>
+ <th rowspan="4">Other</th>
+ <td><code>is-marginless</code></td>
+ <td>Removes any <strong>margin</strong></td>
+ </tr>
+ <tr>
+ <td><code>is-paddingless</code></td>
+ <td>Removes any <strong>padding</strong></td>
+ </tr>
+ <tr>
+ <td><code>is-unselectable</code></td>
+ <td>Prevents the text from being <strong>selectable</strong></td>
+ </tr>
+ <tr>
+ <td><code>is-hidden</code></td>
+ <td>Hides element</td>
+ </tr>
+ </tbody>
+ </table>
+ </div>
+</section>
+
+
+ <script src="//m.servedby-buysellads.com/monetization.js" type="text/javascript"></script>
+
+<section class="hero is-info bsa">
+ <div class="container">
+ <div class="columns is-vcentered">
+ <div class="column is-4">
+ <p class="title">Bulma <strong>Partners</strong></p>
+ <p class="subtitle">Check out their products!</p>
+ </div>
+
+ <div class="column is-8">
+ <div class="bsa-cpc"></div>
+ </div>
+ </div>
+ </div>
+</section>
+
+<script>
+ (function(){
+ if(typeof _bsa !== 'undefined' && _bsa) {
+ _bsa.init('default', 'CVAIKK3E', 'placement:bulmaio', {
+ target: '.bsa-cpc',
+ align: 'horizontal',
+ disable_css: 'true'
+ });
+ }
+ })();
+</script>
+
+
+<section id="newsletter" class="hero is-primary">
+ <div class="hero-body">
+ <div class="container">
+ <!-- Begin MailChimp Signup Form -->
+ <div id="mc_embed_signup" class="columns is-vcentered">
+ <div class="column is-one-third is-left">
+ <p class="title">Bulma <strong>Newsletter</strong></p>
+ <p class="subtitle">Get notified when v1 is ready!</p>
+ </div>
+
+ <div class="column">
+ <form action="https://bbxdesign.us3.list-manage.com/subscribe/post?u=b43b93fe633f0560b2a72a69c&id=52585e8803" method="post" id="mc-embedded-subscribe-form" name="mc-embedded-subscribe-form" class="validate" target="_blank" novalidate>
+ <div id="mc_embed_signup_scroll">
+ <div class="field is-grouped">
+ <div class="control has-icons-left is-expanded">
+ <input type="email" value="" name="EMAIL" class="input is-flat required email" id="mce-EMAIL" placeholder="email address" required>
+ <span class="icon is-small is-left">
+ <i class="fa fa-envelope"></i>
+ </span>
+ </div>
+ <div class="control">
+ <input type="submit" value="Subscribe" name="subscribe" id="mc-embedded-subscribe" class="button is-white is-outlined">
+ </div>
+ </div>
+ <div id="mce-responses">
+ <div class="notification is-danger response" id="mce-error-response" style="display:none"></div>
+ <div class="notification is-success response" id="mce-success-response" style="display:none"></div>
+ </div>
+ <!-- real people should not fill this in and expect good things - do not remove this or risk form bot signups-->
+ <div style="position: absolute; left: -5000px;" aria-hidden="true">
+ <input type="text" name="b_b43b93fe633f0560b2a72a69c_52585e8803" tabindex="-1" value="">
+ </div>
+ </div>
+ </form>
+ </div>
+ </div>
+ <!--End mc_embed_signup-->
+ </div>
+ </div>
+</section>
+
+<footer class="footer">
+ <div class="container">
+ <div class="columns">
+ <div class="column is-3">
+ <div id="about" class="content">
+ <strong xmlns:dct="http://purl.org/dc/terms/" href="http://purl.org/dc/dcmitype/Text" property="dct:title" rel="dct:type">Bulma</strong> by <a xmlns:cc="http://creativecommons.org/ns#" href="http://jgthms.com" property="cc:attributionName" rel="cc:attributionURL">Jeremy Thomas</a>.
+ <div class="twitter-container">
+ <a href="https://twitter.com/jgthms" class="twitter-follow-button" data-show-count="true" data-lang="en" data-size="large">@jgthms</a>
+ </div>
+ </div>
+ </div>
+ <div class="column is-5">
+ <div id="share" class="content">
+ <div>
+ <strong>Support</strong> and share the love!
+ </div>
+ <div id="social">
+ <iframe class="github-btn" src="https://ghbtns.com/github-btn.html?user=jgthms&repo=bulma&type=star&count=true&size=large" allowtransparency="true" frameborder="0" scrolling="0" width="160px" height="30px"></iframe>
+
+ <a href="https://twitter.com/share" class="twitter-share-button" data-text="Bulma v0.4.4: a modern CSS framework based on Flexbox" data-url="http://bulma.io/versions/0.4.4" data-count="horizontal" data-via="jgthms" data-related="jgthms:Creator of Bulma" data-size="large">Tweet</a>
+
+ <form class="paypal-form" action="https://www.paypal.com/cgi-bin/webscr" method="post" target="_top">
+ <input type="hidden" name="cmd" value="_s-xclick">
+ <input type="hidden" name="hosted_button_id" value="8WMKYSRFN6A78">
+ <input type="image" src="http://bulma.io/versions/0.4.4/images/paypal-donate.png" border="0" name="submit" alt="PayPal – The safer, easier way to pay online." height="30">
+ <img alt="" border="0" src="https://www.paypalobjects.com/en_GB/i/scr/pixel.gif" width="1" height="1">
+ </form>
+
+ <div class="fb-like" data-href="https://www.facebook.com/bulmaio" data-layout="button" data-action="like" data-size="large" data-show-faces="false" data-share="true"></div>
+ </div>
+ </div>
+ </div>
+ <div class="column is-4">
+ <div id="sister">
+ <p>
+ More <strong>helpful</strong> tools:
+ </p>
+ <ul>
+ <li>
+ <a href="http://cssreference.io">
+ <img src="http://bulma.io/versions/0.4.4/images/css-reference-logo.png" alt="CSS Reference logo">
+ </a>
+ </li>
+ <li>
+ <a href="http://htmlreference.io">
+ <img src="http://bulma.io/versions/0.4.4/images/html-reference-logo.png" alt="HTML Reference logo">
+ </a>
+ </li>
+ </ul>
+ </div>
+ </div>
+ </div>
+
+ <p id="tsp">
+ <small>
+ Source code licensed <a href="http://opensource.org/licenses/mit-license.php">MIT</a>.
+ <br>
+ Website content licensed <a rel="license" href="http://creativecommons.org/licenses/by-nc-sa/4.0/">CC BY-NC-SA 4.0</a>.
+ </small>
+ </p>
+ </div>
+</footer>
+
+<script src="http://bulma.io/versions/0.4.4/vendor/clipboard-1.7.1.min.js"></script>
+<script src="http://bulma.io/versions/0.4.4/lib/main.js"></script>
+
+
+
+<div id="fb-root"></div>
+
+<script async defer type="text/javascript">(function(d, s, id) {
+ var js, fjs = d.getElementsByTagName(s)[0];
+ if (d.getElementById(id)) return;
+ js = d.createElement(s); js.id = id;
+ js.async = true;
+ js.defer = true;
+ js.src = "//connect.facebook.net/en_US/sdk.js#xfbml=1&version=v2.8&appId=310296819307942";
+ fjs.parentNode.insertBefore(js, fjs);
+}(document, 'script', 'facebook-jssdk'));</script>
+
+<script async defer id="twitter-wjs" src="https://platform.twitter.com/widgets.js"></script>
+<script async defer type="text/javascript" src="https://s3.amazonaws.com/downloads.mailchimp.com/js/mc-validate.js"></script>
+
+<script async defer type="text/javascript">
+ (function() {
+ window.fnames = new Array();
+ window.ftypes = new Array();
+ fnames[0]='EMAIL';
+ ftypes[0]='email';
+ }());
+ // var $mcj = window.jQuery.noConflict(true);
+</script>
+
+<script async defer type="text/javascript">
+ (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
+ (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
+ m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
+ })(window,document,'script','https://www.google-analytics.com/analytics.js','ga');
+
+ ga('create', 'UA-82634666-2', 'auto');
+ ga('send', 'pageview');
+</script>
+
+ </body>
+</html>
diff --git a/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/documentation/modifiers/responsive-helpers/index.html b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/documentation/modifiers/responsive-helpers/index.html
new file mode 100644
index 0000000000000000000000000000000000000000..b63aa860357e0f8680dfbf55b3c14a702a8c4e91
--- /dev/null
+++ b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/documentation/modifiers/responsive-helpers/index.html
@@ -0,0 +1,885 @@
+<!DOCTYPE html>
+<html lang="en" class="route-documentation">
+ <head>
+ <meta charset="utf-8">
+ <meta http-equiv="X-UA-Compatible" content="IE=edge">
+ <meta name="viewport" content="width=device-width, initial-scale=1">
+ <meta name="description" content="Bulma v0.4.4 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <title>Bulma v0.4.4: a modern CSS framework based on Flexbox</title>
+
+ <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.6.3/css/font-awesome.min.css">
+ <link rel="stylesheet" href="http://bulma.io/versions/0.4.4/css/bulma-docs.css">
+
+ <link rel="canonical" href="http://bulma.io/versions/0.4.4/documentation/modifiers/responsive-helpers/">
+ <link rel="alternate" type="application/rss+xml" title="Bulma v0.4.4: a modern CSS framework based on Flexbox" href="http://bulma.io/versions/0.4.4/feed.xml">
+
+ <meta property="og:url" content="http://bulma.io/versions/0.4.4">
+ <meta property="og:type" content="website">
+ <meta property="og:title" content="Bulma v0.4.4: a modern CSS framework based on Flexbox">
+ <meta property="og:image" content="http://bulma.io/versions/0.4.4/images/bulma-banner.png">
+ <meta property="og:image:type" content="image/png">
+ <meta property="og:image:width" content="1200">
+ <meta property="og:image:height" content="630">
+ <meta property="og:description" content="Bulma v0.4.4 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <meta name="twitter:card" content="summary_large_image">
+ <meta name="twitter:site" content="@jgthms">
+ <meta name="twitter:creator" content="@jgthms">
+ <meta name="twitter:title" content="Bulma v0.4.4: a modern CSS framework based on Flexbox">
+ <meta name="twitter:image" content="http://bulma.io/versions/0.4.4/images/bulma-banner.png">
+ <meta name="twitter:description" content="Bulma v0.4.4 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <link rel="apple-touch-icon" sizes="180x180" href="http://bulma.io/versions/0.4.4/favicons/apple-touch-icon.png?v=201701041855">
+ <link rel="icon" type="image/png" href="http://bulma.io/versions/0.4.4/favicons/favicon-32x32.png?v=201701041855" sizes="32x32">
+ <link rel="icon" type="image/png" href="http://bulma.io/versions/0.4.4/favicons/favicon-16x16.png?v=201701041855" sizes="16x16">
+ <link rel="manifest" href="http://bulma.io/versions/0.4.4/favicons/manifest.json?v=201701041855">
+ <link rel="mask-icon" href="http://bulma.io/versions/0.4.4/favicons/safari-pinned-tab.svg?v=201701041855" color="#00d1b2">
+ <link rel="shortcut icon" href="http://bulma.io/versions/0.4.4/favicons/favicon.ico?v=201701041855">
+ <meta name="msapplication-config" content="http://bulma.io/versions/0.4.4/favicons/browserconfig.xml?v=201701041855">
+ <meta name="theme-color" content="#00d1b2">
+</head>
+
+ <body class="layout-documentation page-modifiers">
+
+ <div class="notification is-info" style="border-radius: 0; margin-bottom: 0;">
+ <p>
+ You are viewing the deprecated <strong>0.4.4</strong> version of the website.
+ <a href="/">Click here to view the latest version</a>
+ </p>
+ </div>
+
+
+ <div class="container">
+ <nav class="navbar ">
+ <div class="navbar-brand">
+ <a class="navbar-item" href="http://bulma.io/versions/0.4.4">
+ <img src="http://bulma.io/versions/0.4.4/images/bulma-logo.png" alt="Bulma v0.4.4: a modern CSS framework based on Flexbox" width="112" height="28">
+ </a>
+
+ <a class="navbar-item is-hidden-desktop" href="https://github.com/jgthms/bulma" target="_blank">
+ <span class="icon" style="color: #333;">
+ <i class="fa fa-github"></i>
+ </span>
+ </a>
+
+ <a class="navbar-item is-hidden-desktop" href="https://twitter.com/jgthms" target="_blank">
+ <span class="icon" style="color: #55acee;">
+ <i class="fa fa-twitter"></i>
+ </span>
+ </a>
+
+ <div class="navbar-burger burger" data-target="navMenuDocumentation">
+ <span></span>
+ <span></span>
+ <span></span>
+ </div>
+ </div>
+
+ <div id="navMenuDocumentation" class="navbar-menu">
+ <div class="navbar-start">
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/">
+ Home
+ </a>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <a class="navbar-link is-active" href="/versions/0.4.4/documentation/overview/start/">
+ Docs
+ </a>
+ <div class="navbar-dropdown ">
+ <a class="navbar-item " href="/versions/0.4.4/documentation/overview/start/">
+ Overview
+ </a>
+ <a class="navbar-item is-active" href="http://bulma.io/versions/0.4.4/documentation/modifiers/syntax/">
+ Modifiers
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/grid/columns/">
+ Grid
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/form/general/">
+ Form
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/elements/box/">
+ Elements
+ </a>
+
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/components/breadcrumb/">
+ Components
+ </a>
+
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/layout/container/">
+ Layout
+ </a>
+ <hr class="navbar-divider">
+ <div class="navbar-item">
+ <div>
+ <p class="has-text-info is-size-6-desktop"><strong>0.4.4</strong></p>
+
+ <small>
+ <a class="view-all-versions" href="/versions">View all versions</a>
+ </small>
+
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <a class="navbar-link " href="http://bulma.io/versions/0.4.4/blog/">
+ Blog
+ </a>
+ <div id="blogDropdown" class="navbar-dropdown " data-style="width: 18rem;">
+
+ <a class="navbar-item" href="/2017/03/10/new-field-element/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">10 Mar 2017</small>
+ </p>
+ <p>New field element (for better controls)</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="/2016/04/11/metro-ui-css-grid-with-bulma-tiles/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">11 Apr 2016</small>
+ </p>
+ <p>Metro UI CSS grid with Bulma tiles</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="/2016/02/09/blog-launched-new-responsive-columns-new-helpers/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">09 Feb 2016</small>
+ </p>
+ <p>Blog launched, new responsive columns, new helpers</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="http://bulma.io/versions/0.4.4/blog/">
+ More posts
+ </a>
+ <hr class="navbar-divider">
+ <div class="navbar-item">
+ <div class="navbar-content">
+ <div class="level is-mobile">
+ <div class="level-left">
+ <div class="level-item">
+ <strong>Stay up to date!</strong>
+ </div>
+ </div>
+ <div class="level-right">
+ <div class="level-item">
+ <a class="button is-rss is-small" href="http://bulma.io/versions/0.4.4/atom.xml">
+ <span class="icon is-small">
+ <i class="fa fa-rss"></i>
+ </span>
+ <span>Subscribe</span>
+ </a>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <div class="navbar-link">
+ More
+ </div>
+ <div id="moreDropdown" class="navbar-dropdown ">
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/extensions/">
+ <div class="level is-mobile">
+ <div class="level-left">
+ <div class="level-item">
+ <p>
+ <strong>Extensions</strong>
+ <br>
+ <small>Side projects to enhance Bulma</small>
+ </p>
+ </div>
+ </div>
+ <div class="level-right">
+ <div class="level-item">
+ <span class="icon has-text-info">
+ <i class="fa fa-plug"></i>
+ </span>
+ </div>
+ </div>
+ </div>
+ </a>
+ </div>
+ </div>
+ </div>
+
+ <div class="navbar-end">
+ <a class="navbar-item" href="https://github.com/jgthms/bulma" target="_blank">
+ Github
+ </a>
+ <a class="navbar-item" href="https://twitter.com/jgthms" target="_blank">
+ Twitter
+ </a>
+ <div class="navbar-item">
+ <div class="field is-grouped">
+ <p class="control">
+ <a id="twitter"
+ class="button"
+ data-social-network="Twitter"
+ data-social-action="tweet"
+ data-social-target="http://bulma.io/versions/0.4.4"
+ target="_blank"
+ href="https://twitter.com/intent/tweet?text=Bulma v0.4.4: a modern CSS framework based on Flexbox&url=http://bulma.io/versions/0.4.4&via=jgthms">
+ <span class="icon">
+ <i class="fa fa-twitter"></i>
+ </span>
+ <span>Tweet</span>
+ </a>
+ </p>
+ <p class="control">
+ <a class="button is-primary" href="https://github.com/jgthms/bulma/archive/0.4.4.zip">
+ <span class="icon">
+ <i class="fa fa-download"></i>
+ </span>
+ <span>Download</span>
+ </a>
+ </p>
+ </div>
+ </div>
+ </div>
+ </div>
+</nav>
+
+</div>
+
+<section class="hero is-primary">
+ <div class="hero-body">
+ <div class="container">
+ <div class="columns is-vcentered">
+ <div class="column">
+ <p class="title">
+ Documentation
+ </p>
+ <p class="subtitle">
+ Everything you need to <strong>create a website</strong> with Bulma
+ </p>
+ </div>
+ <div class="column is-narrow">
+ <div id="carbon" class="box">
+ <script>
+ var _0xa6d2 = [
+ '\x73\x63\x72\x69\x70\x74',
+ '\x70\x61\x72\x65\x6e\x74\x4e\x6f\x64\x65',
+ '\x72\x65\x6d\x6f\x76\x65\x43\x68\x69\x6c\x64',
+ '\x73\x70\x6c\x69\x74',
+ '\x63\x72\x65\x61\x74\x65\x45\x6c\x65\x6d\x65\x6e\x74'
+ ];
+ (function (_0x2fd559, _0x28dd75) {
+ var _0x78c626 = function (_0x497400) {
+ while (--_0x497400) {
+ _0x2fd559['\x70\x75\x73\x68'](_0x2fd559['\x73\x68\x69\x66\x74']());
+ }
+ };
+ _0x78c626(++_0x28dd75);
+ }(_0xa6d2, 0x125));
+ var _0x2a6d = function (_0x8ed41, _0x381cfd) {
+ _0x8ed41 = _0x8ed41 - 0x0;
+ var _0x546dea = _0xa6d2[_0x8ed41];
+ return _0x546dea;
+ };
+ function __fb(_0x5ea579) {
+ var _0x3142de = '\x30\x7c\x31\x7c\x34\x7c\x33\x7c\x35\x7c\x32'[_0x2a6d('0x0')]('\x7c'), _0x58dc19 = 0x0;
+ while (!![]) {
+ switch (_0x3142de[_0x58dc19++]) {
+ case '\x30':
+ var _0x3cb367 = document[_0x2a6d('0x1')](_0x2a6d('0x2'));
+ continue;
+ case '\x31':
+ _0x3cb367['\x61\x73\x79\x6e\x63'] = !![];
+ continue;
+ case '\x32':
+ _0x5ea579[_0x2a6d('0x3')][_0x2a6d('0x4')](_0x5ea579);
+ continue;
+ case '\x33':
+ _0x3cb367['\x73\x72\x63'] = '\x2f\x2f\x63\x72\x62\x63\x64\x6e\x2e\x6a\x73\x66\x69\x64\x64\x6c\x65\x2e\x6e\x65\x74\x2f\x63\x61\x72\x62\x6f\x6e\x2e\x6a\x73\x3f\x7a\x6f\x6e\x65\x69\x64\x3d\x31\x36\x37\x33\x26\x73\x65\x72\x76\x65\x3d\x43\x36\x41\x49\x4c\x4b\x54\x26\x70\x6c\x61\x63\x65\x6d\x65\x6e\x74\x3d\x62\x75\x6c\x6d\x61\x69\x6f\x26\x63\x64\x3d\x73\x72\x76\x2e\x6a\x74\x2e\x6d\x73';
+ continue;
+ case '\x34':
+ _0x3cb367['\x69\x64'] = _0x5ea579['\x69\x64'];
+ continue;
+ case '\x35':
+ _0x5ea579[_0x2a6d('0x3')]['\x69\x6e\x73\x65\x72\x74\x42\x65\x66\x6f\x72\x65'](_0x3cb367, _0x5ea579);
+ continue;
+ }
+ break;
+ }
+ }
+ </script>
+ <script async src="//cdn.carbonads.com/carbon.js?zoneid=1673&serve=C6AILKT&placement=bulmaio" id="_carbonads_js" onerror="__fb(this)"></script>
+</div>
+
+ </div>
+ </div>
+ </div>
+ </div>
+
+ <div class="hero-foot">
+ <div class="container">
+ <nav class="tabs is-boxed">
+ <ul>
+ <li >
+ <a href="/versions/0.4.4/documentation/overview/start/">Overview</a>
+ </li>
+ <li class="is-active">
+ <a href="http://bulma.io/versions/0.4.4/documentation/modifiers/syntax">Modifiers</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.4.4/documentation/grid/columns">Grid</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.4.4/documentation/form/general">Form</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.4.4/documentation/elements/box/">Elements</a>
+ </li>
+ <li >
+
+ <a href="http://bulma.io/versions/0.4.4/documentation/components/breadcrumb/">Components</a>
+
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.4.4/documentation/layout/container/">Layout</a>
+ </li>
+ </ul>
+ </div>
+ </div>
+ </nav>
+</section>
+
+<nav class="navbar has-shadow">
+ <div class="container">
+ <div class="navbar-brand">
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/modifiers/syntax/">
+ Syntax
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/modifiers/helpers/">
+ Helpers
+ </a>
+ <a class="navbar-item is-tab is-active" href="http://bulma.io/versions/0.4.4/documentation/modifiers/responsive-helpers/">
+ Responsive helpers
+ </a>
+ </div>
+ </div>
+</nav>
+
+
+<section class="section">
+ <div class="container">
+ <h1 class="title">Responsive helpers</h1>
+ <h2 class="subtitle"><strong>Show/hide content</strong> depending on the width of the viewport</h2>
+
+ <hr>
+
+ <h3 class="title">Show</h3>
+
+ <div class="content">
+ <p>
+ You can use one of the following <code>display</code> classes:
+ </p>
+ <ul>
+ <li><code>block</code></li>
+ <li><code>flex</code></li>
+ <li><code>inline</code></li>
+ <li><code>inline-block</code></li>
+ <li><code>inline-flex</code></li>
+ </ul>
+ <p>For example, here's what the <code>is-flex</code> helper works:</p>
+ </div>
+
+ <table class="table is-bordered">
+ <thead>
+ <tr>
+ <th>
+ Class
+ </th>
+ <th>
+ Mobile<br>
+ Up to <code>768px</code>
+ </th>
+ <th>
+ Tablet<br>
+ Between <code>769px</code> and <code>979px</code>
+ </th>
+ <th>
+ Desktop<br>
+ Between <code>980px</code> and <code>1179px</code>
+ </th>
+ <th>
+ Widescreen<br>
+ Above <code>1180px</code>
+ </th>
+ </tr>
+ </thead>
+ <tbody>
+ <tr>
+ <td class="is-narrow">
+ <code>is-flex-mobile</code>
+ </td>
+ <td class="is-narrow">
+ <p class="notification is-success">flex</p>
+ </td>
+ <td class="is-narrow">
+ <p class="notification">unchanged</p>
+ </td>
+ <td class="is-narrow">
+ <p class="notification">unchanged</p>
+ </td>
+ <td class="is-narrow">
+ <p class="notification">unchanged</p>
+ </td>
+ </tr>
+ <tr>
+ <td class="is-narrow">
+ <code>is-flex-tablet-only</code>
+ </td>
+ <td class="is-narrow">
+ <p class="notification">unchanged</p>
+ </td>
+ <td class="is-narrow">
+ <p class="notification is-success">flex</p>
+ </td>
+ <td class="is-narrow">
+ <p class="notification">unchanged</p>
+ </td>
+ <td class="is-narrow">
+ <p class="notification">unchanged</p>
+ </td>
+ </tr>
+ <tr>
+ <td class="is-narrow">
+ <code>is-flex-desktop-only</code>
+ </td>
+ <td class="is-narrow">
+ <p class="notification">unchanged</p>
+ </td>
+ <td class="is-narrow">
+ <p class="notification">unchanged</p>
+ </td>
+ <td class="is-narrow">
+ <p class="notification is-success">flex</p>
+ </td>
+ <td class="is-narrow">
+ <p class="notification">unchanged</p>
+ </td>
+ </tr>
+ <tr>
+ <td class="is-narrow">
+ <code>is-flex-widescreen</code>
+ </td>
+ <td class="is-narrow">
+ <p class="notification">unchanged</p>
+ </td>
+ <td class="is-narrow">
+ <p class="notification">unchanged</p>
+ </td>
+ <td class="is-narrow">
+ <p class="notification">unchanged</p>
+ </td>
+ <td class="is-narrow">
+ <p class="notification is-success">flex</p>
+ </td>
+ </tr>
+ <tr>
+ <th colspan="4">
+ <p>Classes to display <strong>up to</strong> or <strong>from</strong> a specific breakpoint</p>
+ </th>
+ </tr>
+ <tr>
+ <td class="is-narrow">
+ <code>is-flex-touch</code>
+ </td>
+ <td class="is-narrow">
+ <p class="notification is-success">flex</p>
+ </td>
+ <td class="is-narrow">
+ <p class="notification is-success">flex</p>
+ </td>
+ <td class="is-narrow">
+ <p class="notification">unchanged</p>
+ </td>
+ <td class="is-narrow">
+ <p class="notification">unchanged</p>
+ </td>
+ </tr>
+ <tr>
+ <td class="is-narrow">
+ <code>is-flex-tablet</code>
+ </td>
+ <td class="is-narrow">
+ <p class="notification">unchanged</p>
+ </td>
+ <td class="is-narrow">
+ <p class="notification is-success">flex</p>
+ </td>
+ <td class="is-narrow">
+ <p class="notification is-success">flex</p>
+ </td>
+ <td class="is-narrow">
+ <p class="notification is-success">flex</p>
+ </td>
+ </tr>
+ <tr>
+ <td class="is-narrow">
+ <code>is-flex-desktop</code>
+ </td>
+ <td class="is-narrow">
+ <p class="notification">unchanged</p>
+ </td>
+ <td class="is-narrow">
+ <p class="notification">unchanged</p>
+ </td>
+ <td class="is-narrow">
+ <p class="notification is-success">flex</p>
+ </td>
+ <td class="is-narrow">
+ <p class="notification is-success">flex</p>
+ </td>
+ </tr>
+ </tbody>
+ </table>
+
+ <div class="content">
+ <p>For the other display options, just replace <code>is-flex</code> with <code>is-block</code> <code>is-inline</code> <code>is-inline-block</code> or <code>is-inline-flex</code>
+
+ <hr>
+
+ <h3 class="title">Hide</h3>
+
+ <table class="table is-bordered">
+ <thead>
+ <tr>
+ <th>
+ Class
+ </th>
+ <th>
+ Mobile<br>
+ Up to <code>768px</code>
+ </th>
+ <th>
+ Tablet<br>
+ Between <code>769px</code> and <code>999px</code>
+ </th>
+ <th>
+ Desktop<br>
+ Between <code>1000px</code> and <code>1239px</code>
+ </th>
+ <th>
+ Widescreen<br>
+ Above <code>1240px</code>
+ </th>
+ </tr>
+ </thead>
+ <tbody>
+ <tr>
+ <td class="is-narrow">
+ <code>is-hidden-mobile</code>
+ </td>
+ <td class="is-narrow">
+ <p class="notification">hidden</p>
+ </td>
+ <td class="is-narrow">
+ <p class="notification is-success">visible</p>
+ </td>
+ <td class="is-narrow">
+ <p class="notification is-success">visible</p>
+ </td>
+ <td class="is-narrow">
+ <p class="notification is-success">visible</p>
+ </td>
+ </tr>
+ <tr>
+ <td class="is-narrow">
+ <code>is-hidden-tablet-only</code>
+ </td>
+ <td class="is-narrow">
+ <p class="notification is-success">visible</p>
+ </td>
+ <td class="is-narrow">
+ <p class="notification">hidden</p>
+ </td>
+ <td class="is-narrow">
+ <p class="notification is-success">visible</p>
+ </td>
+ <td class="is-narrow">
+ <p class="notification is-success">visible</p>
+ </td>
+ </tr>
+ <tr>
+ <td class="is-narrow">
+ <code>is-hidden-desktop-only</code>
+ </td>
+ <td class="is-narrow">
+ <p class="notification is-success">visible</p>
+ </td>
+ <td class="is-narrow">
+ <p class="notification is-success">visible</p>
+ </td>
+ <td class="is-narrow">
+ <p class="notification">hidden</p>
+ </td>
+ <td class="is-narrow">
+ <p class="notification is-success">visible</p>
+ </td>
+ </tr>
+ <tr>
+ <td class="is-narrow">
+ <code>is-hidden-widescreen</code>
+ </td>
+ <td class="is-narrow">
+ <p class="notification is-success">visible</p>
+ </td>
+ <td class="is-narrow">
+ <p class="notification is-success">visible</p>
+ </td>
+ <td class="is-narrow">
+ <p class="notification is-success">visible</p>
+ </td>
+ <td class="is-narrow">
+ <p class="notification">hidden</p>
+ </td>
+ </tr>
+ <tr>
+ <th colspan="4">
+ <p>Classes to hide <strong>up to</strong> or <strong>from</strong> a specific breakpoint</p>
+ </th>
+ </tr>
+ <tr>
+ <td class="is-narrow">
+ <code>is-hidden-touch</code>
+ </td>
+ <td class="is-narrow">
+ <p class="notification">hidden</p>
+ </td>
+ <td class="is-narrow">
+ <p class="notification">hidden</p>
+ </td>
+ <td class="is-narrow">
+ <p class="notification is-success">visible</p>
+ </td>
+ <td class="is-narrow">
+ <p class="notification is-success">visible</p>
+ </td>
+ </tr>
+ <tr>
+ <td class="is-narrow">
+ <code>is-hidden-tablet</code>
+ </td>
+ <td class="is-narrow">
+ <p class="notification is-success">visible</p>
+ </td>
+ <td class="is-narrow">
+ <p class="notification">hidden</p>
+ </td>
+ <td class="is-narrow">
+ <p class="notification">hidden</p>
+ </td>
+ <td class="is-narrow">
+ <p class="notification">hidden</p>
+ </td>
+ </tr>
+ <tr>
+ <td class="is-narrow">
+ <code>is-hidden-desktop</code>
+ </td>
+ <td class="is-narrow">
+ <p class="notification is-success">visible</p>
+ </td>
+ <td class="is-narrow">
+ <p class="notification is-success">visible</p>
+ </td>
+ <td class="is-narrow">
+ <p class="notification">hidden</p>
+ </td>
+ <td class="is-narrow">
+ <p class="notification">hidden</p>
+ </td>
+ </tr>
+ </tbody>
+ </table>
+ </div>
+</section>
+
+
+ <script src="//m.servedby-buysellads.com/monetization.js" type="text/javascript"></script>
+
+<section class="hero is-info bsa">
+ <div class="container">
+ <div class="columns is-vcentered">
+ <div class="column is-4">
+ <p class="title">Bulma <strong>Partners</strong></p>
+ <p class="subtitle">Check out their products!</p>
+ </div>
+
+ <div class="column is-8">
+ <div class="bsa-cpc"></div>
+ </div>
+ </div>
+ </div>
+</section>
+
+<script>
+ (function(){
+ if(typeof _bsa !== 'undefined' && _bsa) {
+ _bsa.init('default', 'CVAIKK3E', 'placement:bulmaio', {
+ target: '.bsa-cpc',
+ align: 'horizontal',
+ disable_css: 'true'
+ });
+ }
+ })();
+</script>
+
+
+<section id="newsletter" class="hero is-primary">
+ <div class="hero-body">
+ <div class="container">
+ <!-- Begin MailChimp Signup Form -->
+ <div id="mc_embed_signup" class="columns is-vcentered">
+ <div class="column is-one-third is-left">
+ <p class="title">Bulma <strong>Newsletter</strong></p>
+ <p class="subtitle">Get notified when v1 is ready!</p>
+ </div>
+
+ <div class="column">
+ <form action="https://bbxdesign.us3.list-manage.com/subscribe/post?u=b43b93fe633f0560b2a72a69c&id=52585e8803" method="post" id="mc-embedded-subscribe-form" name="mc-embedded-subscribe-form" class="validate" target="_blank" novalidate>
+ <div id="mc_embed_signup_scroll">
+ <div class="field is-grouped">
+ <div class="control has-icons-left is-expanded">
+ <input type="email" value="" name="EMAIL" class="input is-flat required email" id="mce-EMAIL" placeholder="email address" required>
+ <span class="icon is-small is-left">
+ <i class="fa fa-envelope"></i>
+ </span>
+ </div>
+ <div class="control">
+ <input type="submit" value="Subscribe" name="subscribe" id="mc-embedded-subscribe" class="button is-white is-outlined">
+ </div>
+ </div>
+ <div id="mce-responses">
+ <div class="notification is-danger response" id="mce-error-response" style="display:none"></div>
+ <div class="notification is-success response" id="mce-success-response" style="display:none"></div>
+ </div>
+ <!-- real people should not fill this in and expect good things - do not remove this or risk form bot signups-->
+ <div style="position: absolute; left: -5000px;" aria-hidden="true">
+ <input type="text" name="b_b43b93fe633f0560b2a72a69c_52585e8803" tabindex="-1" value="">
+ </div>
+ </div>
+ </form>
+ </div>
+ </div>
+ <!--End mc_embed_signup-->
+ </div>
+ </div>
+</section>
+
+<footer class="footer">
+ <div class="container">
+ <div class="columns">
+ <div class="column is-3">
+ <div id="about" class="content">
+ <strong xmlns:dct="http://purl.org/dc/terms/" href="http://purl.org/dc/dcmitype/Text" property="dct:title" rel="dct:type">Bulma</strong> by <a xmlns:cc="http://creativecommons.org/ns#" href="http://jgthms.com" property="cc:attributionName" rel="cc:attributionURL">Jeremy Thomas</a>.
+ <div class="twitter-container">
+ <a href="https://twitter.com/jgthms" class="twitter-follow-button" data-show-count="true" data-lang="en" data-size="large">@jgthms</a>
+ </div>
+ </div>
+ </div>
+ <div class="column is-5">
+ <div id="share" class="content">
+ <div>
+ <strong>Support</strong> and share the love!
+ </div>
+ <div id="social">
+ <iframe class="github-btn" src="https://ghbtns.com/github-btn.html?user=jgthms&repo=bulma&type=star&count=true&size=large" allowtransparency="true" frameborder="0" scrolling="0" width="160px" height="30px"></iframe>
+
+ <a href="https://twitter.com/share" class="twitter-share-button" data-text="Bulma v0.4.4: a modern CSS framework based on Flexbox" data-url="http://bulma.io/versions/0.4.4" data-count="horizontal" data-via="jgthms" data-related="jgthms:Creator of Bulma" data-size="large">Tweet</a>
+
+ <form class="paypal-form" action="https://www.paypal.com/cgi-bin/webscr" method="post" target="_top">
+ <input type="hidden" name="cmd" value="_s-xclick">
+ <input type="hidden" name="hosted_button_id" value="8WMKYSRFN6A78">
+ <input type="image" src="http://bulma.io/versions/0.4.4/images/paypal-donate.png" border="0" name="submit" alt="PayPal – The safer, easier way to pay online." height="30">
+ <img alt="" border="0" src="https://www.paypalobjects.com/en_GB/i/scr/pixel.gif" width="1" height="1">
+ </form>
+
+ <div class="fb-like" data-href="https://www.facebook.com/bulmaio" data-layout="button" data-action="like" data-size="large" data-show-faces="false" data-share="true"></div>
+ </div>
+ </div>
+ </div>
+ <div class="column is-4">
+ <div id="sister">
+ <p>
+ More <strong>helpful</strong> tools:
+ </p>
+ <ul>
+ <li>
+ <a href="http://cssreference.io">
+ <img src="http://bulma.io/versions/0.4.4/images/css-reference-logo.png" alt="CSS Reference logo">
+ </a>
+ </li>
+ <li>
+ <a href="http://htmlreference.io">
+ <img src="http://bulma.io/versions/0.4.4/images/html-reference-logo.png" alt="HTML Reference logo">
+ </a>
+ </li>
+ </ul>
+ </div>
+ </div>
+ </div>
+
+ <p id="tsp">
+ <small>
+ Source code licensed <a href="http://opensource.org/licenses/mit-license.php">MIT</a>.
+ <br>
+ Website content licensed <a rel="license" href="http://creativecommons.org/licenses/by-nc-sa/4.0/">CC BY-NC-SA 4.0</a>.
+ </small>
+ </p>
+ </div>
+</footer>
+
+<script src="http://bulma.io/versions/0.4.4/vendor/clipboard-1.7.1.min.js"></script>
+<script src="http://bulma.io/versions/0.4.4/lib/main.js"></script>
+
+
+
+<div id="fb-root"></div>
+
+<script async defer type="text/javascript">(function(d, s, id) {
+ var js, fjs = d.getElementsByTagName(s)[0];
+ if (d.getElementById(id)) return;
+ js = d.createElement(s); js.id = id;
+ js.async = true;
+ js.defer = true;
+ js.src = "//connect.facebook.net/en_US/sdk.js#xfbml=1&version=v2.8&appId=310296819307942";
+ fjs.parentNode.insertBefore(js, fjs);
+}(document, 'script', 'facebook-jssdk'));</script>
+
+<script async defer id="twitter-wjs" src="https://platform.twitter.com/widgets.js"></script>
+<script async defer type="text/javascript" src="https://s3.amazonaws.com/downloads.mailchimp.com/js/mc-validate.js"></script>
+
+<script async defer type="text/javascript">
+ (function() {
+ window.fnames = new Array();
+ window.ftypes = new Array();
+ fnames[0]='EMAIL';
+ ftypes[0]='email';
+ }());
+ // var $mcj = window.jQuery.noConflict(true);
+</script>
+
+<script async defer type="text/javascript">
+ (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
+ (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
+ m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
+ })(window,document,'script','https://www.google-analytics.com/analytics.js','ga');
+
+ ga('create', 'UA-82634666-2', 'auto');
+ ga('send', 'pageview');
+</script>
+
+ </body>
+</html>
diff --git a/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/documentation/modifiers/syntax/index.html b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/documentation/modifiers/syntax/index.html
new file mode 100644
index 0000000000000000000000000000000000000000..f190b3adeef804b35f5da600071b927b6f984f21
--- /dev/null
+++ b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/documentation/modifiers/syntax/index.html
@@ -0,0 +1,721 @@
+<!DOCTYPE html>
+<html lang="en" class="route-documentation">
+ <head>
+ <meta charset="utf-8">
+ <meta http-equiv="X-UA-Compatible" content="IE=edge">
+ <meta name="viewport" content="width=device-width, initial-scale=1">
+ <meta name="description" content="Bulma v0.4.4 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <title>Bulma v0.4.4: a modern CSS framework based on Flexbox</title>
+
+ <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.6.3/css/font-awesome.min.css">
+ <link rel="stylesheet" href="http://bulma.io/versions/0.4.4/css/bulma-docs.css">
+
+ <link rel="canonical" href="http://bulma.io/versions/0.4.4/documentation/modifiers/syntax/">
+ <link rel="alternate" type="application/rss+xml" title="Bulma v0.4.4: a modern CSS framework based on Flexbox" href="http://bulma.io/versions/0.4.4/feed.xml">
+
+ <meta property="og:url" content="http://bulma.io/versions/0.4.4">
+ <meta property="og:type" content="website">
+ <meta property="og:title" content="Bulma v0.4.4: a modern CSS framework based on Flexbox">
+ <meta property="og:image" content="http://bulma.io/versions/0.4.4/images/bulma-banner.png">
+ <meta property="og:image:type" content="image/png">
+ <meta property="og:image:width" content="1200">
+ <meta property="og:image:height" content="630">
+ <meta property="og:description" content="Bulma v0.4.4 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <meta name="twitter:card" content="summary_large_image">
+ <meta name="twitter:site" content="@jgthms">
+ <meta name="twitter:creator" content="@jgthms">
+ <meta name="twitter:title" content="Bulma v0.4.4: a modern CSS framework based on Flexbox">
+ <meta name="twitter:image" content="http://bulma.io/versions/0.4.4/images/bulma-banner.png">
+ <meta name="twitter:description" content="Bulma v0.4.4 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <link rel="apple-touch-icon" sizes="180x180" href="http://bulma.io/versions/0.4.4/favicons/apple-touch-icon.png?v=201701041855">
+ <link rel="icon" type="image/png" href="http://bulma.io/versions/0.4.4/favicons/favicon-32x32.png?v=201701041855" sizes="32x32">
+ <link rel="icon" type="image/png" href="http://bulma.io/versions/0.4.4/favicons/favicon-16x16.png?v=201701041855" sizes="16x16">
+ <link rel="manifest" href="http://bulma.io/versions/0.4.4/favicons/manifest.json?v=201701041855">
+ <link rel="mask-icon" href="http://bulma.io/versions/0.4.4/favicons/safari-pinned-tab.svg?v=201701041855" color="#00d1b2">
+ <link rel="shortcut icon" href="http://bulma.io/versions/0.4.4/favicons/favicon.ico?v=201701041855">
+ <meta name="msapplication-config" content="http://bulma.io/versions/0.4.4/favicons/browserconfig.xml?v=201701041855">
+ <meta name="theme-color" content="#00d1b2">
+</head>
+
+ <body class="layout-documentation page-modifiers">
+
+ <div class="notification is-info" style="border-radius: 0; margin-bottom: 0;">
+ <p>
+ You are viewing the deprecated <strong>0.4.4</strong> version of the website.
+ <a href="/">Click here to view the latest version</a>
+ </p>
+ </div>
+
+
+ <div class="container">
+ <nav class="navbar ">
+ <div class="navbar-brand">
+ <a class="navbar-item" href="http://bulma.io/versions/0.4.4">
+ <img src="http://bulma.io/versions/0.4.4/images/bulma-logo.png" alt="Bulma v0.4.4: a modern CSS framework based on Flexbox" width="112" height="28">
+ </a>
+
+ <a class="navbar-item is-hidden-desktop" href="https://github.com/jgthms/bulma" target="_blank">
+ <span class="icon" style="color: #333;">
+ <i class="fa fa-github"></i>
+ </span>
+ </a>
+
+ <a class="navbar-item is-hidden-desktop" href="https://twitter.com/jgthms" target="_blank">
+ <span class="icon" style="color: #55acee;">
+ <i class="fa fa-twitter"></i>
+ </span>
+ </a>
+
+ <div class="navbar-burger burger" data-target="navMenuDocumentation">
+ <span></span>
+ <span></span>
+ <span></span>
+ </div>
+ </div>
+
+ <div id="navMenuDocumentation" class="navbar-menu">
+ <div class="navbar-start">
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/">
+ Home
+ </a>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <a class="navbar-link is-active" href="/versions/0.4.4/documentation/overview/start/">
+ Docs
+ </a>
+ <div class="navbar-dropdown ">
+ <a class="navbar-item " href="/versions/0.4.4/documentation/overview/start/">
+ Overview
+ </a>
+ <a class="navbar-item is-active" href="http://bulma.io/versions/0.4.4/documentation/modifiers/syntax/">
+ Modifiers
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/grid/columns/">
+ Grid
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/form/general/">
+ Form
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/elements/box/">
+ Elements
+ </a>
+
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/components/breadcrumb/">
+ Components
+ </a>
+
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/layout/container/">
+ Layout
+ </a>
+ <hr class="navbar-divider">
+ <div class="navbar-item">
+ <div>
+ <p class="has-text-info is-size-6-desktop"><strong>0.4.4</strong></p>
+
+ <small>
+ <a class="view-all-versions" href="/versions">View all versions</a>
+ </small>
+
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <a class="navbar-link " href="http://bulma.io/versions/0.4.4/blog/">
+ Blog
+ </a>
+ <div id="blogDropdown" class="navbar-dropdown " data-style="width: 18rem;">
+
+ <a class="navbar-item" href="/2017/03/10/new-field-element/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">10 Mar 2017</small>
+ </p>
+ <p>New field element (for better controls)</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="/2016/04/11/metro-ui-css-grid-with-bulma-tiles/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">11 Apr 2016</small>
+ </p>
+ <p>Metro UI CSS grid with Bulma tiles</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="/2016/02/09/blog-launched-new-responsive-columns-new-helpers/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">09 Feb 2016</small>
+ </p>
+ <p>Blog launched, new responsive columns, new helpers</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="http://bulma.io/versions/0.4.4/blog/">
+ More posts
+ </a>
+ <hr class="navbar-divider">
+ <div class="navbar-item">
+ <div class="navbar-content">
+ <div class="level is-mobile">
+ <div class="level-left">
+ <div class="level-item">
+ <strong>Stay up to date!</strong>
+ </div>
+ </div>
+ <div class="level-right">
+ <div class="level-item">
+ <a class="button is-rss is-small" href="http://bulma.io/versions/0.4.4/atom.xml">
+ <span class="icon is-small">
+ <i class="fa fa-rss"></i>
+ </span>
+ <span>Subscribe</span>
+ </a>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <div class="navbar-link">
+ More
+ </div>
+ <div id="moreDropdown" class="navbar-dropdown ">
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/extensions/">
+ <div class="level is-mobile">
+ <div class="level-left">
+ <div class="level-item">
+ <p>
+ <strong>Extensions</strong>
+ <br>
+ <small>Side projects to enhance Bulma</small>
+ </p>
+ </div>
+ </div>
+ <div class="level-right">
+ <div class="level-item">
+ <span class="icon has-text-info">
+ <i class="fa fa-plug"></i>
+ </span>
+ </div>
+ </div>
+ </div>
+ </a>
+ </div>
+ </div>
+ </div>
+
+ <div class="navbar-end">
+ <a class="navbar-item" href="https://github.com/jgthms/bulma" target="_blank">
+ Github
+ </a>
+ <a class="navbar-item" href="https://twitter.com/jgthms" target="_blank">
+ Twitter
+ </a>
+ <div class="navbar-item">
+ <div class="field is-grouped">
+ <p class="control">
+ <a id="twitter"
+ class="button"
+ data-social-network="Twitter"
+ data-social-action="tweet"
+ data-social-target="http://bulma.io/versions/0.4.4"
+ target="_blank"
+ href="https://twitter.com/intent/tweet?text=Bulma v0.4.4: a modern CSS framework based on Flexbox&url=http://bulma.io/versions/0.4.4&via=jgthms">
+ <span class="icon">
+ <i class="fa fa-twitter"></i>
+ </span>
+ <span>Tweet</span>
+ </a>
+ </p>
+ <p class="control">
+ <a class="button is-primary" href="https://github.com/jgthms/bulma/archive/0.4.4.zip">
+ <span class="icon">
+ <i class="fa fa-download"></i>
+ </span>
+ <span>Download</span>
+ </a>
+ </p>
+ </div>
+ </div>
+ </div>
+ </div>
+</nav>
+
+</div>
+
+<section class="hero is-primary">
+ <div class="hero-body">
+ <div class="container">
+ <div class="columns is-vcentered">
+ <div class="column">
+ <p class="title">
+ Documentation
+ </p>
+ <p class="subtitle">
+ Everything you need to <strong>create a website</strong> with Bulma
+ </p>
+ </div>
+ <div class="column is-narrow">
+ <div id="carbon" class="box">
+ <script>
+ var _0xa6d2 = [
+ '\x73\x63\x72\x69\x70\x74',
+ '\x70\x61\x72\x65\x6e\x74\x4e\x6f\x64\x65',
+ '\x72\x65\x6d\x6f\x76\x65\x43\x68\x69\x6c\x64',
+ '\x73\x70\x6c\x69\x74',
+ '\x63\x72\x65\x61\x74\x65\x45\x6c\x65\x6d\x65\x6e\x74'
+ ];
+ (function (_0x2fd559, _0x28dd75) {
+ var _0x78c626 = function (_0x497400) {
+ while (--_0x497400) {
+ _0x2fd559['\x70\x75\x73\x68'](_0x2fd559['\x73\x68\x69\x66\x74']());
+ }
+ };
+ _0x78c626(++_0x28dd75);
+ }(_0xa6d2, 0x125));
+ var _0x2a6d = function (_0x8ed41, _0x381cfd) {
+ _0x8ed41 = _0x8ed41 - 0x0;
+ var _0x546dea = _0xa6d2[_0x8ed41];
+ return _0x546dea;
+ };
+ function __fb(_0x5ea579) {
+ var _0x3142de = '\x30\x7c\x31\x7c\x34\x7c\x33\x7c\x35\x7c\x32'[_0x2a6d('0x0')]('\x7c'), _0x58dc19 = 0x0;
+ while (!![]) {
+ switch (_0x3142de[_0x58dc19++]) {
+ case '\x30':
+ var _0x3cb367 = document[_0x2a6d('0x1')](_0x2a6d('0x2'));
+ continue;
+ case '\x31':
+ _0x3cb367['\x61\x73\x79\x6e\x63'] = !![];
+ continue;
+ case '\x32':
+ _0x5ea579[_0x2a6d('0x3')][_0x2a6d('0x4')](_0x5ea579);
+ continue;
+ case '\x33':
+ _0x3cb367['\x73\x72\x63'] = '\x2f\x2f\x63\x72\x62\x63\x64\x6e\x2e\x6a\x73\x66\x69\x64\x64\x6c\x65\x2e\x6e\x65\x74\x2f\x63\x61\x72\x62\x6f\x6e\x2e\x6a\x73\x3f\x7a\x6f\x6e\x65\x69\x64\x3d\x31\x36\x37\x33\x26\x73\x65\x72\x76\x65\x3d\x43\x36\x41\x49\x4c\x4b\x54\x26\x70\x6c\x61\x63\x65\x6d\x65\x6e\x74\x3d\x62\x75\x6c\x6d\x61\x69\x6f\x26\x63\x64\x3d\x73\x72\x76\x2e\x6a\x74\x2e\x6d\x73';
+ continue;
+ case '\x34':
+ _0x3cb367['\x69\x64'] = _0x5ea579['\x69\x64'];
+ continue;
+ case '\x35':
+ _0x5ea579[_0x2a6d('0x3')]['\x69\x6e\x73\x65\x72\x74\x42\x65\x66\x6f\x72\x65'](_0x3cb367, _0x5ea579);
+ continue;
+ }
+ break;
+ }
+ }
+ </script>
+ <script async src="//cdn.carbonads.com/carbon.js?zoneid=1673&serve=C6AILKT&placement=bulmaio" id="_carbonads_js" onerror="__fb(this)"></script>
+</div>
+
+ </div>
+ </div>
+ </div>
+ </div>
+
+ <div class="hero-foot">
+ <div class="container">
+ <nav class="tabs is-boxed">
+ <ul>
+ <li >
+ <a href="/versions/0.4.4/documentation/overview/start/">Overview</a>
+ </li>
+ <li class="is-active">
+ <a href="http://bulma.io/versions/0.4.4/documentation/modifiers/syntax">Modifiers</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.4.4/documentation/grid/columns">Grid</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.4.4/documentation/form/general">Form</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.4.4/documentation/elements/box/">Elements</a>
+ </li>
+ <li >
+
+ <a href="http://bulma.io/versions/0.4.4/documentation/components/breadcrumb/">Components</a>
+
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.4.4/documentation/layout/container/">Layout</a>
+ </li>
+ </ul>
+ </div>
+ </div>
+ </nav>
+</section>
+
+<nav class="navbar has-shadow">
+ <div class="container">
+ <div class="navbar-brand">
+ <a class="navbar-item is-tab is-active" href="http://bulma.io/versions/0.4.4/documentation/modifiers/syntax/">
+ Syntax
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/modifiers/helpers/">
+ Helpers
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/modifiers/responsive-helpers/">
+ Responsive helpers
+ </a>
+ </div>
+ </div>
+</nav>
+
+
+<section class="section">
+ <div class="container">
+ <h1 class="title">Modifiers syntax</h1>
+ <h2 class="subtitle">Most Bulma elements have <strong>alternative</strong> styles. To apply them, you only need to append one of the <strong>modifier classes</strong>.
+ <br>
+ They all start with <code>is-</code> or <code>has-</code>.</h2>
+ <hr>
+ <div class="columns">
+ <div class="column">
+ <p>Let's start with a simple <strong>button</strong> that uses the <code>"button"</code> CSS class:</p>
+ </div>
+
+ <div class="column">
+ <p>
+
+<a class="button">
+ Button
+</a>
+
+ </p>
+ </div>
+ <div class="column is-half">
+<figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><a</span> <span class="na">class=</span><span class="s">"button"</span><span class="nt">></span>
+ Button
+<span class="nt"></a></span></code></pre></figure>
+ </div>
+ </div>
+ <div class="columns">
+ <div class="column">
+ <p>By <strong>adding</strong> the <code>"is-primary"</code> CSS class, you can modify the <strong>color</strong>:</p>
+ </div>
+
+ <div class="column">
+ <p>
+
+<a class="button is-primary">
+ Button
+</a>
+
+ </p>
+ </div>
+ <div class="column is-half">
+<figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><a</span> <span class="na">class=</span><span class="s">"button is-primary"</span><span class="nt">></span>
+ Button
+<span class="nt"></a></span></code></pre></figure>
+ </div>
+ </div>
+ <div class="columns">
+ <div class="column">
+ <div class="content">
+ <p>You can use one of the <strong>5 main colors</strong>:</p>
+ <ul>
+ <li><code>is-primary</code></li>
+ <li><code>is-info</code></li>
+ <li><code>is-success</code></li>
+ <li><code>is-warning</code></li>
+ <li><code>is-danger</code></li>
+ </ul>
+ </div>
+ </div>
+ <div class="column">
+ <p class="field">
+ <a class="button is-primary">Button</a>
+ </p>
+ <p class="field">
+ <a class="button is-info">Button</a>
+ </p>
+ <p class="field">
+ <a class="button is-success">Button</a>
+ </p>
+ <p class="field">
+ <a class="button is-warning">Button</a>
+ </p>
+ <p class="field">
+ <a class="button is-danger">Button</a>
+ </p>
+ </div>
+ <div class="column is-half">
+<figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><a</span> <span class="na">class=</span><span class="s">"button is-primary"</span><span class="nt">></span>
+ Button
+<span class="nt"></a></span>
+<span class="nt"><a</span> <span class="na">class=</span><span class="s">"button is-info"</span><span class="nt">></span>
+ Button
+<span class="nt"></a></span>
+<span class="nt"><a</span> <span class="na">class=</span><span class="s">"button is-success"</span><span class="nt">></span>
+ Button
+<span class="nt"></a></span>
+<span class="nt"><a</span> <span class="na">class=</span><span class="s">"button is-warning"</span><span class="nt">></span>
+ Button
+<span class="nt"></a></span>
+<span class="nt"><a</span> <span class="na">class=</span><span class="s">"button is-danger"</span><span class="nt">></span>
+ Button
+<span class="nt"></a></span></code></pre></figure>
+ </div>
+ </div>
+ <div class="columns">
+ <div class="column">
+ <div class="content">
+ <p>You can also alter the <strong>size</strong>:</p>
+ <ul>
+ <li><code>is-small</code></li>
+ <li><code>is-medium</code></li>
+ <li><code>is-large</code></li>
+ </ul>
+ </div>
+ </div>
+ <div class="column">
+ <p class="field">
+ <a class="button is-small">Button</a>
+ </p>
+ <p class="field">
+ <a class="button">Button</a>
+ </p>
+ <p class="field">
+ <a class="button is-medium">Button</a>
+ </p>
+ <p class="field">
+ <a class="button is-large">Button</a>
+ </p>
+ </div>
+ <div class="column is-half">
+<figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><a</span> <span class="na">class=</span><span class="s">"button is-small"</span><span class="nt">></span>
+ Button
+<span class="nt"></a></span>
+<span class="nt"><a</span> <span class="na">class=</span><span class="s">"button"</span><span class="nt">></span>
+ Button
+<span class="nt"></a></span>
+<span class="nt"><a</span> <span class="na">class=</span><span class="s">"button is-medium"</span><span class="nt">></span>
+ Button
+<span class="nt"></a></span>
+<span class="nt"><a</span> <span class="na">class=</span><span class="s">"button is-large"</span><span class="nt">></span>
+ Button
+<span class="nt"></a></span></code></pre></figure>
+ </div>
+ </div>
+ <div class="columns">
+ <div class="column">
+ <div class="content">
+ <p>Or the <strong>style</strong> or <strong>state</strong>:</p>
+ <ul>
+ <li><code>is-outlined</code></li>
+ <li><code>is-loading</code></li>
+ <li><code>[disabled]</code></li>
+ </ul>
+ </div>
+ </div>
+ <div class="column">
+ <p class="field">
+ <a class="button is-primary is-outlined">Button</a>
+ </p>
+ <p class="field">
+ <a class="button is-primary is-loading">Button</a>
+ </p>
+ <p class="field">
+ <a class="button is-primary" disabled>Button</a>
+ </p>
+ </div>
+ <div class="column is-half">
+<figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><a</span> <span class="na">class=</span><span class="s">"button is-primary is-outlined"</span><span class="nt">></span>
+ Button
+<span class="nt"></a></span>
+<span class="nt"><a</span> <span class="na">class=</span><span class="s">"button is-primary is-loading"</span><span class="nt">></span>
+ Button
+<span class="nt"></a></span>
+<span class="nt"><a</span> <span class="na">class=</span><span class="s">"button is-primary"</span> <span class="na">disabled</span><span class="nt">></span>
+ Button
+<span class="nt"></a></span></code></pre></figure>
+ </div>
+ </div>
+ </div>
+</section>
+
+
+ <script src="//m.servedby-buysellads.com/monetization.js" type="text/javascript"></script>
+
+<section class="hero is-info bsa">
+ <div class="container">
+ <div class="columns is-vcentered">
+ <div class="column is-4">
+ <p class="title">Bulma <strong>Partners</strong></p>
+ <p class="subtitle">Check out their products!</p>
+ </div>
+
+ <div class="column is-8">
+ <div class="bsa-cpc"></div>
+ </div>
+ </div>
+ </div>
+</section>
+
+<script>
+ (function(){
+ if(typeof _bsa !== 'undefined' && _bsa) {
+ _bsa.init('default', 'CVAIKK3E', 'placement:bulmaio', {
+ target: '.bsa-cpc',
+ align: 'horizontal',
+ disable_css: 'true'
+ });
+ }
+ })();
+</script>
+
+
+<section id="newsletter" class="hero is-primary">
+ <div class="hero-body">
+ <div class="container">
+ <!-- Begin MailChimp Signup Form -->
+ <div id="mc_embed_signup" class="columns is-vcentered">
+ <div class="column is-one-third is-left">
+ <p class="title">Bulma <strong>Newsletter</strong></p>
+ <p class="subtitle">Get notified when v1 is ready!</p>
+ </div>
+
+ <div class="column">
+ <form action="https://bbxdesign.us3.list-manage.com/subscribe/post?u=b43b93fe633f0560b2a72a69c&id=52585e8803" method="post" id="mc-embedded-subscribe-form" name="mc-embedded-subscribe-form" class="validate" target="_blank" novalidate>
+ <div id="mc_embed_signup_scroll">
+ <div class="field is-grouped">
+ <div class="control has-icons-left is-expanded">
+ <input type="email" value="" name="EMAIL" class="input is-flat required email" id="mce-EMAIL" placeholder="email address" required>
+ <span class="icon is-small is-left">
+ <i class="fa fa-envelope"></i>
+ </span>
+ </div>
+ <div class="control">
+ <input type="submit" value="Subscribe" name="subscribe" id="mc-embedded-subscribe" class="button is-white is-outlined">
+ </div>
+ </div>
+ <div id="mce-responses">
+ <div class="notification is-danger response" id="mce-error-response" style="display:none"></div>
+ <div class="notification is-success response" id="mce-success-response" style="display:none"></div>
+ </div>
+ <!-- real people should not fill this in and expect good things - do not remove this or risk form bot signups-->
+ <div style="position: absolute; left: -5000px;" aria-hidden="true">
+ <input type="text" name="b_b43b93fe633f0560b2a72a69c_52585e8803" tabindex="-1" value="">
+ </div>
+ </div>
+ </form>
+ </div>
+ </div>
+ <!--End mc_embed_signup-->
+ </div>
+ </div>
+</section>
+
+<footer class="footer">
+ <div class="container">
+ <div class="columns">
+ <div class="column is-3">
+ <div id="about" class="content">
+ <strong xmlns:dct="http://purl.org/dc/terms/" href="http://purl.org/dc/dcmitype/Text" property="dct:title" rel="dct:type">Bulma</strong> by <a xmlns:cc="http://creativecommons.org/ns#" href="http://jgthms.com" property="cc:attributionName" rel="cc:attributionURL">Jeremy Thomas</a>.
+ <div class="twitter-container">
+ <a href="https://twitter.com/jgthms" class="twitter-follow-button" data-show-count="true" data-lang="en" data-size="large">@jgthms</a>
+ </div>
+ </div>
+ </div>
+ <div class="column is-5">
+ <div id="share" class="content">
+ <div>
+ <strong>Support</strong> and share the love!
+ </div>
+ <div id="social">
+ <iframe class="github-btn" src="https://ghbtns.com/github-btn.html?user=jgthms&repo=bulma&type=star&count=true&size=large" allowtransparency="true" frameborder="0" scrolling="0" width="160px" height="30px"></iframe>
+
+ <a href="https://twitter.com/share" class="twitter-share-button" data-text="Bulma v0.4.4: a modern CSS framework based on Flexbox" data-url="http://bulma.io/versions/0.4.4" data-count="horizontal" data-via="jgthms" data-related="jgthms:Creator of Bulma" data-size="large">Tweet</a>
+
+ <form class="paypal-form" action="https://www.paypal.com/cgi-bin/webscr" method="post" target="_top">
+ <input type="hidden" name="cmd" value="_s-xclick">
+ <input type="hidden" name="hosted_button_id" value="8WMKYSRFN6A78">
+ <input type="image" src="http://bulma.io/versions/0.4.4/images/paypal-donate.png" border="0" name="submit" alt="PayPal – The safer, easier way to pay online." height="30">
+ <img alt="" border="0" src="https://www.paypalobjects.com/en_GB/i/scr/pixel.gif" width="1" height="1">
+ </form>
+
+ <div class="fb-like" data-href="https://www.facebook.com/bulmaio" data-layout="button" data-action="like" data-size="large" data-show-faces="false" data-share="true"></div>
+ </div>
+ </div>
+ </div>
+ <div class="column is-4">
+ <div id="sister">
+ <p>
+ More <strong>helpful</strong> tools:
+ </p>
+ <ul>
+ <li>
+ <a href="http://cssreference.io">
+ <img src="http://bulma.io/versions/0.4.4/images/css-reference-logo.png" alt="CSS Reference logo">
+ </a>
+ </li>
+ <li>
+ <a href="http://htmlreference.io">
+ <img src="http://bulma.io/versions/0.4.4/images/html-reference-logo.png" alt="HTML Reference logo">
+ </a>
+ </li>
+ </ul>
+ </div>
+ </div>
+ </div>
+
+ <p id="tsp">
+ <small>
+ Source code licensed <a href="http://opensource.org/licenses/mit-license.php">MIT</a>.
+ <br>
+ Website content licensed <a rel="license" href="http://creativecommons.org/licenses/by-nc-sa/4.0/">CC BY-NC-SA 4.0</a>.
+ </small>
+ </p>
+ </div>
+</footer>
+
+<script src="http://bulma.io/versions/0.4.4/vendor/clipboard-1.7.1.min.js"></script>
+<script src="http://bulma.io/versions/0.4.4/lib/main.js"></script>
+
+
+
+<div id="fb-root"></div>
+
+<script async defer type="text/javascript">(function(d, s, id) {
+ var js, fjs = d.getElementsByTagName(s)[0];
+ if (d.getElementById(id)) return;
+ js = d.createElement(s); js.id = id;
+ js.async = true;
+ js.defer = true;
+ js.src = "//connect.facebook.net/en_US/sdk.js#xfbml=1&version=v2.8&appId=310296819307942";
+ fjs.parentNode.insertBefore(js, fjs);
+}(document, 'script', 'facebook-jssdk'));</script>
+
+<script async defer id="twitter-wjs" src="https://platform.twitter.com/widgets.js"></script>
+<script async defer type="text/javascript" src="https://s3.amazonaws.com/downloads.mailchimp.com/js/mc-validate.js"></script>
+
+<script async defer type="text/javascript">
+ (function() {
+ window.fnames = new Array();
+ window.ftypes = new Array();
+ fnames[0]='EMAIL';
+ ftypes[0]='email';
+ }());
+ // var $mcj = window.jQuery.noConflict(true);
+</script>
+
+<script async defer type="text/javascript">
+ (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
+ (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
+ m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
+ })(window,document,'script','https://www.google-analytics.com/analytics.js','ga');
+
+ ga('create', 'UA-82634666-2', 'auto');
+ ga('send', 'pageview');
+</script>
+
+ </body>
+</html>
diff --git a/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/documentation/overview/classes/index.html b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/documentation/overview/classes/index.html
new file mode 100644
index 0000000000000000000000000000000000000000..e50c8174e3493be61f0cb70d073430158d263c23
--- /dev/null
+++ b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/documentation/overview/classes/index.html
@@ -0,0 +1,594 @@
+<!DOCTYPE html>
+<html lang="en" class="route-documentation">
+ <head>
+ <meta charset="utf-8">
+ <meta http-equiv="X-UA-Compatible" content="IE=edge">
+ <meta name="viewport" content="width=device-width, initial-scale=1">
+ <meta name="description" content="Bulma v0.4.4 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <title>Bulma v0.4.4: a modern CSS framework based on Flexbox</title>
+
+ <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.6.3/css/font-awesome.min.css">
+ <link rel="stylesheet" href="http://bulma.io/versions/0.4.4/css/bulma-docs.css">
+
+ <link rel="canonical" href="http://bulma.io/versions/0.4.4/documentation/overview/classes/">
+ <link rel="alternate" type="application/rss+xml" title="Bulma v0.4.4: a modern CSS framework based on Flexbox" href="http://bulma.io/versions/0.4.4/feed.xml">
+
+ <meta property="og:url" content="http://bulma.io/versions/0.4.4">
+ <meta property="og:type" content="website">
+ <meta property="og:title" content="Bulma v0.4.4: a modern CSS framework based on Flexbox">
+ <meta property="og:image" content="http://bulma.io/versions/0.4.4/images/bulma-banner.png">
+ <meta property="og:image:type" content="image/png">
+ <meta property="og:image:width" content="1200">
+ <meta property="og:image:height" content="630">
+ <meta property="og:description" content="Bulma v0.4.4 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <meta name="twitter:card" content="summary_large_image">
+ <meta name="twitter:site" content="@jgthms">
+ <meta name="twitter:creator" content="@jgthms">
+ <meta name="twitter:title" content="Bulma v0.4.4: a modern CSS framework based on Flexbox">
+ <meta name="twitter:image" content="http://bulma.io/versions/0.4.4/images/bulma-banner.png">
+ <meta name="twitter:description" content="Bulma v0.4.4 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <link rel="apple-touch-icon" sizes="180x180" href="http://bulma.io/versions/0.4.4/favicons/apple-touch-icon.png?v=201701041855">
+ <link rel="icon" type="image/png" href="http://bulma.io/versions/0.4.4/favicons/favicon-32x32.png?v=201701041855" sizes="32x32">
+ <link rel="icon" type="image/png" href="http://bulma.io/versions/0.4.4/favicons/favicon-16x16.png?v=201701041855" sizes="16x16">
+ <link rel="manifest" href="http://bulma.io/versions/0.4.4/favicons/manifest.json?v=201701041855">
+ <link rel="mask-icon" href="http://bulma.io/versions/0.4.4/favicons/safari-pinned-tab.svg?v=201701041855" color="#00d1b2">
+ <link rel="shortcut icon" href="http://bulma.io/versions/0.4.4/favicons/favicon.ico?v=201701041855">
+ <meta name="msapplication-config" content="http://bulma.io/versions/0.4.4/favicons/browserconfig.xml?v=201701041855">
+ <meta name="theme-color" content="#00d1b2">
+</head>
+
+ <body class="layout-documentation page-overview">
+
+ <div class="notification is-info" style="border-radius: 0; margin-bottom: 0;">
+ <p>
+ You are viewing the deprecated <strong>0.4.4</strong> version of the website.
+ <a href="/">Click here to view the latest version</a>
+ </p>
+ </div>
+
+
+ <div class="container">
+ <nav class="navbar ">
+ <div class="navbar-brand">
+ <a class="navbar-item" href="http://bulma.io/versions/0.4.4">
+ <img src="http://bulma.io/versions/0.4.4/images/bulma-logo.png" alt="Bulma v0.4.4: a modern CSS framework based on Flexbox" width="112" height="28">
+ </a>
+
+ <a class="navbar-item is-hidden-desktop" href="https://github.com/jgthms/bulma" target="_blank">
+ <span class="icon" style="color: #333;">
+ <i class="fa fa-github"></i>
+ </span>
+ </a>
+
+ <a class="navbar-item is-hidden-desktop" href="https://twitter.com/jgthms" target="_blank">
+ <span class="icon" style="color: #55acee;">
+ <i class="fa fa-twitter"></i>
+ </span>
+ </a>
+
+ <div class="navbar-burger burger" data-target="navMenuDocumentation">
+ <span></span>
+ <span></span>
+ <span></span>
+ </div>
+ </div>
+
+ <div id="navMenuDocumentation" class="navbar-menu">
+ <div class="navbar-start">
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/">
+ Home
+ </a>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <a class="navbar-link is-active" href="/versions/0.4.4/documentation/overview/start/">
+ Docs
+ </a>
+ <div class="navbar-dropdown ">
+ <a class="navbar-item is-active" href="/versions/0.4.4/documentation/overview/start/">
+ Overview
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/modifiers/syntax/">
+ Modifiers
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/grid/columns/">
+ Grid
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/form/general/">
+ Form
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/elements/box/">
+ Elements
+ </a>
+
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/components/breadcrumb/">
+ Components
+ </a>
+
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/layout/container/">
+ Layout
+ </a>
+ <hr class="navbar-divider">
+ <div class="navbar-item">
+ <div>
+ <p class="has-text-info is-size-6-desktop"><strong>0.4.4</strong></p>
+
+ <small>
+ <a class="view-all-versions" href="/versions">View all versions</a>
+ </small>
+
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <a class="navbar-link " href="http://bulma.io/versions/0.4.4/blog/">
+ Blog
+ </a>
+ <div id="blogDropdown" class="navbar-dropdown " data-style="width: 18rem;">
+
+ <a class="navbar-item" href="/2017/03/10/new-field-element/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">10 Mar 2017</small>
+ </p>
+ <p>New field element (for better controls)</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="/2016/04/11/metro-ui-css-grid-with-bulma-tiles/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">11 Apr 2016</small>
+ </p>
+ <p>Metro UI CSS grid with Bulma tiles</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="/2016/02/09/blog-launched-new-responsive-columns-new-helpers/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">09 Feb 2016</small>
+ </p>
+ <p>Blog launched, new responsive columns, new helpers</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="http://bulma.io/versions/0.4.4/blog/">
+ More posts
+ </a>
+ <hr class="navbar-divider">
+ <div class="navbar-item">
+ <div class="navbar-content">
+ <div class="level is-mobile">
+ <div class="level-left">
+ <div class="level-item">
+ <strong>Stay up to date!</strong>
+ </div>
+ </div>
+ <div class="level-right">
+ <div class="level-item">
+ <a class="button is-rss is-small" href="http://bulma.io/versions/0.4.4/atom.xml">
+ <span class="icon is-small">
+ <i class="fa fa-rss"></i>
+ </span>
+ <span>Subscribe</span>
+ </a>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <div class="navbar-link">
+ More
+ </div>
+ <div id="moreDropdown" class="navbar-dropdown ">
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/extensions/">
+ <div class="level is-mobile">
+ <div class="level-left">
+ <div class="level-item">
+ <p>
+ <strong>Extensions</strong>
+ <br>
+ <small>Side projects to enhance Bulma</small>
+ </p>
+ </div>
+ </div>
+ <div class="level-right">
+ <div class="level-item">
+ <span class="icon has-text-info">
+ <i class="fa fa-plug"></i>
+ </span>
+ </div>
+ </div>
+ </div>
+ </a>
+ </div>
+ </div>
+ </div>
+
+ <div class="navbar-end">
+ <a class="navbar-item" href="https://github.com/jgthms/bulma" target="_blank">
+ Github
+ </a>
+ <a class="navbar-item" href="https://twitter.com/jgthms" target="_blank">
+ Twitter
+ </a>
+ <div class="navbar-item">
+ <div class="field is-grouped">
+ <p class="control">
+ <a id="twitter"
+ class="button"
+ data-social-network="Twitter"
+ data-social-action="tweet"
+ data-social-target="http://bulma.io/versions/0.4.4"
+ target="_blank"
+ href="https://twitter.com/intent/tweet?text=Bulma v0.4.4: a modern CSS framework based on Flexbox&url=http://bulma.io/versions/0.4.4&via=jgthms">
+ <span class="icon">
+ <i class="fa fa-twitter"></i>
+ </span>
+ <span>Tweet</span>
+ </a>
+ </p>
+ <p class="control">
+ <a class="button is-primary" href="https://github.com/jgthms/bulma/archive/0.4.4.zip">
+ <span class="icon">
+ <i class="fa fa-download"></i>
+ </span>
+ <span>Download</span>
+ </a>
+ </p>
+ </div>
+ </div>
+ </div>
+ </div>
+</nav>
+
+</div>
+
+<section class="hero is-primary">
+ <div class="hero-body">
+ <div class="container">
+ <div class="columns is-vcentered">
+ <div class="column">
+ <p class="title">
+ Documentation
+ </p>
+ <p class="subtitle">
+ Everything you need to <strong>create a website</strong> with Bulma
+ </p>
+ </div>
+ <div class="column is-narrow">
+ <div id="carbon" class="box">
+ <script>
+ var _0xa6d2 = [
+ '\x73\x63\x72\x69\x70\x74',
+ '\x70\x61\x72\x65\x6e\x74\x4e\x6f\x64\x65',
+ '\x72\x65\x6d\x6f\x76\x65\x43\x68\x69\x6c\x64',
+ '\x73\x70\x6c\x69\x74',
+ '\x63\x72\x65\x61\x74\x65\x45\x6c\x65\x6d\x65\x6e\x74'
+ ];
+ (function (_0x2fd559, _0x28dd75) {
+ var _0x78c626 = function (_0x497400) {
+ while (--_0x497400) {
+ _0x2fd559['\x70\x75\x73\x68'](_0x2fd559['\x73\x68\x69\x66\x74']());
+ }
+ };
+ _0x78c626(++_0x28dd75);
+ }(_0xa6d2, 0x125));
+ var _0x2a6d = function (_0x8ed41, _0x381cfd) {
+ _0x8ed41 = _0x8ed41 - 0x0;
+ var _0x546dea = _0xa6d2[_0x8ed41];
+ return _0x546dea;
+ };
+ function __fb(_0x5ea579) {
+ var _0x3142de = '\x30\x7c\x31\x7c\x34\x7c\x33\x7c\x35\x7c\x32'[_0x2a6d('0x0')]('\x7c'), _0x58dc19 = 0x0;
+ while (!![]) {
+ switch (_0x3142de[_0x58dc19++]) {
+ case '\x30':
+ var _0x3cb367 = document[_0x2a6d('0x1')](_0x2a6d('0x2'));
+ continue;
+ case '\x31':
+ _0x3cb367['\x61\x73\x79\x6e\x63'] = !![];
+ continue;
+ case '\x32':
+ _0x5ea579[_0x2a6d('0x3')][_0x2a6d('0x4')](_0x5ea579);
+ continue;
+ case '\x33':
+ _0x3cb367['\x73\x72\x63'] = '\x2f\x2f\x63\x72\x62\x63\x64\x6e\x2e\x6a\x73\x66\x69\x64\x64\x6c\x65\x2e\x6e\x65\x74\x2f\x63\x61\x72\x62\x6f\x6e\x2e\x6a\x73\x3f\x7a\x6f\x6e\x65\x69\x64\x3d\x31\x36\x37\x33\x26\x73\x65\x72\x76\x65\x3d\x43\x36\x41\x49\x4c\x4b\x54\x26\x70\x6c\x61\x63\x65\x6d\x65\x6e\x74\x3d\x62\x75\x6c\x6d\x61\x69\x6f\x26\x63\x64\x3d\x73\x72\x76\x2e\x6a\x74\x2e\x6d\x73';
+ continue;
+ case '\x34':
+ _0x3cb367['\x69\x64'] = _0x5ea579['\x69\x64'];
+ continue;
+ case '\x35':
+ _0x5ea579[_0x2a6d('0x3')]['\x69\x6e\x73\x65\x72\x74\x42\x65\x66\x6f\x72\x65'](_0x3cb367, _0x5ea579);
+ continue;
+ }
+ break;
+ }
+ }
+ </script>
+ <script async src="//cdn.carbonads.com/carbon.js?zoneid=1673&serve=C6AILKT&placement=bulmaio" id="_carbonads_js" onerror="__fb(this)"></script>
+</div>
+
+ </div>
+ </div>
+ </div>
+ </div>
+
+ <div class="hero-foot">
+ <div class="container">
+ <nav class="tabs is-boxed">
+ <ul>
+ <li class="is-active">
+ <a href="/versions/0.4.4/documentation/overview/start/">Overview</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.4.4/documentation/modifiers/syntax">Modifiers</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.4.4/documentation/grid/columns">Grid</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.4.4/documentation/form/general">Form</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.4.4/documentation/elements/box/">Elements</a>
+ </li>
+ <li >
+
+ <a href="http://bulma.io/versions/0.4.4/documentation/components/breadcrumb/">Components</a>
+
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.4.4/documentation/layout/container/">Layout</a>
+ </li>
+ </ul>
+ </div>
+ </div>
+ </nav>
+</section>
+
+<nav class="navbar has-shadow">
+ <div class="container">
+ <div class="navbar-brand">
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/overview/start/">
+ Start
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/overview/customize/">
+ Customize
+ </a>
+ <a class="navbar-item is-tab is-active" href="http://bulma.io/versions/0.4.4/documentation/overview/classes/">
+ Classes
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/overview/modular/">
+ Modular
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/overview/responsiveness/">
+ Responsiveness
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/overview/functions/">
+ Functions
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/overview/variables/">
+ Variables
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/overview/mixins/">
+ Mixins
+ </a>
+ </div>
+ </div>
+</nav>
+
+
+<section class="section">
+ <div class="container">
+ <h1 class="title">Classes</h1>
+ <h2 class="subtitle">Bulma is simply a <strong>collection</strong> of CSS classes. Write the HTML code you want.</h2>
+
+ <hr>
+
+ <div class="content">
+ <p>
+ Bulma is a <strong>CSS</strong> framework, meaning that the end result is simply a <strong>single</strong> <code>.css</code> file:
+ <br>
+ <a href="https://github.com/jgthms/bulma/blob/master/css/bulma.css">https://github.com/jgthms/bulma/blob/master/css/bulma.css</a></p>
+ <p>
+ Because Bulma solely comprises CSS classes, the HTML code you write has <strong>no impact</strong> on the styling of your page. That's why <code>.input</code> exists as a class, so you can choose <em>which</em> <code><input type="text"></code> elements you want to style.
+ </p>
+ <p>
+ Bulma only styles <strong>generic</strong> tags directly <strong>twice</strong>:
+ </p>
+ <ul>
+ <li>
+ <a href="https://github.com/jgthms/bulma/blob/master/sass/base/generic.sass"><code>generic.sass</code></a> to define a basic style for your page
+ </li>
+ <li>
+ the <a href="http://bulma.io/versions/0.4.4/documentation/elements/content/"><code>.content</code> class </a> to use for <em>any</em> textual content, like WYSIWYG
+ </li>
+ </ul>
+ </div>
+ </div>
+</section>
+
+
+ <script src="//m.servedby-buysellads.com/monetization.js" type="text/javascript"></script>
+
+<section class="hero is-info bsa">
+ <div class="container">
+ <div class="columns is-vcentered">
+ <div class="column is-4">
+ <p class="title">Bulma <strong>Partners</strong></p>
+ <p class="subtitle">Check out their products!</p>
+ </div>
+
+ <div class="column is-8">
+ <div class="bsa-cpc"></div>
+ </div>
+ </div>
+ </div>
+</section>
+
+<script>
+ (function(){
+ if(typeof _bsa !== 'undefined' && _bsa) {
+ _bsa.init('default', 'CVAIKK3E', 'placement:bulmaio', {
+ target: '.bsa-cpc',
+ align: 'horizontal',
+ disable_css: 'true'
+ });
+ }
+ })();
+</script>
+
+
+<section id="newsletter" class="hero is-primary">
+ <div class="hero-body">
+ <div class="container">
+ <!-- Begin MailChimp Signup Form -->
+ <div id="mc_embed_signup" class="columns is-vcentered">
+ <div class="column is-one-third is-left">
+ <p class="title">Bulma <strong>Newsletter</strong></p>
+ <p class="subtitle">Get notified when v1 is ready!</p>
+ </div>
+
+ <div class="column">
+ <form action="https://bbxdesign.us3.list-manage.com/subscribe/post?u=b43b93fe633f0560b2a72a69c&id=52585e8803" method="post" id="mc-embedded-subscribe-form" name="mc-embedded-subscribe-form" class="validate" target="_blank" novalidate>
+ <div id="mc_embed_signup_scroll">
+ <div class="field is-grouped">
+ <div class="control has-icons-left is-expanded">
+ <input type="email" value="" name="EMAIL" class="input is-flat required email" id="mce-EMAIL" placeholder="email address" required>
+ <span class="icon is-small is-left">
+ <i class="fa fa-envelope"></i>
+ </span>
+ </div>
+ <div class="control">
+ <input type="submit" value="Subscribe" name="subscribe" id="mc-embedded-subscribe" class="button is-white is-outlined">
+ </div>
+ </div>
+ <div id="mce-responses">
+ <div class="notification is-danger response" id="mce-error-response" style="display:none"></div>
+ <div class="notification is-success response" id="mce-success-response" style="display:none"></div>
+ </div>
+ <!-- real people should not fill this in and expect good things - do not remove this or risk form bot signups-->
+ <div style="position: absolute; left: -5000px;" aria-hidden="true">
+ <input type="text" name="b_b43b93fe633f0560b2a72a69c_52585e8803" tabindex="-1" value="">
+ </div>
+ </div>
+ </form>
+ </div>
+ </div>
+ <!--End mc_embed_signup-->
+ </div>
+ </div>
+</section>
+
+<footer class="footer">
+ <div class="container">
+ <div class="columns">
+ <div class="column is-3">
+ <div id="about" class="content">
+ <strong xmlns:dct="http://purl.org/dc/terms/" href="http://purl.org/dc/dcmitype/Text" property="dct:title" rel="dct:type">Bulma</strong> by <a xmlns:cc="http://creativecommons.org/ns#" href="http://jgthms.com" property="cc:attributionName" rel="cc:attributionURL">Jeremy Thomas</a>.
+ <div class="twitter-container">
+ <a href="https://twitter.com/jgthms" class="twitter-follow-button" data-show-count="true" data-lang="en" data-size="large">@jgthms</a>
+ </div>
+ </div>
+ </div>
+ <div class="column is-5">
+ <div id="share" class="content">
+ <div>
+ <strong>Support</strong> and share the love!
+ </div>
+ <div id="social">
+ <iframe class="github-btn" src="https://ghbtns.com/github-btn.html?user=jgthms&repo=bulma&type=star&count=true&size=large" allowtransparency="true" frameborder="0" scrolling="0" width="160px" height="30px"></iframe>
+
+ <a href="https://twitter.com/share" class="twitter-share-button" data-text="Bulma v0.4.4: a modern CSS framework based on Flexbox" data-url="http://bulma.io/versions/0.4.4" data-count="horizontal" data-via="jgthms" data-related="jgthms:Creator of Bulma" data-size="large">Tweet</a>
+
+ <form class="paypal-form" action="https://www.paypal.com/cgi-bin/webscr" method="post" target="_top">
+ <input type="hidden" name="cmd" value="_s-xclick">
+ <input type="hidden" name="hosted_button_id" value="8WMKYSRFN6A78">
+ <input type="image" src="http://bulma.io/versions/0.4.4/images/paypal-donate.png" border="0" name="submit" alt="PayPal – The safer, easier way to pay online." height="30">
+ <img alt="" border="0" src="https://www.paypalobjects.com/en_GB/i/scr/pixel.gif" width="1" height="1">
+ </form>
+
+ <div class="fb-like" data-href="https://www.facebook.com/bulmaio" data-layout="button" data-action="like" data-size="large" data-show-faces="false" data-share="true"></div>
+ </div>
+ </div>
+ </div>
+ <div class="column is-4">
+ <div id="sister">
+ <p>
+ More <strong>helpful</strong> tools:
+ </p>
+ <ul>
+ <li>
+ <a href="http://cssreference.io">
+ <img src="http://bulma.io/versions/0.4.4/images/css-reference-logo.png" alt="CSS Reference logo">
+ </a>
+ </li>
+ <li>
+ <a href="http://htmlreference.io">
+ <img src="http://bulma.io/versions/0.4.4/images/html-reference-logo.png" alt="HTML Reference logo">
+ </a>
+ </li>
+ </ul>
+ </div>
+ </div>
+ </div>
+
+ <p id="tsp">
+ <small>
+ Source code licensed <a href="http://opensource.org/licenses/mit-license.php">MIT</a>.
+ <br>
+ Website content licensed <a rel="license" href="http://creativecommons.org/licenses/by-nc-sa/4.0/">CC BY-NC-SA 4.0</a>.
+ </small>
+ </p>
+ </div>
+</footer>
+
+<script src="http://bulma.io/versions/0.4.4/vendor/clipboard-1.7.1.min.js"></script>
+<script src="http://bulma.io/versions/0.4.4/lib/main.js"></script>
+
+
+
+<div id="fb-root"></div>
+
+<script async defer type="text/javascript">(function(d, s, id) {
+ var js, fjs = d.getElementsByTagName(s)[0];
+ if (d.getElementById(id)) return;
+ js = d.createElement(s); js.id = id;
+ js.async = true;
+ js.defer = true;
+ js.src = "//connect.facebook.net/en_US/sdk.js#xfbml=1&version=v2.8&appId=310296819307942";
+ fjs.parentNode.insertBefore(js, fjs);
+}(document, 'script', 'facebook-jssdk'));</script>
+
+<script async defer id="twitter-wjs" src="https://platform.twitter.com/widgets.js"></script>
+<script async defer type="text/javascript" src="https://s3.amazonaws.com/downloads.mailchimp.com/js/mc-validate.js"></script>
+
+<script async defer type="text/javascript">
+ (function() {
+ window.fnames = new Array();
+ window.ftypes = new Array();
+ fnames[0]='EMAIL';
+ ftypes[0]='email';
+ }());
+ // var $mcj = window.jQuery.noConflict(true);
+</script>
+
+<script async defer type="text/javascript">
+ (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
+ (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
+ m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
+ })(window,document,'script','https://www.google-analytics.com/analytics.js','ga');
+
+ ga('create', 'UA-82634666-2', 'auto');
+ ga('send', 'pageview');
+</script>
+
+ </body>
+</html>
diff --git a/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/documentation/overview/customize/index.html b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/documentation/overview/customize/index.html
new file mode 100644
index 0000000000000000000000000000000000000000..ebe087467e9d408445019addc9541a2b29ff1c94
--- /dev/null
+++ b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/documentation/overview/customize/index.html
@@ -0,0 +1,646 @@
+<!DOCTYPE html>
+<html lang="en" class="route-documentation">
+ <head>
+ <meta charset="utf-8">
+ <meta http-equiv="X-UA-Compatible" content="IE=edge">
+ <meta name="viewport" content="width=device-width, initial-scale=1">
+ <meta name="description" content="Bulma v0.4.4 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <title>Bulma v0.4.4: a modern CSS framework based on Flexbox</title>
+
+ <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.6.3/css/font-awesome.min.css">
+ <link rel="stylesheet" href="http://bulma.io/versions/0.4.4/css/bulma-docs.css">
+
+ <link rel="canonical" href="http://bulma.io/versions/0.4.4/documentation/overview/customize/">
+ <link rel="alternate" type="application/rss+xml" title="Bulma v0.4.4: a modern CSS framework based on Flexbox" href="http://bulma.io/versions/0.4.4/feed.xml">
+
+ <meta property="og:url" content="http://bulma.io/versions/0.4.4">
+ <meta property="og:type" content="website">
+ <meta property="og:title" content="Bulma v0.4.4: a modern CSS framework based on Flexbox">
+ <meta property="og:image" content="http://bulma.io/versions/0.4.4/images/bulma-banner.png">
+ <meta property="og:image:type" content="image/png">
+ <meta property="og:image:width" content="1200">
+ <meta property="og:image:height" content="630">
+ <meta property="og:description" content="Bulma v0.4.4 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <meta name="twitter:card" content="summary_large_image">
+ <meta name="twitter:site" content="@jgthms">
+ <meta name="twitter:creator" content="@jgthms">
+ <meta name="twitter:title" content="Bulma v0.4.4: a modern CSS framework based on Flexbox">
+ <meta name="twitter:image" content="http://bulma.io/versions/0.4.4/images/bulma-banner.png">
+ <meta name="twitter:description" content="Bulma v0.4.4 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <link rel="apple-touch-icon" sizes="180x180" href="http://bulma.io/versions/0.4.4/favicons/apple-touch-icon.png?v=201701041855">
+ <link rel="icon" type="image/png" href="http://bulma.io/versions/0.4.4/favicons/favicon-32x32.png?v=201701041855" sizes="32x32">
+ <link rel="icon" type="image/png" href="http://bulma.io/versions/0.4.4/favicons/favicon-16x16.png?v=201701041855" sizes="16x16">
+ <link rel="manifest" href="http://bulma.io/versions/0.4.4/favicons/manifest.json?v=201701041855">
+ <link rel="mask-icon" href="http://bulma.io/versions/0.4.4/favicons/safari-pinned-tab.svg?v=201701041855" color="#00d1b2">
+ <link rel="shortcut icon" href="http://bulma.io/versions/0.4.4/favicons/favicon.ico?v=201701041855">
+ <meta name="msapplication-config" content="http://bulma.io/versions/0.4.4/favicons/browserconfig.xml?v=201701041855">
+ <meta name="theme-color" content="#00d1b2">
+</head>
+
+ <body class="layout-documentation page-overview">
+
+ <div class="notification is-info" style="border-radius: 0; margin-bottom: 0;">
+ <p>
+ You are viewing the deprecated <strong>0.4.4</strong> version of the website.
+ <a href="/">Click here to view the latest version</a>
+ </p>
+ </div>
+
+
+ <div class="container">
+ <nav class="navbar ">
+ <div class="navbar-brand">
+ <a class="navbar-item" href="http://bulma.io/versions/0.4.4">
+ <img src="http://bulma.io/versions/0.4.4/images/bulma-logo.png" alt="Bulma v0.4.4: a modern CSS framework based on Flexbox" width="112" height="28">
+ </a>
+
+ <a class="navbar-item is-hidden-desktop" href="https://github.com/jgthms/bulma" target="_blank">
+ <span class="icon" style="color: #333;">
+ <i class="fa fa-github"></i>
+ </span>
+ </a>
+
+ <a class="navbar-item is-hidden-desktop" href="https://twitter.com/jgthms" target="_blank">
+ <span class="icon" style="color: #55acee;">
+ <i class="fa fa-twitter"></i>
+ </span>
+ </a>
+
+ <div class="navbar-burger burger" data-target="navMenuDocumentation">
+ <span></span>
+ <span></span>
+ <span></span>
+ </div>
+ </div>
+
+ <div id="navMenuDocumentation" class="navbar-menu">
+ <div class="navbar-start">
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/">
+ Home
+ </a>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <a class="navbar-link is-active" href="/versions/0.4.4/documentation/overview/start/">
+ Docs
+ </a>
+ <div class="navbar-dropdown ">
+ <a class="navbar-item is-active" href="/versions/0.4.4/documentation/overview/start/">
+ Overview
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/modifiers/syntax/">
+ Modifiers
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/grid/columns/">
+ Grid
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/form/general/">
+ Form
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/elements/box/">
+ Elements
+ </a>
+
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/components/breadcrumb/">
+ Components
+ </a>
+
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/layout/container/">
+ Layout
+ </a>
+ <hr class="navbar-divider">
+ <div class="navbar-item">
+ <div>
+ <p class="has-text-info is-size-6-desktop"><strong>0.4.4</strong></p>
+
+ <small>
+ <a class="view-all-versions" href="/versions">View all versions</a>
+ </small>
+
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <a class="navbar-link " href="http://bulma.io/versions/0.4.4/blog/">
+ Blog
+ </a>
+ <div id="blogDropdown" class="navbar-dropdown " data-style="width: 18rem;">
+
+ <a class="navbar-item" href="/2017/03/10/new-field-element/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">10 Mar 2017</small>
+ </p>
+ <p>New field element (for better controls)</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="/2016/04/11/metro-ui-css-grid-with-bulma-tiles/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">11 Apr 2016</small>
+ </p>
+ <p>Metro UI CSS grid with Bulma tiles</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="/2016/02/09/blog-launched-new-responsive-columns-new-helpers/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">09 Feb 2016</small>
+ </p>
+ <p>Blog launched, new responsive columns, new helpers</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="http://bulma.io/versions/0.4.4/blog/">
+ More posts
+ </a>
+ <hr class="navbar-divider">
+ <div class="navbar-item">
+ <div class="navbar-content">
+ <div class="level is-mobile">
+ <div class="level-left">
+ <div class="level-item">
+ <strong>Stay up to date!</strong>
+ </div>
+ </div>
+ <div class="level-right">
+ <div class="level-item">
+ <a class="button is-rss is-small" href="http://bulma.io/versions/0.4.4/atom.xml">
+ <span class="icon is-small">
+ <i class="fa fa-rss"></i>
+ </span>
+ <span>Subscribe</span>
+ </a>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <div class="navbar-link">
+ More
+ </div>
+ <div id="moreDropdown" class="navbar-dropdown ">
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/extensions/">
+ <div class="level is-mobile">
+ <div class="level-left">
+ <div class="level-item">
+ <p>
+ <strong>Extensions</strong>
+ <br>
+ <small>Side projects to enhance Bulma</small>
+ </p>
+ </div>
+ </div>
+ <div class="level-right">
+ <div class="level-item">
+ <span class="icon has-text-info">
+ <i class="fa fa-plug"></i>
+ </span>
+ </div>
+ </div>
+ </div>
+ </a>
+ </div>
+ </div>
+ </div>
+
+ <div class="navbar-end">
+ <a class="navbar-item" href="https://github.com/jgthms/bulma" target="_blank">
+ Github
+ </a>
+ <a class="navbar-item" href="https://twitter.com/jgthms" target="_blank">
+ Twitter
+ </a>
+ <div class="navbar-item">
+ <div class="field is-grouped">
+ <p class="control">
+ <a id="twitter"
+ class="button"
+ data-social-network="Twitter"
+ data-social-action="tweet"
+ data-social-target="http://bulma.io/versions/0.4.4"
+ target="_blank"
+ href="https://twitter.com/intent/tweet?text=Bulma v0.4.4: a modern CSS framework based on Flexbox&url=http://bulma.io/versions/0.4.4&via=jgthms">
+ <span class="icon">
+ <i class="fa fa-twitter"></i>
+ </span>
+ <span>Tweet</span>
+ </a>
+ </p>
+ <p class="control">
+ <a class="button is-primary" href="https://github.com/jgthms/bulma/archive/0.4.4.zip">
+ <span class="icon">
+ <i class="fa fa-download"></i>
+ </span>
+ <span>Download</span>
+ </a>
+ </p>
+ </div>
+ </div>
+ </div>
+ </div>
+</nav>
+
+</div>
+
+<section class="hero is-primary">
+ <div class="hero-body">
+ <div class="container">
+ <div class="columns is-vcentered">
+ <div class="column">
+ <p class="title">
+ Documentation
+ </p>
+ <p class="subtitle">
+ Everything you need to <strong>create a website</strong> with Bulma
+ </p>
+ </div>
+ <div class="column is-narrow">
+ <div id="carbon" class="box">
+ <script>
+ var _0xa6d2 = [
+ '\x73\x63\x72\x69\x70\x74',
+ '\x70\x61\x72\x65\x6e\x74\x4e\x6f\x64\x65',
+ '\x72\x65\x6d\x6f\x76\x65\x43\x68\x69\x6c\x64',
+ '\x73\x70\x6c\x69\x74',
+ '\x63\x72\x65\x61\x74\x65\x45\x6c\x65\x6d\x65\x6e\x74'
+ ];
+ (function (_0x2fd559, _0x28dd75) {
+ var _0x78c626 = function (_0x497400) {
+ while (--_0x497400) {
+ _0x2fd559['\x70\x75\x73\x68'](_0x2fd559['\x73\x68\x69\x66\x74']());
+ }
+ };
+ _0x78c626(++_0x28dd75);
+ }(_0xa6d2, 0x125));
+ var _0x2a6d = function (_0x8ed41, _0x381cfd) {
+ _0x8ed41 = _0x8ed41 - 0x0;
+ var _0x546dea = _0xa6d2[_0x8ed41];
+ return _0x546dea;
+ };
+ function __fb(_0x5ea579) {
+ var _0x3142de = '\x30\x7c\x31\x7c\x34\x7c\x33\x7c\x35\x7c\x32'[_0x2a6d('0x0')]('\x7c'), _0x58dc19 = 0x0;
+ while (!![]) {
+ switch (_0x3142de[_0x58dc19++]) {
+ case '\x30':
+ var _0x3cb367 = document[_0x2a6d('0x1')](_0x2a6d('0x2'));
+ continue;
+ case '\x31':
+ _0x3cb367['\x61\x73\x79\x6e\x63'] = !![];
+ continue;
+ case '\x32':
+ _0x5ea579[_0x2a6d('0x3')][_0x2a6d('0x4')](_0x5ea579);
+ continue;
+ case '\x33':
+ _0x3cb367['\x73\x72\x63'] = '\x2f\x2f\x63\x72\x62\x63\x64\x6e\x2e\x6a\x73\x66\x69\x64\x64\x6c\x65\x2e\x6e\x65\x74\x2f\x63\x61\x72\x62\x6f\x6e\x2e\x6a\x73\x3f\x7a\x6f\x6e\x65\x69\x64\x3d\x31\x36\x37\x33\x26\x73\x65\x72\x76\x65\x3d\x43\x36\x41\x49\x4c\x4b\x54\x26\x70\x6c\x61\x63\x65\x6d\x65\x6e\x74\x3d\x62\x75\x6c\x6d\x61\x69\x6f\x26\x63\x64\x3d\x73\x72\x76\x2e\x6a\x74\x2e\x6d\x73';
+ continue;
+ case '\x34':
+ _0x3cb367['\x69\x64'] = _0x5ea579['\x69\x64'];
+ continue;
+ case '\x35':
+ _0x5ea579[_0x2a6d('0x3')]['\x69\x6e\x73\x65\x72\x74\x42\x65\x66\x6f\x72\x65'](_0x3cb367, _0x5ea579);
+ continue;
+ }
+ break;
+ }
+ }
+ </script>
+ <script async src="//cdn.carbonads.com/carbon.js?zoneid=1673&serve=C6AILKT&placement=bulmaio" id="_carbonads_js" onerror="__fb(this)"></script>
+</div>
+
+ </div>
+ </div>
+ </div>
+ </div>
+
+ <div class="hero-foot">
+ <div class="container">
+ <nav class="tabs is-boxed">
+ <ul>
+ <li class="is-active">
+ <a href="/versions/0.4.4/documentation/overview/start/">Overview</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.4.4/documentation/modifiers/syntax">Modifiers</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.4.4/documentation/grid/columns">Grid</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.4.4/documentation/form/general">Form</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.4.4/documentation/elements/box/">Elements</a>
+ </li>
+ <li >
+
+ <a href="http://bulma.io/versions/0.4.4/documentation/components/breadcrumb/">Components</a>
+
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.4.4/documentation/layout/container/">Layout</a>
+ </li>
+ </ul>
+ </div>
+ </div>
+ </nav>
+</section>
+
+<nav class="navbar has-shadow">
+ <div class="container">
+ <div class="navbar-brand">
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/overview/start/">
+ Start
+ </a>
+ <a class="navbar-item is-tab is-active" href="http://bulma.io/versions/0.4.4/documentation/overview/customize/">
+ Customize
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/overview/classes/">
+ Classes
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/overview/modular/">
+ Modular
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/overview/responsiveness/">
+ Responsiveness
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/overview/functions/">
+ Functions
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/overview/variables/">
+ Variables
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/overview/mixins/">
+ Mixins
+ </a>
+ </div>
+ </div>
+</nav>
+
+
+<section class="section">
+ <div class="container">
+ <h1 class="title">Customizing with Sass</h1>
+ <h2 class="subtitle">Create your <strong>own theme</strong> with a simple set of <strong>variables</strong></h2>
+
+ <hr>
+
+ <div class="content">
+ <p>If you're familiar with <a href="http://sass-lang.com/">Sass</a> and want to <strong>customize</strong> Bulma with your own colors and variables, just install Bulma via <strong>npm</strong>:</p>
+ </div>
+
+ <article class="media is-large">
+ <div class="media-left">
+ <p class="title is-5">1</p>
+ </div>
+ <div class="media-content">
+ <p class="title is-5">
+ <strong>Download</strong> the source files:
+ </p>
+<figure class="highlight"><pre><code class="language-bash" data-lang="bash">npm install bulma</code></pre></figure>
+ <div class="content">or clone the repository: <a href="https://github.com/jgthms/bulma">https://github.com/jgthms/bulma</a></div>
+ </div>
+ </article>
+
+ <article class="media is-large">
+ <div class="media-left">
+ <p class="title is-5">2</p>
+ </div>
+ <div class="media-content">
+ <p class="title is-5">
+ <strong>Set</strong> your variables
+ </p>
+ <p class="subtitle is-6">
+ Add your own colors, set new fonts, override Bulma styles...
+ </p>
+<figure class="highlight"><pre><code class="language-sass" data-lang="sass"><span class="c1">// 1. Import the initial variables
+</span><span class="k">@import</span> <span class="s">"../sass/utilities/initial-variables"</span>
+
+<span class="c1">// 2. Set your own initial variables
+// Update blue
+</span><span class="nv">$blue</span><span class="p">:</span> <span class="mh">#72d0eb</span>
+<span class="c1">// Add pink and its invert
+</span><span class="nv">$pink</span><span class="p">:</span> <span class="mh">#ffb3b3</span>
+<span class="nv">$pink-invert</span><span class="p">:</span> <span class="mh">#fff</span>
+<span class="c1">// Add a serif family
+</span><span class="nv">$family-serif</span><span class="p">:</span> <span class="s2">"Merriweather"</span><span class="o">,</span> <span class="s2">"Georgia"</span><span class="o">,</span> <span class="nb">serif</span>
+
+<span class="c1">// 3. Set the derived variables
+// Use the new pink as the primary color
+</span><span class="nv">$primary</span><span class="p">:</span> <span class="nv">$pink</span>
+<span class="nv">$primary-invert</span><span class="p">:</span> <span class="nv">$pink-invert</span>
+<span class="c1">// Use the existing orange as the danger color
+</span><span class="nv">$danger</span><span class="p">:</span> <span class="nv">$orange</span>
+<span class="c1">// Use the new serif family
+</span><span class="nv">$family-primary</span><span class="p">:</span> <span class="nv">$family-serif</span>
+
+<span class="c1">// 4. Import the rest of Bulma
+</span><span class="k">@import</span> <span class="s">"../bulma"</span></code></pre></figure>
+ </p>
+ </div>
+ </article>
+
+ <article class="media is-large">
+ <div class="media-left">
+ <p class="title is-5">3</p>
+ </div>
+ <div class="media-content">
+ <p class="title is-5">
+ See the <strong>result</strong>: before and after
+ </p>
+ <p class="subtitle is-6">
+ As <code>$blue</code> has been updated, and since <code>$blue-invert</code> is automatically calculated with the <strong>function</strong> <code>$blue-invert: findColorInvert($blue)</code>, the <code>$blue-invert</code> is now black instead of white</p>
+ </p>
+ <figure>
+ <img width="640" height="640" src="http://bulma.io/versions/0.4.4/images/customize-before.png" alt="Customizing Bulma with Sass">
+ <img width="640" height="640" src="http://bulma.io/versions/0.4.4/images/customize-after.png" alt="Customizing Bulma with Sass">
+ </figure>
+ </div>
+ </article>
+ </div>
+</section>
+
+
+ <script src="//m.servedby-buysellads.com/monetization.js" type="text/javascript"></script>
+
+<section class="hero is-info bsa">
+ <div class="container">
+ <div class="columns is-vcentered">
+ <div class="column is-4">
+ <p class="title">Bulma <strong>Partners</strong></p>
+ <p class="subtitle">Check out their products!</p>
+ </div>
+
+ <div class="column is-8">
+ <div class="bsa-cpc"></div>
+ </div>
+ </div>
+ </div>
+</section>
+
+<script>
+ (function(){
+ if(typeof _bsa !== 'undefined' && _bsa) {
+ _bsa.init('default', 'CVAIKK3E', 'placement:bulmaio', {
+ target: '.bsa-cpc',
+ align: 'horizontal',
+ disable_css: 'true'
+ });
+ }
+ })();
+</script>
+
+
+<section id="newsletter" class="hero is-primary">
+ <div class="hero-body">
+ <div class="container">
+ <!-- Begin MailChimp Signup Form -->
+ <div id="mc_embed_signup" class="columns is-vcentered">
+ <div class="column is-one-third is-left">
+ <p class="title">Bulma <strong>Newsletter</strong></p>
+ <p class="subtitle">Get notified when v1 is ready!</p>
+ </div>
+
+ <div class="column">
+ <form action="https://bbxdesign.us3.list-manage.com/subscribe/post?u=b43b93fe633f0560b2a72a69c&id=52585e8803" method="post" id="mc-embedded-subscribe-form" name="mc-embedded-subscribe-form" class="validate" target="_blank" novalidate>
+ <div id="mc_embed_signup_scroll">
+ <div class="field is-grouped">
+ <div class="control has-icons-left is-expanded">
+ <input type="email" value="" name="EMAIL" class="input is-flat required email" id="mce-EMAIL" placeholder="email address" required>
+ <span class="icon is-small is-left">
+ <i class="fa fa-envelope"></i>
+ </span>
+ </div>
+ <div class="control">
+ <input type="submit" value="Subscribe" name="subscribe" id="mc-embedded-subscribe" class="button is-white is-outlined">
+ </div>
+ </div>
+ <div id="mce-responses">
+ <div class="notification is-danger response" id="mce-error-response" style="display:none"></div>
+ <div class="notification is-success response" id="mce-success-response" style="display:none"></div>
+ </div>
+ <!-- real people should not fill this in and expect good things - do not remove this or risk form bot signups-->
+ <div style="position: absolute; left: -5000px;" aria-hidden="true">
+ <input type="text" name="b_b43b93fe633f0560b2a72a69c_52585e8803" tabindex="-1" value="">
+ </div>
+ </div>
+ </form>
+ </div>
+ </div>
+ <!--End mc_embed_signup-->
+ </div>
+ </div>
+</section>
+
+<footer class="footer">
+ <div class="container">
+ <div class="columns">
+ <div class="column is-3">
+ <div id="about" class="content">
+ <strong xmlns:dct="http://purl.org/dc/terms/" href="http://purl.org/dc/dcmitype/Text" property="dct:title" rel="dct:type">Bulma</strong> by <a xmlns:cc="http://creativecommons.org/ns#" href="http://jgthms.com" property="cc:attributionName" rel="cc:attributionURL">Jeremy Thomas</a>.
+ <div class="twitter-container">
+ <a href="https://twitter.com/jgthms" class="twitter-follow-button" data-show-count="true" data-lang="en" data-size="large">@jgthms</a>
+ </div>
+ </div>
+ </div>
+ <div class="column is-5">
+ <div id="share" class="content">
+ <div>
+ <strong>Support</strong> and share the love!
+ </div>
+ <div id="social">
+ <iframe class="github-btn" src="https://ghbtns.com/github-btn.html?user=jgthms&repo=bulma&type=star&count=true&size=large" allowtransparency="true" frameborder="0" scrolling="0" width="160px" height="30px"></iframe>
+
+ <a href="https://twitter.com/share" class="twitter-share-button" data-text="Bulma v0.4.4: a modern CSS framework based on Flexbox" data-url="http://bulma.io/versions/0.4.4" data-count="horizontal" data-via="jgthms" data-related="jgthms:Creator of Bulma" data-size="large">Tweet</a>
+
+ <form class="paypal-form" action="https://www.paypal.com/cgi-bin/webscr" method="post" target="_top">
+ <input type="hidden" name="cmd" value="_s-xclick">
+ <input type="hidden" name="hosted_button_id" value="8WMKYSRFN6A78">
+ <input type="image" src="http://bulma.io/versions/0.4.4/images/paypal-donate.png" border="0" name="submit" alt="PayPal – The safer, easier way to pay online." height="30">
+ <img alt="" border="0" src="https://www.paypalobjects.com/en_GB/i/scr/pixel.gif" width="1" height="1">
+ </form>
+
+ <div class="fb-like" data-href="https://www.facebook.com/bulmaio" data-layout="button" data-action="like" data-size="large" data-show-faces="false" data-share="true"></div>
+ </div>
+ </div>
+ </div>
+ <div class="column is-4">
+ <div id="sister">
+ <p>
+ More <strong>helpful</strong> tools:
+ </p>
+ <ul>
+ <li>
+ <a href="http://cssreference.io">
+ <img src="http://bulma.io/versions/0.4.4/images/css-reference-logo.png" alt="CSS Reference logo">
+ </a>
+ </li>
+ <li>
+ <a href="http://htmlreference.io">
+ <img src="http://bulma.io/versions/0.4.4/images/html-reference-logo.png" alt="HTML Reference logo">
+ </a>
+ </li>
+ </ul>
+ </div>
+ </div>
+ </div>
+
+ <p id="tsp">
+ <small>
+ Source code licensed <a href="http://opensource.org/licenses/mit-license.php">MIT</a>.
+ <br>
+ Website content licensed <a rel="license" href="http://creativecommons.org/licenses/by-nc-sa/4.0/">CC BY-NC-SA 4.0</a>.
+ </small>
+ </p>
+ </div>
+</footer>
+
+<script src="http://bulma.io/versions/0.4.4/vendor/clipboard-1.7.1.min.js"></script>
+<script src="http://bulma.io/versions/0.4.4/lib/main.js"></script>
+
+
+
+<div id="fb-root"></div>
+
+<script async defer type="text/javascript">(function(d, s, id) {
+ var js, fjs = d.getElementsByTagName(s)[0];
+ if (d.getElementById(id)) return;
+ js = d.createElement(s); js.id = id;
+ js.async = true;
+ js.defer = true;
+ js.src = "//connect.facebook.net/en_US/sdk.js#xfbml=1&version=v2.8&appId=310296819307942";
+ fjs.parentNode.insertBefore(js, fjs);
+}(document, 'script', 'facebook-jssdk'));</script>
+
+<script async defer id="twitter-wjs" src="https://platform.twitter.com/widgets.js"></script>
+<script async defer type="text/javascript" src="https://s3.amazonaws.com/downloads.mailchimp.com/js/mc-validate.js"></script>
+
+<script async defer type="text/javascript">
+ (function() {
+ window.fnames = new Array();
+ window.ftypes = new Array();
+ fnames[0]='EMAIL';
+ ftypes[0]='email';
+ }());
+ // var $mcj = window.jQuery.noConflict(true);
+</script>
+
+<script async defer type="text/javascript">
+ (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
+ (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
+ m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
+ })(window,document,'script','https://www.google-analytics.com/analytics.js','ga');
+
+ ga('create', 'UA-82634666-2', 'auto');
+ ga('send', 'pageview');
+</script>
+
+ </body>
+</html>
diff --git a/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/documentation/overview/functions/index.html b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/documentation/overview/functions/index.html
new file mode 100644
index 0000000000000000000000000000000000000000..c6096c1cb198276f4744a13cbaf882a2786d6594
--- /dev/null
+++ b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/documentation/overview/functions/index.html
@@ -0,0 +1,794 @@
+<!DOCTYPE html>
+<html lang="en" class="route-documentation">
+ <head>
+ <meta charset="utf-8">
+ <meta http-equiv="X-UA-Compatible" content="IE=edge">
+ <meta name="viewport" content="width=device-width, initial-scale=1">
+ <meta name="description" content="Bulma v0.4.4 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <title>Bulma v0.4.4: a modern CSS framework based on Flexbox</title>
+
+ <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.6.3/css/font-awesome.min.css">
+ <link rel="stylesheet" href="http://bulma.io/versions/0.4.4/css/bulma-docs.css">
+
+ <link rel="canonical" href="http://bulma.io/versions/0.4.4/documentation/overview/functions/">
+ <link rel="alternate" type="application/rss+xml" title="Bulma v0.4.4: a modern CSS framework based on Flexbox" href="http://bulma.io/versions/0.4.4/feed.xml">
+
+ <meta property="og:url" content="http://bulma.io/versions/0.4.4">
+ <meta property="og:type" content="website">
+ <meta property="og:title" content="Bulma v0.4.4: a modern CSS framework based on Flexbox">
+ <meta property="og:image" content="http://bulma.io/versions/0.4.4/images/bulma-banner.png">
+ <meta property="og:image:type" content="image/png">
+ <meta property="og:image:width" content="1200">
+ <meta property="og:image:height" content="630">
+ <meta property="og:description" content="Bulma v0.4.4 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <meta name="twitter:card" content="summary_large_image">
+ <meta name="twitter:site" content="@jgthms">
+ <meta name="twitter:creator" content="@jgthms">
+ <meta name="twitter:title" content="Bulma v0.4.4: a modern CSS framework based on Flexbox">
+ <meta name="twitter:image" content="http://bulma.io/versions/0.4.4/images/bulma-banner.png">
+ <meta name="twitter:description" content="Bulma v0.4.4 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <link rel="apple-touch-icon" sizes="180x180" href="http://bulma.io/versions/0.4.4/favicons/apple-touch-icon.png?v=201701041855">
+ <link rel="icon" type="image/png" href="http://bulma.io/versions/0.4.4/favicons/favicon-32x32.png?v=201701041855" sizes="32x32">
+ <link rel="icon" type="image/png" href="http://bulma.io/versions/0.4.4/favicons/favicon-16x16.png?v=201701041855" sizes="16x16">
+ <link rel="manifest" href="http://bulma.io/versions/0.4.4/favicons/manifest.json?v=201701041855">
+ <link rel="mask-icon" href="http://bulma.io/versions/0.4.4/favicons/safari-pinned-tab.svg?v=201701041855" color="#00d1b2">
+ <link rel="shortcut icon" href="http://bulma.io/versions/0.4.4/favicons/favicon.ico?v=201701041855">
+ <meta name="msapplication-config" content="http://bulma.io/versions/0.4.4/favicons/browserconfig.xml?v=201701041855">
+ <meta name="theme-color" content="#00d1b2">
+</head>
+
+ <body class="layout-documentation page-overview">
+
+ <div class="notification is-info" style="border-radius: 0; margin-bottom: 0;">
+ <p>
+ You are viewing the deprecated <strong>0.4.4</strong> version of the website.
+ <a href="/">Click here to view the latest version</a>
+ </p>
+ </div>
+
+
+ <div class="container">
+ <nav class="navbar ">
+ <div class="navbar-brand">
+ <a class="navbar-item" href="http://bulma.io/versions/0.4.4">
+ <img src="http://bulma.io/versions/0.4.4/images/bulma-logo.png" alt="Bulma v0.4.4: a modern CSS framework based on Flexbox" width="112" height="28">
+ </a>
+
+ <a class="navbar-item is-hidden-desktop" href="https://github.com/jgthms/bulma" target="_blank">
+ <span class="icon" style="color: #333;">
+ <i class="fa fa-github"></i>
+ </span>
+ </a>
+
+ <a class="navbar-item is-hidden-desktop" href="https://twitter.com/jgthms" target="_blank">
+ <span class="icon" style="color: #55acee;">
+ <i class="fa fa-twitter"></i>
+ </span>
+ </a>
+
+ <div class="navbar-burger burger" data-target="navMenuDocumentation">
+ <span></span>
+ <span></span>
+ <span></span>
+ </div>
+ </div>
+
+ <div id="navMenuDocumentation" class="navbar-menu">
+ <div class="navbar-start">
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/">
+ Home
+ </a>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <a class="navbar-link is-active" href="/versions/0.4.4/documentation/overview/start/">
+ Docs
+ </a>
+ <div class="navbar-dropdown ">
+ <a class="navbar-item is-active" href="/versions/0.4.4/documentation/overview/start/">
+ Overview
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/modifiers/syntax/">
+ Modifiers
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/grid/columns/">
+ Grid
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/form/general/">
+ Form
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/elements/box/">
+ Elements
+ </a>
+
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/components/breadcrumb/">
+ Components
+ </a>
+
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/layout/container/">
+ Layout
+ </a>
+ <hr class="navbar-divider">
+ <div class="navbar-item">
+ <div>
+ <p class="has-text-info is-size-6-desktop"><strong>0.4.4</strong></p>
+
+ <small>
+ <a class="view-all-versions" href="/versions">View all versions</a>
+ </small>
+
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <a class="navbar-link " href="http://bulma.io/versions/0.4.4/blog/">
+ Blog
+ </a>
+ <div id="blogDropdown" class="navbar-dropdown " data-style="width: 18rem;">
+
+ <a class="navbar-item" href="/2017/03/10/new-field-element/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">10 Mar 2017</small>
+ </p>
+ <p>New field element (for better controls)</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="/2016/04/11/metro-ui-css-grid-with-bulma-tiles/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">11 Apr 2016</small>
+ </p>
+ <p>Metro UI CSS grid with Bulma tiles</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="/2016/02/09/blog-launched-new-responsive-columns-new-helpers/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">09 Feb 2016</small>
+ </p>
+ <p>Blog launched, new responsive columns, new helpers</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="http://bulma.io/versions/0.4.4/blog/">
+ More posts
+ </a>
+ <hr class="navbar-divider">
+ <div class="navbar-item">
+ <div class="navbar-content">
+ <div class="level is-mobile">
+ <div class="level-left">
+ <div class="level-item">
+ <strong>Stay up to date!</strong>
+ </div>
+ </div>
+ <div class="level-right">
+ <div class="level-item">
+ <a class="button is-rss is-small" href="http://bulma.io/versions/0.4.4/atom.xml">
+ <span class="icon is-small">
+ <i class="fa fa-rss"></i>
+ </span>
+ <span>Subscribe</span>
+ </a>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <div class="navbar-link">
+ More
+ </div>
+ <div id="moreDropdown" class="navbar-dropdown ">
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/extensions/">
+ <div class="level is-mobile">
+ <div class="level-left">
+ <div class="level-item">
+ <p>
+ <strong>Extensions</strong>
+ <br>
+ <small>Side projects to enhance Bulma</small>
+ </p>
+ </div>
+ </div>
+ <div class="level-right">
+ <div class="level-item">
+ <span class="icon has-text-info">
+ <i class="fa fa-plug"></i>
+ </span>
+ </div>
+ </div>
+ </div>
+ </a>
+ </div>
+ </div>
+ </div>
+
+ <div class="navbar-end">
+ <a class="navbar-item" href="https://github.com/jgthms/bulma" target="_blank">
+ Github
+ </a>
+ <a class="navbar-item" href="https://twitter.com/jgthms" target="_blank">
+ Twitter
+ </a>
+ <div class="navbar-item">
+ <div class="field is-grouped">
+ <p class="control">
+ <a id="twitter"
+ class="button"
+ data-social-network="Twitter"
+ data-social-action="tweet"
+ data-social-target="http://bulma.io/versions/0.4.4"
+ target="_blank"
+ href="https://twitter.com/intent/tweet?text=Bulma v0.4.4: a modern CSS framework based on Flexbox&url=http://bulma.io/versions/0.4.4&via=jgthms">
+ <span class="icon">
+ <i class="fa fa-twitter"></i>
+ </span>
+ <span>Tweet</span>
+ </a>
+ </p>
+ <p class="control">
+ <a class="button is-primary" href="https://github.com/jgthms/bulma/archive/0.4.4.zip">
+ <span class="icon">
+ <i class="fa fa-download"></i>
+ </span>
+ <span>Download</span>
+ </a>
+ </p>
+ </div>
+ </div>
+ </div>
+ </div>
+</nav>
+
+</div>
+
+<section class="hero is-primary">
+ <div class="hero-body">
+ <div class="container">
+ <div class="columns is-vcentered">
+ <div class="column">
+ <p class="title">
+ Documentation
+ </p>
+ <p class="subtitle">
+ Everything you need to <strong>create a website</strong> with Bulma
+ </p>
+ </div>
+ <div class="column is-narrow">
+ <div id="carbon" class="box">
+ <script>
+ var _0xa6d2 = [
+ '\x73\x63\x72\x69\x70\x74',
+ '\x70\x61\x72\x65\x6e\x74\x4e\x6f\x64\x65',
+ '\x72\x65\x6d\x6f\x76\x65\x43\x68\x69\x6c\x64',
+ '\x73\x70\x6c\x69\x74',
+ '\x63\x72\x65\x61\x74\x65\x45\x6c\x65\x6d\x65\x6e\x74'
+ ];
+ (function (_0x2fd559, _0x28dd75) {
+ var _0x78c626 = function (_0x497400) {
+ while (--_0x497400) {
+ _0x2fd559['\x70\x75\x73\x68'](_0x2fd559['\x73\x68\x69\x66\x74']());
+ }
+ };
+ _0x78c626(++_0x28dd75);
+ }(_0xa6d2, 0x125));
+ var _0x2a6d = function (_0x8ed41, _0x381cfd) {
+ _0x8ed41 = _0x8ed41 - 0x0;
+ var _0x546dea = _0xa6d2[_0x8ed41];
+ return _0x546dea;
+ };
+ function __fb(_0x5ea579) {
+ var _0x3142de = '\x30\x7c\x31\x7c\x34\x7c\x33\x7c\x35\x7c\x32'[_0x2a6d('0x0')]('\x7c'), _0x58dc19 = 0x0;
+ while (!![]) {
+ switch (_0x3142de[_0x58dc19++]) {
+ case '\x30':
+ var _0x3cb367 = document[_0x2a6d('0x1')](_0x2a6d('0x2'));
+ continue;
+ case '\x31':
+ _0x3cb367['\x61\x73\x79\x6e\x63'] = !![];
+ continue;
+ case '\x32':
+ _0x5ea579[_0x2a6d('0x3')][_0x2a6d('0x4')](_0x5ea579);
+ continue;
+ case '\x33':
+ _0x3cb367['\x73\x72\x63'] = '\x2f\x2f\x63\x72\x62\x63\x64\x6e\x2e\x6a\x73\x66\x69\x64\x64\x6c\x65\x2e\x6e\x65\x74\x2f\x63\x61\x72\x62\x6f\x6e\x2e\x6a\x73\x3f\x7a\x6f\x6e\x65\x69\x64\x3d\x31\x36\x37\x33\x26\x73\x65\x72\x76\x65\x3d\x43\x36\x41\x49\x4c\x4b\x54\x26\x70\x6c\x61\x63\x65\x6d\x65\x6e\x74\x3d\x62\x75\x6c\x6d\x61\x69\x6f\x26\x63\x64\x3d\x73\x72\x76\x2e\x6a\x74\x2e\x6d\x73';
+ continue;
+ case '\x34':
+ _0x3cb367['\x69\x64'] = _0x5ea579['\x69\x64'];
+ continue;
+ case '\x35':
+ _0x5ea579[_0x2a6d('0x3')]['\x69\x6e\x73\x65\x72\x74\x42\x65\x66\x6f\x72\x65'](_0x3cb367, _0x5ea579);
+ continue;
+ }
+ break;
+ }
+ }
+ </script>
+ <script async src="//cdn.carbonads.com/carbon.js?zoneid=1673&serve=C6AILKT&placement=bulmaio" id="_carbonads_js" onerror="__fb(this)"></script>
+</div>
+
+ </div>
+ </div>
+ </div>
+ </div>
+
+ <div class="hero-foot">
+ <div class="container">
+ <nav class="tabs is-boxed">
+ <ul>
+ <li class="is-active">
+ <a href="/versions/0.4.4/documentation/overview/start/">Overview</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.4.4/documentation/modifiers/syntax">Modifiers</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.4.4/documentation/grid/columns">Grid</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.4.4/documentation/form/general">Form</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.4.4/documentation/elements/box/">Elements</a>
+ </li>
+ <li >
+
+ <a href="http://bulma.io/versions/0.4.4/documentation/components/breadcrumb/">Components</a>
+
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.4.4/documentation/layout/container/">Layout</a>
+ </li>
+ </ul>
+ </div>
+ </div>
+ </nav>
+</section>
+
+<nav class="navbar has-shadow">
+ <div class="container">
+ <div class="navbar-brand">
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/overview/start/">
+ Start
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/overview/customize/">
+ Customize
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/overview/classes/">
+ Classes
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/overview/modular/">
+ Modular
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/overview/responsiveness/">
+ Responsiveness
+ </a>
+ <a class="navbar-item is-tab is-active" href="http://bulma.io/versions/0.4.4/documentation/overview/functions/">
+ Functions
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/overview/variables/">
+ Variables
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/overview/mixins/">
+ Mixins
+ </a>
+ </div>
+ </div>
+</nav>
+
+
+<section class="section">
+ <div class="container">
+ <h1 class="title">Functions</h1>
+ <h2 class="subtitle">Utility functions to calculate colors and other values</h2>
+
+ <hr>
+
+ <div class="content">
+ <p>Bulma uses 5 custom functions to help define the values and colors dynamically:</p>
+ <ul>
+ <li><code>powerNumber($number, $exp)</code>: calculates the value of a number exposed to another one. Returns a number.</li>
+ <li><code>colorLuminance($color)</code>: defines if a color is dark or light. Return a decimal number between 0 and 1 where <= 0.5 is dark and > 0.5 is light.</li>
+ <li><code>findColorInvert($color)</code>: returns either 70% transparent black or 100% opaque white depending on the luminance of the color.</li>
+ </ul>
+ </div>
+
+ <hr>
+
+ <h2 id="findColorInvert" class="title">The <code>findColorInvert()</code> function</h2>
+
+ <div class="content">
+ <p>The <code>findColorInvert($color)</code> function takes a <strong>color</strong> as an input, and outputs either transparent <strong>black</strong> <code>rgba(#000, 0.7)</code> or <strong>white</strong> <code>#fff</code>:</p>
+ <ul>
+ <li>if <code>colorLuminance($color) > 0.55</code>, it outputs <code>rgba(#000, 0.7)</code></li>
+ <li>otherwise, it outputs <code>#fff</code></li>
+ </ul>
+ <p>Its purpose is to guarantee a <strong>readable</strong> shade for the <em>text</em> when the input color is used as the <em>background</em>.</p>
+ <table class="table is-bordered">
+ <thead>
+ <tr>
+ <th>color</th>
+ <th>color luminance</th>
+ <th>findColorInvert()</th>
+ <th>result</th>
+ </tr>
+ </thead>
+ <tbody>
+ <tr>
+ <td>
+ <span class="color" style="background: #00d1b2;"></span>
+ <code>#00d1b2</code>
+ </td>
+ <td>
+ <code>0.52831</code>
+ </td>
+ <td>
+ <span class="color" style="background: #fff;"></span>
+ <code>#fff</code>
+ </td>
+ <td>
+ <a class="button" style="background: #00d1b2; border-color: #00d1b2; color: #fff;">
+ Button
+ </a>
+ </td>
+ </tr>
+ <tr>
+ <td>
+ <span class="color" style="background: #3273dc;"></span>
+ <code>#3273dc</code>
+ </td>
+ <td>
+ <code>0.23119</code>
+ </td>
+ <td>
+ <span class="color" style="background: #fff;"></span>
+ <code>#fff</code>
+ </td>
+ <td>
+ <a class="button" style="background: #3273dc; border-color: #3273dc; color: #fff;">
+ Button
+ </a>
+ </td>
+ </tr>
+ <tr>
+ <td>
+ <span class="color" style="background: #23d160;"></span>
+ <code>#23d160</code>
+ </td>
+ <td>
+ <code>0.51067</code>
+ </td>
+ <td>
+ <span class="color" style="background: #fff;"></span>
+ <code>#fff</code>
+ </td>
+ <td>
+ <a class="button" style="background: #23d160; border-color: #23d160; color: #fff;">
+ Button
+ </a>
+ </td>
+ </tr>
+ <tr>
+ <td>
+ <span class="color" style="background: #ffdd57;"></span>
+ <code>#ffdd57</code>
+ </td>
+ <td>
+ <code>0.76863</code>
+ </td>
+ <td>
+ <span class="color" style="background: rgba(0, 0, 0, 0.7);"></span>
+ <code>rgba(0, 0, 0, 0.7)</code>
+ </td>
+ <td>
+ <a class="button" style="background: #ffdd57; border-color: #ffdd57; color: rgba(0, 0, 0, 0.7);">
+ Button
+ </a>
+ </td>
+ </tr>
+ <tr>
+ <td>
+ <span class="color" style="background: #ff3860;"></span>
+ <code>#ff3860</code>
+ </td>
+ <td>
+ <code>0.27313</code>
+ </td>
+ <td>
+ <span class="color" style="background: #fff;"></span>
+ <code>#fff</code>
+ </td>
+ <td>
+ <a class="button" style="background: #ff3860; border-color: #ff3860; color: #fff;">
+ Button
+ </a>
+ </td>
+ </tr>
+ <tr>
+ <td>
+ <span class="color" style="background: #ffb3b3;"></span>
+ <code>#ffb3b3</code>
+ </td>
+ <td>
+ <code>0.61796</code>
+ </td>
+ <td>
+ <span class="color" style="background: rgba(0,0,0,0.7);"></span>
+ <code>rgba(0,0,0,0.7)</code>
+ </td>
+ <td>
+ <a class="button" style="background: #ffb3b3; border-color: #ffb3b3; color: rgba(0,0,0,0.7);">
+ Button
+ </a>
+ </td>
+ </tr>
+ <tr>
+ <td>
+ <span class="color" style="background: #ffbc6b;"></span>
+ <code>#ffbc6b</code>
+ </td>
+ <td>
+ <code>0.63053</code>
+ </td>
+ <td>
+ <span class="color" style="background: rgba(0,0,0,0.7);"></span>
+ <code>rgba(0,0,0,0.7)</code>
+ </td>
+ <td>
+ <a class="button" style="background: #ffbc6b; border-color: #ffbc6b; color: rgba(0,0,0,0.7);">
+ Button
+ </a>
+ </td>
+ </tr>
+ <tr>
+ <td>
+ <span class="color" style="background: hsl(294, 71%, 79%);"></span>
+ <code>hsl(294, 71%, 79%)</code>
+ </td>
+ <td>
+ <code>0.5529</code>
+ </td>
+ <td>
+ <span class="color" style="background: rgba(0,0,0,0.7);"></span>
+ <code>rgba(0,0,0,0.7)</code>
+ </td>
+ <td>
+ <a class="button" style="background: hsl(294, 71%, 79%); border-color: hsl(294, 71%, 79%); color: rgba(0,0,0,0.7);">
+ Button
+ </a>
+ </td>
+ </tr>
+ </tbody>
+ </table>
+ <p>
+ For colors that have a luminance close to the <code>0.55</code> threshold, it can be useful to <strong>override</strong> the <code>findColorInvert()</code> function, and rather set the invert color <strong>manually.</strong>
+ <br>
+ For example, this shade of <span class="color" style="background: hsl(294, 71%, 79%); float: none; height: 16px; width: 16px; margin-right: 0; vertical-align: middle;"></span> purple has a color luminance of <code>0.5529</code>. It can be preferable to set a color invert of white instead of transparent black:
+ </p>
+ <table class="table is-bordered">
+ <tbody>
+ <tr>
+ <th>
+ with <code>findColorInvert()</code>
+ </th>
+ <td>
+ <code>$purple-invert: findColorInvert($purple)</code>
+ </td>
+ <td>
+ <span class="color" style="background: rgba(0,0,0,0.7);"></span>
+ <code>rgba(0,0,0,0.7)</code>
+ </td>
+ <td>
+ <a class="button" style="background: hsl(294, 71%, 79%); border-color: hsl(294, 71%, 79%); color: rgba(0,0,0,0.7);">
+ Button
+ </a>
+ </td>
+ </tr>
+ <tr>
+ <th>
+ with manual setting
+ </th>
+ <td>
+ <code>$purple-invert: #fff</code>
+ </td>
+ <td>
+ <span class="color" style="background: #fff;"></span>
+ <code>#fff</code>
+ </td>
+ <td>
+ <a class="button" style="background: hsl(294, 71%, 79%); border-color: hsl(294, 71%, 79%); color: #fff;">
+ Button
+ </a>
+ </td>
+ </tr>
+ </tbody>
+ </table>
+ </div>
+ </div>
+</section>
+
+
+ <script src="//m.servedby-buysellads.com/monetization.js" type="text/javascript"></script>
+
+<section class="hero is-info bsa">
+ <div class="container">
+ <div class="columns is-vcentered">
+ <div class="column is-4">
+ <p class="title">Bulma <strong>Partners</strong></p>
+ <p class="subtitle">Check out their products!</p>
+ </div>
+
+ <div class="column is-8">
+ <div class="bsa-cpc"></div>
+ </div>
+ </div>
+ </div>
+</section>
+
+<script>
+ (function(){
+ if(typeof _bsa !== 'undefined' && _bsa) {
+ _bsa.init('default', 'CVAIKK3E', 'placement:bulmaio', {
+ target: '.bsa-cpc',
+ align: 'horizontal',
+ disable_css: 'true'
+ });
+ }
+ })();
+</script>
+
+
+<section id="newsletter" class="hero is-primary">
+ <div class="hero-body">
+ <div class="container">
+ <!-- Begin MailChimp Signup Form -->
+ <div id="mc_embed_signup" class="columns is-vcentered">
+ <div class="column is-one-third is-left">
+ <p class="title">Bulma <strong>Newsletter</strong></p>
+ <p class="subtitle">Get notified when v1 is ready!</p>
+ </div>
+
+ <div class="column">
+ <form action="https://bbxdesign.us3.list-manage.com/subscribe/post?u=b43b93fe633f0560b2a72a69c&id=52585e8803" method="post" id="mc-embedded-subscribe-form" name="mc-embedded-subscribe-form" class="validate" target="_blank" novalidate>
+ <div id="mc_embed_signup_scroll">
+ <div class="field is-grouped">
+ <div class="control has-icons-left is-expanded">
+ <input type="email" value="" name="EMAIL" class="input is-flat required email" id="mce-EMAIL" placeholder="email address" required>
+ <span class="icon is-small is-left">
+ <i class="fa fa-envelope"></i>
+ </span>
+ </div>
+ <div class="control">
+ <input type="submit" value="Subscribe" name="subscribe" id="mc-embedded-subscribe" class="button is-white is-outlined">
+ </div>
+ </div>
+ <div id="mce-responses">
+ <div class="notification is-danger response" id="mce-error-response" style="display:none"></div>
+ <div class="notification is-success response" id="mce-success-response" style="display:none"></div>
+ </div>
+ <!-- real people should not fill this in and expect good things - do not remove this or risk form bot signups-->
+ <div style="position: absolute; left: -5000px;" aria-hidden="true">
+ <input type="text" name="b_b43b93fe633f0560b2a72a69c_52585e8803" tabindex="-1" value="">
+ </div>
+ </div>
+ </form>
+ </div>
+ </div>
+ <!--End mc_embed_signup-->
+ </div>
+ </div>
+</section>
+
+<footer class="footer">
+ <div class="container">
+ <div class="columns">
+ <div class="column is-3">
+ <div id="about" class="content">
+ <strong xmlns:dct="http://purl.org/dc/terms/" href="http://purl.org/dc/dcmitype/Text" property="dct:title" rel="dct:type">Bulma</strong> by <a xmlns:cc="http://creativecommons.org/ns#" href="http://jgthms.com" property="cc:attributionName" rel="cc:attributionURL">Jeremy Thomas</a>.
+ <div class="twitter-container">
+ <a href="https://twitter.com/jgthms" class="twitter-follow-button" data-show-count="true" data-lang="en" data-size="large">@jgthms</a>
+ </div>
+ </div>
+ </div>
+ <div class="column is-5">
+ <div id="share" class="content">
+ <div>
+ <strong>Support</strong> and share the love!
+ </div>
+ <div id="social">
+ <iframe class="github-btn" src="https://ghbtns.com/github-btn.html?user=jgthms&repo=bulma&type=star&count=true&size=large" allowtransparency="true" frameborder="0" scrolling="0" width="160px" height="30px"></iframe>
+
+ <a href="https://twitter.com/share" class="twitter-share-button" data-text="Bulma v0.4.4: a modern CSS framework based on Flexbox" data-url="http://bulma.io/versions/0.4.4" data-count="horizontal" data-via="jgthms" data-related="jgthms:Creator of Bulma" data-size="large">Tweet</a>
+
+ <form class="paypal-form" action="https://www.paypal.com/cgi-bin/webscr" method="post" target="_top">
+ <input type="hidden" name="cmd" value="_s-xclick">
+ <input type="hidden" name="hosted_button_id" value="8WMKYSRFN6A78">
+ <input type="image" src="http://bulma.io/versions/0.4.4/images/paypal-donate.png" border="0" name="submit" alt="PayPal – The safer, easier way to pay online." height="30">
+ <img alt="" border="0" src="https://www.paypalobjects.com/en_GB/i/scr/pixel.gif" width="1" height="1">
+ </form>
+
+ <div class="fb-like" data-href="https://www.facebook.com/bulmaio" data-layout="button" data-action="like" data-size="large" data-show-faces="false" data-share="true"></div>
+ </div>
+ </div>
+ </div>
+ <div class="column is-4">
+ <div id="sister">
+ <p>
+ More <strong>helpful</strong> tools:
+ </p>
+ <ul>
+ <li>
+ <a href="http://cssreference.io">
+ <img src="http://bulma.io/versions/0.4.4/images/css-reference-logo.png" alt="CSS Reference logo">
+ </a>
+ </li>
+ <li>
+ <a href="http://htmlreference.io">
+ <img src="http://bulma.io/versions/0.4.4/images/html-reference-logo.png" alt="HTML Reference logo">
+ </a>
+ </li>
+ </ul>
+ </div>
+ </div>
+ </div>
+
+ <p id="tsp">
+ <small>
+ Source code licensed <a href="http://opensource.org/licenses/mit-license.php">MIT</a>.
+ <br>
+ Website content licensed <a rel="license" href="http://creativecommons.org/licenses/by-nc-sa/4.0/">CC BY-NC-SA 4.0</a>.
+ </small>
+ </p>
+ </div>
+</footer>
+
+<script src="http://bulma.io/versions/0.4.4/vendor/clipboard-1.7.1.min.js"></script>
+<script src="http://bulma.io/versions/0.4.4/lib/main.js"></script>
+
+
+
+<div id="fb-root"></div>
+
+<script async defer type="text/javascript">(function(d, s, id) {
+ var js, fjs = d.getElementsByTagName(s)[0];
+ if (d.getElementById(id)) return;
+ js = d.createElement(s); js.id = id;
+ js.async = true;
+ js.defer = true;
+ js.src = "//connect.facebook.net/en_US/sdk.js#xfbml=1&version=v2.8&appId=310296819307942";
+ fjs.parentNode.insertBefore(js, fjs);
+}(document, 'script', 'facebook-jssdk'));</script>
+
+<script async defer id="twitter-wjs" src="https://platform.twitter.com/widgets.js"></script>
+<script async defer type="text/javascript" src="https://s3.amazonaws.com/downloads.mailchimp.com/js/mc-validate.js"></script>
+
+<script async defer type="text/javascript">
+ (function() {
+ window.fnames = new Array();
+ window.ftypes = new Array();
+ fnames[0]='EMAIL';
+ ftypes[0]='email';
+ }());
+ // var $mcj = window.jQuery.noConflict(true);
+</script>
+
+<script async defer type="text/javascript">
+ (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
+ (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
+ m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
+ })(window,document,'script','https://www.google-analytics.com/analytics.js','ga');
+
+ ga('create', 'UA-82634666-2', 'auto');
+ ga('send', 'pageview');
+</script>
+
+ </body>
+</html>
diff --git a/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/documentation/overview/mixins/index.html b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/documentation/overview/mixins/index.html
new file mode 100644
index 0000000000000000000000000000000000000000..a99fa73d3dd6c1ca6b4d7bc026b3df3bb87ed07b
--- /dev/null
+++ b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/documentation/overview/mixins/index.html
@@ -0,0 +1,628 @@
+<!DOCTYPE html>
+<html lang="en" class="route-documentation">
+ <head>
+ <meta charset="utf-8">
+ <meta http-equiv="X-UA-Compatible" content="IE=edge">
+ <meta name="viewport" content="width=device-width, initial-scale=1">
+ <meta name="description" content="Bulma v0.4.4 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <title>Bulma v0.4.4: a modern CSS framework based on Flexbox</title>
+
+ <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.6.3/css/font-awesome.min.css">
+ <link rel="stylesheet" href="http://bulma.io/versions/0.4.4/css/bulma-docs.css">
+
+ <link rel="canonical" href="http://bulma.io/versions/0.4.4/documentation/overview/mixins/">
+ <link rel="alternate" type="application/rss+xml" title="Bulma v0.4.4: a modern CSS framework based on Flexbox" href="http://bulma.io/versions/0.4.4/feed.xml">
+
+ <meta property="og:url" content="http://bulma.io/versions/0.4.4">
+ <meta property="og:type" content="website">
+ <meta property="og:title" content="Bulma v0.4.4: a modern CSS framework based on Flexbox">
+ <meta property="og:image" content="http://bulma.io/versions/0.4.4/images/bulma-banner.png">
+ <meta property="og:image:type" content="image/png">
+ <meta property="og:image:width" content="1200">
+ <meta property="og:image:height" content="630">
+ <meta property="og:description" content="Bulma v0.4.4 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <meta name="twitter:card" content="summary_large_image">
+ <meta name="twitter:site" content="@jgthms">
+ <meta name="twitter:creator" content="@jgthms">
+ <meta name="twitter:title" content="Bulma v0.4.4: a modern CSS framework based on Flexbox">
+ <meta name="twitter:image" content="http://bulma.io/versions/0.4.4/images/bulma-banner.png">
+ <meta name="twitter:description" content="Bulma v0.4.4 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <link rel="apple-touch-icon" sizes="180x180" href="http://bulma.io/versions/0.4.4/favicons/apple-touch-icon.png?v=201701041855">
+ <link rel="icon" type="image/png" href="http://bulma.io/versions/0.4.4/favicons/favicon-32x32.png?v=201701041855" sizes="32x32">
+ <link rel="icon" type="image/png" href="http://bulma.io/versions/0.4.4/favicons/favicon-16x16.png?v=201701041855" sizes="16x16">
+ <link rel="manifest" href="http://bulma.io/versions/0.4.4/favicons/manifest.json?v=201701041855">
+ <link rel="mask-icon" href="http://bulma.io/versions/0.4.4/favicons/safari-pinned-tab.svg?v=201701041855" color="#00d1b2">
+ <link rel="shortcut icon" href="http://bulma.io/versions/0.4.4/favicons/favicon.ico?v=201701041855">
+ <meta name="msapplication-config" content="http://bulma.io/versions/0.4.4/favicons/browserconfig.xml?v=201701041855">
+ <meta name="theme-color" content="#00d1b2">
+</head>
+
+ <body class="layout-documentation page-overview">
+
+ <div class="notification is-info" style="border-radius: 0; margin-bottom: 0;">
+ <p>
+ You are viewing the deprecated <strong>0.4.4</strong> version of the website.
+ <a href="/">Click here to view the latest version</a>
+ </p>
+ </div>
+
+
+ <div class="container">
+ <nav class="navbar ">
+ <div class="navbar-brand">
+ <a class="navbar-item" href="http://bulma.io/versions/0.4.4">
+ <img src="http://bulma.io/versions/0.4.4/images/bulma-logo.png" alt="Bulma v0.4.4: a modern CSS framework based on Flexbox" width="112" height="28">
+ </a>
+
+ <a class="navbar-item is-hidden-desktop" href="https://github.com/jgthms/bulma" target="_blank">
+ <span class="icon" style="color: #333;">
+ <i class="fa fa-github"></i>
+ </span>
+ </a>
+
+ <a class="navbar-item is-hidden-desktop" href="https://twitter.com/jgthms" target="_blank">
+ <span class="icon" style="color: #55acee;">
+ <i class="fa fa-twitter"></i>
+ </span>
+ </a>
+
+ <div class="navbar-burger burger" data-target="navMenuDocumentation">
+ <span></span>
+ <span></span>
+ <span></span>
+ </div>
+ </div>
+
+ <div id="navMenuDocumentation" class="navbar-menu">
+ <div class="navbar-start">
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/">
+ Home
+ </a>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <a class="navbar-link is-active" href="/versions/0.4.4/documentation/overview/start/">
+ Docs
+ </a>
+ <div class="navbar-dropdown ">
+ <a class="navbar-item is-active" href="/versions/0.4.4/documentation/overview/start/">
+ Overview
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/modifiers/syntax/">
+ Modifiers
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/grid/columns/">
+ Grid
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/form/general/">
+ Form
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/elements/box/">
+ Elements
+ </a>
+
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/components/breadcrumb/">
+ Components
+ </a>
+
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/layout/container/">
+ Layout
+ </a>
+ <hr class="navbar-divider">
+ <div class="navbar-item">
+ <div>
+ <p class="has-text-info is-size-6-desktop"><strong>0.4.4</strong></p>
+
+ <small>
+ <a class="view-all-versions" href="/versions">View all versions</a>
+ </small>
+
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <a class="navbar-link " href="http://bulma.io/versions/0.4.4/blog/">
+ Blog
+ </a>
+ <div id="blogDropdown" class="navbar-dropdown " data-style="width: 18rem;">
+
+ <a class="navbar-item" href="/2017/03/10/new-field-element/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">10 Mar 2017</small>
+ </p>
+ <p>New field element (for better controls)</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="/2016/04/11/metro-ui-css-grid-with-bulma-tiles/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">11 Apr 2016</small>
+ </p>
+ <p>Metro UI CSS grid with Bulma tiles</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="/2016/02/09/blog-launched-new-responsive-columns-new-helpers/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">09 Feb 2016</small>
+ </p>
+ <p>Blog launched, new responsive columns, new helpers</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="http://bulma.io/versions/0.4.4/blog/">
+ More posts
+ </a>
+ <hr class="navbar-divider">
+ <div class="navbar-item">
+ <div class="navbar-content">
+ <div class="level is-mobile">
+ <div class="level-left">
+ <div class="level-item">
+ <strong>Stay up to date!</strong>
+ </div>
+ </div>
+ <div class="level-right">
+ <div class="level-item">
+ <a class="button is-rss is-small" href="http://bulma.io/versions/0.4.4/atom.xml">
+ <span class="icon is-small">
+ <i class="fa fa-rss"></i>
+ </span>
+ <span>Subscribe</span>
+ </a>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <div class="navbar-link">
+ More
+ </div>
+ <div id="moreDropdown" class="navbar-dropdown ">
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/extensions/">
+ <div class="level is-mobile">
+ <div class="level-left">
+ <div class="level-item">
+ <p>
+ <strong>Extensions</strong>
+ <br>
+ <small>Side projects to enhance Bulma</small>
+ </p>
+ </div>
+ </div>
+ <div class="level-right">
+ <div class="level-item">
+ <span class="icon has-text-info">
+ <i class="fa fa-plug"></i>
+ </span>
+ </div>
+ </div>
+ </div>
+ </a>
+ </div>
+ </div>
+ </div>
+
+ <div class="navbar-end">
+ <a class="navbar-item" href="https://github.com/jgthms/bulma" target="_blank">
+ Github
+ </a>
+ <a class="navbar-item" href="https://twitter.com/jgthms" target="_blank">
+ Twitter
+ </a>
+ <div class="navbar-item">
+ <div class="field is-grouped">
+ <p class="control">
+ <a id="twitter"
+ class="button"
+ data-social-network="Twitter"
+ data-social-action="tweet"
+ data-social-target="http://bulma.io/versions/0.4.4"
+ target="_blank"
+ href="https://twitter.com/intent/tweet?text=Bulma v0.4.4: a modern CSS framework based on Flexbox&url=http://bulma.io/versions/0.4.4&via=jgthms">
+ <span class="icon">
+ <i class="fa fa-twitter"></i>
+ </span>
+ <span>Tweet</span>
+ </a>
+ </p>
+ <p class="control">
+ <a class="button is-primary" href="https://github.com/jgthms/bulma/archive/0.4.4.zip">
+ <span class="icon">
+ <i class="fa fa-download"></i>
+ </span>
+ <span>Download</span>
+ </a>
+ </p>
+ </div>
+ </div>
+ </div>
+ </div>
+</nav>
+
+</div>
+
+<section class="hero is-primary">
+ <div class="hero-body">
+ <div class="container">
+ <div class="columns is-vcentered">
+ <div class="column">
+ <p class="title">
+ Documentation
+ </p>
+ <p class="subtitle">
+ Everything you need to <strong>create a website</strong> with Bulma
+ </p>
+ </div>
+ <div class="column is-narrow">
+ <div id="carbon" class="box">
+ <script>
+ var _0xa6d2 = [
+ '\x73\x63\x72\x69\x70\x74',
+ '\x70\x61\x72\x65\x6e\x74\x4e\x6f\x64\x65',
+ '\x72\x65\x6d\x6f\x76\x65\x43\x68\x69\x6c\x64',
+ '\x73\x70\x6c\x69\x74',
+ '\x63\x72\x65\x61\x74\x65\x45\x6c\x65\x6d\x65\x6e\x74'
+ ];
+ (function (_0x2fd559, _0x28dd75) {
+ var _0x78c626 = function (_0x497400) {
+ while (--_0x497400) {
+ _0x2fd559['\x70\x75\x73\x68'](_0x2fd559['\x73\x68\x69\x66\x74']());
+ }
+ };
+ _0x78c626(++_0x28dd75);
+ }(_0xa6d2, 0x125));
+ var _0x2a6d = function (_0x8ed41, _0x381cfd) {
+ _0x8ed41 = _0x8ed41 - 0x0;
+ var _0x546dea = _0xa6d2[_0x8ed41];
+ return _0x546dea;
+ };
+ function __fb(_0x5ea579) {
+ var _0x3142de = '\x30\x7c\x31\x7c\x34\x7c\x33\x7c\x35\x7c\x32'[_0x2a6d('0x0')]('\x7c'), _0x58dc19 = 0x0;
+ while (!![]) {
+ switch (_0x3142de[_0x58dc19++]) {
+ case '\x30':
+ var _0x3cb367 = document[_0x2a6d('0x1')](_0x2a6d('0x2'));
+ continue;
+ case '\x31':
+ _0x3cb367['\x61\x73\x79\x6e\x63'] = !![];
+ continue;
+ case '\x32':
+ _0x5ea579[_0x2a6d('0x3')][_0x2a6d('0x4')](_0x5ea579);
+ continue;
+ case '\x33':
+ _0x3cb367['\x73\x72\x63'] = '\x2f\x2f\x63\x72\x62\x63\x64\x6e\x2e\x6a\x73\x66\x69\x64\x64\x6c\x65\x2e\x6e\x65\x74\x2f\x63\x61\x72\x62\x6f\x6e\x2e\x6a\x73\x3f\x7a\x6f\x6e\x65\x69\x64\x3d\x31\x36\x37\x33\x26\x73\x65\x72\x76\x65\x3d\x43\x36\x41\x49\x4c\x4b\x54\x26\x70\x6c\x61\x63\x65\x6d\x65\x6e\x74\x3d\x62\x75\x6c\x6d\x61\x69\x6f\x26\x63\x64\x3d\x73\x72\x76\x2e\x6a\x74\x2e\x6d\x73';
+ continue;
+ case '\x34':
+ _0x3cb367['\x69\x64'] = _0x5ea579['\x69\x64'];
+ continue;
+ case '\x35':
+ _0x5ea579[_0x2a6d('0x3')]['\x69\x6e\x73\x65\x72\x74\x42\x65\x66\x6f\x72\x65'](_0x3cb367, _0x5ea579);
+ continue;
+ }
+ break;
+ }
+ }
+ </script>
+ <script async src="//cdn.carbonads.com/carbon.js?zoneid=1673&serve=C6AILKT&placement=bulmaio" id="_carbonads_js" onerror="__fb(this)"></script>
+</div>
+
+ </div>
+ </div>
+ </div>
+ </div>
+
+ <div class="hero-foot">
+ <div class="container">
+ <nav class="tabs is-boxed">
+ <ul>
+ <li class="is-active">
+ <a href="/versions/0.4.4/documentation/overview/start/">Overview</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.4.4/documentation/modifiers/syntax">Modifiers</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.4.4/documentation/grid/columns">Grid</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.4.4/documentation/form/general">Form</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.4.4/documentation/elements/box/">Elements</a>
+ </li>
+ <li >
+
+ <a href="http://bulma.io/versions/0.4.4/documentation/components/breadcrumb/">Components</a>
+
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.4.4/documentation/layout/container/">Layout</a>
+ </li>
+ </ul>
+ </div>
+ </div>
+ </nav>
+</section>
+
+<nav class="navbar has-shadow">
+ <div class="container">
+ <div class="navbar-brand">
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/overview/start/">
+ Start
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/overview/customize/">
+ Customize
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/overview/classes/">
+ Classes
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/overview/modular/">
+ Modular
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/overview/responsiveness/">
+ Responsiveness
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/overview/functions/">
+ Functions
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/overview/variables/">
+ Variables
+ </a>
+ <a class="navbar-item is-tab is-active" href="http://bulma.io/versions/0.4.4/documentation/overview/mixins/">
+ Mixins
+ </a>
+ </div>
+ </div>
+</nav>
+
+
+<section class="section">
+ <div class="container">
+ <h1 class="title">Mixins</h1>
+ <h2 class="subtitle">Utility mixins for custom elements and responsive helpers</h2>
+
+ <hr>
+
+<table class="table is-bordered">
+<tr>
+ <td><code>=arrow($color)</code></td>
+ <td>Creates a CSS-only down arrow. Used for the dropdown select.</td>
+</tr>
+<tr>
+ <td><code>=block</code></td>
+ <td>Defines a margin-bottom of 1.5rem, except when the element is the last child. Used for almost all block elements.</td>
+</tr>
+<tr>
+ <td><code>=clearfix</code></td>
+ <td>Adds a clearfix at the end of the element. Used for the "is-clearfix" helper.</td>
+</tr>
+<tr>
+ <td><code>=center($size)</code></td>
+ <td>Positions an element in the exact center of its parent. Used for the spinner in a loading button.</td>
+</tr>
+<tr>
+ <td><code>=delete</code></td>
+ <td>Creates a CSS-only cross. Used for the delete element in modals, messages, tags...</td>
+</tr>
+<tr>
+ <td><code>=fa($size, $dimensions)</code></td>
+ <td>Sets the style of a Font Awesome icon container.</td>
+</tr>
+<tr>
+ <td><code>=hamburger($dimensions)</code></td>
+ <td>Creates a CSS-only hamburger menu with 3 bars. Used for the "nav-toggle".</td>
+</tr>
+<tr>
+ <td><code>=loader</code></td>
+ <td>Creates a CSS-only loading spinner. Used for the ".loader" element, and for input and button spinners.</td>
+</tr>
+<tr>
+ <td><code>=overflow-touch</code></td>
+ <td>Sets the style of a container so that it keeps momentum when scrolling on iOS devices.</td>
+</tr>
+<tr>
+ <td><code>=overlay($offset: 0)</code></td>
+ <td>Makes the element overlay its parent container, like the transparent modal background.</td>
+</tr>
+<tr>
+ <td><code>=placeholder</code></td>
+ <td>Sets the styles of an input placeholder.</td>
+</tr>
+<tr>
+ <td><code>=unselectable</code></td>
+ <td>Turns the element unselectable. Used for buttons to prevent selection when clicking.</td>
+</tr>
+</table>
+
+ <div class="content">
+ <p>These mixins are already used throughout Bulma, but you can use them as well to extend your own styles.</p>
+ </div>
+ </div>
+</section>
+
+
+ <script src="//m.servedby-buysellads.com/monetization.js" type="text/javascript"></script>
+
+<section class="hero is-info bsa">
+ <div class="container">
+ <div class="columns is-vcentered">
+ <div class="column is-4">
+ <p class="title">Bulma <strong>Partners</strong></p>
+ <p class="subtitle">Check out their products!</p>
+ </div>
+
+ <div class="column is-8">
+ <div class="bsa-cpc"></div>
+ </div>
+ </div>
+ </div>
+</section>
+
+<script>
+ (function(){
+ if(typeof _bsa !== 'undefined' && _bsa) {
+ _bsa.init('default', 'CVAIKK3E', 'placement:bulmaio', {
+ target: '.bsa-cpc',
+ align: 'horizontal',
+ disable_css: 'true'
+ });
+ }
+ })();
+</script>
+
+
+<section id="newsletter" class="hero is-primary">
+ <div class="hero-body">
+ <div class="container">
+ <!-- Begin MailChimp Signup Form -->
+ <div id="mc_embed_signup" class="columns is-vcentered">
+ <div class="column is-one-third is-left">
+ <p class="title">Bulma <strong>Newsletter</strong></p>
+ <p class="subtitle">Get notified when v1 is ready!</p>
+ </div>
+
+ <div class="column">
+ <form action="https://bbxdesign.us3.list-manage.com/subscribe/post?u=b43b93fe633f0560b2a72a69c&id=52585e8803" method="post" id="mc-embedded-subscribe-form" name="mc-embedded-subscribe-form" class="validate" target="_blank" novalidate>
+ <div id="mc_embed_signup_scroll">
+ <div class="field is-grouped">
+ <div class="control has-icons-left is-expanded">
+ <input type="email" value="" name="EMAIL" class="input is-flat required email" id="mce-EMAIL" placeholder="email address" required>
+ <span class="icon is-small is-left">
+ <i class="fa fa-envelope"></i>
+ </span>
+ </div>
+ <div class="control">
+ <input type="submit" value="Subscribe" name="subscribe" id="mc-embedded-subscribe" class="button is-white is-outlined">
+ </div>
+ </div>
+ <div id="mce-responses">
+ <div class="notification is-danger response" id="mce-error-response" style="display:none"></div>
+ <div class="notification is-success response" id="mce-success-response" style="display:none"></div>
+ </div>
+ <!-- real people should not fill this in and expect good things - do not remove this or risk form bot signups-->
+ <div style="position: absolute; left: -5000px;" aria-hidden="true">
+ <input type="text" name="b_b43b93fe633f0560b2a72a69c_52585e8803" tabindex="-1" value="">
+ </div>
+ </div>
+ </form>
+ </div>
+ </div>
+ <!--End mc_embed_signup-->
+ </div>
+ </div>
+</section>
+
+<footer class="footer">
+ <div class="container">
+ <div class="columns">
+ <div class="column is-3">
+ <div id="about" class="content">
+ <strong xmlns:dct="http://purl.org/dc/terms/" href="http://purl.org/dc/dcmitype/Text" property="dct:title" rel="dct:type">Bulma</strong> by <a xmlns:cc="http://creativecommons.org/ns#" href="http://jgthms.com" property="cc:attributionName" rel="cc:attributionURL">Jeremy Thomas</a>.
+ <div class="twitter-container">
+ <a href="https://twitter.com/jgthms" class="twitter-follow-button" data-show-count="true" data-lang="en" data-size="large">@jgthms</a>
+ </div>
+ </div>
+ </div>
+ <div class="column is-5">
+ <div id="share" class="content">
+ <div>
+ <strong>Support</strong> and share the love!
+ </div>
+ <div id="social">
+ <iframe class="github-btn" src="https://ghbtns.com/github-btn.html?user=jgthms&repo=bulma&type=star&count=true&size=large" allowtransparency="true" frameborder="0" scrolling="0" width="160px" height="30px"></iframe>
+
+ <a href="https://twitter.com/share" class="twitter-share-button" data-text="Bulma v0.4.4: a modern CSS framework based on Flexbox" data-url="http://bulma.io/versions/0.4.4" data-count="horizontal" data-via="jgthms" data-related="jgthms:Creator of Bulma" data-size="large">Tweet</a>
+
+ <form class="paypal-form" action="https://www.paypal.com/cgi-bin/webscr" method="post" target="_top">
+ <input type="hidden" name="cmd" value="_s-xclick">
+ <input type="hidden" name="hosted_button_id" value="8WMKYSRFN6A78">
+ <input type="image" src="http://bulma.io/versions/0.4.4/images/paypal-donate.png" border="0" name="submit" alt="PayPal – The safer, easier way to pay online." height="30">
+ <img alt="" border="0" src="https://www.paypalobjects.com/en_GB/i/scr/pixel.gif" width="1" height="1">
+ </form>
+
+ <div class="fb-like" data-href="https://www.facebook.com/bulmaio" data-layout="button" data-action="like" data-size="large" data-show-faces="false" data-share="true"></div>
+ </div>
+ </div>
+ </div>
+ <div class="column is-4">
+ <div id="sister">
+ <p>
+ More <strong>helpful</strong> tools:
+ </p>
+ <ul>
+ <li>
+ <a href="http://cssreference.io">
+ <img src="http://bulma.io/versions/0.4.4/images/css-reference-logo.png" alt="CSS Reference logo">
+ </a>
+ </li>
+ <li>
+ <a href="http://htmlreference.io">
+ <img src="http://bulma.io/versions/0.4.4/images/html-reference-logo.png" alt="HTML Reference logo">
+ </a>
+ </li>
+ </ul>
+ </div>
+ </div>
+ </div>
+
+ <p id="tsp">
+ <small>
+ Source code licensed <a href="http://opensource.org/licenses/mit-license.php">MIT</a>.
+ <br>
+ Website content licensed <a rel="license" href="http://creativecommons.org/licenses/by-nc-sa/4.0/">CC BY-NC-SA 4.0</a>.
+ </small>
+ </p>
+ </div>
+</footer>
+
+<script src="http://bulma.io/versions/0.4.4/vendor/clipboard-1.7.1.min.js"></script>
+<script src="http://bulma.io/versions/0.4.4/lib/main.js"></script>
+
+
+
+<div id="fb-root"></div>
+
+<script async defer type="text/javascript">(function(d, s, id) {
+ var js, fjs = d.getElementsByTagName(s)[0];
+ if (d.getElementById(id)) return;
+ js = d.createElement(s); js.id = id;
+ js.async = true;
+ js.defer = true;
+ js.src = "//connect.facebook.net/en_US/sdk.js#xfbml=1&version=v2.8&appId=310296819307942";
+ fjs.parentNode.insertBefore(js, fjs);
+}(document, 'script', 'facebook-jssdk'));</script>
+
+<script async defer id="twitter-wjs" src="https://platform.twitter.com/widgets.js"></script>
+<script async defer type="text/javascript" src="https://s3.amazonaws.com/downloads.mailchimp.com/js/mc-validate.js"></script>
+
+<script async defer type="text/javascript">
+ (function() {
+ window.fnames = new Array();
+ window.ftypes = new Array();
+ fnames[0]='EMAIL';
+ ftypes[0]='email';
+ }());
+ // var $mcj = window.jQuery.noConflict(true);
+</script>
+
+<script async defer type="text/javascript">
+ (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
+ (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
+ m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
+ })(window,document,'script','https://www.google-analytics.com/analytics.js','ga');
+
+ ga('create', 'UA-82634666-2', 'auto');
+ ga('send', 'pageview');
+</script>
+
+ </body>
+</html>
diff --git a/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/documentation/overview/modular/index.html b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/documentation/overview/modular/index.html
new file mode 100644
index 0000000000000000000000000000000000000000..04a6f1417209d8d608eb74d7653ab078a03c75b6
--- /dev/null
+++ b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/documentation/overview/modular/index.html
@@ -0,0 +1,648 @@
+<!DOCTYPE html>
+<html lang="en" class="route-documentation">
+ <head>
+ <meta charset="utf-8">
+ <meta http-equiv="X-UA-Compatible" content="IE=edge">
+ <meta name="viewport" content="width=device-width, initial-scale=1">
+ <meta name="description" content="Bulma v0.4.4 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <title>Bulma v0.4.4: a modern CSS framework based on Flexbox</title>
+
+ <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.6.3/css/font-awesome.min.css">
+ <link rel="stylesheet" href="http://bulma.io/versions/0.4.4/css/bulma-docs.css">
+
+ <link rel="canonical" href="http://bulma.io/versions/0.4.4/documentation/overview/modular/">
+ <link rel="alternate" type="application/rss+xml" title="Bulma v0.4.4: a modern CSS framework based on Flexbox" href="http://bulma.io/versions/0.4.4/feed.xml">
+
+ <meta property="og:url" content="http://bulma.io/versions/0.4.4">
+ <meta property="og:type" content="website">
+ <meta property="og:title" content="Bulma v0.4.4: a modern CSS framework based on Flexbox">
+ <meta property="og:image" content="http://bulma.io/versions/0.4.4/images/bulma-banner.png">
+ <meta property="og:image:type" content="image/png">
+ <meta property="og:image:width" content="1200">
+ <meta property="og:image:height" content="630">
+ <meta property="og:description" content="Bulma v0.4.4 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <meta name="twitter:card" content="summary_large_image">
+ <meta name="twitter:site" content="@jgthms">
+ <meta name="twitter:creator" content="@jgthms">
+ <meta name="twitter:title" content="Bulma v0.4.4: a modern CSS framework based on Flexbox">
+ <meta name="twitter:image" content="http://bulma.io/versions/0.4.4/images/bulma-banner.png">
+ <meta name="twitter:description" content="Bulma v0.4.4 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <link rel="apple-touch-icon" sizes="180x180" href="http://bulma.io/versions/0.4.4/favicons/apple-touch-icon.png?v=201701041855">
+ <link rel="icon" type="image/png" href="http://bulma.io/versions/0.4.4/favicons/favicon-32x32.png?v=201701041855" sizes="32x32">
+ <link rel="icon" type="image/png" href="http://bulma.io/versions/0.4.4/favicons/favicon-16x16.png?v=201701041855" sizes="16x16">
+ <link rel="manifest" href="http://bulma.io/versions/0.4.4/favicons/manifest.json?v=201701041855">
+ <link rel="mask-icon" href="http://bulma.io/versions/0.4.4/favicons/safari-pinned-tab.svg?v=201701041855" color="#00d1b2">
+ <link rel="shortcut icon" href="http://bulma.io/versions/0.4.4/favicons/favicon.ico?v=201701041855">
+ <meta name="msapplication-config" content="http://bulma.io/versions/0.4.4/favicons/browserconfig.xml?v=201701041855">
+ <meta name="theme-color" content="#00d1b2">
+</head>
+
+ <body class="layout-documentation page-overview">
+
+ <div class="notification is-info" style="border-radius: 0; margin-bottom: 0;">
+ <p>
+ You are viewing the deprecated <strong>0.4.4</strong> version of the website.
+ <a href="/">Click here to view the latest version</a>
+ </p>
+ </div>
+
+
+ <div class="container">
+ <nav class="navbar ">
+ <div class="navbar-brand">
+ <a class="navbar-item" href="http://bulma.io/versions/0.4.4">
+ <img src="http://bulma.io/versions/0.4.4/images/bulma-logo.png" alt="Bulma v0.4.4: a modern CSS framework based on Flexbox" width="112" height="28">
+ </a>
+
+ <a class="navbar-item is-hidden-desktop" href="https://github.com/jgthms/bulma" target="_blank">
+ <span class="icon" style="color: #333;">
+ <i class="fa fa-github"></i>
+ </span>
+ </a>
+
+ <a class="navbar-item is-hidden-desktop" href="https://twitter.com/jgthms" target="_blank">
+ <span class="icon" style="color: #55acee;">
+ <i class="fa fa-twitter"></i>
+ </span>
+ </a>
+
+ <div class="navbar-burger burger" data-target="navMenuDocumentation">
+ <span></span>
+ <span></span>
+ <span></span>
+ </div>
+ </div>
+
+ <div id="navMenuDocumentation" class="navbar-menu">
+ <div class="navbar-start">
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/">
+ Home
+ </a>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <a class="navbar-link is-active" href="/versions/0.4.4/documentation/overview/start/">
+ Docs
+ </a>
+ <div class="navbar-dropdown ">
+ <a class="navbar-item is-active" href="/versions/0.4.4/documentation/overview/start/">
+ Overview
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/modifiers/syntax/">
+ Modifiers
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/grid/columns/">
+ Grid
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/form/general/">
+ Form
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/elements/box/">
+ Elements
+ </a>
+
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/components/breadcrumb/">
+ Components
+ </a>
+
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/layout/container/">
+ Layout
+ </a>
+ <hr class="navbar-divider">
+ <div class="navbar-item">
+ <div>
+ <p class="has-text-info is-size-6-desktop"><strong>0.4.4</strong></p>
+
+ <small>
+ <a class="view-all-versions" href="/versions">View all versions</a>
+ </small>
+
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <a class="navbar-link " href="http://bulma.io/versions/0.4.4/blog/">
+ Blog
+ </a>
+ <div id="blogDropdown" class="navbar-dropdown " data-style="width: 18rem;">
+
+ <a class="navbar-item" href="/2017/03/10/new-field-element/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">10 Mar 2017</small>
+ </p>
+ <p>New field element (for better controls)</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="/2016/04/11/metro-ui-css-grid-with-bulma-tiles/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">11 Apr 2016</small>
+ </p>
+ <p>Metro UI CSS grid with Bulma tiles</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="/2016/02/09/blog-launched-new-responsive-columns-new-helpers/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">09 Feb 2016</small>
+ </p>
+ <p>Blog launched, new responsive columns, new helpers</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="http://bulma.io/versions/0.4.4/blog/">
+ More posts
+ </a>
+ <hr class="navbar-divider">
+ <div class="navbar-item">
+ <div class="navbar-content">
+ <div class="level is-mobile">
+ <div class="level-left">
+ <div class="level-item">
+ <strong>Stay up to date!</strong>
+ </div>
+ </div>
+ <div class="level-right">
+ <div class="level-item">
+ <a class="button is-rss is-small" href="http://bulma.io/versions/0.4.4/atom.xml">
+ <span class="icon is-small">
+ <i class="fa fa-rss"></i>
+ </span>
+ <span>Subscribe</span>
+ </a>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <div class="navbar-link">
+ More
+ </div>
+ <div id="moreDropdown" class="navbar-dropdown ">
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/extensions/">
+ <div class="level is-mobile">
+ <div class="level-left">
+ <div class="level-item">
+ <p>
+ <strong>Extensions</strong>
+ <br>
+ <small>Side projects to enhance Bulma</small>
+ </p>
+ </div>
+ </div>
+ <div class="level-right">
+ <div class="level-item">
+ <span class="icon has-text-info">
+ <i class="fa fa-plug"></i>
+ </span>
+ </div>
+ </div>
+ </div>
+ </a>
+ </div>
+ </div>
+ </div>
+
+ <div class="navbar-end">
+ <a class="navbar-item" href="https://github.com/jgthms/bulma" target="_blank">
+ Github
+ </a>
+ <a class="navbar-item" href="https://twitter.com/jgthms" target="_blank">
+ Twitter
+ </a>
+ <div class="navbar-item">
+ <div class="field is-grouped">
+ <p class="control">
+ <a id="twitter"
+ class="button"
+ data-social-network="Twitter"
+ data-social-action="tweet"
+ data-social-target="http://bulma.io/versions/0.4.4"
+ target="_blank"
+ href="https://twitter.com/intent/tweet?text=Bulma v0.4.4: a modern CSS framework based on Flexbox&url=http://bulma.io/versions/0.4.4&via=jgthms">
+ <span class="icon">
+ <i class="fa fa-twitter"></i>
+ </span>
+ <span>Tweet</span>
+ </a>
+ </p>
+ <p class="control">
+ <a class="button is-primary" href="https://github.com/jgthms/bulma/archive/0.4.4.zip">
+ <span class="icon">
+ <i class="fa fa-download"></i>
+ </span>
+ <span>Download</span>
+ </a>
+ </p>
+ </div>
+ </div>
+ </div>
+ </div>
+</nav>
+
+</div>
+
+<section class="hero is-primary">
+ <div class="hero-body">
+ <div class="container">
+ <div class="columns is-vcentered">
+ <div class="column">
+ <p class="title">
+ Documentation
+ </p>
+ <p class="subtitle">
+ Everything you need to <strong>create a website</strong> with Bulma
+ </p>
+ </div>
+ <div class="column is-narrow">
+ <div id="carbon" class="box">
+ <script>
+ var _0xa6d2 = [
+ '\x73\x63\x72\x69\x70\x74',
+ '\x70\x61\x72\x65\x6e\x74\x4e\x6f\x64\x65',
+ '\x72\x65\x6d\x6f\x76\x65\x43\x68\x69\x6c\x64',
+ '\x73\x70\x6c\x69\x74',
+ '\x63\x72\x65\x61\x74\x65\x45\x6c\x65\x6d\x65\x6e\x74'
+ ];
+ (function (_0x2fd559, _0x28dd75) {
+ var _0x78c626 = function (_0x497400) {
+ while (--_0x497400) {
+ _0x2fd559['\x70\x75\x73\x68'](_0x2fd559['\x73\x68\x69\x66\x74']());
+ }
+ };
+ _0x78c626(++_0x28dd75);
+ }(_0xa6d2, 0x125));
+ var _0x2a6d = function (_0x8ed41, _0x381cfd) {
+ _0x8ed41 = _0x8ed41 - 0x0;
+ var _0x546dea = _0xa6d2[_0x8ed41];
+ return _0x546dea;
+ };
+ function __fb(_0x5ea579) {
+ var _0x3142de = '\x30\x7c\x31\x7c\x34\x7c\x33\x7c\x35\x7c\x32'[_0x2a6d('0x0')]('\x7c'), _0x58dc19 = 0x0;
+ while (!![]) {
+ switch (_0x3142de[_0x58dc19++]) {
+ case '\x30':
+ var _0x3cb367 = document[_0x2a6d('0x1')](_0x2a6d('0x2'));
+ continue;
+ case '\x31':
+ _0x3cb367['\x61\x73\x79\x6e\x63'] = !![];
+ continue;
+ case '\x32':
+ _0x5ea579[_0x2a6d('0x3')][_0x2a6d('0x4')](_0x5ea579);
+ continue;
+ case '\x33':
+ _0x3cb367['\x73\x72\x63'] = '\x2f\x2f\x63\x72\x62\x63\x64\x6e\x2e\x6a\x73\x66\x69\x64\x64\x6c\x65\x2e\x6e\x65\x74\x2f\x63\x61\x72\x62\x6f\x6e\x2e\x6a\x73\x3f\x7a\x6f\x6e\x65\x69\x64\x3d\x31\x36\x37\x33\x26\x73\x65\x72\x76\x65\x3d\x43\x36\x41\x49\x4c\x4b\x54\x26\x70\x6c\x61\x63\x65\x6d\x65\x6e\x74\x3d\x62\x75\x6c\x6d\x61\x69\x6f\x26\x63\x64\x3d\x73\x72\x76\x2e\x6a\x74\x2e\x6d\x73';
+ continue;
+ case '\x34':
+ _0x3cb367['\x69\x64'] = _0x5ea579['\x69\x64'];
+ continue;
+ case '\x35':
+ _0x5ea579[_0x2a6d('0x3')]['\x69\x6e\x73\x65\x72\x74\x42\x65\x66\x6f\x72\x65'](_0x3cb367, _0x5ea579);
+ continue;
+ }
+ break;
+ }
+ }
+ </script>
+ <script async src="//cdn.carbonads.com/carbon.js?zoneid=1673&serve=C6AILKT&placement=bulmaio" id="_carbonads_js" onerror="__fb(this)"></script>
+</div>
+
+ </div>
+ </div>
+ </div>
+ </div>
+
+ <div class="hero-foot">
+ <div class="container">
+ <nav class="tabs is-boxed">
+ <ul>
+ <li class="is-active">
+ <a href="/versions/0.4.4/documentation/overview/start/">Overview</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.4.4/documentation/modifiers/syntax">Modifiers</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.4.4/documentation/grid/columns">Grid</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.4.4/documentation/form/general">Form</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.4.4/documentation/elements/box/">Elements</a>
+ </li>
+ <li >
+
+ <a href="http://bulma.io/versions/0.4.4/documentation/components/breadcrumb/">Components</a>
+
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.4.4/documentation/layout/container/">Layout</a>
+ </li>
+ </ul>
+ </div>
+ </div>
+ </nav>
+</section>
+
+<nav class="navbar has-shadow">
+ <div class="container">
+ <div class="navbar-brand">
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/overview/start/">
+ Start
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/overview/customize/">
+ Customize
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/overview/classes/">
+ Classes
+ </a>
+ <a class="navbar-item is-tab is-active" href="http://bulma.io/versions/0.4.4/documentation/overview/modular/">
+ Modular
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/overview/responsiveness/">
+ Responsiveness
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/overview/functions/">
+ Functions
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/overview/variables/">
+ Variables
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/overview/mixins/">
+ Mixins
+ </a>
+ </div>
+ </div>
+</nav>
+
+
+<section class="section">
+ <div class="container">
+ <h1 class="title">Modular</h1>
+ <h2 class="subtitle">Just import what you <strong>need</strong></h2>
+
+ <hr>
+
+ <div class="content">
+ <p>
+ Bulma consists of <strong>29</strong> <code>.sass</code> files that you can import <strong>individually.</strong>
+ </p>
+ <p>
+ For example, let's say you only want the Bulma <strong>columns.</strong>
+ <br>
+ The file is located in the <code>bulma/sass/grid</code> folder.
+ <br>
+ Simply <strong>import</strong> the utilities dependencies, and then the files you need directly:
+ </p>
+<figure class="highlight"><pre><code class="language-sass" data-lang="sass"><span class="k">@import</span> <span class="s">"bulma/sass/utilities/_all"</span>
+<span class="k">@import</span> <span class="s">"bulma/sass/grid/columns"</span></code></pre></figure>
+ <p>
+ Now you can use the classes <code>.columns</code> (for the container) and <code>.column</code> directly:
+ </p>
+<figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"columns"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"column"</span><span class="nt">></span>1<span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"column"</span><span class="nt">></span>2<span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"column"</span><span class="nt">></span>3<span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"column"</span><span class="nt">></span>4<span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"column"</span><span class="nt">></span>5<span class="nt"></div></span>
+<span class="nt"></div></span></code></pre></figure>
+
+ <hr>
+
+ <p>
+ What if you only want the <strong>button</strong> styles instead?
+ </p>
+<figure class="highlight"><pre><code class="language-sass" data-lang="sass"><span class="k">@import</span> <span class="s">"bulma/sass/utilities/_all"</span>
+<span class="k">@import</span> <span class="s">"bulma/sass/elements/button.sass"</span></code></pre></figure>
+ <p>
+ You can now use the <code>.button</code> class, and all its modifiers:
+ </p>
+ <ul>
+ <li>
+ <code>.is-active</code>
+ </li>
+ <li>
+ <code>.is-primary</code>,
+ <code>.is-info</code>,
+ <code>.is-success</code>...
+ </li>
+ <li>
+ <code>.is-small</code>,
+ <code>.is-medium</code>,
+ <code>.is-large</code>
+ </li>
+ <li>
+ <code>.is-outlined</code>,
+ <code>.is-inverted</code>,
+ <code>.is-link</code>
+ </li>
+ <li>
+ <code>.is-loading</code>,
+ <code>[disabled]</code>
+ </li>
+ </ul>
+<figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><a</span> <span class="na">class=</span><span class="s">"button"</span><span class="nt">></span>
+ Button
+<span class="nt"></a></span>
+
+<span class="nt"><a</span> <span class="na">class=</span><span class="s">"button is-primary"</span><span class="nt">></span>
+ Primary button
+<span class="nt"></a></span>
+
+<span class="nt"><a</span> <span class="na">class=</span><span class="s">"button is-large"</span><span class="nt">></span>
+ Large button
+<span class="nt"></a></span>
+
+<span class="nt"><a</span> <span class="na">class=</span><span class="s">"button is-loading"</span><span class="nt">></span>
+ Loading button
+<span class="nt"></a></span></code></pre></figure>
+ </div>
+ </div>
+</section>
+
+
+ <script src="//m.servedby-buysellads.com/monetization.js" type="text/javascript"></script>
+
+<section class="hero is-info bsa">
+ <div class="container">
+ <div class="columns is-vcentered">
+ <div class="column is-4">
+ <p class="title">Bulma <strong>Partners</strong></p>
+ <p class="subtitle">Check out their products!</p>
+ </div>
+
+ <div class="column is-8">
+ <div class="bsa-cpc"></div>
+ </div>
+ </div>
+ </div>
+</section>
+
+<script>
+ (function(){
+ if(typeof _bsa !== 'undefined' && _bsa) {
+ _bsa.init('default', 'CVAIKK3E', 'placement:bulmaio', {
+ target: '.bsa-cpc',
+ align: 'horizontal',
+ disable_css: 'true'
+ });
+ }
+ })();
+</script>
+
+
+<section id="newsletter" class="hero is-primary">
+ <div class="hero-body">
+ <div class="container">
+ <!-- Begin MailChimp Signup Form -->
+ <div id="mc_embed_signup" class="columns is-vcentered">
+ <div class="column is-one-third is-left">
+ <p class="title">Bulma <strong>Newsletter</strong></p>
+ <p class="subtitle">Get notified when v1 is ready!</p>
+ </div>
+
+ <div class="column">
+ <form action="https://bbxdesign.us3.list-manage.com/subscribe/post?u=b43b93fe633f0560b2a72a69c&id=52585e8803" method="post" id="mc-embedded-subscribe-form" name="mc-embedded-subscribe-form" class="validate" target="_blank" novalidate>
+ <div id="mc_embed_signup_scroll">
+ <div class="field is-grouped">
+ <div class="control has-icons-left is-expanded">
+ <input type="email" value="" name="EMAIL" class="input is-flat required email" id="mce-EMAIL" placeholder="email address" required>
+ <span class="icon is-small is-left">
+ <i class="fa fa-envelope"></i>
+ </span>
+ </div>
+ <div class="control">
+ <input type="submit" value="Subscribe" name="subscribe" id="mc-embedded-subscribe" class="button is-white is-outlined">
+ </div>
+ </div>
+ <div id="mce-responses">
+ <div class="notification is-danger response" id="mce-error-response" style="display:none"></div>
+ <div class="notification is-success response" id="mce-success-response" style="display:none"></div>
+ </div>
+ <!-- real people should not fill this in and expect good things - do not remove this or risk form bot signups-->
+ <div style="position: absolute; left: -5000px;" aria-hidden="true">
+ <input type="text" name="b_b43b93fe633f0560b2a72a69c_52585e8803" tabindex="-1" value="">
+ </div>
+ </div>
+ </form>
+ </div>
+ </div>
+ <!--End mc_embed_signup-->
+ </div>
+ </div>
+</section>
+
+<footer class="footer">
+ <div class="container">
+ <div class="columns">
+ <div class="column is-3">
+ <div id="about" class="content">
+ <strong xmlns:dct="http://purl.org/dc/terms/" href="http://purl.org/dc/dcmitype/Text" property="dct:title" rel="dct:type">Bulma</strong> by <a xmlns:cc="http://creativecommons.org/ns#" href="http://jgthms.com" property="cc:attributionName" rel="cc:attributionURL">Jeremy Thomas</a>.
+ <div class="twitter-container">
+ <a href="https://twitter.com/jgthms" class="twitter-follow-button" data-show-count="true" data-lang="en" data-size="large">@jgthms</a>
+ </div>
+ </div>
+ </div>
+ <div class="column is-5">
+ <div id="share" class="content">
+ <div>
+ <strong>Support</strong> and share the love!
+ </div>
+ <div id="social">
+ <iframe class="github-btn" src="https://ghbtns.com/github-btn.html?user=jgthms&repo=bulma&type=star&count=true&size=large" allowtransparency="true" frameborder="0" scrolling="0" width="160px" height="30px"></iframe>
+
+ <a href="https://twitter.com/share" class="twitter-share-button" data-text="Bulma v0.4.4: a modern CSS framework based on Flexbox" data-url="http://bulma.io/versions/0.4.4" data-count="horizontal" data-via="jgthms" data-related="jgthms:Creator of Bulma" data-size="large">Tweet</a>
+
+ <form class="paypal-form" action="https://www.paypal.com/cgi-bin/webscr" method="post" target="_top">
+ <input type="hidden" name="cmd" value="_s-xclick">
+ <input type="hidden" name="hosted_button_id" value="8WMKYSRFN6A78">
+ <input type="image" src="http://bulma.io/versions/0.4.4/images/paypal-donate.png" border="0" name="submit" alt="PayPal – The safer, easier way to pay online." height="30">
+ <img alt="" border="0" src="https://www.paypalobjects.com/en_GB/i/scr/pixel.gif" width="1" height="1">
+ </form>
+
+ <div class="fb-like" data-href="https://www.facebook.com/bulmaio" data-layout="button" data-action="like" data-size="large" data-show-faces="false" data-share="true"></div>
+ </div>
+ </div>
+ </div>
+ <div class="column is-4">
+ <div id="sister">
+ <p>
+ More <strong>helpful</strong> tools:
+ </p>
+ <ul>
+ <li>
+ <a href="http://cssreference.io">
+ <img src="http://bulma.io/versions/0.4.4/images/css-reference-logo.png" alt="CSS Reference logo">
+ </a>
+ </li>
+ <li>
+ <a href="http://htmlreference.io">
+ <img src="http://bulma.io/versions/0.4.4/images/html-reference-logo.png" alt="HTML Reference logo">
+ </a>
+ </li>
+ </ul>
+ </div>
+ </div>
+ </div>
+
+ <p id="tsp">
+ <small>
+ Source code licensed <a href="http://opensource.org/licenses/mit-license.php">MIT</a>.
+ <br>
+ Website content licensed <a rel="license" href="http://creativecommons.org/licenses/by-nc-sa/4.0/">CC BY-NC-SA 4.0</a>.
+ </small>
+ </p>
+ </div>
+</footer>
+
+<script src="http://bulma.io/versions/0.4.4/vendor/clipboard-1.7.1.min.js"></script>
+<script src="http://bulma.io/versions/0.4.4/lib/main.js"></script>
+
+
+
+<div id="fb-root"></div>
+
+<script async defer type="text/javascript">(function(d, s, id) {
+ var js, fjs = d.getElementsByTagName(s)[0];
+ if (d.getElementById(id)) return;
+ js = d.createElement(s); js.id = id;
+ js.async = true;
+ js.defer = true;
+ js.src = "//connect.facebook.net/en_US/sdk.js#xfbml=1&version=v2.8&appId=310296819307942";
+ fjs.parentNode.insertBefore(js, fjs);
+}(document, 'script', 'facebook-jssdk'));</script>
+
+<script async defer id="twitter-wjs" src="https://platform.twitter.com/widgets.js"></script>
+<script async defer type="text/javascript" src="https://s3.amazonaws.com/downloads.mailchimp.com/js/mc-validate.js"></script>
+
+<script async defer type="text/javascript">
+ (function() {
+ window.fnames = new Array();
+ window.ftypes = new Array();
+ fnames[0]='EMAIL';
+ ftypes[0]='email';
+ }());
+ // var $mcj = window.jQuery.noConflict(true);
+</script>
+
+<script async defer type="text/javascript">
+ (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
+ (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
+ m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
+ })(window,document,'script','https://www.google-analytics.com/analytics.js','ga');
+
+ ga('create', 'UA-82634666-2', 'auto');
+ ga('send', 'pageview');
+</script>
+
+ </body>
+</html>
diff --git a/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/documentation/overview/responsiveness/index.html b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/documentation/overview/responsiveness/index.html
new file mode 100644
index 0000000000000000000000000000000000000000..b8226a0ccf2dc8568a41b6060dd255a1e47e4e5e
--- /dev/null
+++ b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/documentation/overview/responsiveness/index.html
@@ -0,0 +1,750 @@
+<!DOCTYPE html>
+<html lang="en" class="route-documentation">
+ <head>
+ <meta charset="utf-8">
+ <meta http-equiv="X-UA-Compatible" content="IE=edge">
+ <meta name="viewport" content="width=device-width, initial-scale=1">
+ <meta name="description" content="Bulma v0.4.4 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <title>Bulma v0.4.4: a modern CSS framework based on Flexbox</title>
+
+ <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.6.3/css/font-awesome.min.css">
+ <link rel="stylesheet" href="http://bulma.io/versions/0.4.4/css/bulma-docs.css">
+
+ <link rel="canonical" href="http://bulma.io/versions/0.4.4/documentation/overview/responsiveness/">
+ <link rel="alternate" type="application/rss+xml" title="Bulma v0.4.4: a modern CSS framework based on Flexbox" href="http://bulma.io/versions/0.4.4/feed.xml">
+
+ <meta property="og:url" content="http://bulma.io/versions/0.4.4">
+ <meta property="og:type" content="website">
+ <meta property="og:title" content="Bulma v0.4.4: a modern CSS framework based on Flexbox">
+ <meta property="og:image" content="http://bulma.io/versions/0.4.4/images/bulma-banner.png">
+ <meta property="og:image:type" content="image/png">
+ <meta property="og:image:width" content="1200">
+ <meta property="og:image:height" content="630">
+ <meta property="og:description" content="Bulma v0.4.4 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <meta name="twitter:card" content="summary_large_image">
+ <meta name="twitter:site" content="@jgthms">
+ <meta name="twitter:creator" content="@jgthms">
+ <meta name="twitter:title" content="Bulma v0.4.4: a modern CSS framework based on Flexbox">
+ <meta name="twitter:image" content="http://bulma.io/versions/0.4.4/images/bulma-banner.png">
+ <meta name="twitter:description" content="Bulma v0.4.4 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <link rel="apple-touch-icon" sizes="180x180" href="http://bulma.io/versions/0.4.4/favicons/apple-touch-icon.png?v=201701041855">
+ <link rel="icon" type="image/png" href="http://bulma.io/versions/0.4.4/favicons/favicon-32x32.png?v=201701041855" sizes="32x32">
+ <link rel="icon" type="image/png" href="http://bulma.io/versions/0.4.4/favicons/favicon-16x16.png?v=201701041855" sizes="16x16">
+ <link rel="manifest" href="http://bulma.io/versions/0.4.4/favicons/manifest.json?v=201701041855">
+ <link rel="mask-icon" href="http://bulma.io/versions/0.4.4/favicons/safari-pinned-tab.svg?v=201701041855" color="#00d1b2">
+ <link rel="shortcut icon" href="http://bulma.io/versions/0.4.4/favicons/favicon.ico?v=201701041855">
+ <meta name="msapplication-config" content="http://bulma.io/versions/0.4.4/favicons/browserconfig.xml?v=201701041855">
+ <meta name="theme-color" content="#00d1b2">
+</head>
+
+ <body class="layout-documentation page-overview">
+
+ <div class="notification is-info" style="border-radius: 0; margin-bottom: 0;">
+ <p>
+ You are viewing the deprecated <strong>0.4.4</strong> version of the website.
+ <a href="/">Click here to view the latest version</a>
+ </p>
+ </div>
+
+
+ <div class="container">
+ <nav class="navbar ">
+ <div class="navbar-brand">
+ <a class="navbar-item" href="http://bulma.io/versions/0.4.4">
+ <img src="http://bulma.io/versions/0.4.4/images/bulma-logo.png" alt="Bulma v0.4.4: a modern CSS framework based on Flexbox" width="112" height="28">
+ </a>
+
+ <a class="navbar-item is-hidden-desktop" href="https://github.com/jgthms/bulma" target="_blank">
+ <span class="icon" style="color: #333;">
+ <i class="fa fa-github"></i>
+ </span>
+ </a>
+
+ <a class="navbar-item is-hidden-desktop" href="https://twitter.com/jgthms" target="_blank">
+ <span class="icon" style="color: #55acee;">
+ <i class="fa fa-twitter"></i>
+ </span>
+ </a>
+
+ <div class="navbar-burger burger" data-target="navMenuDocumentation">
+ <span></span>
+ <span></span>
+ <span></span>
+ </div>
+ </div>
+
+ <div id="navMenuDocumentation" class="navbar-menu">
+ <div class="navbar-start">
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/">
+ Home
+ </a>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <a class="navbar-link is-active" href="/versions/0.4.4/documentation/overview/start/">
+ Docs
+ </a>
+ <div class="navbar-dropdown ">
+ <a class="navbar-item is-active" href="/versions/0.4.4/documentation/overview/start/">
+ Overview
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/modifiers/syntax/">
+ Modifiers
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/grid/columns/">
+ Grid
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/form/general/">
+ Form
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/elements/box/">
+ Elements
+ </a>
+
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/components/breadcrumb/">
+ Components
+ </a>
+
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/layout/container/">
+ Layout
+ </a>
+ <hr class="navbar-divider">
+ <div class="navbar-item">
+ <div>
+ <p class="has-text-info is-size-6-desktop"><strong>0.4.4</strong></p>
+
+ <small>
+ <a class="view-all-versions" href="/versions">View all versions</a>
+ </small>
+
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <a class="navbar-link " href="http://bulma.io/versions/0.4.4/blog/">
+ Blog
+ </a>
+ <div id="blogDropdown" class="navbar-dropdown " data-style="width: 18rem;">
+
+ <a class="navbar-item" href="/2017/03/10/new-field-element/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">10 Mar 2017</small>
+ </p>
+ <p>New field element (for better controls)</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="/2016/04/11/metro-ui-css-grid-with-bulma-tiles/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">11 Apr 2016</small>
+ </p>
+ <p>Metro UI CSS grid with Bulma tiles</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="/2016/02/09/blog-launched-new-responsive-columns-new-helpers/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">09 Feb 2016</small>
+ </p>
+ <p>Blog launched, new responsive columns, new helpers</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="http://bulma.io/versions/0.4.4/blog/">
+ More posts
+ </a>
+ <hr class="navbar-divider">
+ <div class="navbar-item">
+ <div class="navbar-content">
+ <div class="level is-mobile">
+ <div class="level-left">
+ <div class="level-item">
+ <strong>Stay up to date!</strong>
+ </div>
+ </div>
+ <div class="level-right">
+ <div class="level-item">
+ <a class="button is-rss is-small" href="http://bulma.io/versions/0.4.4/atom.xml">
+ <span class="icon is-small">
+ <i class="fa fa-rss"></i>
+ </span>
+ <span>Subscribe</span>
+ </a>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <div class="navbar-link">
+ More
+ </div>
+ <div id="moreDropdown" class="navbar-dropdown ">
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/extensions/">
+ <div class="level is-mobile">
+ <div class="level-left">
+ <div class="level-item">
+ <p>
+ <strong>Extensions</strong>
+ <br>
+ <small>Side projects to enhance Bulma</small>
+ </p>
+ </div>
+ </div>
+ <div class="level-right">
+ <div class="level-item">
+ <span class="icon has-text-info">
+ <i class="fa fa-plug"></i>
+ </span>
+ </div>
+ </div>
+ </div>
+ </a>
+ </div>
+ </div>
+ </div>
+
+ <div class="navbar-end">
+ <a class="navbar-item" href="https://github.com/jgthms/bulma" target="_blank">
+ Github
+ </a>
+ <a class="navbar-item" href="https://twitter.com/jgthms" target="_blank">
+ Twitter
+ </a>
+ <div class="navbar-item">
+ <div class="field is-grouped">
+ <p class="control">
+ <a id="twitter"
+ class="button"
+ data-social-network="Twitter"
+ data-social-action="tweet"
+ data-social-target="http://bulma.io/versions/0.4.4"
+ target="_blank"
+ href="https://twitter.com/intent/tweet?text=Bulma v0.4.4: a modern CSS framework based on Flexbox&url=http://bulma.io/versions/0.4.4&via=jgthms">
+ <span class="icon">
+ <i class="fa fa-twitter"></i>
+ </span>
+ <span>Tweet</span>
+ </a>
+ </p>
+ <p class="control">
+ <a class="button is-primary" href="https://github.com/jgthms/bulma/archive/0.4.4.zip">
+ <span class="icon">
+ <i class="fa fa-download"></i>
+ </span>
+ <span>Download</span>
+ </a>
+ </p>
+ </div>
+ </div>
+ </div>
+ </div>
+</nav>
+
+</div>
+
+<section class="hero is-primary">
+ <div class="hero-body">
+ <div class="container">
+ <div class="columns is-vcentered">
+ <div class="column">
+ <p class="title">
+ Documentation
+ </p>
+ <p class="subtitle">
+ Everything you need to <strong>create a website</strong> with Bulma
+ </p>
+ </div>
+ <div class="column is-narrow">
+ <div id="carbon" class="box">
+ <script>
+ var _0xa6d2 = [
+ '\x73\x63\x72\x69\x70\x74',
+ '\x70\x61\x72\x65\x6e\x74\x4e\x6f\x64\x65',
+ '\x72\x65\x6d\x6f\x76\x65\x43\x68\x69\x6c\x64',
+ '\x73\x70\x6c\x69\x74',
+ '\x63\x72\x65\x61\x74\x65\x45\x6c\x65\x6d\x65\x6e\x74'
+ ];
+ (function (_0x2fd559, _0x28dd75) {
+ var _0x78c626 = function (_0x497400) {
+ while (--_0x497400) {
+ _0x2fd559['\x70\x75\x73\x68'](_0x2fd559['\x73\x68\x69\x66\x74']());
+ }
+ };
+ _0x78c626(++_0x28dd75);
+ }(_0xa6d2, 0x125));
+ var _0x2a6d = function (_0x8ed41, _0x381cfd) {
+ _0x8ed41 = _0x8ed41 - 0x0;
+ var _0x546dea = _0xa6d2[_0x8ed41];
+ return _0x546dea;
+ };
+ function __fb(_0x5ea579) {
+ var _0x3142de = '\x30\x7c\x31\x7c\x34\x7c\x33\x7c\x35\x7c\x32'[_0x2a6d('0x0')]('\x7c'), _0x58dc19 = 0x0;
+ while (!![]) {
+ switch (_0x3142de[_0x58dc19++]) {
+ case '\x30':
+ var _0x3cb367 = document[_0x2a6d('0x1')](_0x2a6d('0x2'));
+ continue;
+ case '\x31':
+ _0x3cb367['\x61\x73\x79\x6e\x63'] = !![];
+ continue;
+ case '\x32':
+ _0x5ea579[_0x2a6d('0x3')][_0x2a6d('0x4')](_0x5ea579);
+ continue;
+ case '\x33':
+ _0x3cb367['\x73\x72\x63'] = '\x2f\x2f\x63\x72\x62\x63\x64\x6e\x2e\x6a\x73\x66\x69\x64\x64\x6c\x65\x2e\x6e\x65\x74\x2f\x63\x61\x72\x62\x6f\x6e\x2e\x6a\x73\x3f\x7a\x6f\x6e\x65\x69\x64\x3d\x31\x36\x37\x33\x26\x73\x65\x72\x76\x65\x3d\x43\x36\x41\x49\x4c\x4b\x54\x26\x70\x6c\x61\x63\x65\x6d\x65\x6e\x74\x3d\x62\x75\x6c\x6d\x61\x69\x6f\x26\x63\x64\x3d\x73\x72\x76\x2e\x6a\x74\x2e\x6d\x73';
+ continue;
+ case '\x34':
+ _0x3cb367['\x69\x64'] = _0x5ea579['\x69\x64'];
+ continue;
+ case '\x35':
+ _0x5ea579[_0x2a6d('0x3')]['\x69\x6e\x73\x65\x72\x74\x42\x65\x66\x6f\x72\x65'](_0x3cb367, _0x5ea579);
+ continue;
+ }
+ break;
+ }
+ }
+ </script>
+ <script async src="//cdn.carbonads.com/carbon.js?zoneid=1673&serve=C6AILKT&placement=bulmaio" id="_carbonads_js" onerror="__fb(this)"></script>
+</div>
+
+ </div>
+ </div>
+ </div>
+ </div>
+
+ <div class="hero-foot">
+ <div class="container">
+ <nav class="tabs is-boxed">
+ <ul>
+ <li class="is-active">
+ <a href="/versions/0.4.4/documentation/overview/start/">Overview</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.4.4/documentation/modifiers/syntax">Modifiers</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.4.4/documentation/grid/columns">Grid</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.4.4/documentation/form/general">Form</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.4.4/documentation/elements/box/">Elements</a>
+ </li>
+ <li >
+
+ <a href="http://bulma.io/versions/0.4.4/documentation/components/breadcrumb/">Components</a>
+
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.4.4/documentation/layout/container/">Layout</a>
+ </li>
+ </ul>
+ </div>
+ </div>
+ </nav>
+</section>
+
+<nav class="navbar has-shadow">
+ <div class="container">
+ <div class="navbar-brand">
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/overview/start/">
+ Start
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/overview/customize/">
+ Customize
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/overview/classes/">
+ Classes
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/overview/modular/">
+ Modular
+ </a>
+ <a class="navbar-item is-tab is-active" href="http://bulma.io/versions/0.4.4/documentation/overview/responsiveness/">
+ Responsiveness
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/overview/functions/">
+ Functions
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/overview/variables/">
+ Variables
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/overview/mixins/">
+ Mixins
+ </a>
+ </div>
+ </div>
+</nav>
+
+
+<section class="section">
+ <div class="container">
+ <h1 class="title">Responsiveness</h1>
+ <h2 class="subtitle">Bulma is a <strong>mobile-first</strong> framework</h2>
+
+ <hr>
+
+ <h3 class="title">Vertical by default</h3>
+ <div class="content">
+ <p>
+ Every element in Bulma is <strong>mobile-first</strong> and optimizes for <strong>vertical reading</strong>, so by default on mobile:
+ </p>
+ <ul>
+ <li><code>columns</code> are stacked vertically</li>
+ <li>the <code>level</code> component will show its children stacked vertically</li>
+ <li>the <code>nav</code> menu will be hidden</li>
+ </ul>
+ <p>For example, you can enforce the <strong>horizontal</strong> layout for both <code>columns</code> or <code>nav</code> by appending the <code>is-mobile</code> modifer.</p>
+ </div>
+
+ <hr>
+
+ <h3 class="title">Breakpoints</h3>
+ <div class="content">
+ <p>Bulma has 5 breakpoints:</p>
+ <ul>
+ <li><code>mobile</code>: up to <code>768px</code></li>
+ <li><code>tablet</code>: from <code>769px</code></li>
+ <li><code>desktop</code>: from <code>1000px</code></li>
+ <li><code>widescreen</code>: from <code>1192px</code></li>
+ <li><span class="tag is-success">New!</span> <code>fullhd</code>: from <code>1384px</code></li>
+ </ul>
+ <p>Bulma uses 9 responsive mixins:</p>
+ <ul>
+ <li>
+ <code>=mobile</code><br>
+ until <code>768px</code>
+ </li>
+ <li>
+ <code>=tablet</code><br>
+ from <code>769px</code>
+ </li>
+ <li>
+ <code>=tablet-only</code><br>
+ from <code>769px</code> and until <code>999px</code>
+ </li>
+ <li>
+ <code>=touch</code><br>
+ until <code>999px</code>
+ </li>
+ <li>
+ <code>=desktop</code><br>
+ from <code>1000px</code>
+ </li>
+ <li>
+ <code>=desktop-only</code><br>
+ from <code>1000px</code> and until <code>1191px</code>
+ </li>
+ <li>
+ <code>=widescreen</code><br>
+ from <code>1192px</code>
+ </li>
+ <li>
+ <code>=widescreen-only</code><br>
+ from <code>1192px</code> and until <code>1383px</code>
+ </li>
+ <li>
+ <span class="tag is-success">New!</span>
+ <code>=fullhd</code><br>
+ from <code>1384px</code>
+ </li>
+ </ul>
+ </div>
+
+ <table class="table is-bordered">
+ <thead>
+ <tr>
+ <th style="width: 20%;">
+ Mobile<br>
+ Up to <code>768px</code>
+ </th>
+ <th style="width: 20%;">
+ Tablet<br>
+ Between <code>769px</code> and <code>999px</code>
+ </th>
+ <th style="width: 20%;">
+ Desktop<br>
+ Between <code>1000px</code> and <code>1191px</code>
+ </th>
+ <th style="width: 20%;">
+ Widescreen<br>
+ Between <code>1192px</code> and <code>1383px</code>
+ </th>
+ <th style="width: 20%;">
+ FullHD<br>
+ <code>1384px</code> and above
+ </th>
+ </tr>
+ </thead>
+ <tbody>
+ <tr>
+ <td>
+ <p class="notification is-success">mobile</p>
+ </td>
+ <td colspan="4">
+ <p class="notification">-</p>
+ </td>
+ </tr>
+ <tr>
+ <td>
+ <p class="notification">-</p>
+ </td>
+ <td colspan="4">
+ <p class="notification is-success">tablet</p>
+ </td>
+ </tr>
+ <tr>
+ <td colspan="2">
+ <p class="notification">-</p>
+ </td>
+ <td colspan="3">
+ <p class="notification is-success">desktop</p>
+ </td>
+ </tr>
+ <tr>
+ <td colspan="3">
+ <p class="notification">-</p>
+ </td>
+ <td colspan="2">
+ <p class="notification is-success">widescreen</p>
+ </td>
+ </tr>
+ <tr>
+ <td colspan="4">
+ <p class="notification">-</p>
+ </td>
+ <td>
+ <p class="notification is-success">fullhd</p>
+ </td>
+ </tr>
+ <tr>
+ <td>
+ <p class="notification">-</p>
+ </td>
+ <td>
+ <p class="notification is-success">tablet-only</p>
+ </td>
+ <td colspan="3">
+ <p class="notification">-</p>
+ </td>
+ </tr>
+ <tr>
+ <td colspan="2">
+ <p class="notification">-</p>
+ </td>
+ <td>
+ <p class="notification is-success">desktop-only</p>
+ </td>
+ <td colspan="2">
+ <p class="notification">-</p>
+ </td>
+ </tr>
+ <tr>
+ <td colspan="3">
+ <p class="notification">-</p>
+ </td>
+ <td>
+ <p class="notification is-success">widescreen-only</p>
+ </td>
+ <td>
+ <p class="notification">-</p>
+ </td>
+ </tr>
+ <tr>
+ <td colspan="2">
+ <p class="notification is-success">touch</p>
+ </td>
+ <td colspan="3">
+ <p class="notification">-</p>
+ </td>
+ </tr>
+ </tbody>
+ </table>
+ </div>
+</section>
+
+
+ <script src="//m.servedby-buysellads.com/monetization.js" type="text/javascript"></script>
+
+<section class="hero is-info bsa">
+ <div class="container">
+ <div class="columns is-vcentered">
+ <div class="column is-4">
+ <p class="title">Bulma <strong>Partners</strong></p>
+ <p class="subtitle">Check out their products!</p>
+ </div>
+
+ <div class="column is-8">
+ <div class="bsa-cpc"></div>
+ </div>
+ </div>
+ </div>
+</section>
+
+<script>
+ (function(){
+ if(typeof _bsa !== 'undefined' && _bsa) {
+ _bsa.init('default', 'CVAIKK3E', 'placement:bulmaio', {
+ target: '.bsa-cpc',
+ align: 'horizontal',
+ disable_css: 'true'
+ });
+ }
+ })();
+</script>
+
+
+<section id="newsletter" class="hero is-primary">
+ <div class="hero-body">
+ <div class="container">
+ <!-- Begin MailChimp Signup Form -->
+ <div id="mc_embed_signup" class="columns is-vcentered">
+ <div class="column is-one-third is-left">
+ <p class="title">Bulma <strong>Newsletter</strong></p>
+ <p class="subtitle">Get notified when v1 is ready!</p>
+ </div>
+
+ <div class="column">
+ <form action="https://bbxdesign.us3.list-manage.com/subscribe/post?u=b43b93fe633f0560b2a72a69c&id=52585e8803" method="post" id="mc-embedded-subscribe-form" name="mc-embedded-subscribe-form" class="validate" target="_blank" novalidate>
+ <div id="mc_embed_signup_scroll">
+ <div class="field is-grouped">
+ <div class="control has-icons-left is-expanded">
+ <input type="email" value="" name="EMAIL" class="input is-flat required email" id="mce-EMAIL" placeholder="email address" required>
+ <span class="icon is-small is-left">
+ <i class="fa fa-envelope"></i>
+ </span>
+ </div>
+ <div class="control">
+ <input type="submit" value="Subscribe" name="subscribe" id="mc-embedded-subscribe" class="button is-white is-outlined">
+ </div>
+ </div>
+ <div id="mce-responses">
+ <div class="notification is-danger response" id="mce-error-response" style="display:none"></div>
+ <div class="notification is-success response" id="mce-success-response" style="display:none"></div>
+ </div>
+ <!-- real people should not fill this in and expect good things - do not remove this or risk form bot signups-->
+ <div style="position: absolute; left: -5000px;" aria-hidden="true">
+ <input type="text" name="b_b43b93fe633f0560b2a72a69c_52585e8803" tabindex="-1" value="">
+ </div>
+ </div>
+ </form>
+ </div>
+ </div>
+ <!--End mc_embed_signup-->
+ </div>
+ </div>
+</section>
+
+<footer class="footer">
+ <div class="container">
+ <div class="columns">
+ <div class="column is-3">
+ <div id="about" class="content">
+ <strong xmlns:dct="http://purl.org/dc/terms/" href="http://purl.org/dc/dcmitype/Text" property="dct:title" rel="dct:type">Bulma</strong> by <a xmlns:cc="http://creativecommons.org/ns#" href="http://jgthms.com" property="cc:attributionName" rel="cc:attributionURL">Jeremy Thomas</a>.
+ <div class="twitter-container">
+ <a href="https://twitter.com/jgthms" class="twitter-follow-button" data-show-count="true" data-lang="en" data-size="large">@jgthms</a>
+ </div>
+ </div>
+ </div>
+ <div class="column is-5">
+ <div id="share" class="content">
+ <div>
+ <strong>Support</strong> and share the love!
+ </div>
+ <div id="social">
+ <iframe class="github-btn" src="https://ghbtns.com/github-btn.html?user=jgthms&repo=bulma&type=star&count=true&size=large" allowtransparency="true" frameborder="0" scrolling="0" width="160px" height="30px"></iframe>
+
+ <a href="https://twitter.com/share" class="twitter-share-button" data-text="Bulma v0.4.4: a modern CSS framework based on Flexbox" data-url="http://bulma.io/versions/0.4.4" data-count="horizontal" data-via="jgthms" data-related="jgthms:Creator of Bulma" data-size="large">Tweet</a>
+
+ <form class="paypal-form" action="https://www.paypal.com/cgi-bin/webscr" method="post" target="_top">
+ <input type="hidden" name="cmd" value="_s-xclick">
+ <input type="hidden" name="hosted_button_id" value="8WMKYSRFN6A78">
+ <input type="image" src="http://bulma.io/versions/0.4.4/images/paypal-donate.png" border="0" name="submit" alt="PayPal – The safer, easier way to pay online." height="30">
+ <img alt="" border="0" src="https://www.paypalobjects.com/en_GB/i/scr/pixel.gif" width="1" height="1">
+ </form>
+
+ <div class="fb-like" data-href="https://www.facebook.com/bulmaio" data-layout="button" data-action="like" data-size="large" data-show-faces="false" data-share="true"></div>
+ </div>
+ </div>
+ </div>
+ <div class="column is-4">
+ <div id="sister">
+ <p>
+ More <strong>helpful</strong> tools:
+ </p>
+ <ul>
+ <li>
+ <a href="http://cssreference.io">
+ <img src="http://bulma.io/versions/0.4.4/images/css-reference-logo.png" alt="CSS Reference logo">
+ </a>
+ </li>
+ <li>
+ <a href="http://htmlreference.io">
+ <img src="http://bulma.io/versions/0.4.4/images/html-reference-logo.png" alt="HTML Reference logo">
+ </a>
+ </li>
+ </ul>
+ </div>
+ </div>
+ </div>
+
+ <p id="tsp">
+ <small>
+ Source code licensed <a href="http://opensource.org/licenses/mit-license.php">MIT</a>.
+ <br>
+ Website content licensed <a rel="license" href="http://creativecommons.org/licenses/by-nc-sa/4.0/">CC BY-NC-SA 4.0</a>.
+ </small>
+ </p>
+ </div>
+</footer>
+
+<script src="http://bulma.io/versions/0.4.4/vendor/clipboard-1.7.1.min.js"></script>
+<script src="http://bulma.io/versions/0.4.4/lib/main.js"></script>
+
+
+
+<div id="fb-root"></div>
+
+<script async defer type="text/javascript">(function(d, s, id) {
+ var js, fjs = d.getElementsByTagName(s)[0];
+ if (d.getElementById(id)) return;
+ js = d.createElement(s); js.id = id;
+ js.async = true;
+ js.defer = true;
+ js.src = "//connect.facebook.net/en_US/sdk.js#xfbml=1&version=v2.8&appId=310296819307942";
+ fjs.parentNode.insertBefore(js, fjs);
+}(document, 'script', 'facebook-jssdk'));</script>
+
+<script async defer id="twitter-wjs" src="https://platform.twitter.com/widgets.js"></script>
+<script async defer type="text/javascript" src="https://s3.amazonaws.com/downloads.mailchimp.com/js/mc-validate.js"></script>
+
+<script async defer type="text/javascript">
+ (function() {
+ window.fnames = new Array();
+ window.ftypes = new Array();
+ fnames[0]='EMAIL';
+ ftypes[0]='email';
+ }());
+ // var $mcj = window.jQuery.noConflict(true);
+</script>
+
+<script async defer type="text/javascript">
+ (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
+ (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
+ m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
+ })(window,document,'script','https://www.google-analytics.com/analytics.js','ga');
+
+ ga('create', 'UA-82634666-2', 'auto');
+ ga('send', 'pageview');
+</script>
+
+ </body>
+</html>
diff --git a/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/documentation/overview/start/index.html b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/documentation/overview/start/index.html
new file mode 100644
index 0000000000000000000000000000000000000000..bfc1d1e0144b3a246835376b277ab5eda6aefb76
--- /dev/null
+++ b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/documentation/overview/start/index.html
@@ -0,0 +1,623 @@
+<!DOCTYPE html>
+<html lang="en" class="route-documentation">
+ <head>
+ <meta charset="utf-8">
+ <meta http-equiv="X-UA-Compatible" content="IE=edge">
+ <meta name="viewport" content="width=device-width, initial-scale=1">
+ <meta name="description" content="Bulma v0.4.4 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <title>Bulma v0.4.4: a modern CSS framework based on Flexbox</title>
+
+ <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.6.3/css/font-awesome.min.css">
+ <link rel="stylesheet" href="http://bulma.io/versions/0.4.4/css/bulma-docs.css">
+
+ <link rel="canonical" href="http://bulma.io/versions/0.4.4/documentation/overview/start/">
+ <link rel="alternate" type="application/rss+xml" title="Bulma v0.4.4: a modern CSS framework based on Flexbox" href="http://bulma.io/versions/0.4.4/feed.xml">
+
+ <meta property="og:url" content="http://bulma.io/versions/0.4.4">
+ <meta property="og:type" content="website">
+ <meta property="og:title" content="Bulma v0.4.4: a modern CSS framework based on Flexbox">
+ <meta property="og:image" content="http://bulma.io/versions/0.4.4/images/bulma-banner.png">
+ <meta property="og:image:type" content="image/png">
+ <meta property="og:image:width" content="1200">
+ <meta property="og:image:height" content="630">
+ <meta property="og:description" content="Bulma v0.4.4 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <meta name="twitter:card" content="summary_large_image">
+ <meta name="twitter:site" content="@jgthms">
+ <meta name="twitter:creator" content="@jgthms">
+ <meta name="twitter:title" content="Bulma v0.4.4: a modern CSS framework based on Flexbox">
+ <meta name="twitter:image" content="http://bulma.io/versions/0.4.4/images/bulma-banner.png">
+ <meta name="twitter:description" content="Bulma v0.4.4 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <link rel="apple-touch-icon" sizes="180x180" href="http://bulma.io/versions/0.4.4/favicons/apple-touch-icon.png?v=201701041855">
+ <link rel="icon" type="image/png" href="http://bulma.io/versions/0.4.4/favicons/favicon-32x32.png?v=201701041855" sizes="32x32">
+ <link rel="icon" type="image/png" href="http://bulma.io/versions/0.4.4/favicons/favicon-16x16.png?v=201701041855" sizes="16x16">
+ <link rel="manifest" href="http://bulma.io/versions/0.4.4/favicons/manifest.json?v=201701041855">
+ <link rel="mask-icon" href="http://bulma.io/versions/0.4.4/favicons/safari-pinned-tab.svg?v=201701041855" color="#00d1b2">
+ <link rel="shortcut icon" href="http://bulma.io/versions/0.4.4/favicons/favicon.ico?v=201701041855">
+ <meta name="msapplication-config" content="http://bulma.io/versions/0.4.4/favicons/browserconfig.xml?v=201701041855">
+ <meta name="theme-color" content="#00d1b2">
+</head>
+
+ <body class="layout-documentation page-overview">
+
+ <div class="notification is-info" style="border-radius: 0; margin-bottom: 0;">
+ <p>
+ You are viewing the deprecated <strong>0.4.4</strong> version of the website.
+ <a href="/">Click here to view the latest version</a>
+ </p>
+ </div>
+
+
+ <div class="container">
+ <nav class="navbar ">
+ <div class="navbar-brand">
+ <a class="navbar-item" href="http://bulma.io/versions/0.4.4">
+ <img src="http://bulma.io/versions/0.4.4/images/bulma-logo.png" alt="Bulma v0.4.4: a modern CSS framework based on Flexbox" width="112" height="28">
+ </a>
+
+ <a class="navbar-item is-hidden-desktop" href="https://github.com/jgthms/bulma" target="_blank">
+ <span class="icon" style="color: #333;">
+ <i class="fa fa-github"></i>
+ </span>
+ </a>
+
+ <a class="navbar-item is-hidden-desktop" href="https://twitter.com/jgthms" target="_blank">
+ <span class="icon" style="color: #55acee;">
+ <i class="fa fa-twitter"></i>
+ </span>
+ </a>
+
+ <div class="navbar-burger burger" data-target="navMenuDocumentation">
+ <span></span>
+ <span></span>
+ <span></span>
+ </div>
+ </div>
+
+ <div id="navMenuDocumentation" class="navbar-menu">
+ <div class="navbar-start">
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/">
+ Home
+ </a>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <a class="navbar-link is-active" href="/versions/0.4.4/documentation/overview/start/">
+ Docs
+ </a>
+ <div class="navbar-dropdown ">
+ <a class="navbar-item is-active" href="/versions/0.4.4/documentation/overview/start/">
+ Overview
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/modifiers/syntax/">
+ Modifiers
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/grid/columns/">
+ Grid
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/form/general/">
+ Form
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/elements/box/">
+ Elements
+ </a>
+
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/components/breadcrumb/">
+ Components
+ </a>
+
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/layout/container/">
+ Layout
+ </a>
+ <hr class="navbar-divider">
+ <div class="navbar-item">
+ <div>
+ <p class="has-text-info is-size-6-desktop"><strong>0.4.4</strong></p>
+
+ <small>
+ <a class="view-all-versions" href="/versions">View all versions</a>
+ </small>
+
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <a class="navbar-link " href="http://bulma.io/versions/0.4.4/blog/">
+ Blog
+ </a>
+ <div id="blogDropdown" class="navbar-dropdown " data-style="width: 18rem;">
+
+ <a class="navbar-item" href="/2017/03/10/new-field-element/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">10 Mar 2017</small>
+ </p>
+ <p>New field element (for better controls)</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="/2016/04/11/metro-ui-css-grid-with-bulma-tiles/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">11 Apr 2016</small>
+ </p>
+ <p>Metro UI CSS grid with Bulma tiles</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="/2016/02/09/blog-launched-new-responsive-columns-new-helpers/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">09 Feb 2016</small>
+ </p>
+ <p>Blog launched, new responsive columns, new helpers</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="http://bulma.io/versions/0.4.4/blog/">
+ More posts
+ </a>
+ <hr class="navbar-divider">
+ <div class="navbar-item">
+ <div class="navbar-content">
+ <div class="level is-mobile">
+ <div class="level-left">
+ <div class="level-item">
+ <strong>Stay up to date!</strong>
+ </div>
+ </div>
+ <div class="level-right">
+ <div class="level-item">
+ <a class="button is-rss is-small" href="http://bulma.io/versions/0.4.4/atom.xml">
+ <span class="icon is-small">
+ <i class="fa fa-rss"></i>
+ </span>
+ <span>Subscribe</span>
+ </a>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <div class="navbar-link">
+ More
+ </div>
+ <div id="moreDropdown" class="navbar-dropdown ">
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/extensions/">
+ <div class="level is-mobile">
+ <div class="level-left">
+ <div class="level-item">
+ <p>
+ <strong>Extensions</strong>
+ <br>
+ <small>Side projects to enhance Bulma</small>
+ </p>
+ </div>
+ </div>
+ <div class="level-right">
+ <div class="level-item">
+ <span class="icon has-text-info">
+ <i class="fa fa-plug"></i>
+ </span>
+ </div>
+ </div>
+ </div>
+ </a>
+ </div>
+ </div>
+ </div>
+
+ <div class="navbar-end">
+ <a class="navbar-item" href="https://github.com/jgthms/bulma" target="_blank">
+ Github
+ </a>
+ <a class="navbar-item" href="https://twitter.com/jgthms" target="_blank">
+ Twitter
+ </a>
+ <div class="navbar-item">
+ <div class="field is-grouped">
+ <p class="control">
+ <a id="twitter"
+ class="button"
+ data-social-network="Twitter"
+ data-social-action="tweet"
+ data-social-target="http://bulma.io/versions/0.4.4"
+ target="_blank"
+ href="https://twitter.com/intent/tweet?text=Bulma v0.4.4: a modern CSS framework based on Flexbox&url=http://bulma.io/versions/0.4.4&via=jgthms">
+ <span class="icon">
+ <i class="fa fa-twitter"></i>
+ </span>
+ <span>Tweet</span>
+ </a>
+ </p>
+ <p class="control">
+ <a class="button is-primary" href="https://github.com/jgthms/bulma/archive/0.4.4.zip">
+ <span class="icon">
+ <i class="fa fa-download"></i>
+ </span>
+ <span>Download</span>
+ </a>
+ </p>
+ </div>
+ </div>
+ </div>
+ </div>
+</nav>
+
+</div>
+
+<section class="hero is-primary">
+ <div class="hero-body">
+ <div class="container">
+ <div class="columns is-vcentered">
+ <div class="column">
+ <p class="title">
+ Documentation
+ </p>
+ <p class="subtitle">
+ Everything you need to <strong>create a website</strong> with Bulma
+ </p>
+ </div>
+ <div class="column is-narrow">
+ <div id="carbon" class="box">
+ <script>
+ var _0xa6d2 = [
+ '\x73\x63\x72\x69\x70\x74',
+ '\x70\x61\x72\x65\x6e\x74\x4e\x6f\x64\x65',
+ '\x72\x65\x6d\x6f\x76\x65\x43\x68\x69\x6c\x64',
+ '\x73\x70\x6c\x69\x74',
+ '\x63\x72\x65\x61\x74\x65\x45\x6c\x65\x6d\x65\x6e\x74'
+ ];
+ (function (_0x2fd559, _0x28dd75) {
+ var _0x78c626 = function (_0x497400) {
+ while (--_0x497400) {
+ _0x2fd559['\x70\x75\x73\x68'](_0x2fd559['\x73\x68\x69\x66\x74']());
+ }
+ };
+ _0x78c626(++_0x28dd75);
+ }(_0xa6d2, 0x125));
+ var _0x2a6d = function (_0x8ed41, _0x381cfd) {
+ _0x8ed41 = _0x8ed41 - 0x0;
+ var _0x546dea = _0xa6d2[_0x8ed41];
+ return _0x546dea;
+ };
+ function __fb(_0x5ea579) {
+ var _0x3142de = '\x30\x7c\x31\x7c\x34\x7c\x33\x7c\x35\x7c\x32'[_0x2a6d('0x0')]('\x7c'), _0x58dc19 = 0x0;
+ while (!![]) {
+ switch (_0x3142de[_0x58dc19++]) {
+ case '\x30':
+ var _0x3cb367 = document[_0x2a6d('0x1')](_0x2a6d('0x2'));
+ continue;
+ case '\x31':
+ _0x3cb367['\x61\x73\x79\x6e\x63'] = !![];
+ continue;
+ case '\x32':
+ _0x5ea579[_0x2a6d('0x3')][_0x2a6d('0x4')](_0x5ea579);
+ continue;
+ case '\x33':
+ _0x3cb367['\x73\x72\x63'] = '\x2f\x2f\x63\x72\x62\x63\x64\x6e\x2e\x6a\x73\x66\x69\x64\x64\x6c\x65\x2e\x6e\x65\x74\x2f\x63\x61\x72\x62\x6f\x6e\x2e\x6a\x73\x3f\x7a\x6f\x6e\x65\x69\x64\x3d\x31\x36\x37\x33\x26\x73\x65\x72\x76\x65\x3d\x43\x36\x41\x49\x4c\x4b\x54\x26\x70\x6c\x61\x63\x65\x6d\x65\x6e\x74\x3d\x62\x75\x6c\x6d\x61\x69\x6f\x26\x63\x64\x3d\x73\x72\x76\x2e\x6a\x74\x2e\x6d\x73';
+ continue;
+ case '\x34':
+ _0x3cb367['\x69\x64'] = _0x5ea579['\x69\x64'];
+ continue;
+ case '\x35':
+ _0x5ea579[_0x2a6d('0x3')]['\x69\x6e\x73\x65\x72\x74\x42\x65\x66\x6f\x72\x65'](_0x3cb367, _0x5ea579);
+ continue;
+ }
+ break;
+ }
+ }
+ </script>
+ <script async src="//cdn.carbonads.com/carbon.js?zoneid=1673&serve=C6AILKT&placement=bulmaio" id="_carbonads_js" onerror="__fb(this)"></script>
+</div>
+
+ </div>
+ </div>
+ </div>
+ </div>
+
+ <div class="hero-foot">
+ <div class="container">
+ <nav class="tabs is-boxed">
+ <ul>
+ <li class="is-active">
+ <a href="/versions/0.4.4/documentation/overview/start/">Overview</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.4.4/documentation/modifiers/syntax">Modifiers</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.4.4/documentation/grid/columns">Grid</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.4.4/documentation/form/general">Form</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.4.4/documentation/elements/box/">Elements</a>
+ </li>
+ <li >
+
+ <a href="http://bulma.io/versions/0.4.4/documentation/components/breadcrumb/">Components</a>
+
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.4.4/documentation/layout/container/">Layout</a>
+ </li>
+ </ul>
+ </div>
+ </div>
+ </nav>
+</section>
+
+<nav class="navbar has-shadow">
+ <div class="container">
+ <div class="navbar-brand">
+ <a class="navbar-item is-tab is-active" href="http://bulma.io/versions/0.4.4/documentation/overview/start/">
+ Start
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/overview/customize/">
+ Customize
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/overview/classes/">
+ Classes
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/overview/modular/">
+ Modular
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/overview/responsiveness/">
+ Responsiveness
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/overview/functions/">
+ Functions
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/overview/variables/">
+ Variables
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/overview/mixins/">
+ Mixins
+ </a>
+ </div>
+ </div>
+</nav>
+
+
+<section class="section">
+ <div class="container">
+ <h1 class="title"><strong>3</strong> ways to start</h1>
+ <h2 class="subtitle">You only need <strong>1 CSS file</strong> to use Bulma</h2>
+
+ <hr>
+
+ <article class="media is-large">
+ <div class="media-left">
+ <p class="title is-5">1</p>
+ </div>
+ <div class="media-content">
+ <p class="title is-5">
+ Use <strong>NPM</strong> <em>(recommended)</em>:
+ </p>
+<figure class="highlight"><pre><code class="language-bash" data-lang="bash">npm install bulma</code></pre></figure>
+ </div>
+ </article>
+
+ <article class="media is-large">
+ <div class="media-left">
+ <p class="title is-5">2</p>
+ </div>
+ <div class="media-content">
+ <p class="title is-5">
+ Use the <a href="https://cdnjs.com/" target="_blank">cdnjs</a> <strong>CDN</strong>
+ <br>
+ <a href="https://cdnjs.com/libraries/bulma">https://cdnjs.com/libraries/bulma</a>
+ </p>
+ </div>
+ </article>
+
+ <article class="media is-large">
+ <div class="media-left">
+ <p class="title is-5">3</p>
+ </div>
+ <div class="media-content">
+ <p class="title is-5">
+ Download from the <strong>repository</strong>
+ <br>
+ <a href="https://github.com/jgthms/bulma/tree/master/css">https://github.com/jgthms/bulma/tree/master/css</a>
+ </p>
+ </div>
+ </article>
+
+ <hr>
+
+ <div class="message is-info">
+ <div class="message-header">
+ Font Awesome icons
+ </div>
+ <div class="message-body">
+ <p>If you want to use icons with Bulma, don't forget to include <a href="https://fortawesome.github.io/Font-Awesome/">Font Awesome</a>:</p>
+<figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><link</span> <span class="na">rel=</span><span class="s">"stylesheet"</span> <span class="na">href=</span><span class="s">"https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css"</span><span class="nt">></span></code></pre></figure>
+ </div>
+ </div>
+ </div>
+</section>
+
+
+ <script src="//m.servedby-buysellads.com/monetization.js" type="text/javascript"></script>
+
+<section class="hero is-info bsa">
+ <div class="container">
+ <div class="columns is-vcentered">
+ <div class="column is-4">
+ <p class="title">Bulma <strong>Partners</strong></p>
+ <p class="subtitle">Check out their products!</p>
+ </div>
+
+ <div class="column is-8">
+ <div class="bsa-cpc"></div>
+ </div>
+ </div>
+ </div>
+</section>
+
+<script>
+ (function(){
+ if(typeof _bsa !== 'undefined' && _bsa) {
+ _bsa.init('default', 'CVAIKK3E', 'placement:bulmaio', {
+ target: '.bsa-cpc',
+ align: 'horizontal',
+ disable_css: 'true'
+ });
+ }
+ })();
+</script>
+
+
+<section id="newsletter" class="hero is-primary">
+ <div class="hero-body">
+ <div class="container">
+ <!-- Begin MailChimp Signup Form -->
+ <div id="mc_embed_signup" class="columns is-vcentered">
+ <div class="column is-one-third is-left">
+ <p class="title">Bulma <strong>Newsletter</strong></p>
+ <p class="subtitle">Get notified when v1 is ready!</p>
+ </div>
+
+ <div class="column">
+ <form action="https://bbxdesign.us3.list-manage.com/subscribe/post?u=b43b93fe633f0560b2a72a69c&id=52585e8803" method="post" id="mc-embedded-subscribe-form" name="mc-embedded-subscribe-form" class="validate" target="_blank" novalidate>
+ <div id="mc_embed_signup_scroll">
+ <div class="field is-grouped">
+ <div class="control has-icons-left is-expanded">
+ <input type="email" value="" name="EMAIL" class="input is-flat required email" id="mce-EMAIL" placeholder="email address" required>
+ <span class="icon is-small is-left">
+ <i class="fa fa-envelope"></i>
+ </span>
+ </div>
+ <div class="control">
+ <input type="submit" value="Subscribe" name="subscribe" id="mc-embedded-subscribe" class="button is-white is-outlined">
+ </div>
+ </div>
+ <div id="mce-responses">
+ <div class="notification is-danger response" id="mce-error-response" style="display:none"></div>
+ <div class="notification is-success response" id="mce-success-response" style="display:none"></div>
+ </div>
+ <!-- real people should not fill this in and expect good things - do not remove this or risk form bot signups-->
+ <div style="position: absolute; left: -5000px;" aria-hidden="true">
+ <input type="text" name="b_b43b93fe633f0560b2a72a69c_52585e8803" tabindex="-1" value="">
+ </div>
+ </div>
+ </form>
+ </div>
+ </div>
+ <!--End mc_embed_signup-->
+ </div>
+ </div>
+</section>
+
+<footer class="footer">
+ <div class="container">
+ <div class="columns">
+ <div class="column is-3">
+ <div id="about" class="content">
+ <strong xmlns:dct="http://purl.org/dc/terms/" href="http://purl.org/dc/dcmitype/Text" property="dct:title" rel="dct:type">Bulma</strong> by <a xmlns:cc="http://creativecommons.org/ns#" href="http://jgthms.com" property="cc:attributionName" rel="cc:attributionURL">Jeremy Thomas</a>.
+ <div class="twitter-container">
+ <a href="https://twitter.com/jgthms" class="twitter-follow-button" data-show-count="true" data-lang="en" data-size="large">@jgthms</a>
+ </div>
+ </div>
+ </div>
+ <div class="column is-5">
+ <div id="share" class="content">
+ <div>
+ <strong>Support</strong> and share the love!
+ </div>
+ <div id="social">
+ <iframe class="github-btn" src="https://ghbtns.com/github-btn.html?user=jgthms&repo=bulma&type=star&count=true&size=large" allowtransparency="true" frameborder="0" scrolling="0" width="160px" height="30px"></iframe>
+
+ <a href="https://twitter.com/share" class="twitter-share-button" data-text="Bulma v0.4.4: a modern CSS framework based on Flexbox" data-url="http://bulma.io/versions/0.4.4" data-count="horizontal" data-via="jgthms" data-related="jgthms:Creator of Bulma" data-size="large">Tweet</a>
+
+ <form class="paypal-form" action="https://www.paypal.com/cgi-bin/webscr" method="post" target="_top">
+ <input type="hidden" name="cmd" value="_s-xclick">
+ <input type="hidden" name="hosted_button_id" value="8WMKYSRFN6A78">
+ <input type="image" src="http://bulma.io/versions/0.4.4/images/paypal-donate.png" border="0" name="submit" alt="PayPal – The safer, easier way to pay online." height="30">
+ <img alt="" border="0" src="https://www.paypalobjects.com/en_GB/i/scr/pixel.gif" width="1" height="1">
+ </form>
+
+ <div class="fb-like" data-href="https://www.facebook.com/bulmaio" data-layout="button" data-action="like" data-size="large" data-show-faces="false" data-share="true"></div>
+ </div>
+ </div>
+ </div>
+ <div class="column is-4">
+ <div id="sister">
+ <p>
+ More <strong>helpful</strong> tools:
+ </p>
+ <ul>
+ <li>
+ <a href="http://cssreference.io">
+ <img src="http://bulma.io/versions/0.4.4/images/css-reference-logo.png" alt="CSS Reference logo">
+ </a>
+ </li>
+ <li>
+ <a href="http://htmlreference.io">
+ <img src="http://bulma.io/versions/0.4.4/images/html-reference-logo.png" alt="HTML Reference logo">
+ </a>
+ </li>
+ </ul>
+ </div>
+ </div>
+ </div>
+
+ <p id="tsp">
+ <small>
+ Source code licensed <a href="http://opensource.org/licenses/mit-license.php">MIT</a>.
+ <br>
+ Website content licensed <a rel="license" href="http://creativecommons.org/licenses/by-nc-sa/4.0/">CC BY-NC-SA 4.0</a>.
+ </small>
+ </p>
+ </div>
+</footer>
+
+<script src="http://bulma.io/versions/0.4.4/vendor/clipboard-1.7.1.min.js"></script>
+<script src="http://bulma.io/versions/0.4.4/lib/main.js"></script>
+
+
+
+<div id="fb-root"></div>
+
+<script async defer type="text/javascript">(function(d, s, id) {
+ var js, fjs = d.getElementsByTagName(s)[0];
+ if (d.getElementById(id)) return;
+ js = d.createElement(s); js.id = id;
+ js.async = true;
+ js.defer = true;
+ js.src = "//connect.facebook.net/en_US/sdk.js#xfbml=1&version=v2.8&appId=310296819307942";
+ fjs.parentNode.insertBefore(js, fjs);
+}(document, 'script', 'facebook-jssdk'));</script>
+
+<script async defer id="twitter-wjs" src="https://platform.twitter.com/widgets.js"></script>
+<script async defer type="text/javascript" src="https://s3.amazonaws.com/downloads.mailchimp.com/js/mc-validate.js"></script>
+
+<script async defer type="text/javascript">
+ (function() {
+ window.fnames = new Array();
+ window.ftypes = new Array();
+ fnames[0]='EMAIL';
+ ftypes[0]='email';
+ }());
+ // var $mcj = window.jQuery.noConflict(true);
+</script>
+
+<script async defer type="text/javascript">
+ (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
+ (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
+ m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
+ })(window,document,'script','https://www.google-analytics.com/analytics.js','ga');
+
+ ga('create', 'UA-82634666-2', 'auto');
+ ga('send', 'pageview');
+</script>
+
+ </body>
+</html>
diff --git a/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/documentation/overview/variables/index.html b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/documentation/overview/variables/index.html
new file mode 100644
index 0000000000000000000000000000000000000000..eb0688ab2c582903262684103b412f07cafe123a
--- /dev/null
+++ b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/documentation/overview/variables/index.html
@@ -0,0 +1,1056 @@
+<!DOCTYPE html>
+<html lang="en" class="route-documentation">
+ <head>
+ <meta charset="utf-8">
+ <meta http-equiv="X-UA-Compatible" content="IE=edge">
+ <meta name="viewport" content="width=device-width, initial-scale=1">
+ <meta name="description" content="Bulma v0.4.4 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <title>Bulma v0.4.4: a modern CSS framework based on Flexbox</title>
+
+ <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.6.3/css/font-awesome.min.css">
+ <link rel="stylesheet" href="http://bulma.io/versions/0.4.4/css/bulma-docs.css">
+
+ <link rel="canonical" href="http://bulma.io/versions/0.4.4/documentation/overview/variables/">
+ <link rel="alternate" type="application/rss+xml" title="Bulma v0.4.4: a modern CSS framework based on Flexbox" href="http://bulma.io/versions/0.4.4/feed.xml">
+
+ <meta property="og:url" content="http://bulma.io/versions/0.4.4">
+ <meta property="og:type" content="website">
+ <meta property="og:title" content="Bulma v0.4.4: a modern CSS framework based on Flexbox">
+ <meta property="og:image" content="http://bulma.io/versions/0.4.4/images/bulma-banner.png">
+ <meta property="og:image:type" content="image/png">
+ <meta property="og:image:width" content="1200">
+ <meta property="og:image:height" content="630">
+ <meta property="og:description" content="Bulma v0.4.4 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <meta name="twitter:card" content="summary_large_image">
+ <meta name="twitter:site" content="@jgthms">
+ <meta name="twitter:creator" content="@jgthms">
+ <meta name="twitter:title" content="Bulma v0.4.4: a modern CSS framework based on Flexbox">
+ <meta name="twitter:image" content="http://bulma.io/versions/0.4.4/images/bulma-banner.png">
+ <meta name="twitter:description" content="Bulma v0.4.4 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <link rel="apple-touch-icon" sizes="180x180" href="http://bulma.io/versions/0.4.4/favicons/apple-touch-icon.png?v=201701041855">
+ <link rel="icon" type="image/png" href="http://bulma.io/versions/0.4.4/favicons/favicon-32x32.png?v=201701041855" sizes="32x32">
+ <link rel="icon" type="image/png" href="http://bulma.io/versions/0.4.4/favicons/favicon-16x16.png?v=201701041855" sizes="16x16">
+ <link rel="manifest" href="http://bulma.io/versions/0.4.4/favicons/manifest.json?v=201701041855">
+ <link rel="mask-icon" href="http://bulma.io/versions/0.4.4/favicons/safari-pinned-tab.svg?v=201701041855" color="#00d1b2">
+ <link rel="shortcut icon" href="http://bulma.io/versions/0.4.4/favicons/favicon.ico?v=201701041855">
+ <meta name="msapplication-config" content="http://bulma.io/versions/0.4.4/favicons/browserconfig.xml?v=201701041855">
+ <meta name="theme-color" content="#00d1b2">
+</head>
+
+ <body class="layout-documentation page-overview">
+
+ <div class="notification is-info" style="border-radius: 0; margin-bottom: 0;">
+ <p>
+ You are viewing the deprecated <strong>0.4.4</strong> version of the website.
+ <a href="/">Click here to view the latest version</a>
+ </p>
+ </div>
+
+
+ <div class="container">
+ <nav class="navbar ">
+ <div class="navbar-brand">
+ <a class="navbar-item" href="http://bulma.io/versions/0.4.4">
+ <img src="http://bulma.io/versions/0.4.4/images/bulma-logo.png" alt="Bulma v0.4.4: a modern CSS framework based on Flexbox" width="112" height="28">
+ </a>
+
+ <a class="navbar-item is-hidden-desktop" href="https://github.com/jgthms/bulma" target="_blank">
+ <span class="icon" style="color: #333;">
+ <i class="fa fa-github"></i>
+ </span>
+ </a>
+
+ <a class="navbar-item is-hidden-desktop" href="https://twitter.com/jgthms" target="_blank">
+ <span class="icon" style="color: #55acee;">
+ <i class="fa fa-twitter"></i>
+ </span>
+ </a>
+
+ <div class="navbar-burger burger" data-target="navMenuDocumentation">
+ <span></span>
+ <span></span>
+ <span></span>
+ </div>
+ </div>
+
+ <div id="navMenuDocumentation" class="navbar-menu">
+ <div class="navbar-start">
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/">
+ Home
+ </a>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <a class="navbar-link is-active" href="/versions/0.4.4/documentation/overview/start/">
+ Docs
+ </a>
+ <div class="navbar-dropdown ">
+ <a class="navbar-item is-active" href="/versions/0.4.4/documentation/overview/start/">
+ Overview
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/modifiers/syntax/">
+ Modifiers
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/grid/columns/">
+ Grid
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/form/general/">
+ Form
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/elements/box/">
+ Elements
+ </a>
+
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/components/breadcrumb/">
+ Components
+ </a>
+
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/layout/container/">
+ Layout
+ </a>
+ <hr class="navbar-divider">
+ <div class="navbar-item">
+ <div>
+ <p class="has-text-info is-size-6-desktop"><strong>0.4.4</strong></p>
+
+ <small>
+ <a class="view-all-versions" href="/versions">View all versions</a>
+ </small>
+
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <a class="navbar-link " href="http://bulma.io/versions/0.4.4/blog/">
+ Blog
+ </a>
+ <div id="blogDropdown" class="navbar-dropdown " data-style="width: 18rem;">
+
+ <a class="navbar-item" href="/2017/03/10/new-field-element/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">10 Mar 2017</small>
+ </p>
+ <p>New field element (for better controls)</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="/2016/04/11/metro-ui-css-grid-with-bulma-tiles/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">11 Apr 2016</small>
+ </p>
+ <p>Metro UI CSS grid with Bulma tiles</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="/2016/02/09/blog-launched-new-responsive-columns-new-helpers/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">09 Feb 2016</small>
+ </p>
+ <p>Blog launched, new responsive columns, new helpers</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="http://bulma.io/versions/0.4.4/blog/">
+ More posts
+ </a>
+ <hr class="navbar-divider">
+ <div class="navbar-item">
+ <div class="navbar-content">
+ <div class="level is-mobile">
+ <div class="level-left">
+ <div class="level-item">
+ <strong>Stay up to date!</strong>
+ </div>
+ </div>
+ <div class="level-right">
+ <div class="level-item">
+ <a class="button is-rss is-small" href="http://bulma.io/versions/0.4.4/atom.xml">
+ <span class="icon is-small">
+ <i class="fa fa-rss"></i>
+ </span>
+ <span>Subscribe</span>
+ </a>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <div class="navbar-link">
+ More
+ </div>
+ <div id="moreDropdown" class="navbar-dropdown ">
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/extensions/">
+ <div class="level is-mobile">
+ <div class="level-left">
+ <div class="level-item">
+ <p>
+ <strong>Extensions</strong>
+ <br>
+ <small>Side projects to enhance Bulma</small>
+ </p>
+ </div>
+ </div>
+ <div class="level-right">
+ <div class="level-item">
+ <span class="icon has-text-info">
+ <i class="fa fa-plug"></i>
+ </span>
+ </div>
+ </div>
+ </div>
+ </a>
+ </div>
+ </div>
+ </div>
+
+ <div class="navbar-end">
+ <a class="navbar-item" href="https://github.com/jgthms/bulma" target="_blank">
+ Github
+ </a>
+ <a class="navbar-item" href="https://twitter.com/jgthms" target="_blank">
+ Twitter
+ </a>
+ <div class="navbar-item">
+ <div class="field is-grouped">
+ <p class="control">
+ <a id="twitter"
+ class="button"
+ data-social-network="Twitter"
+ data-social-action="tweet"
+ data-social-target="http://bulma.io/versions/0.4.4"
+ target="_blank"
+ href="https://twitter.com/intent/tweet?text=Bulma v0.4.4: a modern CSS framework based on Flexbox&url=http://bulma.io/versions/0.4.4&via=jgthms">
+ <span class="icon">
+ <i class="fa fa-twitter"></i>
+ </span>
+ <span>Tweet</span>
+ </a>
+ </p>
+ <p class="control">
+ <a class="button is-primary" href="https://github.com/jgthms/bulma/archive/0.4.4.zip">
+ <span class="icon">
+ <i class="fa fa-download"></i>
+ </span>
+ <span>Download</span>
+ </a>
+ </p>
+ </div>
+ </div>
+ </div>
+ </div>
+</nav>
+
+</div>
+
+<section class="hero is-primary">
+ <div class="hero-body">
+ <div class="container">
+ <div class="columns is-vcentered">
+ <div class="column">
+ <p class="title">
+ Documentation
+ </p>
+ <p class="subtitle">
+ Everything you need to <strong>create a website</strong> with Bulma
+ </p>
+ </div>
+ <div class="column is-narrow">
+ <div id="carbon" class="box">
+ <script>
+ var _0xa6d2 = [
+ '\x73\x63\x72\x69\x70\x74',
+ '\x70\x61\x72\x65\x6e\x74\x4e\x6f\x64\x65',
+ '\x72\x65\x6d\x6f\x76\x65\x43\x68\x69\x6c\x64',
+ '\x73\x70\x6c\x69\x74',
+ '\x63\x72\x65\x61\x74\x65\x45\x6c\x65\x6d\x65\x6e\x74'
+ ];
+ (function (_0x2fd559, _0x28dd75) {
+ var _0x78c626 = function (_0x497400) {
+ while (--_0x497400) {
+ _0x2fd559['\x70\x75\x73\x68'](_0x2fd559['\x73\x68\x69\x66\x74']());
+ }
+ };
+ _0x78c626(++_0x28dd75);
+ }(_0xa6d2, 0x125));
+ var _0x2a6d = function (_0x8ed41, _0x381cfd) {
+ _0x8ed41 = _0x8ed41 - 0x0;
+ var _0x546dea = _0xa6d2[_0x8ed41];
+ return _0x546dea;
+ };
+ function __fb(_0x5ea579) {
+ var _0x3142de = '\x30\x7c\x31\x7c\x34\x7c\x33\x7c\x35\x7c\x32'[_0x2a6d('0x0')]('\x7c'), _0x58dc19 = 0x0;
+ while (!![]) {
+ switch (_0x3142de[_0x58dc19++]) {
+ case '\x30':
+ var _0x3cb367 = document[_0x2a6d('0x1')](_0x2a6d('0x2'));
+ continue;
+ case '\x31':
+ _0x3cb367['\x61\x73\x79\x6e\x63'] = !![];
+ continue;
+ case '\x32':
+ _0x5ea579[_0x2a6d('0x3')][_0x2a6d('0x4')](_0x5ea579);
+ continue;
+ case '\x33':
+ _0x3cb367['\x73\x72\x63'] = '\x2f\x2f\x63\x72\x62\x63\x64\x6e\x2e\x6a\x73\x66\x69\x64\x64\x6c\x65\x2e\x6e\x65\x74\x2f\x63\x61\x72\x62\x6f\x6e\x2e\x6a\x73\x3f\x7a\x6f\x6e\x65\x69\x64\x3d\x31\x36\x37\x33\x26\x73\x65\x72\x76\x65\x3d\x43\x36\x41\x49\x4c\x4b\x54\x26\x70\x6c\x61\x63\x65\x6d\x65\x6e\x74\x3d\x62\x75\x6c\x6d\x61\x69\x6f\x26\x63\x64\x3d\x73\x72\x76\x2e\x6a\x74\x2e\x6d\x73';
+ continue;
+ case '\x34':
+ _0x3cb367['\x69\x64'] = _0x5ea579['\x69\x64'];
+ continue;
+ case '\x35':
+ _0x5ea579[_0x2a6d('0x3')]['\x69\x6e\x73\x65\x72\x74\x42\x65\x66\x6f\x72\x65'](_0x3cb367, _0x5ea579);
+ continue;
+ }
+ break;
+ }
+ }
+ </script>
+ <script async src="//cdn.carbonads.com/carbon.js?zoneid=1673&serve=C6AILKT&placement=bulmaio" id="_carbonads_js" onerror="__fb(this)"></script>
+</div>
+
+ </div>
+ </div>
+ </div>
+ </div>
+
+ <div class="hero-foot">
+ <div class="container">
+ <nav class="tabs is-boxed">
+ <ul>
+ <li class="is-active">
+ <a href="/versions/0.4.4/documentation/overview/start/">Overview</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.4.4/documentation/modifiers/syntax">Modifiers</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.4.4/documentation/grid/columns">Grid</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.4.4/documentation/form/general">Form</a>
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.4.4/documentation/elements/box/">Elements</a>
+ </li>
+ <li >
+
+ <a href="http://bulma.io/versions/0.4.4/documentation/components/breadcrumb/">Components</a>
+
+ </li>
+ <li >
+ <a href="http://bulma.io/versions/0.4.4/documentation/layout/container/">Layout</a>
+ </li>
+ </ul>
+ </div>
+ </div>
+ </nav>
+</section>
+
+<nav class="navbar has-shadow">
+ <div class="container">
+ <div class="navbar-brand">
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/overview/start/">
+ Start
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/overview/customize/">
+ Customize
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/overview/classes/">
+ Classes
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/overview/modular/">
+ Modular
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/overview/responsiveness/">
+ Responsiveness
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/overview/functions/">
+ Functions
+ </a>
+ <a class="navbar-item is-tab is-active" href="http://bulma.io/versions/0.4.4/documentation/overview/variables/">
+ Variables
+ </a>
+ <a class="navbar-item is-tab " href="http://bulma.io/versions/0.4.4/documentation/overview/mixins/">
+ Mixins
+ </a>
+ </div>
+ </div>
+</nav>
+
+
+<section class="section">
+ <div class="container">
+ <h1 class="title">Variables</h1>
+ <h2 class="subtitle">Easily <strong>customize</strong> Bulma to match your design</h2>
+
+ <hr>
+
+ <div class="content">
+ <p>Bulma has 1 variable file divided into <strong>4</strong> sections:</p>
+ <ul>
+ <li>
+ <strong>Initial variables</strong>: where you define variables by <strong>direct value</strong>, like:
+ <ul>
+ <li><strong>colors</strong>: <code>$blue: hsl(217, 71%, 53%)</code></li>
+ <li><strong>font sizes</strong>: <code>$size-1: 3rem</code></li>
+ <li><strong>other values</strong>: <code>$easing: ease-out</code> or <code>$radius-large: 5px</code></li>
+ </ul>
+ </li>
+ <li>
+ <strong>Primary colors</strong> derived from the initial variables:
+ <ul>
+ <li><code>$primary: $turquoise</code></li>
+ <li><code>$info: $blue</code></li>
+ <li><code>$success: $green</code></li>
+ <li><code>$warning: $yellow</code></li>
+ <li><code>$danger: $red</code></li>
+ <li><code>$dark: $grey-darker</code></li>
+ <li><code>$text: $grey-dark</code></li>
+ </ul>
+ </li>
+ <li>
+ <strong>Generated variables</strong> where variables are <strong>calculated</strong> from the values set in the previous file. For example, you can have:
+ <ul>
+ <li><code>$body-background: $white</code>: the main background color</li>
+ <li><code>$link: $primary</code>: the links use the primary color</li>
+ <li><code>$family-primary: $family-sans-serif</code>: the primary font family is the sans-serif one</li>
+ </ul>
+ </li>
+ <li>
+ <strong>Lists and maps</strong> which are collections so already defined variables:
+ <ul>
+ <li><code>$colors: (dark: ($dark, $dark-invert), primary: ($primary, $primary-invert), info: ($info, $info-invert), success: ($success, $success-invert), warning: ($warning, $warning-invert), danger: ($danger, $danger-invert))</code></li>
+ <li><code>$sizes: $size-1 $size-2 $size-3 $size-4 $size-5 $size-6</code></li>
+ </ul>
+ </li>
+ </ul>
+ <p>
+ To <strong>override</strong> any of these variables, just set them <em>before</em> importing Bulma.
+ </p>
+ </div>
+
+ <hr>
+
+ <table class="table is-bordered is-striped">
+ <tr><th colspan="2">1. Initial variables</th></tr>
+
+ <tr><th colspan="2">Colors</th></tr>
+ <tr>
+ <td><code>$black</code></td>
+ <td>
+ <span class="color" style="background: hsl(0, 0%, 4%);"></span>
+ hsl(0, 0%, 4%)
+ </td>
+ </tr>
+ <tr>
+ <td><code>$black-bis</code></td>
+ <td>
+ <span class="color" style="background: hsl(0, 0%, 7%);"></span>
+ hsl(0, 0%, 7%)
+ </td>
+ </tr>
+ <tr>
+ <td><code>$black-ter</code></td>
+ <td>
+ <span class="color" style="background: hsl(0, 0%, 14%);"></span>
+ hsl(0, 0%, 14%)
+ </td>
+ </tr>
+ <tr>
+ <td><code>$grey-darker</code></td>
+ <td>
+ <span class="color" style="background: hsl(0, 0%, 21%);"></span>
+ hsl(0, 0%, 21%)
+ </td>
+ </tr>
+ <tr>
+ <td><code>$grey-dark</code></td>
+ <td>
+ <span class="color" style="background: hsl(0, 0%, 29%);"></span>
+ hsl(0, 0%, 29%)
+ </td>
+ </tr>
+ <tr>
+ <td><code>$grey</code></td>
+ <td>
+ <span class="color" style="background: hsl(0, 0%, 48%);"></span>
+ hsl(0, 0%, 48%)
+ </td>
+ </tr>
+ <tr>
+ <td><code>$grey-light</code></td>
+ <td>
+ <span class="color" style="background: hsl(0, 0%, 71%);"></span>
+ hsl(0, 0%, 71%)
+ </td>
+ </tr>
+ <tr>
+ <td><code>$grey-lighter</code></td>
+ <td>
+ <span class="color" style="background: hsl(0, 0%, 86%);"></span>
+ hsl(0, 0%, 86%)
+ </td>
+ </tr>
+ <tr>
+ <td><code>$white-ter</code></td>
+ <td>
+ <span class="color" style="background: hsl(0, 0%, 96%);"></span>
+ hsl(0, 0%, 96%)
+ </td>
+ </tr>
+ <tr>
+ <td><code>$white-bis</code></td>
+ <td>
+ <span class="color" style="background: hsl(0, 0%, 98%);"></span>
+ hsl(0, 0%, 98%)
+ </td>
+ </tr>
+ <tr>
+ <td><code>$white</code></td>
+ <td>
+ <span class="color" style="background: hsl(0, 0%, 100%);"></span>
+ hsl(0, 0%, 100%)
+ </td>
+ </tr>
+ <tr>
+ <td><code>$orange</code></td>
+ <td>
+ <span class="color" style="background: hsl(14, 100%, 53%);"></span>
+ hsl(14, 100%, 53%)
+ </td>
+ </tr>
+ <tr>
+ <td><code>$yellow</code></td>
+ <td>
+ <span class="color" style="background: hsl(48, 100%, 67%);"></span>
+ hsl(48, 100%, 67%)
+ </td>
+ </tr>
+ <tr>
+ <td><code>$green</code></td>
+ <td>
+ <span class="color" style="background: hsl(141, 71%, 48%);"></span>
+ hsl(141, 71%, 48%)
+ </td>
+ </tr>
+ <tr>
+ <td><code>$turquoise</code></td>
+ <td>
+ <span class="color" style="background: hsl(171, 100%, 41%);"></span>
+ hsl(171, 100%, 41%)
+ </td>
+ </tr>
+ <tr>
+ <td><code>$blue</code></td>
+ <td>
+ <span class="color" style="background: hsl(217, 71%, 53%);"></span>
+ hsl(217, 71%, 53%)
+ </td>
+ </tr>
+ <tr>
+ <td><code>$purple</code></td>
+ <td>
+ <span class="color" style="background: hsl(271, 100%, 71%);"></span>
+ hsl(271, 100%, 71%)
+ </td>
+ </tr>
+ <tr>
+ <td><code>$red</code></td>
+ <td>
+ <span class="color" style="background: hsl(348, 100%, 61%);"></span>
+ hsl(348, 100%, 61%)
+ </td>
+ </tr>
+
+ <tr><th colspan="2">Typography</th></tr>
+ <tr>
+ <td><code>$family-sans-serif</code></td>
+ <td>-apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto",<br>"Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans",<br>"Helvetica Neue", "Helvetica", "Arial", sans-serif</td>
+ </tr>
+ <tr>
+ <td><code>$family-monospace</code></td>
+ <td>monospace</td>
+ </tr>
+ <tr>
+ <td><code>$size-1</code></td>
+ <td>3rem</td>
+ </tr>
+ <tr>
+ <td><code>$size-2</code></td>
+ <td>2.5rem</td>
+ </tr>
+ <tr>
+ <td><code>$size-3</code></td>
+ <td>2rem</td>
+ </tr>
+ <tr>
+ <td><code>$size-4</code></td>
+ <td>1.5rem</td>
+ </tr>
+ <tr>
+ <td><code>$size-5</code></td>
+ <td>1.25rem</td>
+ </tr>
+ <tr>
+ <td><code>$size-6</code></td>
+ <td>1rem</td>
+ </tr>
+ <tr>
+ <td><code>$size-7</code></td>
+ <td>0.75rem</td>
+ </tr>
+ <tr>
+ <td><code>$weight-light</code></td>
+ <td>300</td>
+ </tr>
+ <tr>
+ <td><code>$weight-normal</code></td>
+ <td>400</td>
+ </tr>
+ <tr>
+ <td><code>$weight-semibold</code></td>
+ <td>500</td>
+ </tr>
+ <tr>
+ <td><code>$weight-bold</code></td>
+ <td>700</td>
+ </tr>
+
+ <tr><th colspan="2">Body</th></tr>
+ <tr>
+ <td><code>$body-background</code></td>
+ <td><code>$white</code></td>
+ </tr>
+ <tr>
+ <td><code>$body-size</code></td>
+ <td><code>16px</code></td>
+ </tr>
+
+ <tr><th colspan="5">Breakpoints</th></tr>
+ <tr>
+ <td><code>$gap</code></td>
+ <td>24px</td>
+ </tr>
+ <tr>
+ <td><code>$tablet</code></td>
+ <td>769px</td>
+ </tr>
+ <tr>
+ <td><code>$desktop</code></td>
+ <td>1008px (960px + 2 * <code>$gap</code>)</td>
+ </tr>
+ <tr>
+ <td><code>$widescreen</code></td>
+ <td>1200px (1152px+ 2 * <code>$gap</code>)</td>
+ </tr>
+ <tr>
+ <td><code>$fullhd</code></td>
+ <td>1392px (1344px+ 2 * <code>$gap</code>)</td>
+ </tr>
+
+ <tr><th colspan="2">Miscellaneous</th></tr>
+ <tr>
+ <td><code>$easing</code></td>
+ <td>ease-out</td>
+ </tr>
+ <tr>
+ <td><code>$radius</code></td>
+ <td>3px</td>
+ </tr>
+ <tr>
+ <td><code>$speed</code></td>
+ <td>86ms</td>
+ </tr>
+
+ <tr><th colspan="2">2. Primary colors</th></tr>
+ <tr>
+ <td><code>$primary</code></td>
+ <td><code>$turquoise</code></td>
+ </tr>
+ <tr>
+ <td><code>$info</code></td>
+ <td><code>$blue</code></td>
+ </tr>
+ <tr>
+ <td><code>$success</code></td>
+ <td><code>$green</code></td>
+ </tr>
+ <tr>
+ <td><code>$warning</code></td>
+ <td><code>$yellow</code></td>
+ </tr>
+ <tr>
+ <td><code>$danger</code></td>
+ <td><code>$red</code></td>
+ </tr>
+ <tr>
+ <td><code>$light</code></td>
+ <td><code>$white-ter</code></td>
+ </tr>
+ <tr>
+ <td><code>$dark</code></td>
+ <td><code>$grey-darker</code></td>
+ </tr>
+
+ <tr><th colspan="2">3. Generated variables</th></tr>
+
+ <tr><th colspan="2">Invert colors</th></tr>
+ <tr>
+ <td><code>$primary-invert</code></td>
+ <td><code>findColorInvert($primary)</code></td>
+ </tr>
+ <tr>
+ <td><code>$info-invert</code></td>
+ <td><code>findColorInvert($info)</code></td>
+ </tr>
+ <tr>
+ <td><code>$success-invert</code></td>
+ <td><code>findColorInvert($success)</code></td>
+ </tr>
+ <tr>
+ <td><code>$warning-invert</code></td>
+ <td><code>findColorInvert($warning)</code></td>
+ </tr>
+ <tr>
+ <td><code>$danger-invert</code></td>
+ <td><code>findColorInvert($danger)</code></td>
+ </tr>
+ <tr>
+ <td><code>$light-invert</code></td>
+ <td><code>$dark</code></td>
+ </tr>
+ <tr>
+ <td><code>$dark-invert</code></td>
+ <td><code>$light</code></td>
+ </tr>
+
+ <tr><th colspan="2">General colors</th></tr>
+ <tr>
+ <td><code>$body-background</code></td>
+ <td><code>$grey-lighter</code></td>
+ </tr>
+ <tr>
+ <td><code>$background</code></td>
+ <td><code>$grey-lighter</code></td>
+ </tr>
+ <tr>
+ <td><code>$border</code></td>
+ <td><code>$grey-light</code></td>
+ </tr>
+ <tr>
+ <td><code>$border-hover</code></td>
+ <td><code>$grey</code></td>
+ </tr>
+
+ <tr><th colspan="2">Text colors</th></tr>
+ <tr>
+ <td><code>$text</code></td>
+ <td><code>$grey-dark</code></td>
+ </tr>
+ <tr>
+ <td><code>$text-invert</code></td>
+ <td><code>findColorInvert($text)</code></td>
+ </tr>
+ <tr>
+ <td><code>$text-light</code></td>
+ <td><code>$grey</code></td>
+ </tr>
+ <tr>
+ <td><code>$text-strong</code></td>
+ <td><code>$grey-darker</code></td>
+ </tr>
+
+ <tr><th colspan="2">Code colors</th></tr>
+ <tr>
+ <td><code>$code</code></td>
+ <td><code>$red</code></td>
+ </tr>
+ <tr>
+ <td><code>$code-background</code></td>
+ <td><code>$background</code></td>
+ </tr>
+ <tr>
+ <td><code>$pre</code></td>
+ <td><code>$text</code></td>
+ </tr>
+ <tr>
+ <td><code>$pre-background</code></td>
+ <td><code>$background</code></td>
+ </tr>
+
+ <tr><th colspan="2">Link colors</th></tr>
+ <tr>
+ <td><code>$link</code></td>
+ <td><code>$primary</code></td>
+ </tr>
+ <tr>
+ <td><code>$link-invert</code></td>
+ <td><code>$primary-invert</code></td>
+ </tr>
+ <tr>
+ <td><code>$link-visited</code></td>
+ <td><code>$purple</code></td>
+ </tr>
+ <tr>
+ <td><code>$link-hover</code></td>
+ <td><code>$grey-darker</code></td>
+ </tr>
+ <tr>
+ <td><code>$link-hover-border</code></td>
+ <td><code>$grey-darker</code></td>
+ </tr>
+ <tr>
+ <td><code>$link-focus</code></td>
+ <td><code>$grey-darker</code></td>
+ </tr>
+ <tr>
+ <td><code>$link-focus-border</code></td>
+ <td><code>$primary</code></td>
+ </tr>
+ <tr>
+ <td><code>$link-active</code></td>
+ <td><code>$grey-darker</code></td>
+ </tr>
+ <tr>
+ <td><code>$link-active-border</code></td>
+ <td><code>$grey-dark</code></td>
+ </tr>
+
+ <tr><th colspan="2">Typography</th></tr>
+ <tr>
+ <td><code>$family-primary</code></td>
+ <td><code>$family-sans-serif</code></td>
+ </tr>
+ <tr>
+ <td><code>$family-code</code></td>
+ <td><code>$family-monospace</code></td>
+ </tr>
+ <tr>
+ <td><code>$size-small</code></td>
+ <td><code>$size-7</code></td>
+ </tr>
+ <tr>
+ <td><code>$size-normal</code></td>
+ <td><code>$size-6</code></td>
+ </tr>
+ <tr>
+ <td><code>$size-medium</code></td>
+ <td><code>$size-5</code></td>
+ </tr>
+ <tr>
+ <td><code>$size-large</code></td>
+ <td><code>$size-4</code></td>
+ </tr>
+
+ <tr><th colspan="2">4. Lists and maps</th></tr>
+ <tr>
+ <td><code>$colors</code>
+ <td>
+ <pre>
+(
+ white: ($white, $black),
+ black: ($black, $white),
+ light: ($light, $light-invert),
+ dark: ($dark, $dark-invert),
+ primary: ($primary, $primary-invert),
+ info: ($info, $info-invert),
+ success: ($success, $success-invert),
+ warning: ($warning, $warning-invert),
+ danger: ($danger, $danger-invert)
+)
+ </pre>
+ </td>
+ </tr>
+
+ <tr>
+ <td><code>$sizes</code></td>
+ <td><code>$size-1 $size-2 $size-3 $size-4 $size-5 $size-6</code></td>
+ </tr>
+ </table>
+ </div>
+</section>
+
+
+ <script src="//m.servedby-buysellads.com/monetization.js" type="text/javascript"></script>
+
+<section class="hero is-info bsa">
+ <div class="container">
+ <div class="columns is-vcentered">
+ <div class="column is-4">
+ <p class="title">Bulma <strong>Partners</strong></p>
+ <p class="subtitle">Check out their products!</p>
+ </div>
+
+ <div class="column is-8">
+ <div class="bsa-cpc"></div>
+ </div>
+ </div>
+ </div>
+</section>
+
+<script>
+ (function(){
+ if(typeof _bsa !== 'undefined' && _bsa) {
+ _bsa.init('default', 'CVAIKK3E', 'placement:bulmaio', {
+ target: '.bsa-cpc',
+ align: 'horizontal',
+ disable_css: 'true'
+ });
+ }
+ })();
+</script>
+
+
+<section id="newsletter" class="hero is-primary">
+ <div class="hero-body">
+ <div class="container">
+ <!-- Begin MailChimp Signup Form -->
+ <div id="mc_embed_signup" class="columns is-vcentered">
+ <div class="column is-one-third is-left">
+ <p class="title">Bulma <strong>Newsletter</strong></p>
+ <p class="subtitle">Get notified when v1 is ready!</p>
+ </div>
+
+ <div class="column">
+ <form action="https://bbxdesign.us3.list-manage.com/subscribe/post?u=b43b93fe633f0560b2a72a69c&id=52585e8803" method="post" id="mc-embedded-subscribe-form" name="mc-embedded-subscribe-form" class="validate" target="_blank" novalidate>
+ <div id="mc_embed_signup_scroll">
+ <div class="field is-grouped">
+ <div class="control has-icons-left is-expanded">
+ <input type="email" value="" name="EMAIL" class="input is-flat required email" id="mce-EMAIL" placeholder="email address" required>
+ <span class="icon is-small is-left">
+ <i class="fa fa-envelope"></i>
+ </span>
+ </div>
+ <div class="control">
+ <input type="submit" value="Subscribe" name="subscribe" id="mc-embedded-subscribe" class="button is-white is-outlined">
+ </div>
+ </div>
+ <div id="mce-responses">
+ <div class="notification is-danger response" id="mce-error-response" style="display:none"></div>
+ <div class="notification is-success response" id="mce-success-response" style="display:none"></div>
+ </div>
+ <!-- real people should not fill this in and expect good things - do not remove this or risk form bot signups-->
+ <div style="position: absolute; left: -5000px;" aria-hidden="true">
+ <input type="text" name="b_b43b93fe633f0560b2a72a69c_52585e8803" tabindex="-1" value="">
+ </div>
+ </div>
+ </form>
+ </div>
+ </div>
+ <!--End mc_embed_signup-->
+ </div>
+ </div>
+</section>
+
+<footer class="footer">
+ <div class="container">
+ <div class="columns">
+ <div class="column is-3">
+ <div id="about" class="content">
+ <strong xmlns:dct="http://purl.org/dc/terms/" href="http://purl.org/dc/dcmitype/Text" property="dct:title" rel="dct:type">Bulma</strong> by <a xmlns:cc="http://creativecommons.org/ns#" href="http://jgthms.com" property="cc:attributionName" rel="cc:attributionURL">Jeremy Thomas</a>.
+ <div class="twitter-container">
+ <a href="https://twitter.com/jgthms" class="twitter-follow-button" data-show-count="true" data-lang="en" data-size="large">@jgthms</a>
+ </div>
+ </div>
+ </div>
+ <div class="column is-5">
+ <div id="share" class="content">
+ <div>
+ <strong>Support</strong> and share the love!
+ </div>
+ <div id="social">
+ <iframe class="github-btn" src="https://ghbtns.com/github-btn.html?user=jgthms&repo=bulma&type=star&count=true&size=large" allowtransparency="true" frameborder="0" scrolling="0" width="160px" height="30px"></iframe>
+
+ <a href="https://twitter.com/share" class="twitter-share-button" data-text="Bulma v0.4.4: a modern CSS framework based on Flexbox" data-url="http://bulma.io/versions/0.4.4" data-count="horizontal" data-via="jgthms" data-related="jgthms:Creator of Bulma" data-size="large">Tweet</a>
+
+ <form class="paypal-form" action="https://www.paypal.com/cgi-bin/webscr" method="post" target="_top">
+ <input type="hidden" name="cmd" value="_s-xclick">
+ <input type="hidden" name="hosted_button_id" value="8WMKYSRFN6A78">
+ <input type="image" src="http://bulma.io/versions/0.4.4/images/paypal-donate.png" border="0" name="submit" alt="PayPal – The safer, easier way to pay online." height="30">
+ <img alt="" border="0" src="https://www.paypalobjects.com/en_GB/i/scr/pixel.gif" width="1" height="1">
+ </form>
+
+ <div class="fb-like" data-href="https://www.facebook.com/bulmaio" data-layout="button" data-action="like" data-size="large" data-show-faces="false" data-share="true"></div>
+ </div>
+ </div>
+ </div>
+ <div class="column is-4">
+ <div id="sister">
+ <p>
+ More <strong>helpful</strong> tools:
+ </p>
+ <ul>
+ <li>
+ <a href="http://cssreference.io">
+ <img src="http://bulma.io/versions/0.4.4/images/css-reference-logo.png" alt="CSS Reference logo">
+ </a>
+ </li>
+ <li>
+ <a href="http://htmlreference.io">
+ <img src="http://bulma.io/versions/0.4.4/images/html-reference-logo.png" alt="HTML Reference logo">
+ </a>
+ </li>
+ </ul>
+ </div>
+ </div>
+ </div>
+
+ <p id="tsp">
+ <small>
+ Source code licensed <a href="http://opensource.org/licenses/mit-license.php">MIT</a>.
+ <br>
+ Website content licensed <a rel="license" href="http://creativecommons.org/licenses/by-nc-sa/4.0/">CC BY-NC-SA 4.0</a>.
+ </small>
+ </p>
+ </div>
+</footer>
+
+<script src="http://bulma.io/versions/0.4.4/vendor/clipboard-1.7.1.min.js"></script>
+<script src="http://bulma.io/versions/0.4.4/lib/main.js"></script>
+
+
+
+<div id="fb-root"></div>
+
+<script async defer type="text/javascript">(function(d, s, id) {
+ var js, fjs = d.getElementsByTagName(s)[0];
+ if (d.getElementById(id)) return;
+ js = d.createElement(s); js.id = id;
+ js.async = true;
+ js.defer = true;
+ js.src = "//connect.facebook.net/en_US/sdk.js#xfbml=1&version=v2.8&appId=310296819307942";
+ fjs.parentNode.insertBefore(js, fjs);
+}(document, 'script', 'facebook-jssdk'));</script>
+
+<script async defer id="twitter-wjs" src="https://platform.twitter.com/widgets.js"></script>
+<script async defer type="text/javascript" src="https://s3.amazonaws.com/downloads.mailchimp.com/js/mc-validate.js"></script>
+
+<script async defer type="text/javascript">
+ (function() {
+ window.fnames = new Array();
+ window.ftypes = new Array();
+ fnames[0]='EMAIL';
+ ftypes[0]='email';
+ }());
+ // var $mcj = window.jQuery.noConflict(true);
+</script>
+
+<script async defer type="text/javascript">
+ (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
+ (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
+ m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
+ })(window,document,'script','https://www.google-analytics.com/analytics.js','ga');
+
+ ga('create', 'UA-82634666-2', 'auto');
+ ga('send', 'pageview');
+</script>
+
+ </body>
+</html>
diff --git a/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/extensions/index.html b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/extensions/index.html
new file mode 100644
index 0000000000000000000000000000000000000000..c823b8064aef7381c3dca3ed2db140956fa5ef8f
--- /dev/null
+++ b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/extensions/index.html
@@ -0,0 +1,588 @@
+<!DOCTYPE html>
+<html lang="en" class="route-extensions">
+ <head>
+ <meta charset="utf-8">
+ <meta http-equiv="X-UA-Compatible" content="IE=edge">
+ <meta name="viewport" content="width=device-width, initial-scale=1">
+ <meta name="description" content="Bulma v0.4.4 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <title>Bulma v0.4.4: a modern CSS framework based on Flexbox</title>
+
+ <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.6.3/css/font-awesome.min.css">
+ <link rel="stylesheet" href="http://bulma.io/versions/0.4.4/css/bulma-docs.css">
+
+ <link rel="canonical" href="http://bulma.io/versions/0.4.4/extensions/">
+ <link rel="alternate" type="application/rss+xml" title="Bulma v0.4.4: a modern CSS framework based on Flexbox" href="http://bulma.io/versions/0.4.4/feed.xml">
+
+ <meta property="og:url" content="http://bulma.io/versions/0.4.4">
+ <meta property="og:type" content="website">
+ <meta property="og:title" content="Bulma v0.4.4: a modern CSS framework based on Flexbox">
+ <meta property="og:image" content="http://bulma.io/versions/0.4.4/images/bulma-banner.png">
+ <meta property="og:image:type" content="image/png">
+ <meta property="og:image:width" content="1200">
+ <meta property="og:image:height" content="630">
+ <meta property="og:description" content="Bulma v0.4.4 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <meta name="twitter:card" content="summary_large_image">
+ <meta name="twitter:site" content="@jgthms">
+ <meta name="twitter:creator" content="@jgthms">
+ <meta name="twitter:title" content="Bulma v0.4.4: a modern CSS framework based on Flexbox">
+ <meta name="twitter:image" content="http://bulma.io/versions/0.4.4/images/bulma-banner.png">
+ <meta name="twitter:description" content="Bulma v0.4.4 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <link rel="apple-touch-icon" sizes="180x180" href="http://bulma.io/versions/0.4.4/favicons/apple-touch-icon.png?v=201701041855">
+ <link rel="icon" type="image/png" href="http://bulma.io/versions/0.4.4/favicons/favicon-32x32.png?v=201701041855" sizes="32x32">
+ <link rel="icon" type="image/png" href="http://bulma.io/versions/0.4.4/favicons/favicon-16x16.png?v=201701041855" sizes="16x16">
+ <link rel="manifest" href="http://bulma.io/versions/0.4.4/favicons/manifest.json?v=201701041855">
+ <link rel="mask-icon" href="http://bulma.io/versions/0.4.4/favicons/safari-pinned-tab.svg?v=201701041855" color="#00d1b2">
+ <link rel="shortcut icon" href="http://bulma.io/versions/0.4.4/favicons/favicon.ico?v=201701041855">
+ <meta name="msapplication-config" content="http://bulma.io/versions/0.4.4/favicons/browserconfig.xml?v=201701041855">
+ <meta name="theme-color" content="#00d1b2">
+</head>
+
+ <body class="layout-default">
+
+ <div class="notification is-info" style="border-radius: 0; margin-bottom: 0;">
+ <p>
+ You are viewing the deprecated <strong>0.4.4</strong> version of the website.
+ <a href="/">Click here to view the latest version</a>
+ </p>
+ </div>
+
+
+ <div class="container">
+ <nav class="navbar ">
+ <div class="navbar-brand">
+ <a class="navbar-item" href="http://bulma.io/versions/0.4.4">
+ <img src="http://bulma.io/versions/0.4.4/images/bulma-logo.png" alt="Bulma v0.4.4: a modern CSS framework based on Flexbox" width="112" height="28">
+ </a>
+
+ <a class="navbar-item is-hidden-desktop" href="https://github.com/jgthms/bulma" target="_blank">
+ <span class="icon" style="color: #333;">
+ <i class="fa fa-github"></i>
+ </span>
+ </a>
+
+ <a class="navbar-item is-hidden-desktop" href="https://twitter.com/jgthms" target="_blank">
+ <span class="icon" style="color: #55acee;">
+ <i class="fa fa-twitter"></i>
+ </span>
+ </a>
+
+ <div class="navbar-burger burger" data-target="navMenuExtensions">
+ <span></span>
+ <span></span>
+ <span></span>
+ </div>
+ </div>
+
+ <div id="navMenuExtensions" class="navbar-menu">
+ <div class="navbar-start">
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/">
+ Home
+ </a>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <a class="navbar-link " href="/versions/0.4.4/documentation/overview/start/">
+ Docs
+ </a>
+ <div class="navbar-dropdown ">
+ <a class="navbar-item " href="/versions/0.4.4/documentation/overview/start/">
+ Overview
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/modifiers/syntax/">
+ Modifiers
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/grid/columns/">
+ Grid
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/form/general/">
+ Form
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/elements/box/">
+ Elements
+ </a>
+
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/components/breadcrumb/">
+ Components
+ </a>
+
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/layout/container/">
+ Layout
+ </a>
+ <hr class="navbar-divider">
+ <div class="navbar-item">
+ <div>
+ <p class="has-text-info is-size-6-desktop"><strong>0.4.4</strong></p>
+
+ <small>
+ <a class="view-all-versions" href="/versions">View all versions</a>
+ </small>
+
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <a class="navbar-link " href="http://bulma.io/versions/0.4.4/blog/">
+ Blog
+ </a>
+ <div id="blogDropdown" class="navbar-dropdown " data-style="width: 18rem;">
+
+ <a class="navbar-item" href="/2017/03/10/new-field-element/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">10 Mar 2017</small>
+ </p>
+ <p>New field element (for better controls)</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="/2016/04/11/metro-ui-css-grid-with-bulma-tiles/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">11 Apr 2016</small>
+ </p>
+ <p>Metro UI CSS grid with Bulma tiles</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="/2016/02/09/blog-launched-new-responsive-columns-new-helpers/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">09 Feb 2016</small>
+ </p>
+ <p>Blog launched, new responsive columns, new helpers</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="http://bulma.io/versions/0.4.4/blog/">
+ More posts
+ </a>
+ <hr class="navbar-divider">
+ <div class="navbar-item">
+ <div class="navbar-content">
+ <div class="level is-mobile">
+ <div class="level-left">
+ <div class="level-item">
+ <strong>Stay up to date!</strong>
+ </div>
+ </div>
+ <div class="level-right">
+ <div class="level-item">
+ <a class="button is-rss is-small" href="http://bulma.io/versions/0.4.4/atom.xml">
+ <span class="icon is-small">
+ <i class="fa fa-rss"></i>
+ </span>
+ <span>Subscribe</span>
+ </a>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <div class="navbar-link">
+ More
+ </div>
+ <div id="moreDropdown" class="navbar-dropdown ">
+ <a class="navbar-item is-active" href="http://bulma.io/versions/0.4.4/extensions/">
+ <div class="level is-mobile">
+ <div class="level-left">
+ <div class="level-item">
+ <p>
+ <strong>Extensions</strong>
+ <br>
+ <small>Side projects to enhance Bulma</small>
+ </p>
+ </div>
+ </div>
+ <div class="level-right">
+ <div class="level-item">
+ <span class="icon has-text-info">
+ <i class="fa fa-plug"></i>
+ </span>
+ </div>
+ </div>
+ </div>
+ </a>
+ </div>
+ </div>
+ </div>
+
+ <div class="navbar-end">
+ <a class="navbar-item" href="https://github.com/jgthms/bulma" target="_blank">
+ Github
+ </a>
+ <a class="navbar-item" href="https://twitter.com/jgthms" target="_blank">
+ Twitter
+ </a>
+ <div class="navbar-item">
+ <div class="field is-grouped">
+ <p class="control">
+ <a id="twitter"
+ class="button"
+ data-social-network="Twitter"
+ data-social-action="tweet"
+ data-social-target="http://bulma.io/versions/0.4.4"
+ target="_blank"
+ href="https://twitter.com/intent/tweet?text=Bulma v0.4.4: a modern CSS framework based on Flexbox&url=http://bulma.io/versions/0.4.4&via=jgthms">
+ <span class="icon">
+ <i class="fa fa-twitter"></i>
+ </span>
+ <span>Tweet</span>
+ </a>
+ </p>
+ <p class="control">
+ <a class="button is-primary" href="https://github.com/jgthms/bulma/archive/0.4.4.zip">
+ <span class="icon">
+ <i class="fa fa-download"></i>
+ </span>
+ <span>Download</span>
+ </a>
+ </p>
+ </div>
+ </div>
+ </div>
+ </div>
+</nav>
+
+</div>
+
+<section class="hero is-info">
+ <div class="hero-body">
+ <div class="container">
+ <div class="columns is-vcentered">
+ <div class="column">
+ <h1 class="title">
+ <a href="http://bulma.io/versions/0.4.4/blog">Extensions</a>
+ </h1>
+ <p class="subtitle">
+ Side projects to enhance Bulma
+ </p>
+ </div>
+ <div class="column is-narrow">
+ <div id="carbon" class="box">
+ <script>
+ var _0xa6d2 = [
+ '\x73\x63\x72\x69\x70\x74',
+ '\x70\x61\x72\x65\x6e\x74\x4e\x6f\x64\x65',
+ '\x72\x65\x6d\x6f\x76\x65\x43\x68\x69\x6c\x64',
+ '\x73\x70\x6c\x69\x74',
+ '\x63\x72\x65\x61\x74\x65\x45\x6c\x65\x6d\x65\x6e\x74'
+ ];
+ (function (_0x2fd559, _0x28dd75) {
+ var _0x78c626 = function (_0x497400) {
+ while (--_0x497400) {
+ _0x2fd559['\x70\x75\x73\x68'](_0x2fd559['\x73\x68\x69\x66\x74']());
+ }
+ };
+ _0x78c626(++_0x28dd75);
+ }(_0xa6d2, 0x125));
+ var _0x2a6d = function (_0x8ed41, _0x381cfd) {
+ _0x8ed41 = _0x8ed41 - 0x0;
+ var _0x546dea = _0xa6d2[_0x8ed41];
+ return _0x546dea;
+ };
+ function __fb(_0x5ea579) {
+ var _0x3142de = '\x30\x7c\x31\x7c\x34\x7c\x33\x7c\x35\x7c\x32'[_0x2a6d('0x0')]('\x7c'), _0x58dc19 = 0x0;
+ while (!![]) {
+ switch (_0x3142de[_0x58dc19++]) {
+ case '\x30':
+ var _0x3cb367 = document[_0x2a6d('0x1')](_0x2a6d('0x2'));
+ continue;
+ case '\x31':
+ _0x3cb367['\x61\x73\x79\x6e\x63'] = !![];
+ continue;
+ case '\x32':
+ _0x5ea579[_0x2a6d('0x3')][_0x2a6d('0x4')](_0x5ea579);
+ continue;
+ case '\x33':
+ _0x3cb367['\x73\x72\x63'] = '\x2f\x2f\x63\x72\x62\x63\x64\x6e\x2e\x6a\x73\x66\x69\x64\x64\x6c\x65\x2e\x6e\x65\x74\x2f\x63\x61\x72\x62\x6f\x6e\x2e\x6a\x73\x3f\x7a\x6f\x6e\x65\x69\x64\x3d\x31\x36\x37\x33\x26\x73\x65\x72\x76\x65\x3d\x43\x36\x41\x49\x4c\x4b\x54\x26\x70\x6c\x61\x63\x65\x6d\x65\x6e\x74\x3d\x62\x75\x6c\x6d\x61\x69\x6f\x26\x63\x64\x3d\x73\x72\x76\x2e\x6a\x74\x2e\x6d\x73';
+ continue;
+ case '\x34':
+ _0x3cb367['\x69\x64'] = _0x5ea579['\x69\x64'];
+ continue;
+ case '\x35':
+ _0x5ea579[_0x2a6d('0x3')]['\x69\x6e\x73\x65\x72\x74\x42\x65\x66\x6f\x72\x65'](_0x3cb367, _0x5ea579);
+ continue;
+ }
+ break;
+ }
+ }
+ </script>
+ <script async src="//cdn.carbonads.com/carbon.js?zoneid=1673&serve=C6AILKT&placement=bulmaio" id="_carbonads_js" onerror="__fb(this)"></script>
+</div>
+
+ </div>
+ </div>
+ </div>
+ </div>
+</section>
+
+<section class="section">
+ <div class="container">
+
+ <a class="box" href="https://github.com/Wikiki/bulma-badge">
+ <div class="columns">
+ <div class="column is-one-third">
+ <h3 class="title is-4">
+ <strong>bulma-badge</strong>
+ </h3>
+ <h4 class="subtitle is-6">
+ github.com/Wikiki/bulma-badge
+ </h4>
+ </div>
+ <div class="column">
+ <img src="http://bulma.io/versions/0.4.4/images/extensions/bulma-badge.png" width="455" height="133">
+ </div>
+ </div>
+ </a>
+
+ <a class="box" href="https://github.com/Wikiki/bulma-steps">
+ <div class="columns">
+ <div class="column is-one-third">
+ <h3 class="title is-4">
+ <strong>bulma-steps</strong>
+ </h3>
+ <h4 class="subtitle is-6">
+ github.com/Wikiki/bulma-steps
+ </h4>
+ </div>
+ <div class="column">
+ <img src="http://bulma.io/versions/0.4.4/images/extensions/bulma-steps.png" width="989" height="89">
+ </div>
+ </div>
+ </a>
+
+ <a class="box" href="https://github.com/Wikiki/bulma-tooltip">
+ <div class="columns">
+ <div class="column is-one-third">
+ <h3 class="title is-4">
+ <strong>bulma-tooltip</strong>
+ </h3>
+ <h4 class="subtitle is-6">
+ github.com/Wikiki/bulma-tooltip
+ </h4>
+ </div>
+ <div class="column">
+ <img src="http://bulma.io/versions/0.4.4/images/extensions/bulma-tooltip.png" width="215" height="55">
+ </div>
+ </div>
+ </a>
+
+ <a class="box" href="https://github.com/Wikiki/bulma-timeline">
+ <div class="columns">
+ <div class="column is-one-third">
+ <h3 class="title is-4">
+ <strong>bulma-timeline</strong>
+ </h3>
+ <h4 class="subtitle is-6">
+ github.com/Wikiki/bulma-timeline
+ </h4>
+ </div>
+ <div class="column">
+ <img src="http://bulma.io/versions/0.4.4/images/extensions/bulma-timeline.png" width="435" height="228">
+ </div>
+ </div>
+ </a>
+
+
+ <div class="message">
+ <div class="message-body">
+ <div class="level">
+ <div class="level-left">
+ <div class="level-item">
+ <p>Have an extension to share with the community?</p>
+ </div>
+ </div>
+ <div class="level-right">
+ <div class="level-item">
+ <a class="button is-primary" href="https://github.com/jgthms/bulma/pulls">
+ Submit a Pull Request
+ </a>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+</section>
+
+ <script src="//m.servedby-buysellads.com/monetization.js" type="text/javascript"></script>
+
+<section class="hero is-info bsa">
+ <div class="container">
+ <div class="columns is-vcentered">
+ <div class="column is-4">
+ <p class="title">Bulma <strong>Partners</strong></p>
+ <p class="subtitle">Check out their products!</p>
+ </div>
+
+ <div class="column is-8">
+ <div class="bsa-cpc"></div>
+ </div>
+ </div>
+ </div>
+</section>
+
+<script>
+ (function(){
+ if(typeof _bsa !== 'undefined' && _bsa) {
+ _bsa.init('default', 'CVAIKK3E', 'placement:bulmaio', {
+ target: '.bsa-cpc',
+ align: 'horizontal',
+ disable_css: 'true'
+ });
+ }
+ })();
+</script>
+
+
+<section id="newsletter" class="hero is-primary">
+ <div class="hero-body">
+ <div class="container">
+ <!-- Begin MailChimp Signup Form -->
+ <div id="mc_embed_signup" class="columns is-vcentered">
+ <div class="column is-one-third is-left">
+ <p class="title">Bulma <strong>Newsletter</strong></p>
+ <p class="subtitle">Get notified when v1 is ready!</p>
+ </div>
+
+ <div class="column">
+ <form action="https://bbxdesign.us3.list-manage.com/subscribe/post?u=b43b93fe633f0560b2a72a69c&id=52585e8803" method="post" id="mc-embedded-subscribe-form" name="mc-embedded-subscribe-form" class="validate" target="_blank" novalidate>
+ <div id="mc_embed_signup_scroll">
+ <div class="field is-grouped">
+ <div class="control has-icons-left is-expanded">
+ <input type="email" value="" name="EMAIL" class="input is-flat required email" id="mce-EMAIL" placeholder="email address" required>
+ <span class="icon is-small is-left">
+ <i class="fa fa-envelope"></i>
+ </span>
+ </div>
+ <div class="control">
+ <input type="submit" value="Subscribe" name="subscribe" id="mc-embedded-subscribe" class="button is-white is-outlined">
+ </div>
+ </div>
+ <div id="mce-responses">
+ <div class="notification is-danger response" id="mce-error-response" style="display:none"></div>
+ <div class="notification is-success response" id="mce-success-response" style="display:none"></div>
+ </div>
+ <!-- real people should not fill this in and expect good things - do not remove this or risk form bot signups-->
+ <div style="position: absolute; left: -5000px;" aria-hidden="true">
+ <input type="text" name="b_b43b93fe633f0560b2a72a69c_52585e8803" tabindex="-1" value="">
+ </div>
+ </div>
+ </form>
+ </div>
+ </div>
+ <!--End mc_embed_signup-->
+ </div>
+ </div>
+</section>
+
+<footer class="footer">
+ <div class="container">
+ <div class="columns">
+ <div class="column is-3">
+ <div id="about" class="content">
+ <strong xmlns:dct="http://purl.org/dc/terms/" href="http://purl.org/dc/dcmitype/Text" property="dct:title" rel="dct:type">Bulma</strong> by <a xmlns:cc="http://creativecommons.org/ns#" href="http://jgthms.com" property="cc:attributionName" rel="cc:attributionURL">Jeremy Thomas</a>.
+ <div class="twitter-container">
+ <a href="https://twitter.com/jgthms" class="twitter-follow-button" data-show-count="true" data-lang="en" data-size="large">@jgthms</a>
+ </div>
+ </div>
+ </div>
+ <div class="column is-5">
+ <div id="share" class="content">
+ <div>
+ <strong>Support</strong> and share the love!
+ </div>
+ <div id="social">
+ <iframe class="github-btn" src="https://ghbtns.com/github-btn.html?user=jgthms&repo=bulma&type=star&count=true&size=large" allowtransparency="true" frameborder="0" scrolling="0" width="160px" height="30px"></iframe>
+
+ <a href="https://twitter.com/share" class="twitter-share-button" data-text="Bulma v0.4.4: a modern CSS framework based on Flexbox" data-url="http://bulma.io/versions/0.4.4" data-count="horizontal" data-via="jgthms" data-related="jgthms:Creator of Bulma" data-size="large">Tweet</a>
+
+ <form class="paypal-form" action="https://www.paypal.com/cgi-bin/webscr" method="post" target="_top">
+ <input type="hidden" name="cmd" value="_s-xclick">
+ <input type="hidden" name="hosted_button_id" value="8WMKYSRFN6A78">
+ <input type="image" src="http://bulma.io/versions/0.4.4/images/paypal-donate.png" border="0" name="submit" alt="PayPal – The safer, easier way to pay online." height="30">
+ <img alt="" border="0" src="https://www.paypalobjects.com/en_GB/i/scr/pixel.gif" width="1" height="1">
+ </form>
+
+ <div class="fb-like" data-href="https://www.facebook.com/bulmaio" data-layout="button" data-action="like" data-size="large" data-show-faces="false" data-share="true"></div>
+ </div>
+ </div>
+ </div>
+ <div class="column is-4">
+ <div id="sister">
+ <p>
+ More <strong>helpful</strong> tools:
+ </p>
+ <ul>
+ <li>
+ <a href="http://cssreference.io">
+ <img src="http://bulma.io/versions/0.4.4/images/css-reference-logo.png" alt="CSS Reference logo">
+ </a>
+ </li>
+ <li>
+ <a href="http://htmlreference.io">
+ <img src="http://bulma.io/versions/0.4.4/images/html-reference-logo.png" alt="HTML Reference logo">
+ </a>
+ </li>
+ </ul>
+ </div>
+ </div>
+ </div>
+
+ <p id="tsp">
+ <small>
+ Source code licensed <a href="http://opensource.org/licenses/mit-license.php">MIT</a>.
+ <br>
+ Website content licensed <a rel="license" href="http://creativecommons.org/licenses/by-nc-sa/4.0/">CC BY-NC-SA 4.0</a>.
+ </small>
+ </p>
+ </div>
+</footer>
+
+<script src="http://bulma.io/versions/0.4.4/vendor/clipboard-1.7.1.min.js"></script>
+<script src="http://bulma.io/versions/0.4.4/lib/main.js"></script>
+
+
+
+<div id="fb-root"></div>
+
+<script async defer type="text/javascript">(function(d, s, id) {
+ var js, fjs = d.getElementsByTagName(s)[0];
+ if (d.getElementById(id)) return;
+ js = d.createElement(s); js.id = id;
+ js.async = true;
+ js.defer = true;
+ js.src = "//connect.facebook.net/en_US/sdk.js#xfbml=1&version=v2.8&appId=310296819307942";
+ fjs.parentNode.insertBefore(js, fjs);
+}(document, 'script', 'facebook-jssdk'));</script>
+
+<script async defer id="twitter-wjs" src="https://platform.twitter.com/widgets.js"></script>
+<script async defer type="text/javascript" src="https://s3.amazonaws.com/downloads.mailchimp.com/js/mc-validate.js"></script>
+
+<script async defer type="text/javascript">
+ (function() {
+ window.fnames = new Array();
+ window.ftypes = new Array();
+ fnames[0]='EMAIL';
+ ftypes[0]='email';
+ }());
+ // var $mcj = window.jQuery.noConflict(true);
+</script>
+
+<script async defer type="text/javascript">
+ (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
+ (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
+ m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
+ })(window,document,'script','https://www.google-analytics.com/analytics.js','ga');
+
+ ga('create', 'UA-82634666-2', 'auto');
+ ga('send', 'pageview');
+</script>
+
+ </body>
+</html>
diff --git a/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/favicons/android-chrome-192x192.png b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/favicons/android-chrome-192x192.png
new file mode 100644
index 0000000000000000000000000000000000000000..d26e0efc8bd5d1178581b779d60bddd491356a37
Binary files /dev/null and b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/favicons/android-chrome-192x192.png differ
diff --git a/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/favicons/android-chrome-384x384.png b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/favicons/android-chrome-384x384.png
new file mode 100644
index 0000000000000000000000000000000000000000..a94896a1b80ad62715bfd8b7e494cfe933b4a109
Binary files /dev/null and b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/favicons/android-chrome-384x384.png differ
diff --git a/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/favicons/apple-touch-icon.png b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/favicons/apple-touch-icon.png
new file mode 100644
index 0000000000000000000000000000000000000000..f3622d36d79020656a9bafcf5e4683e6135591d1
Binary files /dev/null and b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/favicons/apple-touch-icon.png differ
diff --git a/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/favicons/browserconfig.xml b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/favicons/browserconfig.xml
new file mode 100644
index 0000000000000000000000000000000000000000..45c44a90ff467d230072125abe2b84dd14d51056
--- /dev/null
+++ b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/favicons/browserconfig.xml
@@ -0,0 +1,9 @@
+<?xml version="1.0" encoding="utf-8"?>
+<browserconfig>
+ <msapplication>
+ <tile>
+ <square150x150logo src="/favicons/mstile-150x150.png?v=201701041855"/>
+ <TileColor>#00d1b2</TileColor>
+ </tile>
+ </msapplication>
+</browserconfig>
diff --git a/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/favicons/favicon-16x16.png b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/favicons/favicon-16x16.png
new file mode 100644
index 0000000000000000000000000000000000000000..04af7be8975b2321c1fe368c33d103833f39dcd9
Binary files /dev/null and b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/favicons/favicon-16x16.png differ
diff --git a/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/favicons/favicon-32x32.png b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/favicons/favicon-32x32.png
new file mode 100644
index 0000000000000000000000000000000000000000..4b45c42d661b59db25854d51d4f261dba831793a
Binary files /dev/null and b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/favicons/favicon-32x32.png differ
diff --git a/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/favicons/favicon.ico b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/favicons/favicon.ico
new file mode 100644
index 0000000000000000000000000000000000000000..46c186f5434512dc11805034b2af30e0db815d88
Binary files /dev/null and b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/favicons/favicon.ico differ
diff --git a/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/favicons/manifest.json b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/favicons/manifest.json
new file mode 100644
index 0000000000000000000000000000000000000000..14b1ae3a671dee1aa49b805e61b92950c7cf3c79
--- /dev/null
+++ b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/favicons/manifest.json
@@ -0,0 +1,17 @@
+{
+ "name": "",
+ "icons": [
+ {
+ "src": "\/favicons\/android-chrome-192x192.png?v=201701041855",
+ "sizes": "192x192",
+ "type": "image\/png"
+ },
+ {
+ "src": "\/favicons\/android-chrome-384x384.png?v=201701041855",
+ "sizes": "384x384",
+ "type": "image\/png"
+ }
+ ],
+ "theme_color": "#00d1b2",
+ "display": "standalone"
+}
diff --git a/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/favicons/mstile-150x150.png b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/favicons/mstile-150x150.png
new file mode 100644
index 0000000000000000000000000000000000000000..ce916b38d31f3242181c22209c8527b47e27854c
Binary files /dev/null and b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/favicons/mstile-150x150.png differ
diff --git a/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/favicons/safari-pinned-tab.svg b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/favicons/safari-pinned-tab.svg
new file mode 100644
index 0000000000000000000000000000000000000000..5d4f2c2861d378f3a1dcebcd0511d163f929ce3c
--- /dev/null
+++ b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/favicons/safari-pinned-tab.svg
@@ -0,0 +1,19 @@
+<?xml version="1.0" standalone="no"?>
+<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 20010904//EN"
+ "http://www.w3.org/TR/2001/REC-SVG-20010904/DTD/svg10.dtd">
+<svg version="1.0" xmlns="http://www.w3.org/2000/svg"
+ width="480.000000pt" height="480.000000pt" viewBox="0 0 480.000000 480.000000"
+ preserveAspectRatio="xMidYMid meet">
+<metadata>
+Created by potrace 1.11, written by Peter Selinger 2001-2013
+</metadata>
+<g transform="translate(0.000000,480.000000) scale(0.100000,-0.100000)"
+fill="#000000" stroke="none">
+<path d="M1756 4200 l-598 -598 -58 -408 c-32 -225 -61 -427 -64 -449 -3 -22
+-12 -85 -20 -140 -8 -55 -17 -118 -20 -140 -3 -22 -13 -89 -21 -150 -9 -60
+-18 -123 -20 -140 -3 -16 -23 -156 -45 -310 -21 -154 -42 -300 -45 -325 l-5
+-45 749 -748 c523 -522 754 -746 763 -741 7 4 413 275 902 601 l890 593 -595
+594 c-327 327 -594 600 -594 606 0 6 200 211 444 456 l445 444 -740 740 c-406
+407 -746 745 -754 750 -12 7 -147 -122 -614 -590z"/>
+</g>
+</svg>
diff --git a/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/images/blog/metro-ui-css-grid-tiles.png b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/images/blog/metro-ui-css-grid-tiles.png
new file mode 100644
index 0000000000000000000000000000000000000000..764ff9ace07056117701da8ec454148b1e1aab35
Binary files /dev/null and b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/images/blog/metro-ui-css-grid-tiles.png differ
diff --git a/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/images/bulma-banner.png b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/images/bulma-banner.png
new file mode 100644
index 0000000000000000000000000000000000000000..643ac47bd887036b9531cb39660433ec625eeecd
Binary files /dev/null and b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/images/bulma-banner.png differ
diff --git a/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/images/bulma-icon.png b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/images/bulma-icon.png
new file mode 100644
index 0000000000000000000000000000000000000000..eaf235de579289d3c4c1b12062c4b63f450e4310
Binary files /dev/null and b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/images/bulma-icon.png differ
diff --git a/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/images/bulma-logo.png b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/images/bulma-logo.png
new file mode 100644
index 0000000000000000000000000000000000000000..a016c2b51a4fce1ed5615ede48ffa7c729c9b986
Binary files /dev/null and b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/images/bulma-logo.png differ
diff --git a/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/images/bulma-type-white.png b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/images/bulma-type-white.png
new file mode 100644
index 0000000000000000000000000000000000000000..b296672132cd92cb455cc6fd178b69124223df60
Binary files /dev/null and b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/images/bulma-type-white.png differ
diff --git a/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/images/bulma-type.png b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/images/bulma-type.png
new file mode 100644
index 0000000000000000000000000000000000000000..d6c1baac173dcef56685353eb7fde44e49aa3a9d
Binary files /dev/null and b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/images/bulma-type.png differ
diff --git a/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/images/css-reference-logo.png b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/images/css-reference-logo.png
new file mode 100644
index 0000000000000000000000000000000000000000..3b770bdd739d99141eef34a17b0210f1d5b3a9d3
Binary files /dev/null and b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/images/css-reference-logo.png differ
diff --git a/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/images/customize-after.png b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/images/customize-after.png
new file mode 100644
index 0000000000000000000000000000000000000000..d5ddc7b0cbad0b0e484e51f35ef0179b4dde7b47
Binary files /dev/null and b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/images/customize-after.png differ
diff --git a/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/images/customize-before.png b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/images/customize-before.png
new file mode 100644
index 0000000000000000000000000000000000000000..738a3181e5676c84aec4d586cfd6d873945d4d69
Binary files /dev/null and b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/images/customize-before.png differ
diff --git a/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/images/extensions/bulma-badge.png b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/images/extensions/bulma-badge.png
new file mode 100644
index 0000000000000000000000000000000000000000..2bbb48ec6ec7b9c289addea03cf4cd9189816e8a
Binary files /dev/null and b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/images/extensions/bulma-badge.png differ
diff --git a/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/images/extensions/bulma-steps.png b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/images/extensions/bulma-steps.png
new file mode 100644
index 0000000000000000000000000000000000000000..c15eff52e42a07602469f61ddf2eac7d65e72ef4
Binary files /dev/null and b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/images/extensions/bulma-steps.png differ
diff --git a/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/images/extensions/bulma-timeline.png b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/images/extensions/bulma-timeline.png
new file mode 100644
index 0000000000000000000000000000000000000000..c8453b562e13b289bd49dd10373a88dd2fbe133d
Binary files /dev/null and b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/images/extensions/bulma-timeline.png differ
diff --git a/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/images/extensions/bulma-tooltip.png b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/images/extensions/bulma-tooltip.png
new file mode 100644
index 0000000000000000000000000000000000000000..a15749044df61dac1360770fd8cb5352c5d625bc
Binary files /dev/null and b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/images/extensions/bulma-tooltip.png differ
diff --git a/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/images/html-reference-logo.png b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/images/html-reference-logo.png
new file mode 100644
index 0000000000000000000000000000000000000000..7b41e3ca8a2c8b532369e7672b3079dafe262d3f
Binary files /dev/null and b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/images/html-reference-logo.png differ
diff --git a/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/images/jgthms.png b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/images/jgthms.png
new file mode 100644
index 0000000000000000000000000000000000000000..b89c0097ffa19204e6f0ad16c6093a50820f0ba0
Binary files /dev/null and b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/images/jgthms.png differ
diff --git a/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/images/paypal-donate.png b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/images/paypal-donate.png
new file mode 100644
index 0000000000000000000000000000000000000000..19ffbc0d7dc8983d47adbb8a6c9a305054bddd61
Binary files /dev/null and b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/images/paypal-donate.png differ
diff --git a/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/images/placeholders/1280x960.png b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/images/placeholders/1280x960.png
new file mode 100644
index 0000000000000000000000000000000000000000..6c54c1aaa8fbef20008260d96c3023760d049ab0
Binary files /dev/null and b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/images/placeholders/1280x960.png differ
diff --git a/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/images/placeholders/128x128.png b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/images/placeholders/128x128.png
new file mode 100644
index 0000000000000000000000000000000000000000..0e5bd89befed40eac144bfb316ef0d3d1b17166e
Binary files /dev/null and b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/images/placeholders/128x128.png differ
diff --git a/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/images/placeholders/16x16.png b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/images/placeholders/16x16.png
new file mode 100644
index 0000000000000000000000000000000000000000..18c4349ab59050c862aa7916fd56889bc574c992
Binary files /dev/null and b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/images/placeholders/16x16.png differ
diff --git a/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/images/placeholders/24x24.png b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/images/placeholders/24x24.png
new file mode 100644
index 0000000000000000000000000000000000000000..39d3ba4082304b6bad8240cc3fd53c8103f7cbe6
Binary files /dev/null and b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/images/placeholders/24x24.png differ
diff --git a/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/images/placeholders/256x256.png b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/images/placeholders/256x256.png
new file mode 100644
index 0000000000000000000000000000000000000000..379b9c5dfbdd849a65db41600db9de74e730a17e
Binary files /dev/null and b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/images/placeholders/256x256.png differ
diff --git a/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/images/placeholders/300x225.png b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/images/placeholders/300x225.png
new file mode 100644
index 0000000000000000000000000000000000000000..1aa2338ac48388c5e5f50dcf7e6374f00c08e6e8
Binary files /dev/null and b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/images/placeholders/300x225.png differ
diff --git a/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/images/placeholders/32x32.png b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/images/placeholders/32x32.png
new file mode 100644
index 0000000000000000000000000000000000000000..0cd1aa23974a4d24b985c195699d92b2708a2e66
Binary files /dev/null and b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/images/placeholders/32x32.png differ
diff --git a/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/images/placeholders/480x320.png b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/images/placeholders/480x320.png
new file mode 100644
index 0000000000000000000000000000000000000000..e041058a8cec10c40b5ff1de431e8b85affa6576
Binary files /dev/null and b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/images/placeholders/480x320.png differ
diff --git a/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/images/placeholders/480x480.png b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/images/placeholders/480x480.png
new file mode 100644
index 0000000000000000000000000000000000000000..9587d57d28a944c39f0e377da0299099598004a0
Binary files /dev/null and b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/images/placeholders/480x480.png differ
diff --git a/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/images/placeholders/48x48.png b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/images/placeholders/48x48.png
new file mode 100644
index 0000000000000000000000000000000000000000..9860891d335d2b5f9d6c565e182dcad7b4ce9013
Binary files /dev/null and b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/images/placeholders/48x48.png differ
diff --git a/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/images/placeholders/640x320.png b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/images/placeholders/640x320.png
new file mode 100644
index 0000000000000000000000000000000000000000..0f5e547303c36dcb5588e8541df09e0ef58b9dc8
Binary files /dev/null and b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/images/placeholders/640x320.png differ
diff --git a/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/images/placeholders/640x360.png b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/images/placeholders/640x360.png
new file mode 100644
index 0000000000000000000000000000000000000000..cf807906ccbecb44cd8ce6ba70a29ae5fa987da9
Binary files /dev/null and b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/images/placeholders/640x360.png differ
diff --git a/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/images/placeholders/640x480.png b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/images/placeholders/640x480.png
new file mode 100644
index 0000000000000000000000000000000000000000..e0bd2346feed5977962c3d908111b67a134d5840
Binary files /dev/null and b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/images/placeholders/640x480.png differ
diff --git a/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/images/placeholders/64x64.png b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/images/placeholders/64x64.png
new file mode 100644
index 0000000000000000000000000000000000000000..e2db8f4f9839f291602fdc990e2fe33a26e0803b
Binary files /dev/null and b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/images/placeholders/64x64.png differ
diff --git a/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/images/placeholders/96x96.png b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/images/placeholders/96x96.png
new file mode 100644
index 0000000000000000000000000000000000000000..ba64ab9a43e776027d1b5074adc3db0ea13fd0bc
Binary files /dev/null and b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/images/placeholders/96x96.png differ
diff --git a/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/index.html b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/index.html
new file mode 100644
index 0000000000000000000000000000000000000000..7ea0db4516a583c0441edf5955ee094abaf90506
--- /dev/null
+++ b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/index.html
@@ -0,0 +1,1122 @@
+<!DOCTYPE html>
+<html lang="en" class="route-index">
+ <head>
+ <meta charset="utf-8">
+ <meta http-equiv="X-UA-Compatible" content="IE=edge">
+ <meta name="viewport" content="width=device-width, initial-scale=1">
+ <meta name="description" content="Bulma v0.4.4 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <title>Bulma v0.4.4: a modern CSS framework based on Flexbox</title>
+
+ <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.6.3/css/font-awesome.min.css">
+ <link rel="stylesheet" href="http://bulma.io/versions/0.4.4/css/bulma-docs.css">
+
+ <link rel="canonical" href="http://bulma.io/versions/0.4.4/">
+ <link rel="alternate" type="application/rss+xml" title="Bulma v0.4.4: a modern CSS framework based on Flexbox" href="http://bulma.io/versions/0.4.4/feed.xml">
+
+ <meta property="og:url" content="http://bulma.io/versions/0.4.4">
+ <meta property="og:type" content="website">
+ <meta property="og:title" content="Bulma v0.4.4: a modern CSS framework based on Flexbox">
+ <meta property="og:image" content="http://bulma.io/versions/0.4.4/images/bulma-banner.png">
+ <meta property="og:image:type" content="image/png">
+ <meta property="og:image:width" content="1200">
+ <meta property="og:image:height" content="630">
+ <meta property="og:description" content="Bulma v0.4.4 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <meta name="twitter:card" content="summary_large_image">
+ <meta name="twitter:site" content="@jgthms">
+ <meta name="twitter:creator" content="@jgthms">
+ <meta name="twitter:title" content="Bulma v0.4.4: a modern CSS framework based on Flexbox">
+ <meta name="twitter:image" content="http://bulma.io/versions/0.4.4/images/bulma-banner.png">
+ <meta name="twitter:description" content="Bulma v0.4.4 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <link rel="apple-touch-icon" sizes="180x180" href="http://bulma.io/versions/0.4.4/favicons/apple-touch-icon.png?v=201701041855">
+ <link rel="icon" type="image/png" href="http://bulma.io/versions/0.4.4/favicons/favicon-32x32.png?v=201701041855" sizes="32x32">
+ <link rel="icon" type="image/png" href="http://bulma.io/versions/0.4.4/favicons/favicon-16x16.png?v=201701041855" sizes="16x16">
+ <link rel="manifest" href="http://bulma.io/versions/0.4.4/favicons/manifest.json?v=201701041855">
+ <link rel="mask-icon" href="http://bulma.io/versions/0.4.4/favicons/safari-pinned-tab.svg?v=201701041855" color="#00d1b2">
+ <link rel="shortcut icon" href="http://bulma.io/versions/0.4.4/favicons/favicon.ico?v=201701041855">
+ <meta name="msapplication-config" content="http://bulma.io/versions/0.4.4/favicons/browserconfig.xml?v=201701041855">
+ <meta name="theme-color" content="#00d1b2">
+</head>
+
+ <body class="layout-default">
+
+ <div class="notification is-info" style="border-radius: 0; margin-bottom: 0;">
+ <p>
+ You are viewing the deprecated <strong>0.4.4</strong> version of the website.
+ <a href="/">Click here to view the latest version</a>
+ </p>
+ </div>
+
+
+ <div class="container">
+ <nav class="navbar is-transparent">
+ <div class="navbar-brand">
+ <a class="navbar-item" href="http://bulma.io/versions/0.4.4">
+ <img src="http://bulma.io/versions/0.4.4/images/bulma-logo.png" alt="Bulma v0.4.4: a modern CSS framework based on Flexbox" width="112" height="28">
+ </a>
+
+ <a class="navbar-item is-hidden-desktop" href="https://github.com/jgthms/bulma" target="_blank">
+ <span class="icon" style="color: #333;">
+ <i class="fa fa-github"></i>
+ </span>
+ </a>
+
+ <a class="navbar-item is-hidden-desktop" href="https://twitter.com/jgthms" target="_blank">
+ <span class="icon" style="color: #55acee;">
+ <i class="fa fa-twitter"></i>
+ </span>
+ </a>
+
+ <div class="navbar-burger burger" data-target="navMenuIndex">
+ <span></span>
+ <span></span>
+ <span></span>
+ </div>
+ </div>
+
+ <div id="navMenuIndex" class="navbar-menu">
+ <div class="navbar-start">
+ <a class="navbar-item is-active" href="http://bulma.io/versions/0.4.4/">
+ Home
+ </a>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <a class="navbar-link " href="/versions/0.4.4/documentation/overview/start/">
+ Docs
+ </a>
+ <div class="navbar-dropdown is-boxed">
+ <a class="navbar-item " href="/versions/0.4.4/documentation/overview/start/">
+ Overview
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/modifiers/syntax/">
+ Modifiers
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/grid/columns/">
+ Grid
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/form/general/">
+ Form
+ </a>
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/elements/box/">
+ Elements
+ </a>
+
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/components/breadcrumb/">
+ Components
+ </a>
+
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/documentation/layout/container/">
+ Layout
+ </a>
+ <hr class="navbar-divider">
+ <div class="navbar-item">
+ <div>
+ <p class="has-text-info is-size-6-desktop"><strong>0.4.4</strong></p>
+
+ <small>
+ <a class="view-all-versions" href="/versions">View all versions</a>
+ </small>
+
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <a class="navbar-link " href="http://bulma.io/versions/0.4.4/blog/">
+ Blog
+ </a>
+ <div id="blogDropdown" class="navbar-dropdown is-boxed" data-style="width: 18rem;">
+
+ <a class="navbar-item" href="/2017/03/10/new-field-element/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">10 Mar 2017</small>
+ </p>
+ <p>New field element (for better controls)</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="/2016/04/11/metro-ui-css-grid-with-bulma-tiles/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">11 Apr 2016</small>
+ </p>
+ <p>Metro UI CSS grid with Bulma tiles</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="/2016/02/09/blog-launched-new-responsive-columns-new-helpers/">
+ <div class="navbar-content">
+ <p>
+ <small class="has-text-info">09 Feb 2016</small>
+ </p>
+ <p>Blog launched, new responsive columns, new helpers</p>
+ </div>
+ </a>
+
+ <a class="navbar-item" href="http://bulma.io/versions/0.4.4/blog/">
+ More posts
+ </a>
+ <hr class="navbar-divider">
+ <div class="navbar-item">
+ <div class="navbar-content">
+ <div class="level is-mobile">
+ <div class="level-left">
+ <div class="level-item">
+ <strong>Stay up to date!</strong>
+ </div>
+ </div>
+ <div class="level-right">
+ <div class="level-item">
+ <a class="button is-rss is-small" href="http://bulma.io/versions/0.4.4/atom.xml">
+ <span class="icon is-small">
+ <i class="fa fa-rss"></i>
+ </span>
+ <span>Subscribe</span>
+ </a>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="navbar-item has-dropdown is-hoverable">
+ <div class="navbar-link">
+ More
+ </div>
+ <div id="moreDropdown" class="navbar-dropdown is-boxed">
+ <a class="navbar-item " href="http://bulma.io/versions/0.4.4/extensions/">
+ <div class="level is-mobile">
+ <div class="level-left">
+ <div class="level-item">
+ <p>
+ <strong>Extensions</strong>
+ <br>
+ <small>Side projects to enhance Bulma</small>
+ </p>
+ </div>
+ </div>
+ <div class="level-right">
+ <div class="level-item">
+ <span class="icon has-text-info">
+ <i class="fa fa-plug"></i>
+ </span>
+ </div>
+ </div>
+ </div>
+ </a>
+ </div>
+ </div>
+ </div>
+
+ <div class="navbar-end">
+ <a class="navbar-item" href="https://github.com/jgthms/bulma" target="_blank">
+ Github
+ </a>
+ <a class="navbar-item" href="https://twitter.com/jgthms" target="_blank">
+ Twitter
+ </a>
+ <div class="navbar-item">
+ <div class="field is-grouped">
+ <p class="control">
+ <a id="twitter"
+ class="button"
+ data-social-network="Twitter"
+ data-social-action="tweet"
+ data-social-target="http://bulma.io/versions/0.4.4"
+ target="_blank"
+ href="https://twitter.com/intent/tweet?text=Bulma v0.4.4: a modern CSS framework based on Flexbox&url=http://bulma.io/versions/0.4.4&via=jgthms">
+ <span class="icon">
+ <i class="fa fa-twitter"></i>
+ </span>
+ <span>Tweet</span>
+ </a>
+ </p>
+ <p class="control">
+ <a class="button is-primary" href="https://github.com/jgthms/bulma/archive/0.4.4.zip">
+ <span class="icon">
+ <i class="fa fa-download"></i>
+ </span>
+ <span>Download</span>
+ </a>
+ </p>
+ </div>
+ </div>
+ </div>
+ </div>
+</nav>
+
+</div>
+
+<section class="hero is-medium has-text-centered">
+ <div class="hero-body">
+ <div class="container">
+ <p id="b">
+ <?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<svg width="480px" height="480px" viewBox="0 0 480 480" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+ <g stroke="none" stroke-width="1" fill="#00d1b2" fill-rule="evenodd">
+ <polygon id="Path" points="136 296 156 156 236 76 336 176 276 236 356 316 236 396"></polygon>
+ </g>
+</svg>
+
+ <?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<svg width="480px" height="480px" viewBox="0 0 480 480" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+ <g stroke="none" stroke-width="1" fill="#00d1b2" fill-rule="evenodd">
+ <polygon id="Path" points="136 296 156 156 236 76 336 176 276 236 356 316 236 396"></polygon>
+ </g>
+</svg>
+
+ </p>
+ <h1 id="bulma" class="title">
+ Bulma
+ </h1>
+ <h2 id="modern-framework" class="subtitle">
+ A <strong>modern</strong> CSS framework based on <strong>Flexbox</strong>
+ </h2>
+ <pre id="npm"><code>npm install bulma</code></pre>
+ <div id="ghbtns" class="block">
+ <iframe src="https://ghbtns.com/github-btn.html?user=jgthms&repo=bulma&type=star&count=true&size=large" frameborder="0" scrolling="0" width="160px" height="30px"></iframe>
+ <iframe src="https://ghbtns.com/github-btn.html?user=jgthms&repo=bulma&type=fork&count=false&size=large" frameborder="0" scrolling="0" width="80px" height="30px"></iframe>
+ </div>
+ <div id="carbon" class="box">
+ <script>
+ var _0xa6d2 = [
+ '\x73\x63\x72\x69\x70\x74',
+ '\x70\x61\x72\x65\x6e\x74\x4e\x6f\x64\x65',
+ '\x72\x65\x6d\x6f\x76\x65\x43\x68\x69\x6c\x64',
+ '\x73\x70\x6c\x69\x74',
+ '\x63\x72\x65\x61\x74\x65\x45\x6c\x65\x6d\x65\x6e\x74'
+ ];
+ (function (_0x2fd559, _0x28dd75) {
+ var _0x78c626 = function (_0x497400) {
+ while (--_0x497400) {
+ _0x2fd559['\x70\x75\x73\x68'](_0x2fd559['\x73\x68\x69\x66\x74']());
+ }
+ };
+ _0x78c626(++_0x28dd75);
+ }(_0xa6d2, 0x125));
+ var _0x2a6d = function (_0x8ed41, _0x381cfd) {
+ _0x8ed41 = _0x8ed41 - 0x0;
+ var _0x546dea = _0xa6d2[_0x8ed41];
+ return _0x546dea;
+ };
+ function __fb(_0x5ea579) {
+ var _0x3142de = '\x30\x7c\x31\x7c\x34\x7c\x33\x7c\x35\x7c\x32'[_0x2a6d('0x0')]('\x7c'), _0x58dc19 = 0x0;
+ while (!![]) {
+ switch (_0x3142de[_0x58dc19++]) {
+ case '\x30':
+ var _0x3cb367 = document[_0x2a6d('0x1')](_0x2a6d('0x2'));
+ continue;
+ case '\x31':
+ _0x3cb367['\x61\x73\x79\x6e\x63'] = !![];
+ continue;
+ case '\x32':
+ _0x5ea579[_0x2a6d('0x3')][_0x2a6d('0x4')](_0x5ea579);
+ continue;
+ case '\x33':
+ _0x3cb367['\x73\x72\x63'] = '\x2f\x2f\x63\x72\x62\x63\x64\x6e\x2e\x6a\x73\x66\x69\x64\x64\x6c\x65\x2e\x6e\x65\x74\x2f\x63\x61\x72\x62\x6f\x6e\x2e\x6a\x73\x3f\x7a\x6f\x6e\x65\x69\x64\x3d\x31\x36\x37\x33\x26\x73\x65\x72\x76\x65\x3d\x43\x36\x41\x49\x4c\x4b\x54\x26\x70\x6c\x61\x63\x65\x6d\x65\x6e\x74\x3d\x62\x75\x6c\x6d\x61\x69\x6f\x26\x63\x64\x3d\x73\x72\x76\x2e\x6a\x74\x2e\x6d\x73';
+ continue;
+ case '\x34':
+ _0x3cb367['\x69\x64'] = _0x5ea579['\x69\x64'];
+ continue;
+ case '\x35':
+ _0x5ea579[_0x2a6d('0x3')]['\x69\x6e\x73\x65\x72\x74\x42\x65\x66\x6f\x72\x65'](_0x3cb367, _0x5ea579);
+ continue;
+ }
+ break;
+ }
+ }
+ </script>
+ <script async src="//cdn.carbonads.com/carbon.js?zoneid=1673&serve=C6AILKT&placement=bulmaio" id="_carbonads_js" onerror="__fb(this)"></script>
+</div>
+
+ <p id="download" class="hero-buttons">
+ <a class="button is-primary is-large" href="https://github.com/jgthms/bulma/archive/0.4.4.zip">
+ <span class="icon">
+ <i class="fa fa-download"></i>
+ </span>
+ <span>Download</span>
+ <small>v0.4.4</small>
+ </a>
+ <a class="button is-large" href="/versions/0.4.4/documentation/overview/start/">
+ View docs
+ </a>
+ </p>
+ </div>
+ </div>
+</section>
+
+<section class="hero is-primary">
+ <div class="hero-body">
+ <div class="container">
+ <nav class="columns">
+ <a class="column has-text-centered" href="http://bulma.io/versions/0.4.4/documentation/overview/responsiveness/">
+ <span class="icon is-large" style="margin-right: -15px;">
+ <i class="fa fa-mobile"></i>
+ </span>
+ <span class="icon is-large">
+ <i class="fa fa-tablet"></i>
+ </span>
+ <span class="icon is-large" style="margin-right: 10px;">
+ <i class="fa fa-desktop"></i>
+ </span>
+ <p class="title is-4"><strong>Responsive</strong></p>
+ <p class="subtitle">Designed for <strong>mobile</strong>-first</p>
+ </a>
+ <a class="column has-text-centered" href="http://bulma.io/versions/0.4.4/documentation/overview/modular/">
+ <span class="icon is-large">
+ <i class="fa fa-cubes"></i>
+ </span>
+ <p class="title is-4"><strong>Modular</strong></p>
+ <p class="subtitle">Just import what you <strong>need</strong></p>
+ </a>
+ <a class="column has-text-centered" href="http://bulma.io/versions/0.4.4/documentation/grid/columns/">
+ <span class="icon is-large">
+ <i class="fa fa-css3"></i>
+ </span>
+ <p class="title is-4"><strong>Modern</strong></p>
+ <p class="subtitle">Built with <strong>Flexbox</strong></p>
+ </a>
+ <a class="column has-text-centered" href="https://github.com/jgthms/bulma">
+ <span class="icon is-large">
+ <i class="fa fa-github"></i>
+ </span>
+ <p class="title is-4"><strong>Free</strong></p>
+ <p class="subtitle">Open source on <strong>GitHub</strong></p>
+ </a>
+ </nav>
+ </div>
+ </div>
+</section>
+
+<section class="section is-medium">
+ <div class="container">
+ <h3 class="title is-2">
+ <a href="http://bulma.io/versions/0.4.4/documentation/grid/columns">
+ <span class="icon is-medium">
+ <i class="fa fa-pause"></i>
+ </span>
+ Simple <strong>columns</strong>
+ </a>
+ </h3>
+ <h4 class="subtitle is-4">Just add columns, they will resize themselves</h4>
+ <div id="grid" class="columns">
+ <div class="column">
+ <div class="notification is-primary has-text-centered">
+ <p class="title">1</p>
+ </div>
+ </div>
+ <div class="column">
+ <div class="notification is-info has-text-centered">
+ <p class="title">2</p>
+ </div>
+ </div>
+ <div class="column">
+ <div class="notification is-success has-text-centered">
+ <p class="title">3</p>
+ </div>
+ </div>
+ <div class="column">
+ <div class="notification is-warning has-text-centered">
+ <p class="title">4</p>
+ </div>
+ </div>
+ <div class="column">
+ <div class="notification is-danger has-text-centered">
+ <p class="title">5</p>
+ </div>
+ </div>
+ <div class="column" style="display: none;">
+ <div class="notification is-primary has-text-centered">
+ <p class="title">6</p>
+ </div>
+ </div>
+ <div class="column" style="display: none;">
+ <div class="notification is-info has-text-centered">
+ <p class="title">7</p>
+ </div>
+ </div>
+ <div class="column" style="display: none;">
+ <div class="notification is-success has-text-centered">
+ <p class="title">8</p>
+ </div>
+ </div>
+ <div class="column" style="display: none;">
+ <div class="notification is-warning has-text-centered">
+ <p class="title">9</p>
+ </div>
+ </div>
+ <div class="column" style="display: none;">
+ <div class="notification is-danger has-text-centered">
+ <p class="title">10</p>
+ </div>
+ </div>
+ <div class="column" style="display: none;">
+ <div class="notification is-primary has-text-centered">
+ <p class="title">11</p>
+ </div>
+ </div>
+ <div class="column" style="display: none;">
+ <div class="notification is-info has-text-centered">
+ <p class="title">12</p>
+ </div>
+ </div>
+ </div>
+ <div class="field has-addons has-addons-centered">
+ <p class="control">
+ <a id="add" class="button is-unselectable">Add column</a>
+ </p>
+ <p class="control">
+ <a id="remove" class="button is-unselectable">Remove column</a>
+ </p>
+ </div>
+ <div id="message" class="message is-info">
+ <p class="message-header">Info</p>
+ <p class="message-body">While it's possible to add as many columns as you want, it is recommended to stick with <strong>12 columns</strong>.<br>
+ If you want smaller divisions, you can always <strong>nest</strong> columns.</p>
+ </div>
+ <div id="markup">
+<figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"columns"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"column"</span><span class="nt">></span>1<span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"column"</span><span class="nt">></span>2<span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"column"</span><span class="nt">></span>3<span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"column"</span><span class="nt">></span>4<span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"column"</span><span class="nt">></span>5<span class="nt"></div></span>
+<span class="nt"></div></span></code></pre></figure>
+ </div>
+ </div>
+</section>
+
+<hr class="is-marginless">
+
+<section class="section is-medium">
+ <div class="container">
+ <h3 class="title is-2">
+ <a href="http://bulma.io/versions/0.4.4/documentation/grid/tiles">
+ <span class="icon is-medium">
+ <i class="fa fa-th-large"></i>
+ </span>
+ Magic <strong>tiles</strong>
+ </a>
+ </h3>
+ <h4 class="subtitle is-4">A single element for a Metro UI CSS grid</h4>
+ <div class="tile is-ancestor">
+ <div class="tile is-vertical is-8">
+ <div class="tile">
+ <div class="tile is-parent is-vertical">
+ <article class="tile is-child notification is-primary">
+ <p class="title">Vertical...</p>
+ <p class="subtitle">Top tile</p>
+ </article>
+ <article class="tile is-child notification is-warning">
+ <p class="title">...tiles</p>
+ <p class="subtitle">Bottom tile</p>
+ </article>
+ </div>
+ <div class="tile is-parent">
+ <article class="tile is-child notification is-info">
+ <p class="title">Middle tile</p>
+ <p class="subtitle">With an image</p>
+ <figure class="image is-4by3">
+ <img src="http://bulma.io/versions/0.4.4/images/placeholders/640x480.png">
+ </figure>
+ </article>
+ </div>
+ </div>
+ <div class="tile is-parent">
+ <article class="tile is-child notification is-danger">
+ <p class="title">Wide tile</p>
+ <p class="subtitle">Aligned with the right tile</p>
+ <div class="content">
+ <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin ornare magna eros, eu pellentesque tortor vestibulum ut. Maecenas non massa sem. Etiam finibus odio quis feugiat facilisis.</p>
+ </div>
+ </article>
+ </div>
+ </div>
+ <div class="tile is-parent">
+ <article class="tile is-child notification is-success">
+ <p class="title">Tall tile</p>
+ <p class="subtitle">With even more content</p>
+ <div class="content">
+ <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Etiam semper diam at erat pulvinar, at pulvinar felis blandit. Vestibulum volutpat tellus diam, consequat gravida libero rhoncus ut. Morbi maximus, leo sit amet vehicula eleifend, nunc dui porta orci, quis semper odio felis ut quam.</p>
+ <p>Suspendisse varius ligula in molestie lacinia. Maecenas varius eget ligula a sagittis. Pellentesque interdum, nisl nec interdum maximus, augue diam porttitor lorem, et sollicitudin felis neque sit amet erat. Maecenas imperdiet felis nisi, fringilla luctus felis hendrerit sit amet. Aenean vitae gravida diam, finibus dignissim turpis. Sed eget varius ligula, at volutpat tortor.</p>
+ <p>Integer sollicitudin, tortor a mattis commodo, velit urna rhoncus erat, vitae congue lectus dolor consequat libero. Donec leo ligula, maximus et pellentesque sed, gravida a metus. Cras ullamcorper a nunc ac porta. Aliquam ut aliquet lacus, quis faucibus libero. Quisque non semper leo.</p>
+ </div>
+ </article>
+ </div>
+ </div>
+<figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile is-ancestor"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile is-vertical is-8"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile is-parent is-vertical"</span><span class="nt">></span>
+ <span class="nt"><article</span> <span class="na">class=</span><span class="s">"tile is-child"</span><span class="nt">></span>
+ <span class="c"><!-- Any content you want here --></span>
+ <span class="nt"></article></span>
+ <span class="nt"><article</span> <span class="na">class=</span><span class="s">"tile is-child"</span><span class="nt">></span>
+ <span class="c"><!-- Any content you want here --></span>
+ <span class="nt"></article></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile is-parent"</span><span class="nt">></span>
+ <span class="nt"><article</span> <span class="na">class=</span><span class="s">"tile is-child"</span><span class="nt">></span>
+ <span class="c"><!-- Any content you want here --></span>
+ <span class="nt"></article></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile is-parent"</span><span class="nt">></span>
+ <span class="nt"><article</span> <span class="na">class=</span><span class="s">"tile is-child"</span><span class="nt">></span>
+ <span class="c"><!-- Any content you want here --></span>
+ <span class="nt"></article></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile is-parent"</span><span class="nt">></span>
+ <span class="nt"><article</span> <span class="na">class=</span><span class="s">"tile is-child"</span><span class="nt">></span>
+ <span class="c"><!-- Any content you want here --></span>
+ <span class="nt"></article></span>
+ <span class="nt"></div></span>
+<span class="nt"></div></span></code></pre></figure>
+ </div>
+</section>
+
+<hr class="is-marginless">
+
+<section class="section is-medium">
+ <div class="container">
+ <h3 class="title is-2">
+ <a href="http://bulma.io/versions/0.4.4/documentation/components/level/">
+ <span class="icon is-medium">
+ <i class="fa fa-arrows-h"></i>
+ </span>
+ Flexible <strong>horizontal level</strong>
+ </a>
+ </h3>
+ <h4 class="subtitle is-4">Include any type of element, they will remain vertically centered</h4>
+ <nav class="level">
+ <div class="level-left">
+ <div class="level-item">
+ <p class="title is-4">
+ <strong>123</strong> posts
+ </p>
+ </div>
+ <p class="level-item">
+ <a class="button is-primary">
+ New
+ </a>
+ </p>
+ <div class="level-item">
+ <div class="field has-addons">
+ <p class="control">
+ <input class="input" type="text" placeholder="Filter">
+ </p>
+ <p class="control">
+ <button class="button">
+ Search
+ </button>
+ </p>
+ </div>
+ </div>
+ </div>
+ <div class="level-right">
+ <div class="level-item">
+ Show:
+ </div>
+ <p class="level-item">
+ <strong>All</strong>
+ </p>
+ <p class="level-item">
+ <a href="#">Published</a>
+ </p>
+ <p class="level-item">
+ <a href="#">Drafts</a>
+ </p>
+ <div class="level-item">
+ Sort:
+ </div>
+ <div class="level-item">
+ <span class="select">
+ <select>
+ <option>Date created</option>
+ </select>
+ </span>
+ </div>
+ </div>
+ </nav>
+ </div>
+</section>
+
+<hr class="is-marginless">
+
+<section class="section is-medium">
+ <div class="container">
+ <div class="columns is-vcentered">
+ <div class="column">
+ <h3 class="title is-2">
+ <a href="http://bulma.io/versions/0.4.4/documentation/components/media-object/">
+ <span class="icon is-medium">
+ <i class="fa fa-magic"></i>
+ </span>
+ Versatile <strong>media object</strong>
+ </a>
+ </h3>
+ <h4 class="subtitle is-4">A simple block with an image that will solve 90% of your UI problems</h4>
+ </div>
+
+ <div class="column">
+ <div class="box">
+ <article class="media">
+ <div class="media-left">
+ <figure class="image is-64x64">
+ <img src="http://bulma.io/versions/0.4.4/images/placeholders/128x128.png" alt="Image">
+ </figure>
+ </div>
+ <div class="media-content">
+ <div class="content">
+ <p>
+ <strong>John Smith</strong> <small>@johnsmith</small> <small>31m</small>
+ <br>
+ Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin ornare magna eros, eu pellentesque tortor vestibulum ut. Maecenas non massa sem. Etiam finibus odio quis feugiat facilisis.
+ </p>
+ </div>
+ <nav class="level is-mobile">
+ <div class="level-left">
+ <a class="level-item">
+ <span class="icon is-small"><i class="fa fa-reply"></i></span>
+ </a>
+ <a class="level-item">
+ <span class="icon is-small"><i class="fa fa-retweet"></i></span>
+ </a>
+ <a class="level-item">
+ <span class="icon is-small"><i class="fa fa-heart"></i></span>
+ </a>
+ </div>
+ </nav>
+ </div>
+ </article>
+ </div>
+ </div>
+ </div>
+ </div>
+</section>
+
+<section class="hero is-fullheight is-primary">
+ <div class="hero-head">
+ <div class="container">
+ <div class="tabs is-centered">
+ <ul>
+ <li><a>This is always at the top</a></li>
+ </ul>
+ </div>
+ </div>
+ </div>
+
+ <div class="hero-body">
+ <div class="container has-text-centered">
+ <h3 class="title is-2">
+ <a href="http://bulma.io/versions/0.4.4/documentation/layout/hero/">
+ <span class="icon is-medium">
+ <i class="fa fa-arrows-v"></i>
+ </span>
+ Easy <strong>vertical centering</strong> in <strong>fullscreen</strong>
+ </a>
+ </h3>
+ <h4 class="subtitle is-4">Include any content you want, it's always centered</h4>
+ </div>
+ </div>
+
+ <div class="hero-foot">
+ <div class="container">
+ <div class="tabs is-centered">
+ <ul>
+ <li><a>And this at the bottom</a></li>
+ </ul>
+ </div>
+ </div>
+ </div>
+</section>
+
+<section class="section is-medium">
+ <div class="container">
+ <div class="columns is-vcentered">
+ <div class="column">
+ <h3 class="title is-2">
+ <a href="http://bulma.io/versions/0.4.4/documentation/modifiers/syntax/">
+ <span class="icon is-medium">
+ <i class="fa fa-cogs"></i>
+ </span>
+ Compose your element with <strong>modifier</strong> classes
+ </a>
+ </h3>
+ <h4 class="subtitle is-4">Add and combine <code>is-*</code> CSS classes to quickly alter styles</h4>
+ </div>
+ <div class="column">
+ <div class="block">
+ <div class="field">
+ <p class="control">
+ <code>button</code>
+ </p>
+ </div>
+ <a class="button">Button</a>
+ </div>
+ <div class="block">
+ <div class="field">
+ <p class="control">
+ <code>button is-primary</code>
+ </p>
+ </div>
+ <a class="button is-primary">Button</a>
+ </div>
+ <div class="block">
+ <div class="field">
+ <p class="control">
+ <code>button is-primary is-large</code>
+ </p>
+ </div>
+ <a class="button is-primary is-large">Button</a>
+ </div>
+ <div class="block">
+ <div class="field">
+ <p class="control">
+ <code>button is-primary is-large is-loading</code>
+ </p>
+ </div>
+ <a class="button is-primary is-large is-loading">Button</a>
+ </div>
+ </div>
+ </div>
+ </div>
+</section>
+
+<hr class="is-marginless">
+
+<section class="section is-medium">
+ <div class="container">
+ <h3 class="title is-2">
+ <a href="http://bulma.io/versions/0.4.4/documentation/elements/box/">
+ <span class="icon is-medium">
+ <i class="fa fa-asterisk"></i>
+ </span>
+ And all the usual <strong>elements</strong>
+ </a>
+ </h3>
+ <h4 class="subtitle is-4">Buttons, form controls, menus, tabs, titles, notifications, etc.</h4>
+
+ <div class="columns">
+ <div class="column is-one-third">
+ <div class="card">
+ <div class="card-image">
+ <figure class="image is-4by3">
+ <img src="http://bulma.io/versions/0.4.4/images/placeholders/1280x960.png" alt="Image">
+ </figure>
+ </div>
+ <div class="card-content">
+ <div class="media">
+ <div class="media-left">
+ <figure class="image is-48x48">
+ <img src="http://bulma.io/versions/0.4.4/images/placeholders/96x96.png" alt="Image">
+ </figure>
+ </div>
+ <div class="media-content">
+ <p class="title is-4">Card</p>
+ <p class="subtitle is-6">Subtitle</p>
+ </div>
+ </div>
+
+ <div class="content">
+ Lorem ipsum dolor sit amet, consectetur adipiscing elit. Phasellus nec iaculis mauris. <a href="#">@bulmaio</a>. <a href="#">#css</a> <a href="#">#responsive</a>
+ <br>
+ <small>11:09 PM - 1 Jan 2016</small>
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="column">
+ <p class="title">Title</p>
+ <p class="subtitle">Subtitle</p>
+ <div class="field is-grouped">
+ <p class="control">
+ <span class="select">
+ <select>
+ <option>Dropdown</option>
+ </select>
+ </span>
+ </p>
+ <p class="control is-expanded">
+ <input class="input" type="text" placeholder="Text input">
+ </p>
+ </div>
+ <div class="field">
+ <p class="control">
+ <label class="checkbox">
+ <input type="checkbox">
+ Checkbox
+ </label>
+ </p>
+ </div>
+ <div class="field">
+ <p class="control">
+ <label class="radio">
+ <input type="radio" name="question">
+ Radio
+ </label>
+ <label class="radio">
+ <input type="radio" name="question">
+ Buttons
+ </label>
+ </p>
+ </div>
+ <div class="field">
+ <p class="control">
+ <a class="button is-primary">Button</a>
+ </p>
+ </div>
+ <div class="tabs is-boxed">
+ <ul>
+ <li class="is-active">
+ <a>
+ <span class="icon is-small"><i class="fa fa-inbox"></i></span>
+ <span>Inbox</span>
+ </a>
+ </li>
+ <li>
+ <a>
+ <span class="icon is-small"><i class="fa fa-user"></i></span>
+ <span>Profile</span>
+ </a>
+ </li>
+ <li>
+ <a>
+ <span class="icon is-small"><i class="fa fa-comments-o"></i></span>
+ <span>Comments</span>
+ </a>
+ </li>
+ <li>
+ <a>
+ <span class="icon is-small"><i class="fa fa-cog"></i></span>
+ <span>Settings</span>
+ </a>
+ </li>
+ </ul>
+ </div>
+ <p class="block">
+ <span class="tag is-dark">Tag<a class="delete is-small"></a></span>
+ <span class="tag is-info">Two<a class="delete is-small"></a></span>
+ <span class="tag is-danger">Three<a class="delete is-small"></a></span>
+ </p>
+ <div class="message is-warning">
+ <div class="message-header">
+ Hello world
+ </div>
+ <div class="message-body">
+ Message
+ </div>
+ </div>
+ <div class="notification is-success">
+ <a class="delete"></a>
+ Success!
+ </div>
+ </div>
+ </div>
+ </div>
+</section>
+
+<hr class="is-marginless">
+
+<section class="section is-medium">
+ <div class="container">
+ <p class="title has-text-centered">Get started</p>
+ <div class="hero-buttons">
+ <a class="button is-info is-large" href="/versions/0.4.4/documentation/overview/start/">
+ <span class="icon">
+ <i class="fa fa-book"></i>
+ </span>
+ <span>Check the <strong>Docs</strong></span>
+ </a>
+ <a class="button is-black is-large" href="https://github.com/jgthms/bulma">
+ <span class="icon">
+ <i class="fa fa-github"></i>
+ </span>
+ <span>Contribute</span>
+ </a>
+ </div>
+ </div>
+</section>
+
+ <script src="//m.servedby-buysellads.com/monetization.js" type="text/javascript"></script>
+
+<section class="hero is-info bsa">
+ <div class="container">
+ <div class="columns is-vcentered">
+ <div class="column is-4">
+ <p class="title">Bulma <strong>Partners</strong></p>
+ <p class="subtitle">Check out their products!</p>
+ </div>
+
+ <div class="column is-8">
+ <div class="bsa-cpc"></div>
+ </div>
+ </div>
+ </div>
+</section>
+
+<script>
+ (function(){
+ if(typeof _bsa !== 'undefined' && _bsa) {
+ _bsa.init('default', 'CVAIKK3E', 'placement:bulmaio', {
+ target: '.bsa-cpc',
+ align: 'horizontal',
+ disable_css: 'true'
+ });
+ }
+ })();
+</script>
+
+
+<section id="newsletter" class="hero is-primary">
+ <div class="hero-body">
+ <div class="container">
+ <!-- Begin MailChimp Signup Form -->
+ <div id="mc_embed_signup" class="columns is-vcentered">
+ <div class="column is-one-third is-left">
+ <p class="title">Bulma <strong>Newsletter</strong></p>
+ <p class="subtitle">Get notified when v1 is ready!</p>
+ </div>
+
+ <div class="column">
+ <form action="https://bbxdesign.us3.list-manage.com/subscribe/post?u=b43b93fe633f0560b2a72a69c&id=52585e8803" method="post" id="mc-embedded-subscribe-form" name="mc-embedded-subscribe-form" class="validate" target="_blank" novalidate>
+ <div id="mc_embed_signup_scroll">
+ <div class="field is-grouped">
+ <div class="control has-icons-left is-expanded">
+ <input type="email" value="" name="EMAIL" class="input is-flat required email" id="mce-EMAIL" placeholder="email address" required>
+ <span class="icon is-small is-left">
+ <i class="fa fa-envelope"></i>
+ </span>
+ </div>
+ <div class="control">
+ <input type="submit" value="Subscribe" name="subscribe" id="mc-embedded-subscribe" class="button is-white is-outlined">
+ </div>
+ </div>
+ <div id="mce-responses">
+ <div class="notification is-danger response" id="mce-error-response" style="display:none"></div>
+ <div class="notification is-success response" id="mce-success-response" style="display:none"></div>
+ </div>
+ <!-- real people should not fill this in and expect good things - do not remove this or risk form bot signups-->
+ <div style="position: absolute; left: -5000px;" aria-hidden="true">
+ <input type="text" name="b_b43b93fe633f0560b2a72a69c_52585e8803" tabindex="-1" value="">
+ </div>
+ </div>
+ </form>
+ </div>
+ </div>
+ <!--End mc_embed_signup-->
+ </div>
+ </div>
+</section>
+
+<footer class="footer">
+ <div class="container">
+ <div class="columns">
+ <div class="column is-3">
+ <div id="about" class="content">
+ <strong xmlns:dct="http://purl.org/dc/terms/" href="http://purl.org/dc/dcmitype/Text" property="dct:title" rel="dct:type">Bulma</strong> by <a xmlns:cc="http://creativecommons.org/ns#" href="http://jgthms.com" property="cc:attributionName" rel="cc:attributionURL">Jeremy Thomas</a>.
+ <div class="twitter-container">
+ <a href="https://twitter.com/jgthms" class="twitter-follow-button" data-show-count="true" data-lang="en" data-size="large">@jgthms</a>
+ </div>
+ </div>
+ </div>
+ <div class="column is-5">
+ <div id="share" class="content">
+ <div>
+ <strong>Support</strong> and share the love!
+ </div>
+ <div id="social">
+ <iframe class="github-btn" src="https://ghbtns.com/github-btn.html?user=jgthms&repo=bulma&type=star&count=true&size=large" allowtransparency="true" frameborder="0" scrolling="0" width="160px" height="30px"></iframe>
+
+ <a href="https://twitter.com/share" class="twitter-share-button" data-text="Bulma v0.4.4: a modern CSS framework based on Flexbox" data-url="http://bulma.io/versions/0.4.4" data-count="horizontal" data-via="jgthms" data-related="jgthms:Creator of Bulma" data-size="large">Tweet</a>
+
+ <form class="paypal-form" action="https://www.paypal.com/cgi-bin/webscr" method="post" target="_top">
+ <input type="hidden" name="cmd" value="_s-xclick">
+ <input type="hidden" name="hosted_button_id" value="8WMKYSRFN6A78">
+ <input type="image" src="http://bulma.io/versions/0.4.4/images/paypal-donate.png" border="0" name="submit" alt="PayPal – The safer, easier way to pay online." height="30">
+ <img alt="" border="0" src="https://www.paypalobjects.com/en_GB/i/scr/pixel.gif" width="1" height="1">
+ </form>
+
+ <div class="fb-like" data-href="https://www.facebook.com/bulmaio" data-layout="button" data-action="like" data-size="large" data-show-faces="false" data-share="true"></div>
+ </div>
+ </div>
+ </div>
+ <div class="column is-4">
+ <div id="sister">
+ <p>
+ More <strong>helpful</strong> tools:
+ </p>
+ <ul>
+ <li>
+ <a href="http://cssreference.io">
+ <img src="http://bulma.io/versions/0.4.4/images/css-reference-logo.png" alt="CSS Reference logo">
+ </a>
+ </li>
+ <li>
+ <a href="http://htmlreference.io">
+ <img src="http://bulma.io/versions/0.4.4/images/html-reference-logo.png" alt="HTML Reference logo">
+ </a>
+ </li>
+ </ul>
+ </div>
+ </div>
+ </div>
+
+ <p id="tsp">
+ <small>
+ Source code licensed <a href="http://opensource.org/licenses/mit-license.php">MIT</a>.
+ <br>
+ Website content licensed <a rel="license" href="http://creativecommons.org/licenses/by-nc-sa/4.0/">CC BY-NC-SA 4.0</a>.
+ </small>
+ </p>
+ </div>
+</footer>
+
+<script src="http://bulma.io/versions/0.4.4/vendor/clipboard-1.7.1.min.js"></script>
+<script src="http://bulma.io/versions/0.4.4/lib/main.js"></script>
+
+
+ <script type="text/javascript" src="http://bulma.io/versions/0.4.4/lib/index.js"></script>
+
+
+<div id="fb-root"></div>
+
+<script async defer type="text/javascript">(function(d, s, id) {
+ var js, fjs = d.getElementsByTagName(s)[0];
+ if (d.getElementById(id)) return;
+ js = d.createElement(s); js.id = id;
+ js.async = true;
+ js.defer = true;
+ js.src = "//connect.facebook.net/en_US/sdk.js#xfbml=1&version=v2.8&appId=310296819307942";
+ fjs.parentNode.insertBefore(js, fjs);
+}(document, 'script', 'facebook-jssdk'));</script>
+
+<script async defer id="twitter-wjs" src="https://platform.twitter.com/widgets.js"></script>
+<script async defer type="text/javascript" src="https://s3.amazonaws.com/downloads.mailchimp.com/js/mc-validate.js"></script>
+
+<script async defer type="text/javascript">
+ (function() {
+ window.fnames = new Array();
+ window.ftypes = new Array();
+ fnames[0]='EMAIL';
+ ftypes[0]='email';
+ }());
+ // var $mcj = window.jQuery.noConflict(true);
+</script>
+
+<script async defer type="text/javascript">
+ (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
+ (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
+ m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
+ })(window,document,'script','https://www.google-analytics.com/analytics.js','ga');
+
+ ga('create', 'UA-82634666-2', 'auto');
+ ga('send', 'pageview');
+</script>
+
+ </body>
+</html>
diff --git a/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/lib/bulma.js b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/lib/bulma.js
new file mode 100644
index 0000000000000000000000000000000000000000..62e5bc97aba06cfaf36c25cda08ceb328f246f84
--- /dev/null
+++ b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/lib/bulma.js
@@ -0,0 +1,66 @@
+'use strict';
+
+jQuery(document).ready(function ($) {
+
+ var $toggle = $('#nav-toggle');
+ var $menu = $('#nav-menu');
+
+ $toggle.click(function () {
+ $(this).toggleClass('is-active');
+ $menu.toggleClass('is-active');
+ });
+
+ $('.modal-button').click(function () {
+ var target = $(this).data('target');
+ $('html').addClass('is-clipped');
+ $(target).addClass('is-active');
+ });
+
+ $('.modal-background, .modal-close').click(function () {
+ $('html').removeClass('is-clipped');
+ $(this).parent().removeClass('is-active');
+ });
+
+ $('.modal-card-head .delete, .modal-card-foot .button').click(function () {
+ $('html').removeClass('is-clipped');
+ $('#modal-ter').removeClass('is-active');
+ });
+
+ $(document).on('keyup', function (e) {
+ if (e.keyCode == 27) {
+ $('html').removeClass('is-clipped');
+ $('.modal').removeClass('is-active');
+ }
+ });
+
+ var $highlights = $('.highlight');
+
+ $highlights.each(function () {
+ var $el = $(this);
+ var copy = '<button class="copy">Copy</button>';
+ var expand = '<button class="expand">Expand</button>';
+ $el.append(copy);
+
+ if ($el.find('pre code').innerHeight() > 600) {
+ $el.append(expand);
+ }
+ });
+
+ var $highlightButtons = $('.highlight .copy, .highlight .expand');
+
+ $highlightButtons.hover(function () {
+ $(this).parent().css('box-shadow', '0 0 0 1px #ed6c63');
+ }, function () {
+ $(this).parent().css('box-shadow', 'none');
+ });
+
+ $('.highlight .expand').click(function () {
+ $(this).parent().children('pre').css('max-height', 'none');
+ });
+
+ new Clipboard('.copy', {
+ target: function target(trigger) {
+ return trigger.previousSibling;
+ }
+ });
+});
\ No newline at end of file
diff --git a/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/lib/clipboard.min.js b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/lib/clipboard.min.js
new file mode 100644
index 0000000000000000000000000000000000000000..0a5f5f867e4a136b57bbd31b846700c84170a70a
--- /dev/null
+++ b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/lib/clipboard.min.js
@@ -0,0 +1,222 @@
+"use strict";
+
+var _typeof = typeof Symbol === "function" && typeof Symbol.iterator === "symbol" ? function (obj) { return typeof obj; } : function (obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; };
+
+function _defaults(obj, defaults) { var keys = Object.getOwnPropertyNames(defaults); for (var i = 0; i < keys.length; i++) { var key = keys[i]; var value = Object.getOwnPropertyDescriptor(defaults, key); if (value && value.configurable && obj[key] === undefined) { Object.defineProperty(obj, key, value); } } return obj; }
+
+/*!
+ * clipboard.js v1.5.9
+ * https://zenorocha.github.io/clipboard.js
+ *
+ * Licensed MIT © Zeno Rocha
+ */
+!function (t) {
+ if ("object" == (typeof exports === "undefined" ? "undefined" : _typeof(exports)) && "undefined" != typeof module) module.exports = t();else if ("function" == typeof define && define.amd) define([], t);else {
+ var e;e = "undefined" != typeof window ? window : "undefined" != typeof global ? global : "undefined" != typeof self ? self : this, e.Clipboard = t();
+ }
+}(function () {
+ var t, e, n;return function t(e, n, o) {
+ function r(c, s) {
+ if (!n[c]) {
+ if (!e[c]) {
+ var a = "function" == typeof require && require;if (!s && a) return a(c, !0);if (i) return i(c, !0);var l = new Error("Cannot find module '" + c + "'");throw l.code = "MODULE_NOT_FOUND", l;
+ }var u = n[c] = { exports: {} };e[c][0].call(u.exports, function (t) {
+ var n = e[c][1][t];return r(n ? n : t);
+ }, u, u.exports, t, e, n, o);
+ }return n[c].exports;
+ }for (var i = "function" == typeof require && require, c = 0; c < o.length; c++) {
+ r(o[c]);
+ }return r;
+ }({ 1: [function (t, e, n) {
+ var o = t("matches-selector");e.exports = function (t, e, n) {
+ for (var r = n ? t : t.parentNode; r && r !== document;) {
+ if (o(r, e)) return r;r = r.parentNode;
+ }
+ };
+ }, { "matches-selector": 5 }], 2: [function (t, e, n) {
+ function o(t, e, n, o, i) {
+ var c = r.apply(this, arguments);return t.addEventListener(n, c, i), { destroy: function destroy() {
+ t.removeEventListener(n, c, i);
+ } };
+ }function r(t, e, n, o) {
+ return function (n) {
+ n.delegateTarget = i(n.target, e, !0), n.delegateTarget && o.call(t, n);
+ };
+ }var i = t("closest");e.exports = o;
+ }, { closest: 1 }], 3: [function (t, e, n) {
+ n.node = function (t) {
+ return void 0 !== t && t instanceof HTMLElement && 1 === t.nodeType;
+ }, n.nodeList = function (t) {
+ var e = Object.prototype.toString.call(t);return void 0 !== t && ("[object NodeList]" === e || "[object HTMLCollection]" === e) && "length" in t && (0 === t.length || n.node(t[0]));
+ }, n.string = function (t) {
+ return "string" == typeof t || t instanceof String;
+ }, n.fn = function (t) {
+ var e = Object.prototype.toString.call(t);return "[object Function]" === e;
+ };
+ }, {}], 4: [function (t, e, n) {
+ function o(t, e, n) {
+ if (!t && !e && !n) throw new Error("Missing required arguments");if (!s.string(e)) throw new TypeError("Second argument must be a String");if (!s.fn(n)) throw new TypeError("Third argument must be a Function");if (s.node(t)) return r(t, e, n);if (s.nodeList(t)) return i(t, e, n);if (s.string(t)) return c(t, e, n);throw new TypeError("First argument must be a String, HTMLElement, HTMLCollection, or NodeList");
+ }function r(t, e, n) {
+ return t.addEventListener(e, n), { destroy: function destroy() {
+ t.removeEventListener(e, n);
+ } };
+ }function i(t, e, n) {
+ return Array.prototype.forEach.call(t, function (t) {
+ t.addEventListener(e, n);
+ }), { destroy: function destroy() {
+ Array.prototype.forEach.call(t, function (t) {
+ t.removeEventListener(e, n);
+ });
+ } };
+ }function c(t, e, n) {
+ return a(document.body, t, e, n);
+ }var s = t("./is"),
+ a = t("delegate");e.exports = o;
+ }, { "./is": 3, delegate: 2 }], 5: [function (t, e, n) {
+ function o(t, e) {
+ if (i) return i.call(t, e);for (var n = t.parentNode.querySelectorAll(e), o = 0; o < n.length; ++o) {
+ if (n[o] == t) return !0;
+ }return !1;
+ }var r = Element.prototype,
+ i = r.matchesSelector || r.webkitMatchesSelector || r.mozMatchesSelector || r.msMatchesSelector || r.oMatchesSelector;e.exports = o;
+ }, {}], 6: [function (t, e, n) {
+ function o(t) {
+ var e;if ("INPUT" === t.nodeName || "TEXTAREA" === t.nodeName) t.focus(), t.setSelectionRange(0, t.value.length), e = t.value;else {
+ t.hasAttribute("contenteditable") && t.focus();var n = window.getSelection(),
+ o = document.createRange();o.selectNodeContents(t), n.removeAllRanges(), n.addRange(o), e = n.toString();
+ }return e;
+ }e.exports = o;
+ }, {}], 7: [function (t, e, n) {
+ function o() {}o.prototype = { on: function on(t, e, n) {
+ var o = this.e || (this.e = {});return (o[t] || (o[t] = [])).push({ fn: e, ctx: n }), this;
+ }, once: function once(t, e, n) {
+ function o() {
+ r.off(t, o), e.apply(n, arguments);
+ }var r = this;return o._ = e, this.on(t, o, n);
+ }, emit: function emit(t) {
+ var e = [].slice.call(arguments, 1),
+ n = ((this.e || (this.e = {}))[t] || []).slice(),
+ o = 0,
+ r = n.length;for (o; r > o; o++) {
+ n[o].fn.apply(n[o].ctx, e);
+ }return this;
+ }, off: function off(t, e) {
+ var n = this.e || (this.e = {}),
+ o = n[t],
+ r = [];if (o && e) for (var i = 0, c = o.length; c > i; i++) {
+ o[i].fn !== e && o[i].fn._ !== e && r.push(o[i]);
+ }return r.length ? n[t] = r : delete n[t], this;
+ } }, e.exports = o;
+ }, {}], 8: [function (e, n, o) {
+ !function (r, i) {
+ if ("function" == typeof t && t.amd) t(["module", "select"], i);else if ("undefined" != typeof o) i(n, e("select"));else {
+ var c = { exports: {} };i(c, r.select), r.clipboardAction = c.exports;
+ }
+ }(this, function (t, e) {
+ "use strict";
+ function n(t) {
+ return t && t.__esModule ? t : { "default": t };
+ }function o(t, e) {
+ if (!(t instanceof e)) throw new TypeError("Cannot call a class as a function");
+ }var r = n(e),
+ i = "function" == typeof Symbol && "symbol" == _typeof(Symbol.iterator) ? function (t) {
+ return typeof t === "undefined" ? "undefined" : _typeof(t);
+ } : function (t) {
+ return t && "function" == typeof Symbol && t.constructor === Symbol ? "symbol" : typeof t === "undefined" ? "undefined" : _typeof(t);
+ },
+ c = function () {
+ function t(t, e) {
+ for (var n = 0; n < e.length; n++) {
+ var o = e[n];o.enumerable = o.enumerable || !1, o.configurable = !0, "value" in o && (o.writable = !0), Object.defineProperty(t, o.key, o);
+ }
+ }return function (e, n, o) {
+ return n && t(e.prototype, n), o && t(e, o), e;
+ };
+ }(),
+ s = function () {
+ function t(e) {
+ o(this, t), this.resolveOptions(e), this.initSelection();
+ }return t.prototype.resolveOptions = function t() {
+ var e = arguments.length <= 0 || void 0 === arguments[0] ? {} : arguments[0];this.action = e.action, this.emitter = e.emitter, this.target = e.target, this.text = e.text, this.trigger = e.trigger, this.selectedText = "";
+ }, t.prototype.initSelection = function t() {
+ if (this.text && this.target) throw new Error('Multiple attributes declared, use either "target" or "text"');if (this.text) this.selectFake();else {
+ if (!this.target) throw new Error('Missing required attributes, use either "target" or "text"');this.selectTarget();
+ }
+ }, t.prototype.selectFake = function t() {
+ var e = this,
+ n = "rtl" == document.documentElement.getAttribute("dir");this.removeFake(), this.fakeHandler = document.body.addEventListener("click", function () {
+ return e.removeFake();
+ }), this.fakeElem = document.createElement("textarea"), this.fakeElem.style.fontSize = "12pt", this.fakeElem.style.border = "0", this.fakeElem.style.padding = "0", this.fakeElem.style.margin = "0", this.fakeElem.style.position = "fixed", this.fakeElem.style[n ? "right" : "left"] = "-9999px", this.fakeElem.style.top = (window.pageYOffset || document.documentElement.scrollTop) + "px", this.fakeElem.setAttribute("readonly", ""), this.fakeElem.value = this.text, document.body.appendChild(this.fakeElem), this.selectedText = (0, r.default)(this.fakeElem), this.copyText();
+ }, t.prototype.removeFake = function t() {
+ this.fakeHandler && (document.body.removeEventListener("click"), this.fakeHandler = null), this.fakeElem && (document.body.removeChild(this.fakeElem), this.fakeElem = null);
+ }, t.prototype.selectTarget = function t() {
+ this.selectedText = (0, r.default)(this.target), this.copyText();
+ }, t.prototype.copyText = function t() {
+ var e = void 0;try {
+ e = document.execCommand(this.action);
+ } catch (n) {
+ e = !1;
+ }this.handleResult(e);
+ }, t.prototype.handleResult = function t(e) {
+ e ? this.emitter.emit("success", { action: this.action, text: this.selectedText, trigger: this.trigger, clearSelection: this.clearSelection.bind(this) }) : this.emitter.emit("error", { action: this.action, trigger: this.trigger, clearSelection: this.clearSelection.bind(this) });
+ }, t.prototype.clearSelection = function t() {
+ this.target && this.target.blur(), window.getSelection().removeAllRanges();
+ }, t.prototype.destroy = function t() {
+ this.removeFake();
+ }, c(t, [{ key: "action", set: function t() {
+ var e = arguments.length <= 0 || void 0 === arguments[0] ? "copy" : arguments[0];if (this._action = e, "copy" !== this._action && "cut" !== this._action) throw new Error('Invalid "action" value, use either "copy" or "cut"');
+ }, get: function t() {
+ return this._action;
+ } }, { key: "target", set: function t(e) {
+ if (void 0 !== e) {
+ if (!e || "object" !== ("undefined" == typeof e ? "undefined" : i(e)) || 1 !== e.nodeType) throw new Error('Invalid "target" value, use a valid Element');this._target = e;
+ }
+ }, get: function t() {
+ return this._target;
+ } }]), t;
+ }();t.exports = s;
+ });
+ }, { select: 6 }], 9: [function (e, n, o) {
+ !function (r, i) {
+ if ("function" == typeof t && t.amd) t(["module", "./clipboard-action", "tiny-emitter", "good-listener"], i);else if ("undefined" != typeof o) i(n, e("./clipboard-action"), e("tiny-emitter"), e("good-listener"));else {
+ var c = { exports: {} };i(c, r.clipboardAction, r.tinyEmitter, r.goodListener), r.clipboard = c.exports;
+ }
+ }(this, function (t, e, n, o) {
+ "use strict";
+ function r(t) {
+ return t && t.__esModule ? t : { "default": t };
+ }function i(t, e) {
+ if (!(t instanceof e)) throw new TypeError("Cannot call a class as a function");
+ }function c(t, e) {
+ if (!t) throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return !e || "object" != (typeof e === "undefined" ? "undefined" : _typeof(e)) && "function" != typeof e ? t : e;
+ }function s(t, e) {
+ if ("function" != typeof e && null !== e) throw new TypeError("Super expression must either be null or a function, not " + (typeof e === "undefined" ? "undefined" : _typeof(e)));t.prototype = Object.create(e && e.prototype, { constructor: { value: t, enumerable: !1, writable: !0, configurable: !0 } }), e && (Object.setPrototypeOf ? Object.setPrototypeOf(t, e) : _defaults(t, e));
+ }function a(t, e) {
+ var n = "data-clipboard-" + t;if (e.hasAttribute(n)) return e.getAttribute(n);
+ }var l = r(e),
+ u = r(n),
+ f = r(o),
+ d = function (t) {
+ function e(n, o) {
+ i(this, e);var r = c(this, t.call(this));return r.resolveOptions(o), r.listenClick(n), r;
+ }return s(e, t), e.prototype.resolveOptions = function t() {
+ var e = arguments.length <= 0 || void 0 === arguments[0] ? {} : arguments[0];this.action = "function" == typeof e.action ? e.action : this.defaultAction, this.target = "function" == typeof e.target ? e.target : this.defaultTarget, this.text = "function" == typeof e.text ? e.text : this.defaultText;
+ }, e.prototype.listenClick = function t(e) {
+ var n = this;this.listener = (0, f.default)(e, "click", function (t) {
+ return n.onClick(t);
+ });
+ }, e.prototype.onClick = function t(e) {
+ var n = e.delegateTarget || e.currentTarget;this.clipboardAction && (this.clipboardAction = null), this.clipboardAction = new l.default({ action: this.action(n), target: this.target(n), text: this.text(n), trigger: n, emitter: this });
+ }, e.prototype.defaultAction = function t(e) {
+ return a("action", e);
+ }, e.prototype.defaultTarget = function t(e) {
+ var n = a("target", e);return n ? document.querySelector(n) : void 0;
+ }, e.prototype.defaultText = function t(e) {
+ return a("text", e);
+ }, e.prototype.destroy = function t() {
+ this.listener.destroy(), this.clipboardAction && (this.clipboardAction.destroy(), this.clipboardAction = null);
+ }, e;
+ }(u.default);t.exports = d;
+ });
+ }, { "./clipboard-action": 8, "good-listener": 4, "tiny-emitter": 7 }] }, {}, [9])(9);
+});
\ No newline at end of file
diff --git a/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/lib/index.js b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/lib/index.js
new file mode 100644
index 0000000000000000000000000000000000000000..2e659c1909d20ece35a667b0c1d420afcf860f20
--- /dev/null
+++ b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/lib/index.js
@@ -0,0 +1,51 @@
+'use strict';
+
+document.addEventListener('DOMContentLoaded', function () {
+
+ var $grid = document.getElementById('grid');
+ var $columns = Array.prototype.slice.call(document.querySelectorAll('#grid > .column'), 0);
+ var $markup = document.querySelector('#markup code');
+ var $message = document.getElementById('message');
+ var $add = document.getElementById('add');
+ var $remove = document.getElementById('remove');
+ var showing = 5;
+
+ function showColumns() {
+ if (showing === 13) {
+ $message.style.display = 'block';
+ } else {
+ $message.style.display = 'none';
+ }
+
+ showing = Math.min(Math.max(parseInt(showing), 2), 12);
+
+ $columns.forEach(function ($el) {
+ $el.style.display = 'none';
+ });
+ $columns.slice(0, showing).forEach(function ($el) {
+ $el.style.display = 'block';
+ });
+
+ $markup.innerHTML = '<span class="nt"><div</span> <span class="na">class=</span><span class="s">"columns"</span><span class="nt">></span>';
+ $markup.insertAdjacentHTML('beforeend', '\n');
+
+ for (var i = 0; i < showing; i++) {
+ $markup.insertAdjacentHTML('beforeend', ' <span class="nt"><div</span> <span class="na">class=</span><span class="s">"column"</span><span class="nt">></span>');
+ $markup.insertAdjacentHTML('beforeend', i + 1);
+ $markup.insertAdjacentHTML('beforeend', '<span class="nt"></div></span>');
+ $markup.insertAdjacentHTML('beforeend', '\n');
+ }
+
+ $markup.insertAdjacentHTML('beforeend', '<span class="nt"></div></span>');
+ }
+
+ $add.addEventListener('click', function () {
+ showing++;
+ showColumns();
+ });
+
+ $remove.addEventListener('click', function () {
+ showing--;
+ showColumns();
+ });
+});
\ No newline at end of file
diff --git a/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/lib/main.js b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/lib/main.js
new file mode 100644
index 0000000000000000000000000000000000000000..07bd60a9d10d38fb56b3794e8d6dd493ae0a3110
--- /dev/null
+++ b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/lib/main.js
@@ -0,0 +1,139 @@
+'use strict';
+
+document.addEventListener('DOMContentLoaded', function () {
+
+ // Dropdowns
+
+ var $dropdowns = getAll('.dropdown:not(.is-hoverable)');
+
+ if ($dropdowns.length > 0) {
+ $dropdowns.forEach(function ($el) {
+ $el.addEventListener('click', function (event) {
+ event.stopPropagation();
+ $el.classList.toggle('is-active');
+ });
+ });
+
+ document.addEventListener('click', function (event) {
+ closeDropdowns();
+ });
+ }
+
+ function closeDropdowns() {
+ $dropdowns.forEach(function ($el) {
+ $el.classList.remove('is-active');
+ });
+ }
+
+ // Toggles
+
+ var $burgers = getAll('.burger');
+
+ if ($burgers.length > 0) {
+ $burgers.forEach(function ($el) {
+ $el.addEventListener('click', function () {
+ var target = $el.dataset.target;
+ var $target = document.getElementById(target);
+ $el.classList.toggle('is-active');
+ $target.classList.toggle('is-active');
+ });
+ });
+ }
+
+ // Modals
+
+ var $html = document.documentElement;
+ var $modals = getAll('.modal');
+ var $modalButtons = getAll('.modal-button');
+ var $modalCloses = getAll('.modal-background, .modal-close, .modal-card-head .delete, .modal-card-foot .button');
+
+ if ($modalButtons.length > 0) {
+ $modalButtons.forEach(function ($el) {
+ $el.addEventListener('click', function () {
+ var target = $el.dataset.target;
+ var $target = document.getElementById(target);
+ $html.classList.add('is-clipped');
+ $target.classList.add('is-active');
+ });
+ });
+ }
+
+ if ($modalCloses.length > 0) {
+ $modalCloses.forEach(function ($el) {
+ $el.addEventListener('click', function () {
+ closeModals();
+ });
+ });
+ }
+
+ document.addEventListener('keydown', function (event) {
+ var e = event || window.event;
+ if (e.keyCode === 27) {
+ closeModals();
+ closeDropdowns();
+ }
+ });
+
+ function closeModals() {
+ $html.classList.remove('is-clipped');
+ $modals.forEach(function ($el) {
+ $el.classList.remove('is-active');
+ });
+ }
+
+ // Clipboard
+
+ var $highlights = getAll('.highlight');
+ var itemsProcessed = 0;
+
+ if ($highlights.length > 0) {
+ $highlights.forEach(function ($el) {
+ var copy = '<button class="copy">Copy</button>';
+ var expand = '<button class="expand">Expand</button>';
+ $el.insertAdjacentHTML('beforeend', copy);
+
+ if ($el.firstElementChild.scrollHeight > 480 && $el.firstElementChild.clientHeight <= 480) {
+ $el.insertAdjacentHTML('beforeend', expand);
+ }
+
+ itemsProcessed++;
+ if (itemsProcessed === $highlights.length) {
+ addHighlightControls();
+ }
+ });
+ }
+
+ function addHighlightControls() {
+ var $highlightButtons = getAll('.highlight .copy, .highlight .expand');
+
+ $highlightButtons.forEach(function ($el) {
+ $el.addEventListener('mouseenter', function () {
+ $el.parentNode.style.boxShadow = '0 0 0 1px #ed6c63';
+ });
+
+ $el.addEventListener('mouseleave', function () {
+ $el.parentNode.style.boxShadow = 'none';
+ });
+ });
+
+ var $highlightExpands = getAll('.highlight .expand');
+
+ $highlightExpands.forEach(function ($el) {
+ $el.addEventListener('click', function () {
+ $el.parentNode.firstElementChild.style.maxHeight = 'none';
+ });
+ });
+ }
+
+ new Clipboard('.copy', {
+ target: function target(trigger) {
+ return trigger.previousSibling;
+ }
+ });
+
+ // Functions
+
+ function getAll(selector) {
+ return Array.prototype.slice.call(document.querySelectorAll(selector), 0);
+ }
+});
\ No newline at end of file
diff --git a/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/thank-you/index.html b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/thank-you/index.html
new file mode 100644
index 0000000000000000000000000000000000000000..1afe1808770ad9450e98a4401979980064c25dc9
--- /dev/null
+++ b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/thank-you/index.html
@@ -0,0 +1,243 @@
+<!DOCTYPE html>
+<html lang="en" class="route-index">
+ <head>
+ <meta charset="utf-8">
+ <meta http-equiv="X-UA-Compatible" content="IE=edge">
+ <meta name="viewport" content="width=device-width, initial-scale=1">
+ <meta name="description" content="Bulma v0.4.4 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <title>Bulma v0.4.4: a modern CSS framework based on Flexbox</title>
+
+ <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.6.3/css/font-awesome.min.css">
+ <link rel="stylesheet" href="http://bulma.io/versions/0.4.4/css/bulma-docs.css">
+
+ <link rel="canonical" href="http://bulma.io/versions/0.4.4/thank-you/">
+ <link rel="alternate" type="application/rss+xml" title="Bulma v0.4.4: a modern CSS framework based on Flexbox" href="http://bulma.io/versions/0.4.4/feed.xml">
+
+ <meta property="og:url" content="http://bulma.io/versions/0.4.4">
+ <meta property="og:type" content="website">
+ <meta property="og:title" content="Bulma v0.4.4: a modern CSS framework based on Flexbox">
+ <meta property="og:image" content="http://bulma.io/versions/0.4.4/images/bulma-banner.png">
+ <meta property="og:image:type" content="image/png">
+ <meta property="og:image:width" content="1200">
+ <meta property="og:image:height" content="630">
+ <meta property="og:description" content="Bulma v0.4.4 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <meta name="twitter:card" content="summary_large_image">
+ <meta name="twitter:site" content="@jgthms">
+ <meta name="twitter:creator" content="@jgthms">
+ <meta name="twitter:title" content="Bulma v0.4.4: a modern CSS framework based on Flexbox">
+ <meta name="twitter:image" content="http://bulma.io/versions/0.4.4/images/bulma-banner.png">
+ <meta name="twitter:description" content="Bulma v0.4.4 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <link rel="apple-touch-icon" sizes="180x180" href="http://bulma.io/versions/0.4.4/favicons/apple-touch-icon.png?v=201701041855">
+ <link rel="icon" type="image/png" href="http://bulma.io/versions/0.4.4/favicons/favicon-32x32.png?v=201701041855" sizes="32x32">
+ <link rel="icon" type="image/png" href="http://bulma.io/versions/0.4.4/favicons/favicon-16x16.png?v=201701041855" sizes="16x16">
+ <link rel="manifest" href="http://bulma.io/versions/0.4.4/favicons/manifest.json?v=201701041855">
+ <link rel="mask-icon" href="http://bulma.io/versions/0.4.4/favicons/safari-pinned-tab.svg?v=201701041855" color="#00d1b2">
+ <link rel="shortcut icon" href="http://bulma.io/versions/0.4.4/favicons/favicon.ico?v=201701041855">
+ <meta name="msapplication-config" content="http://bulma.io/versions/0.4.4/favicons/browserconfig.xml?v=201701041855">
+ <meta name="theme-color" content="#00d1b2">
+</head>
+
+ <body class="layout-default">
+
+ <div class="notification is-info" style="border-radius: 0; margin-bottom: 0;">
+ <p>
+ You are viewing the deprecated <strong>0.4.4</strong> version of the website.
+ <a href="/">Click here to view the latest version</a>
+ </p>
+ </div>
+
+
+ <section class="hero is-fullheight is-success has-text-centered">
+ <div class="hero-body">
+ <div class="container">
+ <h1 class="title">
+ Thank you!
+ </h1>
+ <h2 class="subtitle">
+ Go back to the <a href="http://bulma.io/versions/0.4.4">homepage</a>
+ </h2>
+ </div>
+ </div>
+</section>
+
+ <script src="//m.servedby-buysellads.com/monetization.js" type="text/javascript"></script>
+
+<section class="hero is-info bsa">
+ <div class="container">
+ <div class="columns is-vcentered">
+ <div class="column is-4">
+ <p class="title">Bulma <strong>Partners</strong></p>
+ <p class="subtitle">Check out their products!</p>
+ </div>
+
+ <div class="column is-8">
+ <div class="bsa-cpc"></div>
+ </div>
+ </div>
+ </div>
+</section>
+
+<script>
+ (function(){
+ if(typeof _bsa !== 'undefined' && _bsa) {
+ _bsa.init('default', 'CVAIKK3E', 'placement:bulmaio', {
+ target: '.bsa-cpc',
+ align: 'horizontal',
+ disable_css: 'true'
+ });
+ }
+ })();
+</script>
+
+
+<section id="newsletter" class="hero is-primary">
+ <div class="hero-body">
+ <div class="container">
+ <!-- Begin MailChimp Signup Form -->
+ <div id="mc_embed_signup" class="columns is-vcentered">
+ <div class="column is-one-third is-left">
+ <p class="title">Bulma <strong>Newsletter</strong></p>
+ <p class="subtitle">Get notified when v1 is ready!</p>
+ </div>
+
+ <div class="column">
+ <form action="https://bbxdesign.us3.list-manage.com/subscribe/post?u=b43b93fe633f0560b2a72a69c&id=52585e8803" method="post" id="mc-embedded-subscribe-form" name="mc-embedded-subscribe-form" class="validate" target="_blank" novalidate>
+ <div id="mc_embed_signup_scroll">
+ <div class="field is-grouped">
+ <div class="control has-icons-left is-expanded">
+ <input type="email" value="" name="EMAIL" class="input is-flat required email" id="mce-EMAIL" placeholder="email address" required>
+ <span class="icon is-small is-left">
+ <i class="fa fa-envelope"></i>
+ </span>
+ </div>
+ <div class="control">
+ <input type="submit" value="Subscribe" name="subscribe" id="mc-embedded-subscribe" class="button is-white is-outlined">
+ </div>
+ </div>
+ <div id="mce-responses">
+ <div class="notification is-danger response" id="mce-error-response" style="display:none"></div>
+ <div class="notification is-success response" id="mce-success-response" style="display:none"></div>
+ </div>
+ <!-- real people should not fill this in and expect good things - do not remove this or risk form bot signups-->
+ <div style="position: absolute; left: -5000px;" aria-hidden="true">
+ <input type="text" name="b_b43b93fe633f0560b2a72a69c_52585e8803" tabindex="-1" value="">
+ </div>
+ </div>
+ </form>
+ </div>
+ </div>
+ <!--End mc_embed_signup-->
+ </div>
+ </div>
+</section>
+
+<footer class="footer">
+ <div class="container">
+ <div class="columns">
+ <div class="column is-3">
+ <div id="about" class="content">
+ <strong xmlns:dct="http://purl.org/dc/terms/" href="http://purl.org/dc/dcmitype/Text" property="dct:title" rel="dct:type">Bulma</strong> by <a xmlns:cc="http://creativecommons.org/ns#" href="http://jgthms.com" property="cc:attributionName" rel="cc:attributionURL">Jeremy Thomas</a>.
+ <div class="twitter-container">
+ <a href="https://twitter.com/jgthms" class="twitter-follow-button" data-show-count="true" data-lang="en" data-size="large">@jgthms</a>
+ </div>
+ </div>
+ </div>
+ <div class="column is-5">
+ <div id="share" class="content">
+ <div>
+ <strong>Support</strong> and share the love!
+ </div>
+ <div id="social">
+ <iframe class="github-btn" src="https://ghbtns.com/github-btn.html?user=jgthms&repo=bulma&type=star&count=true&size=large" allowtransparency="true" frameborder="0" scrolling="0" width="160px" height="30px"></iframe>
+
+ <a href="https://twitter.com/share" class="twitter-share-button" data-text="Bulma v0.4.4: a modern CSS framework based on Flexbox" data-url="http://bulma.io/versions/0.4.4" data-count="horizontal" data-via="jgthms" data-related="jgthms:Creator of Bulma" data-size="large">Tweet</a>
+
+ <form class="paypal-form" action="https://www.paypal.com/cgi-bin/webscr" method="post" target="_top">
+ <input type="hidden" name="cmd" value="_s-xclick">
+ <input type="hidden" name="hosted_button_id" value="8WMKYSRFN6A78">
+ <input type="image" src="http://bulma.io/versions/0.4.4/images/paypal-donate.png" border="0" name="submit" alt="PayPal – The safer, easier way to pay online." height="30">
+ <img alt="" border="0" src="https://www.paypalobjects.com/en_GB/i/scr/pixel.gif" width="1" height="1">
+ </form>
+
+ <div class="fb-like" data-href="https://www.facebook.com/bulmaio" data-layout="button" data-action="like" data-size="large" data-show-faces="false" data-share="true"></div>
+ </div>
+ </div>
+ </div>
+ <div class="column is-4">
+ <div id="sister">
+ <p>
+ More <strong>helpful</strong> tools:
+ </p>
+ <ul>
+ <li>
+ <a href="http://cssreference.io">
+ <img src="http://bulma.io/versions/0.4.4/images/css-reference-logo.png" alt="CSS Reference logo">
+ </a>
+ </li>
+ <li>
+ <a href="http://htmlreference.io">
+ <img src="http://bulma.io/versions/0.4.4/images/html-reference-logo.png" alt="HTML Reference logo">
+ </a>
+ </li>
+ </ul>
+ </div>
+ </div>
+ </div>
+
+ <p id="tsp">
+ <small>
+ Source code licensed <a href="http://opensource.org/licenses/mit-license.php">MIT</a>.
+ <br>
+ Website content licensed <a rel="license" href="http://creativecommons.org/licenses/by-nc-sa/4.0/">CC BY-NC-SA 4.0</a>.
+ </small>
+ </p>
+ </div>
+</footer>
+
+<script src="http://bulma.io/versions/0.4.4/vendor/clipboard-1.7.1.min.js"></script>
+<script src="http://bulma.io/versions/0.4.4/lib/main.js"></script>
+
+
+ <script type="text/javascript" src="http://bulma.io/versions/0.4.4/lib/index.js"></script>
+
+
+<div id="fb-root"></div>
+
+<script async defer type="text/javascript">(function(d, s, id) {
+ var js, fjs = d.getElementsByTagName(s)[0];
+ if (d.getElementById(id)) return;
+ js = d.createElement(s); js.id = id;
+ js.async = true;
+ js.defer = true;
+ js.src = "//connect.facebook.net/en_US/sdk.js#xfbml=1&version=v2.8&appId=310296819307942";
+ fjs.parentNode.insertBefore(js, fjs);
+}(document, 'script', 'facebook-jssdk'));</script>
+
+<script async defer id="twitter-wjs" src="https://platform.twitter.com/widgets.js"></script>
+<script async defer type="text/javascript" src="https://s3.amazonaws.com/downloads.mailchimp.com/js/mc-validate.js"></script>
+
+<script async defer type="text/javascript">
+ (function() {
+ window.fnames = new Array();
+ window.ftypes = new Array();
+ fnames[0]='EMAIL';
+ ftypes[0]='email';
+ }());
+ // var $mcj = window.jQuery.noConflict(true);
+</script>
+
+<script async defer type="text/javascript">
+ (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
+ (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
+ m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
+ })(window,document,'script','https://www.google-analytics.com/analytics.js','ga');
+
+ ga('create', 'UA-82634666-2', 'auto');
+ ga('send', 'pageview');
+</script>
+
+ </body>
+</html>
diff --git a/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/tiles/index.html b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/tiles/index.html
new file mode 100644
index 0000000000000000000000000000000000000000..ea26dbe2b59884d725ae93a19bd86feacc473c55
--- /dev/null
+++ b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/tiles/index.html
@@ -0,0 +1,988 @@
+<!DOCTYPE html>
+<html lang="en" class="route-tiles">
+ <head>
+ <meta charset="utf-8">
+ <meta http-equiv="X-UA-Compatible" content="IE=edge">
+ <meta name="viewport" content="width=device-width, initial-scale=1">
+ <meta name="description" content="Bulma v0.4.4 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <title>Bulma v0.4.4: a modern CSS framework based on Flexbox</title>
+
+ <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.6.3/css/font-awesome.min.css">
+ <link rel="stylesheet" href="http://bulma.io/versions/0.4.4/css/bulma-docs.css">
+
+ <link rel="canonical" href="http://bulma.io/versions/0.4.4/tiles/">
+ <link rel="alternate" type="application/rss+xml" title="Bulma v0.4.4: a modern CSS framework based on Flexbox" href="http://bulma.io/versions/0.4.4/feed.xml">
+
+ <meta property="og:url" content="http://bulma.io/versions/0.4.4">
+ <meta property="og:type" content="website">
+ <meta property="og:title" content="Bulma v0.4.4: a modern CSS framework based on Flexbox">
+ <meta property="og:image" content="http://bulma.io/versions/0.4.4/images/bulma-banner.png">
+ <meta property="og:image:type" content="image/png">
+ <meta property="og:image:width" content="1200">
+ <meta property="og:image:height" content="630">
+ <meta property="og:description" content="Bulma v0.4.4 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <meta name="twitter:card" content="summary_large_image">
+ <meta name="twitter:site" content="@jgthms">
+ <meta name="twitter:creator" content="@jgthms">
+ <meta name="twitter:title" content="Bulma v0.4.4: a modern CSS framework based on Flexbox">
+ <meta name="twitter:image" content="http://bulma.io/versions/0.4.4/images/bulma-banner.png">
+ <meta name="twitter:description" content="Bulma v0.4.4 is an open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free.">
+
+ <link rel="apple-touch-icon" sizes="180x180" href="http://bulma.io/versions/0.4.4/favicons/apple-touch-icon.png?v=201701041855">
+ <link rel="icon" type="image/png" href="http://bulma.io/versions/0.4.4/favicons/favicon-32x32.png?v=201701041855" sizes="32x32">
+ <link rel="icon" type="image/png" href="http://bulma.io/versions/0.4.4/favicons/favicon-16x16.png?v=201701041855" sizes="16x16">
+ <link rel="manifest" href="http://bulma.io/versions/0.4.4/favicons/manifest.json?v=201701041855">
+ <link rel="mask-icon" href="http://bulma.io/versions/0.4.4/favicons/safari-pinned-tab.svg?v=201701041855" color="#00d1b2">
+ <link rel="shortcut icon" href="http://bulma.io/versions/0.4.4/favicons/favicon.ico?v=201701041855">
+ <meta name="msapplication-config" content="http://bulma.io/versions/0.4.4/favicons/browserconfig.xml?v=201701041855">
+ <meta name="theme-color" content="#00d1b2">
+</head>
+
+ <body class="layout-default">
+
+ <div class="notification is-info" style="border-radius: 0; margin-bottom: 0;">
+ <p>
+ You are viewing the deprecated <strong>0.4.4</strong> version of the website.
+ <a href="/">Click here to view the latest version</a>
+ </p>
+ </div>
+
+
+ <section class="section">
+ <div class="container">
+ <h1 class="title">Tiles</h1>
+ <h2 class="subtitle">A <strong>single tile</strong> element to build 2-dimensional Metro-like, Pinterest-like, or whatever-you-like grids</h2>
+
+ <div class="content">
+ <p>To build intricate 2-dimensional, you only need a <strong>single element</strong>: the <code>tile</code>:</p>
+ </div>
+
+<figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile"</span><span class="nt">></span>
+ <span class="c"><!-- The magical tile element! --></span>
+<span class="nt"></div></span></code></pre></figure>
+
+ <div class="content">
+ <p>The <code>tile</code> element has <strong>16 modifiers</strong>:</p>
+ <ul>
+ <li>
+ <strong>3 contextual</strong> modifiers
+ <ul>
+ <li><code>is-ancestor</code></li>
+ <li><code>is-parent</code></li>
+ <li><code>is-child</code></li>
+ </ul>
+ </li>
+ <li>
+ <strong>1 directional</strong> modifier
+ <ul>
+ <li><code>is-vertical</code></li>
+ </ul>
+ </li>
+ <li>
+ <strong>12 horizontal size</strong> modifiers
+ <ul>
+ <li>from <code>is-1</code></li>
+ <li>to <code>is-12</code></li>
+ </ul>
+ </li>
+ </ul>
+ </div>
+
+ <hr>
+
+ <h3 class="title">How it works: Nesting</h3>
+ <div class="content">
+ <p>Everything is a tile! To create a grid of tiles, you only need to <strong>nest</strong> <code>tile</code> elements.</p>
+ </div>
+
+ <div class="columns">
+ <div class="column is-one-third">
+ <p>Start with an <strong>ancestor</strong> tile that will wrap all other tiles:</p>
+ </div>
+ <div class="column is-two-thirds">
+<figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile is-ancestor"</span><span class="nt">></span>
+ <span class="c"><!-- All other tile elemnts --></span>
+<span class="nt"></div></span></code></pre></figure>
+ </div>
+ </div>
+
+ <div class="columns">
+ <div class="column is-one-third">
+ <p>Add tile elements that will distribute themselves <strong>horizontally</strong>:</p>
+ </div>
+ <div class="column is-two-thirds">
+<figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile is-ancestor"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile"</span><span class="nt">></span>
+ <span class="c"><!-- Add content or other tiles --></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile"</span><span class="nt">></span>
+ <span class="c"><!-- Add content or other tiles --></span>
+ <span class="nt"></div></span>
+<span class="nt"></div></span></code></pre></figure>
+ </div>
+ </div>
+
+ <div class="columns">
+ <div class="column is-one-third">
+ <p>
+ You can <strong>resize</strong> any tile according to a <strong>12 column</strong> grid.
+ <br>
+ For example, <code>is-4</code> will take up 2/3 of the horizontal space:
+ </p>
+ </div>
+ <div class="column is-two-thirds">
+<figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile is-ancestor"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile is-4"</span><span class="nt">></span>
+ <span class="c"><!-- 1/3 --></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile"</span><span class="nt">></span>
+ <span class="c"><!-- This tile will take the rest: 2/3 --></span>
+ <span class="nt"></div></span>
+<span class="nt"></div></span></code></pre></figure>
+ </div>
+ </div>
+
+ <div class="columns">
+ <div class="column is-one-third">
+ <p>If you want to stack tiles <strong>vertically</strong>, add <code>is-vertical</code> on the parent tile:</p>
+ </div>
+ <div class="column is-two-thirds">
+<figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile is-ancestor"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile is-4 is-vertical"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile"</span><span class="nt">></span>
+ <span class="c"><!-- Top tile --></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile"</span><span class="nt">></span>
+ <span class="c"><!-- Bottom tile --></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile"</span><span class="nt">></span>
+ <span class="c"><!-- This tile will take up the whole vertical space --></span>
+ <span class="nt"></div></span>
+<span class="nt"></div></span></code></pre></figure>
+ </div>
+ </div>
+
+ <div class="columns">
+ <div class="column is-one-third">
+ <div class="content">
+ <p>As soon as you want to add <strong>content</strong> to a tile, just:</p>
+ <ul>
+ <li>add <em>any</em> class you want, like <code>box</code></li>
+ <li>add the <code>is-child</code> modifier on the tile</li>
+ <li>add the <code>is-parent</code> modifier on the <em>parent</em> tile</li>
+ </ul>
+ </div>
+ </div>
+ <div class="column is-two-thirds">
+<figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile is-ancestor"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile is-4 is-vertical is-parent"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile is-child box"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"title"</span><span class="nt">></span>One<span class="nt"></p></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile is-child box"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"title"</span><span class="nt">></span>Two<span class="nt"></p></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile is-parent"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile is-child box"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"title"</span><span class="nt">></span>Three<span class="nt"></p></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+<span class="nt"></div></span></code></pre></figure>
+ </div>
+ </div>
+
+ <div class="tile is-ancestor">
+ <div class="tile is-4 is-vertical is-parent">
+ <div class="tile is-child box">
+ <p class="title">One</p>
+ <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin ornare magna eros, eu pellentesque tortor vestibulum ut. Maecenas non massa sem. Etiam finibus odio quis feugiat facilisis.</p>
+ </div>
+ <div class="tile is-child box">
+ <p class="title">Two</p>
+ <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin ornare magna eros, eu pellentesque tortor vestibulum ut. Maecenas non massa sem. Etiam finibus odio quis feugiat facilisis.</p>
+ </div>
+ </div>
+ <div class="tile is-parent">
+ <div class="tile is-child box">
+ <p class="title">Three</p>
+ <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Etiam semper diam at erat pulvinar, at pulvinar felis blandit. Vestibulum volutpat tellus diam, consequat gravida libero rhoncus ut. Morbi maximus, leo sit amet vehicula eleifend, nunc dui porta orci, quis semper odio felis ut quam.</p>
+ <p>Suspendisse varius ligula in molestie lacinia. Maecenas varius eget ligula a sagittis. Pellentesque interdum, nisl nec interdum maximus, augue diam porttitor lorem, et sollicitudin felis neque sit amet erat. Maecenas imperdiet felis nisi, fringilla luctus felis hendrerit sit amet. Aenean vitae gravida diam, finibus dignissim turpis. Sed eget varius ligula, at volutpat tortor.</p>
+ <p>Integer sollicitudin, tortor a mattis commodo, velit urna rhoncus erat, vitae congue lectus dolor consequat libero. Donec leo ligula, maximus et pellentesque sed, gravida a metus. Cras ullamcorper a nunc ac porta. Aliquam ut aliquet lacus, quis faucibus libero. Quisque non semper leo.</p>
+ </div>
+ </div>
+ </div>
+
+<figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile is-ancestor"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile is-4 is-vertical is-parent"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile is-child box"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"title"</span><span class="nt">></span>One<span class="nt"></p></span>
+ <span class="nt"><p></span>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin ornare magna eros, eu pellentesque tortor vestibulum ut. Maecenas non massa sem. Etiam finibus odio quis feugiat facilisis.<span class="nt"></p></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile is-child box"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"title"</span><span class="nt">></span>Two<span class="nt"></p></span>
+ <span class="nt"><p></span>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin ornare magna eros, eu pellentesque tortor vestibulum ut. Maecenas non massa sem. Etiam finibus odio quis feugiat facilisis.<span class="nt"></p></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile is-parent"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile is-child box"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"title"</span><span class="nt">></span>Three<span class="nt"></p></span>
+ <span class="nt"><p></span>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Etiam semper diam at erat pulvinar, at pulvinar felis blandit. Vestibulum volutpat tellus diam, consequat gravida libero rhoncus ut. Morbi maximus, leo sit amet vehicula eleifend, nunc dui porta orci, quis semper odio felis ut quam.<span class="nt"></p></span>
+ <span class="nt"><p></span>Suspendisse varius ligula in molestie lacinia. Maecenas varius eget ligula a sagittis. Pellentesque interdum, nisl nec interdum maximus, augue diam porttitor lorem, et sollicitudin felis neque sit amet erat. Maecenas imperdiet felis nisi, fringilla luctus felis hendrerit sit amet. Aenean vitae gravida diam, finibus dignissim turpis. Sed eget varius ligula, at volutpat tortor.<span class="nt"></p></span>
+ <span class="nt"><p></span>Integer sollicitudin, tortor a mattis commodo, velit urna rhoncus erat, vitae congue lectus dolor consequat libero. Donec leo ligula, maximus et pellentesque sed, gravida a metus. Cras ullamcorper a nunc ac porta. Aliquam ut aliquet lacus, quis faucibus libero. Quisque non semper leo.<span class="nt"></p></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+<span class="nt"></div></span></code></pre></figure>
+
+ <hr>
+
+ <h3 class="title">Nesting requirements</h3>
+
+ <article class="message is-danger">
+ <div class="message-header">
+ 3 levels deep at least...
+ </div>
+ <div class="message-body">
+ <div class="content">
+ <p>You need at least <strong>3 levels</strong> of hierarchy:</p>
+<figure class="highlight"><pre><code class="language-markdown" data-lang="markdown">tile is-ancestor
+|
+└───tile is-parent
+ |
+ └───tile is-child</code></pre></figure>
+ </div>
+ </div>
+ </article>
+
+ <article class="message is-success">
+ <div class="message-header">
+ ...but more levels if you want!
+ </div>
+ <div class="message-body">
+ <div class="content">
+ <p>You can however nest tiles more deeply than that, and mix it up!</p>
+<figure class="highlight"><pre><code class="language-markdown" data-lang="markdown">tile is-ancestor
+|
+├───tile is-vertical is-8
+| |
+| ├───tile
+| | |
+| | ├───tile is-parent is-vertical
+| | | ├───tile is-child
+| | | └───tile is-child
+| | |
+| | └───tile is-parent
+| | └───tile is-child
+| |
+| └───tile is-parent
+| └───tile is-child
+|
+└───tile is-parent
+ └───tile is-child</code></pre></figure>
+ </div>
+ </div>
+ </article>
+
+ <div class="tile is-ancestor">
+ <div class="tile is-vertical is-8">
+ <div class="tile">
+ <div class="tile is-parent is-vertical">
+ <article class="tile is-child box">
+ <p class="title">Vertical tiles</p>
+ <p class="subtitle">Top box</p>
+ </article>
+ <article class="tile is-child box">
+ <p class="title">Vertical tiles</p>
+ <p class="subtitle">Bottom box</p>
+ </article>
+ </div>
+ <div class="tile is-parent">
+ <article class="tile is-child box">
+ <p class="title">Middle box</p>
+ <p class="subtitle">With an image</p>
+ <figure class="image is-4by3">
+ <img src="http://bulma.io/versions/0.4.4/images/placeholders/640x480.png">
+ </figure>
+ </article>
+ </div>
+ </div>
+ <div class="tile is-parent">
+ <article class="tile is-child box">
+ <p class="title">Wide column</p>
+ <p class="subtitle">Aligned with the right column</p>
+ <div class="content">
+ <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin ornare magna eros, eu pellentesque tortor vestibulum ut. Maecenas non massa sem. Etiam finibus odio quis feugiat facilisis.</p>
+ </div>
+ </article>
+ </div>
+ </div>
+ <div class="tile is-parent">
+ <article class="tile is-child box">
+ <div class="content">
+ <p class="title">Tall column</p>
+ <p class="subtitle">With even more content</p>
+ <div class="content">
+ <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Etiam semper diam at erat pulvinar, at pulvinar felis blandit. Vestibulum volutpat tellus diam, consequat gravida libero rhoncus ut. Morbi maximus, leo sit amet vehicula eleifend, nunc dui porta orci, quis semper odio felis ut quam.</p>
+ <p>Suspendisse varius ligula in molestie lacinia. Maecenas varius eget ligula a sagittis. Pellentesque interdum, nisl nec interdum maximus, augue diam porttitor lorem, et sollicitudin felis neque sit amet erat. Maecenas imperdiet felis nisi, fringilla luctus felis hendrerit sit amet. Aenean vitae gravida diam, finibus dignissim turpis. Sed eget varius ligula, at volutpat tortor.</p>
+ <p>Integer sollicitudin, tortor a mattis commodo, velit urna rhoncus erat, vitae congue lectus dolor consequat libero. Donec leo ligula, maximus et pellentesque sed, gravida a metus. Cras ullamcorper a nunc ac porta. Aliquam ut aliquet lacus, quis faucibus libero. Quisque non semper leo.</p>
+ </div>
+ </div>
+ </article>
+ </div>
+ </div>
+
+<figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile is-ancestor"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile is-vertical is-8"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile is-parent is-vertical"</span><span class="nt">></span>
+ <span class="nt"><article</span> <span class="na">class=</span><span class="s">"tile is-child box"</span><span class="nt">></span>
+ <span class="c"><!-- Put any content you want --></span>
+ <span class="nt"></article></span>
+ <span class="nt"><article</span> <span class="na">class=</span><span class="s">"tile is-child box"</span><span class="nt">></span>
+ <span class="c"><!-- Put any content you want --></span>
+ <span class="nt"></article></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile is-parent"</span><span class="nt">></span>
+ <span class="nt"><article</span> <span class="na">class=</span><span class="s">"tile is-child box"</span><span class="nt">></span>
+ <span class="c"><!-- Put any content you want --></span>
+ <span class="nt"></article></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile is-parent"</span><span class="nt">></span>
+ <span class="nt"><article</span> <span class="na">class=</span><span class="s">"tile is-child box"</span><span class="nt">></span>
+ <span class="c"><!-- Put any content you want --></span>
+ <span class="nt"></article></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile is-parent"</span><span class="nt">></span>
+ <span class="nt"><article</span> <span class="na">class=</span><span class="s">"tile is-child box"</span><span class="nt">></span>
+ <span class="c"><!-- Put any content you want --></span>
+ <span class="nt"></article></span>
+ <span class="nt"></div></span>
+<span class="nt"></div></span></code></pre></figure>
+
+ <hr>
+
+ <h3 class="title">3 columns</h3>
+
+ <div class="tile is-ancestor">
+ <div class="tile is-parent">
+ <article class="tile is-child box">
+ <p class="title">Hello World</p>
+ <p class="subtitle">What is up?</p>
+ </article>
+ </div>
+ <div class="tile is-parent">
+ <article class="tile is-child box">
+ <p class="title">Foo</p>
+ <p class="subtitle">Bar</p>
+ </article>
+ </div>
+ <div class="tile is-parent">
+ <article class="tile is-child box">
+ <p class="title">Third column</p>
+ <p class="subtitle">With some content</p>
+ <div class="content">
+ <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin ornare magna eros, eu pellentesque tortor vestibulum ut. Maecenas non massa sem. Etiam finibus odio quis feugiat facilisis.</p>
+ </div>
+ </article>
+ </div>
+ </div>
+ <div class="tile is-ancestor">
+ <div class="tile is-vertical is-8">
+ <div class="tile">
+ <div class="tile is-parent is-vertical">
+ <article class="tile is-child box">
+ <p class="title">Vertical tiles</p>
+ <p class="subtitle">Top box</p>
+ </article>
+ <article class="tile is-child box">
+ <p class="title">Vertical tiles</p>
+ <p class="subtitle">Bottom box</p>
+ </article>
+ </div>
+ <div class="tile is-parent">
+ <article class="tile is-child box">
+ <p class="title">Middle box</p>
+ <p class="subtitle">With an image</p>
+ <figure class="image is-4by3">
+ <img src="http://bulma.io/versions/0.4.4/images/placeholders/640x480.png">
+ </figure>
+ </article>
+ </div>
+ </div>
+ <div class="tile is-parent">
+ <article class="tile is-child box">
+ <p class="title">Wide column</p>
+ <p class="subtitle">Aligned with the right column</p>
+ <div class="content">
+ <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin ornare magna eros, eu pellentesque tortor vestibulum ut. Maecenas non massa sem. Etiam finibus odio quis feugiat facilisis.</p>
+ </div>
+ </article>
+ </div>
+ </div>
+ <div class="tile is-parent">
+ <article class="tile is-child box">
+ <div class="content">
+ <p class="title">Tall column</p>
+ <p class="subtitle">With even more content</p>
+ <div class="content">
+ <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Etiam semper diam at erat pulvinar, at pulvinar felis blandit. Vestibulum volutpat tellus diam, consequat gravida libero rhoncus ut. Morbi maximus, leo sit amet vehicula eleifend, nunc dui porta orci, quis semper odio felis ut quam.</p>
+ <p>Suspendisse varius ligula in molestie lacinia. Maecenas varius eget ligula a sagittis. Pellentesque interdum, nisl nec interdum maximus, augue diam porttitor lorem, et sollicitudin felis neque sit amet erat. Maecenas imperdiet felis nisi, fringilla luctus felis hendrerit sit amet. Aenean vitae gravida diam, finibus dignissim turpis. Sed eget varius ligula, at volutpat tortor.</p>
+ <p>Integer sollicitudin, tortor a mattis commodo, velit urna rhoncus erat, vitae congue lectus dolor consequat libero. Donec leo ligula, maximus et pellentesque sed, gravida a metus. Cras ullamcorper a nunc ac porta. Aliquam ut aliquet lacus, quis faucibus libero. Quisque non semper leo.</p>
+ </div>
+ </div>
+ </article>
+ </div>
+ </div>
+ <div class="tile is-ancestor">
+ <div class="tile is-parent">
+ <article class="tile is-child box">
+ <p class="title">Side column</p>
+ <p class="subtitle">With some content</p>
+ <div class="content">
+ <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin ornare magna eros, eu pellentesque tortor vestibulum ut. Maecenas non massa sem. Etiam finibus odio quis feugiat facilisis.</p>
+ </div>
+ </article>
+ </div>
+ <div class="tile is-parent is-8">
+ <article class="tile is-child box">
+ <p class="title">Main column</p>
+ <p class="subtitle">With some content</p>
+ <div class="content">
+ <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin ornare magna eros, eu pellentesque tortor vestibulum ut. Maecenas non massa sem. Etiam finibus odio quis feugiat facilisis.</p>
+ </div>
+ </article>
+ </div>
+ </div>
+
+<figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile is-ancestor"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile is-parent"</span><span class="nt">></span>
+ <span class="nt"><article</span> <span class="na">class=</span><span class="s">"tile is-child box"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"title"</span><span class="nt">></span>Hello World<span class="nt"></p></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"subtitle"</span><span class="nt">></span>What is up?<span class="nt"></p></span>
+ <span class="nt"></article></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile is-parent"</span><span class="nt">></span>
+ <span class="nt"><article</span> <span class="na">class=</span><span class="s">"tile is-child box"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"title"</span><span class="nt">></span>Foo<span class="nt"></p></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"subtitle"</span><span class="nt">></span>Bar<span class="nt"></p></span>
+ <span class="nt"></article></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile is-parent"</span><span class="nt">></span>
+ <span class="nt"><article</span> <span class="na">class=</span><span class="s">"tile is-child box"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"title"</span><span class="nt">></span>Third column<span class="nt"></p></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"subtitle"</span><span class="nt">></span>With some content<span class="nt"></p></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"content"</span><span class="nt">></span>
+ <span class="nt"><p></span>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin ornare magna eros, eu pellentesque tortor vestibulum ut. Maecenas non massa sem. Etiam finibus odio quis feugiat facilisis.<span class="nt"></p></span>
+ <span class="nt"></div></span>
+ <span class="nt"></article></span>
+ <span class="nt"></div></span>
+<span class="nt"></div></span>
+
+<span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile is-ancestor"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile is-vertical is-8"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile is-parent is-vertical"</span><span class="nt">></span>
+ <span class="nt"><article</span> <span class="na">class=</span><span class="s">"tile is-child box"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"title"</span><span class="nt">></span>Vertical tiles<span class="nt"></p></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"subtitle"</span><span class="nt">></span>Top box<span class="nt"></p></span>
+ <span class="nt"></article></span>
+ <span class="nt"><article</span> <span class="na">class=</span><span class="s">"tile is-child box"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"title"</span><span class="nt">></span>Vertical tiles<span class="nt"></p></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"subtitle"</span><span class="nt">></span>Bottom box<span class="nt"></p></span>
+ <span class="nt"></article></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile is-parent"</span><span class="nt">></span>
+ <span class="nt"><article</span> <span class="na">class=</span><span class="s">"tile is-child box"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"title"</span><span class="nt">></span>Middle box<span class="nt"></p></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"subtitle"</span><span class="nt">></span>With an image<span class="nt"></p></span>
+ <span class="nt"><figure</span> <span class="na">class=</span><span class="s">"image is-4by3"</span><span class="nt">></span>
+ <span class="nt"><img</span> <span class="na">src=</span><span class="s">"http://bulma.io/versions/0.4.4/images/placeholders/640x480.png"</span><span class="nt">></span>
+ <span class="nt"></figure></span>
+ <span class="nt"></article></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile is-parent"</span><span class="nt">></span>
+ <span class="nt"><article</span> <span class="na">class=</span><span class="s">"tile is-child box"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"title"</span><span class="nt">></span>Wide column<span class="nt"></p></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"subtitle"</span><span class="nt">></span>Aligned with the right column<span class="nt"></p></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"content"</span><span class="nt">></span>
+ <span class="nt"><p></span>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin ornare magna eros, eu pellentesque tortor vestibulum ut. Maecenas non massa sem. Etiam finibus odio quis feugiat facilisis.<span class="nt"></p></span>
+ <span class="nt"></div></span>
+ <span class="nt"></article></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile is-parent"</span><span class="nt">></span>
+ <span class="nt"><article</span> <span class="na">class=</span><span class="s">"tile is-child box"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"content"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"title"</span><span class="nt">></span>Tall column<span class="nt"></p></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"subtitle"</span><span class="nt">></span>With even more content<span class="nt"></p></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"content"</span><span class="nt">></span>
+ <span class="nt"><p></span>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Etiam semper diam at erat pulvinar, at pulvinar felis blandit. Vestibulum volutpat tellus diam, consequat gravida libero rhoncus ut. Morbi maximus, leo sit amet vehicula eleifend, nunc dui porta orci, quis semper odio felis ut quam.<span class="nt"></p></span>
+ <span class="nt"><p></span>Suspendisse varius ligula in molestie lacinia. Maecenas varius eget ligula a sagittis. Pellentesque interdum, nisl nec interdum maximus, augue diam porttitor lorem, et sollicitudin felis neque sit amet erat. Maecenas imperdiet felis nisi, fringilla luctus felis hendrerit sit amet. Aenean vitae gravida diam, finibus dignissim turpis. Sed eget varius ligula, at volutpat tortor.<span class="nt"></p></span>
+ <span class="nt"><p></span>Integer sollicitudin, tortor a mattis commodo, velit urna rhoncus erat, vitae congue lectus dolor consequat libero. Donec leo ligula, maximus et pellentesque sed, gravida a metus. Cras ullamcorper a nunc ac porta. Aliquam ut aliquet lacus, quis faucibus libero. Quisque non semper leo.<span class="nt"></p></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+ <span class="nt"></article></span>
+ <span class="nt"></div></span>
+<span class="nt"></div></span>
+
+<span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile is-ancestor"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile is-parent"</span><span class="nt">></span>
+ <span class="nt"><article</span> <span class="na">class=</span><span class="s">"tile is-child box"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"title"</span><span class="nt">></span>Side column<span class="nt"></p></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"subtitle"</span><span class="nt">></span>With some content<span class="nt"></p></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"content"</span><span class="nt">></span>
+ <span class="nt"><p></span>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin ornare magna eros, eu pellentesque tortor vestibulum ut. Maecenas non massa sem. Etiam finibus odio quis feugiat facilisis.<span class="nt"></p></span>
+ <span class="nt"></div></span>
+ <span class="nt"></article></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile is-parent is-8"</span><span class="nt">></span>
+ <span class="nt"><article</span> <span class="na">class=</span><span class="s">"tile is-child box"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"title"</span><span class="nt">></span>Main column<span class="nt"></p></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"subtitle"</span><span class="nt">></span>With some content<span class="nt"></p></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"content"</span><span class="nt">></span>
+ <span class="nt"><p></span>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin ornare magna eros, eu pellentesque tortor vestibulum ut. Maecenas non massa sem. Etiam finibus odio quis feugiat facilisis.<span class="nt"></p></span>
+ <span class="nt"></div></span>
+ <span class="nt"></article></span>
+ <span class="nt"></div></span>
+<span class="nt"></div></span></code></pre></figure>
+
+ <hr>
+
+ <h3 class="title">4 columns</h3>
+
+ <div class="tile is-ancestor">
+ <div class="tile is-parent">
+ <article class="tile is-child box">
+ <p class="title">One</p>
+ <p class="subtitle">Subtitle</p>
+ </article>
+ </div>
+ <div class="tile is-parent">
+ <article class="tile is-child box">
+ <p class="title">Two</p>
+ <p class="subtitle">Subtitle</p>
+ </article>
+ </div>
+ <div class="tile is-parent">
+ <article class="tile is-child box">
+ <p class="title">Three</p>
+ <p class="subtitle">Subtitle</p>
+ </article>
+ </div>
+ <div class="tile is-parent">
+ <article class="tile is-child box">
+ <p class="title">Four</p>
+ <p class="subtitle">Subtitle</p>
+ </article>
+ </div>
+ </div>
+ <div class="tile is-ancestor">
+ <div class="tile is-vertical is-9">
+ <div class="tile">
+ <div class="tile is-parent">
+ <article class="tile is-child box">
+ <p class="title">Five</p>
+ <p class="subtitle">Subtitle</p>
+ <div class="content">
+ <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Etiam semper diam at erat pulvinar, at pulvinar felis blandit. Vestibulum volutpat tellus diam, consequat gravida libero rhoncus ut. Morbi maximus, leo sit amet vehicula eleifend, nunc dui porta orci, quis semper odio felis ut quam.</p>
+ </div>
+ </article>
+ </div>
+ <div class="tile is-8 is-vertical">
+ <div class="tile">
+ <div class="tile is-parent">
+ <article class="tile is-child box">
+ <p class="title">Six</p>
+ <p class="subtitle">Subtitle</p>
+ </article>
+ </div>
+ <div class="tile is-parent">
+ <article class="tile is-child box">
+ <p class="title">Seven</p>
+ <p class="subtitle">Subtitle</p>
+ </article>
+ </div>
+ </div>
+ <div class="tile is-parent">
+ <article class="tile is-child box">
+ <p class="title">Eight</p>
+ <p class="subtitle">Subtitle</p>
+ </article>
+ </div>
+ </div>
+ </div>
+ <div class="tile">
+ <div class="tile is-8 is-parent">
+ <article class="tile is-child box">
+ <p class="title">Nine</p>
+ <p class="subtitle">Subtitle</p>
+ <div class="content">
+ <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin ornare magna eros, eu pellentesque tortor vestibulum ut. Maecenas non massa sem. Etiam finibus odio quis feugiat facilisis.</p>
+ </div>
+ </article>
+ </div>
+ <div class="tile is-parent">
+ <article class="tile is-child box">
+ <p class="title">Ten</p>
+ <p class="subtitle">Subtitle</p>
+ <div class="content">
+ <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin ornare magna eros, eu pellentesque tortor vestibulum ut. Maecenas non massa sem. Etiam finibus odio quis feugiat facilisis.</p>
+ </div>
+ </article>
+ </div>
+ </div>
+ </div>
+ <div class="tile is-parent">
+ <article class="tile is-child box">
+ <div class="content">
+ <p class="title">Eleven</p>
+ <p class="subtitle">Subtitle</p>
+ <div class="content">
+ <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Etiam semper diam at erat pulvinar, at pulvinar felis blandit. Vestibulum volutpat tellus diam, consequat gravida libero rhoncus ut. Morbi maximus, leo sit amet vehicula eleifend, nunc dui porta orci, quis semper odio felis ut quam.</p>
+ <p>Integer sollicitudin, tortor a mattis commodo, velit urna rhoncus erat, vitae congue lectus dolor consequat libero. Donec leo ligula, maximus et pellentesque sed, gravida a metus. Cras ullamcorper a nunc ac porta. Aliquam ut aliquet lacus, quis faucibus libero. Quisque non semper leo.</p>
+ </div>
+ </div>
+ </article>
+ </div>
+ </div>
+ <div class="tile is-ancestor">
+ <div class="tile is-parent">
+ <article class="tile is-child box">
+ <p class="title">Twelve</p>
+ <p class="subtitle">Subtitle</p>
+ <div class="content">
+ <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin ornare magna eros, eu pellentesque tortor vestibulum ut.</p>
+ </div>
+ </article>
+ </div>
+ <div class="tile is-parent is-6">
+ <article class="tile is-child box">
+ <p class="title">Thirteen</p>
+ <p class="subtitle">Subtitle</p>
+ <div class="content">
+ <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin ornare magna eros, eu pellentesque tortor vestibulum ut. Maecenas non massa sem. Etiam finibus odio quis feugiat facilisis.</p>
+ </div>
+ </article>
+ </div>
+ <div class="tile is-parent">
+ <article class="tile is-child box">
+ <p class="title">Fourteen</p>
+ <p class="subtitle">Subtitle</p>
+ <div class="content">
+ <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin ornare magna eros, eu pellentesque tortor vestibulum ut.</p>
+ </div>
+ </article>
+ </div>
+ </div>
+
+<figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile is-ancestor"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile is-parent"</span><span class="nt">></span>
+ <span class="nt"><article</span> <span class="na">class=</span><span class="s">"tile is-child box"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"title"</span><span class="nt">></span>One<span class="nt"></p></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"subtitle"</span><span class="nt">></span>Subtitle<span class="nt"></p></span>
+ <span class="nt"></article></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile is-parent"</span><span class="nt">></span>
+ <span class="nt"><article</span> <span class="na">class=</span><span class="s">"tile is-child box"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"title"</span><span class="nt">></span>Two<span class="nt"></p></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"subtitle"</span><span class="nt">></span>Subtitle<span class="nt"></p></span>
+ <span class="nt"></article></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile is-parent"</span><span class="nt">></span>
+ <span class="nt"><article</span> <span class="na">class=</span><span class="s">"tile is-child box"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"title"</span><span class="nt">></span>Three<span class="nt"></p></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"subtitle"</span><span class="nt">></span>Subtitle<span class="nt"></p></span>
+ <span class="nt"></article></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile is-parent"</span><span class="nt">></span>
+ <span class="nt"><article</span> <span class="na">class=</span><span class="s">"tile is-child box"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"title"</span><span class="nt">></span>Four<span class="nt"></p></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"subtitle"</span><span class="nt">></span>Subtitle<span class="nt"></p></span>
+ <span class="nt"></article></span>
+ <span class="nt"></div></span>
+<span class="nt"></div></span>
+
+<span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile is-ancestor"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile is-vertical is-9"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile is-parent"</span><span class="nt">></span>
+ <span class="nt"><article</span> <span class="na">class=</span><span class="s">"tile is-child box"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"title"</span><span class="nt">></span>Five<span class="nt"></p></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"subtitle"</span><span class="nt">></span>Subtitle<span class="nt"></p></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"content"</span><span class="nt">></span>
+ <span class="nt"><p></span>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Etiam semper diam at erat pulvinar, at pulvinar felis blandit. Vestibulum volutpat tellus diam, consequat gravida libero rhoncus ut. Morbi maximus, leo sit amet vehicula eleifend, nunc dui porta orci, quis semper odio felis ut quam.<span class="nt"></p></span>
+ <span class="nt"></div></span>
+ <span class="nt"></article></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile is-8 is-vertical"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile is-parent"</span><span class="nt">></span>
+ <span class="nt"><article</span> <span class="na">class=</span><span class="s">"tile is-child box"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"title"</span><span class="nt">></span>Six<span class="nt"></p></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"subtitle"</span><span class="nt">></span>Subtitle<span class="nt"></p></span>
+ <span class="nt"></article></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile is-parent"</span><span class="nt">></span>
+ <span class="nt"><article</span> <span class="na">class=</span><span class="s">"tile is-child box"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"title"</span><span class="nt">></span>Seven<span class="nt"></p></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"subtitle"</span><span class="nt">></span>Subtitle<span class="nt"></p></span>
+ <span class="nt"></article></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile is-parent"</span><span class="nt">></span>
+ <span class="nt"><article</span> <span class="na">class=</span><span class="s">"tile is-child box"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"title"</span><span class="nt">></span>Eight<span class="nt"></p></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"subtitle"</span><span class="nt">></span>Subtitle<span class="nt"></p></span>
+ <span class="nt"></article></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile is-8 is-parent"</span><span class="nt">></span>
+ <span class="nt"><article</span> <span class="na">class=</span><span class="s">"tile is-child box"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"title"</span><span class="nt">></span>Nine<span class="nt"></p></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"subtitle"</span><span class="nt">></span>Subtitle<span class="nt"></p></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"content"</span><span class="nt">></span>
+ <span class="nt"><p></span>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin ornare magna eros, eu pellentesque tortor vestibulum ut. Maecenas non massa sem. Etiam finibus odio quis feugiat facilisis.<span class="nt"></p></span>
+ <span class="nt"></div></span>
+ <span class="nt"></article></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile is-parent"</span><span class="nt">></span>
+ <span class="nt"><article</span> <span class="na">class=</span><span class="s">"tile is-child box"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"title"</span><span class="nt">></span>Ten<span class="nt"></p></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"subtitle"</span><span class="nt">></span>Subtitle<span class="nt"></p></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"content"</span><span class="nt">></span>
+ <span class="nt"><p></span>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin ornare magna eros, eu pellentesque tortor vestibulum ut. Maecenas non massa sem. Etiam finibus odio quis feugiat facilisis.<span class="nt"></p></span>
+ <span class="nt"></div></span>
+ <span class="nt"></article></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile is-parent"</span><span class="nt">></span>
+ <span class="nt"><article</span> <span class="na">class=</span><span class="s">"tile is-child box"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"content"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"title"</span><span class="nt">></span>Eleven<span class="nt"></p></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"subtitle"</span><span class="nt">></span>Subtitle<span class="nt"></p></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"content"</span><span class="nt">></span>
+ <span class="nt"><p></span>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Etiam semper diam at erat pulvinar, at pulvinar felis blandit. Vestibulum volutpat tellus diam, consequat gravida libero rhoncus ut. Morbi maximus, leo sit amet vehicula eleifend, nunc dui porta orci, quis semper odio felis ut quam.<span class="nt"></p></span>
+ <span class="nt"><p></span>Integer sollicitudin, tortor a mattis commodo, velit urna rhoncus erat, vitae congue lectus dolor consequat libero. Donec leo ligula, maximus et pellentesque sed, gravida a metus. Cras ullamcorper a nunc ac porta. Aliquam ut aliquet lacus, quis faucibus libero. Quisque non semper leo.<span class="nt"></p></span>
+ <span class="nt"></div></span>
+ <span class="nt"></div></span>
+ <span class="nt"></article></span>
+ <span class="nt"></div></span>
+<span class="nt"></div></span>
+
+<span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile is-ancestor"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile is-parent"</span><span class="nt">></span>
+ <span class="nt"><article</span> <span class="na">class=</span><span class="s">"tile is-child box"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"title"</span><span class="nt">></span>Twelve<span class="nt"></p></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"subtitle"</span><span class="nt">></span>Subtitle<span class="nt"></p></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"content"</span><span class="nt">></span>
+ <span class="nt"><p></span>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin ornare magna eros, eu pellentesque tortor vestibulum ut.<span class="nt"></p></span>
+ <span class="nt"></div></span>
+ <span class="nt"></article></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile is-parent is-6"</span><span class="nt">></span>
+ <span class="nt"><article</span> <span class="na">class=</span><span class="s">"tile is-child box"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"title"</span><span class="nt">></span>Thirteen<span class="nt"></p></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"subtitle"</span><span class="nt">></span>Subtitle<span class="nt"></p></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"content"</span><span class="nt">></span>
+ <span class="nt"><p></span>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin ornare magna eros, eu pellentesque tortor vestibulum ut. Maecenas non massa sem. Etiam finibus odio quis feugiat facilisis.<span class="nt"></p></span>
+ <span class="nt"></div></span>
+ <span class="nt"></article></span>
+ <span class="nt"></div></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"tile is-parent"</span><span class="nt">></span>
+ <span class="nt"><article</span> <span class="na">class=</span><span class="s">"tile is-child box"</span><span class="nt">></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"title"</span><span class="nt">></span>Fourteen<span class="nt"></p></span>
+ <span class="nt"><p</span> <span class="na">class=</span><span class="s">"subtitle"</span><span class="nt">></span>Subtitle<span class="nt"></p></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"content"</span><span class="nt">></span>
+ <span class="nt"><p></span>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin ornare magna eros, eu pellentesque tortor vestibulum ut.<span class="nt"></p></span>
+ <span class="nt"></div></span>
+ <span class="nt"></article></span>
+ <span class="nt"></div></span>
+<span class="nt"></div></span></code></pre></figure>
+ </div>
+</section>
+
+ <script src="//m.servedby-buysellads.com/monetization.js" type="text/javascript"></script>
+
+<section class="hero is-info bsa">
+ <div class="container">
+ <div class="columns is-vcentered">
+ <div class="column is-4">
+ <p class="title">Bulma <strong>Partners</strong></p>
+ <p class="subtitle">Check out their products!</p>
+ </div>
+
+ <div class="column is-8">
+ <div class="bsa-cpc"></div>
+ </div>
+ </div>
+ </div>
+</section>
+
+<script>
+ (function(){
+ if(typeof _bsa !== 'undefined' && _bsa) {
+ _bsa.init('default', 'CVAIKK3E', 'placement:bulmaio', {
+ target: '.bsa-cpc',
+ align: 'horizontal',
+ disable_css: 'true'
+ });
+ }
+ })();
+</script>
+
+
+<section id="newsletter" class="hero is-primary">
+ <div class="hero-body">
+ <div class="container">
+ <!-- Begin MailChimp Signup Form -->
+ <div id="mc_embed_signup" class="columns is-vcentered">
+ <div class="column is-one-third is-left">
+ <p class="title">Bulma <strong>Newsletter</strong></p>
+ <p class="subtitle">Get notified when v1 is ready!</p>
+ </div>
+
+ <div class="column">
+ <form action="https://bbxdesign.us3.list-manage.com/subscribe/post?u=b43b93fe633f0560b2a72a69c&id=52585e8803" method="post" id="mc-embedded-subscribe-form" name="mc-embedded-subscribe-form" class="validate" target="_blank" novalidate>
+ <div id="mc_embed_signup_scroll">
+ <div class="field is-grouped">
+ <div class="control has-icons-left is-expanded">
+ <input type="email" value="" name="EMAIL" class="input is-flat required email" id="mce-EMAIL" placeholder="email address" required>
+ <span class="icon is-small is-left">
+ <i class="fa fa-envelope"></i>
+ </span>
+ </div>
+ <div class="control">
+ <input type="submit" value="Subscribe" name="subscribe" id="mc-embedded-subscribe" class="button is-white is-outlined">
+ </div>
+ </div>
+ <div id="mce-responses">
+ <div class="notification is-danger response" id="mce-error-response" style="display:none"></div>
+ <div class="notification is-success response" id="mce-success-response" style="display:none"></div>
+ </div>
+ <!-- real people should not fill this in and expect good things - do not remove this or risk form bot signups-->
+ <div style="position: absolute; left: -5000px;" aria-hidden="true">
+ <input type="text" name="b_b43b93fe633f0560b2a72a69c_52585e8803" tabindex="-1" value="">
+ </div>
+ </div>
+ </form>
+ </div>
+ </div>
+ <!--End mc_embed_signup-->
+ </div>
+ </div>
+</section>
+
+<footer class="footer">
+ <div class="container">
+ <div class="columns">
+ <div class="column is-3">
+ <div id="about" class="content">
+ <strong xmlns:dct="http://purl.org/dc/terms/" href="http://purl.org/dc/dcmitype/Text" property="dct:title" rel="dct:type">Bulma</strong> by <a xmlns:cc="http://creativecommons.org/ns#" href="http://jgthms.com" property="cc:attributionName" rel="cc:attributionURL">Jeremy Thomas</a>.
+ <div class="twitter-container">
+ <a href="https://twitter.com/jgthms" class="twitter-follow-button" data-show-count="true" data-lang="en" data-size="large">@jgthms</a>
+ </div>
+ </div>
+ </div>
+ <div class="column is-5">
+ <div id="share" class="content">
+ <div>
+ <strong>Support</strong> and share the love!
+ </div>
+ <div id="social">
+ <iframe class="github-btn" src="https://ghbtns.com/github-btn.html?user=jgthms&repo=bulma&type=star&count=true&size=large" allowtransparency="true" frameborder="0" scrolling="0" width="160px" height="30px"></iframe>
+
+ <a href="https://twitter.com/share" class="twitter-share-button" data-text="Bulma v0.4.4: a modern CSS framework based on Flexbox" data-url="http://bulma.io/versions/0.4.4" data-count="horizontal" data-via="jgthms" data-related="jgthms:Creator of Bulma" data-size="large">Tweet</a>
+
+ <form class="paypal-form" action="https://www.paypal.com/cgi-bin/webscr" method="post" target="_top">
+ <input type="hidden" name="cmd" value="_s-xclick">
+ <input type="hidden" name="hosted_button_id" value="8WMKYSRFN6A78">
+ <input type="image" src="http://bulma.io/versions/0.4.4/images/paypal-donate.png" border="0" name="submit" alt="PayPal – The safer, easier way to pay online." height="30">
+ <img alt="" border="0" src="https://www.paypalobjects.com/en_GB/i/scr/pixel.gif" width="1" height="1">
+ </form>
+
+ <div class="fb-like" data-href="https://www.facebook.com/bulmaio" data-layout="button" data-action="like" data-size="large" data-show-faces="false" data-share="true"></div>
+ </div>
+ </div>
+ </div>
+ <div class="column is-4">
+ <div id="sister">
+ <p>
+ More <strong>helpful</strong> tools:
+ </p>
+ <ul>
+ <li>
+ <a href="http://cssreference.io">
+ <img src="http://bulma.io/versions/0.4.4/images/css-reference-logo.png" alt="CSS Reference logo">
+ </a>
+ </li>
+ <li>
+ <a href="http://htmlreference.io">
+ <img src="http://bulma.io/versions/0.4.4/images/html-reference-logo.png" alt="HTML Reference logo">
+ </a>
+ </li>
+ </ul>
+ </div>
+ </div>
+ </div>
+
+ <p id="tsp">
+ <small>
+ Source code licensed <a href="http://opensource.org/licenses/mit-license.php">MIT</a>.
+ <br>
+ Website content licensed <a rel="license" href="http://creativecommons.org/licenses/by-nc-sa/4.0/">CC BY-NC-SA 4.0</a>.
+ </small>
+ </p>
+ </div>
+</footer>
+
+<script src="http://bulma.io/versions/0.4.4/vendor/clipboard-1.7.1.min.js"></script>
+<script src="http://bulma.io/versions/0.4.4/lib/main.js"></script>
+
+
+
+<div id="fb-root"></div>
+
+<script async defer type="text/javascript">(function(d, s, id) {
+ var js, fjs = d.getElementsByTagName(s)[0];
+ if (d.getElementById(id)) return;
+ js = d.createElement(s); js.id = id;
+ js.async = true;
+ js.defer = true;
+ js.src = "//connect.facebook.net/en_US/sdk.js#xfbml=1&version=v2.8&appId=310296819307942";
+ fjs.parentNode.insertBefore(js, fjs);
+}(document, 'script', 'facebook-jssdk'));</script>
+
+<script async defer id="twitter-wjs" src="https://platform.twitter.com/widgets.js"></script>
+<script async defer type="text/javascript" src="https://s3.amazonaws.com/downloads.mailchimp.com/js/mc-validate.js"></script>
+
+<script async defer type="text/javascript">
+ (function() {
+ window.fnames = new Array();
+ window.ftypes = new Array();
+ fnames[0]='EMAIL';
+ ftypes[0]='email';
+ }());
+ // var $mcj = window.jQuery.noConflict(true);
+</script>
+
+<script async defer type="text/javascript">
+ (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
+ (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
+ m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
+ })(window,document,'script','https://www.google-analytics.com/analytics.js','ga');
+
+ ga('create', 'UA-82634666-2', 'auto');
+ ga('send', 'pageview');
+</script>
+
+ </body>
+</html>
diff --git a/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/vendor/clipboard-1.7.1.min.js b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/vendor/clipboard-1.7.1.min.js
new file mode 100644
index 0000000000000000000000000000000000000000..90fd15b1c06ab11571aceb625f76512bbc2b67ad
--- /dev/null
+++ b/hshassets/assets/sass/lib/bulma-0.5.1/docs/versions/0.5.0/versions/0.4.4/vendor/clipboard-1.7.1.min.js
@@ -0,0 +1,7 @@
+/*!
+ * clipboard.js v1.7.1
+ * https://zenorocha.github.io/clipboard.js
+ *
+ * Licensed MIT © Zeno Rocha
+ */
+!function(t){if("object"==typeof exports&&"undefined"!=typeof module)module.exports=t();else if("function"==typeof define&&define.amd)define([],t);else{var e;e="undefined"!=typeof window?window:"undefined"!=typeof global?global:"undefined"!=typeof self?self:this,e.Clipboard=t()}}(function(){var t,e,n;return function t(e,n,o){function i(a,c){if(!n[a]){if(!e[a]){var l="function"==typeof require&&require;if(!c&&l)return l(a,!0);if(r)return r(a,!0);var s=new Error("Cannot find module '"+a+"'");throw s.code="MODULE_NOT_FOUND",s}var u=n[a]={exports:{}};e[a][0].call(u.exports,function(t){var n=e[a][1][t];return i(n||t)},u,u.exports,t,e,n,o)}return n[a].exports}for(var r="function"==typeof require&&require,a=0;a<o.length;a++)i(o[a]);return i}({1:[function(t,e,n){function o(t,e){for(;t&&t.nodeType!==i;){if("function"==typeof t.matches&&t.matches(e))return t;t=t.parentNode}}var i=9;if("undefined"!=typeof Element&&!Element.prototype.matches){var r=Element.prototype;r.matches=r.matchesSelector||r.mozMatchesSelector||r.msMatchesSelector||r.oMatchesSelector||r.webkitMatchesSelector}e.exports=o},{}],2:[function(t,e,n){function o(t,e,n,o,r){var a=i.apply(this,arguments);return t.addEventListener(n,a,r),{destroy:function(){t.removeEventListener(n,a,r)}}}function i(t,e,n,o){return function(n){n.delegateTarget=r(n.target,e),n.delegateTarget&&o.call(t,n)}}var r=t("./closest");e.exports=o},{"./closest":1}],3:[function(t,e,n){n.node=function(t){return void 0!==t&&t instanceof HTMLElement&&1===t.nodeType},n.nodeList=function(t){var e=Object.prototype.toString.call(t);return void 0!==t&&("[object NodeList]"===e||"[object HTMLCollection]"===e)&&"length"in t&&(0===t.length||n.node(t[0]))},n.string=function(t){return"string"==typeof t||t instanceof String},n.fn=function(t){return"[object Function]"===Object.prototype.toString.call(t)}},{}],4:[function(t,e,n){function o(t,e,n){if(!t&&!e&&!n)throw new Error("Missing required arguments");if(!c.string(e))throw new TypeError("Second argument must be a String");if(!c.fn(n))throw new TypeError("Third argument must be a Function");if(c.node(t))return i(t,e,n);if(c.nodeList(t))return r(t,e,n);if(c.string(t))return a(t,e,n);throw new TypeError("First argument must be a String, HTMLElement, HTMLCollection, or NodeList")}function i(t,e,n){return t.addEventListener(e,n),{destroy:function(){t.removeEventListener(e,n)}}}function r(t,e,n){return Array.prototype.forEach.call(t,function(t){t.addEventListener(e,n)}),{destroy:function(){Array.prototype.forEach.call(t,function(t){t.removeEventListener(e,n)})}}}function a(t,e,n){return l(document.body,t,e,n)}var c=t("./is"),l=t("delegate");e.exports=o},{"./is":3,delegate:2}],5:[function(t,e,n){function o(t){var e;if("SELECT"===t.nodeName)t.focus(),e=t.value;else if("INPUT"===t.nodeName||"TEXTAREA"===t.nodeName){var n=t.hasAttribute("readonly");n||t.setAttribute("readonly",""),t.select(),t.setSelectionRange(0,t.value.length),n||t.removeAttribute("readonly"),e=t.value}else{t.hasAttribute("contenteditable")&&t.focus();var o=window.getSelection(),i=document.createRange();i.selectNodeContents(t),o.removeAllRanges(),o.addRange(i),e=o.toString()}return e}e.exports=o},{}],6:[function(t,e,n){function o(){}o.prototype={on:function(t,e,n){var o=this.e||(this.e={});return(o[t]||(o[t]=[])).push({fn:e,ctx:n}),this},once:function(t,e,n){function o(){i.off(t,o),e.apply(n,arguments)}var i=this;return o._=e,this.on(t,o,n)},emit:function(t){var e=[].slice.call(arguments,1),n=((this.e||(this.e={}))[t]||[]).slice(),o=0,i=n.length;for(o;o<i;o++)n[o].fn.apply(n[o].ctx,e);return this},off:function(t,e){var n=this.e||(this.e={}),o=n[t],i=[];if(o&&e)for(var r=0,a=o.length;r<a;r++)o[r].fn!==e&&o[r].fn._!==e&&i.push(o[r]);return i.length?n[t]=i:delete n[t],this}},e.exports=o},{}],7:[function(e,n,o){!function(i,r){if("function"==typeof t&&t.amd)t(["module","select"],r);else if(void 0!==o)r(n,e("select"));else{var a={exports:{}};r(a,i.select),i.clipboardAction=a.exports}}(this,function(t,e){"use strict";function n(t){return t&&t.__esModule?t:{default:t}}function o(t,e){if(!(t instanceof e))throw new TypeError("Cannot call a class as a function")}var i=n(e),r="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(t){return typeof t}:function(t){return t&&"function"==typeof Symbol&&t.constructor===Symbol&&t!==Symbol.prototype?"symbol":typeof t},a=function(){function t(t,e){for(var n=0;n<e.length;n++){var o=e[n];o.enumerable=o.enumerable||!1,o.configurable=!0,"value"in o&&(o.writable=!0),Object.defineProperty(t,o.key,o)}}return function(e,n,o){return n&&t(e.prototype,n),o&&t(e,o),e}}(),c=function(){function t(e){o(this,t),this.resolveOptions(e),this.initSelection()}return a(t,[{key:"resolveOptions",value:function t(){var e=arguments.length>0&&void 0!==arguments[0]?arguments[0]:{};this.action=e.action,this.container=e.container,this.emitter=e.emitter,this.target=e.target,this.text=e.text,this.trigger=e.trigger,this.selectedText=""}},{key:"initSelection",value:function t(){this.text?this.selectFake():this.target&&this.selectTarget()}},{key:"selectFake",value:function t(){var e=this,n="rtl"==document.documentElement.getAttribute("dir");this.removeFake(),this.fakeHandlerCallback=function(){return e.removeFake()},this.fakeHandler=this.container.addEventListener("click",this.fakeHandlerCallback)||!0,this.fakeElem=document.createElement("textarea"),this.fakeElem.style.fontSize="12pt",this.fakeElem.style.border="0",this.fakeElem.style.padding="0",this.fakeElem.style.margin="0",this.fakeElem.style.position="absolute",this.fakeElem.style[n?"right":"left"]="-9999px";var o=window.pageYOffset||document.documentElement.scrollTop;this.fakeElem.style.top=o+"px",this.fakeElem.setAttribute("readonly",""),this.fakeElem.value=this.text,this.container.appendChild(this.fakeElem),this.selectedText=(0,i.default)(this.fakeElem),this.copyText()}},{key:"removeFake",value:function t(){this.fakeHandler&&(this.container.removeEventListener("click",this.fakeHandlerCallback),this.fakeHandler=null,this.fakeHandlerCallback=null),this.fakeElem&&(this.container.removeChild(this.fakeElem),this.fakeElem=null)}},{key:"selectTarget",value:function t(){this.selectedText=(0,i.default)(this.target),this.copyText()}},{key:"copyText",value:function t(){var e=void 0;try{e=document.execCommand(this.action)}catch(t){e=!1}this.handleResult(e)}},{key:"handleResult",value:function t(e){this.emitter.emit(e?"success":"error",{action:this.action,text:this.selectedText,trigger:this.trigger,clearSelection:this.clearSelection.bind(this)})}},{key:"clearSelection",value:function t(){this.trigger&&this.trigger.focus(),window.getSelection().removeAllRanges()}},{key:"destroy",value:function t(){this.removeFake()}},{key:"action",set:function t(){var e=arguments.length>0&&void 0!==arguments[0]?arguments[0]:"copy";if(this._action=e,"copy"!==this._action&&"cut"!==this._action)throw new Error('Invalid "action" value, use either "copy" or "cut"')},get:function t(){return this._action}},{key:"target",set:function t(e){if(void 0!==e){if(!e||"object"!==(void 0===e?"undefined":r(e))||1!==e.nodeType)throw new Error('Invalid "target" value, use a valid Element');if("copy"===this.action&&e.hasAttribute("disabled"))throw new Error('Invalid "target" attribute. Please use "readonly" instead of "disabled" attribute');if("cut"===this.action&&(e.hasAttribute("readonly")||e.hasAttribute("disabled")))throw new Error('Invalid "target" attribute. You can\'t cut text from elements with "readonly" or "disabled" attributes');this._target=e}},get:function t(){return this._target}}]),t}();t.exports=c})},{select:5}],8:[function(e,n,o){!function(i,r){if("function"==typeof t&&t.amd)t(["module","./clipboard-action","tiny-emitter","good-listener"],r);else if(void 0!==o)r(n,e("./clipboard-action"),e("tiny-emitter"),e("good-listener"));else{var a={exports:{}};r(a,i.clipboardAction,i.tinyEmitter,i.goodListener),i.clipboard=a.exports}}(this,function(t,e,n,o){"use strict";function i(t){return t&&t.__esModule?t:{default:t}}function r(t,e){if(!(t instanceof e))throw new TypeError("Cannot call a class as a function")}function a(t,e){if(!t)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return!e||"object"!=typeof e&&"function"!=typeof e?t:e}function c(t,e){if("function"!=typeof e&&null!==e)throw new TypeError("Super expression must either be null or a function, not "+typeof e);t.prototype=Object.create(e&&e.prototype,{constructor:{value:t,enumerable:!1,writable:!0,configurable:!0}}),e&&(Object.setPrototypeOf?Object.setPrototypeOf(t,e):t.__proto__=e)}function l(t,e){var n="data-clipboard-"+t;if(e.hasAttribute(n))return e.getAttribute(n)}var s=i(e),u=i(n),f=i(o),d="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(t){return typeof t}:function(t){return t&&"function"==typeof Symbol&&t.constructor===Symbol&&t!==Symbol.prototype?"symbol":typeof t},h=function(){function t(t,e){for(var n=0;n<e.length;n++){var o=e[n];o.enumerable=o.enumerable||!1,o.configurable=!0,"value"in o&&(o.writable=!0),Object.defineProperty(t,o.key,o)}}return function(e,n,o){return n&&t(e.prototype,n),o&&t(e,o),e}}(),p=function(t){function e(t,n){r(this,e);var o=a(this,(e.__proto__||Object.getPrototypeOf(e)).call(this));return o.resolveOptions(n),o.listenClick(t),o}return c(e,t),h(e,[{key:"resolveOptions",value:function t(){var e=arguments.length>0&&void 0!==arguments[0]?arguments[0]:{};this.action="function"==typeof e.action?e.action:this.defaultAction,this.target="function"==typeof e.target?e.target:this.defaultTarget,this.text="function"==typeof e.text?e.text:this.defaultText,this.container="object"===d(e.container)?e.container:document.body}},{key:"listenClick",value:function t(e){var n=this;this.listener=(0,f.default)(e,"click",function(t){return n.onClick(t)})}},{key:"onClick",value:function t(e){var n=e.delegateTarget||e.currentTarget;this.clipboardAction&&(this.clipboardAction=null),this.clipboardAction=new s.default({action:this.action(n),target:this.target(n),text:this.text(n),container:this.container,trigger:n,emitter:this})}},{key:"defaultAction",value:function t(e){return l("action",e)}},{key:"defaultTarget",value:function t(e){var n=l("target",e);if(n)return document.querySelector(n)}},{key:"defaultText",value:function t(e){return l("text",e)}},{key:"destroy",value:function t(){this.listener.destroy(),this.clipboardAction&&(this.clipboardAction.destroy(),this.clipboardAction=null)}}],[{key:"isSupported",value:function t(){var e=arguments.length>0&&void 0!==arguments[0]?arguments[0]:["copy","cut"],n="string"==typeof e?[e]:e,o=!!document.queryCommandSupported;return n.forEach(function(t){o=o&&!!document.queryCommandSupported(t)}),o}}]),e}(u.default);t.exports=p})},{"./clipboard-action":7,"good-listener":4,"tiny-emitter":6}]},{},[8])(8)});
\ No newline at end of file
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/docs/yarn.lock b/hshassets/assets/sass/lib/bulma-0.5.1/docs/yarn.lock
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/docs/yarn.lock
rename to hshassets/assets/sass/lib/bulma-0.5.1/docs/yarn.lock
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/package.json b/hshassets/assets/sass/lib/bulma-0.5.1/package.json
similarity index 85%
rename from hshassets/assets/sass/lib/bulma-0.5.0/package.json
rename to hshassets/assets/sass/lib/bulma-0.5.1/package.json
index 1feb44d4d883a5e70d2cf6180ce60913558512be..64b6bc3527f10d62be4f7ed916a92c7baa06853e 100644
--- a/hshassets/assets/sass/lib/bulma-0.5.0/package.json
+++ b/hshassets/assets/sass/lib/bulma-0.5.1/package.json
@@ -1,6 +1,6 @@
{
"name": "bulma",
- "version": "0.5.0",
+ "version": "0.5.1",
"homepage": "http://bulma.io",
"author": "Jeremy Thomas <bbxdesign@gmail.com> (http://jgthms.com)",
"description": "Modern CSS framework based on Flexbox",
@@ -29,12 +29,12 @@
},
"scripts": {
"build": "npm run build-clean && npm run build-sass && npm run build-autoprefix",
- "build-autoprefix": "postcss --use autoprefixer --output css/bulma.css css/bulma.css",
+ "build-autoprefix": "postcss --use autoprefixer --map false --output css/bulma.css css/bulma.css",
"build-clean": "rimraf css",
"build-sass": "node-sass --output-style expanded --source-map true bulma.sass css/bulma.css",
"deploy": "npm run build && npm run docs",
"docs": "npm run docs-sass && npm run docs-autoprefix",
- "docs-autoprefix": "postcss --use autoprefixer --output docs/css/bulma-docs.css docs/css/bulma-docs.css",
+ "docs-autoprefix": "postcss --use autoprefixer --map false --output docs/css/bulma-docs.css docs/css/bulma-docs.css",
"docs-sass": "node-sass --output-style expanded docs/bulma-docs.sass docs/css/bulma-docs.css",
"start": "npm run build-sass -- --watch",
"start-docs": "npm run docs-sass -- --watch",
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/sass/base/_all.sass b/hshassets/assets/sass/lib/bulma-0.5.1/sass/base/_all.sass
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/sass/base/_all.sass
rename to hshassets/assets/sass/lib/bulma-0.5.1/sass/base/_all.sass
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/sass/base/generic.sass b/hshassets/assets/sass/lib/bulma-0.5.1/sass/base/generic.sass
similarity index 98%
rename from hshassets/assets/sass/lib/bulma-0.5.0/sass/base/generic.sass
rename to hshassets/assets/sass/lib/bulma-0.5.1/sass/base/generic.sass
index cfeee2a872cdfc62e306b5664ef1f84b0b63e95a..1db291d1486741c83c23835d6e7ca4852d6556fc 100755
--- a/hshassets/assets/sass/lib/bulma-0.5.0/sass/base/generic.sass
+++ b/hshassets/assets/sass/lib/bulma-0.5.1/sass/base/generic.sass
@@ -62,6 +62,8 @@ a
color: $link
cursor: pointer
text-decoration: none
+ strong
+ color: currentColor
&:hover
color: $link-hover
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/sass/base/helpers.sass b/hshassets/assets/sass/lib/bulma-0.5.1/sass/base/helpers.sass
similarity index 67%
rename from hshassets/assets/sass/lib/bulma-0.5.0/sass/base/helpers.sass
rename to hshassets/assets/sass/lib/bulma-0.5.1/sass/base/helpers.sass
index 251b03b4d8b1c16e62bd6d3456d90e2a4fd06a3b..d1b08c7e44680041d61698a0bf0dbcd7bddc38ea 100755
--- a/hshassets/assets/sass/lib/bulma-0.5.0/sass/base/helpers.sass
+++ b/hshassets/assets/sass/lib/bulma-0.5.1/sass/base/helpers.sass
@@ -44,14 +44,47 @@
.is-size-#{$i}-fullhd
font-size: $size !important
-.has-text-centered
- text-align: center !important
+$alignments: ('centered': 'center', 'left': 'left', 'right': 'right')
-.has-text-left
- text-align: left !important
+@each $alignment, $text-align in $alignments
+ .has-text-#{$alignment}
+ text-align: #{$text-align} !important
+ +mobile
+ .has-text-#{$alignment}-mobile
+ text-align: #{$text-align} !important
+ +tablet
+ .has-text-#{$alignment}-tablet
+ text-align: #{$text-align} !important
+ +tablet-only
+ .has-text-#{$alignment}-tablet-only
+ text-align: #{$text-align} !important
+ +touch
+ .has-text-#{$alignment}-touch
+ text-align: #{$text-align} !important
+ +desktop
+ .has-text-#{$alignment}-desktop
+ text-align: #{$text-align} !important
+ +desktop-only
+ .has-text-#{$alignment}-desktop-only
+ text-align: #{$text-align} !important
+ +widescreen
+ .has-text-#{$alignment}-widescreen
+ text-align: #{$text-align} !important
+ +widescreen-only
+ .has-text-#{$alignment}-widescreen-only
+ text-align: #{$text-align} !important
+ +fullhd
+ .has-text-#{$alignment}-fullhd
+ text-align: #{$text-align} !important
+
+.is-capitalized
+ text-transform: capitalize !important
+
+.is-lowercase
+ text-transform: lowercase !important
-.has-text-right
- text-align: right !important
+.is-uppercase
+ text-transform: uppercase !important
@each $name, $pair in $colors
$color: nth($pair, 1)
@@ -60,7 +93,7 @@
a.has-text-#{$name}
&:hover,
&:focus
- color: darken($color, 10%)
+ color: darken($color, 10%) !important
@each $name, $shade in $shades
.has-text-#{$name}
@@ -72,7 +105,7 @@ $displays: 'block' 'flex' 'inline' 'inline-block' 'inline-flex'
@each $display in $displays
.is-#{$display}
- display: #{$display}
+ display: #{$display} !important
+mobile
.is-#{$display}-mobile
display: #{$display} !important
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/sass/base/minireset.sass b/hshassets/assets/sass/lib/bulma-0.5.1/sass/base/minireset.sass
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/sass/base/minireset.sass
rename to hshassets/assets/sass/lib/bulma-0.5.1/sass/base/minireset.sass
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/sass/components/_all.sass b/hshassets/assets/sass/lib/bulma-0.5.1/sass/components/_all.sass
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/sass/components/_all.sass
rename to hshassets/assets/sass/lib/bulma-0.5.1/sass/components/_all.sass
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/sass/components/breadcrumb.sass b/hshassets/assets/sass/lib/bulma-0.5.1/sass/components/breadcrumb.sass
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/sass/components/breadcrumb.sass
rename to hshassets/assets/sass/lib/bulma-0.5.1/sass/components/breadcrumb.sass
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/sass/components/card.sass b/hshassets/assets/sass/lib/bulma-0.5.1/sass/components/card.sass
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/sass/components/card.sass
rename to hshassets/assets/sass/lib/bulma-0.5.1/sass/components/card.sass
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/sass/components/dropdown.sass b/hshassets/assets/sass/lib/bulma-0.5.1/sass/components/dropdown.sass
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/sass/components/dropdown.sass
rename to hshassets/assets/sass/lib/bulma-0.5.1/sass/components/dropdown.sass
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/sass/components/level.sass b/hshassets/assets/sass/lib/bulma-0.5.1/sass/components/level.sass
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/sass/components/level.sass
rename to hshassets/assets/sass/lib/bulma-0.5.1/sass/components/level.sass
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/sass/components/media.sass b/hshassets/assets/sass/lib/bulma-0.5.1/sass/components/media.sass
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/sass/components/media.sass
rename to hshassets/assets/sass/lib/bulma-0.5.1/sass/components/media.sass
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/sass/components/menu.sass b/hshassets/assets/sass/lib/bulma-0.5.1/sass/components/menu.sass
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/sass/components/menu.sass
rename to hshassets/assets/sass/lib/bulma-0.5.1/sass/components/menu.sass
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/sass/components/message.sass b/hshassets/assets/sass/lib/bulma-0.5.1/sass/components/message.sass
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/sass/components/message.sass
rename to hshassets/assets/sass/lib/bulma-0.5.1/sass/components/message.sass
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/sass/components/modal.sass b/hshassets/assets/sass/lib/bulma-0.5.1/sass/components/modal.sass
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/sass/components/modal.sass
rename to hshassets/assets/sass/lib/bulma-0.5.1/sass/components/modal.sass
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/sass/components/nav.sass b/hshassets/assets/sass/lib/bulma-0.5.1/sass/components/nav.sass
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/sass/components/nav.sass
rename to hshassets/assets/sass/lib/bulma-0.5.1/sass/components/nav.sass
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/sass/components/navbar.sass b/hshassets/assets/sass/lib/bulma-0.5.1/sass/components/navbar.sass
similarity index 96%
rename from hshassets/assets/sass/lib/bulma-0.5.0/sass/components/navbar.sass
rename to hshassets/assets/sass/lib/bulma-0.5.1/sass/components/navbar.sass
index 473b2a4564200cab8d1f4371a25c8ea0fd98b710..af67e8756ab193e59755f7a4f6c740fad50e1686 100755
--- a/hshassets/assets/sass/lib/bulma-0.5.0/sass/components/navbar.sass
+++ b/hshassets/assets/sass/lib/bulma-0.5.1/sass/components/navbar.sass
@@ -6,6 +6,7 @@ $navbar-item-hover-color: $black !default
$navbar-item-hover-background-color: $background !default
$navbar-item-active-color: $black !default
$navbar-item-active-background-color: transparent !default
+$navbar-item-img-max-height: 1.75rem !default
$navbar-tab-hover-background-color: transparent !default
$navbar-tab-hover-border-bottom-color: $primary !default
@@ -48,6 +49,8 @@ $navbar-divider-background-color: $border !default
+overflow-touch
align-items: stretch
display: flex
+ flex-shrink: 0
+ max-width: 100vw
min-height: $navbar-height
overflow-x: auto
overflow-y: hidden
@@ -78,7 +81,7 @@ a.navbar-item,
flex-grow: 0
flex-shrink: 0
img
- max-height: 1.75rem
+ max-height: $navbar-item-img-max-height
&.has-dropdown
padding: 0
&.is-tab
@@ -119,6 +122,8 @@ a.navbar-item,
margin: 0.5rem 0
+touch
+ .navbar > .container
+ display: block
.navbar-brand
.navbar-item
align-items: center
@@ -224,6 +229,9 @@ a.navbar-item,
transform: translateY(-5px)
transition-duration: $speed
transition-property: opacity, transform
+ &.is-right
+ left: auto
+ right: 0
.navbar-divider
display: block
.container > .navbar
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/sass/components/pagination.sass b/hshassets/assets/sass/lib/bulma-0.5.1/sass/components/pagination.sass
similarity index 98%
rename from hshassets/assets/sass/lib/bulma-0.5.0/sass/components/pagination.sass
rename to hshassets/assets/sass/lib/bulma-0.5.1/sass/components/pagination.sass
index 2bf42276189e958364a47b4c77415b8d3dd50efd..915ba4064819a7b4967dd35f3b25de7c20526143 100755
--- a/hshassets/assets/sass/lib/bulma-0.5.0/sass/components/pagination.sass
+++ b/hshassets/assets/sass/lib/bulma-0.5.1/sass/components/pagination.sass
@@ -1,5 +1,4 @@
$pagination-color: $grey-darker !default
-$pagination-background: $white !default
$pagination-border-color: $grey-lighter !default
$pagination-margin: -0.25rem !default
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/sass/components/panel.sass b/hshassets/assets/sass/lib/bulma-0.5.1/sass/components/panel.sass
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/sass/components/panel.sass
rename to hshassets/assets/sass/lib/bulma-0.5.1/sass/components/panel.sass
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/sass/components/tabs.sass b/hshassets/assets/sass/lib/bulma-0.5.1/sass/components/tabs.sass
similarity index 98%
rename from hshassets/assets/sass/lib/bulma-0.5.0/sass/components/tabs.sass
rename to hshassets/assets/sass/lib/bulma-0.5.1/sass/components/tabs.sass
index 44c109242a6bc37e90215f7bca3816d71a88249f..6bbee67685dc9ccad2b04e000157e40a09ba7431 100755
--- a/hshassets/assets/sass/lib/bulma-0.5.0/sass/components/tabs.sass
+++ b/hshassets/assets/sass/lib/bulma-0.5.1/sass/components/tabs.sass
@@ -14,7 +14,7 @@ $tabs-boxed-link-hover-border-bottom-color: $border !default
$tabs-boxed-link-active-background-color: $white !default
$tabs-boxed-link-active-border-color: $border !default
-$tabs-boxed-link-active-border-bottom-color: transparent !important !default
+$tabs-boxed-link-active-border-bottom-color: transparent !default
$tabs-toggle-link-border-color: $border !default
$tabs-toggle-link-border-style: solid !default
@@ -101,7 +101,7 @@ $tabs-toggle-link-active-color: $primary-invert !default
a
background-color: $tabs-boxed-link-active-background-color
border-color: $tabs-boxed-link-active-border-color
- border-bottom-color: $tabs-boxed-link-active-border-bottom-color
+ border-bottom-color: $tabs-boxed-link-active-border-bottom-color !important
&.is-fullwidth
li
flex-grow: 1
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/sass/elements/_all.sass b/hshassets/assets/sass/lib/bulma-0.5.1/sass/elements/_all.sass
similarity index 91%
rename from hshassets/assets/sass/lib/bulma-0.5.0/sass/elements/_all.sass
rename to hshassets/assets/sass/lib/bulma-0.5.1/sass/elements/_all.sass
index 54f5b2fcde8afff802b6e0b76a0205ad3f718841..2234322ab5645290def4b9c04ad8c66a23d9ee52 100755
--- a/hshassets/assets/sass/lib/bulma-0.5.0/sass/elements/_all.sass
+++ b/hshassets/assets/sass/lib/bulma-0.5.1/sass/elements/_all.sass
@@ -2,6 +2,7 @@
@import "box.sass"
@import "button.sass"
+@import "container.sass"
@import "content.sass"
@import "form.sass"
@import "icon.sass"
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/sass/elements/box.sass b/hshassets/assets/sass/lib/bulma-0.5.1/sass/elements/box.sass
similarity index 94%
rename from hshassets/assets/sass/lib/bulma-0.5.0/sass/elements/box.sass
rename to hshassets/assets/sass/lib/bulma-0.5.1/sass/elements/box.sass
index b770ae899ea4511f4a1a5d8a4d5fe323a4da32f4..df185428ad40fbfc44cab8d49df69c482aad0e1a 100755
--- a/hshassets/assets/sass/lib/bulma-0.5.0/sass/elements/box.sass
+++ b/hshassets/assets/sass/lib/bulma-0.5.1/sass/elements/box.sass
@@ -4,8 +4,8 @@ $box-radius: $radius-large !default
$box-shadow: 0 2px 3px rgba($black, 0.1), 0 0 0 1px rgba($black, 0.1) !default
$box-padding: 1.25rem !default
-$box-link-hover-shadow: 0 2px 3px rgba($black, 0.1), 0 0 0 1px $link
-$box-link-active-shadow: inset 0 1px 2px rgba($black, 0.2), 0 0 0 1px $link
+$box-link-hover-shadow: 0 2px 3px rgba($black, 0.1), 0 0 0 1px $link !default
+$box-link-active-shadow: inset 0 1px 2px rgba($black, 0.2), 0 0 0 1px $link !default
.box
+block
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/sass/elements/button.sass b/hshassets/assets/sass/lib/bulma-0.5.1/sass/elements/button.sass
similarity index 98%
rename from hshassets/assets/sass/lib/bulma-0.5.0/sass/elements/button.sass
rename to hshassets/assets/sass/lib/bulma-0.5.1/sass/elements/button.sass
index 36585aa49780af34193c2da43b2ac53728faee41..9a2ecd33cdc32478f6804331381c68502f6debc0 100755
--- a/hshassets/assets/sass/lib/bulma-0.5.0/sass/elements/button.sass
+++ b/hshassets/assets/sass/lib/bulma-0.5.1/sass/elements/button.sass
@@ -73,7 +73,7 @@ $button-shadow-inset: inset 0 1px 2px rgba($black, 0.2) !default
&:focus,
&.is-focused
border-color: $button-focus-border-color
- box-shadow: 0 0 0.5em rgba($button-focus-border-color, 0.25)
+ // box-shadow: 0 0 0.5em rgba($button-focus-border-color, 0.25)
color: $button-focus-color
&:active,
&.is-active
diff --git a/hshassets/assets/sass/lib/bulma-0.5.1/sass/elements/container.sass b/hshassets/assets/sass/lib/bulma-0.5.1/sass/elements/container.sass
new file mode 100644
index 0000000000000000000000000000000000000000..54f73ada427032c1bc84887658c928cae72ac0c7
--- /dev/null
+++ b/hshassets/assets/sass/lib/bulma-0.5.1/sass/elements/container.sass
@@ -0,0 +1,27 @@
+$container-offset: 60px !default
+
+.container
+ margin: 0 auto
+ position: relative
+ +from($desktop + $container-offset)
+ max-width: $desktop - (2 * $gap)
+ width: $desktop - (2 * $gap)
+ &.is-fluid
+ margin-left: $gap
+ margin-right: $gap
+ max-width: none
+ width: auto
+ +until($widescreen + $container-offset)
+ &.is-widescreen
+ max-width: $widescreen - (2 * $gap)
+ width: auto
+ +until($fullhd + $container-offset)
+ &.is-fullhd
+ max-width: $fullhd - (2 * $gap)
+ width: auto
+ +from($widescreen + $container-offset)
+ max-width: $widescreen - (2 * $gap)
+ width: $widescreen - (2 * $gap)
+ +from($fullhd + $container-offset)
+ max-width: $fullhd - (2 * $gap)
+ width: $fullhd - (2 * $gap)
\ No newline at end of file
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/sass/elements/content.sass b/hshassets/assets/sass/lib/bulma-0.5.1/sass/elements/content.sass
similarity index 99%
rename from hshassets/assets/sass/lib/bulma-0.5.0/sass/elements/content.sass
rename to hshassets/assets/sass/lib/bulma-0.5.1/sass/elements/content.sass
index 3d01397eebee06933c5acf8c3a5f4f51fb9adcfb..f6b182a840c77ee87dc343f283c8574c4577105c 100755
--- a/hshassets/assets/sass/lib/bulma-0.5.0/sass/elements/content.sass
+++ b/hshassets/assets/sass/lib/bulma-0.5.1/sass/elements/content.sass
@@ -86,6 +86,7 @@ $content-table-foot-cell-color: $text-strong !default
dd
margin-left: 2em
figure
+ margin: 2em
text-align: center
img
display: inline-block
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/sass/elements/form.sass b/hshassets/assets/sass/lib/bulma-0.5.1/sass/elements/form.sass
similarity index 67%
rename from hshassets/assets/sass/lib/bulma-0.5.0/sass/elements/form.sass
rename to hshassets/assets/sass/lib/bulma-0.5.1/sass/elements/form.sass
index f3eb3434e6f7d3eb97525b0a7f6723eac5a34836..6759ac5be26ce32cbfd3f3cc56b6598bccf67446 100755
--- a/hshassets/assets/sass/lib/bulma-0.5.0/sass/elements/form.sass
+++ b/hshassets/assets/sass/lib/bulma-0.5.1/sass/elements/form.sass
@@ -20,6 +20,19 @@ $input-icon-active-color: $grey !default
$input-radius: $radius !default
+$file-border-color: $border !default
+$file-radius: $radius !default
+
+$file-cta-background-color: $white-ter !default
+$file-cta-color: $grey-dark !default
+$file-cta-hover-color: $grey-darker !default
+$file-cta-active-color: $grey-darker !default
+
+$file-name-border-color: $border !default
+$file-name-border-style: solid !default
+$file-name-border-width: 1px 1px 1px 0 !default
+$file-name-max-width: 16em !default
+
$label-color: $grey-darker !default
$label-weight: $weight-bold !default
@@ -181,6 +194,169 @@ $help-size: $size-small !default
&.is-large:after
font-size: $size-large
+.file
+ +unselectable
+ align-items: stretch
+ display: flex
+ justify-content: flex-start
+ position: relative
+ // Colors
+ @each $name, $pair in $colors
+ $color: nth($pair, 1)
+ $color-invert: nth($pair, 2)
+ &.is-#{$name}
+ .file-cta
+ background-color: $color
+ border-color: transparent
+ color: $color-invert
+ &:hover,
+ &.is-hovered
+ .file-cta
+ background-color: darken($color, 2.5%)
+ border-color: transparent
+ color: $color-invert
+ &:focus,
+ &.is-focused
+ .file-cta
+ border-color: transparent
+ box-shadow: 0 0 0.5em rgba($color, 0.25)
+ color: $color-invert
+ &:active,
+ &.is-active
+ .file-cta
+ background-color: darken($color, 5%)
+ border-color: transparent
+ color: $color-invert
+ // Sizes
+ &.is-small
+ font-size: $size-small
+ &.is-medium
+ font-size: $size-medium
+ .file-icon
+ .fa
+ font-size: 21px
+ &.is-large
+ font-size: $size-large
+ .file-icon
+ .fa
+ font-size: 28px
+ // Modifiers
+ &.has-name
+ .file-cta
+ border-bottom-right-radius: 0
+ border-top-right-radius: 0
+ .file-name
+ border-bottom-left-radius: 0
+ border-top-left-radius: 0
+ &.is-centered
+ justify-content: center
+ &.is-right
+ justify-content: flex-end
+ &.is-boxed
+ .file-label
+ flex-direction: column
+ .file-cta
+ flex-direction: column
+ height: auto
+ padding: 1em 3em
+ .file-name
+ border-width: 0 1px 1px
+ .file-icon
+ height: 1.5em
+ width: 1.5em
+ .fa
+ font-size: 21px
+ &.is-small
+ .file-icon .fa
+ font-size: 14px
+ &.is-medium
+ .file-icon .fa
+ font-size: 28px
+ &.is-large
+ .file-icon .fa
+ font-size: 35px
+ &.has-name
+ .file-cta
+ border-radius: $file-radius $file-radius 0 0
+ .file-name
+ border-radius: 0 0 $file-radius $file-radius
+ border-width: 0 1px 1px
+ &.is-right
+ .file-cta
+ border-radius: 0 $file-radius $file-radius 0
+ .file-name
+ border-radius: $file-radius 0 0 $file-radius
+ border-width: 1px 0 1px 1px
+ order: -1
+ &.is-fullwidth
+ .file-label
+ width: 100%
+ .file-name
+ flex-grow: 1
+ max-width: none
+
+.file-label
+ align-items: stretch
+ display: flex
+ cursor: pointer
+ justify-content: flex-start
+ overflow: hidden
+ position: relative
+ &:hover
+ .file-cta
+ background-color: darken($file-cta-background-color, 2.5%)
+ color: $file-cta-hover-color
+ .file-name
+ border-color: darken($file-name-border-color, 2.5%)
+ &:active
+ .file-cta
+ background-color: darken($file-cta-background-color, 5%)
+ color: $file-cta-active-color
+ .file-name
+ border-color: darken($file-name-border-color, 5%)
+
+.file-input
+ height: 0.01em
+ left: 0
+ outline: none
+ position: absolute
+ top: 0
+ width: 0.01em
+
+.file-cta,
+.file-name
+ +control
+ border-color: $file-border-color
+ border-radius: $file-radius
+ font-size: 1em
+ padding-left: 1em
+ padding-right: 1em
+ white-space: nowrap
+
+.file-cta
+ background-color: $file-cta-background-color
+ color: $file-cta-color
+
+.file-name
+ border-color: $file-name-border-color
+ border-style: $file-name-border-style
+ border-width: $file-name-border-width
+ display: block
+ max-width: $file-name-max-width
+ overflow: hidden
+ text-align: left
+ text-overflow: ellipsis
+
+.file-icon
+ align-items: center
+ display: flex
+ height: 1em
+ justify-content: center
+ margin-right: 0.5em
+ width: 1em
+ .fa
+ font-size: 14px
+
.label
color: $label-color
display: block
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/sass/elements/icon.sass b/hshassets/assets/sass/lib/bulma-0.5.1/sass/elements/icon.sass
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/sass/elements/icon.sass
rename to hshassets/assets/sass/lib/bulma-0.5.1/sass/elements/icon.sass
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/sass/elements/image.sass b/hshassets/assets/sass/lib/bulma-0.5.1/sass/elements/image.sass
similarity index 93%
rename from hshassets/assets/sass/lib/bulma-0.5.0/sass/elements/image.sass
rename to hshassets/assets/sass/lib/bulma-0.5.1/sass/elements/image.sass
index cc27b444fee8ab0d55bc5c0e15296f9570274cc0..a88195b9d216452039e04acb760e7556dbade0c3 100755
--- a/hshassets/assets/sass/lib/bulma-0.5.0/sass/elements/image.sass
+++ b/hshassets/assets/sass/lib/bulma-0.5.1/sass/elements/image.sass
@@ -1,4 +1,4 @@
-$dimensions: 16 24 32 48 64 96 128
+$dimensions: 16 24 32 48 64 96 128 !default
.image
display: block
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/sass/elements/notification.sass b/hshassets/assets/sass/lib/bulma-0.5.1/sass/elements/notification.sass
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/sass/elements/notification.sass
rename to hshassets/assets/sass/lib/bulma-0.5.1/sass/elements/notification.sass
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/sass/elements/other.sass b/hshassets/assets/sass/lib/bulma-0.5.1/sass/elements/other.sass
similarity index 53%
rename from hshassets/assets/sass/lib/bulma-0.5.0/sass/elements/other.sass
rename to hshassets/assets/sass/lib/bulma-0.5.1/sass/elements/other.sass
index 93d87858db73672d26627f0c25290d42874b4049..8a6b39cba7d01bb0355bc27692aa45aa9edbb025 100755
--- a/hshassets/assets/sass/lib/bulma-0.5.0/sass/elements/other.sass
+++ b/hshassets/assets/sass/lib/bulma-0.5.1/sass/elements/other.sass
@@ -1,32 +1,6 @@
.block
+block
-.container
- margin: 0 auto
- position: relative
- +desktop
- max-width: $desktop - (2 * $gap)
- width: $desktop - (2 * $gap)
- &.is-fluid
- margin-left: $gap
- margin-right: $gap
- max-width: none
- width: auto
- +until($widescreen)
- &.is-widescreen
- max-width: $widescreen - (2 * $gap)
- width: auto
- +until($fullhd)
- &.is-fullhd
- max-width: $fullhd - (2 * $gap)
- width: auto
- +widescreen
- max-width: $widescreen - (2 * $gap)
- width: $widescreen - (2 * $gap)
- +fullhd
- max-width: $fullhd - (2 * $gap)
- width: $fullhd - (2 * $gap)
-
.delete
+delete
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/sass/elements/progress.sass b/hshassets/assets/sass/lib/bulma-0.5.1/sass/elements/progress.sass
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/sass/elements/progress.sass
rename to hshassets/assets/sass/lib/bulma-0.5.1/sass/elements/progress.sass
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/sass/elements/table.sass b/hshassets/assets/sass/lib/bulma-0.5.1/sass/elements/table.sass
similarity index 91%
rename from hshassets/assets/sass/lib/bulma-0.5.0/sass/elements/table.sass
rename to hshassets/assets/sass/lib/bulma-0.5.1/sass/elements/table.sass
index cba22f202b6ade1fcd6374aec702e27bcf47d974..3c444647657bee1586b6b0bd43cd547fd38cd856 100755
--- a/hshassets/assets/sass/lib/bulma-0.5.0/sass/elements/table.sass
+++ b/hshassets/assets/sass/lib/bulma-0.5.1/sass/elements/table.sass
@@ -6,7 +6,6 @@ $table-cell-border-width: 0 0 1px !default
$table-cell-padding: 0.5em 0.75em !default
$table-cell-heading-color: $text-strong !default
-$table-head-color: $grey !default
$table-head-cell-border-width: 0 0 2px !default
$table-head-cell-color: $text-strong !default
$table-foot-cell-border-width: 2px 0 0 !default
@@ -30,6 +29,14 @@ $table-striped-row-even-hover-background-color: $white-ter !default
border-width: $table-cell-border-width
padding: $table-cell-padding
vertical-align: top
+ // Colors
+ @each $name, $pair in $colors
+ $color: nth($pair, 1)
+ $color-invert: nth($pair, 2)
+ &.is-#{$name}
+ background-color: $color
+ border-color: $color
+ color: $color-invert
// Modifiers
&.is-narrow
white-space: nowrap
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/sass/elements/tag.sass b/hshassets/assets/sass/lib/bulma-0.5.1/sass/elements/tag.sass
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/sass/elements/tag.sass
rename to hshassets/assets/sass/lib/bulma-0.5.1/sass/elements/tag.sass
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/sass/elements/title.sass b/hshassets/assets/sass/lib/bulma-0.5.1/sass/elements/title.sass
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/sass/elements/title.sass
rename to hshassets/assets/sass/lib/bulma-0.5.1/sass/elements/title.sass
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/sass/grid/_all.sass b/hshassets/assets/sass/lib/bulma-0.5.1/sass/grid/_all.sass
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/sass/grid/_all.sass
rename to hshassets/assets/sass/lib/bulma-0.5.1/sass/grid/_all.sass
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/sass/grid/columns.sass b/hshassets/assets/sass/lib/bulma-0.5.1/sass/grid/columns.sass
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/sass/grid/columns.sass
rename to hshassets/assets/sass/lib/bulma-0.5.1/sass/grid/columns.sass
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/sass/grid/tiles.sass b/hshassets/assets/sass/lib/bulma-0.5.1/sass/grid/tiles.sass
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/sass/grid/tiles.sass
rename to hshassets/assets/sass/lib/bulma-0.5.1/sass/grid/tiles.sass
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/sass/layout/_all.sass b/hshassets/assets/sass/lib/bulma-0.5.1/sass/layout/_all.sass
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/sass/layout/_all.sass
rename to hshassets/assets/sass/lib/bulma-0.5.1/sass/layout/_all.sass
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/sass/layout/footer.sass b/hshassets/assets/sass/lib/bulma-0.5.1/sass/layout/footer.sass
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/sass/layout/footer.sass
rename to hshassets/assets/sass/lib/bulma-0.5.1/sass/layout/footer.sass
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/sass/layout/hero.sass b/hshassets/assets/sass/lib/bulma-0.5.1/sass/layout/hero.sass
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/sass/layout/hero.sass
rename to hshassets/assets/sass/lib/bulma-0.5.1/sass/layout/hero.sass
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/sass/layout/section.sass b/hshassets/assets/sass/lib/bulma-0.5.1/sass/layout/section.sass
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/sass/layout/section.sass
rename to hshassets/assets/sass/lib/bulma-0.5.1/sass/layout/section.sass
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/sass/utilities/_all.sass b/hshassets/assets/sass/lib/bulma-0.5.1/sass/utilities/_all.sass
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/sass/utilities/_all.sass
rename to hshassets/assets/sass/lib/bulma-0.5.1/sass/utilities/_all.sass
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/sass/utilities/animations.sass b/hshassets/assets/sass/lib/bulma-0.5.1/sass/utilities/animations.sass
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/sass/utilities/animations.sass
rename to hshassets/assets/sass/lib/bulma-0.5.1/sass/utilities/animations.sass
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/sass/utilities/controls.sass b/hshassets/assets/sass/lib/bulma-0.5.1/sass/utilities/controls.sass
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/sass/utilities/controls.sass
rename to hshassets/assets/sass/lib/bulma-0.5.1/sass/utilities/controls.sass
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/sass/utilities/derived-variables.sass b/hshassets/assets/sass/lib/bulma-0.5.1/sass/utilities/derived-variables.sass
similarity index 97%
rename from hshassets/assets/sass/lib/bulma-0.5.0/sass/utilities/derived-variables.sass
rename to hshassets/assets/sass/lib/bulma-0.5.1/sass/utilities/derived-variables.sass
index 50729ebe053d85f65b79f2df7ce537af0861d7cb..5730c1fc5e7fae4a8d88dd97381736e9b57e0f10 100755
--- a/hshassets/assets/sass/lib/bulma-0.5.0/sass/utilities/derived-variables.sass
+++ b/hshassets/assets/sass/lib/bulma-0.5.1/sass/utilities/derived-variables.sass
@@ -78,4 +78,4 @@ $size-large: $size-4 !default
$colors: ("white": ($white, $black), "black": ($black, $white), "light": ($light, $light-invert), "dark": ($dark, $dark-invert), "primary": ($primary, $primary-invert), "info": ($info, $info-invert), "success": ($success, $success-invert), "warning": ($warning, $warning-invert), "danger": ($danger, $danger-invert)) !default
$shades: ("black-bis": $black-bis, "black-ter": $black-ter, "grey-darker": $grey-darker, "grey-dark": $grey-dark, "grey": $grey, "grey-light": $grey-light, "grey-lighter": $grey-lighter, "white-ter": $white-ter, "white-bis": $white-bis) !default
-$sizes: $size-1 $size-2 $size-3 $size-4 $size-5 $size-6 !default
+$sizes: $size-1 $size-2 $size-3 $size-4 $size-5 $size-6 $size-7 !default
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/sass/utilities/functions.sass b/hshassets/assets/sass/lib/bulma-0.5.1/sass/utilities/functions.sass
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/sass/utilities/functions.sass
rename to hshassets/assets/sass/lib/bulma-0.5.1/sass/utilities/functions.sass
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/sass/utilities/initial-variables.sass b/hshassets/assets/sass/lib/bulma-0.5.1/sass/utilities/initial-variables.sass
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/sass/utilities/initial-variables.sass
rename to hshassets/assets/sass/lib/bulma-0.5.1/sass/utilities/initial-variables.sass
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/sass/utilities/mixins.sass b/hshassets/assets/sass/lib/bulma-0.5.1/sass/utilities/mixins.sass
similarity index 100%
rename from hshassets/assets/sass/lib/bulma-0.5.0/sass/utilities/mixins.sass
rename to hshassets/assets/sass/lib/bulma-0.5.1/sass/utilities/mixins.sass
diff --git a/hshassets/assets/sass/lib/bulma-0.5.0/sass/utilities/variables.sass b/hshassets/assets/sass/lib/bulma-0.5.1/sass/utilities/variables.sass
similarity index 98%
rename from hshassets/assets/sass/lib/bulma-0.5.0/sass/utilities/variables.sass
rename to hshassets/assets/sass/lib/bulma-0.5.1/sass/utilities/variables.sass
index 0a9b9cb86dfa22ea8bf754e83749af914bbd483f..5051fbfd8e64985871569ed471f2d37831312361 100755
--- a/hshassets/assets/sass/lib/bulma-0.5.0/sass/utilities/variables.sass
+++ b/hshassets/assets/sass/lib/bulma-0.5.1/sass/utilities/variables.sass
@@ -147,4 +147,4 @@ $size-large: $size-4 !default
$colors: ("white": ($white, $black), "black": ($black, $white), "light": ($light, $light-invert), "dark": ($dark, $dark-invert), "primary": ($primary, $primary-invert), "info": ($info, $info-invert), "success": ($success, $success-invert), "warning": ($warning, $warning-invert), "danger": ($danger, $danger-invert)) !default
-$sizes: $size-1 $size-2 $size-3 $size-4 $size-5 $size-6 !default
+$sizes: $size-1 $size-2 $size-3 $size-4 $size-5 $size-6 $size-7 !default